body{margin:0px;padding:0px;}
#promo{text-align:center;}
#navArea{
width:220px;
margin-left:20px;
}

#butang1{float:left;width:20px;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;}
#butang1:hover{opacity:.6;}

#butang2{ float:left;width:20px;margin:auto;margin-left:10px;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;}
#butang2:hover{opacity:.6;}

#gameArea{
width:840px;
height:500px;
margin:auto;
background-color:white;
}




#playButang{width:40px;height:40px;text-align:center;cursor:pointer;margin:auto;}
#playButang img{width:40px;height:40px;}
#playButang:hover{opacity:.7;}




#t1{clear:both;float:none;padding-top:20px;text-align:center;width:100%;}


#structions{

clear:both;
float:none;
margin-left:20px;
font-size:20px;
}


#finalMessage{

clear:both;
float:none;
text-align:center;
font-size:20px;
}



#centerer{width:500px;margin:auto;}


 #imgHolder{float:left;}

 #quizHolder1{float:left;border:10px solid #abb7b7;width:200px;height:200px;cursor:pointer;}
 #quizHolder1:hover{border:10px solid #6c7a89;}

 #quizHolder2{float:right;border:10px solid #abb7b7;cursor:pointer;width:200px;height:200px;}
#quizHolder2:hover{border:10px solid #6c7a89;}

#option1{margin-left:10px;width:250px;text-align:center;border:1px solid grey; border-radius:4px;cursor:pointer;padding:10px;margin-top:20px;}
#option2{margin-left:10px;width:250px;text-align:center;border:1px solid grey; border-radius:4px;cursor:pointer;padding:10px;margin-top:8px;}
#option1:hover{background-color:#efefef;}
#option2:hover{background-color:#efefef;}



.piclabel{text-align:center;clear:both;float:none;}


#clearfoot{clear:both;float:none;width:100%;height:1px;}

#titleArea{font-size:20px;text-align:center;}


@media screen and (max-width:900px){
#gameArea{width:100%;}
}




@media screen and (max-width:500px){
 

 

}







@media screen and (max-width:500px){
#quizHolder1 img{width:160px;}
#quizHolder2 img{width:160px;}
#imgHolder{float:none;text-align:center;}
#centerer{width:100%; }
 #titleArea{font-size:20px;text-align:center;margin-left:none;}
 #quizHolder1{width:160px;height:160px;margin-left:10px;}
#quizHolder2{width:160px;height:160px;margin-right:10px;}
}






@media screen and (max-width:390px){
#quizHolder1 img{width:125px;}
#quizHolder2 img{width:125px;}
#imgHolder{float:none;text-align:center;}
#centerer{width:100%; }
 #titleArea{font-size:20px;text-align:center;margin-left:none;}
 #quizHolder1{width:125px;height:125px;margin-left:10px;}
#quizHolder2{width:125px;height:125px;margin-right:10px;}
}