/* 
	Screen styles for Lotus Counselling website
	Derek Mah, August 2009

	background brown 7f6d50
	headers 482f06
	text 786c58
	headernav_off ffffff
	headernav_on 482f06
	headernav_current 482f06
	footernav_off c8d1a4
	footernav_on ffffff
	link c56143
	link_hover f0a620

*/
	
/* 
====================
	Set defaults

	h1 title
	h2 header
	h3 header same as h2 with bottom margin removed
	h4 bold italic, usually as a header or call-out
	h5 header same as h2 with top margin removed
	h6 small print, usually copyrights and indicia
	lotus_margin can be added to any element to add the standard vertical margins

====================
 */
* { margin: 0px; padding: 0px; }
body { background-color: #7f6d50; font: 11px "helvetica", "arial", "verdana", sans-serif; font-weight: normal; font-style: normal; color: #786c58; text-decoration: none; text-align: center; }
body #ieeeeee { font: 11px "verdana", "arial", "helvetica", sans-serif; }
img { display: inline; vertical-align: baseline; }
a img { border: none; }
table, tr, td { border-collapse: collapse; }
td { vertical-align: top; }
h1, h2, h3, h4, h5, h6 { color: #482f06; font-weight: bold; }
h1, h2, h3, h4, h5, h6, p, table, ul, ol, .lotus_margin { margin: 1.20em 0em 1.20em 0em; }
h1 { font-size: 1.8em; margin: 0.70em 0em 0.70em 0em; font-weight: normal; }
h2, h3, h5 { font-size: 1.25em; margin: 1.05em 0em 1.05em 0em; }
h3 { margin-bottom: -0.95em; }
h4 { font-size: 1.20em; font-weight: normal; font-style: italic; margin: 1.05em 0em 1.05em 0em; }
h5 { margin-top: -1.15em; }
h6 { margin: 0em 0em 0em 0em; font-size: 9px; font-weight: normal; color: #786c58; }
.lotus_bold { font-weight: bold; }
.lotus_small { font-size: 0.9em; }
a:link, a:visited { color: #c56143; background-color: transparent; text-decoration: underline; }
a:active, a:hover { color: #f0a620; text-decoration: underline; }
/* 
====================
	layout

	All content resides in lotus_wrapper which centers the document, fixes the width at 800px, places the header image and sets the document area background to white.
	Header is last in the stack and absolutely positioned.
	Use #single_column for full width content and use #left_column with #right_column for two-column content. #left_column floats left, #right_column floats right and #lotus_footer clears the floats.

====================
 */
#lotus_wrapper { position: relative; width: 800px; margin: 0px auto 0px auto; padding: 210px 0px 0px 0px; background-color: #ffffff; text-align: left; }
#lotus_content { position: relative; width: 800px; background-color: #ffffff; text-align: left; }
#lotus_content #single_column, #lotus_content #left_column, #lotus_content #right_column { position: relative; padding: 0px 20px 0px 20px; text-align: left; overflow: visible; }
#lotus_content #left_column { float: left; width: 370px; padding-right: 0px; }
#lotus_content #right_column { float: right; width: 370px; padding-left: 0px; }
#lotus_footer { position: relative; clear: both; background: url(../_images/footer.gif) left bottom no-repeat #768d1b; width: 800px; height: 174px; }
#lotus_header { position: absolute; left: 0px; top: 0px; background: url(../_images/header.gif) left top no-repeat #aa533a; width: 800px; height: 203px; }
/* 
====================
	content

	lotus_thumbnail creates an offset column of text to allow placement of a photo adjacent to the text column. The amount of offset defaults to 100px and can be locally defined to accomodate any size photo. The img is absolutely positioned within the div and gets a 2px border.

====================
 */
#lotus_content p { line-height: 1.20em; }
.lotus_thumbnail { position: relative; margin: 1.20em 0em 1.20em 0em; padding-left: 100px; }
ul, ol { padding: 0px; margin: 0px 0px 15px 20px; }
ol li, ul li { margin: 0px 0px 4px; padding: 0px; }


.lotus_thumbnail img { border: solid 2px #786c58; display: inline; float: left; margin-left: -100px; }
/* 
====================
	footer

	The lotus flower is absolutely positioned and can be hidden if desired.
	#lotus_footerlinks is absolutely positioned and contains text links.

====================
 */
#lotus_footerlinks { position: absolute; left: 233px; top: 120px; }
#lotus_footerlinks-alt { position: absolute; left: 21px; top: 141px; color: #c8d1a4; font-size: 10px; }
#lotus_footerlinks a:link, #lotus_footerlinks-alt a:link, #lotus_footerlinks a:visited, #lotus_footerlinks-alt a:visited { color: #c8d1a4; text-decoration: none; }
#lotus_footerlinks a:hover, #lotus_footerlinks-alt a:hover, #lotus_footerlinks a:active, #lotus_footerlinks-alt a:active { color: #ffffff; text-decoration: underline; }
#lotus_footerlotus { position: absolute; right: 0px; top: 0px; }
/* 
====================
	header

	#lotus_headerlinks is an absolutely positioned ul and contains topnav links.

====================
 */
#lotus_headerlinks { position: absolute; left: 0px; bottom: 0px; margin: 0px 0px 0px 0px; list-style-type: none; font-size: 14px; }
#lotus_headerlinks ul { margin: 0px; }

#lotus_headerlinks li { list-style-type: none; float: left; height: 32px; background-color: transparent; color: #ffffff; margin: 0px 1px 0px 0px; }
#lotus_headerlinks li a, #lotus_headerlinks li p.current { display: block; padding: 10px 20px 10px 20px; margin: 0px; }
#lotus_headerlinks li a:link, #lotus_headerlinks li a:visited { background-color: transparent; color: #ffffff; text-decoration: none; }
#lotus_headerlinks li a:hover, #lotus_headerlinks li a:active, #lotus_headerlinks li p.current { background-color: #ffffff; color: #482f06; text-decoration: none; }
#lotus_headertext { position: absolute; left: 500px; top: 80px; font-size: 20px; color: #d3c0bb; }
#lotus_headertext .lotus_slogan { font-size: 14px; color: #9d7971; }
#cs { position: absolute; left: 614px; top: 120px; }
#lotus_content.margin { position: relative; width: 600px; background-color: #ffffff; text-align: left; padding: 0px 15px 15px 20px; }
a.outbound { background: url(../_images/Icon_External_Link.png) no-repeat right; padding-right: 15px; }