body,html{margin:0px;padding:0px;font-family: 'Nunito', sans-serif;background-color:#ECECEC;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;


}


#promo{text-align:center;margin:auto;}



#loadmsg{
	position:relative;
	text-align:center;
	padding-top:150px;
	}

#hsarea{text-align:center;}

#besText{float:left;margin-left:20px;margin-top:4px;width:100px;}
#levText{float:left;margin-left:20px;margin-top:4px;width:100px;}
#scoreText{float:left;margin-top:4px;margin-left:20px;width:130px;}

#p2Text{margin-left:50px;margin-top:4px;float:right; width:190px;}
#livesArea{float:right; width:120px;}

#banner1{width:100%;height:60px;background-color:#CF000F;text-align:center;}
#banner2{width:100%;height:25px;background-color:#E74C3C;}

 
#bannerHolder{width:100%;background-color:#C0392B;}
#banner{width:800px;height:100px;margin:auto;margin-bottom:30px;} 
#banner .img{margin:auto;width:auto;}
#gameArea{border:1px solid #E74C3C;width:800px;height:460px;margin:auto;background-color:#fff;margin-top:40px;margin-bottom:10px;}


#csplit1{float:left;height:460px;width:50%;}
#csplit2{float:right;height:460px;width:50%;}

#split1{float:left;height:390px;width:50%;}
#split2{float:right;height:390px;width:50%;}
#clockArea{width:100%;height:20px;text-align:center;}
#scoreArea{width:100%;height:40px;background-color:#E74C3C;color:#fff;}

#bar1{width:98%;height:40px;background-color:#E74C3C;color:#fff;padding-left:2%;}
#bar2{width:98%;height:40px;background-color:#E74C3C;color:#fff;padding-left:2%;}

#diceArea{width:100%;text-align:center;}
#questionArea{ }
#pointsDisplay{font-size:30px;}

.lpix{margin-top:30px;}

.title1{width:100%;text-align:center;margin-top:100px;}

#butang1{width:150px;margin:auto;margin-bottom:15px;padding:5px;text-align:center;border:1px solid grey;border-radius:5px;cursor:pointer;}
#butang2{width:150px;margin:auto;margin-bottom:15px;padding:5px;text-align:center;border:1px solid grey;border-radius:5px;cursor:pointer;}
#butang3{width:150px;margin:auto;margin-bottom:15px;padding:5px;text-align:center;border:1px solid grey;border-radius:5px;cursor:pointer;}

.rollfx:hover{opacity:.4;}

.spacer30{width:100%;height:30px;}
.spacer15{width:100%;height:15px;}


#questionText{font-size:24px;text-align:center;padding-top:20px;}
#questionTextSmall{font-size:18px;text-align:center;padding-top:20px;}
#wordText{font-size:24px;margin-bottom:25px;text-align:center;border-top:1px solid grey;border-bottom: 1px solid grey;}
#wordText2{font-size:24px;margin-bottom:15px;text-align:center;border-top:1px solid grey;border-bottom: 1px solid grey;}
#zampleText{margin:auto;color:#333;text-align:center;}

