#christmas-tree {
  z-index: 99;
  width: auto;
  height: auto;
  overflow: hidden;
  position: relative;
}
#person-at-tree {
  position: absolute;
  z-index: 100;
  top: 15%;
  right: 10%;
  width: 35%;
  height: auto;
  -webkit-animation: slide-bl 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation: slide-bl 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

@keyframes hue {
  from {
    filter: hue-rotate(0);
  }

  to {
    filter: hue-rotate(-360deg);
  }
}

.rainbow-text {
  display: inline-block;
  position: relative;
  font-weight: 500;
  font-size: 40px;
  color: transparent;
  animation: hue 1.5s linear infinite;
  background-image: linear-gradient(
    to right bottom,
    rgb(255, 0, 0),
    rgb(255, 128, 0),
    rgb(255, 255, 0),
    rgb(0, 255, 0),
    rgb(0, 255, 128),
    rgb(0, 255, 255),
    rgb(0, 128, 255),
    rgb(0, 0, 255),
    rgb(128, 0, 255),
    rgb(255, 0, 255),
    rgb(255, 0, 128)
  );
  -webkit-background-clip: text;
}

/* ----------------------------------------------
 * Generated by Animista on 2021-12-20 19:27:53
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-bl
 * ----------------------------------------
 */
@-webkit-keyframes slide-bl {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
  }
  100% {
    -webkit-transform: translateY(10%) translateX(-10%);
    transform: translateY(10%) translateX(-10%);
  }
}
@keyframes slide-bl {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
  }
  100% {
    -webkit-transform: translateY(10%) translateX(-10%);
    transform: translateY(10%) translateX(-10%);
  }
}