/* main CSS styles for SEED website */

/* color palette:
#72a241		dark green
#c8d5af		light green
#a21c48		deep red
#c7b299		medium brown
#6c532f		brown text
#d0c7bb		light brown/grey
#505050		main grey text	
#707070		light grey
*/


html {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	/* background-color: #a21c48; */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	line-height:1.125em; /* 16×1.125=18 */
	color: #505050;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	float: left;
	}

p, li, dd, span {
	text-align: left;
	font-size: .875em;
	margin-top: 0;
	}
	
h1 {
	color: #A00449;
	font-size: 1.45em;
	margin: 0;
	padding:0px 0px 0px 22px; /* 22px makes room for apple icon bg image */
	background: url(../images/icon_apple.gif) no-repeat 0 10%;
	line-height: 1.2em;
	display: inline;
	}
	
span.h1SubHead {
	color: #72a241;
	font-size: 1.25em;
	margin: 0;
	}
	
h2 {
	font-size: 1.15em;
	margin-top: 2em;
	margin-bottom: 0em;
	}
	
h2.topH2 {
	margin-top: 1em;
	}
	
h3 {			
	font-size: 1.05em;
	margin-bottom: 0em;
	}
	
h4 {
	font-size: 1em;
	}

dt {
	font-size: 0.875em;
}

input {
	color: #505050;
	font-size: .85em;
	padding: 1px;
}

a {
	color: #505050;
}

form {
	margin: 0px; 
	padding: 0px;
	}

ul {
	list-style: square;
	margin-top: 0;
	}
	
ol {
	margin-top: 0;
	}
	
div#outsideBorder {
	/*width: 970px;*/
	width: 67em;
	/*width: 77%;*/
	min-width: 970px;
	margin: 10px auto 5px auto;
	border: 10px none #a21c48;
	padding: 4px;
	}
	
div#insideBorder {
	position: relative;	/*this was added to fix some buginess with borders disappearing in IE */
	border: 3px none #72a241;
	}
	
div#header {	
	height: 190px;
	border-top: 3px solid #72a241; /*this was add because the border-top of the insideBorder div added a green border right above the main body content; instead, this border was added to the top of the header */
	/*background: url(../images/seed_logo.jpg) top left no-repeat;*/
	}

a#logo {
	}

img#tagline {
	position: relative;
	top: -100px;
	left: 60px;
}
	
a#donateButton {
	position: absolute;
	top: 198px;
	left: 979px;
	width: 150px;
	color: #444;
	background: transparent url('../images/donate_button_bg.gif') no-repeat;
	display: block;
	line-height: 0;
	padding: 34px 3px 40px 0;
	color: #fff;
	font-weight: bold;
	font-size: 1.5em;
	text-align: center;
	text-decoration: none;
	}


a#donateButton:hover {
	color: #d0c7bb;
	
	}
	
a#donateButton:active {
    outline: none; /* hide dotted outline in Firefox */
	top: 41px;	/* push button down and right by 1px */
	left: 806px;
	background-position: bottom left;
	}

div#globalUtilities {
	float: right;
	width: 500px;
	text-align: right;
	font-size: 0.80em;	
	/*margin-top: 10px;
	margin-right: 10px;*/
	margin-top: -110px;
	margin-right: 10px;
	}

div#globalUtilities input {
	vertical-align: middle;
	}
	
div#globalUtilities a {
	color: #6c532f;
	}
	
ul#nav {
	position: absolute;
	top: 258px;
	left: -590px;
	padding: 0;
	margin: 0;
	list-style: none;
	}
	
* html ul#nav {	/* only ie6 will process this; the top needed adjustment to align properly */
	top: 152px;
}
	
ul#nav li {	
	margin: 0 5px 0 0;
	padding: 0;
	float: left;
	/*width: 125px;*/
	width: 8.95em;
	position: relative;	/* this is added to fix a bug in IE6 where the floated li elements wouldn't align properly in a relatively positioned block */
	}

ul#nav a {	
	display: block;
	padding: 18px 1px;
	height: 18px;
	font-size: 1em;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	color: #72a241;
	text-decoration: none;
	border: 2px solid #72a241;
	border-bottom: 0;
	background: #c8d5af;		
	}

ul#nav a:hover, #nav a.selected {
	background-color: #72a241;
	color: #fff;
	}	
		
div#contentArea {
	height: 100%;
	}

div#subheader {
	height: 18px;
	padding-top: 15px;
	padding-left: 20px;
	/*text-align: center;	*/
	font-weight: bold;
	font-size: 0.9em;
	color: #fff;
	}
	
div#subheader a {
	color: #fff;
	}

