/*--------------------------------------------------------------
# MMSCROLL ANIMATIONS
--------------------------------------------------------------*/
/* --------------------------------- scroll animations */


/* animate in/ in view */
/* div[class*="vr-js-ani-"].vr-animate-in,
div[class*="vr-js-ani-"].vr-animate-in .wp-block-column,
.vr-js-ani-footer.vr-animate-in .row { */
.vr-js-ani-1.vr-animate-in,
.vr-js-ani-2.vr-animate-in,
.vr-js-ani-3.vr-animate-in,
.vr-js-ani-4.vr-animate-in,
.vr-js-ani-5.vr-animate-in,
.vr-js-ani-1b.vr-animate-in,
.vr-js-ani-2b.vr-animate-in,
.vr-js-ani-3b.vr-animate-in,
.vr-js-ani-4b.vr-animate-in,
.vr-js-ani-5b.vr-animate-in,
.vr-js-ani-6b.vr-animate-in,
.vr-js-ani-7b.vr-animate-in,
.vr-js-ani-8b.vr-animate-in,
.vr-js-ani-9b.vr-animate-in {
    /* -webkit-animation: ani-in .5s ease-out 0.1s both;
	        animation: ani-in .5s ease-out 0.1s both;
            opacity: 1; */
}
/* --------------------------------- section: slide in and fade out, sections/columns get a pop-s */
/* section bg for works singles, cant be combined with ani-*b above bc of flickering */

/* default/ not in view/ background color default gray */
/* divs containing class starting w vr-js-ani- */
div[class*="vr-js-ani-"].vr-animate-out {
    -webkit-animation: ani-field-out 1s ease-out 0.1s both;
            animation: ani-field-out 1s ease-out 0.1s both;
            opacity: 0;
}
/* in view */
div[class*="vr-js-ani-"].vr-animate-in {
    -webkit-animation: ani-field-in .5s ease-out 0.1s both;
	          animation: ani-field-in .5s ease-out 0.1s both;
            opacity: 1;
}
.mb-15 {
  margin-bottom: 5rem;
}
@keyframes ani-field-in {
  0% {
    transform:translate3d(0,0,0);
    opacity: 0;
  }
  50% {
    opacity: 1;
    transform:translate3d(0,-5vh,0);
  }
  100% {
    transform:translate3d(0,-5vh,0);
    opacity: 1;
  }
}
@keyframes ani-field-out {
  0% {
    transform:translate3d(0,-5vh,0);
    opacity: 1;
  }
  90% {
    transform:translate3d(0,0,0);
    opacity: 0;
  }
  100% {
    transform:translate3d(0,0,0);
    opacity: 0;
  }
}
