/*------------------------------------------------
Bill Bannister Landscaping - master style sheet

                                            .NDDDDDZ?DDDD DDDD                  
                                           .DDDDDDDZ?DDDD DDDD                  
                                            DDDD          DDDD                  
      .                             .       DDD         . DDDD                  
  .DDDDDDDDDDDDD ZDDD .DDDD  DDDDDDDDD? .DDDDDDDDDDDDDDDD DDDD     DDDDDD       
.DDDDDDDDDDDDDDD ZDDD~DDDDD ?DDDDDDDDDDD DDDDDDDDDDDDDDDD DDDD    DDDDD.        
DDDD    .DDDD    ZDDDDDD       .    DDDDZ   DDD     .DDDD DDDD   DDDDD          
DDDD.     DDDD   ZDDDD              .DDDD   DDD      DDDD DDDD.DDDDN.           
DDDD     ODDD$   ZDDD?       . ZDDDDDDDDD   DDD      DDDD DDDDDDDDD             
DDDDD. .DDDDD    ZDDD?      DDDDDDDDDDDDD   DDD      DDDD DDDDZDDDDD            
 ODDDDDDDDDD     ZDDD?     DDDDZ     DDDD   DDD      DDDD DDDD .DDDDD           
 .DDD8DD~        ZDDD?     DDDD.    ZDDDD   DDD      DDDD DDDD   DDDDD          
 DDD             ZDDD?     DDDDDDDDDDDDDD   DDD      DDDD DDDD    DNDDDD.  DDDDD
.DDDDDDDDNDNDD   ZDDD?      .DDDDDD  NDDD   DDD      DDDD DDDD      DDDDD  DDDDD
 ,DDDDDDDDDDDDD                                                                 
DDDD       DDDD?                                                                
DDD.      .NDDD                                                                 
DDDD?   .DDDDDD                                                                 
DDDDDDDDDDDDD                                                                   
    IDDDI  
 


===== CONTENTS =====

    last-updated: 09 august 2012;

    1: html and body
    2: typography
    3: lists
    4. links
    5: images    
    6: layout
    7: tables
    8. forms
    9. misc
    10. navigation 

====================

/* Color palette 

	links: #69ae3c

/*
1. =html & body ---------------------------------- */
html {
    margin: 0;
    padding: 0;
	background-color: #3F2222;
}
body {
    font: 13px/18px proxima-nova,helvetica,arial,sans-serif;
	color: #1b1717; 
	background: url(../images/global/bg_header.jpg) repeat-x 0 0 #ffffff;
}

/*
2. =typography ---------------------------------- */
/* =h1 */
h1 {
}
h1 a {
	background: url(../images/global/logo.png) no-repeat 0 0;
	display: block;
	width: 300px;
	height: 138px;
	text-indent: -9999px;
}


/* =h2 */
h2 {
	color: #69AE3C;
    font-family: "adelle-n6","adelle",serif;
    font-style: normal;
	font-size: 32px;
    font-weight: 600;
    line-height: 32px;
    margin-bottom: 13px;
    margin-top: 20px;
}

body#project h2 {
	width: 728px;
	float: right;
	display: inline;
}

/* =h3 */
h3 {
	color: #69ae3c;
	font-family: "adelle-n6","adelle",serif;
	font-size: 24px;
	font-style: normal;
	font-weight: 600;
	line-height: 24px;
}

ul#award_list h3,
ul#service_list h3 {
	margin-bottom: .5em;
}

div#wrap_content aside h3 {
    background: url("../images/global/bg_h3_aside.png") no-repeat 0 0 transparent;
    font-size: 27px;
    margin: -7px 0 26px 0;
    padding: 34px 0 0 48px;
    z-index: 0;
    position: absolute;
}

aside#recent_projects h3 {
	padding: 29px 0 0 0;
	margin-bottom: 17px;
	margin-left: 10px;
}

/* =h4 */
h4 {
	font-family: "adelle-n6","adelle",serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.25em;
	margin-bottom: 4px;
}

ul#project_list h4 a {
	color: #1B1717;
	text-decoration: none;
}

