/* Sets element margins, padding, and border to 0 to even out browser differences when adding desired values later. */
html, body, p, h1, h2, h3, h4, h5, h6, blockquote, ol, ul, li, dl, dt, dd, td, form, fieldset, a {
     margin: 0; 
     padding: 0;
     border: 0;
}

html { min-height: 100%; 
	   margin-bottom: 1px; }

body {
	background: #E9E9E9; /* Sets the background color of the page to very light gray. */
	font: 100.01%  Verdana, Arial, Helvetica, sans-serif; /* Sets the default font-family. Also sets the font-size. Using percent rather than ems eliminates a Win IE tendency to make fonts huge or tiny if they are later set in ems for other elements. The strange value is because some versions of Opera render a font-size based on 100% too small. Safari, on the other hand, has trouble with 101%. Current best practice suggests the use of 100.01%. */	
	text-align: center; /* Because Internet Explorer doesn't recognize the auto margins that center a layout in the browser, we use something it gets wrong: centering text also centers all block level elements, and thus the layout is centered. Though our layout is fluid and could use percentage margins to center it in the viewport, we need this to make Jello Mold work in Internet Explorer. */ 
}

#wrapper {
	text-align:left;
	width:770px;
	margin: 0 auto;
	border: solid 1px #888; /* dark gray */
	background-color:#1C4E8A; /* cobalt blue */
	font-family: Geneva, Arial, Helvetica, sans-serif;
	/*background-image: url(http://www.usiaffinity.com/images/header_top_goldbar.gif);*/
	/*background-repeat: repeat-x;*/
	}


/* A div to hold a link to the main content in order to maintain compliance with 508 Accessibility laws. */
#skipnav {
 	position: absolute; 
	margin-left: -3000px; 
}

/* SET STYLES FOR THE DIV THAT IS OUTSIDE THE MAIN CONTAINER. -----------------------------------*/
#outside {
	background-color:#1C4E8A; /* Sets the type color for text in the div outside the main container. */

	color: #1C4E8A; /* cobalt blue */
	font-size: 1.0em;
	width: 100%;  /* Sets margins on the right and left of the div, and these also match the container div. */
	text-align: right;  /* Sets the text-alignment for the text to right. */
	margin-top: 5px; /* Sets a little space between the edge of the viewport and the div. */
	padding-top: 5px; 
	font-family: Arial, Helvetica, sans-serif;	
}

#outside ul {
	margin: 5px 12px 5px 0; /* Sets the spacing around the unordered list that will function as an accessible navigation list. */
	display: inline; /* Sets the unordered list to display on the same line with the search form. */
	}

#outside li {
	display: inline; /* Sets the list items to display horizontally. */
	}

/* The following fix corrects an IE Mac bug that creates ghost links upon hovering. */
	
/*\*//*/
#outside li {
	display: inline-block;
	white-space:nowrap;
	width:1px;
	}
/**/

#outside a:link, 
#outside a:visited {
	color: #FFF;  /* white */
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;
	padding: .1em .6em .1em  .6em;
	background: #fff url("../images/topnav_up.gif") repeat-x;  }

/* The following fix corrects display problems of these links in IE 5. */

/*  \*/
* html #outside a:link, * html #outside a:visited {
 height: 1%;
 vertical-align: bottom;
 ve\rtical-align: middle;
}
/* */

#outside a:hover, 
#outside a:focus {
	color: #FFF;
	background: #fff url("../images/topnav_over.gif") repeat-x; 
	}


/* END OUTSIDE DIV STYLES.-----------------------------------------------------------------------*/

/* SET UP THE MAIN CONTAINER FOR THE LAYOUT.-----------------------------------------------------*/
#container {
	color: #333; 
	line-height: 1.3em; 
	margin: 10px 0 0 0 ; 
	background-color: #fff;
	/* this background image creates the light blue column on the left side of the page */
	background-image:url(../images/container_bg_home_pg.gif);  /* the blue color is #e1e8f2 */
	background-repeat:repeat-y;
	background-position:left;
} 

