/* Thanks to http://matthewjamestaylor.com/ for the layout resources */
/* Thanks to http://960.gs/ for the grid simplification */
/* Thanks to http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ for the global reset */
/* Thanks to http://www.alistapart.com/articles/howtosizetextincss/ for the typography resources*/

/* global reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; vertical-align: baseline; }:focus {outline: 0;}/* remember to define focus styles! */ body {line-height: 1; color: black; /*background: white;*/} ol, ul {list-style: none;} table {border-collapse: separate; border-spacing: 0;}/* tables still need 'cellspacing="0"' in the markup */ caption, th, td { text-align: left; font-weight: normal;} blockquote: before, blockquote:after, q:before, q:after {content: "";} blockquote, q {quotes: "" "";}

/******************** Html + Body */
html, body {height: 100%;} /* Sticky Footer Mandatory */

body {
	margin:0;
	padding:0;
	border: 0px;			/* IE */
	width:100%;
	/*min-width:960px;*/
	text-align: center;
	background-color: #b3ddaa;
	background-repeat: repeat-x;
	background-position: top;
	}

/******************** Layout - Wrappers */
.fixed #wrapper, .liquid #wrapper {
	text-align: center;/* makes the contained div within center in IE6*/
	/*margin:0;*/
	/*min-height: 100%; /* IE - Sticky Footer Mandatory 
	height: auto !important;  /* IE - Sticky Footer Mandatory  
	height: 100%;  /* Sticky Footer Mandatory 
	margin: 0 auto -100px;  /* Sticky Footer Mandatory */ 
	/*background-image: url(../images/wrapper-bg.png);
	background-position: 50% 150px;
	background-repeat: no-repeat;
	overflow: visible;*/
	}
.fixed #wrapper {width:1000px;}

.liquid #wrapper {width:100%;}

#content-wrapper-yard {
	width: 100%;
	text-align: center;
	background-image: url(../images/content-wrapper-a.png);
	background-repeat: repeat-x;
		background-color: white;

	}

#content-wrapper-foundation {
	margin: 0 auto;
	width: 1000px;
	text-align: center;
	background-color: white;
	background-image: url(../images/column-wrapper-bg.png);
	background-repeat: no-repeat;
	/*background-position: 50% 0px;*/
	}

#content-wrapper-flooring {
	margin: 0 auto;
	width: 960px;
	text-align: left;
	}
	
/******************** Layout - Header */
#header-wrapper {
	clear:both;
	float:left;
	width:100%;
	/*height: 145px;*/
	padding-top: 20px;
	text-align: center; /* IE */
	background-image: url(../images/header-wrapper-bg.png);
	background-color: #6ad1e2;
	background-repeat: repeat-x;
	background-position: top;
	}
#header {
	width: 1000px;
	margin: 0 auto;
	/*text-align: left;*/
	padding-top: 0px;
	padding-bottom: 0px;
	/*background-color:  /*red*/;*/
	background-image: url(../images/column-wrapper-bg.png);
	background-position: bottom;
	background-repeat: no-repeat;
	}

/******************** Header (Main navigation) */
#header ul {
	bottom:0px;
	clear:left;
	float:left;
	width:100%;
	list-style:none;
	margin:0px 0 0 0;
	padding:4px 0px 0px 0px;
	background-repeat: no-repeat;
	background-image: url(../images/header-ul.png);
	/*background-color: green;*/
	height: 40px;
	overflow: hidden;
	}
#header ul li {
	display:inline;
	list-style:none;
    margin:0;
    padding:0;
    }
#header ul li a {
    display:block;
    float:left;
    margin:0 0 0 0px;
    padding: 11px 15px 13px 15px;
    text-align: center;
    text-decoration:none;
    position:relative;
    left:10px;
	line-height:1.3em;
	border-left: 1px solid transparent;
	border-right: 1px solid transparent;
	}
#header ul li a:hover {
	/*padding-top: 12px;
	/*background-image: url(../images/header-ul-li-a-hover.png);
	background-repeat: no-repeat;
	background-position:  50% 0px;*/
	}
#header ul li a.active, #header ul li a.active:hover {
	color: rgb(100,100,100);
	background: white;
	border-left: 1px solid rgb(215,215,215);
	border-right: 1px solid rgb(215,215,215);
	}
/*#header ul li a span {
	display:block;
	}*/
	
/******************** Layout - Column Container */
.colmask {
	position:relative;	/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:both;
    /*float:left;*/
    width:960px;
	overflow:hidden;	/* This chops off any overhanging divs */
	border-top: 15px solid transparent;
	}		
		
/******************** Layout - Sticky Footer */
/*#foot, #footer-wrapper {height: 100px;}*/

#footer-wrapper {
	clear:both;
	float:left;
	width:100%;
	text-align: center;
	background: #b3ddaa;/* green; */
	background-image: url(../images/footer-wrapper-bg.png);
	background-repeat: repeat-x;
	}

