body{margin:0px;padding:0px;
background-image:url(sos.png);
 -webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
 }


#spacer{width:100%;height:30px;float:none;clear:both;}
#spacer2{width:100%;height:5px;float:none;clear:both;}

 #gameArea{width:800px;margin:auto;min-height:400px;margin-top:25px;margin-bottom:10px;background-color:#FFF;position:relative;}
 
 .question{text-align:center;clear:both;float:none;padding-top:30px;margin:auto;width:700px;padding-top:40px;padding-bottom:50px;font-family:Arial, Helvetica, sans-serif;font-size:25px;}
 
 .option{margin-left:8px;margin-right:8px;width:200px;font-family:Arial, Helvetica, sans-serif;font-size:20px;text-align:center;float:left;
 border:1px solid #ececec;border-radius:3px;cursor:pointer;padding:5px;background-color:#ececec;}
 
 .option:hover{background-color:#89c4f4;}

#opHolder{width:684px;margin:auto;}
 
 .correctFeedback{width:150px;
 float:none;clear:both;margin-top:40px;
padding:5px;
font-size:30px;
color:#FFFFCC;
background-color:#009900;
font-family:Arial, Helvetica, sans-serif;
text-align:center;
margin-left:20px;}
 .incorrectFeedback{width:150px;
padding:5px;float:none;clear:both;margin-top:40px;
font-size:30px;
color:#FFFFCC;
background-color:#CC3300;
font-family:Arial, Helvetica, sans-serif;
text-align:center;

margin-left:20px;
margin-right:12px;}

#feedback3{
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:20px;
width:100%;
background-color:#336E7B;
color:#fff;
position:absolute;
bottom:0px;
height:0px;	
}

#tFeedbackSpacer{width:100%;height:30px;float:none;clear:both;}
#tFeedback{width:100%;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:18px;float:none;clear:both;}


#endPage{width:100%;min-height:80px;float:left;font-size:40px;padding:20px;background-color:#c7002b;color:#fff;font-family:Arial, Helvetica, sans-serif;box-sizing:border-box;text-align:center;}
#endPageR{width:100%;min-height:40px;float:left;font-size:30px;padding:10px;background-color:#c7002b;color:#fff;font-family:Arial, Helvetica, sans-serif;box-sizing:border-box;text-align:center;}

.feedback1{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:20px;padding-top:20px;padding-bottom:30px;}
.feedback2{width:200px;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:18px;padding-top:9px;padding-bottom:3px;background-color:#3caf47;color:#FFFFCC;}
.feedback2a{width:200px;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:18px;padding-top:9px;padding-bottom:3px;margin-top:3px;background-color:#e8202d;color:#FFFFCC;}
.feedback3{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:18px;padding-top:23px;}

.feedback4x{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:12px;padding-top:30px;}
.feedback4{background-color:#5C97BF;color:#fff;margin:auto;width:240px;padding-top:5px;padding-bottom:5px;margin-bottom:10px;font-family:Arial, Helvetica, sans-serif;font-size:17px;text-align:center;border-radius:3px;cursor:pointer;}
.feedback5{background-color:#5C97BF;color:#fff;margin:auto;width:240px;padding-top:5px;padding-bottom:5px;margin-bottom:10px;font-family:Arial, Helvetica, sans-serif;font-size:17px;text-align:center;border-radius:3px;cursor:pointer;}

 .feedback4:hover{opacity:.7;}
  .feedback5:hover{opacity:.7;}


#butang2{text-align:center;cursor:pointer;}
#butang2:hover{opacity:.7;}

.feedback6{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:28px;padding-top:23px;}
.feedback6a{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:18px;padding-top:13px;}
.feedback6b{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:18px;padding-top:13px;}


#intro1{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:25px;padding-top:20px;padding-bottom:30px;}
#intro1 img{width:90%;margin:auto;}

#intro2{width:70%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:16px;padding-top:23px;}
#intro3{width:90%;margin:auto;text-align:center;font-family:Arial, Helvetica, sans-serif;font-size:12px;padding-top:30px;}

#bar1{width:50%;float:left;height:64px;background-color:#c7002b;color:#fff;font-family:Arial, Helvetica, sans-serif;}
#bar2{width:50%;float:left;height:64px;background-color:#c7002b;color:#fff;font-family:Arial, Helvetica, sans-serif;}
#qText{margin-left:10px;float:left;font-size:20px;}
#scoreText{margin-right:10px;float:right;font-size:20px;}

#butang1{width:110px;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;}

#feedback1{float:right;position:relative;}
#feedback1 img{width:30px;position:absolute;right:0px;top:-5px;}

@media screen and (max-width:800px){
	 #gameArea{width:100%;}
	 .question{margin-left:20px;width:90%;
}

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

#opHolder{width:280px;margin:auto;}
	 #gameArea{width:100%;min-height:460px;}
	 .question{margin-left:20px;width:90%;font-size:23px;}
	  .option{margin-left:20px;width:80%;padding-top:5px;padding-bottom:5px;margin-bottom:10px;font-family:Arial, Helvetica, sans-serif;font-size:20px;text-align:center;float:left;
 border:1px solid grey;border-radius:3px;cursor:pointer;}
#tFeedbackSpacer{width:100%;height:25px;float:none;clear:both;}
}


@media screen and (max-width:450px){
.question{padding-top:30px;padding-bottom:40px;}
}