/* ================================================ */
/* ================== tuesday.css ================= */
/* ==== (http://shakrmedia.github.io/tuesday/) ==== */
/* ======== A quirky CSS Animation Library ======== */
/* ================================================ */
.animated {
	animation-duration: 0.3s;
	animation-fill-mode: both;
}
.animated.infinite { animation-iteration-count: infinite; }
/* Basic Fades */
.tdFadeIn { animation-name: tdFadeIn; }
@keyframes tdFadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
.tdFadeOut { animation-name: tdFadeOut; }
@keyframes tdFadeOut {
	0% { opacity: 1; }
	100% { opacity: 0; }
}
/* Fading Entrances */
.tdFadeInDown { animation-name: tdFadeInDown; }
@keyframes tdFadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-10px);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
.tdFadeInLeft { animation-name: tdFadeInLeft; }
@keyframes tdFadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(10px);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
.tdFadeInUp { animation-name: tdFadeInUp; }
@keyframes tdFadeInUp {
	0% {
		opacity: 0;
		transform: translateY(10px);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
.tdFadeInRight { animation-name: tdFadeInRight; }
@keyframes tdFadeInRight {
	0% {
		opacity: 0;
		transform: translateX(-10px);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}
/* Fading Exits */
.tdFadeOutUp { animation-name: tdFadeOutUp; }
@keyframes tdFadeOutUp {
	0% {
		opacity: 1;
		transform: translateY(0);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 0;
		transform: translateY(-10px);
	}
}
.tdFadeOutRight { animation-name: tdFadeOutRight; }
@keyframes tdFadeOutRight {
	0% {
		opacity: 1;
		transform: translateX(0);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 0;
		transform: translateX(10px);
	}
}
.tdFadeOutDown { animation-name: tdFadeOutDown; }
@keyframes tdFadeOutDown {
	0% {
		opacity: 1;
		transform: translateY(0);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 0;
		transform: translateY(10px);
	}
}
.tdFadeOutLeft { animation-name: tdFadeOutLeft; }
@keyframes tdFadeOutLeft {
	0% {
		opacity: 1;
		transform: translateX(0);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 0;
		transform: translateX(-10px);
	}
}
/* Expand Entrances */
.tdExpandIn { animation-name: tdExpandIn; }
@keyframes tdExpandIn {
	0% {
		opacity: 0;
		transform: scale(0.85);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
.tdExpandInBounce { animation-name: tdExpandInBounce; }
@keyframes tdExpandInBounce {
	0% {
		opacity: 0;
		transform: scale(0.85);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	70% {
		transform: scale(1.03);
		animation-timing-function: ease;
	}
	100% {
		opacity: 1;
		transform: scale(1);
		animation-timing-function: ease;
	}
}
/* Expand Exits */
.tdExpandOut { animation-name: tdExpandOut; }
@keyframes tdExpandOut {
	0% {
		opacity: 1;
		transform: scale(1);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 0;
		transform: scale(1.2);
	}
}
.tdExpandOutBounce { animation-name: tdExpandOutBounce; }
@keyframes tdExpandOutBounce {
	0% {
		opacity: 1;
		transform: scale(1);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	30% {
		opacity: 1;
		transform: scale(0.95);
		animation-timing-function: ease;
	}
	100% {
		opacity: 0;
		transform: scale(1.2);
	}
}
/* Shrink Entrances */
.tdShrinkIn { animation-name: tdShrinkIn; }
@keyframes tdShrinkIn {
	0% {
		opacity: 0;
		transform: scale(1.2);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
.tdShrinkInBounce { animation-name: tdShrinkInBounce; }
@keyframes tdShrinkInBounce {
	0% {
		opacity: 0;
		transform: scale(1.2);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	70% {
		transform: scale(0.95);
		animation-timing-function: ease;
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
/* Shrink Exits */
.tdShrinkOut { animation-name: tdShrinkOut; }
@keyframes tdShrinkOut {
	0% {
		opacity: 1;
		transform: scale(1);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	100% {
		opacity: 0;
		transform: scale(0.85);
		animation-timing-function: ease;
	}
}
.tdShrinkOutBounce { animation-name: tdShrinkOutBounce; }
@keyframes tdShrinkOutBounce {
	0% {
		opacity: 1;
		transform: scale(1);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	30% {
		opacity: 1;
		transform: scale(1.03);
		animation-timing-function: ease;
	}
	100% {
		opacity: 0;
		transform: scale(0.85);
		animation-timing-function: ease;
	}
}
/* Stamp Entrances */
.tdStampIn { animation-name: tdStampIn; }
@keyframes tdStampIn {
	0% {
		opacity: 0;
		transform: scale(1.3);
		animation-timing-function: cubic-bezier(0.59, 0, 1, 0.375);
	}
	50% { opacity: 1; }
	70% {
		opacity: 1;
		transform: scale(1);
	}
	90% {
		opacity: 1;
		transform: scale(1.03);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
.tdStampInSwing { animation-name: tdStampInSwing; }
@keyframes tdStampInSwing {
	0% {
		opacity: 0;
		transform: scale(1.3) rotate(-10deg);
		animation-timing-function: cubic-bezier(0.59, 0, 1, 0.375);
	}
	50% { opacity: 1; 	}
	70% {
		opacity: 1;
		transform: scale(1);
	}
	90% {
		opacity: 1;
		transform: scale(1.03);
	}
	100% {
		opacity: 1;
		transform: scale(1) rotate(0);
	}
}
/* Swing */
.tdSwingIn { animation-name: tdSwingIn; }
@keyframes tdSwingIn {
	0% {
		opacity: 0;
		transform: rotate(-10deg) scale(0.85);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	70% {
		opacity: 1;
		transform: rotate(1deg);
		animation-timing-function: ease;
	}
	100% {
		opacity: 1;
		transform: rotate(0deg) scale(1);
		animation-timing-function: ease;
	}
}
.tdSwingOut { animation-name: tdSwingOut; }
@keyframes tdSwingOut {
	0% {
		opacity: 1;
		transform: rotate(0deg) scale(1);
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	30% {
		opacity: 1;
		transform: rotate(-1deg);
		animation-timing-function: ease;
	}
	100% {
		opacity: 0;
		transform: rotate(10deg) scale(0.85);
		animation-timing-function: ease;
	}
}
/* Hinge Flip */
.tdHingeFlipIn { animation-name: tdHingeFlipIn; }
@keyframes tdHingeFlipIn {
	0% {
		opacity: 0;
		transform: perspective(600px) rotateX(0deg);
		transform-origin: center top;
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	50% {
		transform: perspective(600px) rotateX(-10deg);
		transform-origin: center top;
		animation-timing-function: ease-in;
	}
	100% {
		opacity: 1;
		transform: perspective(600px) rotateX(0deg);
		transform-origin: center top;
		animation-timing-function: ease-out;
	}
}
.tdHingeFlipOut { animation-name: tdHingeFlipOut; }
@keyframes tdHingeFlipOut {
	0% {
		opacity: 1;
		transform: perspective(600px) rotateX(0deg);
		transform-origin: center top;
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
	50% {
		transform: perspective(600px) rotateX(-10deg);
		transform-origin: center top;
		animation-timing-function: ease-in;
	}
	100% {
	opacity: 0;
		transform: perspective(600px) rotateX(0deg);
		transform-origin: center top;
		animation-timing-function: ease-out;
	}
}
/* Drop In */
.tdDropInLeft { animation-name: tdDropInLeft; }
@keyframes tdDropInLeft {
	0% { opacity: 0; }
	1% {
		opacity: 1;
		transform: rotate(2deg) translateY(-15px);
		transform-origin: right bottom;
		animation-timing-function: ease-in;
	}
	50% {
		opacity: 1;
		transform: rotate(0) translateY(0px);
		transform-origin: right bottom;
		animation-timing-function: ease-out;
	}
	75% {
		transform: rotate(-0.5deg) translateY(0px);
		transform-origin: left bottom;
		animation-timing-function: cubic-bezier(0.59, 0, 1, 0.375);
	}
	100% {
		opacity: 1;
		transform: rotate(0) translateY(0px);
		transform-origin: center bottom;
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
}
.tdDropInRight { animation-name: tdDropInRight; }
@keyframes tdDropInRight {
	0% { opacity: 0; }
	1% {
		opacity: 1;
		transform: rotate(-2deg) translateY(-15px);
		transform-origin: left bottom;
		animation-timing-function: ease-in;
	}
	50% {
		opacity: 1;
		transform: rotate(0) translateY(0px);
		transform-origin: left bottom;
		animation-timing-function: ease-out;
	}
	75% {
		transform: rotate(0.5deg) translateY(0px);
		transform-origin: right bottom;
		animation-timing-function: cubic-bezier(0.59, 0, 1, 0.375);
	}
	100% {
		opacity: 1;
		transform: rotate(0) translateY(0px);
		transform-origin: center bottom;
		animation-timing-function: cubic-bezier(0, 0.59, 0.375, 1);
	}
}
/* Plop Entrances */
.tdPlopIn { animation-name: tdPlopIn; }
@keyframes tdPlopIn {
	0% {
		opacity: 0;
		transform: scale(0.9, 0.9);
	}
	10% {
		opacity: 1;
		transform: scale(0.7, 1.3);
	}
	70% { transform: scale(1.1, 0.95); 	}
	90% { transform: scale(0.97, 1.05); 	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}
.tdPlopInDown { animation-name: tdPlopInDown; }
@keyframes tdPlopInDown {
	0% {
		opacity: 0;
		transform: scale(0.9, 0.8);
		transform-origin: center top;
	}
	10% {
		opacity: 1;
		transform: scale(0.8, 1.3);
		transform-origin: center top;
	}
	70% {
		transform: scale(1, 0.95);
		transform-origin: center top;
	}
	100% {
		opacity: 1;
		transform: scale(1);
		transform-origin: center top;
	}
}
.tdPlopInUp { animation-name: tdPlopInUp; }
@keyframes tdPlopInUp {
	0% {
		opacity: 0;
		transform: scale(0.9, 0.8);
		transform-origin: center bottom;
	}
	10% {
		opacity: 1;
		transform: scale(0.8, 1.3);
		transform-origin: center bottom;
	}
	70% {
		transform: scale(1, 0.95);
		transform-origin: center bottom;
	}
	100% {
		opacity: 1;
		transform: scale(1);
		transform-origin: center bottom;
	}
}