div#container h4 {
	padding-top: .25em;
}

/* =h5 */
h5 {

}
/* =h6 */
h6 {

}
/* =p */
p {
    margin-bottom: 1em;
    line-height: 1.5em;
}

ul#project_list p {
    bottom: 0;
    padding-right: 10px;
    margin-bottom: 0;
    position: absolute;
 }
 
div#thumbs p  {
	margin-top: 0;
	background: #fff;
	font-weight: normal;
}
 
p.no_results {
	margin-left: 1em;
	font-style: italic;
}

div#content_main p:nth-of-type(1) {
	 font-family: proxima-nova,sans-serif;
	 font-weight: 700;
}

/* =typographical elements */
abbr {
    cursor: help
}
small {
    font-size: .9167em; /* 11px */
    color: #cccac6;
}

/* =typographical spans */

span.date {
	font-size: 11px;
	display: block;
	margin-bottom: 3px;
}

div#content_main.page_gallery ul#award_list p,
div#content_main.page_gallery ul#service_list p {
	margin-left: 0;
}

div#content_main.page_gallery ul#service_list p {
	float: right;
	display: inline;
	width: 260px;
}

#wrap_project_gallery div.caption {
	font-family: "adelle-n4","adelle",serif;
	font-style: normal;
	font-weight: 400;
}

/*contact form */

 div.vcard {
 	font-family: adelle,serif;
    font-family: "adelle-n6","adelle",serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
}

span.email span.value a {
	text-decoration: none;
}

span.tel, span.street, span.street2 {
	display: block;
	margin-bottom: .25em;
}

span.adr span.type {
	display: none;
}

span.org, span.email, span.street2 {
	display: block;
}

span.type {
    display: inline;
    float: left;
    padding-right: .5em;
}

span.value,
span.street,
span.street2,
span.locality,
.region,
span.postal-code {
	color: #69AE3C;
}

span.adr, span.email {
	margin-bottom: .5em;
}

span.org, span.adr {
	margin-bottom: 1em;
	margin-top: 1em;
	display: block;
}

abbr[title], dfn[title] {
    border:none;
    cursor: auto;
}

/*
3. =lists ---------------------------------- */

nav#nav_primary ul#nav {
    position: absolute;
    right: 0px;
    top: 111px;
}

nav ul#nav_primary li a {
	font-family: "adelle-n7","adelle",serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	color: #3f2222;
}

ul#nav_social {
	float: right;
	display: inline;
	position: absolute;
	top: 16px;
	right: 70px;
}

ul#nav_social li {
	float: left;
	display: inline;
}

ul.thumbs {
	margin: 0;
	padding: 0;
	float: left;
	display: inline;
	border-bottom: 1px solid #ddd9d6;
}

div#content_main.page_gallery ul#award_list,
div#content_main.page_gallery ul#service_list {
    list-style: none outside none;
    margin-top: 2em;
    padding-bottom: 2em;
}

div#content_main.page_gallery ul#award_list li,
div#content_main.page_gallery ul#service_list li {
	border-top: 1px solid #DDD9D6;
    padding-bottom: 3em;
    padding-top: 2em;
}

div#content_main.page_gallery ul.thumbs {
	margin-left: 0;
	width: 170px;
}

div#wrap_project_gallery ul.thumbs {
	width: 163px;
	margin-left: 0;
}

div#wrap_content aside ul,
div#wrap_content aside section {
	width: 220px;
	padding: 63px 10px 0 10px;
}

div#wrap_content aside ul#project_list {
	padding: 63px 0 0;
}

#wrap_page_gallery ul.thumbs li,
#wrap_project_gallery ul.thumbs li {
 background: url("../images/global/bg_thumbs.jpg") no-repeat scroll 0 0 transparent;
    float: left;
    display: inline;
    height: 62px;
    list-style-type: none;
    margin: 0 15px 15px 0;
    overflow: hidden;
    padding: 1px 2px 3px;
    width: 62px;
}

nav#footer_nav {
    left: 780px;
    position: absolute;
    top: 30px;
    width: 250px;
}

