body { background: #31659c; padding-bottom: 20px; }
.clear { clear: both; }
strong { font-weight: bold; }
em { font-style: italic; }

/* structure */
#container { width: 950px; margin: 0 auto; background: url(../images/containerBgMiddle.gif) repeat-y; }
	#head { width: 921px; background: url(../images/headBg.png) repeat-x; margin: 0 0 0 15px; position: relative; }
	#header { width: 896px; margin: -13px 0 0 15px; background: url(../images/headerBg.jpg) no-repeat top right; height: 100px; padding: 20px 0 0 25px; }
	#nav { width: 921px; height: 46px; background: url(../images/navBg.png) repeat-x; margin: 0 0 0 15px; position: absolute; }
	#content { width: 921px; margin: 0 0 0 15px; background: url(../images/contentBg.gif) repeat-y; }
		#contentLeft { float: left; width: 631px; background: #ffffff url(../images/contentLeftBg.gif) no-repeat; padding: 70px 25px 10px 25px; }
		div.story, div.lecture { margin-bottom: 25px; }
		body.inner #contentLeft { float: left; width: 631px; background: #ffffff; padding: 70px 25px 10px 25px; }
			#contentLeftLeft { float: left; width: 265px; }
			#contentLeftRight { float: left; margin-left: 8px; position: relative; width: 310px; }
			div.callout { width: 186px; height: 155px; float: left; background: #ffffff; border: 1px solid #999999; margin: 20px 15px 20px 0; padding: 5px; }
			div.last { margin: 20px 0 20px; }
			
			div.photoCaption { width: 300px; float: right; margin-left: 10px; }
			
			#secondaryMembers { margin: 20px 0 0; }
				div.secondaryMember { clear: left; padding-top: 10px; }
				div.memberLeft { float: left; width: 200px; margin-top: 15px; }
				div.memberRight { float: left; width: 340px; margin: 0 0 20px 20px; }
				
			#previous_supplements { margin: 20px 0; }
			
			#footer { clear: left; border-top: 1px solid #999999; padding-top: 6px; }
			body.inner #footer { margin-top: 25px; }
		#contentRight { float: left; width: 240px; padding-top: 60px; }
			div.rightBox { width: 240px; margin-left: 10px; }
				div.rightBoxTop { background: url(../images/rightBoxTopBg.png) no-repeat; height: 20px; width: 240px; } 
				div.rightBoxMiddle { background: url(../images/rightBoxMiddleBg.png) repeat-y; width: 200px; padding: 0 20px; }
				div.rightBoxBottom { background: url(../images/rightBoxBottomBg.png) no-repeat; height: 20px; width: 240px; } 
	#bottomClear { background: url(../images/containerBgBottom.gif) no-repeat bottom left; height: 15px; clear: both; }
div.error { border: 2px solid red; background: #FCECEC; padding: 0 10px; width: 400px; }

/* headers */	
h1 { text-indent: -1000em; background: url(../images/logo.gif) no-repeat; width: 379px; height: 90px; }
h2 { text-indent: -1000em; background: url(../images/headlinghappens.png) no-repeat; width: 262px; height: 67px; margin-bottom: 20px; }
body.inner h2 { background: none; text-indent: 0; width: auto; height: auto; font: 26px georgia; font-style: italic; color: #993333; margin-bottom: 10px; }
div.callout h3 { font: bold 16px helvetica; color: #993333; }
div.rightBoxMiddle h3, div.rightBoxMiddle h2 { font: bold 14px helvetica; color: #993333; margin-bottom: 5px; }
body.inner #contentLeft h3 { font: 16px georgia; color: #660000; margin: 10px 0; clear: both; }
body.inner #contentLeft div.error h3 { color: red; font: 18px georgia; }

/* lists */
#nav ul { margin: 0 0 0 10px; }
#nav ul li { float: left; }
#nav ul li a { font: 15px georgia; color: #ffffff; padding: 9px 16px; display: block; }
#nav ul li a:hover, #nav ul li:hover a { background: #e0ebd6; color: #003366; }

#nav ul ul { position: absolute; width: 14em; left: -999em; background: #e0ebd6; margin: 0; z-index: 9999; }
#nav ul ul li { float: none; }
#nav ul ul li a { color: #333333; }
#nav ul ul li a:hover { background: #31659c; color: #ffffff; }
#nav ul li:hover ul { left: auto; }

div.rightBoxMiddle ul { width: 170px; }
div.rightBoxMiddle ul li { list-style: disc; margin: 2px 0 0 14px; }
div.rightBoxMiddle ul li.section_name { list-style: none; font: bold 12px georgia; color: #993333; margin: 2px 0 0 0; }
div.rightBoxMiddle ul li a { font: 12px georgia; color: #333333; }
div.rightBoxMiddle ul li a:hover { text-decoration: underline; }

div.rightBoxMiddle ul.scroll { padding-left: 3px; width: 181px; height: 230px; overflow: auto; }

#contentLeft li { font: 14px georgia; line-height: 18px; color: #000000; background: url(../images/inner/redDisc.gif) no-repeat 0 8px; padding-left: 10px; margin: 0 0 0 30px; }

/* paragraphs */
#head p { text-align: right; padding: 10px 20px 22px 0; }
#contentLeft p { font: 14px georgia; line-height: 20px; color: #000000; width: 265px; margin-bottom: 5px; }
#contentLeft div.storyBody p { xfont-style: italic; }
body.inner #contentLeft p { width: auto; margin: 10px 0; }
body.inner #contentLeft div.photoCaption p { font: 12px georgia; color: #993333; margin: 0; }
body.inner #contentLeft p.quote { font-style: italic; margin-bottom: 0; }
body.inner #contentLeft p.quoteAuthor { margin-top: 5px; }
body.inner #contentLeft p.backToTop { clear: both; }
#contentLeftRight p { color: #993333; line-height: 19px; width: 145px; margin: 0 0 0 15px; font-style: italic; }
#contentLeft div.callout p { font: 13px helvetica; line-height: 16px; color: #000000; width: auto; margin-top: 4px; }
#contentLeft #footer p { font: 12px helvetica; color: #666666; width: auto; margin: 0 0 2px; }
div.rightBoxMiddle p { font: 12px georgia; margin: 10px 0 0 0; }
body.inner #contentLeft p.newsletter_success { color: #993333; font-weight: bold; }
body.inner #contentLeft p.flashData { margin: 0 0 20px; font: 16px georgia; font-weight: bold; color: orange; }
#contentLeft #contentLeftRight p#circleChart { position: absolute; top: 180px; right: 10px; }

/* links */
#head a { color: #003366; font: bold 13px helvetica; background: url(../images/headIcon.png) no-repeat 0 50%; padding: 10px 0 10px 20px; }
#head a:hover { color: #538653; }
#header a { text-indent: -1000em; float: right; background: url(../images/recommendedSupplements.png) no-repeat; width: 190px; height: 92px; margin: -90px 26px 0 0; }
div.callout a { font: bold 13px helvetica; color: #000000; text-decoration: underline; }
div.rightBoxMiddle a { color: #993333; }
div.rightBoxMiddle a:hover { text-decoration: underline; }
p a, #contentLeft li a { color: #3f658c; text-decoration: underline; }
#footer a { margin-left: 20px; color: #666666; text-transform: uppercase; font: 11px helvetica; text-decoration: underline; }
span.adminLinks, span.adminLinks a { color: #999999; }
body.inner h2 a, body.inner #contentLeft h3 a { color: #993333; } 

/* img */
img#homePhoto { float: right; border: 2px solid #ffffff; margin-bottom: 10px; }
p#circleChart img { border: none; }
div.callout img { float: right; margin: 0 0 5px 5px; }
body.inner #contentLeft img { float: right; margin: 5px 0 15px 10px; }
body.inner #contentLeft div.photoCaption img { float: none; margin: 5px 10px 5px 0; }
body.inner #contentLeft img.floatLeft { float: left; margin: 5px 20px 15px 0; }
body.inner #contentLeft img.noFloat { float: none; margin: 0; }

/* forms */
form { margin: 20px 0 0; }
form label, form#ask label { color: #000000; display: block; }
form input.text, form#ask input.text { width: 400px; margin: 0; border: 1px solid #bbb; background: #f6f6f6; padding: 5px; }
form.cms input.text { width: 600px; }
form input.text:focus { border: 1px solid #999; background: #fff; }
form textarea { width: 400px; height: 150px; border: 1px solid #bbb; background: #eee; padding: 5px; }
form.cms textarea { width: 600px; height: 250px; }
form textarea.address { height: 50px; }
form textarea:focus { border: 1px solid #999; background: #fff; }
form select { width: 200px; }

form#newsletter { margin: 0 0 30px; }
.required { color: red; }

