html, body 
{
	background-color : #000;
	margin : 0;
	padding : 0;
	overflow : hidden;
	width : 100%;
	height : 100%;
}

#game-wrapper
{
	position : relative;
	background-position : center;
	background-repeat : no-repeat;
	background-size : auto 100%;
	margin-left : auto;
	margin-right : auto;
}

#game-wrapper canvas 
{
	position : absolute;
	width : 100%;
	height : 100%;
	margin : 0 auto;
}

/* we are assuming the warning is the img tag, it has a set size */
#game-wrapper .warning
{
	position : relative;
	top : 50%;
	transform : translateY(-50%);
}

#font-preloader
{
	position : absolute;
	top : -9999px;
	left : -9999px;
}


#disneyPlayer
{
	left : 50%;
	-ms-transform : translate(-50%, 0);
	-webkit-transform : translate(-50%, 0);
	-moz-transform : translate(-50%, 0);
	transform : translate(-50%, 0);
}
#btn-skip
{
	position : absolute;
	right : 12px;
	bottom : 12px;
	width : 175px;
	height : 92px;
	z-index : 100;
	background-image : url('../media/images/btn-skip.png');
	cursor : pointer;
	display : none;

	-ms-transform-origin : 100% 100%;
	-webkit-transform-origin : 100% 100%;
	-moz-transform-origin : 100% 100%;
	-o-transform-origin : 100% 100%;
	transform-origin : 100% 100%;

	-ms-transform : scale(0.5);
	-webkit-transform : scale(0.5);
	-moz-transform : scale(0.5);
	-o-transform : scale(0.5);
	transform : scale(0.5);
}


@font-face {
	font-family : 'salsbury';
	src : url('../media/fonts/Salsbury-Regular.eot?#iefix') format('embedded-opentype'),
		url('../media/fonts/Salsbury-Regular.otf')  format('opentype'),
		url('../media/fonts/Salsbury-Regular.woff') format('woff'),
		url('../media/fonts/Salsbury-Regular.ttf')  format('truetype'),
		url('../media/fonts/Salsbury-Regular.svg#Salsbury-Regular') format('svg');
  font-weight : normal;
  font-style : normal;
}

@font-face {
	font-family : 'angostura';
	src : url('../media/fonts/angostura_rg-webfont.eot');
	src : url('../media/fonts/angostura_rg-webfont.eot?#iefix') format('embedded-opentype'),
		 url('../media/fonts/angostura_rg-webfont.woff2') format('woff2'),
		 url('../media/fonts/angostura_rg-webfont.woff') format('woff'),
		 url('../media/fonts/angostura_rg-webfont.ttf') format('truetype'),
		 url('../media/fonts/angostura_rg-webfont.svg#angostura_rgregular') format('svg');
	font-weight : normal;
	font-style : normal;
}

@font-face {
	font-family : 'angostura';
	src : url('../media/fonts/AngosturaBl-Regular.eot?#iefix') format('embedded-opentype'),
		url('../media/fonts/AngosturaBl-Regular.otf')  format('opentype'),
		url('../media/fonts/AngosturaBl-Regular.woff') format('woff'), 
		url('../media/fonts/AngosturaBl-Regular.ttf')  format('truetype'), 
		url('../media/fonts/AngosturaBl-Regular.svg#AngosturaBl-Regular') format('svg');
	font-weight : bold;
	font-style : normal;
}




/* Begin iOS 7 CSS */
#ios7 {
	display: none;
}

@media only screen and (max-device-width: 480px) {	

	#ios7 {
		margin: 0 auto;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: url('../media/images/ios_patch/ios7-bg-fill.png'); 
		z-index: 1000;
		text-align: center;
	}

	#ios7 #box {
		width: 86%;
		height: 43%;
		margin: 2%;
		border: solid 1px white;
		border-radius: 5px;
		text-align: left;
		padding: 5%;
		overflow: hidden;
		display: table;
	}

	#ios7 #box #message {
		font-family: Matterhorn, Arial, Helvetica, sans-serif;
		font-size: 13.8pt;
		display: table-cell;
		vertical-align: middle;
		color: #ffffff;
		width: 100%;
		padding-top: 2%;
		height: 100px;
	}

	#ios7 #icon {
		float: left;
		margin: 3% 4%;
	}

	#ios7 #add-button {
		float: right;
		margin: 3% 4% 3% 0;
	}

	#ios7 #close-button {
		position: absolute;
		right: 17px;
		top: 18px;
	}

	#ios7 #options-button {
		position: relative;
		top: 2px;
		margin-top: -2px;
	}
}


@media only screen and (orientation: portrait){	

	#ios7 #box {
		height: 90%;
		text-align: center;
	}

	#ios7 #icon {
		margin: -100% 40% 0%;
		top: -10%;
		float: none;
		clear: both;
	}
	
	#ios7 #add-button {
		margin: 30% 40% -60%;
		float: none;
		clear: both;
	}
}