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;
font-family:arial;
font-size:20px;
}

.aqblank{padding:10px;margin-bottom:10px;width:100px;}

#fb1{ width:100px;position:relative;}
#fb1 img{width:32px;position:absolute;right:0px;top:-5px;}

#fb2{ width:100px;position:relative;}
#fb2 img{width:32px;position:absolute;right:0px;top:-5px;}

a:link {  text-decoration: none;color:#fff;}
a:visited {  text-decoration: none;color:#fff;}
a:hover {  text-decoration: underline;color:#fff;}
a:active {  text-decoration: underline;color:#fff;}
#strux2{display:none;}



.spacedown{height:40px;width:100%;float:none;clear:both;}

#texArea2{padding:15px;min-height:350px;}

audio{width:252px;}

#audioArea{width:300px;height:350px;text-align:center;border-radius:2px;float:left;}

#playhead{width:100px;height:100px;cursor:pointer;margin:auto;margin-top:90px;}
#playhead img{width:100%;}
#playhead:hover{opacity:.7;}

#texArea{width:900px;height:430px;background-color:white;margin:auto;margin-top:30px;font-size:16px;} 


#qArea{float:left;margin-left:10px;width:550px;box-sizing: border-box;padding:20px;padding-top:0px;}
.qarea{margin-bottom:10px;}
 

#checkButang{padding:8px;border:2px solid grey;border-radius:4px;text-align:center;width:130px;margin-right:15px;cursor:pointer;margin-top:8px;}
#checkButang:hover{background-color:#f3f1ef;border: 2px solid #2e3131;}

#strux{border-bottom:1px solid grey;}

 
 

#clearMe{clear:both;float:none;}



#btangs{width:135px;float:right;}
#next{float:right;width:40%;text-align:center;background-color:#336e7b;border:2px solid #fff;padding:3px;border-radius:5px;color:#fff;}
#back{float:left;width:40%;text-align:center;background-color:#336e7b;border:2px solid #fff;padding:3px;border-radius:5px;margin-right:5px;color:#fff;}
#back:hover{border:2px solid #81cfe0;color:#81cfe0;}
#next:hover{border:2px solid #81cfe0;color:#81cfe0;}

#navBar{height:30px;background-color:#336e7b;color:#efefef;padding:10px;}

#structions{border-bottom:1px solid grey;font-size:14px;padding-top:10px;padding-bottom:10px;margin-bottom:5px;}


@media screen and (max-width:930px) {
#texArea{width:90%;}
#qArea{width:400px;box-sizing: border-box;padding:20px;padding-top:0px;}
}


@media screen and (max-width:840px) {
#qArea{width:350px;}
}


@media screen and (max-width:775px) {
#playhead{width:70px;height:0px;margin-top:20px;}
#audioArea{width:100%;height:70px;border:none;text-align:center;float:none;}
#texArea2{padding-top:0px;}
#strux{display:none;}
#strux2{display:block;margin-top:10px;}
#qArea{float:none;margin-left:0px;width:100%;padding:20px;text-align:center; }
.opbutang{margin:auto;margin-top:8px;}
#o1{float:none;}
.qarea{margin-bottom:0px;}
.spacedown{height:100px;}



#checkButang{margin:auto;margin-top:8px;}

}