nav#footer_nav li {
	float: left;
	display: inline;
	padding-left: 1em;
}


div#wrap_content aside li {
	padding-bottom: 20px;
}

div#wrap_content aside ul#project_list li {
	padding-bottom: 10px;
}

ul#project_list li {
 background: url("../images/global/bg_projects_li.png") no-repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    height: 275px;
    margin-right: 20px;
    padding: 10px;
    position: relative;
    width: 200px;
}

div#wrap_content aside ul#project_list li {
	margin-right: 0;
}

ul#project_list li.two {
	background: url(../images/global/bg_projects_li.png) no-repeat -240px 0;
}

ul#project_list li.three {
	background: url(../images/global/bg_projects_li.png) no-repeat -480px 0;
	margin-right: 0;
}

/*
4. =links ---------------------------------- */


a:link,
a:visited {
	color: #69ae3c;
	font-weight: bold;
	
}
a:hover,
a:active {
	color: #3f2222;
	text-decoration: none;

}

a#home_link {
	display: block;
	height: 32px;
	width: 32px;
	background: url(../images/global/icons.png) no-repeat 0 -37px;
	text-indent: -9999px;
}

body#home a#home_link, a#home_link:hover {
	background: url(../images/global/icons.png) no-repeat 0 0;
}

a#fb {
	display: block;
	height: 32px;
	width: 32px;
	background: url(../images/global/icons.png) no-repeat -37px 0;
	text-indent: -9999px;
}

a#fb:hover {
	background: url(../images/global/icons.png) no-repeat -37px -37px;

}

a.credit {
	background: url(../images/global/logo_grafik.png) no-repeat 0 0;
	display: block;
	width: 52px;
	height: 23px;
	text-indent: -9999px;
	position: relative;
	top: 70px;
	left: 640px;
}

nav#footer_nav a {
	color: #cccac6;
	text-decoration: none;
	background: url(../images/global/bg_dotted.gif) repeat-x bottom;
	padding-bottom: 4px;
	font-weight: 600;
	font-style: normal;
}

nav#footer_nav a:hover {
	background: none;
}


aside li a.more,
.project a.more,
ul#award_list a.more,
ul#service_list li a.more {
	background: url(../images/global/link_more.png) no-repeat 0 3px;
/*	display: inline; */
	display: block;
	padding: 0 0 0 10px;
	font-weight: 700;
	text-decoration: none;
	font-size: 12px;
}

ul#project_list aside a.more {
	margin: 0 0 0 10px;
}

aside a.more:hover,
.project a.more:hover,
ul#award_list a.more:hover,
ul#service_list li a.more:hover {
	background: url(../images/global/link_more.png) no-repeat 0 -36px;
}

aside li a.more {
	display: block;
	background: url(../images/global/link_more.png) no-repeat 0 3px;
}

aside li a.more:hover {
	background: url(../images/global/link_more.png) no-repeat 0 -36px;
}


#wrap_project_gallery div.caption a {
	text-decoration: none;
	padding-left: .5em;
}

/*
5. =images ---------------------------------- */

ul.subnav li ul li img {
	margin-bottom: 1em;

}
ul.subnav li span img {
	margin-bottom: 1em;	
}



ul#project_list img {
	display: block;
	padding-bottom: .75em;
}

/*
ul.thumbs li img {
	width: 60px;
	height: 60px;
}
*/

ul.thumbs li img {
	height: 60px;
	max-width: none;
}

ul#service_list img,
li.image img {
	float: left;
	display: inline;
	margin-right: 1em;
	margin-bottom: 1em;
}

div#content_main.page_gallery ul#award_list li.image p {
	padding-left: 188px;
	width: auto;
}

/*
6. =layout ---------------------------------- */

div#wrap_outer {
 background: url(../images/global/bg_body.png) repeat 0 7px ;
}

div#wrap_inner {
	padding-top: 36px;
	background: url(../images/global/bg_wrap_outer.png) repeat-y 0 0;
	position: relative;
}