* html #container {
	background-image:  url("images/container_bg_home_pg.jpg") repeat-y; 
} 
/* Because of the incorrect box model of Internet Explorer, the above value makes the 
border in the container background image appear in the correct place in that browser. */



/* END CONTAINER DIV STYLES.---------------------------------------------------------------------*/



/* SET UP HEADER DIV STYLES.---------------------------------------------------------------------*/ 
#header_top {
	height: 134px;
	background: #C1CBCC url("../images/header_top.gif") no-repeat left top;
}
#header_bottom {
	height: 23px;
	background: #C1CBCC url("../images/header_bottom.gif") no-repeat left top;

}

/* END HEADER DIV STYLES.-----------------------------------------------------------------------*/

/* SET UP LEFT COLUMN AND ITS CHILD DIVS.-------------------------------------------------------*/

#sidebar_left {
	display: inline;
	float: left; 
	width: 190px; 
	/*margin-left: 3px;*/
	margin-left: 0px;
	margin-bottom: 20px;
	margin-top: 17px;
	background-color:#e1e8f2;
}

#sidebar_item_left {
	/*background-color: #e1e8f2;*/
}
 
#sidebar_left p {
	margin-bottom: 5px;
	font-size: 0.8em;
	line-height: 1.5em;
	color: #1c4e8a;	 /* cobalt blue */
	margin-right: 5px; 
	margin-left: 10px; 
}

#sidebar_left h1 {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	color: #00529B;
	margin: 0;
	padding: 2px 6px 2px 8px;
	font-size: 1.4em;
	margin-bottom: 10px;
} 

#sidebar_left p a:link, #sidebar_left p a:visited {
	color: #967504; /* dark gold, almost brown */
	text-decoration:underline;
}

#sidebar_left p a:hover, #sidebar_left p a:focus {
	color: #BE9A08; /* gold */
	
	/*text-decoration:underline;*/
	text-decoration:none;
}
/* ------------------------------------------------------- */

#subnav {
	float: left; 
	width: 200px; 
	margin: 0 0 10px 0; 
	padding: 0; 
}

#subnav h3 {
	color: #686B3F;
	margin: 5px 0 0 5px;
	font-size: 0.95em;
	font-variant: small-caps;
}
 

/* The following is the Holly Hack, and it ensures that the full button is clickable in Internet Explorer for Windows. The vertical alignment corrects gaps in IE 5. */
/*\*/
* html #menu a {height: 1%;
vertical-align: bottom;
}
/* */


/* END LEFT COLUMN AREA STYLES.------------------------------------------------------------------*/

/* SET UP RIGHT COLUMN AND ITS CHILD DIVS.-------------------------------------------------------*/

#sidebar {
	display: inline;
	float: right; 
	width: 190px; 
	margin-right: 15px;
	margin-bottom: 20px;
	margin-top: 18px;

}

#sidebar_item {
	margin-bottom: 25px;
	border: 1px solid #00529B;
	background-color: #FFF;
	font-style: normal;
}
 
#sidebar p {
	font-size: 0.8em; 
	line-height: 1.3em;
	margin-right: 12px; 
	margin-bottom: 10px; 
	margin-left: 9px; 
	padding-top: 3px;
}

#sidebar li, ol {
	font-size: 0.8em;
	margin-left: 25px; 
	margin-bottom: 5px;
	}

#sidebar h3 {
	background-color: #E1E8F2;  /* pale blue */
	color: #00529B;  /* royal blue */
	margin: 0;
	padding: 6px 6px 2px 9px;
	line-height: 1.1em;
	border-bottom: 1px solid #00529B; /* royal blue */
	font-size: 0.95em;
	font-variant: small-caps;

} 

#sidebar a:link, #sidebar a:visited {
	color: #967504;   /* dark gold */
	text-decoration:underline;
}

#sidebar a:hover, #sidebar a:focus {
	/*color: #BE9A08;  gold */
	color:#003366; /* coblat blue*/
	text-decoration:none;
}

/* END RIGHT COLUMN DIV STYLES.------------------------------------------------------------------*/

/* SET UP CONTENT DIV STYLES.--------------------------------------------------------------------*/