.option1{margin:auto;text-align:center;padding:5px;font-size:18px;border:1px solid grey;width:250px;margin-top:10px;border-radius:6px;cursor:pointer;}
.option1:hover{background-color:#D2D7D3;}

#sqholder{margin:auto;width:280px;}

.option1sq{float:right;margin:auto;text-align:center;padding:5px;padding-bottom:10px;padding-top:10px;font-size:18px;border:1px solid grey;width:120px;margin-top:10px;border-radius:6px;cursor:pointer;}
.option1sq:hover{background-color:#D2D7D3;}

.option1sql{float:left;margin:auto;text-align:center;padding:5px;padding-bottom:10px;padding-top:10px;font-size:18px;border:1px solid grey;width:120px;margin-top:10px;border-radius:6px;cursor:pointer;}
.option1sql:hover{background-color:#D2D7D3;}

.option1uc{margin:auto;text-align:center;padding:2px;font-size:18px;border:1px solid grey;width:85px;margin-top:10px;border-radius:6px;cursor:pointer;}
.option1uc:hover{background-color:#D2D7D3;;}
.optionucfloat{float:left;margin-right:5px}
#panel{width:200px;margin:auto;background-color:#930;}

#gop{text-align:center;}
.gop2{margin:auto;width:260px;text-align:center;}
.gop3{width:100%;text-align:center;font-size:30px;height:40px;background-color:#C63;color:white;font-family:Tahoma, Geneva, sans-serif;}
.gop4{margin:auto;width:300px;text-align:left;padding-top:2px;padding-bottom:3px;padding-left:5px;font-size:14px;font-family:Tahoma, Geneva, sans-serif;background-color:#F3F3F3;}
.gop4a{margin:auto;width:300px;text-align:left;padding-top:2px;padding-bottom:3px;padding-left:5px;font-size:14px;font-family:Tahoma, Geneva, sans-serif;}

#struct1{margin:auto;width:80%;font-size:40px;margin-bottom:25px;margin-top:10px;}
#struct2{margin:auto;width:80%;margin-bottom:4px;}
#struct3{margin:auto;width:80%;margin-bottom:20px;}
#struct4{margin:auto;width:80%;font-size:40px;margin-bottom:25px;margin-top:10px;text-align:center;}
#struct5{margin:auto;width:80%;margin-bottom:4px;text-align:center;}
.struct6{margin:auto;width:80%;margin-bottom:4px;text-align:center;}

.exerciseAnswer1{border:2px #69F solid; border-radius:3px;text-align:center;padding-top:5px;padding-bottom:5px;font-size:18px;}
#nameInput{border:2px #69F solid; border-radius:3px;padding:10px;width:300px;text-align:center;font-size:18px;margin:auto;}
#ipHolder{width:320px;margin:auto;margin-top:30px;margin-bottom:30px;}

#hl{padding:1px;background-color:#F5F5F5;}
#clueText{font-size:14px;text-align:center;}

#crossWord{width:300px;height:66px;margin:auto;margin-bottom:15px;}
#wordSearch{width:320px;height:200px;margin:auto;}
.boxw{width:22px;height:22px;text-align:center;background-color:white;float:left;border:1px solid black;}
.boxb{width:22px;height:22px;text-align:center;background-color:black;float:left;border:1px solid black;}

.boxw2{width:36px;height:36px;font-size:30px;text-align:center;background-color:white;float:left;border:1px solid black;cursor:pointer;}

.boxw3{float:left;width:25px;height:25px;font-size:22px;text-align:center;background-color:white;margin-left:3px;border-bottom:2px solid black;cursor:pointer;}

#hanger{width:50px;overflow:hidden;float:right;margin-right:20px;position:relative;}
#hanger img{position:relative;}
#tileArea{width:320px;height:160px;}
#tileArea2{width:320px;height:40px;}

#f1{width:100%;}
.ip{width:200px;margin:auto;}

#f1a{width:50px;margin:auto;}
#f1aholder{width:50px;margin:auto;}

#f1b{width:130px;margin:auto;}
#f1bholder{width:130px;margin:auto;}
#p1b{width:130px;margin:auto;}

#enter{width:80px;background-color:#69F;color:#fff;font-size:10px;border-radius:3px;height:16px;text-align:center;padding-top:2px;margin:auto;margin-top:20px;cursor:pointer;}

#scrambleholder{margin:auto;height:25px;margin-top:10px;margin-bottom:10px;}

.hidebig{display:none;}


@media screen and (max-width:802px) {
	.hidebig{display:inline-block;}
	.hidesmall{display:none;}
	#banner{width:100%;}
 #gameArea{width:100%;border:none;}
.hidden{display:none;width:0px;}
#split1{float:none;height:390px;width:100%;}
#split2{float:none;height:390px;width:100%;}
#tileArea{width:320px;height:160px;margin:auto;}
#tileArea2{width:320px;height:40px;margin:auto;}


}

@media screen and (max-width:650px) {
 #csplit1{float:none;height:auto; width:200px;margin:auto;}
 #csplit1 img{width:200px;height:200px;margin:auto;}
#csplit2{float:none;height:auto;width:100%; }
.title1{width:100%;text-align:center;margin-top:30px;}
#besText{display:none;width:0px;}
 #tileArea{width:320px;height:160px;padding-top:50px;}
#tileArea2{width:320px;height:40px;}
#levText{margin-left:20px;width:60px;font-size:12px;}
#scoreText{margin-left:20px;width:60px;font-size:12px;}
#p2Text{margin-left:20px;width:80px;font-size:12px;}

}


@media screen and (max-width:400px) {
 #banner img{width:100%;}



#livesArea{ width:120px;font-size:12px;}
#livesArea img{ width:16px;height:16px; }
 
 
 
 
}