body {
	background-color: #ffffff;
	color: #000000;
	margin: 0px;
	margin-left: 20px;
	margin-top: 11px;
	font: 11px/14px Arial, Sans-Serif;
}

body.splash {
	background-color: #333333;
	color: #cccccc;
	margin: 0px;
}

.centervertical {
	width: 99%;
	height: 650px;
	margin-top: -325px;
	position: absolute;
	top: 50%;
	text-align: center;
}

.centerhorizontal {
	text-align: left;
	position: relative;
	margin: auto;
	width: 975px;
	height: 650px;
}

body.splash .centervertical {
	width: 99%;
	height: 650px;
	margin-top: -325px;
	position: absolute;
	top: 50%;
	text-align: center;
}

body.splash .centerhorizontal {
	position: relative;
	margin: auto;
	width: 900px;
	height: 650px;
}

#pagecounter {
	visibility: hidden;
	position: absolute;
	left: 800px;
	top: 10px;
	width: 50px;
	height: 20px;
	border: 1px solid;
}

#hiddenframe {
	visibility: hidden;
	position: absolute;
	left: 150px;
	top: 510px;
	width: 500px;
	height: 100px;
	border: 1px solid;
}

#debugdiv {
	display: none;
	background-color: #ffffff;
	position: absolute;
	padding: 10px;
	left: 830px;
	top: 50px;
	width: 180px;
	height: 382px;
	border: 1px solid;
	z-index: 100;
	overflow: auto;
}

#featurecontent {
	visibility: hidden;
}

.content {
	position: relative;
	width: 975px;
	height: 630px;
}

p.notes {
	font: 10px/12px Arial, Sans-Serif;
	margin-top: 0px;
	margin-bottom: 10px;
	padding: 10px;
	text-transform: uppercase;
	opacity: 0.60;
	filter: alpha(opacity=60);
}

.navcolumn {
	position: absolute;
	top: 0px;
}

.navcolumn1 {
	left: 0px;
}
.navcolumn2 {
	left: 398px;
}
.navcolumn3 {
	left: 795px;
}

.navcolumn p {
	margin: 0px;
	line-height: 18px;
}

.navcolumn p.divider {
	background-image: url(/images/smallnav/divider.gif);
	background-position: 0px 13px;
	background-repeat: repeat-x;
	width: 382px;
}

#counter {
	visibility: hidden;
}

.rightbar {
	position: absolute;
	left: 795px;
	top: 108px;
	width: 180px;
	height: 382px;
}

.buythebook {
	position: absolute;
	left: 0px;
	top: 0px;
}

.pledgetosee {
	position: absolute;
	left: 0px;
	bottom: 0px;
}

.weatherdata {
	background-color: #eeeeee; /* */
	position: absolute;
	left: 0px;
	bottom: 26px;
	width: 780px;
	height: 80px;
}

.rodalecopyright {
	position: absolute;
	left: 790px;
	bottom: 62px;
	width: 166px;
	height: 54px;
}

.rodalelogo {
	position: absolute;
	left: 0px;
	top: 0px;
}
.copyright {
	position: absolute;
	left: 42px;
	top: 0px;
}

.zagodesign {
	position: absolute;
	left: 0px;
	bottom: 0px;
}


/*================================================================
	feature styles
================================================================*/

#feature {
	color: #ffffff;
	background-color: #F8F8E8; 
	position: absolute;
	left: 0px;
	top: 110px;
	width: 780px;
	height: 380px;
	overflow: hidden;
}
.introduction #feature {	background-color: #333333; }
.consequences #feature {	background-color: #FBFBF3; }
.misc #feature {	background-color: #333333; }

.featureleft {
	position: absolute;
	left: 0px;
	top: 0px;
}

.featureright {
	position: absolute;
	left: 390px;
	top: 0px;
}

div.featureleft,
div.featureright {
	width: 390px;
	height: 380px;
}

.nextlinkright {
	position: absolute;
	right: 0px;
	bottom: 0px;
}

.morelinkleft {
	position: absolute;
	left: 0px;
	bottom: 0px;
}

.trans50 {
	opacity: 0.50;
	filter: alpha(opacity=50);
}
.trans70 {
	opacity: 0.70;
	filter: alpha(opacity=70);
}
.trans80 {
	opacity: 0.80;
	filter: alpha(opacity=80);
}
.trans90 {
	opacity: 0.90;
	filter: alpha(opacity=90);
}

.misconceptions .screen { background-color: #F8F8E8; }
.consequences .screen { background-color: #000000; }

#helsolvenav {
	position: absolute;
	left: 9px;
	top: 45px;
	line-height: 0px;
}

#helsolvenav p {
	margin: 0px;
}

.helpsolvelink {
	position: absolute;
	left: 6px;
	top: 20px;
}

#helpsolveright .featureright {
	left: 0px;
}

.featurefullwidth {
	position: absolute;
	left: 0px;
	top: 0px;
}

.consequences .nextlink {
	position: absolute;
	left: 327px;
	top: 6px;
}

.consequences .expander {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 390px;
	height: 380px;
	overflow: hidden;
}

.consequences .expander.collapsed {
	height: 30px;
}

.consequences .expandtrigger {
	background-image: url(/images/consequences/collapse.gif);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	position: absolute;
	left: 12px;
	top: 9px;
	width: 13px;
	height: 13px;
	cursor: pointer;
}

.consequences .collapsed .expandtrigger {
	background-image: url(/images/consequences/expand.gif);
}

.consequences .chart4pix {
	position: absolute;
	right: 0px;
	top: 0px;
}


#tellafriendform {
	margin: 10px;
	margin-top: 115px;
	margin-left: 70px;
}

#tellafriendform input.text {
	font: 12px/15px "Lucida Grande", Verdana, Sans-Serif;
	height: 20px;
	padding: 0px;
}

#tellafriendform input.tellafriendname {
	width: 120px;
	margin-right: 5px;
}

#tellafriendform input.tellafriendemail {
	width: 170px;
}

#tellafriendform textarea {
	font: 12px/15px "Lucida Grande", Verdana, Sans-Serif;
	width: 300px;
	height: 70px;
	padding: 0px;
}



#tellafriendform p {
	margin: 0px;
}

#tellafriendform p.label {
	padding-left: 3px;
	margin-top: 10px;
	margin-bottom: 2px;
}

#tellafriendform td.label {
	padding-top: 10px;
	padding-bottom: 2px;
}

#tellafriendform p.input {
	margin-bottom: 2px;
}

#tellafriendform td.input {
	padding-bottom: 2px;
}

#tellafriendform p.note {
	margin-bottom: 10px;
	padding-left: 3px;
	font-size: 10px;
}

#tellafriendform div.formbottom {
	margin-top: 10px;
}

#tellafriendform p.privacy {
	font-size: 10px;
}

#tellafriendform input.button {
	float: right;
	margin-right: 10px;
	margin-left: 30px;
	font-size: 11px;
}

#tellafriendresponse {
	color: #000000;
	margin: 10px;
	margin-left: 70px;
	margin-right: 40px;
	margin-top: 140px;
	font-size: 20px;
	line-height: 27px;
}


.tellafriend  #feature {
	background-color: #666666;
}

.tellafriend .featureright {
	background-color: #F8F8E8;
}

.tellafriend input.button {
	width: 60px;
}