#content {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	margin-left: 210px;
	margin-right: 225px;
	padding: 1em;
	margin-top: 2px;
}

#content h1 {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	color: #1C4E8A;
	font-size: 1.4em;
	margin-bottom: 10px;
}
 
#content h2 {
	margin: 0.5em 0 0.25em;
	color: #1C4E8A;
	font-size: 1.1em;
	}

#content p {
	margin-bottom: 12px;
	font-size: 0.8em;
	line-height: 1.4em;
	color: #000000;
}

#content p a:link, #content p a:visited, #content li a:link, #content li a:visited {	
	color: #00529B;
	text-decoration:underline;
}

#content p a:hover, #content p a:focus, #content li a:hover, #content li a:focus {
	color: #C4970A;
	text-decoration:none;
}

#content h3 {
	color: #1C4E8A;
	font-size: .9em;
	margin-top: 20px;
	padding-top:3px;
	border-top: 2px solid #C4970A;
}
#content h4 { 
	color: #1C4E8A;
	font-size: 0.8em;

}
#content h5 { 
	font-style: italic;
	color: #1C4E8A;
	font-size: 0.8em;
	margin-bottom: 10px;
}
#content h6 { 
	color: #1C4E8A;
	font-size: 0.9em;
	font-weight:bold;
	margin-top: 14px;
	}

/* Homepage List Style.-----------------------------------------------------------------------*/

#content ul li {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	color: #1C4E8A;
	font-size: 1.0em;
	font-weight: bold;
	list-style-image: url(../images/arrow.gif);
	margin-left: 20px;
	}

#content ul li ul li {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	line-height: 1.5em;
	font-weight: normal;
	color: #000; /*black*/
	list-style-type: none;
	list-style-image: none;
	margin-bottom: 15px;
	margin-left: 0px;
	background-repeat: no-repeat;
}

#content ul li ul li a:link, #content ul li ul li a:visited {
	color: #967504;
	text-decoration:underline;
}
#content ul li ul li a:hover, #content ul li ul li a:focus {
	/*color: #BE9A08; this was a lighter gold */
	color:#003366;
	/*text-decoration:underline;*/
	text-decoration:none;
	
}
	
/* END CONTENT DIV STYLES.-----------------------------------------------------------------------*/

/* SET UP FOOTER DIV STYLES.---------------------------------------------------------------------*/

#footer {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	clear: both;
	padding: 1em;
	color: #BBCAE1;
	border-top: 1px solid #888;
	text-align: center;
	font-size: 0.7em;
	background-color: #1C4E8A;
	
}

/* The Holly Hack corrects footer problems in IE 5. */
/*  \*/
* html #footer {height: 1%;}
/* */

#footer ul {
	margin: 5px 0; 
	}

#footer li {
	display: inline; 
	}

#footer a:link, #footer a:visited {
	margin: 0.2em; 
	font-size: 0.9em; 
	color: #FFF; 
}
	
#footer a:hover, #footer a:focus {
	color: #BBCAE1; 
	text-decoration: none; 
}
#footer p {
	margin: 0.2em; 
	color: #FFF; 
	}
/* SET UP FLOATED IMAGE CLASSES.-----------------------------------------------------------------*/

.arrowspacer1 {
	float: left;
	margin-right: 5px;
	border: 0;
	margin-top: 2px;
}

.image2 {
	float: left;
	margin-right: 5px;
	border: 0;
	margin-top: 2px;
}
.rghtflt {
	float: right;
	margin-left: 10px;
	border: 1px solid #687033;
}
/* END FLOATED IMAGES CLASSES-------------------------------------------------------------------*/

.pullquote {
	color: #997807;
	float: right;
	width: 150px;
	font: 1.1em/1.4em Verdana, Arial, Helvetica, sans-serif;
	margin: 10px 0 5px 10px;
	border-bottom: 2px dotted #997807;
	border-top: 2px dotted #997807;
	padding-bottom: 3px;
	padding-top: 1px;
}

.boldblue {
	font-weight:bold;
	color: #1C4E8A;
	}
	
.standout {
	float:left;
	font-size:  3em;
	padding: 10px 10px 10px 0px;
}