/* ==========================================================================
   TABLE OF CONTENTS
   ==========================================================================
   @fade-in
   @fade
   @fade-right
   @fade-left
   @card-fade
   @swipe-down

   ==========================================================================
*/

/*
* @fade-in
*/

.fade-in {
  opacity: 0;
  top: 100px;
  transition: 0.6s opacity ease-in-out 0.2s, 0.6s top ease-in-out 0.2s;
  position: relative;
}

.fade-in.in {
  opacity: 1;
  top: 0;
}

.fade-in.count-1 {
  transition: 0.6s opacity ease-in-out 0.4s, 0.6s top ease-in-out 0.4s;
}

.fade-in.count-2 {
  transition: 0.6s opacity ease-in-out 0.6s, 0.6s top ease-in-out 0.6s;
}

.fade-in.count-3 {
  transition: 0.6s opacity ease-in-out 0.8s, 0.6s top ease-in-out 0.8s;
}

.fade-in.count-4 {
  transition: 0.6s opacity ease-in-out 1s, 0.6s top ease-in-out 1s;
}

.fade-in.count-5 {
  transition: 0.6s opacity ease-in-out 1.2s, 0.6s top ease-in-out 1.2s;
}

.fade-in.count-6 {
  transition: 0.6s opacity ease-in-out 1.4s, 0.6s top ease-in-out 1.4s;
}

.fade-in.count-7 {
  transition: 0.6s opacity ease-in-out 1.6s, 0.6s top ease-in-out 1.6s;
}

.fade-in.count-8 {
  transition: 0.6s opacity ease-in-out 1.8s, 0.6s top ease-in-out 1.8s;
}

.fade-in.count-9 {
  transition: 0.6s opacity ease-in-out 2s, 0.6s top ease-in-out 2s;
}

.fade-in.count-10 {
  transition: 0.6s opacity ease-in-out 2.2s, 0.6s top ease-in-out 2.2s;
}

.fade-in.count-11 {
  transition: 0.6s opacity ease-in-out 2.4s, 0.6s top ease-in-out 2.4s;
}

.fade-in.count-12 {
  transition: 0.6s opacity ease-in-out 2.6s, 0.6s top ease-in-out 2.6s;
}

.fade-in.count-13 {
  transition: 0.6s opacity ease-in-out 2.8s, 0.6s top ease-in-out 2.8s;
}

.fade-in.count-14 {
  transition: 0.6s opacity ease-in-out 3s, 0.6s top ease-in-out 3s;
}

/*
* @fade
*/

.fade {
  opacity: 0;
  transition: 0.6s opacity ease-in-out 0.2s, 0.6s top ease-in-out 0.2s;
}

.fade.in {
  opacity: 1;
}

.fade.count-1 {
  transition: 0.6s opacity ease-in-out 0.4s;
}

.fade.count-2 {
  transition: 0.6s opacity ease-in-out 0.6s;
}

.fade.count-3 {
  transition: 0.6s opacity ease-in-out 0.8s;
}

.fade.count-4 {
  transition: 0.6s opacity ease-in-out 1s;
}

.fade.count-5 {
  transition: 0.6s opacity ease-in-out 1.2s;
}

.fade.count-6 {
  transition: 0.6s opacity ease-in-out 1.4s;
}

.fade.count-7 {
  transition: 0.6s opacity ease-in-out 1.6s;
}

.fade.count-8 {
  transition: 0.6s opacity ease-in-out 1.8s;
}

.fade.count-9 {
  transition: 0.6s opacity ease-in-out 2s;
}

.fade.count-10 {
  transition: 0.6s opacity ease-in-out 2.2s;
}

.fade.count-11 {
  transition: 0.6s opacity ease-in-out 2.4s;
}

.fade.count-12 {
  transition: 0.6s opacity ease-in-out 2.6s;
}

.fade.count-13 {
  transition: 0.6s opacity ease-in-out 2.8s;
}

.fade.count-14 {
  transition: 0.6s opacity ease-in-out 3s;
}

/*
* @fade-right
*/

.fade-right {
  opacity: 0;
  right: 100px;
  transition: 0.6s opacity ease-in-out 0.2s, 0.6s right ease-in-out 0.2s;
  position: relative;
}

.fade-right.in {
  opacity: 1;
  right: 0;
}

.fade-right.count-1 {
  transition: 0.6s opacity ease-in-out 0.4s, 0.6s right ease-in-out 0.4s;
}

.fade-right.count-2 {
  transition: 0.6s opacity ease-in-out 0.6s, 0.6s right ease-in-out 0.6s;
}

.fade-right.count-3 {
  transition: 0.6s opacity ease-in-out 0.8s, 0.6s right ease-in-out 0.8s;
}

.fade-right.count-4 {
  transition: 0.6s opacity ease-in-out 1s, 0.6s right ease-in-out 1s;
}

