body.will-animate *[class*="to-animate-"] {
    opacity: 0;
}

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

.animated.delay-0-1 { animation-delay: 0.1s; }
.animated.delay-0-2 { animation-delay: 0.2s; }
.animated.delay-0-3 { animation-delay: 0.3s; }
.animated.delay-0-4 { animation-delay: 0.4s; }
.animated.delay-0-5 { animation-delay: 0.5s; }
.animated.delay-0-6 { animation-delay: 0.6s; }
.animated.delay-0-7 { animation-delay: 0.7s; }
.animated.delay-0-8 { animation-delay: 0.8s; }
.animated.delay-0-9 { animation-delay: 0.9s; }
.animated.delay-1 { animation-delay: 1s; }
.animated.delay-1-1 { animation-delay: 1.1s; }
.animated.delay-1-2 { animation-delay: 1.2s; }
.animated.delay-1-3 { animation-delay: 1.3s; }
.animated.delay-1-4 { animation-delay: 1.4s; }
.animated.delay-1-5 { animation-delay: 1.5s; }
.animated.delay-1-6 { animation-delay: 1.6s; }
.animated.delay-1-7 { animation-delay: 1.7s; }
.animated.delay-1-8 { animation-delay: 1.8s; }
.animated.delay-1-9 { animation-delay: 1.9s; }
.animated.delay-2 { animation-delay: 2s; }
.animated.delay-2-1 { animation-delay: 2.1s; }
.animated.delay-2-2 { animation-delay: 2.2s; }
.animated.delay-2-3 { animation-delay: 2.3s; }
.animated.delay-2-4 { animation-delay: 2.4s; }
.animated.delay-2-5 { animation-delay: 2.5s; }
.animated.delay-2-6 { animation-delay: 2.6s; }
.animated.delay-2-7 { animation-delay: 2.7s; }
.animated.delay-2-8 { animation-delay: 2.8s; }
.animated.delay-2-9 { animation-delay: 2.9s; }
.animated.delay-3 { animation-delay: 3s; }

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.fadeIn { animation-name: fadeIn; }


@keyframes fadeInUp {
  from {
    transform: translate3d(0, 100%, 0);
    opacity: 0;
  }

  to {
    transform: auto;
    opacity: 1;
  }
}
.fadeInUp { animation-name: fadeInUp; }

@keyframes fadeInDown {
  from {
    transform: translate3d(0, -100%, 0);
    opacity: 0;
  }

  to {
    transform: auto;
    opacity: 1;
  }
}
.fadeInDown { animation-name: fadeInDown; }

@keyframes fadeInLeft {
  from {
    transform: translate3d(-100%, 0, 0);
    opacity: 0;
  }

  to {
    transform: auto;
    opacity: 1;
  }
}
.fadeInLeft { animation-name: fadeInLeft; }

@keyframes fadeInRight {
  from {
    transform: translate3d(100%, 0, 0);
    opacity: 0;
  }

  to {
    transform: auto;
    opacity: 1;
  }
}
.fadeInRight { animation-name: fadeInRight; }