.animateIn {
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  animation-name: fadeIn;
}
/* WEBKIT KEYFRAMES */
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes left {
  from {
    -webkit-transform: translatex(-50px);
    -moz-transform: translatex(-50px);
    transform: translatex(-50px);
  }
  to {
    -webkit-transform: translatex(0);
    -moz-transform: translatex(0);
    transform: translatex(0);
  }
}
@-webkit-keyframes right {
  from {
    -webkit-transform: translatex(30px);
    -moz-transform: translatex(30px);
    transform: translatex(30px);
  }
  to {
    -webkit-transform: translatex(0);
    -moz-transform: translatex(0);
    transform: translatex(0);
  }
}
@-webkit-keyframes top {
  from {
    -webkit-transform: translatey(-50px);
    -moz-transform: translatey(-50px);
    transform: translatey(-50px);
  }
  to {
    -webkit-transform: translatey(0);
    -moz-transform: translatey(0);
    transform: translatey(0);
  }
}
@-webkit-keyframes bottom {
  from {
    -webkit-transform: translatey(50px);
    -moz-transform: translatey(50px);
    transform: translatey(50px);
  }
  to {
    -webkit-transform: translatey(0);
    -moz-transform: translatey(0);
    transform: translatey(0);
  }
}
@-webkit-keyframes top-left {
  from {
    -webkit-transform: translate(-50px, -50px);
    -moz-transform: translate(-50px, -50px);
    transform: translate(-50px, -50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-webkit-keyframes top-right {
  from {
    -webkit-transform: translate(50px, -50px);
    -moz-transform: translate(50px, -50px);
    transform: translate(50px, -50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-webkit-keyframes bottom-right {
  from {
    -webkit-transform: translate(50px, 50px);
    -moz-transform: translate(50px, 50px);
    transform: translate(50px, 50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-webkit-keyframes bottom-left {
  from {
    -webkit-transform: translate(-50px, 50px);
    -moz-transform: translate(-50px, 50px);
    transform: translate(-50px, 50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
/* MOZ KEYFRAMES */
@-moz-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes left {
  from {
    -webkit-transform: translatex(-50px);
    -moz-transform: translatex(-50px);
    transform: translatex(-50px);
  }
  to {
    -webkit-transform: translatex(0);
    -moz-transform: translatex(0);
    transform: translatex(0);
  }
}
@-moz-keyframes right {
  from {
    -webkit-transform: translatex(50px);
    -moz-transform: translatex(50px);
    transform: translatex(50px);
  }
  to {
    -webkit-transform: translatex(0);
    -moz-transform: translatex(0);
    transform: translatex(0);
  }
}
@-moz-keyframes top {
  from {
    -webkit-transform: translatey(-50px);
    -moz-transform: translatey(-50px);
    transform: translatey(-50px);
  }
  to {
    -webkit-transform: translatey(0);
    -moz-transform: translatey(0);
    transform: translatey(0);
  }
}
@-moz-keyframes bottom {
  from {
    -webkit-transform: translatey(50px);
    -moz-transform: translatey(50px);
    transform: translatey(50px);
  }
  to {
    -webkit-transform: translatey(0);
    -moz-transform: translatey(0);
    transform: translatey(0);
  }
}
@-moz-keyframes top-left {
  from {
    -webkit-transform: translate(-50px, -50px);
    -moz-transform: translate(-50px, -50px);
    transform: translate(-50px, -50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-moz-keyframes top-right {
  from {
    -webkit-transform: translate(50px, -50px);
    -moz-transform: translate(50px, -50px);
    transform: translate(50px, -50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-moz-keyframes bottom-right {
  from {
    -webkit-transform: translate(50px, 50px);
    -moz-transform: translate(50px, 50px);
    transform: translate(50px, 50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-moz-keyframes bottom-left {
  from {
    -webkit-transform: translate(-50px, 50px);
    -moz-transform: translate(-50px, 50px);
    transform: translate(-50px, 50px);
  }
  to {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
/* DURATION */
.animateIn.fast {
  -webkit-animation-duration: 0.35714285714285715s;
  -moz-animation-duration: 0.35714285714285715s;
  animation-duration: 0.35714285714285715s;
}
.animateIn.fastest {
  -webkit-animation-duration: 0.2232142857142857s;
  -moz-animation-duration: 0.2232142857142857s;
  animation-duration: 0.2232142857142857s;
}
.animateIn.slow {
  -webkit-animation-duration: 0.75s;
  -moz-animation-duration: 0.75s;
  animation-duration: 0.75s;
}
.animateIn.slowest {
  -webkit-animation-duration: 1.125s;
  -moz-animation-duration: 1.125s;
  animation-duration: 1.125s;
}
/* DELAY */
.animateIn.delay {
  -webkit-animation-delay: 0.5s;
  -moz-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
.animateIn.long-delay {
  -webkit-animation-delay: 1.125s;
  -moz-animation-delay: 1.125s;
  animation-delay: 1.125s;
}
.animateIn.short-delay {
  -webkit-animation-delay: 0.2232142857142857s;
  -moz-animation-delay: 0.2232142857142857s;
  animation-delay: 0.2232142857142857s;
}
/* TRANSFORMS */
.animateIn.left {
  -webkit-animation-name: fadeIn, left;
  -moz-animation-name: fadeIn, left;
  animation-name: fadeIn, left;
}
.animateIn.right {
  -webkit-animation-name: fadeIn, right;
  -moz-animation-name: fadeIn, right;
  animation-name: fadeIn, right;
}
.animateIn.top {
  -webkit-animation-name: fadeIn, top;
  -moz-animation-name: fadeIn, top;
  animation-name: fadeIn, top;
}
.animateIn.bottom {
  -webkit-animation-name: fadeIn, bottom;
  -moz-animation-name: fadeIn, bottom;
  animation-name: fadeIn, bottom;
}
.animateIn.left-top, .animateIn.top-left {
  -webkit-animation-name: fadeIn, top-left;
  -moz-animation-name: fadeIn, top-left;
  animation-name: fadeIn, top-left;
}
.animateIn.right-top, .animateIn.top-right {
  -webkit-animation-name: fadeIn, top-right;
  -moz-animation-name: fadeIn, top-right;
  animation-name: fadeIn, top-right;
}
.animateIn.left-bottom, .animateIn.bottom-left {
  -webkit-animation-name: fadeIn, bottom-left;
  -moz-animation-name: fadeIn, bottom-left;
  animation-name: fadeIn, bottom-left;
}
.animateIn.right-bottom, .animateIn.bottom-right {
  -webkit-animation-name: fadeIn, bottom-right;
  -moz-animation-name: fadeIn, bottom-right;
  animation-name: fadeIn, bottom-right;
}