#example-block{transition:all 0s;}
#example-block.scroll-triggered, .move-in-right, .move-in-left, .move-in-upwards, .move-in-up, .move-in-downwards, .move-in-down, .fade-in, .fade-in-upwards, .fade-in-up, .fade-in-left, .fade-in-right, .fade-in-downwards, .fade-in-down, .flip-left, .flip-right, .flip-upwards, .flip-up, .flip-downwards, .flip-down, .bounce-in-left, .bounce-in-right, .bounce-in-downwards, .bounce-in-down, .bounce-in-upwards, .bounce-in-up, .zoom-in, .skew-in-left, .skew-in-right, .blur-in, .colour-gain{transition:all 1s;}

.move-in-upwards, .move-in-up{transform:translateY(100px);}
.move-in-upwards.scroll-triggered, .move-in-up.scroll-triggered{transform:translateY(0);}

.move-in-downwards, .move-in-down{transform:translateY(-100px);}
.move-in-downwards.scroll-triggered, .move-in-down.scroll-triggered{transform:translateY(0);}

.move-in-left{transform:translateX(100px);}
.move-in-left.scroll-triggered{transform:translateX(0);}

.move-in-right{transform:translateX(-100px);}
.move-in-right.scroll-triggered{transform:translateX(0);}

.fade-in{opacity:0;}
.fade-in.scroll-triggered{opacity:1;}

.fade-in-upwards, .fade-in-up{opacity:0;transform:translateY(100px);}
.fade-in-upwards.scroll-triggered, .fade-in-up.scroll-triggered{opacity:1;transform:translateY(0);}

.fade-in-downwards, .fade-in-down{opacity:0;transform:translateY(-100px);}
.fade-in-downwards.scroll-triggered, .fade-in-down.scroll-triggered{opacity:1;transform:translateY(0);}

.fade-in-left{opacity:0;transform:translateX(100px);}
.fade-in-left.scroll-triggered{opacity:1;transform:translateX(0);}

.fade-in-right{opacity:0;transform:translateX(-100px);}
.fade-in-right.scroll-triggered{opacity:1;transform:translateX(0);}

.flip-left{backface-visibility: hidden;transform:rotateY(-130deg)}
.flip-left.scroll-triggered{transform-style: preserve-3d;transform:rotateY(0deg)}

.flip-right{backface-visibility: hidden;transform:rotateY(130deg)}
.flip-right.scroll-triggered{transform-style: preserve-3d;transform:rotateY(0deg)}

.flip-downwards, .flip-down{backface-visibility: hidden;transform:rotateX(130deg)}
.flip-downwards.scroll-triggered, .flip-down.scroll-triggered{transform-style: preserve-3d;transform:rotateY(0deg)}

.flip-upwards, .flip-up{backface-visibility: hidden;transform:rotateX(-130deg)}
.flip-upwards.scroll-triggered, .flip-up.scroll-triggered{transform-style: preserve-3d;transform:rotateY(0deg)}

.bounce-in-left{opacity:0;transform:translateX(100px);transition-timing-function:cubic-bezier(0.65, 1.76, 0.46, 1.01) !important}
.bounce-in-left.scroll-triggered{transform:translateX(0px);opacity:1;}

.bounce-in-right{opacity:0;transform:translateX(-100px);transition-timing-function:cubic-bezier(0.65, 1.76, 0.46, 1.01) !important}
.bounce-in-right.scroll-triggered{transform:translateX(0px);opacity:1;}

.bounce-in-downwards, .bounce-in-down{opacity:0;transform:translateY(-50px);transition-timing-function:cubic-bezier(0.65, 1.76, 0.46, 1.01) !important}
.bounce-in-downwards.scroll-triggered, .bounce-in-down.scroll-triggered{transform:translateY(0px);opacity:1;}

.bounce-in-upwards, .bounce-in-up{opacity:0;transform:translateY(50px);transition-timing-function:cubic-bezier(0.65, 1.76, 0.46, 1.01) !important}
.bounce-in-upwards.scroll-triggered, .bounce-in-up.scroll-triggered{transform:translateY(0px);opacity:1;}

