/* Keyframes */

@keyframes fadeIn {
  0% {
    opacity: 0;}
  100% {
    opacity: 1;}
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 100%, 0);}
  100% {
    opacity: 1;
    transform: none;}
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translate3d(0, -30%, 0);}
  100% {
    opacity: 1;
    transform: none;}
}

/* CSS Page Transitions */

  #header-wrap {
 	animation-duration: 2s;
    transition-timing-function: ease-in;
    animation-fill-mode: both;}
  #main, #hero-after {
    animation-duration: 0.9s;
    transition-timing-function: ease-in;
    animation-fill-mode: both;}
  #homepage #main, #homepage #hero-after {
	  animation-delay: 0.9s;
	  -webkit-animation-delay: 0.9s;}
  .fadein {
    animation-name: fadeIn;}
  .fadeinup {
	  animation-name: fadeInUp;}
  .fadeindown {
    animation-name: fadeInDown;}