/* --------------- STYLES FOR INJECTED JAVASCRIPT ELEMENTS -------------- */

#myBackground { position: absolute; z-index:1; width: 100%; height: 100%; top: 0; left: 0; }
#myScreen { position: absolute; z-index:2; width: 100%; height: 100%; top: 0; left: 0;	}
#window { margin: 0; padding: 0; width: 99%; height: 1000px; position: relative; }
#wrapper { position: absolute; z-index:15; width: 100%; height: 100%; top: 0; left: 0; }

#dropZone {
	display: block; position: absolute; z-index:15;
	width: 226px; height: 86px; top: 250px; left: 0px;
}

.dropZoneBG { background: transparent url(../_img/dropZone.gif) 0px 0px no-repeat; }
body .dropZoneBG-dragging { background: transparent url(../_img/dropZone.gif) 0px -86px no-repeat; }

#dropClose {
	display: block; position: absolute; z-index:16;
	width: 22px; height: 22px; top: 10px; left: 10px;
	background: transparent url(../_img/closeButton.gif) 0px 0px no-repeat;
}

#dropClose:hover { 	background: transparent url(../_img/closeButton.gif) 0px -22px no-repeat; }

.car span {
	display: block;
	position: absolute;
	top: -80px; left: 0px;
	width: 100%;
	height: 0px;
	padding-top: 73px;
	overflow: hidden;
	background: url(../_img/dragMe.gif) top center no-repeat;
	cursor: default;
}

#myCars {
	position: absolute; z-index:30;
	width: 100px; height: 50px; 
	top: 0; left: 0;
}

#myCarA {
	display: block; position: absolute; z-index:31;
	width: 140px; height: 40px; bottom: 0; left: 0;
}
.myCarA-R {	background: transparent url(../_img/bus.png) 0px 0px no-repeat; }
.myCarA-L {	background: transparent url(../_img/bus.png) 0px -40px no-repeat; }

#myCarB {
	display: block; position: absolute; z-index:32;
	width: 77px; height: 30px; bottom: 0; left: 0;
}
.myCarB-R {	background: transparent url(../_img/beetle.png) 0px 0px no-repeat; }
.myCarB-L {	background: transparent url(../_img/beetle.png) 0px -30px no-repeat; }

#myCarC {
	display: block; position: absolute; z-index:33;
	width: 77px; height: 35px; bottom: 0; left: 0;
}
.myCarC-R {	background: transparent url(../_img/truck.png) 0px 0px no-repeat; }
.myCarC-L {	background: transparent url(../_img/truck.png) 0px -35px no-repeat; }

#myCarD {
	display: block; position: absolute; z-index:34;
	width: 157px; height: 50px; bottom: 0; left: 0;
}
.myCarD-R {	background: transparent url(../_img/semi.png) 0px 0px no-repeat; }
.myCarD-L {	background: transparent url(../_img/semi.png) 0px -50px no-repeat; }

#myCarE {
	display: block; position: absolute; z-index:35;
	width: 100px; height: 30px; bottom: 0; left: 0;
}
.myCarE-R {	background: transparent url(../_img/camaro.png) 0px 0px no-repeat; }
.myCarE-L {	background: transparent url(../_img/camaro.png) 0px -30px no-repeat; }


#myCity1 {
	position: absolute; z-index: 10;
	width: 100%; height: 460px;
	left: 0; top: 10000px;
	background: transparent url(../_img/city1.gif) 0 0 repeat-x;
}

#myCity2 {
	position: absolute; z-index: 11;
	width: 100%; height: 409px;
	left: 0; top: 10000px;	
	background: transparent url(../_img/city2.gif) 0 0 repeat-x;
}

#loadingCircle {
	display: block; position: absolute; z-index:500;
	width: 218px; height: 78px; top: 0px; left: 0px;
	overflow:hidden;
	background: transparent url(../_img/loadingCircle.gif) 0px 0px no-repeat;
}


.spinner {
	position: absolute; z-index: 140;
	width: 37px; height: 39px;
	background: transparent url(../_img/spinner.gif) 0px 0px no-repeat;
	display: none;
}

#pauseMask {
	position: absolute; z-index:10000;
	top: 0; left: 0; height: 0; width: 0;
	background: #444;
}
#pauseWindow {
	position: absolute; z-index:20000;
	top: 0; left: 0; width: 300px;
	background: #444; border: 4px solid #333;
}
#pauseWindow .pausedHeader {
	margin: 10 0;	padding: 0 0 165px 0;
	background: transparent url(../_img/seedling.gif) center 45px no-repeat; 	color: #ccc;
}
#pauseWindow .pausedHeader h3 { font: 18px georgia; text-align: center; margin: 10px 0 0 0; }
#pauseWindow .pausedHeader h4 { font: 12px trebuchet ms; text-align: center; margin: 0px; color: #888; }
#pauseWindow #explaination { display: none; margin: 0px; padding: 10px; }
#pauseWindow p { font-size: 11px; color: #ccc; padding: 0; }
#pauseWindow #pauseResumeButtons { text-align: center; margin: 8px 0; }
#pauseWindow #pauseResumeButton { color: #0e0; font-size: 13px; border: 1px solid #555; padding: 4px; background: #333; }
#pauseWindow #pauseResumeButton:hover { background: #222; border: 1px solid #999; }
#pauseWindow #pauseWhyButton { color: #bbb; font-size: 11px; text-decoration: underline; }
#pauseWindow #pauseWhyButton:hover { color: #fff; }
#pauseWindow p.pausedStrong { text-align: center; padding: 3px; color: #fff; font-weight: bold; background: #333; border: 1px solid #555; }