/* CSS Document */

/* text-align centers container div in IE5 Win */
body {
	margin:0;
	padding:0;
	text-align:center;
	color:#362728;
	background:#FFF;
	}
	
a {
	text-decoration:none;
	}
	
a:link {
	color:#70696A;
	}
	
a:visited {
	color:#584143;
	}	
	
a:hover, a:active {
	background-color:#F4F5ED;
	}
	
h1 {
	font-weight:lighter;
	font-size:120%;
	margin-bottom:6px;
	margin-top:0;
	}
	
p {
	font: 0.7em/1.4em Verdana, Arial, Helvetica, sans-serif;
	margin:0 0 2px 0;
	text-indent:0;
	}	

	
/* this container centres everything in the page and returns text alignment to left. Position relative allows for logo block and any other positioned elements */
#container {
	width:803px;
	margin:15px auto 0;
	padding:0;
	text-align:left;
	position:relative;
	font:Verdana, Arial, Helvetica, sans-serif;
	}

/* absolutely positioned takes it out of the flow and makes rest of divs come to the top */	
#logoblock {
	width:163px
	height:194px;
	margin:0;
	padding:0;
	position:absolute;
	left:39px;
	z-index:100;
	}
	
a.logoblock:hover, a.logoblock:active {
	background-color:transparent;
	}
	
#mainnavigation {
	width:803px;
	color:#B9B8B8;
	background:url(../images/commonimages/topcurveclear803x24.gif) right bottom no-repeat;
	font: 65% Verdana, Arial, Helvetica, sans-serif;
	text-align:left;
	padding-top:14px;
	padding-bottom:34px;
	margin:0;
	}
	
#mainnavigation ul{
	margin:0;
	padding:0 0 0 214px;
	}
	
#mainnavigation li{
	list-style:none;
	display:inline;
	}
	
.currentpage {
	font-weight:bold;
	color:#584143;
	}
	
#mainnavigation a {
	padding-bottom:0.8em;
	}	
	
#mainnavigation a:link {
	color:#70696A;
	}
	
#mainnavigation a:visited {
	color:#70696A;
	}
	
#mainnavigation a:hover, #mainnavigation a:active {
	color:#584143;
	background:transparent;
	border-bottom:5px solid #B9B8B8;
	}

a.highlight {
	border-bottom:5px solid #B9B8B8;
	}


#maincontent {
	width:803px;
	background:#E9E8CF;
	margin:0;
	padding-top:1px;
	}
	
/* Trial background colors 
	

#maincontentE4E6D8 {
	width:803px;
	height:300px;
	background:#E4E6D8;
	margin:0;
	padding-top:150px;
	text-align:center;
	}

#maincontentE9E8CF {
	width:803px;
	height:300px;
	background:#E9E8CF;
	margin:0;
	padding-top:150px;
	text-align:center;
	}
	
#maincontentE0DFC1 {
	width:803px;
	height:300px;
	background:#E0DFC1;
	margin:0;
	padding-top:150px;
	text-align:center;
	}

#maincontentE4E6DB {
	width:803px;
	height:300px;
	background:#E4E6DB;
	margin:0;
	padding-top:150px;
	text-align:center;
	}	
	
#maincontentDFE2D4 {
	width:803px;
	height:300px;
	background:#DFE2D4;
	margin:0;
	padding-top:150px;
	text-align:center;
	}
	*/
	
	
	
#maincontentspiky {
	width:803px;
	background:#E9E8CF url(../images/commonimages/spikybottommain401x96.gif) left bottom no-repeat;
	margin:0;
	padding-top:1px;
	border-bottom:0px solid #66FF33;
	}
	
#maincontentmap {
	width:803px;
	background:#E9E8CF url(../images/contactimages/contactplantmaptop268x535.gif) 267px bottom no-repeat;
	margin:0;
	padding-top:1px;
	}
	
#maincontentandrew {
	width:803px;
	background:#E9E8CF url(../images/andrewimages/andrewtoprightedge70x455.gif) right bottom no-repeat;
	margin:0;
	padding-top:1px;
	}
	
