/* header-animetion  */
@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

/* dance animetion  */
@keyframes dance {
  0% {
    transform: translate3d(0, 0, 0);
  }
  50% {
    transform: translate3d(25px, -25px, 0);
  }

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

/* Sliding animations ! */
@keyframes slide--enter-top {
  0% {
    transform: translate3d(0, -100%, 0);
  }
  100% {
    transform: none;
  }
}
@keyframes slide--enter-right {
  0% {
    transform: translate3d(100%, 0, 0);
  }
  100% {
    transform: none;
  }
}
@keyframes slide--enter-bottom {
  0% {
    transform: translate3d(0, 100%, 0);
  }
  100% {
    transform: none;
  }
}
@keyframes slide--enter-left {
  0% {
    transform: translate3d(-100%, 0, 0);
  }
  100% {
    transform: none;
  }
}
@keyframes slide--leave-top {
  0% {
    transform: none;
  }
  100% {
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes slide--leave-right {
  0% {
    transform: none;
  }
  100% {
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes slide--leave-bottom {
  0% {
    transform: none;
  }
  100% {
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes slide--leave-left {
  0% {
    transform: none;
  }
  100% {
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes footer-ani {
  0% {
    transform: translatey(0px);
  }
  20% {
    transform: translateX(-50px);
  }
  50% {
    transform: translatey(-40px);
  }
  100% {
    transform: translatey(0px);
  }
}