.fade-right.count-5 {
  transition: 0.6s opacity ease-in-out 1.2s, 0.6s right ease-in-out 1.2s;
}

.fade-right.count-6 {
  transition: 0.6s opacity ease-in-out 1.4s, 0.6s right ease-in-out 1.4s;
}

.fade-right.count-7 {
  transition: 0.6s opacity ease-in-out 1.6s, 0.6s right ease-in-out 1.6s;
}

.fade-right.count-8 {
  transition: 0.6s opacity ease-in-out 1.8s, 0.6s right ease-in-out 1.8s;
}

.fade-right.count-9 {
  transition: 0.6s opacity ease-in-out 2s, 0.6s right ease-in-out 2s;
}

.fade-right.count-10 {
  transition: 0.6s opacity ease-in-out 2.2s, 0.6s right ease-in-out 2.2s;
}

.fade-right.count-11 {
  transition: 0.6s opacity ease-in-out 2.4s, 0.6s right ease-in-out 2.4s;
}

.fade-right.count-12 {
  transition: 0.6s opacity ease-in-out 2.6s, 0.6s right ease-in-out 2.6s;
}

.fade-right.count-13 {
  transition: 0.6s opacity ease-in-out 2.8s, 0.6s right ease-in-out 2.8s;
}

.fade-right.count-14 {
  transition: 0.6s opacity ease-in-out 3s, 0.6s right ease-in-out 3s;
}

/*
* @fade-left
*/

.fade-left {
  opacity: 0;
  left: 100px;
  transition: 0.6s opacity ease-in-out 0.2s, 0.6s left ease-in-out 0.2s;
  position: relative;
}

.fade-left.in {
  opacity: 1;
  left: 0;
}

.fade-left.count-1 {
  transition: 0.6s opacity ease-in-out 0.4s, 0.6s left ease-in-out 0.4s;
}

.fade-left.count-2 {
  transition: 0.6s opacity ease-in-out 0.6s, 0.6s left ease-in-out 0.6s;
}

.fade-left.count-3 {
  transition: 0.6s opacity ease-in-out 0.8s, 0.6s left ease-in-out 0.8s;
}

.fade-left.count-4 {
  transition: 0.6s opacity ease-in-out 1s, 0.6s left ease-in-out 1s;
}

.fade-left.count-5 {
  transition: 0.6s opacity ease-in-out 1.2s, 0.6s left ease-in-out 1.2s;
}

.fade-left.count-6 {
  transition: 0.6s opacity ease-in-out 1.4s, 0.6s left ease-in-out 1.4s;
}

.fade-left.count-7 {
  transition: 0.6s opacity ease-in-out 1.6s, 0.6s left ease-in-out 1.6s;
}

.fade-left.count-8 {
  transition: 0.6s opacity ease-in-out 1.8s, 0.6s left ease-in-out 1.8s;
}

.fade-left.count-9 {
  transition: 0.6s opacity ease-in-out 2s, 0.6s left ease-in-out 2s;
}

.fade-left.count-10 {
  transition: 0.6s opacity ease-in-out 2.2s, 0.6s left ease-in-out 2.2s;
}

.fade-left.count-11 {
  transition: 0.6s opacity ease-in-out 2.4s, 0.6s left ease-in-out 2.4s;
}

.fade-left.count-12 {
  transition: 0.6s opacity ease-in-out 2.6s, 0.6s left ease-in-out 2.6s;
}

.fade-left.count-13 {
  transition: 0.6s opacity ease-in-out 2.8s, 0.6s left ease-in-out 2.8s;
}

.fade-left.count-14 {
  transition: 0.6s opacity ease-in-out 3s, 0.6s left ease-in-out 3s;
}

/*
* @card-fade
*/
.card-fade {
  opacity: 0;
  top: 100px;
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 0.2s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 0.2s;
  position: relative;
}

.card-fade.in {
  opacity: 1;
  top: 0;
}

.card-fade.count-1 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 0.4s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 0.4s;
}

.card-fade.count-2 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 0.6s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 0.6s;
}

.card-fade.count-3 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 0.8s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 0.8s;
}

.card-fade.count-4 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 1s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 1s;
}

.card-fade.count-5 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 1.2s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 1.2s;
}

.card-fade.count-6 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 1.4s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 1.4s;
}

.card-fade.count-7 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 1.6s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 1.6s;
}

.card-fade.count-8 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 1.8s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 1.8s;
}

.card-fade.count-9 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 2s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 2s;
}

.card-fade.count-10 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 2.2s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 2.2s;
}

.card-fade.count-11 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 2.4s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 2.4s;
}

.card-fade.count-12 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 2.6s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 2.6s;
}

.card-fade.count-13 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 2.8s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 2.8s;
}