/*#pusher {}*/

#footer {
	width: 1000px;
	margin:0 auto;
	/*background: #AEAEAE;/* lime;*/
	/*background-image: url(../images/footer-bg.png);
	background-position: top center;
	background-repeat: no-repeat;
	padding-bottom: 20px;*/
	}

#footer ul {
	list-style: none;
	}

#footer ul li {
	display:inline;
	list-style:none;
	padding: 0px 10px 0px 10px;
	margin-right: 0px:
	}


/******************** Typography - Fonts */

body {
	font-family: "Lucida Grande","Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height: 1.35em;/*WAS 1.15 */
	color: rgb(40,40,40);
	/*font-weight: normal;/* IE6 */
	}

.leftmenu .col1, 
.rightmenu .col1, 
.fullpage .col1 {
	font-size:0.88125em; /*WAS .78em = 12.5px; */
	/*color: navy;*/
	}

.col1,
.one-third,
.one-half,
#footer {
	font-size:0.88125em;  /*WAS .75em = 12px */
	/*color: green;*/
	}

.col2, .col3, .one-fourth {
	font-size:0.88125em; /*WAS .69em = 11px */
	/*color: maroon;*/
	}

.one-sixth {
	font-size:0.65em;
	}

#footer {color: white;}


/******************** Typography - Headers */
H1, H2, H3, H4 {
    font-family: Helvetica Neue, Helvetica, Arial,"Lucida Grande","Lucida Sans Unicode", sans-serif;
    font-weight: bold;
	color: black;
    }
H1 {
	font-size: 1.625em; /* 1.625em = 19.5px */
						/* h1s, h2s, etc. must be measu/*red*/ in PX not EM in vertical grid scenario in order to avoid automatic broswer scaling in "lefmenu" "rightmenu" menu & "fullpage" layouts */
	margin-bottom: 5px;
	}
H2 {
	font-size: 1.425em;	/* 1.425em = 17.1px */
	margin-bottom: 5px;	/* remove for vertical grid */
	}
H3 {font-size: 1.275em;	/* 1.275em = 14.0667px */
	margin-bottom: 5px;	/* remove for vertical grid */
	}
H4 {font-size: 14px;
	font-size: 1.2em; 	/* .8125em = 12.483px; */
	margin-bottom: 3px;	/* remove for vertical grid */
	}
    
/******************** Typography - Links */

#header ul li a {
    font-family: Helvetica Neue, Helvetica, Arial, Verdana, "Lucida Grande","Lucida Sans Unicode", sans-serif;
	font-size:0.8125em; /* .8125em = 13px; */
	color: #000000;
	font-weight: bold;
	text-shadow: 1px 1px 1px #FFFFFF;
	}

#header ul li a:hover {
    color: #25A461;
    text-shadow: 0px -1px 1px #CECECE;
	}

a {
	color: #0088CC;
	text-decoration: none;
	}
    	
a:hover {
	color: black;
	text-decoration: underline;
	}
p {
	margin:.4em 0 .8em 0;
    padding:0;
    }

#footer a {
	color: white;
	}
/*img { margin:10px 0 5px; }*/
	











/******************** 1 column full page settings */
.fullpage {
	background: /*/*orange*/*/;
	}
.fullpage .col1 {
	margin:10px 10px 10px 10px;
	background-color: white;
	}

/******************** 2 column left menu settings */
.leftmenu {
	background: /*red*/;
	}
.leftmenu .colright {
	float:left;
	width:200%;
	position:relative;
	left: 320px;
	/* 200 -> 255 (225 + 30 = 255 )*/
    background:/*/*orange*/*/;    	/* right column background colour */
	}
.leftmenu .col1wrap {
	float:right;
	width:50%;
	position:relative;
	right:320px;
	padding-bottom:10px;
	background-color:/*/*orange*/*/;
	margin-top:10px;
	}
.leftmenu .col1 {
	margin:0 10px 0 330px;
	position:relative;
	right:100%;
	overflow:hidden;
	background-color: white;
	}
.leftmenu .col2 {
	float:left;
	width:300px;
    position:relative;
	right:310px;
    background-color:white;
    margin:10px 0px 10px 0px;
	}

/******************** 2 column right menu settings */
.rightmenu {
	background: /*red*/;
	}
.rightmenu .colleft {
	float:left;
	width:200%;
	margin-left:-320px;
	position:relative;
	right:100%;
 	/*background:;	 Left column background colour */
	}
.rightmenu .col1wrap {
	float:left;
	width:50%;
	position:relative;
	left:50%;
	padding-bottom:10px;
	background-color: /*orange*/;
	}
.rightmenu .col1 {
	margin:10px 10px 0px 330px;
	overflow:hidden;
	background-color: white;
	}
