.zoom2 {
  animation-name: zoomInOut;
  animation-duration: 1.2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.zoom-in {
  animation-name: zoomIn;
  animation-duration: 1.2s;
  animation-timing-function: ease-in-out;
}

.zoom-out-drop {
  animation-name: zoomOutDrop;
  animation-duration: .2s;
  animation-timing-function: ease-in-out;
}

.zoom-out-drop.delay-1 {
  animation-delay: .5s;
}

.zoom-out-drop.delay-2 {
  animation-delay: 1s;
}

@keyframes zoomInOut {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.1);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes zoomIn {
  0% {
    transform: scale(.8);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes zoomOutDrop {
  0% {
    opacity: 0;
    transform: scale(1.8);
  }

  70% {
    transform: scale(1);
  }

  95% {
    transform: scale(1.02);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.floating-to-l {
  animation-name: floatingToL;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

.floating-to-r {
  animation-name: floatingToR;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

.floating {
  animation-name: floating;
  animation-duration: 4s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

.floating-2 {
  animation-name: floating;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

.floating-3 {
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

@keyframes floatingToL {
  0% {
    transform: translate(0, 0)
  }

  50% {
    transform: translate(15px, -15px)
  }

  100% {
    transform: translate(0, 0)
  }
}

@keyframes floatingToR {
  0% {
    transform: translate(0, 0)
  }

  50% {
    transform: translate(-15px, 15px)
  }

  100% {
    transform: translate(0, 0)
  }
}

@keyframes floating {
  0% {
    transform: translate(0, 0)
  }

  50% {
    transform: translate(0, 5px)
  }

  100% {
    transform: translate(0, 0)
  }
}

.animate__animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }

  10%,
  20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
    transform: scale3d(.9, .9, .9) rotate(-3deg)
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }

  10%,
  20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate(-3deg);
    transform: scale3d(.9, .9, .9) rotate(-3deg)
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg)
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg)
  }

  to {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
  }
}

.animate__tada {
  -webkit-animation-name: tada;
  animation-name: tada
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.animate__fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}