/*
Here are some custom animations we use for the viewport.
According to some guy, things might not work in IE if the @keyframes are not the
first thing in the stylesheet.
*/

@-webkit-keyframes fadeout {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}
@keyframes fadeout {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

@-webkit-keyframes fadein {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes fadein {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.fadeout {
	-webkit-animation-name: fadeout;
	animation-name: fadeout;
	-webkit-animation-duration: 750ms;
	animation-duration: 750ms;
	opacity: 0;
}

.fadein {
	-webkit-animation-name: fadein;
	animation-name: fadein;
	-webkit-animation-duration: 500ms;
	animation-duration: 500ms;
	opacity: 1;
}