/*
==========================================================================
 CSS3 animations for creating nice pretty visual effects on HTML elements
==========================================================================
*/

/* Bounce */
/* Chrome 4-42/Safari 4-8/Opera 12-29 */
@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		-webkit-transform: translateY(0);
		   -moz-transform: translateY(0);
			 -o-transform: translateY(0);
				transform: translateY(0);
	}
	
	40% {
		-webkit-transform: translateY(-18px);
		   -moz-transform: translateY(-18px);
			 -o-transform: translateY(-18px);
				transform: translateY(-18px);
	}

	60% {
		-webkit-transform: translateY(-15px);
		   -moz-transform: translateY(-15px);
			 -o-transform: translateY(-15px);
				transform: translateY(-15px);
	}
}

/* Firefox 5-15 */
@-moz-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		-webkit-transform: translateY(0);
		   -moz-transform: translateY(0);
			 -o-transform: translateY(0);
				transform: translateY(0);
	}
	
	40% {
		-webkit-transform: translateY(-18px);
		   -moz-transform: translateY(-18px);
			 -o-transform: translateY(-18px);
				transform: translateY(-18px);
	}

	60% {
		-webkit-transform: translateY(-15px);
		   -moz-transform: translateY(-15px);
			 -o-transform: translateY(-15px);
				transform: translateY(-15px);
	}
}

/* Chrome 43+/Safari 9+/Opera 30+/Firefox 16+/IE10/IE11 */
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		-webkit-transform: translateY(0);
		   -moz-transform: translateY(0);
			 -o-transform: translateY(0);
				transform: translateY(0);
	}
	
	40% {
		-webkit-transform: translateY(-18px);
		   -moz-transform: translateY(-18px);
			 -o-transform: translateY(-18px);
				transform: translateY(-18px);
	}

	60% {
		-webkit-transform: translateY(-15px);
		   -moz-transform: translateY(-15px);
			 -o-transform: translateY(-15px);
				transform: translateY(-15px);
	}
}

.bounce {
	-webkit-animation: bounce 2s infinite;
	   -moz-animation: bounce 2s infinite;
	        animation: bounce 2s infinite;
}