/* Underline Hover Animation */
@-webkit-keyframes line-in {
    from    { width: 0; }
    to 		{ width: 100%; }
}

@-webkit-keyframes line-out {
    from    { width: 100%; }
    to 		{ width: 0; }
}

/* Infinite Rotation */
@-webkit-keyframes rotating {
	from {
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes rotating {
	from {
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

.rotating {
	-webkit-animation: rotating 2s linear infinite;
	-moz-animation: rotating 2s linear infinite;
	-ms-animation: rotating 2s linear infinite;
	-o-animation: rotating 2s linear infinite;
	animation: rotating 2s linear infinite;
}

/* Animations and Transitions */
.fade-in { animation: fade-in 2s; }
.slide-in- { animation: slide-in 1s; position: relative; }

.appear-1st { animation-delay: 1s; }
.appear-2nd { animation-delay: 2s; }
.appear-3rd { animation-delay: 3s; }
.appear-4th { animation-delay: 4s; }
.appear-5th { animation-delay: 5s; }

@keyframes fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes slide-in {
    from { left: 100px; opacity: 0; }
    to   { left: 0; opacity: 1; }
}