IntroMoviePanel
{
	width: 100%;
	height: 100%;
	opacity: 1.0;

	background-color: #000000ff;

	// Dont get rid of this translate, it ensures we stay on top of items pre-loading behind us, and gives us a composition layer!
	transform: translatez( 1px );
	z-index: all_top_zindex;
}

@keyframes 'intro-fade-in'
{
	0%
	{
		opacity: 0.0;
	}

	100%
	{
		opacity: 1.0;
	}
}

#IntroMovie
{
	width: 100%;
	height: 100%;

	animation-name: intro-fade-in; 
	animation-delay: 0.0s;
	animation-duration: 1.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;

}


IntroMoviePanel.IntroMovieFadeOut
{
	opacity: 0.0;

	animation-name: intro-fade-out; 
	animation-delay: 0.0s;
	animation-duration: 1.0s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
}

IntroMoviePanel.IntroMovieFadeOutFast
{
	opacity: 0.0;

	animation-name: intro-fade-out; 
	animation-delay: 0.0s;
	animation-duration: 0.2s;
	animation-timing-function: bigpicture-ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
}


@keyframes 'intro-fade-out'
{
	0%
	{
		opacity: 1.0;
	}


	100%
	{
		opacity: 0.0;
	}
}