@charset "utf-8";
/* CSS Document */
/*--- Scroll Fade In Element ---*/

.scrollFade {
	opacity: 1;
	pointer-events: all;
}

.scrollFade--hidden {
	opacity: 0;
	pointer-events: none;
}

.scrollFade--visible {
	opacity: 1;
	pointer-events: all;
}

.scrollFade--animate {
	transition: opacity 0.4s ease-in-out;
}

/*-- Scroll Fade In left to right --*/
.element-fade-in-left-right {
	opacity: 0;
	transform: translateX(-300px);
	transition: all .6s ease-out;
}

.element-fade-in-left-right-visible {
	opacity: 1;
	max-width: 100%;
	transform: translateX(0);
}

/*-- Scroll Fade In top to bottom --*/
.element-fade-in-top-bottom {
	opacity: 0;
	transform: translateY(-100px);
	transition: all .6s ease-out;
}

.element-fade-in-top-bottom-visible {
	opacity: 1;
	max-width: 100%;
	transform: translateY(0);
}


@media screen and (max-width: 620px) {

	.element-fade-in-top-bottom {
		opacity: 0;
		transform: translateY(-5px);
		transition: all .6s ease-out;
	}

	.element-fade-in-top-bottom-visible {
		opacity: 1;
		max-width: 100%;
		transform: translateY(0);
	}

	.element-fade-in-left-right {
		opacity: 0;
		transform: translateY(-5px);
		transition: all .6s ease-out;
	}

	.element-fade-in-left-right-visible {
		opacity: 1;
		max-width: 100%;
		transform: translateY(0);
	}
}