/*!
 * WickedCSS v1.0 (http://kristofferandreasen.github.io/wickedCSS/)
 * Copyright 2015 Kristoffer Andreasen
 * MIT License
 */
 
/* Rotation */
.rotation {
	animation-name: rotation;
	animation-duration: 4s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes rotation {
	from { transform: rotate(0deg) translateX(50%) rotate(0deg); }
	to { transform: rotate(360deg) translateX(50%) rotate(-360deg); }
}

/* sideToSide */
.sideToSide {
	animation-name: sideToSide;
	animation-duration: 3s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes sideToSide {
	0% { transform: translate(100%, 0); }
	50% { transform: translate(-100%, 0); }
	100% { transform: translate(100%, 0); }
}

/* zoomer */
.zoomer {
	animation-name: zoomer;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.5, 0.2, 0.3, 1.0);
	animation-iteration-count: 1;
	visibility: visible !important;
}
@keyframes zoomer {
	0% { transform: scale(.3); }
 	100% { transform: scale(1); }
}

/* zoomerOut */
.zoomerOut {
	animation-name: zoomerOut;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.5, 0.2, 0.3, 1.0);
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	visibility: visible !important;
}
@keyframes zoomerOut {
	0% { transform: scale(1); }
	100% { transform: scale(0); }
}

/* spinner */
.spinner {
	animation-name: spinner;
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes spinner {
	from { transform:rotate(0deg); }
	to { transform:rotate(360deg); }
}

/* pulse */
.pulse {
	animation-name: pulse;
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes pulse {
	0% {
		transform: scale(0.9);
		opacity: 0.9;
	}
	50% {
		transform: scale(1);
		opacity: 1;
	}
	100% {
		transform: scale(0.9);
		opacity: 0.9;
	}
}

/* shake */
.shake {
	animation-name: shake;
	animation-duration: 0.4s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
	visibility: visible !important;
}
@keyframes shake {
	0%, 100% { transform: translateX(0); }
	16%, 50%, 83% { transform: translateX(-10px); }
	33%, 66% { transform: translateX(10px); }
}

/* barrelRoll */
.barrelRoll {
	animation-name: barrelRoll;
	animation-duration: 0.4s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
	visibility: visible !important;
}
@keyframes barrelRoll {
	from { transform: rotate(0deg) }
	to { transform: rotate(360deg) }
}

/* floater */
.floater {
	animation-name: floater;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes floater {
	0% { transform: translateY(0%); }
	50% { transform: translateY(8%); }
	100% { transform: translateY(0%); }
}

/* wiggle */
.wiggle {
	animation-name: wiggle;
	animation-duration: 2.5s;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes wiggle {
	0% { transform: rotate(-4deg); }
	50% { transform: rotate(4deg); }
	100% { transform: rotate(-4deg); }
}

/* pound */
.pound {
	animation-name: pound;
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes pound {
	to { transform: scale(1.2); }
}

/* heartbeat */
.heartbeat {
	animation-name: heartbeat;
	animation-duration: 3s;
	animation-timing-function: ease;
	animation-iteration-count: infinite;
	visibility: visible !important;
}
@keyframes heartbeat {
	0% { transform: scale(1); }
	10% { transform: scale(1.2); }
	20% { transform: scale(1.4); }
	100% { transform: scale(1); }
}

/* rollerRight */
.rollerRight {
	animation-name: rollerRight;
	animation-duration: 2s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
@keyframes rollerRight {
	0% {
		transform: translateX(-200px) rotate(0);
		opacity: 0;
	}
	100% {
		transform: translateX(0) rotate(2turn);
		opacity: 1;
	}
}

/* rollerLeft */
.rollerLeft {
	animation-name: rollerLeft;
	animation-duration: 2s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
@keyframes rollerLeft {
	0% {
		transform: translateX(200px) rotate(0);
		opacity: 0;
	}
	100% {
		transform: translateX(0) rotate(-2turn);
		opacity: 1;
	}
}

/* slideDown */
.slideDown {
	animation-name: slideDown;
	animation-duration: 1s;
	animation-timing-function: ease;
}
@keyframes slideDown {
	0% {
		transform: translateY(-100%);
		opacity: 0;
	}
	100% {
		transform: translateY(0%);
		opacity: 1;
	}
}

/* slideUp */
.slideUp {
	animation-name: slideUp;
	animation-duration: 1s;
	animation-timing-function: ease;
}
@keyframes slideUp {
	0% {
		transform: translateY(100%);
		opacity: 0;
	}
	 100% {
		transform: translateY(0%);
		opacity: 1;
	}
}

/* slideLeft */
.slideLeft {
	animation-name: slideLeft;
	animation-duration: 1s;
	animation-timing-function: ease;
}
@keyframes slideLeft {
	0% {
		transform: translateX(150%);
		opacity: 0;
	}
	100% {
		transform: translateX(0%);
		opacity: 1;
	}
}

/* slideRight */
.slideRight {
	animation-name: slideRight;
	animation-duration: 1s;
	animation-timing-function: ease;
}
@keyframes slideRight {
	0% {
		transform: translateX(-150%);
		opacity: 0;
	}
	100% {
		transform: translateX(0%);
		opacity: 1;
	}
}

/* fadeIn */
.fadeIn {
	animation-name: fadeIn;
	animation-duration: 2s;
	animation-timing-function: ease;
	visibility: visible !important;
}
@keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

/* fadeOut */
.fadeOut {
	animation-name: fadeOut;
	animation-duration: 2s;
	animation-timing-function: ease;
	animation-fill-mode: forwards;
}
@keyframes fadeOut {
	0% { opacity: 1; }
	100% { opacity: 0; }
}

/* rotateInRight */
.rotateInRight {
	animation-name: rotateInRight;
	animation-duration: 3s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
}
@keyframes rotateInRight {
	from { transform: rotate(0deg) translateX(100%) rotate(0deg); }
	to { transform: rotate(360deg) translateX(0) rotate(-360deg); }
}

/* rotateInLeft */
.rotateInLeft {
	animation-name: rotateInLeft;
	animation-duration: 3s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
}
@keyframes rotateInLeft {
	from { transform: rotate(0deg) translateX(-100%) rotate(0deg); }
	to { transform: rotate(360deg) translateX(0) rotate(-360deg); }
}

/* rotateIn */
.rotateIn {
	animation-name: rotateIn;
	animation-duration: 3s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
	transform-origin: center;
}
@keyframes rotateIn {
	0% {
		transform: rotate3d(0, 0, 1, -720deg);
		opacity: 0;
	}
	100% {
		transform: none;
		opacity: 1;
	}
}

/* bounceIn */
.bounceIn {
	animation-name: bounceIn;
	animation-duration: .8s;
	animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
@keyframes bounceIn {
	0% {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}
		20% {
		transform: scale3d(1.1, 1.1, 1.1);
	}
	40% { transform: scale3d(.9, .9, .9); }
	60% {
		opacity: 1;
		transform: scale3d(1.03, 1.03, 1.03);
	}
	80% { transform: scale3d(.97, .97, .97); }
	100% {
		opacity: 1;
		transform: scale3d(1, 1, 1);
	}
}