@charset "utf-8";

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td{
margin:0;
padding:0;
font-weight:inherit;
font-style:inherit;
font-family:inherit;
text-align:left;
}

body{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000;
background:#b8ac74 url(images/background.jpg) top center repeat;
text-align:center;
}

p,ul,ol,table,form,blockquote{
margin-bottom:10px;
}

h1,h2,h3,h4,h5,h6{
color:#b61f1f;
font-weight:bold;
}
h1{
font-size:20px;
}
h2{
font-size:18px;
}
h3{
font-size:16px;
}
h4{
font-size:14px;
}
h5,h6{
font-size:12px;
margin: -4px -10px 0 -10px;
padding-left: 8px;
padding-top:3px;
background: url(images/title.jpg) 0 0 repeat-x;
height: 20px;
color:#000000;
border-bottom: #000 1px solid;
}

a{
color:#00f;
text-decoration:underline;
}
a:hover{
color:#f00;
}

/* table styles */
td{
vertical-align:top;
}

/* A class is used for formatting tables so nothing weird happens
   when someone wants to use a table for layout. */
table.dataTable{
}
.dataTable caption{
color:#06C;
font-weight:bold;
font-size:14px;
}
.dataTable tr{
}
.dataTable th, .dataTable td{
text-align:left;
padding:5px;
}
.dataTable th{
font-weight:bold;
color:#fff;
background:#336699;
}
.dataTable td{
border-bottom:1px solid #ccc;
}
.light {
background:#F5F5F5 none repeat scroll 0 0;
border: #999999 1px solid; 
padding: 15px 15px 0 15px;
}
.light td{
padding-bottom:10px;
}
.light img{
display: block;
margin-left: auto;
margin-right: auto 
}



p{
}
strong,b{
color:#000;
font-weight:bold;
}
em,i{
color:#f00;
font-style:italic;
}
hr{
height: 0;
border: 0;
width:100%;
border-bottom: 1px solid #ccc;
margin:6px 8%;
}
blockquote{
font-style:italic;
margin:0 20px 10px 20px;
}

.right{
float:right;
margin:0 0 10px 10px;
}
.left{
float:left;
margin:0 10px 10px 0;
}
.clear{
clear:both;
}

/* Begin your layout styles here. Override default styles where necessary. */

#banner{
width:100%;
height:121px;
text-align:center;
background:#fff url(images/banner-tile.jpg) 0 0 repeat-x;
}
#banner div {
width:800px;
margin:0 auto;
background:url(images/header-valves.jpg) right 17px no-repeat;
}
h2#logo {
color:#000;
padding:30px 0 16px 0;
}
h2#logo a, h2#logo a:hover {
text-decoration:none;
color:#000;
}

#topnav {
width:100%;
height:42px;
text-align:center;
background:#cca84d url(images/navbar.jpg) center top repeat-x;
}
#topnav ul {
width:800px;
margin:0 auto;
padding:0;
list-style:none;
}
#topnav ul li {
margin:0;
padding:0;
float:left;
}
#topnav ul a {
display:block;
color:#000;
font-size:14px;
font-weight:bold;
text-decoration:none;
margin:1px 0;
padding:7px 20px 6px 20px;
}
#topnav ul a:hover {
color:#fff;
background:#8a581f url(images/nav-hover.jpg) center top no-repeat;
}

#page {
clear:both;
width:816px;
margin:0 auto;
background:#fff url(images/page-tile.jpg) 0 0 repeat-y;
}
#page_header {
height:28px;
background:url(images/page-top.jpg) center top no-repeat;
}

#content {
float:right;
display:inline;
width:565px;
margin:10px 23px 10px 10px;
color:#333;
}
#content h1 {
color:#b61f1f;
font-size:24px;
font-weight:normal;
}
#content p {
line-height:20px;
}
#content ul {
margin-top:5px;
font-weight:bold;
}
#content ul li {
margin: 0 10px 0 25px;
padding:0 0 2px 0px;
}

#content-header {
width: 565px;
height: 170px;
margin: 0px 0px 10px 0px;
background: #000 url(images/bg-content-header.png) 0 0 repeat-x;
border: #ccc 1px solid;
color:#fff;
}
#content-header h1 {
text-align:center;
color:#f1f1f1;
font-style:bold;
margin-top: 10px;
}

#container-left {
float:left;
height: 200px;
width:265px;
padding: 0 10px 0 0;
background-color:#fff;
border: #fff 1px solid;
}

#container-right {
float: right;
width:250px;
height: 191px;
background-color:#dfdfdf;
border: #666666 1px solid;
padding-left:10px;
padding-right:10px;
padding-top: 4px;
}

#container-right a, #container-right a:visited, #container-right a:hover {
color:#336699;
}

.introduction {
border-bottom: #b61f1f 1px solid;
margin: 0px 155px 10px 0px;
font-size: 14px;
}
.centered{
text-align:center;
}

#sidenav {
float:left;
display:inline;
width:184px;
margin:14px 0 0 24px;
min-height:300px;
}
#sidenav h2 {
color:#333;
font-size:16px;
padding:0 0 0 0;
}
#sidenav ul {
list-style:none;
margin:10px 0;
}
#sidenav ul li {
background:url(images/bullet-gray-bg.png) 0 5px no-repeat;
padding:0 0 0 16px;
line-height:20px;
}
#sidenav a {
color:#333;
text-decoration:none;
}
#sidenav a:hover {
text-decoration:underline;
}

#nav2{
}
#nav2 a{
color:#b61f1f;
font-weight:bold;
}
#nav2 a:hover{
color:#b61f1f;
font-weight:bold;
}
#nav2 a:visited{
color:#b61f1f;
font-weight:bold;
}

#lead {
float:left;
background: #fff url(images/lead-head.png) 0 0 repeat-x;
padding:5px 5px 0 5px;
margin:10px 10px 10px 0px;
text-align: center;
color:#CCCCCC;
}
#lead h1 {
margin:0 5px 5px 5px;
text-align: center;
color:#CCCCCC;
font-size: 10px;
}
#lead p {
background: #FFFFFF;
color:#000000;
font-size: 10px;
text-align: left;
margin-top: 10px;
}

#footer {
clear:both;
height:68px;
background:#505050 url(images/page-bottom.jpg) center bottom no-repeat;
color:#bfbfbf;
font-size:11px;
line-height:16px;
}
.ft_left {
float:left;
width:340px;
margin:12px 0 0 24px;
}
.ft_mid {
float:left;
width:150px;
margin:12px 12px 0 12px;
}
.ft_right {
float:right;
margin:12px 24px 0 0;
}
.ft_img{
padding: 2px 0 0 0;
}
#footer a {
color:#bfbfbf;
}
#footer a:hover {
text-decoration:none;
}