@charset "UTF-8";


body{
	margin:0px;
	padding:0px;
	border:0px;
	height:100%;
	background-color:#000000;
	color:#FFFFFF;
}

.btn{
	border-radius:25px;
	text-align:center;
	vertical-align:middle;
	background-color:#222222;
	font-size:10vh;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.btnu{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	position:fixed;
	color:#FFFFFF;
	background-color:#000000;
	text-align:center;
	vertical-align:middle;
	padding:1%;
}

.btnd{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	position:fixed;
	color:#FFFFFF;
	background-color:#000000;
	text-align:center;
	vertical-align:middle;
	padding:1%;
}

.state{
	position:fixed;
	left:0px;
	width:100%;
	color:#AAAAAA;
	background-color:#000000;
	text-align:center;
	vertical-align:middle;
	font-size:small;
}

.langimg{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	border:4px solid #AAAAAA;
	max-height:40vh;
	max-width:80vw;
}

.waitdiv{
	display:none;
	position:fixed;
	left:0px;
	top:0px;
	right:0px;
	bottom:0px;
	background-color:#000000;
	opacity: 0.8;
}

@media (orientation: landscape){
	.btn{
		font-size:50vh;
	}
	
	.btnu{
		left:0px;
		top:0px;
		width:50%;
		height:94%;
	}
	
	.btnd{
		left:50%;
		top:0px;
		width:50%;
		height:94%;
	}
	
	.state{
		top:94%;
		height:6%;
	}
}

@media (orientation: portrait){
	.btn{
		font-size:40vw;
	}
	
	.btnu{
		left:0px;
		top:0px;
		width:100%;
		height:48%;
	}
	
	.btnd{
		left:0px;
		top:48%;
		width:100%;
		height:48%;
	}
	
	.state{
		top:96%;
		height:4%;
	}
}