/***********************************************/
/* HTML tag styles                             */
/***********************************************/
html, body {
	margin: 0;
	padding: 0;	
    font: Verdana, Helvetica, sans-serif; font-size:12px;
	background-color: #CCCCCC;
	text-align: center;
	font-size:1.2em;
	color: #71787D;
}

/* defines font size, font family, and color for basic HTML elements */
p, td, ul, ol, li, dl, dt, dd, blockquote { font-family: Verdana, Helvetica, sans-serif; font-size:12px; }

/************** header tag styles **************/

h1{
 font: bold 14px Verdana,sans-serif;
 color: #71787D;
 margin: 0px;
 padding: 0px;
}

h2{
 font: bold 12px Verdana,sans-serif;
 color: #71787D;
 margin: 0px;
 padding: 0px;
}

h3{
 font: bold 10px Verdana,sans-serif;
 color: #71787D;
 margin: 0px;
 padding: 0px;
}

/* sets colors and underlining for regular links; since all links are underlined we don't have to declare this on subsequent custom link classes */
a:link { color: #3B4146; text-decoration: underline; }
a:visited { color: #71787D; text-decoration: underline; }
a:hover { color: #2F75AE; text-decoration: underline; }
a:active { color: #71787D; text-decoration: underline; }

.imgLeft { margin: 0 5px 5px 0; padding: 0 0 0 0; border: 1px solid #000; }
.imgRight { margin: 0 0 5px 5px; padding: 0 0 0 0; border: 1px solid #000; }


/***********************************************/
/* Content Layout Divs                         */
/***********************************************/
#pagecellBig{
	margin: 0px auto;
	text-align: left;
	position:relative;	
	width:750px;
	background-color:#FFFFFF;
}


#masthead{
	xheight: 117px;
	width: 750px;
	margin: 0;
	padding: 0;
	text-align: center;
	z-index: 0;
	background-color:#FFFFFF;
}

*html #masthead{
	width: 740px;
}

#midsectiontop{
	position: relative;
	top: 0px;
	left: 0;
	width: 745px;
	height: 108px;
	margin: 0;
	padding: 0;
	background-color: #71787D;
	font-family: Verdana, Helvetica, sans-serif;
	font-style: italic;
	font-weight:bold;
	text-align:left;
	color: #ffffff;
	z-index: 4;
	
}

*html #midsectiontop{
	width: 740px;
}

#midsectionbottom{
	position: relative;
	width: 745px;
	height: 205px;
	margin: 0;
	padding: 0;
	background-image:url(../images/mainpic2.jpg);
	background-repeat:no-repeat;
	border-bottom:5px solid #71787D;
	z-index: 5;
}

*html #midsectionbottom{
	width: 740px;
}

#border {    /************** div created to make left and right border around entire center **************/
	width:740px;
	xpadding-top: 10px; 
	border-left: 5px solid #71787D;
	border-right: 5px solid #71787D;
	z-index: 10;
}

/***********************************************/
/* Components                       */
/***********************************************/
#logo img{
	xposition: absolute;
	height: 67px;
	width: 185px;
	top: 22px;
	left:19px;
	z-index: 0;
	margin: 10px 0 0 10px;
}

#utilityNav{
	xborder: 1px solid red;
	padding: 2px 2px 2px 8px;
	position: absolute;
	xwidth:300px;
	height:19px;
	background-image:url(../images/utility_bg.gif);
	background-repeat:no-repeat;
	top: 5px;
	right: 0px;
	font: bold 11px Arial,sans-serif;
	color:#FFFFFF;
}

#utilityNav a {  
	color: #FFFFFF; 
	margin: 4px 5px 0px 5px; 
	text-decoration: none; 
}



#missionstate1{
	float: left;
	padding: 25px 0px 10px 40px;		
	height: 70px;
	width: 475px;
	text-align:left;
	font-size:14px;	
}

*html #missionstate1{
	padding: 25px 0px 10px 30px;
}

#pic1{
	float: left;
	margin: 0 10px 0 0;		
	width: 214px;
	height: 108px;
}

*html #pic1{
	border: 0;
	margin: 0 0 0 10px;		
}

