.fadeIn,
.fadeInDown,
.fadeInUp,
.fadeInRight {
	animation-duration: 0.6s;
	animation-fill-mode: both;
	animation-delay: 0.1s;
	animation-timing-function: ease;
}

.delay-s { animation-delay: 0.5s; }

.delay-l { animation-delay: 0.8s; }

/* fadeIn */
@keyframes fadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

.fadeIn { animation-name: fadeIn; }

/* fadeInDown */
@keyframes fadeInDown {
	from { opacity: 0; transform: translate3d(0, -100%, 0); }
	to { opacity: 1; transform: none; }
}

@keyframes fadeInDown {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}

.fadeInDown { animation-name: fadeInDown; }

/* fadeInUp */
@keyframes fadeInUp {
	from { opacity: 0; transform: translate3d(0, 100%, 0); }
	to { opacity: 1; transform: none; }
}

@keyframes fadeInUp {
	0% { opacity: 0; transform: translateY(20px); }
	100% { opacity: 1; transform: translateY(0); }
}

.fadeInUp { animation-name: fadeInUp; }

/* fadeInRight */
@keyframes fadeInRight {
	from { opacity: 0; transform: translate3d(100%,0,0); }
	to { opacity: 1; transform: translate3d(0,0,0); }
}

@keyframes fadeInRight {
	0% { opacity: 0; transform: translateX(80px); }
	100% { opacity: 1; transform: translateX(0); }
}

.fadeInRight { animation-name: fadeInRight; }