html,body {
	background: url('../media/images/bg_tile.jpg');
	margin: 0;
	padding: 0;
	height: 100%;
	overflow: hidden;
}

 #wrapper {
    padding: 23px 23px 23px 23px;
    box-sizing: border-box;
    height: 100%;
}

#game {
    background-color: #cd2b1f;
    position: relative;
    margin: 0 auto;
    box-sizing: content-box !important;
    padding: 4px;
    top: 50%;
    -ms-transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

#gameCanvas {
	display: block;
	width: 100%;
	height: 100%;
	/*position:absolute; */
	z-index:0;
}

@font-face {
    font-family: 'Kunoichi';
    src: url('../media/fonts/Kunoichi.otf') format('opentype');
    src: url('../media/fonts/Kunoichi.eot'),
    	url('../media/fonts/Kunoichi.eot?#iefix') format('embedded-opentype'), 
	    url('../media/fonts/Kunoichi.woff') format('woff'),
        url('../media/fonts/Kunoichi.ttf')  format('truetype');
}

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

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

#rotateInfo{
	display: none;
	margin: 0% 10%;
	width: 80%;
	height: 100%;
	position: absolute;
	background: url('../media/images/rotate_device.png') no-repeat center center;
	background-size: contain;
	z-index: 5;
}

.is-mobile #wrapper {
    padding: 0;
    height: auto;
}

.is-mobile #game {
   padding: 0;
   top: 0;
   -webkit-transform: none;
   transform: none;
   background-color: transparent;
}

.is-mobile {
	height: auto;
}

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

#not-supported {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    font-family: SquadaOne, Arial;
    font-weight: bold;
    color: #fff;
    background-color: #000;
    font-size: 40px;
    visibility: hidden;
}

#not-supported.shown {
    visibility: visible;
}

#not-supported p {
    position: relative;
    text-align: center;
    top: 50%;
    margin: 0 auto;
}



@media (orientation: portrait) {
	/*#rotateInfo.allow{
		display: block;
	}*/

	/*#game.allow {
		display: none;
	}*/
}