/********************************/
/* ANIMATIONS - in view
/********************************/


.inview-animation-fadeIn {
	opacity: 0;
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-fadeIn.isinview {
	opacity: 1;
}



.inview-animation-zoomInFadeIn {
	opacity: 0;
	-webkit-transform: scale(0.9);
			transform: scale(0.9);
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-zoomInFadeIn.isinview {
	opacity: 1;
	-webkit-transform: none;
			transform: none;
}



.inview-animation-slideLeftFadeIn {
	opacity: 0;
	-webkit-transform: translateX(6rem);
			transform: translateX(6rem);
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-slideLeftFadeIn.isinview {
	opacity: 1;
	-webkit-transform: none;
			transform: none;
}



.inview-animation-slideRightFadeIn {
	opacity: 0;
	-webkit-transform: translateX(-6rem);
			transform: translateX(-6rem);
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-slideRightFadeIn.isinview {
	opacity: 1;
	-webkit-transform: none;
			transform: none;
}



.inview-animation-slideUpFadeIn {
	opacity: 0;
	-webkit-transform: translateY(6rem);
			transform: translateY(6rem);
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-slideUpFadeIn.isinview {
	opacity: 1;
	-webkit-transform: none;
			transform: none;
}



.inview-animation-slideUpShortFadeIn {
	opacity: 0;
	-webkit-transform: translateY(2rem);
			transform: translateY(2rem);
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-slideUpShortFadeIn.isinview {
	opacity: 1;
	-webkit-transform: none;
			transform: none;
}



.inview-animation-slideDownShortFadeIn {
	opacity: 0;
	-webkit-transform: translateY(-2rem);
			transform: translateY(-2rem);
	-webkit-transition: all 1s ease;
			transition: all 1s ease;
}
.inview-animation-slideDownShortFadeIn.isinview {
	opacity: 1;
	-webkit-transform: none;
			transform: none;
}






/********************************/
/* ANIMATIONS - on scroll
/********************************/

.animation-scroll {
}

.scroll-animation-slideUp {
	animation: scrollAnimationSlideUp linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}	
.scroll-animation-slideUpSlow {
	animation: scrollAnimationSlideUpSlow linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}
.scroll-animation-slideLeft {
	animation: scrollAnimationSlideLeft linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}
.scroll-animation-slideRight {
	animation: scrollAnimationSlideRight linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}

.scroll-animation-fadeIn {
	animation: scrollAnimationFadeIn linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}

.scroll-animation-zoomFadeIn {
	animation: scrollAnimationZoomFadeIn linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}

.scroll-animation-slideUpFadeIn {
	animation: scrollAnimationSlideUpFadeIn linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}

.scroll-animation-slideRightFadeIn {
	animation: scrollAnimationSlideRightFadeIn linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}

.scroll-animation-slideLeftFadeIn {
	animation: scrollAnimationSlideLeftFadeIn linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}

.scroll-animation-letterSpacing {
	animation: scrollAnimationLetterSpacing linear forwards;
	animation-timeline: view(block auto);
	animation-range: 0% 100%;
}
	

@media (min-width : 1200px) {
}


@-webkit-keyframes scrollAnimationSlideUp {
	  0% { -webkit-transform: translateY(100%); }
	100% { -webkit-transform: translateY(-100%); }
}
@keyframes scrollAnimationSlideUp {
	  0% { transform: translateY(100%); }
	100% { transform: translateY(-100%); }
}

@-webkit-keyframes scrollAnimationSlideUpSlow {
	  0% { -webkit-transform: translateY(100%); }
	100% { -webkit-transform: translateY(-50%); }
}
@keyframes scrollAnimationSlideUpSlow {
	  0% { transform: translateY(100%); }
	100% { transform: translateY(-50%); }
}

@-webkit-keyframes scrollAnimationSlideLeft {
	  0% { -webkit-transform: translateX(100%); }
	100% { -webkit-transform: translateX(0%); }
}
@keyframes scrollAnimationSlideLeft {
	  0% { transform: translateX(100%); }
	100% { transform: translateX(0); }
}

@-webkit-keyframes scrollAnimationSlideRight {
	  0% { -webkit-transform: translateX(-100%); }
	100% { -webkit-transform: translateX(0%); }
}
@keyframes scrollAnimationSlideRight {
	  0% { transform: translateX(-100%); }
	100% { transform: translateX(0); }
}


@-webkit-keyframes scrollAnimationFadeIn { 
	  0% { opacity: 0; }
	 30%, 
	100% { opacity: 1; }
}
@keyframes scrollAnimationFadeIn { 
	  0% { opacity: 0; }
	 30%, 
	100% { opacity: 1; }
}


@-webkit-keyframes scrollAnimationZoomFadeIn { 
	  0% { -webkit-transform: scale(0.5); opacity: 0; }
	 30%, 
	100% { -webkit-transform: scale(1); opacity: 1; }
}
@keyframes scrollAnimationZoomFadeIn { 
	  0% { -webkit-transform: scale(0.5); opacity: 0; }
	 30%, 
	100% { -webkit-transform: scale(1); opacity: 1; }
}


@-webkit-keyframes scrollAnimationSlideUpFadeIn {
	  0% { -webkit-transform: translateY(100%); opacity: 0; }
	 30%, 
	100% { -webkit-transform: translateY(0); opacity: 1; }
}
@keyframes scrollAnimationSlideUpFadeIn {
	  0% { transform: translateY(100%); opacity: 0; }
	 30%, 
	100% { transform: translateY(0); opacity: 1; }
}

@-webkit-keyframes scrollAnimationSlideRightFadeIn {
	  0% { -webkit-transform: translateX(-3em); opacity: 0; }
	 30%, 
	100% { -webkit-transform: translateX(0); opacity: 1; }
}
@keyframes scrollAnimationSlideRightFadeIn {
	  0% { -webkit-transform: translateX(-3em); opacity: 0; }
	 30%, 
	100% { -webkit-transform: translateX(0); opacity: 1; }
}

@-webkit-keyframes scrollAnimationSlideLeftFadeIn {
	  0% { -webkit-transform: translateX(3em); opacity: 0; }
	 30%, 
	100% { -webkit-transform: translateX(0); opacity: 1; }
}
@keyframes scrollAnimationSlideLeftFadeIn {
	  0% { -webkit-transform: translateX(3em); opacity: 0; }
	 30%, 
	100% { -webkit-transform: translateX(0); opacity: 1; }
}


@-webkit-keyframes scrollAnimationLetterSpacing { 
	  0% { letter-spacing: 1.5rem; }
	 50%,
	100% { letter-spacing: 0; }
}
@keyframes scrollAnimationLetterSpacing { 
	  0% { letter-spacing: 1.5rem; }
	 50%,
	100% { letter-spacing: 0; }
}


@-webkit-keyframes scrollAnimationButtonRotateZLeft { 
	  0% { -webkit-transform: rotateZ(0deg); }
	 40% { -webkit-transform: rotateZ(0deg); }
	100% { -webkit-transform: rotateZ(90deg); }
}
@keyframes scrollAnimationButtonRotateZLeft { 
	  0% { transform: rotateZ(0deg); }
	 40% { transform: rotateZ(0deg); }
	100% { transform: rotateZ(90deg); }
}

@-webkit-keyframes scrollAnimationButtonRotateZRight { 
	  0% { -webkit-transform: rotateZ(0deg); }
	 40% { -webkit-transform: rotateZ(0deg); }
	100% { -webkit-transform: rotateZ(-90deg); }
}
@keyframes scrollAnimationButtonRotateZRight { 
	  0% { transform: rotateZ(0deg); }
	 40% { transform: rotateZ(0deg); }
	100% { transform: rotateZ(-90deg); }
}

@-webkit-keyframes scrollAnimationButtonRotateYLeft { 
	  0% { -webkit-transform: rotateY(90deg); }
	 70%,
	100% { -webkit-transform: rotateY(0deg); }
}
@keyframes scrollAnimationButtonRotateYLeft { 
	  0% { transform: rotateY(90deg); }
	 70%,
	100% { transform: rotateY(0deg); }
}




@-webkit-keyframes scrollAnimationLineHeight { 
	  0% { line-height: 3; }
	 40%, 
	100% { line-height: 1; }
}
@keyframes scrollAnimationLineHeight { 
	  0% { line-height: 3; }
	 40%, 
	100% { line-height: 1; }
}


