* {margin:0; padding:0;} 

html, body, #wrap {height: 100%;}

body {background-color: black;}

body > #wrap {background-color: black;height: auto;}

@font-face {font-family: Occidental; src: url("../fonts/Occident.eot"); src: local("Occidental"), url("../fonts/Occident.ttf") format("truetype");}

body#index a#homenav, body#about a#aboutnav,
body#media a#medianav, body#projects a#projnav,
body#contact a#contactnav, body#map a#mapnav,
body#events a#eventsnav, body#donate a#donatenav {
	background-image: url(../images/menubg2.jpg); color: #fff; font-weight: 400;}

ul.list {
	color: #002f00;
	font: .85em/2em Verdana, Arial, Trebuchet, sans-serif;
	text-align: left;
	text-indent: 0;
	margin: 0 0 1.5em 1em;
}

dd {color: #002f00; font: .75em/1.5em Verdana, Arial, Trebuchet, sans-serif; text-align: left;}

h1, h2 {color:#660011; font: 3em/1em Occidental; margin: .5em 0 .25em 0;} 

h2 {font-size: 2.5em;}

h3 {color: #99FF00; font: 1em/1.5em Verdana, Arial, Trebuchet, sans-serif;}

a.h3link:link, a.h3link:visited {color: #ffcd9a;  text-decoration: underline;}

a.h3link:hover {color: white; text-decoration:underline;}

p {
	color: #002f00;
	font: .85em/2em Verdana, Arial, Trebuchet, sans-serif;
	font-weight: 400;
	margin-bottom: 1em;
}

p.justify {text-align:justify;}

p.indent {text-indent: 1em;}

p.left {text-align: left;}

p.bold {font-weight: 600;}

p.smaller {font-size: .8em; }

td {font: .9em/1.5em Verdana, Arial, Trebuchet, sans-serif; padding: .5em;}

/* main divs */

#container {
	background-color: white;
	height: auto;
	min-height: 100%;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	text-align: left; /* IE fix */
	width: 904px;
}

#Bricks-01 {
	background-image: url(../images/Bricks_01.jpg);
	height:220px;
	margin-bottom: 30px;
	width:904px;
}

#nav {	
	font: 1.3em/22px Occidental; 
	height: 40px; 
	text-align: center; 
}

#qo{
	color: #006600;
	font: 1.5em/22px Occidental;
	height: auto;
	left: 15px;
	position: absolute;
	text-align:center;
	top: 215px;
	width: 350px;
}

#content {
	background-image: url(../images/contentbg.jpg);
	background-repeat:repeat-y; 
	height: auto;
	padding: 20px 20px 60px 20px;
	width:864px;
}

#updater {
	background-color: #333333;
	color: #FFFF00;
	text-align: center;
	padding: 2em;
}

#topbox{
	border: 3px silver ridge;
	box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	-moz-box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	-webkit-box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	height: 220px;
	left: 400px;
	position:absolute;
	top: 10px;
	width: 400px;
	z-index: 100;
}
	
#foot {
	background-image: url(../images/brick_bg.png);
	background-repeat: repeat-x;
	border-top: 2px #fff solid;
	color: #fff;
	font: .8em/2em Verdana, Arial, Helvetica, sans-serif;
	height: 60px;
	left: 0px;
	padding: 10px 0 0 0;
	text-align: center;
	width:100%;
	z-index: 100;
}

form#contactform input {
	border-color: #B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style: solid;
	border-width: 1px;
	color: #333;
	font-size: 14px;
	padding: 2px;
}

form#contactform textarea {
	border-color: #B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style: solid;
	border-width: 1px;
	font: .8em/1em Arial, Tahoma, Helvetica, sans-serif;
	padding: 0.5em 0.4em 0.3em;
}

#contact-wrapper {
	border: 2px solid #660011;
	border-radius: 9px;
	box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	-moz-box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	-webkit-box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	float: left;
	margin: 20px 20px 20px 0;
	padding: 20px;
	width: 420px;
}

#contact-wrapper div {margin: .5em 0;}

#contact-wrapper label {
	color: #030561;
	display: block;
	float: none;
	font: .8em/1.5em Verdana, Arial, Helvetica, sans-serif;
	width: auto;
}

#contactmsg {color: #000; text-align: left;}

/*menu nav classes */

ul.MenuBarHorizontal {
	background-image: url(../images/menubg.jpg);
	cursor: pointer;
	height: 40px;
	left: 0px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: absolute;
	width: 904px;
}

ul.MenuBarActive { z-index: 1000;}

ul.MenuBarHorizontal li {
	cursor: pointer;
	float: left;
	height: 40px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: relative;
	width: 113px;
}

ul.MenuBarHorizontal a {
	background-image: url(../images/menubg.jpg);
	border: 1px solid #330000;
	color: #330000;
	cursor: pointer;
	display: block;
	padding: 0.5em 0.5em;
	text-decoration: none;
}

ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus {
	background-image: url(../images/menubg1.jpg);
	border: 1px solid #fcff00;
	color: #FFF;
	padding: 0.5em 0.75em;
}

/* link selectors and classes */
	
a:link {color: #000099; text-decoration: underline; -webkit-transition: color .6s linear;}   

a:visited {color: #000099; text-decoration: underline;}

a:hover {color: #e55415; text-decoration: none; -webkit-transition: color .2s linear;}  
 

a.foot:link { color: #ffcd9a; text-decoration: underline; -webkit-transition: color .6s linear;}

a.foot:visited { color: #ffcd9a; text-decoration: underline;}

a.foot:hover {color: #C8ED4D; text-decoration: none; -webkit-transition: color .2s linear;}  


a img {border: none;} /* for IE  -- sigh --  */

.x-Small {font-size: x-small;}

.red {color: #660011;}

.center {text-align: center;}

/* img floats and padding */
.fleft { padding: 10px; float: left;}

.fright { padding: 10px; float: right;}

/* jQuery Cycle Lite styles below */
.pics { 
	height: 220px; 
	margin:0;
	padding:0; 
	overflow: hidden;
	width: 400px; 
}

.pics img { height: 220px;  width: 400px; padding: 0; }

.pics2 { 
	background-color: black; 
	height: 400px; 
 	overflow: hidden; 
	padding:0; 
	width: 100%;
}

.pics2 img { 
	height: 400px; 
	margin:0 0 0 132px;
	padding: 0; 
	width: 600px;  
}

.title {
	background-color: black;
	color: white; 
	font: .9em/1em Arial, Helvetica, sans-serif ;
	padding: .5em;
}

/* CLEAR FIX - forces footer to bottom  */
.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
	
.clearfix { display: inline-block;}

/* Hides from IE-mac */
* html .clearfix { height: 1%;}

.clearfix {display: block;}
