body {
font: 12px Helvetica, Arial, sans-serif;
color: white;
background: #990000;}

* {
margin: 0;
padding: 0;}

a {
color: white;}

a:hover {
color: white;}

p, li {
font-size: 12px;}

img {
border: none;}

h1 {
font-size: 22px;
margin-bottom: .5em;}

h2 {
font-size: 18px;}

h3 {
font-size: 16px;}

h4 {
font-size: 14px;}


/* HEADER */

#header {
margin-bottom: 10px;}

#header a.logo {
background: url(../images/logo_metalworks.gif) no-repeat;
float: left;
display: block;
font-size: 0;
text-indent: -99999px;
position: relative;
top: 7px;
width: 313px;
height: 74px;}

#header li.home {
position: relative;
top: -7px;
left: 5px;}

#header li.estimate {
font-size: 16px;
position: relative;
top: -1px;}

#header .info {
float: right;
margin-top: 16px;
height: 30px;}

#header .nav {
background: #680000;
float: right;
list-style: none;}

#header .info li, #header .nav li {
float: left;
list-style: none;}

#header .info li {
margin-left: 20px;
font-weight: bold;}

#header .nav li a {
text-decoration: none;
display: block;
padding: 10px 15px;}

#header .nav li a:hover {
background: black;}


/* DROPDOWN */

#header .nav ul {
background:#680000; /*IE6 needs this*/}

#header .nav li {
position:relative;
z-index:998;}

#header .nav li li {
border: none;
text-align:left;
float:none;
width: 150px;}

#header .nav li li a {
float:none;
border-top: 1px dotted #333;
padding: 10px 12px;}

#header .nav li ul {
float:none;
top:-999em;
left: 0;
position:absolute;}

#header .nav li:hover, #header .nav li.sfHover, #header .nav a:focus, #header .nav a:hover, #header .nav a:active {
color: #ccc;}

#header .nav li:hover ul, #header ul.nav li.sfHover ul { /* pure CSS hover is removed below */
top:34px;}

#header .nav li:hover li ul, #header .nav li.sfHover li ul {
top:-999em;}

/*following rule negates pure CSS hovers
so submenu remains hidden and JS controls
when and how it appears*/

.superfish li:hover ul, {
top:-999em;}


/* CONTENT */

#outer-container {
width: 950px;
margin: 0px auto;}

#content {
min-height: 350px;
clear: both;
color: black;
margin-top: 5px;
background: white;
padding: 20px;}

#content a {
color: #680000;}

.float-right {
float: right;
margin-left: 10px;
margin-bottom: 10px;}

.float-left {
float: left;
margin-right: 10px;
margin-bottom: 10px;}

.highlight {
color: #0b597e;}

.footnote {
font-size: 10px;}


/* HOME */

.taxcredits {
margin-top: 15px;}

.home-info {
float: right;
width: 41%;}

.home-info p {
margin-bottom: .8em;
line-height: 1.2em;}

.home h2 {
margin-bottom: 15px;
color: #990000;
text-align: center;
font-size: 14px;
clear: both;}

.home .section-block {
color: white;
min-height: 250px;
float: left;
margin: 0 48px;
background: #680000;
padding: 9px;
width: 188px;
margin-bottom: 20px;}

.home .section-block p {
font-size: 11px;
line-height: 1.3em;}

.home .section-block img {
margin-bottom: 3px;}

#content .home .section-block a {
color: white;}

.promo-block {
margin-top: 320px;
clear: both;
text-align: center;}

.promo-block p {
clear: both;
padding-top: 15px;}

.promo-block .section-block {
margin: 0 10px;
text-align: left;}

.promo-block .section-block p {
padding: 0;}

.promo-box {
float: left;
margin: 70px 10px;}

.promo-box2 {
float: left;
margin: 10px 10px;}


/* SUB PAGE CONTENT */

img.frame {
border: 3px solid #680000;}

.sub h1 {
color: #0b597e;}

.sub h2, .sub h3 {
color: #5d8ea5;}

.sub p, .sub li {
margin-bottom: 1em;}

.sub li {
margin-left: 3em;}

.sub p {
line-height: 1.3em;}

.sub h2 {
margin-bottom: .5em;}

.sub .section-block {
background: #ccc url(../images/bground_productbox.gif) repeat-y;
min-height: 169px;
clear: both;
margin: 20px 0;}

.sub .section-block img {
margin-left: 20px;
float: right;
padding: 9px;}

.sub .section-block h2, .sub .section-block p {
margin: 20px;}

.sub .section-block h2 {
padding-top: 20px;}

.sub .section-block p {
font-size: 14px;}

.sub .feature {
width: 35%;
margin: 0px auto;
background: #ccc;
text-align: center;
padding: 20px;
margin-bottom: 20px;}

.sub .feature img {
border: 3px solid #680000;}

.sub .split {
text-align: center;
width: 270px;}

.sub .split img {
margin-bottom: 10px;}

.steel img {
margin-bottom: 30px;}

.steel .float-right {
text-align: left;
width: 290px;}

.steel .float-right div {
clear: both;
margin-top: 15px;}

p.mos {color: #5d8ea5; font-size:16px; font-weight:bold;}

/* PHOTO GALLERY */

.photothumb {
width: 220px;
text-align: center;}

.photothumb p {
text-align: left;}

.photothumb, .photodetail, .gallery a img {
border: 3px solid #999;
padding: 20px;
background: #ccc;}

.photothumb, .gallery {
margin-right: 40px;
margin-bottom: 40px;}

.gallery {
float:left;}

.photodetail {
margin-top: 5px;
width: 865px;
text-align: center;}

.PagerNumberArea {
margin-bottom: 10px;}


/* BLOG */

.zoneLeft {
width: 70%;}

.zoneRight {
width: 26%;
padding: 10px;}

.BlogPTitle {
font-weight: bold;
margin-bottom: 1em;
font-size: 16px;}

.BlogPDateWhole {
background: #ccc;
border-top: 1px solid #680000;
margin-top: 5px;
padding: 5px;
font-size: 11px;}

.blackBox h2.title {
font-size: 14px;
color: white;
background-color: #680000;
padding: 5px;}

.blackBox {
border: 1px solid #680000;
margin-bottom: 20px;}

.blackBox .content {
padding: 5px;}

.comments hr {
border: 0;
color: #ccc;
background-color: #ccc;
height: 1px;}

/* FORMS */

.form {
width: 850px;
margin-bottom: 20px;
}

.label {
text-align: right;}


/* FOOTER */

#footer {
font-size: 11px;
margin-top: 10px;
margin-bottom: 10px;
padding: 30px;
background: #680000;
text-align: center;}

#footer p {
font-size: 11px;
margin-top: 10px;}

#footer .nav {
font-weight: bold;
list-style: none;}

#footer .nav li {
border-left: 1px solid white;
border-right: 1px solid white;
display: inline;}

#footer .nav li a {
text-decoration: none;
padding: 0 10px;}

#footer a:hover {
color: #cacaca;}

#footer .nav li.first-item {
border-left: none;}

#footer .nav li.last-item {
border-right: none;}


/* FIXES */

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;}

.clearfix {
display: inline-block;}
/* Hides from IE-mac \*/
.clearfix {
display: block;}
/* End hide from IE-mac */

.lightboxHolder {margin: 1em auto; width: 780px;}