header {
	width: 865px;
	margin: 0 0 25px 0;
	padding-left: 125px;
	position: relative;
	z-index: 2;
}

div#wrap_home_slider {
	position: relative;
	height: 330px;
	width: 990px;
	margin-bottom: 30px;
	clear: both;
}

div#wrap_content {
    background: url("../images/global/bg_wrap_content_top.png") no-repeat scroll 1px top #FFFFFF;
    border-right: 1px solid #B1ADAC;
    position: relative;
    width: 1030px;
}

body#home div#content_main {
    float: left;
    display: inline;
    margin-left: 290px;
    padding: 0 0 15px 10px;
    width: 450px;
}
div#content_main { 
    float: left;
    display: inline;
    padding: 0 0 40px 110px;
    width: 630px;
}

body#project div#content_main {
	padding-top: 20px;
}

div.credit_list {
	margin-left: 180px;
	margin-top: 1em;
}

div.credit_list img {
	display: inline;
	float: left;
	margin-right: 10px;
}
div#content_main.page_gallery div.credit_list p {
	display: inline;
	float: left;
	font-weight: normal;
	line-height: 1.25em;
	margin-left: 0;
	width: 123px;
}

body#project_overview div#content_main {
    background: url("../images/global/bg_portfolio_header.jpg") no-repeat scroll -160px -29px transparent;
    float: left;
    display: inline;
    margin-left: 260px;
    margin-top: 1px;
    padding: 0 0 15px 37px;
    width: 630px;
}

body#about_us div#content_main.page_gallery h4,
body#about_us div#content_main.page_gallery h3,
div#content_main.page_gallery h2,
div#content_main.page_gallery p,
div#content_main.page_gallery ol,
div#content_main.page_gallery ul {
	width: 450px;
	margin-left: 180px;
}

div#content_main.page_gallery ol,
div#content_main.page_gallery ul {
	list-style: disc inside;
	margin-bottom: 1em;
}

div#content_main.page_gallery ol p {
	margin-left: 0;
	font-weight: normal;
}

div#wrap_content aside {
    display: inline;
    float: right;
    padding-bottom: 40px;
    position: relative;
    width: 240px;
    margin-right: 20px;
}    


div#wrap_projects {
    clear: both;
    margin: 0 0 0 110px;
    position: relative;
    width: 920px;
    z-index: 1;
}

div#wrap_projects div#container {
	width: 735px;
	float: right;
	display: inline;
	margin-right: 10px;
}

aside#recent_projects {
	background: url(../images/global/bg_wrap_footer.png) no-repeat 0 0;
	width: 710px;
	padding: 0 31px 0 290px;
}

div#wrap_footer {
    background: url("../images/global/bg_wrap_footer.png") no-repeat scroll 0 0 transparent;
	padding: 45px 0 0 0;
	clear: both;
	position: relative;
}

body#home div#wrap_footer {
	background: none;
}

footer#primary_footer {
	background: #3f2222 url(../images/global/bg_footer.jpg) no-repeat 0 0 ;
	height: 200px;
	padding: 30px 0 0 290px;
	position: relative;
}
/*

7. =tables ---------------------------------- */
/*

8. =forms ---------------------------------- */

form.uniForm {
	margin-left: 180px;
    width: 450px;
    position: static;
}

.uniForm .ctrlHolder {
	width: 320px;
	border: none;
}

.uniForm label {
    display: block;
    float: none;
    line-height: 100%;
    margin: 0 0 0.5em;
    padding: 0;
    width: 320px;
}

.uniForm .textInput,
.uniForm .fileUpload,
.uniForm .selectInput,
.uniForm select,
.uniForm textarea {
	width: 320px;
	border: 1px solid;
}

div#content_main form.uniForm p.formHint,
form.uniForm .buttonHolder,
form.uniForm label.error {
	width: 320px;
	padding-top: 5px;
}

div#content_main form.uniForm p.formHint {
	width: 310px;
	padding-left: 10px;
	margin: 0;
}

form.uniForm .buttonHolder {
	background: none;
	border: none;
	padding: 0;
	text-align: center;
	float: right;
	display: inline;
}

