/* TWO COLUMN LAYOUT */
/* a fix for IE6 only - see Star Hack in Stylin' with CSS to see how the comments and * html hide this hack from other browsers \*/

/* triggers IE6 "haslayout" - google 'IE6 haslayout' for details*/
	
/* without the above hack, IE6 does not draw the header until the page is resized */
/* the problem is triggered by the universal * selector below that resets the margins, but I need to do that, hence the hack */
* {
	margin:0;
	padding:0;
	}
a {
	color:#999999;
	}

body {
	text-align:center; /* IE6 needs this to center the layout in the browser window */
	font: 62.5% Arial, Helvetica, sans-serif; /* 1em = 10pts */
	background:#9ea4ab url(img/vertbodybg.gif) repeat-x;
	}
#main_wrapper {
	width:800px;
	margin-top:10px; /* moves main_wrapper down from top of page*/
	margin-left:auto;  /* centers layout in browser */
	margin-right:auto; /* centers layout in browser */
	text-align:left; /* resets the centering hack for IE6 on the body tag */
	background-color:#FFFFFF;
	}
#header {
	height:100%;
	background-color:#48575a;
/*Jeannes color:  background-color:#6a737b;*/
	}
#graphic{
	margin:0;
	padding:0;
	clear:both;
	height:175px;
	/*background-color:#fff1d9;*/
}

#graphic img{
	display:block; /*necessary for IE 6*/
}

/*NAVIGATION START*/
#nav {
	width:800px;
	text-align:center;
	background-color:#fea620;/*Orange*/
	/*background-color:#626f74; /*Dark Gray*/
	/*background-color:#9ea4ab; /*Light Gray*/
	}
#nav_inner {
	width:800px;
	margin-left:0;
	padding:0; /*creates space between the box  and the content */
	}
/*NAVIGATION END*/

/* here comes a hack for IE6 */
/* floating this element gets rid of the gap between the col and content - the hateful 3 pixel jog bug in IE */
/* if I float this element in other browsers, the layout breaks - don't remove this comment \*/
* html #content { 
	float:left; 
	}
/* end of hack - don't remove this comment */
#footer {
	background-color:#FFFFFF;
	clear:both; /* makes the footer sit below whichever column is longest */
	/*border-top: 1px dotted #889094;*/
	}
#header_inner, #nav_inner, #leftcol_inner, #content_inner, #rightcol_inner {
	overflow:hidden; /* clips oversize elements that would otherwise expand divs and break the layout */
	}
#header_inner {
	height:48px; /*The logo is 48px high*/
	padding:1em 1em 1em 1.8em; /* creates space between the box and the content */
	}
#header_left {
	height:100%;
	width:358px;
	float:left;
	display:inline;
	position:relative;
    }
#footer p {
	margin:0;
	margin-bottom:.25em;
	font-size:1em; /* 10pt */
	color: #666666;
	}
#footer_inner {
	margin:1em .5em; 
	padding:1em .5em; /* creates space between the box and the content */
	text-align:center;
	border-top: 1px dashed #dbdddf; /*OPTION 1 - GREY BORDER*/
	/*border-top: 1px dashed #fea620; /*OPTION 2 - ORANGE BORDER*/
	}
.footnav {
  font: 9px Verdana;
  color: #015294;
  margin-top: 10px;
  margin-bottom: 5px;
}

.footnav a {
  font: 9px Verdana;
  color: #999999;
  text-decoration: none;
}

.footnav a:hover {
  color: #666666;
  text-decoration: none;
}

.footnav span {
  font: 11px Verdana;
  color: #666666;
  padding-right: 4px;
  padding-left: 4px;
}

.footnav img {
  margin: 0px 4px 0px 4px;
}

/* GENERAL FONT SIZES / COLORS*/
p  {
	font-size:1.1em; /* 11pt */
	line-height:1.25; /* on 15pt */
	margin-bottom:.75em; /* 12pts of space */
 	color:#333333;
	}
img {
	border:0;
	}
/* THE ALSETT CLEARING METHOD */
	.clearfix:after {
 content:".";
 display: block; 
 height: 0;
 clear: both;
 visibility: hidden;
}
.clearfix {display:inline-table;}
/* backslash hack hides from IE mac \*/ LEAVE THIS COMMENT RIGHT HERE! 
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* end backslash hack */ 
/*#main_wrapper, #nav, #content, #header_inner, #col_inner, #footer_inner {
	border:1px solid red;
	}
#header, #col, #footer, #nav_inner, #content_inner {
    border:1px solid blue;
	}*/
	
.float_left {float:left; margin: 0 .3em .3em 0;}      /* apply this class to any image or element with width - text will wrap it to the right */
.float_right {float:right;  margin: 0 0 .3em .3em;} /* apply this class to any image or element with width  - text will wrap it to the left */
.colheader, .promoheader {
	padding-left:2em;
	padding-top:.7em;
	padding-bottom:.7em;
	}
.colheader {
	background-color:#fff1d9; 
	}
.promoheader {
	background-color:#d8dee6;
	}
.colheader h2, .promoheader h2 {
	font:normal 1.6em Arial, Helvetica, sans-serif; 
	color:#333333;
	}
.contactinfo ul{
	list-style-type:none;
	font:.8em/1 sans-serif;
	}
.contactinfo li {
	color:#666;
}
.contactinfo span{
	color:#000;
	font-weight:bold;
}
a {
text-decoration:none;
}
ul {
	list-style-type:none;
	}
#leftcol {
	width:174px;
	float:left;
	border-right:1px dashed #ff9728;
	background:#FFF url(img/contentbackground.gif) repeat-x 0 25px;
	}
#content {
	width:345px;
	float:left;
	background:#FFF url(img/contentbackground.gif) repeat-x 0 25px;
	}
#rightcol {
	width:280px;
	float:left;
  	background-color:#e4e9ee;
	}
#leftcol_inner, #content_inner, #rightcol_inner {
	margin-top:.5em;
	margin-bottom:.5em;
	padding:1em 2em; /* creates space between the box and the content */
	}
#leftcol_inner {
	margin:1em 0;
	}
#rightcol_inner h4{
	margin-bottom:.5em;
	font-size:1.2em;
	font-weight:normal;
	}
#rightcol_inner img{
	margin-top:25px;
	}
#rightcol_inner ul li a{
	background: url(img/orangearrow.gif) left center no-repeat;
	font-size:1.1em;
	padding-left:15px;
	color:#5f6668;
	text-decoration:none;
	}
#rightcol_inner ul li a:hover
{
   color:#333;
   background: url(img/grayarrow.gif) no-repeat left center;
   padding-left:15px;
}