html {}

body {position: relative; background-position: left top; background-repeat: repeat-x; }


h1 {padding: 20px 0 12px;}
h2 {padding: 15px 0 10px;}
h3, h4, h5 {padding: 12px 0 8px;}
p {padding: 2em 0;}

.vcard .adr,
.vcard .tel,
.vcard .label {display: block;}

/*form formating*/
label {position: relative;}
input.txt {position: absolute; left: 8em; background-position: left center; background-repeat: no-repeat; border-width: 1px; width: 150px; padding: 2px 5px;}
label,
label.box span {display: block;}
.dob label {display: inline;}

img.cd {display: block; background-repeat: no-repeat; width: 34px; height: 30px;}

.clear {clear: both;}


/*---------------------------------
header
----------------------------------*/
header {position: relative; }
header .branding {overflow: hidden; margin: 0 auto; padding-top: 20px; width: 90%;}

header .branding h1 {float: left; width: 250px; padding-top: 0;}
header .branding h1 a { display: block;}
header .branding p.strapline {padding: 25px 0; background-position: left -834px; background-repeat: no-repeat; padding: 25px 0 25px 58px;}
header .branding p.strapline {float: left;  margin: 10px 2px 0 0;}
header .branding p.action {float: right; margin: 10px 2px 0 0; padding: 25px 0; width: 19%;}
header .branding p.action img { display: inline-block; vertical-align: middle; width: 24px; background-position: left -510px;}
header .branding p.logos {float: left; padding: 10px 5px 5px; margin-top: 0;}
header .branding p.logos .logos {display: block; padding: 5px;}
header .branding p.products {float: left; padding: 0 5px 5px; margin-top: 35px;}
header .branding p.products span {display: block; padding: 10px 5px 5px; margin-top: 0;}

header #homecalltoaction {position: relative; background-position: 50% center; background-repeat: no-repeat;}
header #homecalltoaction .questions { overflow: hidden; margin: 0 auto; padding: 60px 0; width: 90%;}
header #homecalltoaction .questions ul { width: 58%; float: left;  position: relative;  z-index: 10;}
header #homecalltoaction .questions p.strapline,
header #homecalltoaction .questions h1.strapline  { width: 52%; float: left; background-position: left -834px; background-repeat: no-repeat; padding: 25px 0 25px 58px;}
header #homecalltoaction .questions li {background-position: left 7px; background-repeat: no-repeat; padding: 15px 10px 15px 38px; }
header #homecalltoaction .questions .answer { width: 40%; float: right; position: relative; z-index: 10;}
header #homecalltoaction .questions .answer p { padding: 20px 0; }
header #homecalltoaction .questions .answer p.action,
header .branding p.action {
-webkit-border-radius: 10px;
    	border-radius: 10px;
-webkit-box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5); }
header #homecalltoaction .questions .answer p.action .tel {display: inline-block;}

/*index new*/
header #homecalltoaction .questions #banner_photo {position: relative; width: 60%; float: left;}
header #homecalltoaction .questions #banner_photo img {position: absolute; top: 0; left: 0; width: 100%;}
header #homecalltoaction .questions #banner_photo .slideshow div { width:100%;}
header #homecalltoaction .questions #banner_photo img.spacer {  position: relative; width:100%; -webkit-box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);}


header #homecalltoaction .questions .textblock { width: 33%; float: right;}
header #homecalltoaction .questions .textblock .answer {width: 100%;}
header #homecalltoaction .questions .savings { position: relative;  z-index: 10;}
header #homecalltoaction .questions .savings h2 {background-position: left 7px; background-repeat: no-repeat; padding: 15px 10px 15px 38px; }

