body {
	background-color:black;
	
	width: 100%;
	height: 100%;
	margin: 0;		
	overflow: hidden;
	-webkit-text-stroke: 1px transparent;
}

.layer {
	overflow: hidden;
}

/*Orientation Screens */
.orientationLandscapeBlackBackground {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 640px;
	height: 960px;
	background-size: 640px 960px;
	background-color:rgba(0, 0, 0, 1)
}

.ipadLandscape {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-size: 700px 414px;
	background-repeat: no-repeat;
	background-position: center;
	background-image:url("../media/images/system/orientation_ipad.png");
}

.iphoneLandscape {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-size: 700px 414px;
	background-repeat: no-repeat;
	background-position: center;
	background-image:url("../media/images/system/orientation_iphone.png");
}

.container {
	-webkit-touch-callout: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
	-webkit-transform-origin: 0% 0% 0%;
	transform-origin: 0% 0% 0%;
	-webkit-transform: translate3d(0, 0, 0);
    user-select: none;			
}

.container div
{
	-webkit-transform: translate3d(0, 0, 0);
}

.container canvas {
    position: absolute;        
	
    image-rendering: auto;
    -ms-interpolation-mode: bicubic;
    /*image-rendering: -moz-crisp-edges; Causes extremely jagged edges on images*/
    /*image-rendering: -o-crisp-edges; */
	
    -webkit-transform: translate(0px, 0px);
    -moz-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    -o-transform: translate(0px, 0px);
    transform: translate(0px, 0px);		
	-webkit-transform: translate3d(0, 0, 0);
}

#ios7 { display: none; }

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

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

#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; }
#ios7 #arrow { text-align:center; width:99%;}

}

@media only screen and (orientation: portrait) and (max-device-width: 767px){
#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; }
#ios7 #arrow { text-align:center; width:99%;}
}