@import url("reset.css");

/* -------- Faulkners CSS  ---------- **/
/* ----------------- by SJJ ---------------- */


* { font-family: Arial, Verdana, Tahoma, Helvetica, sans-serif; line-height: 140%; color: #222323;}
body {background: #ffffff url(../img/bg/body.gif) top left repeat-x;}

hr { text-align: right; width: 100%;  height: 1px; color: #b7c0c9; border: none; margin-bottom: 15px; clear: both;} /* For Internet Explorer */
html>body hr { margin-right: 0; width: 100%; height: 1px; background-color: #b7c0c9; border: none; } /* For Gecko-based browsers */
html>body hr { margin-right: 0; width: 100%; height: 1px; background-color: #b7c0c9; border: 0px solid #b7c0c9; } /* For Opera and Gecko-based browsers */

div.wrapper {width: 980px; margin-left: auto; margin-right:auto; clear: both;  }

#topnav {width: 100%; background: #9ca1a0 url(../img/bg/topnav.gif) bottom left repeat-x;}
#topnav div.wrapper {overflow: hidden; background: url(../img/headings/logo-top.gif) 229px bottom no-repeat;}
#topnav ul {margin-top: 9px; margin-bottom: 9px; float: left; font-size: 70%;}
#topnav ul li {float: left; }
#topnav ul li a {color: #ffffff; text-decoration: none; margin-right: 10px; padding-right: 10px; border-right: 1px solid #ffffff; }
#topnav ul li a:hover {text-decoration: underline;}
#topnav ul li.last a {border-right: none;}

#topnav p.phone {float: right; text-indent: -9999px; background: url(../img/headings/phone.jpg) top right no-repeat; width:252px; height:17px; margin: 7px 0px }
#topnav a.login {float: right; text-indent: -9999px; background: url(../img/buttons/login.jpg) top right no-repeat; display: none; width: 68px; height: 20px; margin: 5px 0px 5px 10px; }
#topnav a.login:hover { background-image: url(../img/buttons/login-active.jpg);}

/* ----------------- Header ---------------- */
#header { overflow: hidden; position : relative; height: 184px; padding-bottom: 6px; z-index: 0; }
#header a.logo {  display: block; width:300px; height:95px; text-indent: -9999px; background: url(../img/headings/logo-bottom.gif) top left no-repeat; top: 0px; left: 10px; position: absolute;} 
#header ul.mainnav {top: 117px; left: 0px; position: absolute; padding-left: 78px; background: url(../img/nav/bg.gif) 0px 17px no-repeat; overflow: hidden; height: 45px; z-index: 10; width: 100%;} 

#header ul.mainnav li { float: left; background-position: top left; background-repeat: no-repeat; margin-right: 13px; z-index: 11; }
#header ul.mainnav li a {text-indent: -9999px; display: block; width: 131px; height: 38px; z-index: 12;}
#header ul.mainnav li a:hover, #header ul li.active a {background: url(../img/nav/hover.gif) center bottom no-repeat;}
#header ul.mainnav li.n1 {background-image: url(../img/nav/home.jpg);}
#header ul.mainnav li.n2 {background-image: url(../img/nav/services.jpg);}
#header ul.mainnav li.n3 {background-image: url(../img/nav/products.jpg);}
#header ul.mainnav li.n4 {background-image: url(../img/nav/green-energy.jpg);}
#header ul.mainnav li.n5 {background-image: url(../img/nav/clients.jpg);}

#header ul.secnav {position: absolute; top: 149px; left: 0px; border-top: 1px solid #bbbebd; background-color: #bbcac6; overflow: hidden; height: 25px; z-index: 1; padding-top: 9px; width: 100%; display: block;}
#header ul.secnav li {float: left; z-index: 2;}
#header ul.secnav li a {display: block; padding: 0px 17px 0px 15px; background: url(../img/nav/secnavdivider.gif) top right repeat-y; z-index: 3;  text-decoration: none; color: #42504c; font-size: 75%; font-weight: bold; margin-bottom: 9px;}
#header ul.secnav li a:hover, #header ul.secnav li.active a {color: #282d2c;}
#header ul.secnav li.last a {background-image: none;}

#header div.emptynav {height: 35px; position: absolute; top: 149px; left: 0px; border-top: 1px solid #bbbebd; background-color: #bbcac6;  z-index: 1; width: 100%;  }


#header div.accreditation { width: 620px; position: absolute; top: 30px; left: 337px; background: #ffffff;  border: 1px solid #bdbdbd; padding: 8px; padding-left: 13px;}
#header div.accreditation ul {overflow: hidden; height: 1%;  display: block;  }
#header div.accreditation ul li {float: left;  padding: 0px; height: 60px;}
#header div.accreditation ul li a {height: 41px; margin-top: 10px; display: block; text-indent: -9999px; background-position: top left; background-repeat: no-repeat; margin-right: 18px;}
#header div.accreditation ul li.gassafe a {background-image: url(../img/icons/header/gassafe.jpg); margin-top: 0px; height: 60px; width:43px;  }
#header div.accreditation ul li.niceic a {background-image: url(../img/icons/header/niceic.jpg); width:45px; }
#header div.accreditation ul li.oftec a {background-image: url(../img/icons/header/oftec.jpg); width:38px; }
#header div.accreditation ul li.hetas a {background-image: url(../img/icons/header/hetas.jpg); width:50px; }
#header div.accreditation ul li.ecodan a {background-image: url(../img/icons/header/ecodan.jpg); width:51px; }
#header div.accreditation ul li.constructionline a {background-image: url(../img/icons/header/constructionline.jpg); width:43px; }
#header div.accreditation ul li.exor a {background-image: url(../img/icons/header/exor.jpg); width:43px; }
#header div.accreditation ul li.chas a {background-image: url(../img/icons/header/chas.jpg); width:47px; }
#header div.accreditation ul li.aphc a {background-image: url(../img/icons/header/aphc.jpg); width:50px;  }
#header div.accreditation ul li.bwc a {background-image: url(../img/icons/header/buy-with-confidence.gif); width:43px;  height: 48px; margin-right: 0px; margin-top: 5px; }


body.home #header {background: url(../img/banners/home-head.jpg) 792px 42px no-repeat; height: 155px;}
body.home #header ul.mainnav { background-image: url(../img/nav/bg-home.gif)  }

/* ----------------- Banner ---------------- */
#banner {height: 333px; width: 980px; background: url(../img/banners/home.jpg) top left no-repeat; position: relative; overflow: visible; }
#banner a.contact {width: 92px; height: 92px; text-indent: -9999px; display: block; }
#banner a.contact2 {width: 119px; height: 117px; text-indent: -9999px; display: block; position: absolute; top: 1px; left: 1px; background: url(../img/buttons/get-in-touch.gif) top left no-repeat; }
#banner a.contact2:hover {background-image: url(../img/buttons/get-in-touch-active.gif)}
#banner ul {position: absolute; top: 201px; left: 16px; width: 625px; height: 66px; background: url(../img/bg/manufacturers.gif) top left no-repeat; padding-left: 57px; padding-top: 44px;}
#banner ul li {float: left; margin-right: 27px;}
#banner ul li a {display: block; text-indent: -9999px; }
#banner div.sleeve {height: 111px; width: 25px; background: url(../img/banners/sleeve.jpg) top left no-repeat; position: absolute; top: 87px; left: 980px; }
#banner div.flash {width: 550px; height: 140px; position: absolute; top: 40px; left: 75px;}

/* ----------------- Content ---------------- */
#content {overflow: hidden; height: 1%; padding: 15px 5px 40px 3px;}
#content div.column {width: 311px; float: left; margin-right: 19px; overflow: hidden;  }
#content div.wide {width: 641px; }
#content div.last {margin-right: 0px;}

#content h1 {color: #46504d; font-weight: bold; font-size: 140%; margin-bottom: 15px; }
#content h2 {color: #547d6f; font-weight: bold; font-size: 100%; margin-bottom: 10px;}
#content p {font-size: 80%; margin-bottom: 10px;}
#content a {text-decoration: underline; color: #2f6d5b;}
#content a:hover {text-decoration: none; color: #47917c;}
#content img {background: #424242 url(../img/bg/photo.gif) top left repeat-x; padding: 10px; margin-right: 10px; margin-bottom: 10px;}
#content img.top { padding: 16px; margin-right: 0px; background: url(../img/top-pics/top-pic-bg.jpg) top left no-repeat;} 

#content ul {margin-bottom: 10px; margin-left: 10px; }
#content ul li {font-size: 80%; padding-left: 20px; background: url(../img/icons/bullet.gif) left center no-repeat;}


#content div.quote {margin-bottom: 20px;}
#content div.quote blockquote {border-top: 1px solid #9ca09e; border-bottom: 1px solid #9ca09e; padding: 20px 7px 20px 45px; background: url(../img/icons/open-quote.gif) 7px 20px no-repeat; margin-bottom: 7px; }
#content div.quote blockquote p {color: #706f6f; font-weight: bold; background: url(../img/icons/close-quote.gif) 100% 100% no-repeat; padding: 0px 38px 0px 0px;  }
#content div.quote blockquote span {text-align: right; font-size: 80%; color: #8c8c8c; display: block;  }
#content div.quote a {float: right; font-size: 80%; color: #2f6d5b; padding-right: 7px; }

#content div.accreditation {margin-bottom: 20px;}
#content div.accreditation h2 {border: 1px solid #b7b7b7; color: #ffffff; padding: 6px 10px 9px 10px; background: #9fa4a3 url(../img/bg/accredited-header.gif) top left repeat-x; text-transform: uppercase; font-size: 80%; font-weight: bold; margin-bottom: 0px;}
#content div.accreditation ul {background: #ffffff url(../img/bg/accredited.gif) bottom left repeat-x; padding: 22px 20px 30px 25px; border: 1px solid #cdcdcf; border-top: none; overflow: hidden; height: 1%; width: 264px; margin-left: 0px;}
#content div.accreditation ul li {float: left; margin-right: 12px; padding: 0px; margin-bottom: 10px; background-image: none; }



#content div.accreditation ul li a {height: 60px; display: block; text-indent: -9999px; background-position: top left; background-repeat: no-repeat;}
#content div.accreditation ul li.gassafe {margin-right: 17px;}
#content div.accreditation ul li.gassafe a {background-image: url(../img/icons/gassafe.jpg); height:91px; width:65px;  }
#content div.accreditation ul li.niceic {margin-right: 15px;}
#content div.accreditation ul li.niceic a {background-image: url(../img/icons/niceic.jpg); height:91px; width:81px; }
#content div.accreditation ul li.oftec a {background-image: url(../img/icons/oftec.jpg); height:91px; width:66px; }
#content div.accreditation ul li.hetas {margin-right: 0px;}
#content div.accreditation ul li.hetas a {background-image: url(../img/icons/hetas.jpg); width:77px; }
#content div.accreditation ul li.ecodan a {background-image: url(../img/icons/ecodan-small.jpg); width:88px; }
#content div.accreditation ul li.constructionline a {background-image: url(../img/icons/constructionline.jpg); width:72px; }
#content div.accreditation ul li.exor a {background-image: url(../img/icons/exor.jpg); width:70px; }
#content div.accreditation ul li.chas a {background-image: url(../img/icons/chas.jpg); width:78px; }
#content div.accreditation ul li.aphc a {background-image: url(../img/icons/aphc.jpg); width:78px; }
#content div.accreditation ul li.bwc a {background-image: url(../img/icons/buy-with-confidence.gif); width:67px; height: 75px; }





#content div.contact {margin-bottom: 20px;}
#content div.contact h2 {border: 1px solid #b7b7b7; color: #ffffff; padding: 6px 10px 9px 10px; background: #9fa4a3 url(../img/bg/accredited-header.gif) top left repeat-x; text-transform: uppercase; font-size: 80%; font-weight: bold; margin-bottom: 0px;}
#content div.contact ul {background: #fdfbfa url(../img/bg/accredited.gif) bottom left repeat-x; padding: 15px 20px 20px 25px; border: 1px solid #cdcdcf; border-top: none; overflow: hidden; height: 1%; width: 264px; margin-left: 0px;}
#content div.contact ul li {float: left; margin-right: 21px; padding: 0px; background: none; margin-bottom: 5px; }
#content div.contact ul li label {width: 75px; font-weight: bold; display: block; float: left; margin-right: 10px;}
#content div.contact ul li input {width: 140px; display: block; float: left;}
#content div.contact ul li textarea {width: 140px; display: block; float: left; height: 75px;}
#content div.contact ul li span {font-weight: bold; margin-left: 5px;}
#content div.contact ul li.button  input {width: auto; margin-left: 85px;}
#content div.contact ul li.message {padding-top: 5px; font-weight: bold; text-align: center;}
#content div.contact ul li.error {padding-top: 5px; font-weight: bold; text-align: center; color: #ff0000;}

#content div.related {margin-bottom: 20px;}
#content div.related h2 {border: 1px solid #b7b7b7; color: #ffffff; padding: 6px 10px 9px 10px; background: #9fa4a3 url(../img/bg/accredited-header.gif) top left repeat-x; text-transform: uppercase; font-size: 80%; font-weight: bold; margin-bottom: 0px;}
#content div.related ul {background: #fdfbfa url(../img/bg/accredited.gif) bottom left repeat-x; padding: 10px 20px 20px 25px; border: 1px solid #cdcdcf; border-top: none; overflow: hidden; height: 1%; width: 264px; margin-left: 0px;}
#content div.related ul li {margin-bottom: 5px; }
#content div.related ul li { background-image: url(../img/icons/bullet2.gif);}




/* ----------------- Testimonial Gallery ---------------- */
#content ul.testimonials {margin-bottom: 15px; margin-left: -15px; width: 655px; overflow: hidden;}
#content ul.testimonials li {float: left; margin-left: 15px; margin-bottom: 15px; padding-left: 0px; background-image: none;}
#content ul.testimonials li a img {margin: 0px;}
#content ul.testimonials li a:hover img {background-image: url(../img/bg/photo-hover.gif);}


#content div.logos { text-align: center; border: 1px solid #c0c8c6; background-color: #ffffff; padding: 12px 10px 0px 10px; overflow: hidden; height: 1%;}
#content div.logos a { text-indent: -9999px; background-color: #ffffff; display: block; clear: none; float: left; margin-right: 30px; }


/* ----------------- Footer ---------------- */
#footer {width: 100%; border-top: 1px solid #858a89; background: #a4aaa9 url(../img/bg/footer.gif) top left repeat-x; padding: 10px 0px 30px 0px; }
#footer div.wrapper {overflow: hidden;}

#footer p {float: left; color: #ffffff; font-size: 75%; text-transform: uppercase; }
#footer p.connexion {float:right; }
#footer p.connexion a {text-decoration: none; color: #2f6d5b; }
#footer p.connexion a:hover {text-decoration: underline; color: #47917c; }


/* Logos*/
a.honeywell {background: url(../img/icons/honeywell.jpg) left 8px no-repeat; width: 92px; height: 42px; }
a.ideal {background: url(../img/icons/ideal.jpg) left 2px no-repeat; width: 73px; height: 42px; }
a.worcester {background: url(../img/icons/worcester.jpg) left 0px no-repeat; width: 93px; height: 42px; }
a.glow-worm  {background: url(../img/icons/glow-worm.jpg) left 6px no-repeat; width: 95px; height: 42px; }
a.baxi {background: url(../img/icons/baxi.jpg) left 4px no-repeat; width: 54px; height: 42px; }
a.iphe {background: url(../img/icons/iphe.jpg) left 2px no-repeat; width: 50px; height: 42px; }
a.drayton {background: url(../img/icons/drayton.jpg) left 7px no-repeat; width: 85px; height: 42px; }
a.danfoss {background: url(../img/icons/danfoss-small.jpg) left 3px no-repeat; width: 61px; height: 42px; }
a.mitsubishi {background: url(../img/icons/mitsubishi.jpg) left 3px no-repeat; width: 78px; height: 42px; }
a.vaillant {background: url(../img/icons/vaillant.jpg) left 4px no-repeat; width: 76px; height: 42px; }

a.stelrad {background: url(../img/icons/stelrad.jpg) left 4px no-repeat; width: 95px; height: 42px; }
a.quinn {background: url(../img/icons/quinn.jpg) left 4px no-repeat; width: 142px; height: 42px; }
a.myson {background: url(../img/icons/myson.jpg) left 2px no-repeat; width: 95px; height: 42px; }
a.ecodan {background: url(../img/icons/ecodan.jpg) left 2px no-repeat; width: 90px; height: 42px; }