.card-fade.count-14 {
  transition: 0.6s opacity cubic-bezier(0.8, 0.01, 0.25, 1) 3s,
    0.6s top cubic-bezier(0.8, 0.01, 0.25, 1) 3s;
}

/*
* @zoom-in
*/
.zoom-in {
  opacity: 0;
  transform: scale(0.8);
  transition: 0.6s opacity ease-in-out 0.2s, 0.6s transform ease-in-out 0.2s;
}

.zoom-in.in {
  opacity: 1;
  transform: none;
}

.zoom-in.count-1 {
  transition: 0.6s opacity ease-in-out 0.4s, 0.6s transform ease-in-out 0.4s;
}

.zoom-in.count-2 {
  transition: 0.6s opacity ease-in-out 0.6s, 0.6s transform ease-in-out 0.6s;
}

.zoom-in.count-3 {
  transition: 0.6s opacity ease-in-out 0.8s, 0.6s transform ease-in-out 0.8s;
}

.zoom-in.count-4 {
  transition: 0.6s opacity ease-in-out 1s, 0.6s transform ease-in-out 1s;
}

.zoom-in.count-5 {
  transition: 0.6s opacity ease-in-out 1.2s, 0.6s transform ease-in-out 1.2s;
}

.zoom-in.count-6 {
  transition: 0.6s opacity ease-in-out 1.4s, 0.6s transform ease-in-out 1.4s;
}

.zoom-in.count-7 {
  transition: 0.6s opacity ease-in-out 1.6s, 0.6s transform ease-in-out 1.6s;
}

.zoom-in.count-8 {
  transition: 0.6s opacity ease-in-out 1.8s, 0.6s transform ease-in-out 1.8s;
}

.zoom-in.count-9 {
  transition: 0.6s opacity ease-in-out 2s, 0.6s transform ease-in-out 2s;
}

.zoom-in.count-10 {
  transition: 0.6s opacity ease-in-out 2.2s, 0.6s transform ease-in-out 2.2s;
}

.zoom-in.count-11 {
  transition: 0.6s opacity ease-in-out 2.4s, 0.6s transform ease-in-out 2.4s;
}

.zoom-in.count-12 {
  transition: 0.6s opacity ease-in-out 2.6s, 0.6s transform ease-in-out 2.6s;
}

.zoom-in.count-13 {
  transition: 0.6s opacity ease-in-out 2.8s, 0.6s transform ease-in-out 2.8s;
}

.zoom-in.count-14 {
  transition: 0.6s opacity ease-in-out 3s, 0.6s transform ease-in-out 3s;
}

/*
* @swipe (For Images)
*/
.swipe {
  opacity: 0;
  transform: scale(0.8);
  transition: 0.6s opacity ease-in-out 0.2s, 0.6s transform ease-in-out 0.2s;
}

.swipe.in {
  opacity: 1;
  transform: none;
}

.swipe.count-1 {
  transition: 0.6s opacity ease-in-out 0.4s, 0.6s transform ease-in-out 0.4s;
}

.swipe.count-2 {
  transition: 0.6s opacity ease-in-out 0.6s, 0.6s transform ease-in-out 0.6s;
}

.swipe.count-3 {
  transition: 0.6s opacity ease-in-out 0.8s, 0.6s transform ease-in-out 0.8s;
}

.swipe.count-4 {
  transition: 0.6s opacity ease-in-out 1s, 0.6s transform ease-in-out 1s;
}

.swipe.count-5 {
  transition: 0.6s opacity ease-in-out 1.2s, 0.6s transform ease-in-out 1.2s;
}

.swipe.count-6 {
  transition: 0.6s opacity ease-in-out 1.4s, 0.6s transform ease-in-out 1.4s;
}

.swipe.count-7 {
  transition: 0.6s opacity ease-in-out 1.6s, 0.6s transform ease-in-out 1.6s;
}

.swipe.count-8 {
  transition: 0.6s opacity ease-in-out 1.8s, 0.6s transform ease-in-out 1.8s;
}

.swipe.count-9 {
  transition: 0.6s opacity ease-in-out 2s, 0.6s transform ease-in-out 2s;
}

.swipe.count-10 {
  transition: 0.6s opacity ease-in-out 2.2s, 0.6s transform ease-in-out 2.2s;
}

.swipe.count-11 {
  transition: 0.6s opacity ease-in-out 2.4s, 0.6s transform ease-in-out 2.4s;
}

.swipe.count-12 {
  transition: 0.6s opacity ease-in-out 2.6s, 0.6s transform ease-in-out 2.6s;
}

.swipe.count-13 {
  transition: 0.6s opacity ease-in-out 2.8s, 0.6s transform ease-in-out 2.8s;
}

.swipe.count-14 {
  transition: 0.6s opacity ease-in-out 3s, 0.6s transform ease-in-out 3s;
}
