@charset "utf-8";
/* CSS Document */
body  {
	font: medium normal Verdana, Arial, Helvetica, sans-serif;
	background: #FFFFFF;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
}
a {
	color: #999900;
	color: #669999;	
	}
a:hover {
	color: #669999;
	color: #999900;	
	}
	
#headercontainer {
	background-color: #FFFFFF;	
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	padding: 0;
	height: 260px;
	}
	
#mainnav {
	float: left; 
	width: 350px; /* since this element is floated, a width must be given */
	background-color: #FFFFFF; 
	padding: 0; 
	margin: 0; 	
	height: 260px;	
}
#mainnav ul {
	padding: 0;
	margin: 20px 0;
	}
#mainnav li {
	list-style:none;
	margin: 0;
	padding: 0;
	padding: 0 0 10px 0;	
	text-align: left;
	}
#mainnav a {
	font:bolder x-large Arial, Helvetica, sans-serif;
	color: #669999;
	line-height:23px;
	line-height:21px;
	line-height:18px;		
	letter-spacing:.08em;
	text-decoration: none;
	display:block;
	padding: 0;	
	padding: 0 0 10px 0;
	padding: 0;	
	margin: 0 0 10px 80px;		
	margin: 0 0 0 80px;			
	}
#mainnav a:hover {
	color: #747955;	
	font-weight:bold;
	}

#logo {
	margin: 0 auto;
	width: 293px;
	background: #FFFFFF  url(images/HOJRweblogo2.jpg) no-repeat center bottom;
	height: 260px;
}
#logo h1 {
	display:block;
	position: absolute;
	left: -999999px;
}
	
#sidetop {
	float: right; 
	width: 350px; /* since this element is floated, a width must be given */
	height: 260px;	
	background: #ffffff;	
	padding: 0; 
	margin: 0;
	text-align: right;
}
#sidetop h2 {
	font:bolder x-large Arial, Helvetica, sans-serif;
	color: #669999;
	line-height:28px;
	letter-spacing: .1em;
	padding: 0;	
	margin: 20px 80px 0 0;	
	}
#sidetop h3 {
	font: large bold Arial, Helvetica, sans-serif;
	color: #669999;
	line-height: 21px;	
	letter-spacing: .1em;
	padding: 0;	
	margin: 0 80px 0 0;	
	}
#sidetop h4 {
	font: normal medium Arial, Helvetica, sans-serif;
	color: #669999;
	letter-spacing: .1em;	
	padding: 0;	
	margin: 0px 80px 0 0;	
	}
#headerstripe {
	background: #92A89E  url(images/topstripegradient2.gif) repeat-x 0;	
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	height: 35px;	
	border-top: 8px solid #0088A2;
	border-bottom: 4px solid #511203;		
	}	
/*****************************************************************************************/	
		

#container { 
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border-bottom: 3px solid #511203;	
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding: 20px 0;
	background: #e7f5f9  url(images/maincontentbg3.gif) repeat-y;	
} 

#leftnav {
	float: left; 
	width: 100px; /* since this element is floated, a width must be given */
	background: #e7f5f9  url(images/colbg.gif);	
	padding: 15px 0 0 0; /* top and bottom padding create visual space within this div */
	margin: 0;
}
#rightnav {
	float: right; 
	/* width: 15em;  since this element is floated, a width must be given */
	background: #e7f5f9  url(images/colbg.gif);	
	padding: 15px 0 0 0;      /* top and bottom padding create visual space within this div */
}

/*-----------------------------------------Main Content Start-------------------------------------*/	
#mainContent {
	margin: 0 auto;
	width: 800px;
	padding: 15px 0 0 0; 
/*	background: #e7f5f9  url(images/maincontentbg2.gif) repeat-y;	*/
	} 
#homeContent p {	
	font: medium bold Arial, Helvetica, sans-serif;
	color: #333333;
	line-height:22px;
	margin:0;
	padding: 3px 0;
	letter-spacing:.1em;
	}
#homeContent h2 {
	font:bolder x-large Arial, Helvetica, sans-serif;
	color: #0088a2;		
	line-height: 28px;
	letter-spacing: 0.1em;
	padding: 0;	
	margin: 10px 0 20px 0;	
	}	
#homeContent h4 {
	font: large bold Arial, Helvetica, sans-serif;
	color: #333333;
	line-height:22px;
	margin:0;
	padding: 3px 0;
	letter-spacing:.1em;
	}		
#mainContent p {	
	font: medium Arial, Helvetica, sans-serif;
	font-size: small;
	color: #333333;
	line-height:16px;
	margin:0;
	padding: 0 0 10px 0;
	letter-spacing:.02em;	
	}
#mainContent h2 {
	font:bolder x-large Arial, Helvetica, sans-serif;
	color: #0088a2;		
	line-height: 28px;
	letter-spacing: 0.1em;
	padding: 0;	
	margin: 5px 0 10px 0;	
	}
#mainContent h3 {
	font: large bold Arial, Helvetica, sans-serif;
	color: #333333;
	line-height:22px;
	margin:0;
	padding: 3px 0;
	letter-spacing:.1em;
	}
#mainContent h4 {
	font: small bold Arial, Helvetica, sans-serif;
	font-weight: bolder;
	color: #333333;
	line-height:15px;
	margin:0;
	padding: 3px 0;
	letter-spacing:.04em;
	}	
#mainContent ul {
	font: small Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333333;		
	line-height:16px;
	letter-spacing:.1em;
	padding: 0 0 0 40px;
	margin: 0;
	}	
#mainContent li {
	font: small Arial, Helvetica, sans-serif;
	color: #333333;		
	line-height:16px;
	letter-spacing:.02em;
}
#mainContent a {
	font: small  Arial, Helvetica, sans-serif;
	font-weight: bold;	
	color: #669999;
	line-height:16px;
	letter-spacing:.1em;
	text-decoration: none;
	padding:0;
	}
#mainContent a:hover {
	color:#FFFFCC;
	color: #cccc00;
	font-weight:bold;
	text-decoration: underline;
	}	
#mainContent hr {
	color: #669999;
	background-color: #669999;	
	height: 3px;
	border: none;	
	border-color: #669999;
	}
#mainContent img {
	padding: 0 0 0 40px;
	float: right;
	}	
		
.line {
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #d0e4e4;
}	

/*-----------------------------------------Footer Start-------------------------------------*/
#footer {
	clear: both;
	background: #ffffff;
	margin: 0; /* the auto margins (in conjunction with a width) center the page */
	height: 20px;
	padding: 0;
	border-top: 18px solid #747955;	
}
#footer p{
	font:normal small Arial, Helvetica, sans-serif;
	color: #333333;
	letter-spacing:.2em;
	line-height:14px;	
	}	
/*-----------------------------------------Footer End-------------------------------------*/
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;	
}












































/********************/
/********************/
/********************/
/********************/
/********************/
/********************/