/* ==========================================================================
   Animations
   ========================================================================== */

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeInToRight {
  0% {
    opacity: 0;
    transform: translate3d(-252px, 0, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rotate-360 {
  0% {
    transform: rotate(360deg);
  }
}

@keyframes rotate-360-inverse {
  100% {
    transform: rotate(-360deg);
  }
}

@keyframes slideInLeft {
  0% {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  100% {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideOutLeft {
  0% {
    transform: translate3d(0, 0, 0);
  }

  100% {
    transform: translate3d(-100%, 0, 0);
    visibility: hidden;
  }
}

@keyframes slideInBottom {
  0% {
    transform: translate3d(0, 300%, 0);
    visibility: visible;
  }

  100% {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideOutBottom {
  0% {
    transform: translate3d(0, 0, 0);
  }

  100% {
    transform: translate3d(0, 300%, 0);
    visibility: hidden;
  }
}

@keyframes slideInDown {
  0% {
    transform: translate3d(0, -300%, 0);
    visibility: visible;
  }

  100% {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideOutUp {
  0% {
    transform: translate3d(0, 0, 0);
  }

  100% {
    transform: translate3d(0, -300%, 0);
    visibility: hidden;
  }
}