body {
  margin: 0;
  padding: 0;
  font-size: 10px;
  font-family: Verdana, Arial, sans-serif;
  background: #bf2424 url(../images/page_bg.jpg) repeat-x top left;
}
ul, li, h1, p, img { margin: 0; padding: 0; border: none; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
h4 { font-size: 1.1em; font-weight: bold; margin: 0; padding: 0; }
a.red_button, input.red_button {
  display: block;
  width: 114px;
  height: 24px;
  padding: 3px 0 3px 10px;
  font-weight: bold;
  color: #fff;
  background: url(../images/red_button.png) no-repeat top left;
}
input.red_button { border: none; text-align: center; padding: 3px 0; }
a.gray_button {
  display: block;
  width: 105px;
  height: 14px;
  padding: 4px 0 6px 10px;
  font-weight: bold;
  color: #fff;
  background: url(../images/gray_button.png) no-repeat top left;
}
#container { margin: 0 auto; padding: 0; width: 900px; }


#header {
  margin: 30px 0 0 0;
  padding: 0;
  width: 900px;
  height: 200px;
  background: url(../images/header_bg.jpg) repeat-x bottom left;
}
  #locations {
    margin: 0;
    padding: 0;
    position: relative;
    top: 20px;
    line-height: 14px;
    font-size: 1.4em;
    color: #fff;
  }
  #logo { margin: 66px 0 16px 20px; float: left; }
  #header_image { margin: -8px 0 0 0; float: right; }
 
  
#navigation { margin: 5px 0 0 0; }
  #navigation ul {
    width: 900px;
    height: 46px;
    list-style: none;
    background: url(../images/nav_bg.jpg) repeat-x top left;
  }
  #navigation li { float: left; }
  #navigation a {
    display: block;
    height: 26px;
    padding: 12px 25px 8px 25px;
    color: #000;
    font-size: 1.5em;
    text-align: center;
    text-decoration: none;
    border-left: 1px solid #b2b2b2;
    border-right: 1px solid #fff;
  }
  #navigation a:hover {
    text-decoration: none;
    background: url(../images/nav_bg_hover.jpg) repeat-x top left;
  }
  #navigation a.first { border-left: none; }
  #navigation a.last { border-right: none; }
  

