Elements - Ones

fade


<div class="bg-dark padding-30 text-center" data-sal="fade" data-sal-delay="50">
  <p>fade</p>
</div>

slide-up


<div class="bg-dark padding-30 text-center" data-sal="slide-up" data-sal-delay="50">
  <p>slide-up</p>
</div>

slide-down


<div class="bg-dark padding-30 text-center" data-sal="slide-down" data-sal-delay="50">
  <p>slide-down</p>
</div>

slide-left


<div class="bg-dark padding-30 text-center" data-sal="slide-left" data-sal-delay="50">
  <p>slide-left</p>
</div>

slide-right


<div class="bg-dark padding-30 text-center" data-sal="slide-right" data-sal-delay="50">
  <p>slide-right</p>
</div>

zoom-in


<div class="bg-dark padding-30 text-center" data-sal="zoom-in" data-sal-delay="50">
  <p>zoom-in</p>
</div>

zoom-out


<div class="bg-dark padding-30 text-center" data-sal="zoom-out" data-sal-delay="50">
  <p>zoom-out</p>
</div>

flip-up


<div class="bg-dark padding-30 text-center" data-sal="flip-up" data-sal-delay="50">
  <p>flip-up</p>
</div>

flip-down


<div class="bg-dark padding-30 text-center" data-sal="flip-down" data-sal-delay="50">
  <p>flip-down</p>
</div>

flip-left


<div class="bg-dark padding-30 text-center" data-sal="flip-left" data-sal-delay="50">
  <p>flip-left</p>
</div>

flip-right


<div class="bg-dark padding-30 text-center" data-sal="flip-right" data-sal-delay="50">
  <p>flip-right</p>
</div>

Scroll Animations