/******************************

ANIMATIONS

// auto
wow fadeIn animated
wow bounceInLeft

// manual
animation-element slide-left
animation-element slide-right
animation-element bounce-up
animation-element multi-step-left
animation-element multi-step-right

*******************************/

.bounce-up {
  opacity: 0;
  -moz-transition: all 2000ms ease-out;
  -webkit-transition: all 2000ms ease-out;
  -o-transition: all 2000ms ease-out;
  transition: all 2000ms ease-out;
  -moz-transform: translate3d(0px, 200px, 0px);
  -webkit-transform: translate3d(0px, 200px, 0px);
  -o-transform: translate(0px, 200px);
  -ms-transform: translate(0px, 200px);
  transform: translate3d(0px, 200, 0px);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

.bounce-up.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

.animation-element.slide-left {
 opacity: 0;
 -moz-transition: all 500ms linear;
 -webkit-transition: all 500ms linear;
 -o-transition: all 500ms linear;
 transition: all 500ms linear;
 -moz-transform: translate3d(-100px, 0px, 0px);
 -webkit-transform: translate3d(-100px, 0px, 0px);
 -o-transform: translate(-100px, 0px);
 -ms-transform: translate(-100px, 0px);
 transform: translate3d(-100px, 0px, 0px);
}
.animation-element.slide-left.in-view {
 opacity: 1;
 -moz-transform: translate3d(0px, 0px, 0px);
 -webkit-transform: translate3d(0px, 0px, 0px);
 -o-transform: translate(0px, 0px);
 -ms-transform: translate(0px, 0px);
 transform: translate3d(0px, 0px, 0px);
}

@-moz-keyframes left_animation {
  0% {
    opacity: 0;
    -moz-transform: rotate(180deg) translate3d(100%, 100%, 0);
  }
  75% {
    opacity: 0.8;
    -moz-transform: rotate(-40deg);
  }
  100% {
    opacity: 1;
    -moz-transform: rotate(0deg) translate3d(0%, 0%, 0);
  }
}

@-webkit-keyframes left_animation {
  0% {
    opacity: 0;
    -webkit-transform: rotate(180deg) translate3d(100%, 100%, 0);
  }
  75% {
    opacity: 0.8;
    -webkit-transform: rotate(-40deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translate3d(0%, 0%, 0);
  }
}

@keyframes left_animation {
  0% {
    opacity: 0;
    transform: rotate(180deg) translate3d(100%, 100%, 0);
  }
  75% {
    opacity: 0.8;
    transform: rotate(-40deg);
  }
  100% {
    opacity: 1;
    transform: rotate(0deg) translate3d(0%, 0%, 0);
  }
}

@-moz-keyframes right_animation {
  0% {
    opacity: 0;
    -moz-transform: rotate(180deg) translate3d(-100%, -100%, 0);
  }
  75% {
    opacity: 0.8;
    -moz-transform: rotate(40deg);
  }
  100% {
    opacity: 1;
    -moz-transform: rotate(0deg) translate3d(0%, 0%, 0);
  }
}

@-webkit-keyframes right_animation {
  0% {
    opacity: 0;
    -webkit-transform: rotate(180deg) translate3d(-100%, 100%, 0);
  }
  75% {
    opacity: 0.8;
    -webkit-transform: rotate(40deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translate3d(0%, 0%, 0);
  }
}

@keyframes right_animation {
  0% {
    opacity: 0;
    transform: rotate(180deg) translate3d(-100%, -100%, 0);
  }
  75% {
    opacity: 0.8;
    transform: rotate(40deg);
  }
  100% {
    opacity: 1;
    transform: rotate(0deg) translate3d(0%, 0%, 0);
  }
}

.multi-step-left.in-view {
  -moz-animation: left_animation 1300ms ease-in both;
  -webkit-animation: left_animation 1300ms ease-in both;
  animation: left_animation 1300ms ease-in both;
}

.multi-step-right.in-view {
  -moz-animation: right_animation 1300ms linear both;
  -webkit-animation: right_animation 1300ms linear both;
  animation: right_animation 1300ms linear both;
}

.fly {
transform: translateY(0px);
animation: float 12s ease-in-out infinite;
}
@keyframes float {
    0% {
        transform: translatey(0px);
    }
    50% {
        transform: translatey(-20px);
    }
    100% {
        transform: translatey(0px);
    }
}