/** marchwood conservatories css **/

/* by boris grudinin */
/* http://www.dunwoody.co.uk/ */
/* ---------------------------- */

@import "reset.css";

/* ---------------------------- */
/*** main styles ***/

html, body { font-family: "Lucida Sans Unicode", Helvetica, sans-serif; background: url(../img/bg/bg-body.jpg) left top repeat-y #95c22e; }

.left { float: left; }
.right { float: right; }

a:hover { text-decoration: none; }

div { position: relative; }

.unselected { padding-left: 15px; background: url(../img/icons/icon-radio-off.jpg) 0px 7px no-repeat; }
.selected { padding-left: 15px; background: url(../img/icons/icon-radio-on.jpg) 0px 7px no-repeat; }

a.credit { position: absolute; left: 10px; bottom: 10px; }

/* ---------------------------- */
/*** setting up the page ***/

div#main { background: url(../img/bg/bg-main.gif) 900px 175px no-repeat; height: 550px; }
div#top { height: 145px; background: url(../img/bg/bg-top-repeat.jpg) left top repeat-x;  }
div#top div.content { height: 145px; background: url(../img/bg/bg-top.jpg) left top no-repeat; width: 960px; }
div#content { float: left; overflow: hidden; width: 730px; margin-top: 6px; }
div#content div#col-left { float: left; width: 415px; margin-left: 20px; padding-bottom: 10px; }
div#content div#col-left.full-width { width: 600px !important; }
div#content div#col-right { float: right; width: 270px; }
div#footer { clear: both; width: 706px; background: url(../img/bg/bg-dotted-white.gif) left top repeat-x; margin: 10px 0px 0px 20px; padding: 15px 0px 30px; }

/* ---------------------------- */
/*** top ***/

div#top a.logo { display: block; float: left; margin: 25px 85px 0px 25px; width: 287px; height: 82px; background: url(../img/logo.jpg) left top no-repeat; }
div#top a.logo:hover { background-position: left bottom; }
div#top a.logo span { display: block; text-indent: -9999px; }

div#top img.left { margin-top: 67px; }
div#top img.right { margin: 15px 9px 0px 0px; }

/* ---------------------------- */
/*** nav ***/

ul#nav { list-style: none; margin-top: 10px; float: left; }
ul#nav li { margin-bottom: 8px; }
ul#nav li a { display: block; width: 222px; height: 37px; }
ul#nav li a.home { background: url(../img/nav/home.jpg) left top no-repeat; }
ul#nav li a.services { background: url(../img/nav/services.jpg) left top no-repeat; }
ul#nav li a.cons { background: url(../img/nav/cons.jpg) left top no-repeat; }
ul#nav li a.lantern { background: url(../img/nav/lantern.jpg) left top no-repeat; }
ul#nav li a.roof-types { background: url(../img/nav/roof-types.jpg) left top no-repeat; }
ul#nav li a.gallery { background: url(../img/nav/gallery.jpg) left top no-repeat; }
ul#nav li a.spec { background: url(../img/nav/spec.jpg) left top no-repeat; }
ul#nav li a.testimonials { background: url(../img/nav/testimonials.jpg) left top no-repeat; }
ul#nav li a.contact { background: url(../img/nav/contact-us.jpg) left top no-repeat; }
ul#nav li a.active,
ul#nav li a:hover { background-position: left bottom; }
ul#nav li a span { display: block; text-indent: -9999px; }

/* ---------------------------- */
/*** content ***/

div#content h1 { color: #ffffff; font-size: 1.6em; font-weight: normal; letter-spacing: -0.05em; margin-bottom: 16px; line-height: 1.2em; }
div#content h2 { color: #ffffff; font-size: 1.3em; font-weight: normal; letter-spacing: -0.05em; margin-bottom: 12px; }

div#content p { color: #ffffff; font-size: 0.8em; line-height: 160%; margin-bottom: 16px; }
div#content p strong { color: #fff6d7; letter-spacing: -0.05em; }

div#content a { color: #fff6d7; }

div#content blockquote { background: url(../img/bg/bg-quote-top.jpg) left top no-repeat; width: 350px; clear: both; margin-bottom: 5px; }
div#content blockquote p { background: url(../img/bg/bg-quote-bottom.jpg) right bottom no-repeat; padding: 5px 15px 10px 32px; font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; }
div#content blockquote p em { display: block; font-family: "Lucida Sans Unicode", Helvetica, sans-serif; color: #fff6d7; font-style: normal; font-size: 1.3em; letter-spacing: -0.05em; margin-top: 5px; }

div#content ul.text,
div#content ul.spec { list-style: none; margin-bottom: 10px; }
div#content ul.text li,
div#content ul.spec li { background: url(../img/icons/icon-bullet.jpg) 0px 7px no-repeat; line-height: 140%; margin-bottom: 8px; padding-left: 14px; color: #ffffff; }
div#content ul.spec li { line-height: 120%; margin-bottom: 18px; }
div#content ul.spec li em { display: block; font-style: normal; font-size: 1.2em; background: url(../img/bg/bg-dotted-white.gif) left bottom repeat-x; padding-bottom: 6px; margin-bottom: 6px; letter-spacing: -0.05em; }
div#content ul.spec li span { font-size: 0.8em; }

div#content img.splash { margin-bottom: 24px; }
div#content img.content { margin-bottom: 16px; }

/* gallery */

div#content a.roof-caps { display: block; background: url(../img/gallery/roof-caps.jpg) left bottom no-repeat; width: 415px; height: 90px; cursor: pointer; }
div#content a.roofs { display: block; background: url(../img/gallery/replacement-roofs.jpg) left bottom no-repeat; width: 415px; height: 90px; cursor: pointer; }
div#content a.walls { display: block; background: url(../img/gallery/replacement-walls.jpg) left bottom no-repeat; width: 415px; height: 90px; cursor: pointer; }
div#content a.vents { display: block; background: url(../img/gallery/roof-vents.jpg) left bottom no-repeat; width: 415px; height: 90px; cursor: pointer; }
div#content a.lead { display: block; background: url(../img/gallery/lead-work.jpg) left bottom no-repeat; width: 415px; height: 90px; cursor: pointer; }
div#content a.awkward { display: block; background: url(../img/gallery/awkward.jpg) left bottom no-repeat; width: 415px; height: 90px; cursor: pointer; }

div#content a.roof-caps:hover,
div#content a.roofs:hover,
div#content a.walls:hover,
div#content a.vents:hover,
div#content a.lead:hover,
div#content a.awkward:hover { background-position: left top; }

div#content a.roof-caps span,
div#content a.roofs span,
div#content a.walls span,
div#content a.vents span,
div#content a.lead span,
div#content a.awkward span { display: block; text-indent: -9999px; }

div#content ul.gallery { list-style: none; overflow: hidden; margin-left: -20px; padding: 0px 15px 8px; }
div#content ul.gallery li { float: left; margin: 8px 0px 0px 25px; padding-bottom: 0px !important; background: none !important; }
div#content ul.gallery li span { display: block; color: #ffffff; font-size: 1.1em; margin-bottom: 6px; }
div#content ul.gallery li a:hover { filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8; }

div#content ul.gallery-main { list-style: none; }
div#content ul.gallery-main li { background: url(../img/bg/bg-dotted-white.gif) left bottom repeat-x; padding-bottom: 12px; margin-bottom: 12px; } 

div#content ul.gallery-main li div { background: url(../img/bg/bg-gallery.jpg) left bottom no-repeat #b1d365; width: 415px; height: auto; padding: 12px 0px 4px; }
div#content ul.gallery-main li div a.close { display: none; background: url(../img/bg/bg-close-button.jpg) left bottom no-repeat; width: 415px; height: 22px; text-align: center; color: #90a55d; text-decoration: none; padding-top: 3px; margin-top: -5px; cursor: pointer; }
div#content ul.gallery-main li div a.close:hover { background-position: left top; color: #f3fbd5; }

div#content object.door { width: 415px; height: 235px; }
div#content object.splash { width: 730px; height: 269px; margin-bottom: 24px; }
div#content object.side { width: 267px; height: 209px; margin-bottom: 24px; }

/* ---------------------------- */
/*** col-left ***/

div#col-left ul.text,
div#col-left ul.spec { margin: 0px 0px 8px 10px; }
div#col-left ul.text li { font-size: 0.8em; }
div#col-left ul.large li { font-size: 0.95em; }

div#col-left form { background: url(../img/bg/bg-contact.jpg) left top no-repeat; padding: 14px 20px 12px 12px; min-height: 300px; }
div#col-left form ul li { overflow: hidden; margin-bottom: 8px; }
div#col-left form ul li.required label {}
div#col-left form ul li.header { font-size: 1.4em; letter-spacing: -0.05em; color: #fbeeba; background: url(../img/bg/bg-dotted-white.gif) left bottom repeat-x; padding-bottom: 8px; margin-bottom: 8px; }
div#col-left form ul li.top-margin { margin-top: 18px; }
div#col-left form ul li label { color: #ffffff; font-size: 1.1em; float: left; width: 150px; padding-top: 3px; }
div#col-left form ul li label.textarea { display: block; width: auto; float: none; margin-bottom: 5px; }
div#col-left form ul li label.radio { display: block; width: 100%; margin: 0px 0px 5px 5px; font-size: 0.9em; font-weight: bold; letter-spacing: -0.05em; color: #ffffff; }
div#col-left form ul li label.radio:hover { color: #fbeeba; }
div#col-left form ul li input.text { float: right; width: 210px; padding: 3px; font-size: 0.8em; color: #454545; }
div#col-left form ul li input.button { font-weight: bold; font-size: 1em; color: #454545; margin-top: 3px; }
div#col-left form ul li strong { display: block; font-size: 1.1em; font-weight: normal; color: #ffffff; margin-bottom: 8px; }
div#col-left form ul li textarea { width: 380px; height: 95px; padding: 3px; }

div#col-left div#thanks { display: none; background: url(../img/bg/bg-contact.jpg) left top no-repeat; padding: 14px 20px 12px 12px; min-height: 300px; }
div#col-left div#thanks h2 { background: url(../img/bg/bg-dotted-white.gif) left bottom repeat-x; padding-bottom: 12px; }

/* ---------------------------- */
/*** col-right ***/

div#col-right div.box { background: url(../img/bg/bg-gradient-box.jpg) left top no-repeat; width: 239px; min-height: 176px; padding: 14px 16px 12px 12px; margin-bottom: 15px; }
div#col-right div.box img.icon { position: absolute; top: 14px; right: 15px; }

div#col-right h2 { background: url(../img/bg/bg-dotted-white.gif) left bottom repeat-x; padding-bottom: 12px; }

div#col-right ul.contact { list-style: none; color: #ffffff; font-size: 0.8em; }
div#col-right ul.contact li { overflow: hidden; clear: both; line-height: 120%; margin-bottom: 7px; }
div#col-right ul.contact li strong { float: left; width: 20px; margin-bottom: 4px; }
div#col-right ul.contact li span { float: left; line-height: 1.3em; }

div#col-right ul.text li { font-size: 0.95em; }

div#col-right img { margin-bottom: 25px; }

/* ---------------------------- */
/*** footer ***/

div#footer p { color: #667c29; font-size: 0.7em; margin-bottom: 10px; }
div#footer a { color: #667c29; text-transform: uppercase; font-size: 0.65em; line-height: 110%; }
div#footer a.back-to-top { background: url(../img/icons/icon-arrow.gif) left center no-repeat; padding-left: 9px; }

div#footer ul { clear: both; overflow: hidden; }
div#footer ul li { float: left; margin-right: 8px; padding-left: 8px; line-height: 120%; background: url(../img/bg/bg-footer-link.gif) 0px 7px no-repeat; }
div#footer ul li.first { padding-left: 0px; background: none; }
div#footer ul li.credit { background: none; float: right; margin-right: 0px; }