.uniForm .buttonHolder .primaryAction {
    background: none repeat scroll 0 0 #69AE3C;
    border: none;
    color: #FFFFFF;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    padding: 10px 22px;
}

.uniform .primaryAction:hover {
	background-color: #1B1717;
}

form.uniForm label.error {
	color: #69AE3C;
	font-style: italic;
	margin-top: 5px;
	float: left;
	display: inline;
}

/*
9. =misc ---------------------------------- */

/* clearfix */

div:after,
form:after,
ul:after,
ol:after,
li:after,
header:after,
nav:after,
section:after,
aside:after,
article:after,
footer:after,
time:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

.ie6 div:after,
.ie6 form:after,
.ie6 ul:after,
.ie6 ol:after,
.ie6 li:after,
.ie6 header:after,
.ie6 nav:after,
.ie6 section:after,
.ie6 aside:after,
.ie6 article:after,
.ie6 footer:after,
.ie6 time:after {
	display: block;
	zoom: 1;
}

.visuallyhidden {
    position: absolute !important;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
}

/*
= 10. Primary navigation ---------------------------------- */


#nav, 
#nav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1;
}

#nav a {
    color: #3F2222;
    display: block;
    font-family: "adelle-n7","adelle",serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
	padding: 8px 15px 8px 15px;
    text-align: center;
    text-decoration: none;
    position: relative;
}

#nav li.active a {
	color: #69ae3c;
}

#nav ul.subnav a {
	font-size: 14px;
	text-align: left;
	padding-right: 0;
}

#nav ul.subnav li ul li a {
	font-size: 12px;
	display: block;
}

#nav li:hover a {
	background-color: #3F2222;
	color: #ffffff; 
}

#nav li.sub:hover a {
	color: #ffffff;
    background: url(../images/global/bg_service_item_active.jpg) no-repeat center bottom #3F2222;
	z-index: 10;
	padding: 8px 15px 16px 15px;
}

#nav li { /* all list items */
	float: left;
	display: inline;
	margin-right: 10px;
}

#nav li ul { /* second-level lists */
	position: absolute;
	background: #ffffff;
	width: 10em;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#nav li ul li {
	float: none;
	width: 110px;
	display: block; /* ie */
	
}

#nav li:hover ul ul, 
#nav li.sfhover ul ul {
	left: -999em;
}


/* end first item */

#nav li:hover ul, 
#nav li li:hover ul,
 #nav li.sfhover ul, 
 #nav li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}

#content {
	clear: left;
	color: #ccc;
}

/* styling for individual sublist elements */
ul#nav li.sub:hover ul li a {
    background: url("../images/global/bg_nav_bottom.gif") no-repeat scroll 0 bottom transparent;
    padding: 10px 15px 10px 10px;
    text-decoration: none;
	width: 115px;
    color: #3F2222;
}

ul#nav li:hover ul li:hover {
	background-color: transparent
}

ul#nav li.sub:hover ul li a {
	background-color: #ffffff;
}

ul#nav li:hover ul li:hover a {
	background: url("../images/global/bg_nav_bottom.gif") no-repeat scroll 0 bottom #f7f7f7;
	color: #69ae3c;
}

#nav li ul.subnav {
    background: url("../images/global/bg_ul_subnav.png") no-repeat scroll 0 bottom #ffffff;
    border: 1px solid #CFCDCA;
    margin-left: -65px;
    min-height: 252px;
    height: auto !important;
    height: 252px;
    margin-top: -7px;
    padding: 10px 10px 50px;
    width: 335px;
    z-index: 1;
}

/* Holds individual services */
#nav li ul ul { 
    background: url(../images/global/bg_services_dropdown.png) repeat-x 0 bottom;
    border: medium none;
    display: block;
    height: auto !important;
    margin: 0 0 0 140px;
    min-height: 275px;
    padding: 10px 0 10px 1px;
    top: 10px;
    width: 194px;
}

#nav li#service_intro {
	height: 0 !important;
	overflow: visible;
	width: 335px;
}