.rightmenu .col2 {
	float:right;
	width:300px;
	position:relative;
	left:310px;
	background-color: white;
	margin: 10px 0px 10px 0px;
								text-align: right;
	}

/******************** holy grail 3 column settings */
.holygrail {
	background: /*yellow*/;    	/* Right column background colour */
	}
.holygrail .colmid {
	float:left;
	width:200%;
	margin-left:-240px; 	/* Width of right column */
    position:relative;
	right:100%;
	background: /*orange*/;    	/* Centre column background colour */
	}
.holygrail .colleft {
	float:left;
	width:100%;
	margin-left:-50%;
	position:relative;
	left:480px;         	/* Left column width + right column width (240 right column + 240 right column = 480) */
    background: /*red*/;    	/* Left column background colour */
	}
.holygrail .col1wrap {
	float:left;
	width:50%;
	position:relative;
	right:240px;        	/* Width of left column */
	padding-bottom: 10px; 	/* Centre column bottom padding. Leave it out if it's zero */
	margin-top: 10px;
	}
.holygrail .col1 {
	margin:0 250px;			/* 220 + 20 + 10 (220 col2 +30px in padding which extends into the center column to give it it's padding */
							/* Centre column side padding: Left padding = left column width + centre column left padding width Right padding = right column width + centre column right padding width */
    position:relative;
	left:200%;
	overflow:hidden;
	background-color:white;
	}
.holygrail .col2 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:220px;        	/* Width of left column content (left column width minus left and right padding) */
    position:relative;
	right:10px;         	/* Width of the left-had side padding on the left column */
	background-color: white;
	margin:10px 0px 10px 0px;
	}
.holygrail .col3 {
	float:left;
	float:right;			/* This overrides the float:left above */
	width:220px;        	/* Width of right column content (right column width minus left and right padding) */
	position:relative;
	left:50%;
	background-color:white;
	margin:10px 30px 10px 0px;
	}

/******************** 3 column blog style settings */
.blogstyle {
	background: /*yellow*/;    	/* Right column background colour */
	}
.blogstyle .colmid {
	float:left;
	width:200%;
	margin-left:-240px; 	/* Width of right column */
   	position:relative;
	right:100%;
	background:/*red*/;    	/* Centre column background colour */
	}
.blogstyle .colleft {
	float:left;
	width:100%;
	margin-left:-240px; 	/* Width of centre column */
    background:/*orange*/;    	/* Left column background colour */
	}
.blogstyle .col1wrap {
	float:left;
	width:50%;
	/*padding-bottom:10px; 	/* Centre column bottom padding. Leave it out if it's zero */
	margin: 10px 0px 10px 0px;
	}
.blogstyle .col1 {
	margin:0 10px 0 490px; /* Centre column side padding: Left padding = left column width + centre column left padding width Right padding = right column width + centre column right padding width */
	position:relative;
	left:100%;
	overflow:hidden;
	background-color: white;
	}
.blogstyle .col2 {
	float:right;
	width: 220px;        	/* Width of left column content (left column width minus left and right padding) */
    position:relative;
	left:230px;         	/* Width of the left-had side padding on the left column */
    background-color: white;
    margin:10px 0px 10px 0px;
	}
.blogstyle .col3 {
	float:right;
	width:220px;        	/* Width of right column content (right column width minus left and right padding) */
    position:relative;
	left:690px;
    background-color: white;
    margin:10px 0px 10px 0px;
	}

/******************** One Half */
.one-half-wrapper {
	width: 480px;
	float: left;
    background-color: blue;
    text-align: center;
}

.one-half {
	width: 460px;
	margin: 0px auto;
	background-color: aqua;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: left;
}

/******************** One Third */
.one-third-wrapper {
	width: 320px;
	float: left;
    background-color: blue;
    text-align: center;
}

.one-third {
	width: 300px;
	margin: 0px auto;
	background-color: aqua;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: left;
}

/******************** One Fourth */
.one-fourth-wrapper {
	width: 240px;
	float: left;
    background-color: blue;
    text-align: center;
}

.one-fourth {
	width: 220px;
	margin: 0px auto;
	background-color: aqua;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: left;
}

/******************** One sixth */
.one-sixth-wrapper {
	width: 160px;
	float: left;
    background-color: blue;
    text-align: center;
}

.one-sixth {
	width: 140px;
	margin: 0px auto;
	background-color: aqua;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: left;
}



/* CUstom stuff */
div.sider {
	/*background-image: url(../images/flower.jpg);*/
	background-repeat: no-repeat;
	padding-top: 10px;
}


/*********************** Contact FOrm */

.contactForm { width:308px; } 

.contactForm p { padding:0px; } 

.contactForm input { width:240px; } 

.contactForm textarea { width:281px; height:120px; } 

.submit { width:45px!important; } 

.hide { display:none; }