div#subheader a.selected {
	text-decoration: none;
	color: #c8d5af;
	}

div#subheader a:hover {
	text-decoration: none;
	color: #c8d5af;
	}
	
div.leftColumnPod {
	width: 200px;
	border: 1px solid #c8d5af;
	padding: 0 5px; 
	float: left;
	margin-right: 15px;	
	}
	
div.leftColumnPod p {
	text-align: justify;
	}
	
div#mainContent {
	float: left;
	width: 37.5em;
	padding-left: 20px;
	}

div#mainContentWide {
	float: left;
	width: 100%;
	padding-left: 20px;		
}

div#rightContent {
	float: left;
	width: 16.5em;
	padding-left: 30px;
}

dl.podStyle1 {
	width: 16.5em;
	margin-top: 3em;
	}

dl.podStyle1 dt {
	background-color: #555;
	text-align: center;
	font-weight: bold;
	padding: .20em 0;
	color: #FFF;
	}

dl.podStyle1 dd {
	margin: 0;
	padding: 7px;
	color: #6c532f;
	border-bottom: 2px solid #fff;
	background-color: #90CD53;
	filter: alpha(opacity=10);
	-moz-opacity: .80;
	opacity: .80;
	;
	background-image: url(../images/new_transparency.gif);
}

dl.podStyle1 ul {
	padding-left: 15px;
	margin: 0;
}

dl.podStyle1 li {
	margin-bottom: 7px;
}

dl.podStyle1 p {
	color: #6c532f;
	text-align: center;
	}

dl.imagePlusCaption {
	margin: 0;
}

dl.imagePlusCaption dt {
	text-align: center;
	font-size: .75em;
	}

dl.imagePlusCaption dd {
	margin: 0;
	padding: 0;
	text-align: center;
}

dl.imagePlusCaption dd img {
}
	
div#contentAreaBottom {
	clear: both;	/* clears left and right floated content areas so they fit within the outer and inner borders */
	}

div#footer {
	width: 61em;
	margin: 15px auto;
}

div#footer a {
	color: #666;	
}

div#footer p {
	font-size: .85em;
	color: #666;
	}
	
div#footerCenter p {
	text-align: center;
	}

div#footerRight p {
	text-align: right;
	}
	
div#footerLeft, div#footerRight {
	float: left;
	width: 6em;
	}
	
div#footerCenter {
	float: left;
	width: 40%;
}

.help {
    position:relative; /*this is the key*/	
  	}

.help:hover{
	cursor:help;
}

.help span {
	display: none;
}

.help:hover span{ /*the span will display just on :hover state*/
	display:block;
	position: absolute;
	top:1.3em;
	left:0.5em;
	width:20em;
	border:1px solid #CCCCCC;
	background-color:#d0c7bb;
	text-align: left;
	text-decoration:none;
	padding: 7px 5px 5px 5px;
	color:#505050;
	z-index: 100;
	line-height: 1.5em;
}
	
div.subLinks {
	margin-left: 40px;
	}

div.subLinks ul.subLinksLeft {
	float: left;
	margin-right: 75px;
	}
	
div.subLinks ul.subLinksRight {
	float: left;
	}
	
div.subLinks li {
	margin-bottom: 25px;
	}
	
div.subLinks a:hover {
	text-decoration: none;
	color: #72a241;
	}
	
img#btnPaypalDonate {
	margin-left: 250px;
	}
	
div.hr {
	height: 11px;
 	background: #FFFFFF url(../images/hr.gif) no-repeat 0px center;
	margin:5px 0px 5px 0px;
}

div.hr hr {
	display:none;
}

a.sectionLink {
	font-weight: bold;
	font-size: .9em;
	}
	
table.statTable {
	width: 45%;
	border: 1px solid #d0c7bb;
	}

table#zambiaStats {
	float: left;
	margin-right: 20px;
	width: 300px;
}

table#serenjeStats {
	float: left;
	width: 300px;
}

table.statTable th {
	border: 1px solid #707070;
	border-bottom: 0;
	text-align: left;
	padding: 5px;
	background-color: #c7b299;
	color: #6c532f;
	}

table.statTable td {
	border: 1px solid #707070;
	padding: 5px;
	text-align: right;
	}
	
table.statTable td.statName {
	font-weight: bold;
	border-right: 0;
	}
	
p.footnote, p.footnote a {
	font-size: 12px;
	color: #707070;
}

div.boardBioSection {
	padding-left: 30px;
}	

body#documents li {
	margin-bottom: 15px;
	}

.site-map-div {
	float: left; 
	width: 30%;
}

.site-map-div ul {
	list-style: none;	
	padding-left: 15px;
}