/*product offer boxes*/
div.intro {overflow: hidden; margin: 20px auto; padding-top: 20px; width: 90%; padding: 30px 0;}
.agricultural div.intro {}
.intro .featurebox {  margin-left: 50px; width: 38%;}
.intro .featurebox.last {  margin-left: 0px;}
.intro .featurebox h3 { padding-top: 12px;}
div.intro li {background-position: left -928px; background-repeat: no-repeat; margin: 10px 0; padding-left: 21px; list-style: none;}
.homepage .intro .featurebox p span {display: block;}
#content.homepage .intro p  { max-width: 100em;}
#content .intro p { max-width: 100em;}

header img.roof {position: absolute; bottom: 0; z-index: 0;}

 .intro p.strapline {max-width: 40em; margin: 0 auto;}

nav li {}
nav a { }


#nav_main {position: relative;  }
#nav_main ul  {overflow: hidden;  margin: 0 auto; width: 90%;}
#nav_main li {float: left; padding: 0 0 0 3px; background-position: 15px -9999px; background-repeat: no-repeat;}
.index #nav_main li.index {background-position: 24px -1356px;}
.technologies #nav_main li.technologies {background-position: 40px -1356px;}
.services #nav_main li.services {background-position: 30px -1356px;}
.agricultural #nav_main li.agricultural {background-position: 70px -1356px;}
.gallerypage #nav_main li.gallerypage {background-position: 30px -1356px;}
.accreditations #nav_main li.accreditations {background-position: 50px -1356px;}
.contractors #nav_main li.contractors {background-position: 70px -1356px;}
/*.cymraeg #nav_main li.cymraeg {background-position: 30px -1356px;}*/
.casestudies #nav_main li.casestudies {background-position: 50px -1356px;}
.contact #nav_main li.contact {background-position: 30px -1356px;}
#nav_main a {display: block; padding: 15px 10px; }

nav select { display: none; }




/*---------------------------------
content
----------------------------------*/
#content { position: relative; background-repeat: repeat-x; background-position: left bottom; }
#content p { max-width: 50em;}
#content li {background-position: left -928px; background-repeat: no-repeat; margin: 10px 0; padding-left: 21px; list-style: none;}
#content table {}
#content tr {border-width: 0 0 1px 0; border-style: dashed;}
#content td,
#content th { padding: 10px;}
#content th { vertical-align: bottom;}
#content td:first-child { }
#content td:last-child { }
/*---------------------------------
content_main
----------------------------------*/
#content #content_main {background-repeat: no-repeat; background-position: right bottom; overflow: hidden; margin: 0 auto; width: 90%;}
#content_main .reasons {background-repeat: no-repeat;}
#content_main .reason1 {background-position: left 22px; padding-left: 220px; margin-top: 35px; min-height: 184px;}
#content_main .reason2 {background-position: right top; padding-right: 240px; padding-top: 35px; min-height: 194px; padding-top: 35px; margin-top: -20px;}
#content_main .reasons p {padding: 0; }
#content_main .reasons h2 { }
#content_main .solution { width:640px; margin: 90px auto 50px;padding-top: 1em;background-color: #f2f2f2; border-radius: 10px;}
#content_main .solution strong {display: block;}
.homepage #content_main p.intro,
.homepage #content_main div.intro {padding: 30px 50px; margin: 20px 10px;}

/*new colums*/
#content_main .col { width: 30%; float: left; margin-right: 10px; background-image: none;}
#content_main .col h2 ,
#content_main .col h3 ,
#content_main .col p { padding-left: 10px; padding-right: 10px;}
#content_main .col.reason1 ,
#content_main .col.reason2,
#content_main .col.solution { padding: 0; margin-top: 20px; margin-bottom: 100px;}
#content_main .col img {width: 100%;}
#content_main .col img.profile {width: auto;}

/*casestudy feature on the home page*/
#content_main .col .casestudies { overflow: hidden; margin: 10px 30px 20px 0; padding: 0; border-width: 0 0 0; border-style: solid;}
#content_main .col .casestudies a { display: block; padding: 5px 0; overflow: hidden;}
#content_main .col .casestudies img {width: 30%; float: left; margin: 0 10px 5px 5px;
-webkit-box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);}

