/*
PAGE SCROLL ANIMATION STYLES
Steve @ Build Your Firm
3/7/2018
*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PAGE SCROLL ANIMATIONS
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.animate-left,
.animate-right,
.animate-down,
.animate-down-left,
.animate-down-right,
.animate-up,
.animate-up-left,
.animate-up-right {
  display: inline-block;
  opacity: 0;
  position: relative;
  z-index: 50;
  -webkit-transition: all .75s ease;
  -o-transition: all .75s ease;
  -moz-transition: all .75s ease;
  transition: all .75s ease;
}

.animate-left {
  left: 75px;
  top: 0;
}

.animate-left.animated {
  left: 0;
  top: 0;
}

.animate-right {
  right: 75px;
  top: 0;
}

.animate-right.animated {
  right: 0;
  top: 0;
}

.animate-up {
  top: 75px;
}

.animate-up.animated {
  top: 0;
}

.animate-down {
  top: -75px;
}

.animate-down.animated {
  top: 0;
}

.animate-down-left {
  left: 75px;
  top: -75px;
}

.animate-down-left.animated {
  left: 0;
  top: 0;
}

.animate-down-right {
  right: 75px;
  top: -75px;
}

.animate-down-right.animated {
  right: 0;
  top: 0;
}

.animate-up-left {
  left: 75px;
  top: 75px;
}

.animate-up-left.animated {
  left: 0;
  top: 0;
}

.animate-up-right {
  right: 75px;
  top: 75px;
}

.animate-up-right.animated {
  right: 0;
  top: 0;
}

.animated {
  opacity: 1;
  z-index: 50;
}

.animated,
.animate-1 {
  -webkit-transition-delay: .2s;
  -moz-transition-delay: .2s;
  -o-transition-delay: .2s;
  transition-delay: .2s;
}

.animate-2 {
  -webkit-transition-delay: .4s;
  -moz-transition-delay: .4s;
  -o-transition-delay: .4s;
  transition-delay: .4s;
}

.animate-3 {
  -webkit-transition-delay: .6s;
  -moz-transition-delay: .6s;
  -o-transition-delay: .6s;
  transition-delay: .6s;
}

.animate-4 {
  -webkit-transition-delay: .8s;
  -moz-transition-delay: .8s;
  -o-transition-delay: .8s;
  transition-delay: .8s;
}

.animate-5 {
  -webkit-transition-delay: 1s;
  -moz-transition-delay: 1s;
  -o-transition-delay: 1s;
  transition-delay: 1s;
}

.animate-6 {
  -webkit-transition-delay: 1.2s;
  -moz-transition-delay: 1.2s;
  -o-transition-delay: 1.2s;
  transition-delay: 1.2s;
}

.animate-7 {
  -webkit-transition-delay: 1.4s;
  -moz-transition-delay: 1.4s;
  -o-transition-delay: 1.4s;
  transition-delay: 1.4s;
}

.animate-8 {
  -webkit-transition-delay: 1.6s;
  -moz-transition-delay: 1.6s;
  -o-transition-delay: 1.6s;
  transition-delay: 1.6s;
}


@media (max-width: 767px) {
  .animated,
  .animate-1, .animate-2, .animate-3, .animate-4,
  .animate-5, .animate-6, .animate-7, .animate-8 {
    -webkit-transition-delay: .2s;
    -moz-transition-delay: .2s;
    -o-transition-delay: .2s;
    transition-delay: .2s;
  }
}
