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


@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 30px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
  }
}
@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
    -webkit-transform: none;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 30px, 0);
  }
}
@-webkit-keyframes fadeInUp__full {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes fadeOutDown {
  from {
  	opacity: 1;
    transform: none;
    
  }

  to {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
  }
}
@keyframes fadeInUp__full {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}