.wa {
  display: inline-flex;
  flex-wrap: wrap;
}
.wa > span {
  animation: wave 2s ease-in-out infinite both, rainbow 2s ease-in-out infinite both;
  text-shadow: #000 0 1px 0.1em;
}

.ho {
  display: inline-flex;
  flex-wrap: wrap;
}
.ho > span {
  animation: hopping 3s cubic-bezier(0.215, 0.61, 0.355, 1) infinite both;
}

.shake {
  display: inline-flex;
  flex-wrap: wrap;
}
.shake > span {
  animation: shake 0.6s step-end infinite both;
}

.ra {
  display: inline-flex;
  flex-wrap: wrap;
  text-shadow: rgba(0, 0, 0, 0.6666666667) 2px 2px 0;
}
.ra > span {
  animation: rainbow 3s linear infinite both;
}

.appear {
  animation: appear-to-bottom 2s cubic-bezier(0.215, 0.61, 0.355, 1) 1 both;
}

@keyframes appear-to-bottom {
  from {
    opacity: 0;
    transform: translateY(0.5em);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes wave {
  0% {
    transform: translateY(-0.1rem);
  }
  50% {
    transform: translateY(0.1rem);
  }
  100% {
    transform: translateY(-0.1rem);
  }
}
@keyframes rainbow {
  0% {
    color: hsl(0, 55%, 72%);
  }
  20% {
    color: hsl(60, 55%, 72%);
  }
  40% {
    color: hsl(120, 55%, 72%);
  }
  60% {
    color: hsl(180, 55%, 72%);
  }
  80% {
    color: hsl(240, 55%, 72%);
  }
  100% {
    color: hsl(300, 55%, 72%);
  }
}
@keyframes hopping {
  10% {
    transform: translateY(-0.2em);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes shake {
  0% {
    transform: translate(0px, 0px);
  }
  20% {
    transform: translate(1px, 0px);
  }
  40% {
    transform: translate(1px, -1px);
  }
  50% {
    transform: translate(2px, -1px);
  }
  60% {
    transform: translate(-1px, -1px);
  }
  80% {
    transform: translate(1px, 0px);
  }
  100% {
    transform: translate(0px, 1px);
  }
}/*# sourceMappingURL=anim-style.css.map */