.page #content .solution  { clear:both; }
.accreditations #content_main .logos img {display: block; }

/*news box on home page*/
#content_news {  margin-right: 2px; margin-top: 0; padding-bottom: 20px;
/*-webkit-box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5); */}
#content_main .col#content_news {float: right; width: 42%;}
.index #content_main .col.portfolio-list {width: 50%; margin: 0;}

#content #content_news h2 { border-style: solid; border-width: 0 0 0; padding: 0 0 12px 0;  margin:20px 20px 0;}
#content #content_news h3 { border-style: solid; border-width: 0 0 1px 0; padding: 12px 0;  margin:0 20px ;}
#content #content_news p { border-style: solid; border-width: 0 0 0; padding: 0 0 10px 0;  margin: 20px ;}
#content #content_news ul { margin: 20px ;}

/*NEW casestudy feature on the home page*/
#content_main .col.portfolio { width: 60%; float: left; margin: 10px 0 0 10px; padding: 0 0 0 20px;}
#content_main .col.portfolio h2 {padding: 12px 0;  border-style: solid; border-width: 0 0 1px 0; padding: 12px 0;  margin:0 30px 20px 10px;}
#content_main .col.portfolio.col2 .casestudies {width: 44%; float: left; overflow: hidden; min-height: 300px;}
#content_main .col.portfolio .casestudies a { display: block; padding: 5px; overflow: hidden;}
#content_main .col.portfolio .casestudies .exceprt {border-style: solid; border-width: 0 0 1px; display: block; margin: 0 5px; padding-bottom: 10px;}
#content_main .col.portfolio .casestudies img {width: 100%;display: block; float: none; margin: 0 0 10px 0;
-webkit-box-shadow: 0px 0px 0 2px rgba(255, 255, 255, 0.8);
        box-shadow: 0px 0px 0 2px rgba(255, 255, 255, 0.8);}

/*NEW LIST STYLE casestudy feature on the home page*/
#content_main .col.portfolio-list {width: 60%; margin: 10px 0 0 10px; padding: 0 0 0 20px;}
#content_main .col.portfolio-list h2 {padding: 12px 0;  border-style: solid; border-width: 0 0 1px 0; padding: 12px 0;  margin:0 30px 20px 10px;}
#content_main .col.portfolio-list.col2 .casestudies {overflow: hidden;}
#content_main .col.portfolio-list .casestudies a { display: block; padding: 0 0 5px 0;}
#content_main .col.portfolio-list .casestudies .exceprt {border-style: solid; border-width: 0 0 1px; display: block; margin: 0 5px; padding-bottom: 10px;}
#content_main .col.portfolio-list .casestudies img {width: 33%;display: inline-block; float: left; margin: 0 10px 10px 0;
-webkit-box-shadow: 0px 0px 0 2px rgba(255, 255, 255, 0.8);
        box-shadow: 0px 0px 0 2px rgba(255, 255, 255, 0.8);}

/*NEW ROI feature on the home page*/
.intro .featurebox { float: left; width: 42%; margin-right: 2%; margin-top: 10px; margin-bottom: 20px;  padding: 20px 10px 20px 20px; min-height: 310px;
-webkit-border-radius: 10px;
    	border-radius: 10px;
-webkit-box-shadow:  1px 1px 5px 0 rgba(6, 6, 6, 0.4);
        box-shadow:  1px 1px 5px 0 rgba(6, 6, 6, 0.4); }
.intro .featurebox.last { margin-right: 0;}
.intro .featurebox h2 { padding: 12px 20px 0;}
.intro .featurebox h3 { border-style: solid; border-width: 0 0 0 0; padding: 0 0px 12px 20px;}
.intro .note {clear: both; }

.intro .featurebox.center {  margin-left: auto; margin-right: auto; float: none;}

