@media (max-device-width:760px), (max-width:960px) { /* Mobile */
	body { background-size:10%, 10%, 100%; }
}
@media (min-width:960px) and (min-device-width:760px) { /* Non-mobile */
	body { }
}

body {  background-image:url(../Images/SkyscraperLeftBorder.GIF), url(../Images/SkyscraperRightBorder.GIF), url(../Images/Backgrounds/BackgroundSky.JPG); 
	background-repeat:repeat-y, repeat-y, repeat; background-position:top left, top right, top; background-attachment:fixed, fixed, fixed;
	font-family: Arial, Helvetica, sans-serif; font-size:13px; }
p { text-align:left; margin:6px 0; }
ul { text-align:left; }
h5 { padding:0; margin:10px 0 5px; font-size:18px; font-weight:bold; text-align:left; }
h6 { padding:0 5px; margin:10px 0 5px; font-size:16px; font-weight:bold; text-align:left; }

label:hover { cursor:pointer; }
input[type=radio]:checked + label { font-weight:bold; }

.Header { width:384px; margin:auto; }
#StepSection { width:400px; margin:20px auto; padding-left:20px; }
	.Step { display:inline-block; width:120px; height:40px; padding-top:8px; box-sizing:border-box; margin-left:-20px;
		background-image:url(../Images/StepArrow-Red.png); background-size:100%; color:#FFF; text-align:center; font-size:20px; font-weight:bold; }
	.Step.Active { background-image:url(../Images/StepArrow-White.png); color:#000; }
	#StatusBox { margin-top:10px; margin-left:-10px; width:100%; padding:5px; box-sizing:border-box; background:#FFF; border:solid 3px #000; text-align:left; font-size:small; }
		.CompanyName { font-weight:bold; font-size:16px; }
		.LogoSurround { float:left; margin-right:10px; }
		.Logo.Gen { display:inline-block; text-align:center; background:url(../Images/Backgrounds/TranslucentGradient-Logo.png); background-size:100%; overflow:hidden; word-wrap:break-word; box-sizing:border-box; } /* Copy from Style-Structure. Needed for people who forego logos */
	
.WarningBox, .InfoBox { margin:auto; width:80%; padding:5px; box-sizing:border-box; background:#FFF; border:solid 3px #F00; text-align:left; font-size:small; }
	.WarningBox p, .InfoBox p { text-indent:15px; }
.InfoBox { border-color:#000; }

#Content { min-width:475px; max-width:900px; width:50%; margin:auto; text-align:center; }
	.notes { text-align:left; font-style:italic; }
	.invalid { color:#C00; }
	.label { font-weight:bold; }


.ThemeBtn { padding: 10px 20px; color:#eFe; border-top: 1px solid #ccc; background:#090; 
   background: -webkit-gradient(linear, left top, left bottom, from(#0C0), to(#090)); background: -webkit-linear-gradient(top, #0C0, #090); background: -moz-linear-gradient(top, #0C0, #090);
   background: -ms-linear-gradient(top, #0C0, #090); background: -o-linear-gradient(top, #0C0, #090);
   -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	 -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; text-shadow: rgba(0,0,0,.4) 0 1px 0;
   font-size:20px; font-weight:bold; text-decoration: none; vertical-align: middle; }
	.ThemeBtn:hover { border-top-color: #060; background:#060; color:#fff; cursor:pointer; }
	.ThemeBtn:active { border-top-color:#090; background:#090; color:#fff; }
.OptionBtn { width:180px; margin:0 10px; padding:2px; color:#010; border-top: 1px solid #ccc; background:#F90; 
   background: -webkit-gradient(linear, left top, left bottom, from(#FC0), to(#F90)); background: -webkit-linear-gradient(top, #FC0, #F90); background: -moz-linear-gradient(top, #FC0, #F90);
   background: -ms-linear-gradient(top, #FC0, #F90); background: -o-linear-gradient(top, #FC0, #F90);
   -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	 -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; 
   font-size:12px; text-decoration: none; vertical-align: middle; }
	.OptionBtn:hover { border-top-color: #F60; background:#F60; color:#000; cursor:pointer; }
	.OptionBtn:active { border-top-color:#F90; background:#F90; color:#000; }

/* Page 0 */
.RuleIntro { margin-top:20px; }
.RulesBox { margin:auto; width:100%; height:300px; padding:5px; box-sizing:border-box; background:#FFF; border:solid 3px #000; overflow:scroll; text-align:left; font-size:small; }
.AcceptBtn { display:block; padding: 10px 20px; color:#eFe; border-top: 1px solid #ccc; background:#090; 
   background: -webkit-gradient(linear, left top, left bottom, from(#0C0), to(#090)); background: -webkit-linear-gradient(top, #0C0, #090); background: -moz-linear-gradient(top, #0C0, #090);
   background: -ms-linear-gradient(top, #0C0, #090); background: -o-linear-gradient(top, #0C0, #090);
   -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	 -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; text-shadow: rgba(0,0,0,.4) 0 1px 0;
   font-size:40px; font-weight:bold; text-align:center; text-decoration: none; vertical-align: middle; }
	.AcceptBtn:hover { border-top-color: #060; background:#060; color:#fff; cursor:pointer; }
	.AcceptBtn:active { border-top-color:#090; background:#090; color:#fff; }

/* Page 1 */
#noscript { min-width:475px; max-width:900px; width:50%; margin:auto; text-align:center; } /* Like Content */

.radioOption { text-align:left; margin-bottom:5px; }
.SubmitSurround { margin-top:20px; text-align:center; }

/* Page 2 */
.PreStepInstructions { min-width:475px; max-width:900px; width:50%; margin:auto; padding-top:10px; }

/* Page 2b */
#ChangeBox { display:none; text-align:right; margin:10px; }
#TimeOffset, #LocalTime { margin-left:20px; }
#StyleChoiceBox { width:320px; margin:auto; text-align:center; }
	.ThumbnailBox { display:inline-block; width:100px; text-align:center; font-weight:bold; cursor:pointer; }
		.ThumbnailBox img { margin:5px; cursor:pointer; }
#EmailOpen { float:right; }
#EmailSend { font-size:12px; font-weight:bold; padding:3px 10px; }
#ResendMsg { float:right; margin-right:10px; padding-top:2px; font-weight:bold; color:#C00; }
#EconomyStats { margin:auto; text-align:right; border-spacing:0px; border-collapse:separate;  }
	#EconomyStats .head { background-color:#900; color:#fff; font-weight:bold; }
	#EconomyStats .CityLine:hover { cursor:pointer; background-color:rgba(255,255,255,0.5); }
	#EconomyStats .CityLine.selected { background-color:#FCC; }
	#EconomyStats td { padding:3px; }
		#EconomyStats td.lbl { text-align:left; }
	#EconomyStats img { vertical-align:middle; }