/* secondary navigation is made absolute to allow the right-hand content to ride to the top. Avoids difficulties with overlap of right hand content. Layout of other pages doesnt include secondary navigation so this also makes it more flexible in terms of templating*/
	
#secondarynavigation {
	width:299px;
	padding:0;
	margin:0;
	font:11px/14px Verdana, Arial, Helvetica, sans-serif;
	text-align:left;
	position:absolute;
	left:214px;
	z-index:101;
	}
	
#secondarynavigation ul {
	margin:0;
	padding:0;
	}
	
#secondarynavigation li {
	list-style:none;
	}
	
#secondarynavigation li.currentsecond {
	font-weight:bold;
	color:#584143;
	}
	
#secondarynavigation a:hover, #secondarynavigation a:active {
	color:#584143;
	}	
	
/* float left to allow document structure to have words first rather than image block on the right */	

#lefthandcontent {
	width:384px;
	float:left;
	text-align:left;
	}
	
#lefthandcontentpmain {
	width:434px;
	float:left;
	text-align:left;
	}

#lefthandcontentcontact {
	width:270px;
	float:left;
	text-align:left;
	margin-right:20px;
	}
	
	
#lefthandcontentandrew {
	width:404px;
	float:left;
	text-align:left;
	}
	
#lefthandcontentandrew p{
	padding-right:20px;
	}
	
#lefthandcontenttulips {
	width:348px;
	float:left;
	text-align:left;
	}

#lefthandcontenttulips p{
	padding-right:10px;
	}	
	
	
.lefthandcontentstandard {
	width:374px;
	float:left;
	text-align:left;
	}
	
.lefthandcontentstandard p{
	padding-right:20px;
	}
	
/* This knocks the right hand edge of the text on the main project in a little so as to link back the inserted thumbnail with the other images */
#lefthandcontentpmain p{
	padding-right:20px;
	}


#maintextproject {
	margin:0;
	padding-left:39px;
	padding-top:160px;
	font: 90% Verdana, Arial, Helvetica, sans-serif;
	}
	
#doublefloat {
	float:right;
	margin:0 0 0 8px;
	}
	
/* margin-left keeps image content to right-hand side even after left-hand content has finished */
#righthandcontent {
	margin-left:384px;
	text-align:left;
	}
	
#righthandcontentpmain {
	margin-left:439px;
	text-align:left;
	}
	
#righthandcontentpleswin {
	margin-left:346px;
	text-align:left;
	border:0px solid #CCFF33;
	}
	
#righthandcontenttulips {
	margin:125px 24px 0 348px;
	text-align:left;
	background-color:#FFFFFF;
	}
	
	
#righthandcontentmature {
	height:275px;
	margin:125px 24px 0 348px;
	text-align:left;
	background-color:#FFFFFF;
	}

.righthandcontentstandard {
	margin-left:379px;
	text-align:left;
	}
	
#righthandcontentandrew {
	margin-left:404px;
	text-align:left;
	padding-left:20px;
	padding-top:39px;
	}
	
#righthandcontentandrew p{
	padding-left: 50px;
	margin-right:115px;
	}
	
#righthandcontentcontact {
	padding-top:108px;
	margin-left:290px;
	}
	
#righthandcontentcontact img {
	padding-bottom:70px;
	}
	

#tophomeimage {
	padding-bottom:1px;
	}
	
#bottomhomeimages {
	padding-top:4px;
	}
	
#bottomhomeimages img{
	margin:0 5px 0 0;
	}
	
/* padding-left for image project block can be removed for other pages where image sits up tight to left-hand content div */
#imageblockproject {
	margin-left:50px;
	width:336px;
	}
	
#imageblockprojectpmain {
	margin:0;
	width:345px;
	}
	
#imageblockprojectleswin {
	margin:0;
	width:445px;
	border:1px solid #006600;
	}
	
#topblockpmain {
	padding-bottom:1px;
	margin:0;
	}
	
