/* CSS Screen Styles for Wildthings */


body {
	background: #434343 url(gfx/bg-body.jpg) top left repeat-x;
	margin: 0; padding: 0 0 30px 0; border: 0;
	text-align: left;
	font: 12px arial, helvetica, sans;
}


div#top {
	width: 770px; height: 133px;
	background: black url(gfx/banner-wildthings-logo.gif) no-repeat;
	margin: 0 auto; padding-top: 4px;
}

#top ul { list-style: none; margin: 0; text-align: right; }
#top ul li { display: inline; font: 11px arial, helvetica, sans; margin: 0 15px 0 10px; }
#top ul li a { color: black; text-decoration: none; font-weight: bold; }
#top ul li a:hover { color: white; text-decoration: none; }






/* Menu List Items - Common Styles */

div#menu { font: bold 12px arial, sans-serif; width:770px; margin:0 auto; z-index:100; background: #cd5727 url(gfx/bg-menu-01.gif) top left repeat-x; }

#menu ul {padding:0; margin:0;list-style-type: none; }
#menu ul li {float:left; position:relative; }
#menu ul li a  {display:block; text-decoration:none; padding: 7px 0 4px 10px; color: white; height:20px; text-align:left; overflow:hidden;} 

/* look at adding the padding to menu ul li and removing it from the a state. make sure it works in IE. this will allow scaling of text */

#menu .home { width: 55px; border-right: 1px solid #a33406; border-left: 0; }
#menu .news { width: 195px; border-right: 1px solid #a33406; border-left: 1px solid #e06e45; }
#menu .actionplans { width: 110px; border-right: 1px solid #a33406; border-left: 1px solid #e06e45; }
#menu .projects { width: 150px; border-right: 1px solid #a33406; border-left: 1px solid #e06e45; }
#menu .intheloop { width: 180px; border-right: 0; border-left: 1px solid #e06e45; }

#menu ul li ul {display: none;}

/* specific to non IE browsers */

#menu ul li:hover a {color:#cd5727; background:#fff;}
#menu ul li:hover ul {display:block; position:absolute; top:31px; left:0; width:200px; border-right: 3px solid black; border-bottom: 2px solid black; }
#menu ul li:hover ul li { width:200px; font: bold 12px arial; }
#menu ul li:hover ul li a.hide {background:#6a3; color:#fff;}
#menu ul li:hover ul li:hover a.hide {background:#6fc; color:#000;}
#menu ul li:hover ul li ul {display: none;}
#menu ul li:hover ul li a {display:block; background: #DF5F2A url(gfx/bg-menu-02.gif) top left repeat-x; color:#fff; height: 15px; padding: 6px 0 6px 25px; }
#menu ul li:hover ul li a:hover {color:#cd5727; background: #fff url(gfx/bg-menu-02h.gif) top left repeat-x; }






div#container {
	width: 770px; background: url(gfx/bg-container.gif) top left repeat-y; 
	margin: 0 auto; padding: 0;
}



/* Main Container and Nested Elements */

div#main { width: 520px; float: left; margin: 0; padding: 10px; font: normal 12px arial, helvetica, sans; color: black; line-height: 18px;}
#main a { color: black; text-decoration: underline; }
#main a:hover { text-decoration: none; }

#main ul { font: normal 12px arial, helvetica, sans; margin: 14px 0px 14px 0px; padding: 0 10px 0 10px; ; line-height: 18px; }
#main li { list-style: none; background: url(gfx/bg-list-01.gif) top left no-repeat; margin: 0 0 5px 0; padding: 0 0 0 20px; }
#main li a { color: black; text-decoration: underline; }
#main li a:hover { text-decoration: none; }

#main .contentimage { padding: 4px; border: 1px solid #bbb; margin: 5px 10px 10px 10px; }