.type-text-slow, .type-text-medium, .type-text-fast{opacity:0;transition:all 0s !important;}
.type-text-slow.scroll-triggered, .type-text-medium.scroll-triggered, .type-text-fast.scroll-triggered{opacity:1;}

/**Premium Animations**/
.toast-metabox .zoom-in{transform:scale(0);}
.toast-metabox .zoom-in.scroll-triggered{transform:scale(1);}

.toast-metabox .skew-in-left{transition:all .5s;transform:rotate(30deg);}
.toast-metabox .skew-in-right{transform:rotate(-30deg);}
.toast-metabox .skew-in-left.scroll-triggered, .skew-in-right.scroll-triggered{transform:rotate(0);}

.toast-metabox .blur-in{-webkit-filter: blur(40px);-moz-filter: blur(40px);-ms-filter: blur(40px);-o-filter: blur(40px);filter:blur(40px);transition:all .5s;}
.toast-metabox .blur-in.scroll-triggered{-webkit-filter: blur(0px);-moz-filter: blur(0px);-ms-filter: blur(0px);-o-filter: blur(0px);filter:blur(0px)}

.toast-metabox .colour-gain{filter:grayscale(100%);transition:all .5s;}
.toast-metabox .colour-gain.scroll-triggered{filter:grayscale(0%);}

.toast-metabox .grow-down, .grow-up{transform:scaleY(0);transition:all .5s;}
.toast-metabox .grow-down.scroll-triggered, .grow-up.scroll-triggered{transform:scaleY(1);}

.toast-metabox .grow-down{transform-origin:top;}
.toast-metabox .grow-up{transform-origin:bottom;}

.toast-metabox .grow-left, .grow-right{transform:scaleX(0);transition:all .5s;}
.toast-metabox .grow-left.scroll-triggered, .grow-right.scroll-triggered{transform:scaleX(1);}
.toast-metabox .grow-right{transform-origin:left;}
.toast-metabox .grow-left{transform-origin:right;}

.toast-metabox .shake.scroll-triggered{animation: toastshake 1s linear forwards;}
@keyframes toastshake {
  10%, 90% {transform: translateX(-1px);}
  20%, 80% {transform: translateX(2px);}
  30%, 50%, 70% {transform: translateX(-4px);}
  40%, 60% {transform: translateX(4px);}
  100%{transform: translateX(0px);}
}

.toast-metabox .swing-side{opacity:0;transition:all .15s;transform-origin:top center;}
.toast-metabox .swing-side.scroll-triggered{animation: toastswingside 1s linear forwards;opacity:1;}
@keyframes toastswingside {
 0%{transform:rotate(15deg) translateY(-5px);}
 30%{transform:rotate(-10deg);}
 50%{transform:rotate(5deg);}
 70%{transform:rotate(-5deg);}
 90%{transform:rotate(0deg)}
  }
  
.toast-metabox .swing-forward{opacity:0;transition:all .5s;transform-origin:top center;}
.toast-metabox .swing-forward.scroll-triggered{animation: toastswingforward 1s linear forwards;opacity:1;}
@keyframes toastswingforward {
 10%{transform:rotateX(-80deg);}
 40%{transform:rotateX(50deg);}
 60%{transform:rotateX(-40deg);}
 80%{transform:rotateX(15deg);}
 100%{transform:rotateX(0deg)}
  }
  
.toast-metabox .rubber-band.scroll-triggered{animation:toastrubberband 1s linear forwards;}
@keyframes toastrubberband{
0%{transform:scale3d(1);}
30%{transform:scale3d(1.2, .75, 1)}
40%{transform:scale3d(.75, 1.2, 1)}
50%{transform:scale3d(1.05, .75, 1)}
65%{transform:scale3d(.96, 1.04, 1)}
75%{transform:scale3d(1.04,.96, 1)}
100%{transform:scale3d(1)}

}

