@charset "ISO-8859-1";

*{
	padding: 0;
	margin: 0;
	border: 0;
	//cursor:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}
@font-face {
    //font-family: Gotham;
    //src:url(../../fonts/Gotham-Medium.otf);
}
html, body{
	background-color:#FFF;
	//cursor:pointer;
	overflow:hidden;
	width:100%;
	height:100%;
	//font-family:Gotham, Arial, sans-serif;
	font-family:Arial, sans-serif;
	-webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	position:fixed;
	top:0px;
	left:0px;
}
::selection {
	background: transparent;
}
::-moz-selection {
	background: transparent;	
}
#testBack{
	position:absolute;
	top:-83px;
	display:none;
}
#mainContainer{
	position:fixed;
	top:0px;
	bottom:0px;
	left:0px;
	right:0px;
	background-color:#FFF;
}
#allBorder{
	position:absolute;
	top:50%;
	left:50%;
	width:400px;
	height:570px;
	margin:-300px 0px 0px -200px;
	//border:1px solid #333;
	//box-sizing:border-box;
}
.bordery{
	position:absolute;
	height:100px;
	width:400px;
	border:1px solid #333;
	box-sizing:border-box;
	z-index:-1000;
	display:none;
}
#border0{top:0px;}
#border1{top:100px;}
#border2{top:200px;}
#border3{top:300px;}
#border4{top:400px;}
#allContainer{
	width:400px;
	height:570px;
	border-radius:15px;
	background-color:#DDD;
}
@media screen and (max-width:400px), screen and (max-height: 600px){
#allContainer{
	//top:10px;
	//margin-top:-65px;
	transform:scale(0.75);/*0.75*/
}}
/*
@media screen and (max-width:400px), screen and (max-height: 600px){
#allContainer{
	position:absolute;
	top:0;
	left:0;
	margin:0px 0px 0px 0px;
}}
*/
#layerContainer{
	position:absolute;
	top:0px;
	left:0px;
	//top:50%;
	//left:50%;
	height:500px;
	width:400px;
	//margin:-250px 0px 0px -200px;
	background-color:#EEE;
}
.layerButton{
	position:absolute;
	left:0px;
	width:400px;
	height:100px;
	font-size:30px;
	padding-top:15px;
	text-align:center;
	background-color:#F0F;
	border:solid 2px #000;
	box-sizing:border-box;
	cursor:pointer;
	//display:none;
}
#layer0{
	top:0px;
	left:400px;
	background-color:#555;
	display:none;
}
#layer1{
	top:0px;
	background-color:#62A4C8;
}
#layer2{
	top:100px;
	background-color:#888;
}
#layer3{
	top:200px;
	background-color:#8041A5;
}
#layer4{
	top:300px;
	background-color:#CCC;
}
#layer5{
	top:400px;
	background-color:#EEE;
}
.layerBack{
	width:400px;
	height:100px;
	background-color:#333;
	border:solid 2px #000;
	box-sizing:border-box;
	cursor:pointer;
}
#submitButton{
	position:absolute;
	top:500px;
	left:260px;
	height:70px;
	width:140px;
	color:#FFF;
	font-size:30px;
	text-align:center;
	padding-top:15px;
	box-sizing:border-box;
	border-bottom-left-radius:15px;
	border-bottom-right-radius:15px;
	background-color:#333;
	cursor:pointer;
	//display:none;
}
#submitCover{
	position:absolute;
	top:500px;
	left:260px;
	height:70px;
	width:140px;
	display:none;
}
#instructions{
	position:absolute;
	top:500px;
	left:12px;
	height:70px;
	width:260px;
	font-size:19px;
	padding-top:10px;
	box-sizing:border-box;
	//display:none;
}
#incorrectWindow{
	position:absolute;
	top:0px;;
	left:0px;
	height:500px;
	width:400px;
	background-color:#F00;
	opacity:0.5;
	display:none;
}
#correctWindow{
	position:absolute;
	top:0px;;
	left:0px;
	height:500px;
	width:400px;
	background-image:url(correctImage.png);
	background-size:contain;
	display:none;
}
#correctText{
	position:absolute;
	top:500px;
	left:12px;
	height:70px;
	width:260px;
	font-size:20px;
	padding-top:10px;
	box-sizing:border-box;
	display:none;
}
#tryAgain{
	position:absolute;
	top:510px;
	left:340px;
	height:50px;
	width:50px;
	background-image:url(tryAgain.svg);
	cursor:pointer;
	display:none;
}
#log{
	position:absolute;
	left:0px;
	bottom:0px;
	width:300px;
	height:100px;
	background-color:#FF0;
	display:none;
}
#testPos{
	position:absolute;
	width:30px;
	height:30px;
	background-color:#F0F;
	display:none;
}
#testBox{
	position:absolute;
	width:30px;
	height:30px;
	background-color:#00F;
	display:none;
}