h1 { font: bold 18px arial, helvetica, sans; color: #E96400; padding: 0; margin: 15px 0 10px 0; }
h1 a { color: #E96400; text-decoration: underline; }
h1 a:hover { text-decoration: none; }

h2 { font: bold italic 14px arial, helvetica, sans; color: black; line-height: 21px;
/* holly hack to remove extra padding after italic text in Internet Explorer */ overflow: visible; height: 1%; }
h2 a { color: #E96400; text-decoration: underline; }
h2 a:hover { text-decoration: none; }

h3 { font: bold 14px arial, helvetica, sans; color: black; padding: 0; margin: 15px 0 10px 0;}
h3 a { color: black; text-decoration: underline; }
h3 a:hover { text-decoration: none; }



/* EDITABLE REGION ON THE INDEX PAGE */

div#editable-one { 
	width: 500px;
	background: #fff url(gfx/bg-editable-01.jpg) top left repeat-x; 
	margin: 0; padding: 10px;
	font: bold italic 14px arial, helvetica, sans; color: black; line-height: 21px;
}
	#editable-one a { color: #E96400; text-decoration: underline; }
	#editable-one a:hover { text-decoration: none; }
	
#editable-one h1 { font: bold 18px arial, helvetica, sans; color: #E96400; padding: 0; margin: 15px 0 10px 0; }
#editable-one h1 a { color: #E96400; text-decoration: underline; }
#editable-one h1 a:hover { text-decoration: none; }


.editable-left { 
	width: 235px; float: left;	margin: 0 0 10px 0; border-right: 3px solid #E2EDB3;
	font: normal 12px arial, helvetica, sans; color: black; line-height: 18px; 
	
	/* 2007.07.24 */
	padding: 0 10px 10px 10px; margin: 0px 0 8px 0;
}
.editable-left a { color: #E96400; text-decoration: underline; }
.editable-left a:hover { text-decoration: none; }

.editable-left h2 { font: bold 14px arial, helvetica, sans; color: black; padding: 0; margin: 0 0 10px 0;
/* holly hack */ overflow: visible; height: 1%; }
.editable-left h2 a { color: black; text-decoration: underline; }
.editable-left h2 a:hover { text-decoration: none; }


.editable-right { 
	width: 235px; float: right;	margin: 0 0 10px 0; padding: 0px; border: 0;
	font: normal 12px arial, helvetica, sans; color: black; line-height: 18px;
	
	/* 2007.07.24 */
	padding: 0 10px 10px 10px; margin: 8px 0 8px 0;
}
.editable-right a { color: #E96400; text-decoration: underline; }
.editable-right a:hover { text-decoration: none; }

.editable-right h2 { font: bold 14px arial, helvetica, sans; color: black; padding: 0; margin: 0 0 10px 0;}
.editable-right h2 a { color: black; text-decoration: underline; }
.editable-right h2 a:hover { text-decoration: none; }




/* Side Container and Nested Elements */

div#sidecontainer { width: 230px; float: right; padding: 3px 0 10px 0; margin: 0; border:0; }

div#side { width: 200px; background: #ECF4D2; padding: 5px 15px 5px 15px; margin: 0; border:0; font: normal 12px arial, helvetica, sans; color: #333; line-height: 16px;

/*modification 2007/07/23 */
z-index: 1; 
overflow: hidden;
float: right;

}


#side a { color: #333; text-decoration: underline; }
#side a:hover { color: #E96400; text-decoration: none; }

#side h3 { font: italic bold 13px Georgia, "Times New Roman", Times, serif; color: #E96400; line-height: 20px;
/* holly hack */ overflow: visible; height: 1%; }
#side h3 a { color: #E96400; text-decoration: underline; }
#side h3 a:hover { color: #E96400; text-decoration: none; }

#side ul { font: normal 12px arial, helvetica, sans; margin: 14px 0px 14px 0px; padding: 0; line-height: 16px; color: #333; }
#side li { list-style: none; background: url(gfx/bg-side-list.gif) top left no-repeat; margin: 0 0 0 0; padding: 0 0 0 20px; }
#side li a { color: #333; text-decoration: underline; }
#side li a:hover { color: #E96400; text-decoration: none; }

#side .li-pdf { list-style: none; background: url(gfx/bg-side-list-pdf.gif) top left no-repeat; margin: 0 0 0 0; padding: 0 0 0 20px; }

#side .contentimage { border: 0; padding: 2px; }




div#logo-space { width: 200px; margin: 14px; border: 0; }





/* BR styles */

/* clears floated layers */
.clear { clear: both; height: 0; margin: 0; }




/* New Footer Layer 2007.07.14 */

div#footer {
	background: #fff url(gfx/bg-footer.gif) top left repeat-y;
	width: 750px;
	margin: 0 auto;
	padding: 10px;
}