#nav li#service_intro div.service_intro_wrap {
    background: url(../images/global/bg_services_dropdown.png) repeat-x 0 bottom;
    border: medium none;
    display: block;
    height: auto !important;
    margin: 0 0 0 140px;
    position: relative;
    top: 0;
	/* top: 10px;*/ 
    width: 195px;
}

div.service_intro_wrap img {
	margin-left: 12px;
	margin-top: 10px;
	margin-bottom: 1em;
}

div.service_intro_wrap p {
	margin-left: 12px;
	width: 172px;
}

/* stlying for final list element holder */

#nav li ul li ul li {
	/*width: auto;*/
	width: 172px;
	padding: 0 0 0 11px;
	margin: 0;
}

/* read more link on subnav item */

#nav li:hover ul li:hover ul li a {
    background: url("../images/global/link_more.png") no-repeat scroll 0 -1px transparent;
    font-family: proxima-nova,helvetica,arial,sans-serif;
    font-weight: 700;
    padding: 0 0 0 10px;
    text-decoration: none;
    color: #69ae3c;
}

#nav li:hover ul li ul li a:hover {
    background: url(../images/global/link_more.png) no-repeat 0 -40px;
    color: #3F2222;
}

#nav li p {
	font-size: 12px;
}


section#options {
	background: url(../images/global/bg_portfolio_nav.jpg) no-repeat top right;
    display: inline;
    float: left;
    width: 165px;
    padding-bottom: 110px;
}

section#options ul#filter li{
   	border-bottom: 1px solid #DFDCD9;
   	display: block;
   	position: relative;
   	h
}

section#options ul#filter li a  {
    color: #DEDBD7;
    background: none;
    display: block;
    font-family: "adelle-n6","adelle",serif;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    padding: 25px 10px 5px 0;
    text-decoration: none;
    text-transform: uppercase;
}

section#options ul#filter li a:hover {
    color: #69AE3C;
}

section#options ul#filter li a.selected,
section#options.construction ul#filter li a.construction,
section#options.excavation ul#filter li a.excavation,
section#options.horticulture ul#filter li a.horticulture,
section#options.irrigation ul#filter li a.irrigation,
section#options.paving ul#filter li a.paving,
section#options.planting ul#filter li a.planting,
section#options.retaining_walls ul#filter li a.retaining_walls,
section#options.stone_masonry ul#filter li a.stone_masonry {
    background: url("../images/global/bg_service_li_a.png") no-repeat right 25px #ffffff;
    color: #69AE3C;
    padding-right: 20px;
	text-align: right;
}

.project {
    background: url("../images/global/bg_projects_li.png") no-repeat scroll 0 0 transparent;
    display: inline;
    float: left;
    height: 275px;
    margin: 0 20px 20px 0;
    padding: 10px;
    position: relative;
    width: 200px;
}

.project p {
	bottom: 0;
	margin-bottom: 0;
	position: absolute;
	padding-right: 10px;
	display: block;
}

.clickable .project:hover {
  cursor: pointer;
}

.clickable .project:hover h3 {
  text-shadow:
    0 0 10px white,
    0 0 10px white
  ;
}

.clickable .project:hover h2 {
  color: white;
}

/* The Magnificent Clearfix: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

.ie6 ul.thumbs li a,
.ie6 section#options ul#filter a {
	font-size: 14px;
	background: #fff;
}

.ie6 #wrap_services_gallery ul.thumbs li.selected a,
.ie7 #wrap_services_gallery ul.thumbs li.selected a,
.ie7 #wrap_services_gallery ul.thumbs li a {
	background: #fff;
	filter: alpha(opacity = 100);
}

.ie6 #nav li#service_intro div.service_intro_wrap {
	display: none;
}

.ie7 #nav li#service_intro div.service_intro_wrap {
	top: -11px;
}

.ie8 #wrap_services_gallery ul.thumbs li {
   background-color: #ffffff;
   font-size: 15px;
}

.ie8 #wrap_services_gallery ul.thumbs li.selected {
   background-color: #ffffff;
	font-size: 15px;
}