/*gallery*/
.gallery {overflow: hidden;}
.gallery div {/*width: 33%;*/ width: 49%; float: left;}
.gallery div img { width: 90%; border-width: 2px; border-style: solid; border-color: white;
-webkit-box-shadow:  2px 2px 3px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  2px 2px 3px 0px rgba(6, 6, 6, 0.5);}

.accreditations .gallery { margin-bottom: 60px;}
.accreditations .gallery div {width: 40%; border-width: 1px; border-style: solid; margin: 10px 20px 10px 0; padding: 20px}
.accreditations .gallery div img { margin: 0 auto; display: block; width: auto; border-width: 0; -webkit-box-shadow: none; box-shadow: none; }
#content .gallery p { padding-right: 40px;}
.accreditations #content .gallery p { padding-right: 0px;}

/*photo gallery*/
#gallery {border-width: 1px; border-style: solid; padding: 1.0em; overflow: hidden;  margin: 2px;
-webkit-border-radius: 10px;
    	border-radius: 10px;
-webkit-box-shadow:  0px 0px 1px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 1px 0px rgba(6, 6, 6, 0.5);		 }
#content #gallery li {background-position: -9999px 0; margin: 0; padding: 2px; display: block; float: left; border-style: solid; border-width: 0; }
#content #gallery a { display: block;}
#gallery img {border-width: 1px;border-style: solid;padding: 1px;margin: 0;}

/*info pages e.g. site map, terms*/
.info #content ul li {list-style: inside disc;}
.info #content ol li {list-style: inside decimal;}
.info #content_main {padding-bottom: 100px;}


/*content_page ----------------------------------*/
#content_page {float: left; width: 60%;padding-top: 2em; padding-bottom: 2em; }


/*content_sub ----------------------------------*/
#content_sub { float: right; width: 36%; margin-right: 2px; margin-top: 10px;
-webkit-border-radius: 10px;
    	border-radius: 10px;
-webkit-box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5); }

#content_sub h2 { border-style: solid; border-width: 0 0 1px 0; padding: 12px 20px;}

#content_sub #nav_page {}
#nav_page ul  {}
#content #nav_page li {background-position: 15px -980px; padding-left: 40px;}/*996*/
.solarpv #content #nav_page li.solarpv,
.faqsolar #content #nav_page li.faqsolar,
.solarthermal #content #nav_page li.solarthermal,
.fit #content #nav_page li.fit,
.gas #content #nav_page li.gas,
.biomas #content #nav_page li.biomas,
.dom #content #nav_page li.dom,
.comm #content #nav_page li.comm,
.caravans #content #nav_page li.caravans,
.agricultural #content #nav_page li.agr {background-position: 15px -919px ; }/*936*/

#nav_page a {display: block; padding: 10px ; }


#content_sub p,
#content_sub ul {padding-left: 5px; padding-right: 5px;}
#content_sub li {  list-style: none;}





/*---------------------------------
site info
----------------------------------*/
#site_info { position: relative; padding: 20px 50px;  }
#site_info > .contacts { overflow: hidden; margin: 0 auto; width: 60%;
-webkit-border-radius: 10px;
    	border-radius: 10px;
-webkit-box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);
        box-shadow:  0px 0px 2px 0px rgba(6, 6, 6, 0.5);}
#site_info > .contacts h2 { padding: 30px;}
#site_info > .contacts ul { padding-bottom: 30px;}
#site_info > .contacts li {display: inline-block;}
#site_info > .contacts li.tel {padding-right: 20px;}
#site_info > .contacts li img { display: inline-block; vertical-align: middle; width: 24px;}
#site_info > .contacts li.tel img {background-position: left -510px;}
#site_info > .contacts li.email img {background-position: left -554px;}
#site_info p {}
#site_info ul {}
#site_info li {}

/*---------------------------------
footer
----------------------------------*/
footer { position: relative;  padding-bottom: 30px;}
footer p { overflow: hidden; margin: 0 auto; width: 90%;}
footer .logos img {padding: 2px;}
footer .logos a { display: inline-block; padding: 5px;}