body{margin:0px;padding:0px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
background-color:#EEEFF1;

}
@font-face {
    font-family: tf;
    src: url('ERASMD.TTF'); 
	 
    }

#banner{height:60px;background-color:#333;}


#gameArea{width:900px;height:450px;margin:auto;border:1px solid #666;background-color:#eae7e2;}

#gameAreaLeft{width:400px;height:400px;margin:25px;margin-top:0px;margin-bottom:25px;float:left;margin-right:-30px;position:relative;}
#gameAreaRight{width:300px;height:100px;float:right;border:2px solid grey;margin-top:10px;margin-right:130px;}

#gameAreaRight2{width:290px;min-height:100px;float:right;border:2px solid grey;margin-top:30px;margin-right:130px;padding:5px;font-family:tf;margin-bottom:20px;}

#boxtop{width:100%;text-align:center;font-size:34px;font-family:tf;color:#fff;background-color:#333;}
#boxbottom{width:100%;text-align:center;font-size:34px;font-family:tf;}
#boxbottom2{width:100%;text-align:center;font-family:tf;}

#titleText{color:#570069;font-size:66px;font-family:tf;margin-top:30px;margin-left:20px;}
#titleText2{color:#333;font-size:18px;font-family:arial;margin-top:10px;margin-left:20px;}
#vqinput{margin-left:20px;}
#subButang{font-family:tf;text-align:center;border:1px solid grey;border-radius:3px; width:80px; padding:2px;cursor:pointer;background-color:#68C3A3;margin-left:20px;margin-top:10px;}
#subButang:hover{background-color:#BDC3C7;color:#fff;}

.tile{margin-left:5px;margin-right:5px;margin-top:5px;margin-bottom:5px;width:70px;height:70px;line-height: 45px;border:2px solid white;background-color:#FDE3A7;float:left;cursor:pointer;
text-align:center;color:white;font-size:36px;font-family: tf;}

.tile2{margin-left:5px;margin-right:5px;margin-top:5px;margin-bottom:5px;width:70px;height:55px;border:2px solid white;background-color:#FDE3A7;float:left;cursor:pointer;
text-align:center;color:white;font-size:36px;font-family: tf;padding-top:15px;}

.basicTile{background-image:url('tile2.png');width:70px;height:70px;display:none;line-height:70px;}
.biggTile{background-image:url('tile5.png');width:70px;height:70px;display:none;line-height:70px;}
.clearTile{background-image:url('tile3.png');width:70px;height:70px;line-height:70px;}
.newTile{background-image:url('tile1.png');width:70px;height:70px;display:none;line-height:70px;}
.goTile{background-image:url('tile4.png');width:70px;height:70px;line-height:18px;}

#t1{clear:both;margin-left:20px;}
#t5{clear:both;margin-left:20px;}
#t9{clear:both;margin-left:20px;}
#t13{clear:both;margin-left:20px;}


#visualTurns{width:330px;height:20px;background-color:white;margin:45px;margin-top:10px;}
.playerTurns{width:80px;background-color:#6C0;border-left:2px white solid;float:left}
.pcTurns{width:80px;background-color:#999;float:left}

.text2{font-size:14px;}
.text3{font-size:32px;}
.text4{font-size:25px;}
.text5{font-size:20px;}
.text6{font-size:14px;}

#replayButang{font-family:tf;text-align:center;border:2px solid grey;border-radius:3px; width:100px; padding:5px;cursor:pointer;background-color:#68C3A3;margin:auto;margin-top:10px;}
#replayButang:hover{background-color:#BDC3C7;color:#fff;}

#replayButang2{font-family:tf;text-align:center;border:2px solid grey;border-radius:3px; width:20%; padding:5px;cursor:pointer;background-color:#68C3A3;margin:auto;position:absolute;bottom:10px;margin-left:38%;display:none;}
#replayButang2:hover{background-color:#BDC3C7;color:#fff;}

#smallScoreArea{display:none;}

#banner{text-align:center;}

#hsarea{float:none;clear:both;text-align:center;font-family:tf;font-size:14px;width:294px;margin:auto;padding:5px;margin-top:5px;background-color:#E6E6E6;}

@media screen and (max-width:900px){
	
#gameArea{width:100%;border:none;}	
#titleImg img{width:100%;}
#gameAreaRight{margin-right:40px;}

#gameAreaRight2{margin-right:40px;}
}

@media screen and (max-width:740px){
#gameAreaLeft{width:400px;height:400px;margin:auto;margin-top:0px;margin-bottom:25px;float:none;}
#gameAreaRight{display:none;}

#gameAreaRight2{width:290px;min-height:100px;float:none;border:2px solid grey;margin:auto;margin-bottom:20px;margin-top:60px;}
#visualTurns{width:330px;height:6px;margin:auto;margin-top:10px;}
.playerTurns{height:6px;}
.pcTurns{height:6px;}
#t1{clear:both;margin-left:35px;}
#t5{clear:both;margin-left:35px;}
#t9{clear:both;margin-left:35px;}
#t13{clear:both;margin-left:35px;}
body{background-color:#eae7e2;}
#smallScoreArea{display:inline-block;font-family:tf;text-align:center;width:100%;}
#replayButang2{display:block;}
#hsarea{background-color:#fff;}
}

@media screen and (max-width:500px){
	#titleText{font-size:44px;}
}
@media screen and (max-width:440px){#banner img{width:90%;}
	#gameAreaLeft{width:340px;margin-auto;}
	#t1{clear:both;margin-left:15px;}
#t5{clear:both;margin-left:15px;}
#t9{clear:both;margin-left:15px;}
#t13{clear:both;margin-left:15px;}
.tile{margin-left:1px;margin-right:1px}
}

@media screen and (max-width:390px){
	
	#visualTurns{width:255px;height:6px;margin:auto;margin-top:10px;}
	#gameAreaLeft{width:320px;margin-auto;}
	.playerTurns{width:60px;background-color:#6C0;border-left:2px white solid;float:left}
.pcTurns{width:60px;background-color:#999;float:left}
	#gameAreaLeftx{width:340px;margin-auto;}
	#t1{clear:both;margin-left:5px;}
#t5{clear:both;margin-left:5px;}
#t9{clear:both;margin-left:5px;}
#t13{clear:both;margin-left:5px;}
.tilex{margin-left:1px;margin-right:1px}
}