/* Left to Right (Navigation) */
@keyframes slidein {
 from {
 margin-left: 100%;
 width: 300%;
}
to {
	margin-left: 0%;
	width: 100%;
}
}

/* Shake */
@keyframes shake {
 10%, 90% {
 transform: translate3d(-1px, 0, 0);
}
 20%, 80% {
 transform: translate3d(2px, 0, 0);
}
 30%, 50%, 70% {
 transform: translate3d(-4px, 0, 0);
}
 40%, 60% {
 transform: translate3d(4px, 0, 0);
}
}


/* Swing */
@-webkit-keyframes swinging {
 0% {
-webkit-transform: rotate(10deg);
}
 50% {
-webkit-transform: rotate(-5deg)
}
 100% {
-webkit-transform: rotate(10deg);
}
}
 @keyframes swinging {
 0% {
transform: rotate(10deg);
}
 50% {
transform: rotate(-5deg)
}
 100% {
transform: rotate(10deg);
}
}


/* Fade */
.fade-in {
	opacity:0;
	-webkit-animation:fadeIn ease-in 1;
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
	-webkit-animation-fill-mode:forwards;
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
}
.fade-in.one {
	-webkit-animation-delay: 0.7s;
	-moz-animation-delay: 0.7s;
	animation-delay: 0.7s;
}
.fade-in.two {
	-webkit-animation-delay: 1.2s;
	-moz-animation-delay:1.2s;
	animation-delay: 1.2s;
}
.fade-in.three {
	-webkit-animation-delay: 1.6s;
	-moz-animation-delay: 1.6s;
	animation-delay: 1.6s;
}
.fade-in.four {
	-webkit-animation-delay: 2s;
	-moz-animation-delay: 2s;
	animation-delay: 2s;
}
@-webkit-keyframes fadeIn {
from {
opacity:0;
}
to {
	opacity:1;
}
}
@-moz-keyframes fadeIn {
from {
opacity:0;
}
to {
	opacity:1;
}
}
@keyframes fadeIn {
from {
opacity:0;
}
to {
	opacity:1;
}
}