#content { float: left; background: url(../images/content_bg.gif) repeat-y top left; margin: 5px 0 0 0; }
  #sidebar { width: 201px; float: left; background: #d9d9d9; }
    #sidebar p { padding: 15px; }
    #sidebar p img { border: 5px solid #fff; }
    #sidebar a { color: #c33; text-decoration: none; }
    #sidebar a:hover { text-decoration: underline; }
    #sidebar a.gray_button { color: #fff; }
  #main { float: left; width: 699px; background: #fff; }
    #main h1 { padding: 10px 30px 0 30px; font-size: 1.3em; font-weight: bold; }
    #main p { font-size: 1.1em; line-height: 1.5em; padding: 20px 30px; }
    #main p img { margin: 5px; }
    #main p.download_pdf { float: right; }
    #main p span, form p span { color: #c33; font-weight: bold; font-size: 1.1em; }
    #main ul { color: #666; padding: 0 0 0 55px; }
    #main p.phase1 { background: url(../images/1.jpg) no-repeat top left; padding: 0 0 0 40px; min-height: 40px; }
    #main p.phase2 { background: url(../images/2.jpg) no-repeat top left; padding: 0 0 0 40px; min-height: 40px; margin: 20px 0 0 0; }
    #main p.phase3 { background: url(../images/3.jpg) no-repeat top left; padding: 0 0 0 40px; min-height: 40px; margin: 20px 0 0 0; }
  #contact_form { float: left; width: 860px; background-color: #e2e2e2; padding: 30px 20px; }
    .form_section { border-bottom: 1px solid #999; padding: 10px 0; float: left; clear: both; width: 860px; }
    .form_section p { margin-bottom: 20px; }
    .form_group { float: left; }
    #top dt, #top dd { float: left; margin: 0; padding: 0; }
    #top dt { width: 80px; text-align: right; clear: left; padding: 4px 2px 0 0; }
    #top dd { padding: 0 0 3px 0; }
    #top dt.pair { clear: none; }
    #contact_info { width: 480px; }
    #mailing_address, #jobsite { width: 360px; }
    #top #mailing_address dt, #top #jobsite dt { width: 40px; }
    #middle #style { float: left; width: 450px; }
    #middle #style dt, #style dd { margin: 0; padding: 0; float: right; }
    #middle #style dt { padding: 2px 10px 0 0; }
    #middle dt, #middle dd { margin: 0; padding: 0; text-align: center; font-size: 0.9em; }
    #standard {
      width: 200px;
      clear: left;
      margin: 50px 90px 0 90px;
      background: url(../images/standard.jpg) no-repeat top left;
    }
    #standard h4 { position: relative; top: 150px; left: -5px; text-align: center; }
    #standard .s_roofpitch { position: relative; top: -45px; left: 60px; }
    #standard .s_eaveheight { position: relative; top: -30px; left: 110px; }
    #standard .s_width { position: relative; top: 15px; left: -5px; }
    #standard .s_overalllength { position: relative; top: -19px; left: 115px; }
    #standard_with_shed {
      width: 260px;
      margin: 50px 90px 0 90px;
      background: url(../images/standard_with_shed.jpg) no-repeat top left;
    }
    #standard_with_shed h4 { position: relative; top: 155px; left: 5px; text-align: center; }
    #standard_with_shed .sws_roofpitch { position: relative; top: -40px; left: 85px; }
    #standard_with_shed .sws_shedroofpitch { position: relative; top: -50px; left: -90px; }
    #standard_with_shed .sws_eaveheight { position: relative; top: -50px; left: 140px; }
    #standard_with_shed .sws_shedeaveheight { position: relative; top: -70px; left: -140px; }
    #standard_with_shed .sws_width { position: relative; top: -45px; left: 30px; }
    #standard_with_shed .sws_shedwidth { position: relative; top: -80px; left: -78px; }
    #standard_with_shed .sws_overalllength { position: relative; top: -112px; left: 150px; }
    #monitor {
      width: 200px;
      clear: left;
      margin: 10px 40px 20px 20px;
      background: url(../images/monitor.jpg) no-repeat top left;
    }
    #monitor h4 { position: relative; top: 150px; left: -5px; text-align: center; }
    #monitor .m_roofpitch { position: relative; top: -45px; left: 60px; }
    #monitor .m_eaveheight { position: relative; top: -30px; left: 110px; }
    #monitor .m_width { position: relative; top: 15px; left: -5px; }
    #monitor .m_overalllength { position: relative; top: -19px; left: 115px; }
    #gambrel {
      width: 200px;
      margin: 0 40px 20px 40px;
      background: url(../images/gambrel.jpg) no-repeat top left;
    }
    #gambrel h4 { position: relative; top: 160px; left: -5px; text-align: center; }
    #gambrel .g_roofpitch { position: relative; top: -45px; left: 40px; }
    #gambrel .g_roofpitch2 { position: relative; top: -45px; left: 90px; }
    #gambrel .g_eaveheight { position: relative; top: -35px; left: 110px; }
    #gambrel .g_width { position: relative; top: -10px; left: -5px; }
    #gambrel .g_overalllength { position: relative; top: -44px; left: 115px; }
    #roof_only {
      width: 200px;
      margin: 0 20px 20px 40px;
      background: url(../images/roof_only.jpg) no-repeat top left;
    }
    #roof_only h4 { position: relative; top: 160px; left: -5px; text-align: center; }
    #roof_only .ro_roofpitch { position: relative; top: -35px; left: 60px; }
    #roof_only .ro_eaveheight { position: relative; top: -20px; left: 110px; }
    #roof_only .ro_width { position: relative; top: 25px; left: -4px; }
    #roof_only .ro_overalllength { position: relative; top: -9px; left: 115px; }
    table { text-align: right; margin: 10px 0 0 40px; }
    td.label { text-align: left; font-weight: bold; }
    #comments { margin: 10px 0 0 60px; }
    #comments dt, #comments dd { margin: 0 0 3px 0; padding: 0; }
    #comments dt { font-weight: bold; }
    #comments dd textarea { width: 400px; height: 80px; }
  .form_footer { color: #c33; font-weight: bold; float: left; width: 860px; padding: 5px 0 0 0; }
    .form_footer strong { text-transform: uppercase; }
    .form_footer input { float: right; }


#footer { color: #fff; width: 900px; clear: left; float: left; margin: 5px 0 0 0; }
  #footer a { color: #fff; text-decoration: none; }
  #footer a:hover { text-decoration: underline; }
  #footer p { float: left; width: 500px; }
  #footer p.copyright { width: 300px; float: right; text-align: right; }
  #footer img { margin: 20px 0; }