/* Duration */

[class*="fade"]{
	transition: 0.75s ease-in-out all;
}

/* Delays */

.delay250{
	transition-delay: 250ms;
}

.delay500{
	transition-delay: 500ms;
}

.delay750{
	transition-delay: 750ms;
}

/* FadeFrom */

/* top */

.fadeFromTop{
	transform: translateY(-200%);
	opacity: 0;
}

.fadeFromTop.visible{
	transform: translateY(0);
	opacity: 1;
}

/* left */

.fadeFromLeft{
	transform: translateX(-200%);
	opacity: 0;
}

.fadeFromLeft.visible{
	transform: translateX(0);
	opacity: 1;
}

/* bottom */

.fadeFromBottom{
	transform: translateY(200%);
	opacity: 0;
}

.fadeFromBottom.visible{
	transform: translateY(0);
	opacity: 1;
}

/* right */

.fadeFromRight{
	transform: translateX(200%);
	opacity: 0;
}

.fadeFromRight.visible{
	transform: translateX(0);
	opacity: 1;
}