@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 200;
  src: local('☺'), url(../media/fonts/Montserrat-Bold.woff) format(woff);
}

@font-face {
  font-family: 'Montserrat', Arial, sans-serif;
}


html, body {
    margin:0;
    padding:0;
    width: 100%;
    height: 100%;
	background-color: #0d64a9;
    overflow: hidden;
	-ms-user-select: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -webkit-user-drag: none; 
	-webkit-user-callout: none;
	-ms-touch-action: manipulation !important;

}

image, canvas {
    position: absolute;
    overflow: hidden;
    top: 0px; 
    left: 0px;
   	background:transparent;
	background-color: transparent;
	-ms-user-select: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-drag: none; 
	-webkit-user-callout: none;	
}


#wrapper {
    position: absolute;
    top: 0px; 
    left: 0px;
	
	
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	
	-ms-transform-origin: 0% 0%; 
	-webkit-transform-origin: 0% 0%; 
	transform-origin: 0% 0%;
	/*
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-ms-perspective: 1000;
	perspective: 1000;
	*/
	
	background-image: url('../media/images/bg.png');
}

#fader {
    position: absolute;
    top: 0px; 
    left: 0px;
	background-color: #FFFFFF;
}

#canvas_overlay {
   background:transparent;
	display: none;
}
#canvas_main {
   background:transparent;
}
#canvas_floater {
	background:transparent;
	display: none;
}

/* gallery panel */
#canvas_gallery {
	position: absolute;
	background-color: #F78225;
	background: #F78225;
	display: none;
}

/* library panel */
#canvas_library {
	position: absolute;
	display: none;
	background-color: #37A3E1;
	background: #37A3E1;
}

/* ui background */
#canvas_bg {
	background-color: #118cea;
	background: #118cea;
}

/* game */
#canvas_game {
   background:transparent;
}


select {
	width: 180px;
	height: 36px;
	position: absolute;
	left: 100px;
	top: 20px;
	display: inline-block;
	
	font-family: Montserrat;
	font-size: 18px;
	font-weight: bold;
	
	background-color: #FFFFFF;
	color: #38a4e2;
	border-width: 0px;
	border-style: none;
	padding-left: 10px;
	
	-webkit-box-shadow: -2px 4px 0px 0px rgba(55,163,0,0.3);
	-moz-box-shadow: -2px 4px 0px 0px rgba(0,0,0,0.3);
	box-shadow: -2px 4px 0px 0px rgba(0,0,0,0.3);

	background-repeat: no-repeat;
	background-position: 100px 2px;
    background-size: 32px 32px;
	background-attachment: absolute;
	background-image: url('../media/images/dropdown_arrow.png');
	
	
	-webkit-appearance: none;
    -moz-appearance: none;
	appearance: none;

	
	outline:none;
	cursor: pointer;
}

select::-ms-expand {
    display: none;
}


#landscape_overlay {
    position: absolute;
    overflow: hidden;
    top: 0px; 
    left: 0px;
    width: 100%;
    height: 100%;
  	background-color: #000000;
	background: #000000;
	display: inline-block;
	background-image: url('../media/images/orientation_iphone.png');
	background-repeat:no-repeat;
	background-position: center center;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
}