#twopicsleft {
	float:left;
	margin:0 5px 0 0;
	padding-top:85px;
	}
	
	
#bottwopicsleft {
	padding-top:5px;
	}
	
#twopicsleft img {
	display:block;
	}
	
#bottomblockpmain {
	padding-top:4px;
	margin:0;
	}
	
#bottomblockpmain img{
	float:left;
	margin-right:5px;
	}
	
#bottomblockpmain p{
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	margin-left:238px;
	padding-right:35px;
	text-indent:0;
	}
	

	
#leswinroadspecialbox {
	border:1px solid white;
	border-width: 3px 5px 8px 8px;
	clear:both;
	background:white;
	width:76px;
	position:absolute;
	left:348px;
	top:307px;
	z-index:103;
	margin:0;
	}
	
/* this contains the run of vertical pics within its own div. Relative positioning doesn't then knock down the footer if pics break below main image depth */
#thumbnailvertical {
	width:89px;
	padding-top:155px;
	float:left;
	margin:0;
	}
	
	#thumbnailverticaltwoup {
	width:89px;
	padding-top:100px;
	float:left;
	margin:0;
	}
	
	
/*  This version created to allow thumbnails to run down the side of a horizontal layout */	
#thumbnailhorileftside {
	width:auto;
	border:1px solid white;
	border-width:3px 0 8px 8px;
	background-color:#FFFFFF;
	padding:0;
	padding-right:332px;
	}
	
#mainpichorizontal {
	width:341px;
	margin-top:115px;
	padding-bottom:1px;
	background-color:#FFF;
	}
	
/* created separately to allow for up and down positioning within thumbnailvertical div. */	
#miniverticalpics {
	border:1px solid white;
	border-width:3px 5px 8px 8px;
	background-color:#FFFFFF;
	margin:0;
	}
	
/* created separately to allow for up and down positioning within thumbnailvertical div. */	
#minihorizontalpics {
	float:left;
	border:1px solid white;
	border-width:0 3px 4px 7px;
	background-color:#FFFFFF;
	margin-right:5px;
	padding:1px 1px 0 1px;
	}
	
/* 	
#miniuprightpics a {
	display:block;
	margin:0;
	background:white;
	}
*/	


/* image styles */

img.thumbnail {
	display:block;
	height:79px;
	width:76px;
	border:1px solid white;
	border-width:5px 0px 4px 0;
	padding-bottom:2px;
	}
	
img.thumbnailnew {
	display:block;
	border:1px solid white;
	border-width:5px 0px 4px 0;
	padding-bottom:2px;
	}
	
img.thumbnailhorizontal {
	height:79px;
	width:76px;
	border:1px solid white;
	border-width:0 0 4px 0;
	padding-bottom:2px;
	background-color:#FFF;
	}
	
img.projectinsert {
	border:8px solid white;
	margin:0 0 5px 8px;
	float:right;
	}
	
img.stackingthumbs {
	border:8px solid white;
	margin:0 0 5px 0;
	display:block;
	}
	
img.floatright {
	margin:0 0 5px 8px;
	float:right;
	}
	
img.floatmap {
	margin:0 0 0 8px;
	float:right;
	clear:right;
	}
	
img.mainhorizontal {
	float:right;
	border:8px solid white;
	}
	
/* background needs to be white as img margin becomes transparent on hover-active phase. Not sure why but it shows thru */
a.underscore {
	background:#FFF;
	}	
/* this changes the white color of the image to a grey on the hover and the active phases */	
a.underscore:hover img{
	border-bottom:4px solid #cbcbcb;
	}
	
a.underscore:active img{
	border-bottom:4px solid #cbcbcb;
	}
	
#mainpicupright {
	width:247px;
	float:right;
	padding-bottom:1px;
	}
	
img.mainproject {
	border:8px solid white;
	margin:0;
	}
	
img.mainprojecthorizontal {
	border:8px solid white;
	border-bottom:7px solid white;
	margin:0;
	}
	
