@import url("/libs/stylesheets/base.css");
@import url("/libs/stylesheets/site/base.css");

/* main layout */
body { background:#6CF url("/images/bodyF.png") repeat-x; color:#555; font-family:Georgia, "Times New Roman", Times, serif }
#layout-wrapper { background:url("/images/faux-columns.png") repeat-x; width:990px }
#header { background:#333 url("/images/headerF.png") no-repeat; height:185px }
#header.logo { width:648px }
#wrapper { padding:0 315px 0 0; width:675px }
#layout-wrapper { background:#FFF }
#content { background:url("/images/contentF.png") no-repeat left top; padding:40px; width:595px }
#rail { background:url("/images/railF.png") no-repeat left top; margin-right:-315px; padding:40px 40px 0 0; width:275px }

/* main-menu */
.main-menu { color:#FFF; position:absolute; left:18px; top:147px }
.main-menu li { border-right:1px solid #5B65A8; float:left; padding:0 15px }
.main-menu li.last-child { border-right:none }
.main-menu a { color:#FFF; font:400 1.6em Georgia, serif; text-decoration:none }
.main-menu a:hover, .main-menu a.active, .main-menu a.active:hover { color:#E0A95E; text-decoration:none }

/* theme */
h2 { color:#242673; font:700 2.4em Arial, Helvetica, sans-serif; letter-spacing:-0.03em }
#content h2, #rail h2 { border-bottom:1px solid #CCC }

p { font-size:1em; line-height:1.7em }
a.textlink, .redcloth a { color:#242673; font-weight:400; padding:1px; text-decoration:underline }
a.textlink:hover, .redcloth a:hover { background-color:#5E237C; color:#FFF; text-decoration:none }
ul.plainlist li, ul.blanklist li, .redcloth ul li, .redcloth ol li { background:url("/images/libullet.png") no-repeat left 8px }
ol.ordered-list li { background-image:none; list-style:decimal; margin-left:20px; padding-left:0  }
#propaganda-menu { left:40px; top:5px }
#propaganda-menu a { color:#242673 }
#propaganda-menu a:hover { background-color:#242673; color:#FFF }

/* layout */
.layout .gallery { margin-left:20px; float:right }
.layout img { float:left; padding:0 5px 5px 0 }

/* gallery */
#gallery li { padding-bottom:5px }

/* services */
.services .service { float:left; margin:0 20px 20px 0; width:160px }
.services .service img { border:1px solid #DDD; height:120px; width:160px }
.services .service div { clear:both; color:#618181 }
.service .gallery { margin-left:20px; float:right }
.service fieldset dt, .service fieldset dd { display:block; float:none }
.service fieldset dt { text-align:left }
.service fieldset .actions { padding:0 }

/* articles */
.article-wrapper h3 { padding-top:0 }
.article-wrapper h3 a { color:#333; padding:1px; text-decoration:underline }
.article-wrapper h3 a:hover { background:#5E237C; color:#FFF; text-decoration:none }
.article-wrapper .entry { background:transparent; border-bottom:1px solid #CCC; padding:0 5px 10px }
.article-wrapper .entry-header { color:#999; font-size:0.9em; margin-bottom:15px }
.article-wrapper .entry-header span { display:block }
.article-wrapper .entry-header abbr { border-bottom:none; text-decoration:none }


/* rail */
.rail-menu { font-size:1.1em; margin:0 }
.rail-menu li { border-bottom:1px solid #EEE; width:275px }
.rail-menu li.last-child { border:none }
.rail-menu li.active { font-weight:700 }
.rail-menu a, .rail-menu a span { display:block; cursor:pointer; text-decoration:none }
.rail-menu a { color:#006; width:100% }
.rail-menu a span { color:#006; height:22px; line-height:1.5em; padding:1px 0 0 2px }
.rail-menu a:hover { background-color:#F78F00 }
.rail-menu a:hover span { color:#FFF; font-weight:700 }
.rail-menu li.active a span { color:#FFF }
.rail-menu li.active a, .rail-menu li.active a:hover  { background-color:#10265E; color:#333; font-weight:700 }

/* banners */
#calltoaction { display:block; height:130px; width:990px }
#calltoaction div.banner a { display:block; float:left; height:130px; width:330px; text-indent:-9999em }
.banner.onsite-inspection a { background:url("/images/actionbanner-onsite.png") no-repeat  }
.banner.roofing-services a { background:url("/images/actionbanner-roofing.png") no-repeat }
.banner.projects a { background:url("/images/actionbanner-projects.png") no-repeat }

#rail .banner { display:block; text-indent:-9999em; width:315px; padding-bottom:2px; margin:0 -40px 0 0 }
.about { background:url("/images/banner-about.png") no-repeat; height:115px }
.guarantee { background:url("/images/banner-guarantee.png") no-repeat; height:105px }
.claims { background:url("/images/banner-claims.png") no-repeat; height:115px }

/* forms */
button.submit { background:url("/images/button-submit.png") no-repeat; border:none; cursor:pointer; height:25px; text-indent:-9999em; width:90px }
button.submit:hover { background-position:left -25px }
fieldset .block h3 { border-bottom:1px solid #CCC; color:#5D237B; font-size:1.6em; font-weight:700 }
fieldset.content-form .actions { padding-left:130px }

/* organisations */
.organisations .org { float:left; margin:0 0 20px 0; width:90px }
.organisations .org img { height:65px }
.organisations .org div { clear:both; color:#777; font-weight:700; text-align:center; width:93px }

/* vcard */
.vcard dt { color:#EA4818; font-weight:700 }

/* spacing */
h2 { padding-bottom:10px; margin-bottom:30px }
.rail-menu { padding-bottom:25px }
#content fieldset { padding:20px 0 }
fieldset .block h3 { padding-bottom:10px; margin-bottom:30px } 
.layout { padding:20px 0 }
ul.plainlist li, ol.ordered-list li { padding-bottom:20px }
li ol.ordered-list { padding-top:20px }