@charset "utf-8";
/* CSS Document */

body {
margin:0 auto;
padding:0;
color:#666666;
font:10pt Arial, Helvetica, sans-serif;
background:url(../images/body-bg.gif) repeat-x;
}

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

a:hover {
text-decoration:underline;
}


h1 {
	font:bold 15pt Arial, Helvetica, sans-serif;
	color:#333333;
	padding:0 0 0 15px;
}

h2 {
	font:bold 14pt Arial, Helvetica, sans-serif;
	color:#333333;
	padding:0 0 0 0px;
}

h3 {
	font:bold 11pt Arial, Helvetica, sans-serif;
	color:#333333;
	padding:5px 0 0 0px;
}

#wrapper {
margin:0 auto;
padding:0;
width:100%;
}

.site-area{
margin:0 auto;
padding:0;
width:983px;
}

#header {
padding:60px 15px 0 0;
margin:0;
width:968px;
}
#logo {
padding:0px 0 22px 0;
margin:0;
width:265px;
height:51px;
float:left;
}

#topRight {
padding:0px 0 0px 0;
margin:0;
width:641px;
float:right;text-align:right;
}

#slogan {
padding:0px 0 5px 0;
margin:0;
width:553px;
text-align:right;
font:bold 13pt Arial, Helvetica, sans-serif;
color:#333333;
float:right;
}

.work-area {
width:965px;
clear:both;
margin: 0 auto;
padding:0 9px;
background:url(../images/work-area-bg.png) repeat-y;
}

#left-area {
width:134px;
margin: 0;
float:left;
padding:0 9px
}

#left-area ul {
	margin: 0px;
	padding: 0px;
	text-align: left;
	}
#left-area ul li {
	display: block;
	list-style-type: none;
	margin: 0px;
	width:134px;
font:bold 9pt Arial, Helvetica, sans-serif;
text-align:right;
border-bottom:1px solid #84b6ed;
padding:0px 0;
	}
#left-area ul li.first {
	border: none;
}
#left-area ul li.home {
	border: none;
}
#left-area ul li a {
	display: block;
	margin: 0px; 
	color:#000;
padding:7px 40px 7px 10px;
text-decoration:none;
	}
/* if you want to set a "current page item" style, do it here */
#left-area ul li.current_page_item a, #left-area ul li.current_page_item a:visited {

}


/* This handles the hover state for the top-level LI and A items */

#left-area li:hover, 
#left-area li.sfhover {
display:block;
	text-decoration: none;	position:relative;
border-bottom:1px solid #84b6ed;	
	color:#336699;
background:url(../images/blue-arrow.gif) no-repeat right 10px;
	}
/* This hides the nested UL before you hover */
#left-area li ul {
	position: absolute;
	width:210px;
	left: -999em;
	top:0px;
float:left;
}
/* This shows the nested UL when you hover */
#left-area li:hover ul, #left-area li.sfhover ul {
	left:134px;
	display: block;
	z-index: 1000;
	
}

/* This is the style for the nested UL */
#left-area li:hover ul, #left-area li.sfhover ul {
	display: block;
	margin: 0px; padding: 0px;
}
/* This is the style for the LI items within the nested UL */
#left-area li:hover ul li,
#left-area li.sfhover ul li {
	background: #d7ebff;
	width: 210px;
	display: block;
	padding: 0px; margin: 0px;
border:none;
	text-align: left;
}

#left-area li a.active{
color:#336699;
background:url(../images/blue-arrow.gif) no-repeat right 10px;
}
/* This is the style for the links withing the LI items within the nested UL */
#left-area li:hover ul li a,
#left-area li:hover ul li.current_page_item a,
#left-area li.sfhover ul li a,
#left-area li.sfhover ul li.current_page_item a {
	display: block;
	height: 20px;
	margin: 0px; padding:5px 10px  5px 15px;
	border: none;
	color: #000;
font:bold 9pt Arial, Helvetica, sans-serif; line-height: 20px;
}
/* This is the style for the hover state on the links within the LI items within the nested UL */
#left-area li:hover ul li a:hover, #left-area li.sfhover ul li a:hover {

	color: #000;
	background:#84b6ed;	

}

#right-area {
width:auto;
margin: 0 0 0 152px;
padding:25px 0px
}



#banner {
width:813px;
margin: 0;
float:left;
padding:0px 15px;
}

#banner-area {
margin: 0 0 10px 0;
padding:10px 5px 10px 10px;
border-bottom:2px solid #ffba33;
}

.banner {
width:auto;
margin:0 3px;
float:left;
padding:11px;
background:#ffba33;
}

.banner .img{
border:1px solid #fff;
}

.banner-link{
color:#000;
padding:10px 10px;
font:bold 11pt Arial, Helvetica, sans-serif;
background:url(../images/banner-links.gif) no-repeat right 12px;
text-align:right;
}

.banner-link a{
color:#336699;
padding:0px 15px 0 0;

}

.banner-link a{
color:#336699;
}

#content-area {
margin: 0 0 0px 0;
padding:10px 35px;
width:auto;
}

#content-area p {
font:10pt Arial, Helvetica, sans-serif;
color:#666666;
padding:5px 0 5px 0px;
margin:0;
line-height:18px;
}



#content-area ul{
margin:0;
padding:0px 0 0 150px;
}

#content-area li{
margin:0;
font:bold 11pt Arial, Helvetica, sans-serif;
padding:5px 0 5px 20px;
background:url(../images/yellow-tick-bullet.gif) no-repeat left 8px;
color:#336699;

}

#content-area li a{
color:#336699;

text-decoration:none;
}

#content-area li a:hover{
color:#ffba33;
text-decoration:underline;
}

#footer{
width:965px;
clear:both;
margin: 0 auto;
padding:0 9px;
background:url(../images/footer-bg.png) repeat-y;
}


.footer-area {
width:935px;
clear:both;
margin: 0 auto;
padding:15px;
border-top:2px solid #333333;
}

.footer-area a{
margin:0;
font:9pt Arial, Helvetica, sans-serif;
padding:5px 4px;
color:#333333;

}

.footer-area a:hover{
color:#333333;
text-decoration:underline;
}


.copyright {
padding:20px 0 0 0
}