/* padding-bottom for caption keeps minimum distance for starter of the footer */
.captionvertical {
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	padding: 0 30px 10px 8px;
	margin:5px 0 0 0;
	text-indent:0;
	}
	
.captionhorizontal {
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	padding-top:5px;
	padding-bottom:20px;
	margin:0;
	margin-left: 174px;
	text-indent:0;
	}
	
#footer {
	width:803px;
	padding-top: 26px;
	background:url(../images/commonimages/botcurveclear803x24.gif) right top no-repeat;
	clear:both;
	font: 110% Verdana, Arial, Helvetica, sans-serif;
	color:#70696A;
	}
	
#webdesign {
	position:relative;
	top:-16px;
	right:20px;
	text-align:right;
	font-size:9px;
	}
	
#webdesign a{
	text-decoration:none;
	}
	
#webdesign a:link{
	color:#999999;
	}
	
#webdesign a:visited{
	color:#999999;
	}
	
#webdesign a:hover, #webdesign a:active {
	background-color:transparent;
	color:#333333;
	}
	
#webdesign a:visited:hover, #webdesign a:visited:active {
	background-color:transparent;
	color:#333333;
	}
	
	
	
		
#footerspiky {
	width:803px;
	padding-top: 26px;
	background:url(../images/commonimages/botcurvespiky803x24.gif) right top no-repeat;
	clear:both;
	font: 110% Verdana, Arial, Helvetica, sans-serif;
	color:#70696A;
	}
	
#footermap {
	width:803px;
	padding-top: 26px;
	background: url(../images/contactimages/contactbottomcurve803x23.gif) right top no-repeat;
	clear:both;
	font: 110% Verdana, Arial, Helvetica, sans-serif;
	color:#70696A;
	}
	
#footerandrew {
	width:803px;
	padding-top: 26px;
	background: url(../images/andrewimages/botcurvandrew803x24.gif) right top no-repeat;
	clear:both;
	font: 110% Verdana, Arial, Helvetica, sans-serif;
	color:#70696A;
	}
	
#twoplants {
	position:relative;
	top:-200px;
	left:635px;
	}
	
	
.plantrighthandedge {
	position:absolute;
	right:-3px;
	top:50px;
	}
	
	
/* paragraph styles */

	
.noindent {
	text-indent:0px;
	}
	
/* This keep minimum distance for footer if text content breaks below that of the image content on the right */
.endpar {
	padding-bottom:30px;
	}
	
	
.endpardeep {
	padding-bottom:100px;
	}
	
#leswinroadparas p{
	padding-right:65px;
	}
	
.mainprojectsendpar {
	padding-bottom:90px;
	}
	
.andrewcontact {
	text-indent:0px;
	padding-left:39px;
	}
	
.bolder {
font-weight:bold;
	}
	
	
.caption {
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	padding-top:5px;
	padding-bottom:20px;
	margin:0;
	text-indent:0;
	}
	
.captionright {
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	padding-top:5px;
	padding-bottom:20px;
	margin:0;
	text-indent:0;
	text-align:right;
	}

.maturecaption {
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	padding-top:5px;
	margin:0;
	text-indent:0;
	text-align:right;
	}
	
.noindentspaceabove {
	text-indent:0px;
	margin-top: 5px;
	margin-bottom:0;
	}
	
.noindentnospace {
	text-indent:0px;
	margin:0;
	}
	
.noindentspacebelow {
	text-indent:0px;
	margin:0;
	padding-bottom:30px;
	}
	
	
.captionincopyright {
	font:65% Verdana, Arial, Helvetica, sans-serif;
	line-height:1.1em;
	margin:10px 0 0 150px;
	padding-bottom:30px;
	text-indent:0;
	text-align:right;
	}
	
#maintextproject p.biglettering {
	font-family:Georgia, Times, serif;
	font-size:1.8em;
	line-height:1.0em;
	font-weight:lighter;
	margin:5px 0 0 0;
	}
	
#maintextproject a{
	font-size:1.1em;
	color:#362728;
	}
	
	
	