/* styles for gt20 10 questions */

#stepwrap {position:fixed; overflow:hidden; display:none;font-size:1.8em; line-height:1.2em; top:20%; left:10%; 
	width:900px;height:450px;z-index:10000;}
#stepwrap .stepdiv h1 {line-height:1.2em;font-size:1.4em; color:white;}
#stepwrap .stepdiv{width:600px;height:355px;padding:20px 75px 20px 20px; text-align:left; 
	position:absolute; top:0;right:-710px; border:1px solid #777; z-index:10000;
	background:#7ac043 url('controls.png') right top no-repeat;
	border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.4); -moz-box-shadow: 5px 5px 10px rgba(0,0,0,0.4); -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.4);
}
#stepwrap .step0 {text-align:center;}
#stepwrap .button{height:20px;padding:3px;border:1px solid #777;z-index:1000;}
#stepwrap #reset{position:absolute;display:none;top:0;right:130px;width:40px;height:43px;z-index:20000;
	border-bottom-left-radius:15px;-moz-border-radius-bottomleft:15px;-webkit-border-bottom-left-radius:15px;
}
#stepwrap #next_10q,#stepwrap #prev_10q{width:40px;height:75px;z-index:20000;
	border-bottom-left-radius:15px;-moz-border-radius-bottomleft:15px;-webkit-border-bottom-left-radius:15px;
	border-top-left-radius:15px;-moz-border-radius-topleft:15px;-webkit-border-top-left-radius:15px;
}
#stepwrap #prev_10q {position:absolute;display:block;top:169px;right:130px;}
#stepwrap #next_10q {position:absolute;display:block;top:79px;right:130px;}

#stepwrap #reset:hover,#stepwrap #open:hover,#stepwrap #next_10q:hover,#stepwrap #prev_10q:hover,.stepdiv:hover{cursor:pointer;}
#stepwrap .more {font-size:1em;color:white;}
#debugdiv {position:fixed; top:20px; left:20px; width:200px;height:40px;padding:5px; border:2px solid blue;background:white;}

@media screen and (max-width:850px) and (min-width:701px) {
	#stepwrap {position:fixed; left:-150px; width:900px; font-size:1.6em; line-height:1.2em; z-index:10000;}
	#stepwrap .stepdiv{width:500px;height:355px;z-index:10000;}
}

@media screen and (max-width:700px) and (min-width:551px) {
	#stepwrap {position:fixed; left:-250px; width:900px; font-size:1.5em; line-height:1.2em; z-index:10000;}
	#stepwrap .stepdiv{width:400px;height:405px;z-index:10000;}
}

@media screen and (max-width:550px) and (min-width:451px){
	#stepwrap {position:fixed; left:-350px;width:900px; font-size:1.4em; line-height:1.1em; z-index:10000;}
	#stepwrap .stepdiv{width:300px;height:405px;z-index:10000;}
} 

@media screen and (max-width:450px) {
	#stepwrap .stepdiv h1 {line-height:1.1em;font-size:1.3em;}
	#stepwrap {position:fixed; left:-550px;width:900px; height:450px; font-size:1.1em; line-height:1.1em; z-index:10000;}
	#stepwrap .stepdiv{width:200px;height:405px;z-index:10000;padding:5px 55px 5px 5px;}
} 