/*
Theme Name: Green Octavia
Description: Green Octavia micro-site
Version: 1.0
Author: Marketing Impact
Author URI: http://www.marketing-impact.co.uk
*/

/* 
# Colour reference ###################
body background:#f8f7f7
body text: #787878
Bodylinks: #464646
Navtext: #5a5a5a
News Borders: #dddddd
Green: #79ae18
Purple: #820053
Orange: #df7a1c
Blue: #273691
Violet: #5a4099
LightBlue: #0076c0
Red: #b5121b
DarkGreen" #566c11
*/
 
/*# Reset defaults ################### */

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td { margin: 0; padding: 0; border: none} /* Reset margins and padding */
a:link, a:visited{text-decoration:none;outline:none;} /* Reset link styles */
html {overflow: -moz-scrollbars-vertical;} /* Mozilla scrollbar fix */

/* Layout ################### */

body{font:13px "Arial", sans-serif; font-weight:lighter; color:#787878; background:#f8f7f7;}

#container{width: 972px; margin: auto; background: url(images/page-bg.png) repeat-y; padding: 0 5px;}

#header{width: 972px; height: 154px; background: url(images/header-bg.jpg) no-repeat;}

#logo{width: 202px; height: 63px; float: left; margin: 23px 0 0 15px;}

#header-contact{float: right; width: 460px; height: 20px; color: #fff; margin: 47px 18px 0 0; text-align: center;} #header-contact p{font-size: 19px;}
#header-contact span{color: #566c11} #header-contact a{color: #fff} #header-contact a:hover{color: #566c11}

#access{float: right; width: 460px; height: 20px; color: #fff; font-size: 12px; margin: 15px 18px 0 0; text-align: center;}  #access p{font-size: 12px}
#access a{color: #fff} #access a:hover{color: #000} .large{font-size: 15px}

/* Nav ################### */

ul.nav{width: 972px; height: 48px; float: left; font-size: 14px; margin: 5px 0 0 0}

ul.nav li{height: 48px; float: left; list-style: none; margin: 10px 15px 0 15px}

ul.nav li a{float: left; width: inherit; height:16px; padding: 4px 8px; -webkit-border-radius:5px; -moz-border-radius:5px; color: #5a5a5a}
ul.nav li a:hover{color: #fff; background: url(images/nav/green.jpg) repeat-x;} ul.nav li.current_page_item a{background: url(images/nav/green.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-305 a:hover{background: url(images/nav/green.jpg) repeat-x;} ul.nav li#menu-item-305.current_page_item a{background: url(images/nav/green.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-306 a:hover{background: url(images/nav/purple.jpg) repeat-x;} ul.nav li#menu-item-306.current_page_item a{background: url(images/nav/purple.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-307 a:hover{background: url(images/nav/orange.jpg) repeat-x;} ul.nav li#menu-item-307.current_page_item a{background: url(images/nav/orange.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-308 a:hover{background: url(images/nav/blue.jpg) repeat-x;} ul.nav li#menu-item-308.current_page_item a{background: url(images/nav/blue.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-309 a:hover{background: url(images/nav/violet.jpg) repeat-x;} ul.nav li#menu-item-309.current_page_item a{background: url(images/nav/violet.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-310 a:hover{background: url(images/nav/lightblue.jpg) repeat-x;} ul.nav li#menu-item-310.current_page_item a{background: url(images/nav/lightblue.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-311 a:hover{background: url(images/nav/red.jpg) repeat-x;} ul.nav li#menu-item-311.current_page_item a{background: url(images/nav/red.jpg) repeat-x; color: #fff}
ul.nav li#menu-item-312 a:hover{background: url(images/nav/darkgreen.jpg) repeat-x;} ul.nav li#menu-item-312.current_page_item a{background: url(images/nav/darkgreen.jpg) repeat-x; color: #fff}

ul.sub-menu{display: none}

/* General Styles ############ */

h1{font-size: 40px; margin-bottom: 10px; clear: left;}

h2{font: 36px "Arial", sans-serif; font-weight:lighter; margin-bottom: 10px; color: #fff} .post h2{color: #787878}

.purple-top{width: 957px; height: 66px; background: url(images/pagetitles/purple.jpg) repeat-x; padding:20px 0 0 15px;} 
.orange-top{width: 957px; height: 66px; background: url(images/pagetitles/orange.jpg) repeat-x; padding:20px 0 0 15px;}
.blue-top{width: 957px; height: 66px; background: url(images/pagetitles/blue.jpg) repeat-x; padding:20px 0 0 15px;}
.violet-top{width: 957px; height: 66px; background: url(images/pagetitles/violet.jpg) repeat-x; padding:20px 0 0 15px;}
.lightblue-top{width: 957px; height: 66px; background: url(images/pagetitles/lightblue.jpg) repeat-x; padding:20px 0 0 15px;}
.red-top{width: 957px; height: 66px; background: url(images/pagetitles/red.jpg) repeat-x; padding:20px 0 0 15px;}
.darkgreen-top{width: 957px; height: 66px; background: url(images/pagetitles/darkgreen.jpg) repeat-x; padding:20px 0 0 15px;}


h3{font:16px "Arial", sans-serif; font-weight: lighter;}

h4{font: 14px "Arial", sans-serif; font-weight:lighter; line-height: 26px; clear: left; margin-bottom: 10px}

.page-description{margin: 10px 0 0 0; border-bottom: 1px solid #dddddd; width: 942px; padding: 0 0 10px 0}

.page-description h4 span{color: #0076c0}

.page-blurb{margin: 0 0 20px 0}

h5{font-size: 14px; margin-bottom: 10px; color: #464646; font-family: "Arial", sans-serif; font-weight: lighter; line-height: 20px}

h6{font-size: 10px; margin-bottom: 10px}

p{line-height:20px; margin-bottom: 10px; font-size: 13px}

blockquote{float: left; clear: both; margin: 20px 0 20px 20px; padding-left: 10px; border-left: 4px solid gray; font-style: italic;}

code{background: #eee; padding: 10px; width: 610px; height: inherit; line-height: 24px; display: block; border: 1px solid #ddd; float: left; margin: 10px 0}

ol{list-style:decimal; float: left; clear: left; margin: 10px 0; line-height: 18px}

ul{list-style:none;; float: left; clear: left; margin: 10px 0; line-height: 18px}

.right{float:right; padding:5px 0 5px 10px}

.left{float:left; padding: 5px 10px 5px 0;}

.clear{clear:both;}

.alignleft{text-align: left; float: left; padding: 5px 10px 5px 0;}

.alignright{text-align: right; float: right; padding:5px 0 5px 10px}

.aligncenter{text-align: center; padding:5px}

img{border:none;}
img.left{margin:0 10px 10px 0;}
img.right{margin:0 0 10px 10px;}

/* Links ################### */

a{color: #464646}
a:hover{color: #000}
a:visited{color: #464646}

/* --- Gallery ---*/

h3.gallery-title{font-size: 14px; color: #533b91; text-align: left; margin: 5px 0 5px 5px}

span.gallery-caption{font-size: 12px; text-align: left; margin-left: 0px; width: inherit; margin-bottom: 10px;}

/* --- Content ---*/

#content{width: 942px; float: left; padding: 0 15px;}

.main{width: 700px; float: left; margin: 0; border-right: 1px solid #dddddd; padding: 15px 15px 0 0}

.post{width: 700px; height: inherit; margin: 0 0 15px 0; float: left;}

.entry{float: left; width: 700px; border-bottom: 1px solid #dddddd; margin: 0 0 10px 0}

.post h2 a{font:16px "Arial", sans-serif; color:#fff; background: url(images/nav/lightblue.jpg) repeat-x; padding: 5px; width: 690px; height: 16px; display: block; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: 0 0 10px 0}

.post p.postmetadata{float: left;}

.post p.time{float: right;}

.post img{margin: 0;}

.post p{margin: 0; padding-bottom: 10px; float: left;}

a.more-link{clear: both; margin: 10px 0; width: 118px; height: 20px; background: url(images/button.png) no-repeat; display: block; color: #fff; padding: 4px 0 0 0; text-align: center}

a.more-link:hover{background-position: bottom;}

.tweet{float: left; margin: 40px 0 20px 0; width: 500px} .share-button{float: left; margin-right: 20px}

a.facebook{background: url(images/sn/facbeook.png) no-repeat; display: block}

.next-prev{padding: 0 20px;}

.next a{float: left; margin: 14px 10px 14px 0; background: url(images/button.png) no-repeat; width: 102px; height: 23px; display: block; padding: 5px 0 0 10px; font-weight: bold; color: #4f4f4f}

.next a:hover{background-position: bottom; color: #000}

.prev a{float: right; margin: 14px 0 14px 10px; background: url(images/button.png) no-repeat; width: 102px; height: 23px; display: block; padding: 5px 0 0 10px; font-weight: bold; color: #4f4f4f}

.prev a:hover{background-position: bottom; color: #000}

.post-edit-link{float: left; clear: left}

.navigation{float: left; display: block; width: 700px}

.navigation a{clear: both; margin: 10px 0; width: 118px; height: 19px; background: url(images/button.png) no-repeat; display: block; color: #fff; padding: 5px 0 0 0; text-align: center}

.navigation a:hover{background-position: bottom;}

/* --- Sidebar ---*/

#sidebar{width: 200px; height: inherit; float: right; padding: 10px;}

#sidebar h2{font-size:16px; color: #0076c0; float: left; border-bottom: 1px solid #dddddd; width: 210px; padding-bottom: 5px}

.widget{float: left; clear: both;}

#sidebar ul{float: left; height: inherit; clear: both; margin: 0 0 0px 0}

#sidebar ul li{list-style: none; margin: 0 0 10px 0; line-height: 18px; width: 200px}

#sidebar ul li a{color: #828282} #sidebar ul li a:hover{color: #000}

#sidebar ul.widget li{list-style: none; margin: 0}

.sub{float: left; margin-right: 5px;}

/* --- Search ---*/

form#searchform{float:left; width:214px; height:30px; margin: 0 0 20px 0}

input.search-bar{float:left; width:160px; height:30px; background: #fff; border: 1px solid #dddddd; font-size:12px; color:#787878; -webkit-border-top-left-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-bottomleft:10px; padding: 0 0 0 10px}

.search-button{float:left; width:40px; height:32px; background:#0076c0; border:none; -webkit-border-top-right-radius:10px; -webkit-border-bottom-right-radius:10px; -moz-border-radius-topright:10px; -moz-border-radius-bottomright:10px; color: #fff}

/* --- Comments --- */

h3#comments{font:16px "univers", Arial, sans-serif; color:#0076c0; margin: 10px 0 0 0; clear: left}

.comments{float: left}

/* --- Comment list --- */

ol.commentlist{margin: 0; padding: 0; float: left;}

ol.commentlist li{width: 660px; height: inherit; background: #fff; border: 1px solid #ddd; list-style: none; margin: 10px 0; padding: 20px; float: left;} ol.commentlist li a{color: #0076c0}

.avatar{float: left; -webkit-box-shadow:1px 1px 2px #ccc; -moz-box-shadow:1px 1px 2px #ccc; background: #fff; padding: 3px; margin-right: 20px}/* --- avatar --- */

cite{margin: 0; font-style: normal; font-size: 16px; float: left;}/* --- Person Name --- */

span.says{font-size: 14px; margin: 0 0 0 5px; float: left;}/* --- says --- */

.comment-meta{margin: 0; padding-bottom: 10px; float: right;}/* --- date --- */

.comments p{margin: 0 0 5px 0px; float: left; width: 575px; padding: 10px 0;}/* --- the comment --- */

.comments p code{width: 500px}

p.approval{float: left; margin: 3px 0 0 0; font-style: italic}/* --- your comment is awaiting approval --- */

/* --- Comment form --- */

#respond{float: left; width: 700px; padding: 10px 0;}

form#commentform{float: left; width: 700px;}

form#commentform p{float: left; margin: 0;}

label.fieldtitles{font-size: 14px; color:#0076c0; padding: 0 0 5px 0; float: left;}

form#commentform textarea#comment{width: 690px; height:150px; background: #f5f5f5; border: 1px solid #cfcfcf; float: left; padding: 5px; font-family: "Arial", sans-serif; font-size: 12px; color: #828282}

.fields-wrap{float: left; width: 700px; height: inherit; margin: 20px 0 0px 0;}

.fields-wrap p{float: left; width: 220px; padding: 0 14px 0 0;}

.fields-wrap p.web{float: right; padding: 0}

form#commentform input{width: 210px; height:24px; background: #f5f5f5; border: 1px solid #cfcfcf; float: left; padding-left: 5px; color: #828282}

form#commentform input#submit{clear: both; margin: 5px 0; width: 118px; height: 24px; border: none; background: url(images/button.png) no-repeat; display: block; color: #fff; padding: 2px 0 0 0; text-align: center}

form#commentform input#submit:hover{background-position: bottom;}

/* Home ##################### */

#home-content{width: 942px; float: left; padding: 0 15px;}

.home-main{width: 700px; float: left; margin: 0; padding: 0px 15px 0 0;}

.page-post{width: 700px; height: inherit;} .page-post .entry{float: left; width: 700px; border: none;}

.home-top{width: 972px; height: 20px; background: url(images/pagetitles/home.jpg) repeat-x; padding:0; float: left}

.home-shadow{width: 972px; height: 20px; background: url(images/pagetitles/home.jpg) repeat-x; padding:0; float: left; margin:0 0 0 -15px}

.slider{width: 942px; height: 280px; padding: 0 0px; margin: 0px 0 0px 0;}

img.princedale{float: left; width: 385px; height: 257px;}

h1.home{float: left; clear: none; margin: 30px 0 0 20px; font:46px "Helvetica", Arial, sans-serif; font-weight: bold; color: #4c4c4c}

h2.tag{float: left; margin: -5px 0 0 20px; font:32px "Helvetica", Arial, sans-serif; font-weight: bolder; color: #79ae18}

p.description{float: left; margin: 5px 0 0 20px; width: 460px; font-size: 16px; line-height: 24px;}

h3.home-title{color: #79ae18; font:28px "Arial", sans-serif; margin-bottom: 10px}

/* --- Home Sidebar ---*/

#home-sidebar{width: 200px; height: inherit; float: right; padding: 10px; margin: 10px 0 0 0;}

#home-sidebar h2{font-size:16px; color: #79ae18; float: left; border-bottom: 1px solid #dddddd; width: 210px; padding-bottom: 5px}

#home-sidebar ul{float: left; height: inherit; clear: both; margin: 0 0 0px 0;}

#home-sidebar ul li{list-style: none; margin: 0 0 10px 0; width: 200px; line-height: 18px}

#home-sidebar ul li a{color: #828282} #home-sidebar ul li a:hover{color: #000}

/* Boxes ##################### */

.boxes{float: left; width: 700px; margin: 10px 0}

.boxes-full{float: left; width: 942px; margin: 20px 0;}

.ecohouse{float: right; width: 199px; height: 159px; margin: 21px 0 0 0}

.ecohouse-full{float: right; width: 199px; height: 159px; margin: -67px 0 0 0}

a.orange-box{width: 221px; height: 111px; background: url(images/boxes/orange.png) no-repeat; float: left; margin: 0 18px 0 0} 
a.orange-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 0 0 0 10px}
a.orange-box span.box-desc{font: 16px "Arial", sans-serif; color: #e6c09d; font-weight: lighter; margin: 10px 0 0 10px}

a.violet-box{width: 221px; height: 111px; background: url(images/boxes/violet.png) no-repeat; float: left; margin: 0 18px 0 0} 
a.violet-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 5px 0 0 10px; margin: 0 0 0 10px}
a.violet-box span.box-desc{font: 16px "Arial", sans-serif; color: #b4aacc; font-weight: lighter; margin: 10px 0 0 10px}

a.red-box{width: 221px; height: 111px; background: url(images/boxes/red.png) no-repeat; float: left; margin: 0 0 0 0} 
a.red-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 0 0 0 10px}
a.red-box span.box-desc{font: 16px "Arial", sans-serif; color: #d7999d; font-weight: lighter; margin: 10px 0 0 10px}

a.lightblue-box{width: 221px; height: 111px; background: url(images/boxes/lightblue.png) no-repeat; float: left; margin: 0 18px 0 0} 
a.lightblue-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 0 0 0 10px}
a.lightblue-box span.box-desc{font: 16px "Arial", sans-serif; color: #92bed9; font-weight: lighter; margin: 10px 0 0 10px}

a.blue-box{width: 221px; height: 111px; background: url(images/boxes/blue.png) no-repeat; float: left; margin: 0 18px 0 0} 
a.blue-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 0 0 0 10px}
a.blue-box span.box-desc{font: 16px "Arial", sans-serif; color: #a0a6c8; font-weight: lighter; margin: 10px 0 0 10px}

a.purple-box{width: 221px; height: 111px; background: url(images/boxes/purple.png) no-repeat; float: left; margin: 0 18px 0 0} 
a.purple-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 0 0 0 10px}
a.purple-box span.box-desc{font: 16px "Arial", sans-serif; color: #cc92b8; font-weight: lighter; margin: 10px 0 0 10px}

a.darkgreen-box{width: 221px; height: 111px; background: url(images/boxes/darkgreen.png) no-repeat; float: left; margin: 0 18px 0 0} 
a.darkgreen-box span.box-title{font: 20px "Helvetica", Arial, sans-serif; color: #fff; margin: 0 0 0 10px}
a.darkgreen-box span.box-desc{font: 16px "Arial", sans-serif; color: #b2ba99; font-weight: lighter; margin: 10px 0 0 10px}

/* Pages ##################### */

.section-post{width: 942px; height: inherit;} .section-post .entry{float: left; width: 942px; border: none;}

.right-img{float: left; width: 690px; line-height: 18px; margin: 5px 0 10px 10px;}

.left-img{float: left; width: 690px; line-height: 18px; margin: 5px 0 10px 0px;}

.bar-title{color:#fff; width: 690px; float: left}

.bar-title-small-left{color:#fff; width: 460px; float: left} .bar-title-small-right{color:#fff; width: 460px; float:right}

.bar-title-long{color:#fff; width: 932px; float: left}

.purple-bar{background: url(images/nav/purple.jpg) repeat-x; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: -10px 0 10px 0; height: 20px; padding: 6px 0 0 10px}

.orange-bar{background: url(images/nav/orange.jpg) repeat-x; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: -10px 0 10px 0; height: 20px; padding: 6px 0 0 10px}

.blue-bar{background: url(images/nav/blue.jpg) repeat-x; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: -10px 0 10px 0; height: 20px; padding: 6px 0 0 10px}

.violet-bar{background: url(images/nav/violet.jpg) repeat-x; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: -10px 0 10px 0; height: 20px; padding: 6px 0 0 10px}

.red-bar{background: url(images/nav/red.jpg) repeat-x; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: -10px 0 10px 0; height: 20px; padding: 6px 0 0 10px}

.darkgreen-bar{background: url(images/nav/darkgreen.jpg) repeat-x; -webkit-border-radius:5px; -moz-border-radius: 5px; margin: -10px 0 10px 0; height: 20px; padding: 6px 0 0 10px}


.house{width: 942px; float: left; margin: 10px 0;}

ul.list{line-height: 24px; width: 700px; float: left} ul.list li{list-style: disc inside;}

.fact{width: 680px; float: left; border-left: 10px solid #df7a1c; padding: 5px 0 5px 10px; line-height: 20px; margin: 0 0 0 10px} .fact h5{margin: 5px 0}

object{float: left; margin:10px 20px 10px 0px;}

.team-row{width: 942px; float: left}

.team{width: 460px; float: left; margin: 10px 0 20px 0; min-height: 380px;} .team h5{margin: 5px 0} .team a{color: #b5121b; margin: 10px 0} .team a:hover{color: #000;}

.team-right{width: 460px; float: right; margin: 10px 0 20px 0; min-height: 380px;} .team-right h5{margin: 5px 0} .team-right a{color: #b5121b; margin: 10px 0} .team-right a:hover{color: #000}

.tsb{clear: left}

.green-header{font-size: 24px; color: #566c11;}

/* Footer ################### */

#footer{width: 972px; height: 108px; background: url(images/footer-bg.jpg) repeat-x; color: #fff; margin: 30px 0 0 0; clear: both}

.footer-top{width: 972px; height: 64px; float: left}

.footer-bottom{width: 972px; height: 43px; float: left;}

#footer a{color: #fff} #footer a:hover{color: #79ae18}

a.footer-email{float: left; font-size: 22px; width: 470px; margin: 23px 0 0 15px;}

.footer-green{float: right; width: 470px; margin: 15px 15px 0 0;} .footer-green img{float: right; margin: 0 5px;} .footer-green p{float: right; font-size: 18px; margin: 8px 0 0 0;}

p.copyright{float: left; clear: left; font-size: 12px; margin: 13px 0 0 15px;}

p.address{float: right; margin: 13px 0px 0 0; font-size: 12px;}

a.twitter{float: right; margin: 15px 15px 0 0; font-size: 12px;} a.twitter img{float:left; margin: -6px 10px 0 10px}


/* Footer ecohouse */

.eco-house{margin: 50px 0; width: 664px; height: 665px; position: relative; margin-left: 160px; background: url(images/ecohouse/ecohouse/0.jpg) no-repeat}

#one{position: absolute; left: 0px; top: 0px;  display: none;}
#two{position: absolute; left: 0px; top: 0px; display: none;}
#three{position: absolute; left: 0px; top: 0px; display: none;}

.one-button{position: absolute; left: 148px; top: 170px; width: 36px; height: 36px; background: url(/images/ecohouse/ecohouse/1.jpg) no-repeat} .one-wrap{position: absolute; left: 148px; top: 170px; width: 36px; height: 36px;}

.two-button{position: absolute; left: 250px; top: 289px; width: 36px; height: 36px; background: url(/images/ecohouse/ecohouse/1.jpg) no-repeat} .two-wrap{position: absolute; left: 250px; top: 289px; width: 36px; height: 36px;}

.three-button{position: absolute; left: 160px; top: 550px; width: 36px; height: 36px; background: url(/images/ecohouse/ecohouse/1.jpg) no-repeat} .three-wrap{position: absolute; left: 160px; top: 550px; width: 36px; height: 36px;}