#missionstate2{
	float: right;
	line-height:1.3em;
	padding: 20px 21px 0px 29px;		
	width: 190px;
	text-align:left;
	font-size:12px;
	font-family: Verdana, Helvetica, sans-serif;
	font-style: italic;
}

*html #missionstate2{
	width: 180px;
	padding: 15px 15px 10px 10px;	
}


/*************** content story styles ******************/


#storyLeft{
	float: left;
	top: 205px;
	padding: 10px 10px 10px 31px;		
	width: 200px;	
	font-size: 12px;
	background-color: #FFFFFF;
}
* html #storyLeft {width: 200px; padding: 10px 10px 10px 35px;}/* IE6 workaround */

#storyMid{
	float: left;
	padding: 10px 10px 10px 31px;
	width: 200px;	
	font-size: 12px;
	background-color:#FFFFFF;
}
* html #storymID {width: 200px; padding: 10px 10px 10px 35px;}/* IE6 workaround */

#storyRight{
	float: left;
	width:200px;
	padding: 10px 10px 10px 31px;
	background-color:#FFFFFF;
}

* html #storyRight {width: 200px; padding: 10px 10px 10px 35px;}/* IE6 workaround */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix {
	width: 740px;
	height: 1%;}
/* End hide from IE-mac */

/************ Main Navigation **************/

/* begin styles for nav popouts */
#nav, #nav ul {
	
	padding-left: 16px;
	padding-top: 22px;
	margin: -15px 0 0 0;
	list-style: none;
	z-index: 0;	
	background-color: #2F75AE;
	background-image: url(../images/masthead_bg.gif);
	background-repeat: no-repeat;
	height: 20px;
	width: 734px;
	/* end functional-necessary attributes, begin prettying it up */	
}

* html #nav, #nav ul {
	width: 734px;
}

/* dropdown box */
#nav a {
	display: block;	
	color:#ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	z-index: 0;		
	}


#nav li { /* all list items */
	float: left;/* starts lists from top left of element */
	position: relative;/* keeps items flowing next to each other, not on top of each other */
	/* end functional-necessary attributes, begin prettying it up */		
	padding-left: 0;
	margin: 0;
	margin-left: 0;
	z-index: 0;
}

ul#nav li ul li {
border-bottom: 1px solid #fff;
padding: 1px 0 0 0;}

/* this is not necessary for nav drop-downs-- prettying it up */
ul#nav li ul li a {
	color: #FFFFFF;
	padding: 5px 5px 5px 5px;
	text-decoration: none;
	}
/* this is not necessary for nav drop-downs-- prettying it up */
#nav li li a:hover {
	color: #FFFF99;
	background-color:#424DAD;	
}
#nav li ul {
	position: absolute;
	background-color:#00148E;
	width: 150px;
	left: -999em;
	padding: 2px 0px 2px 0px;	
	}
#nav li ul li{text-align: left;}

#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
	
}
li:hover ul, li.over ul { /* lists nested under hovered list items */
	
	/* end functional-necessary attributes, begin prettying it up */
	background-color:#FFCC66;
}

/*************** END NAV ******************/



************** Footer Styles ******************/
#footer {
	text-align:center;
	clear: both;
	margin: 0;
	padding: 0;
	width:750px;	
	height: 750px;
	background-color: #FFFFFF;	
}	


#footerContent {
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	width:750px;
	font-size: 10px;
	color: #71787D;
	font-family: Verdana, Helvetica, sans-serif;
	padding: 5px 0px 5px 0px;
	background-image:url(../images/footer_bg.gif);
	background-repeat:no-repeat;
	background-color: #fff;
}

	
div.content { border: 1px solid #fff; padding: .5em; }

table#contact { border-collapse: collapse; width: 70%; }
table#contact th { font-size: 12px; }
table#contact .inline input { }
table#contact input { background: #fff; border: 1px solid #7F9DB9; padding: 5px; }
table#contact input:focus { background: #EFF7FF; }
table#contact button { padding: 5px; }
table#contact textarea { border: 1px solid #7F9DB9; padding: 5px; }
table#contact textarea:focus { background: #EFF7FF; }

table#contact input.error { background: #FFCFCF; }
p.error { color: red; }