body,html{margin:0px;padding:0px;background-image:url(bg.png);font-family:Verdana, Geneva, sans-serif;}




#area3{width:840px;padding:20px;background-color:#ffffef;margin:auto;}
#area3h{width:840px;padding:20px;background-color:#0b7fab;margin:auto;color:#fff;font-size:17px;}


.intro{margin-bottom:9px;}
.intro2{padding-left:20px;padding-right:20px;}

.hov{cursor:pointer;}
.hov:hover{opacity:.7;}
 
#gameArea{width:800px;min-height:460px;margin:auto;background-color:#fff;margin-top:40px;margin-bottom:10px;box-sizing: border-box;border:1px solid grey;}

#title1{text-align:center;background-color:#222324;height:20px;padding:20px;font-size:20px;color:#fff;font-family:Verdana, Geneva, sans-serif;}
 
#title2{text-align:center;}


#pix1{margin-top:2px;text-align:center;}
#butang1{width:220px;margin:auto;text-align:center;background-color:#5C97BF;height:24px;padding:5px;font-size:18px;color:#fff;font-family:Verdana, Geneva, sans-serif;cursor:pointer;border-radius:5px;margin-bottom:5px;}
#butang1:hover{opacity:.6;}

#butang2{width:220px;margin:auto;text-align:center;background-color:#5C97BF;height:24px;padding:5px;font-size:18px;color:#fff;font-family:Verdana, Geneva, sans-serif;cursor:pointer;border-radius:5px;margin-bottom:15px;}
#butang2:hover{opacity:.6;}

#butang3{width:120px;margin:auto;text-align:center;background-color:#5C97BF;height:24px;padding:5px;font-size:18px;color:#fff;font-family:Verdana, Geneva, sans-serif;cursor:pointer;border-radius:5px;}
#butang3:hover{opacity:.6;}

#butangHolder{width:220px;margin:auto;}



 #butangholder{width:310px; margin:auto;}
 

#promo{margin:auto;text-align:center;margin-top:10px;}

 
#spacer{width:100%;height:20px;}
 
#spacer2{width:100%;height:10px;clear:both:float:none;}

#spacer3{width:100%;height:80px;clear:both:float:none;}



#fbb img{width:35px!important;}
#fbb{position:absolute;width:20px;top:-5px;right:10px;}





#wordArea{width:350px;height:50px;border:1px solid grey;border-radius:10px;margin:auto;background-color:#f3f1ef;}
#theword{width:294px;padding:3px;font-size:35px;float:left;text-align:center;}
#audioButang{width:44px;padding:3px;float:right;cursor:pointer;}
#audioButang img{width:44px;}
#audioButang:hover{opacity:.6;}

#structions{text-align:center;}


#buttonArea{width:320px;margin:auto;}
#b1{width:160px;text-align:center;float:left;cursor:pointer;position:relative;}
#b2{width:160px;text-align:center;float:right;cursor:pointer;position:relative;}
#b1 img{width:120px;}
#b2 img{width:120px;}
#b1:hover{opacity:.6;}
#b2:hover{opacity:.6;}
#fbArea1{clear:both;float:none;background-color:#03A678;color:#ececec;padding:5px;width:150px;font-size:19px;margin:auto;text-align:center;border-radius:5px;}
#fbArea2{clear:both;float:none;background-color:#EF4836;color:#ececec;padding:5px;width:150px;font-size:19px;margin:auto;text-align:center;border-radius:5px;}


#fp1{text-align:center;font-size:30px;font-family:Verdana, Geneva, sans-serif;}
#fp2{text-align:center;font-size:25px;font-family:Verdana, Geneva, sans-serif;}
 

.str{width:90%;padding:5px;margin:auto;}
#str1{font-size:18px;}
#str4 img{width:280px;}


#cb{width:280px;margin:auto;}


@media screen and (max-width:900px) {

#area3{width:86%;padding:20px;background-color:#ffffef;margin:auto;}
#area3h{width:86%;padding:20px;background-color:#0b7fab;margin:auto;color:#fff;font-size:17px;}

}

@media screen and (max-width:820px) {
	
#gameArea{width:100%;}
 

}








@media screen and (max-width:775px) {

#gameArea{margin-top:15px;min-height:540px;}
}





















 


@media screen and (max-width:450px) {
	#title1{font-size:25px;}
	#title2{font-size:15px;}
	 #title2 img{width:300px;}
}
 
 



@media screen  and (max-width:370px){

#wordArea{width:90%;height:50px;border:1px solid grey;margin:auto;}
#theword{width:202px;padding:3px;font-size:30px;float:left;text-align:center;}


#buttonArea{width:290px;margin:auto;}
#b1{width:140px;text-align:center;float:left;cursor:pointer;position:relative;}
#b2{width:140px;text-align:center;float:right;cursor:pointer;position:relative;}
#b1 img{width:100px;}
#b2 img{width:100px;}
}



@media screen  and (max-width:350px){

	


}