.is-inview {
  transition: all .6s;
}

/* fadeIn
--------------------------------------------------------------*/
.fadeIn {
  opacity: 0; 
}
.fadeIn.is-inview {
  opacity: 1; 
  transition-delay: .5s;
}

/* fadeInDown
--------------------------------------------------------------*/
.fadeInDown {
  opacity: 0; 
  transform: translateY(-30px); 
  transition: opacity .8s, transform .8s; 
}
@media (max-width: 767px) {
  .fadeInDown {
    transform: translateY(-15px); 
  }
}
.fadeInDown.is-inview {
  opacity: 1; 
  transform: translateY(0); 
  transition-delay: .3s; 
}

/* fadeInUp
--------------------------------------------------------------*/
.fadeInUp {
  opacity: 0; 
  transform: translateY(30px); 
  transition: opacity .8s, transform .8s; 
}
.fadeInUp.is-inview {
  opacity: 1; 
  transform: translateY(0); 
  transition-delay: .3s; 
}

/* fadeInRight
--------------------------------------------------------------*/
.fadeInRight {
  opacity: 0; 
  transform: translateX(100px); 
  transition: opacity .8s, transform .8s; 
}
.fadeInRight.is-inview {
  opacity: 1; 
  transform: translateX(0); 
  transition-delay: .3s; 
}

/* fadeInLeft
--------------------------------------------------------------*/
.fadeInLeft {
  opacity: 0; 
  transform: translateX(-100px); 
  transition: opacity .8s, transform .8s; 
}
.fadeInLeft.is-inview {
  opacity: 1; 
  transform: translateX(0); 
  transition-delay: .3s; 
}

/* fadeInSwingLeft
--------------------------------------------------------------*/
.fadeInSwingLeft {
  opacity: 0;
  transform: translateX(-30px) translateY(-30px) rotate(45deg); 
  transition: opacity .8s, transform .8s; 
  transform-origin: right top;
}
.fadeInSwingLeft.is-inview {
  opacity: 1; 
  transform: translate(0) rotate(0) !important; 
  transition-delay: .3s; 
}

/* fadeInSwingRight
--------------------------------------------------------------*/
.fadeInSwingRight {
  opacity: 0; 
  transform: translateX(30px) translateY(-30px) rotate(-45deg); 
  transition: opacity .8s, transform .8s; 
  transform-origin: left top;
}
.fadeInSwingRight.is-inview {
  opacity: 1; 
  transform: translate(0) rotate(0) !important; 
  transition-delay: .3s; 
}

/* fadeInSwingLeftUp
--------------------------------------------------------------*/
.fadeInSwingLeftUp {
  opacity: 0;
  transform: translateX(-100px) translateY(30px) rotate(-30deg); 
  transition: opacity .8s, transform .8s; 
  transform-origin: left bottom;
}
@media (max-width: 767px) {
  .fadeInSwingLeftUp {
    transform: translateX(calc(-15 / 375 * 100vw)) translateY(15px) rotate(-20deg); 
  }
}
.fadeInSwingLeftUp.is-inview {
  opacity: 1; 
  transform: translate(0) rotate(0) !important; 
  transition-delay: .3s; 
}

/* fadeInSwingRightUp
--------------------------------------------------------------*/
.fadeInSwingRightUp {
  opacity: 0; 
  transform: translateX(100px) translateY(30px) rotate(30deg); 
  transition: opacity .8s, transform .8s; 
  transform-origin: left bottom;
}
@media (max-width: 767px) {
  .fadeInSwingRightUp {
    transform: translateX(calc(15 / 375 * 100vw)) translateY(15px) rotate(20deg); 
  }
}
.fadeInSwingRightUp.is-inview {
  opacity: 1; 
  transform: translate(0) rotate(0) !important; 
  transition-delay: .3s; 
}

/* fadeInPopup
--------------------------------------------------------------*/
.fadeInPopup {
  opacity: 0;
  transform: scale(0);
  transition: opacity .8s, transform .8s; 
}
.fadeInPopup.is-inview {
  opacity: 1;
  transform: scale(1) !important;
  transition-delay: .3s; 
}