/*
white #FFFFFF;
black #000000;
Indian Red2 #E55451 FROM http://www.computerhope.com/htmcolor.htm
Indian Red3	#C24641 FROM http://www.computerhope.com/htmcolor.htm
*/


* { /*this sets ALL margins/pads to zero, thus removing browser variations, then I can respecify them as needed ; maybe I should add border:0 too ? */
margin: 0;
padding: 0;
}

html, body {
border:0;
margin:0;
padding:0;
text-align:center; /*this aligns the SITE (even in dodgy browsers), then I need to text-align:left/justify the CONTENT */
background-color : white;
font-family : Verdana,Arial,Helvetica,Geneva,sans-serif;
font-size : 0.9em;
color : #000;
}

#container {
width: 940px;
margin: 0px auto; /*this centres the site in well behaved browsers*/
padding:0;
line-height: 120%; /*increases legibility - could be increased, in fact*/
}

#headerstrip {
padding: 15px 0px 10px 0px; /*top right bottom left*/ /* >10 at top cos menu strip is >10 at bottom */
background-color: #C24641;
color : white;
margin: 20px 0px 0px 0px; /*top right bottom left*/
text-align:center;
/*text-align:left;*/
}

#contents {
width: 940px;
margin: 20px 0px 0px 0px; /*top right bottom left*/
padding: 0;
clear: both;
text-align: left;
}


/*START OF SETTINGS FOR COLUMN WIDTH*/

/*for 800px site with 10 px padding and 504px wide folio the numbers are...
left 265, or 244 plus 10+10+1 in IE
main 525, or 504 plus 10+10+1 in IE with 504w folio */

/*for 940px site with 0px #leftcontent/#rightcontent padding + 10px central column + 590px wide folio...
left 339, or 338 plus 0+0+1 in IE
[central column is 10]
right 591, or 590 plus 0+0+1 in IE with 570w folio */

/*for 940px site with 0px #leftcontent/#rightcontent padding + 20px central column + 590px wide folio...
left 329, or 328 plus 0+0+1 in IE
[central column is 20]
right 591, or 590 plus 0+0+1 in IE with 570w folio */

/*IS THIS NONSENSE ACTUALLY NECESSARY WITH ZERO PADDING / BORDERS ? */

#leftcontent {
width: 328px; /*was 244*/
float: left;
}
				/*IE Simplified Box model Hack (SBMH)*/
				/*IE box model error leads to items being (pad*2+1)px too wide*/
				#leftcontent {
				\width: 329px;  /*was 265*/
				w\idth: 328px; /*was 244*/
				}
#rightcontent {
width: 590px; /*was 504*/
float: right;
}
				/*IE Simplified Box model Hack (SBMH)*/
				/*IE box model error leads to items being (pad*2+1)px too wide*/
				#rightcontent { 
				\width: 591px;  /*was 525*/
				w\idth: 590px; /*was 504*/
				}
/*END OF SETTINGS FOR COLUMN WIDTH*/





#rightcontent {
text-align:right; /*ensure RHS of image is flush with RHS of template*/
margin: 0px 0px 20px 0px; /*top right bottom left*/ /*TO ENSURE THAT THERE IS WHITE SPACE BELOW IMAGE*/
}


#menupanel {
padding: 15px 0px 0px 0px; /*top right bottom left*/
color : white;
}



#pageheading {
padding: 10px;
/*margin: 10px 0px 0px 0px;*/ /*top right bottom left*/
text-align:left;
color:white;
background-color: #C24641;
font-family:'Times New Roman',Times;font-size:1.3em;font-weight:bold;

	/*REVISED VERSION WITH BORDER RATHER THAN SOLID BG*/
	/*color:#C24641;
	background-color:white;
	border: 1px solid #C24641;*/
}

#bodytext {
padding: 10px;
/*margin: 10px 0px 0px 0px;*/ /*top right bottom left*/
/*text-align:justify;*/
background-color : white; /*apparently this will make faded-in text look better in IE*/
}



#imagecaption {
padding: 5px 10px 0px 10px; /*top right bottom left*/ /*TO ENSURE IT SITS NICELY BELOW BODY TEXT*/
/*text-align:justify;*/
color:#888;
margin: 0px 0px 20px 0px; /*top right bottom left*/ /*TO ENSURE THAT THERE IS WHITE SPACE BELOW IMAGE*/

	/*#######FAILED ATTEMPT TO STICK imagecaption TO BOTTOM OF leftcontent#######*/
	/*position:absolute;
	bottom:0px;*/
}


#leftcontent {
	/*#######FAILED ATTEMPT TO STICK imagecaption TO BOTTOM OF leftcontent#######*/
	/*position:relative;
	height:380px;
	background-color: blue;*/
}




#footerstrip {
background-color: #C24641;
color : white;
clear: both;
padding: 10px;
/*margin: 10px 0px 0px 0px;*/ /*top right bottom left*/ /*WHY DOES THIS FAIL IN FIREFOX ?????*/
text-align:center;
font-family:'Times New Roman',Times; font-size:1.2em; font-weight:bold;
}

#compliance {
color:#888;
background-color: white;
clear: both;
padding: 10px;
margin: 0px 0px 0px 0px; /*top right bottom left*/
text-align: right;
}


#timberpanels {
width:590px;
text-align:left;
}

#panelimage1, #panelimage2, #panelimage3 {
height: 78px;
}



#panelheading1, #panelheading2, #panelheading3 {
padding: 10px;
}


#panel2, #panel3 { /*add space between the 3 timber panels*/
margin-top:20px;
}



/*add yew bg to all strips*/
#headerstrip, #pageheading, #footerstrip, #panelheading1, #panelheading2, #panelheading3, #cssdropdown li.headlink ul li a {
background-image:url(images/texture2_yew_950w.jpg);
}



B {
color:#C24641;
}




/*===================================================================*/
/* DROPDOWN MENU STYLING [ http://designreviver.com/tutorials/jquery-css-example-dropdown-menu/ ]*/
/*===================================================================*/
#cssdropdown, #cssdropdown ul {list-style: none; z-index:10;}
#cssdropdown, #cssdropdown * {padding: 0; margin: 0;}
	/* main menu links */
#cssdropdown li.headlink {width: 185px; float: left; /*margin-left: -1px;*/}
#cssdropdown li.headlink a {display: block; padding: 	0px;}
	/* submenu (child menu) lists and links */
#cssdropdown li.headlink ul {display: none; text-align: left;} /*children hidden*/
#cssdropdown li.headlink:hover ul {display: block; position:absolute;}  /*children shown on hover*/
#cssdropdown li.headlink ul li a {padding: 10px; /*height: 17px;*/ width: 320px;}
#cssdropdown li.headlink ul li a:hover {}
	/* aesthetic styling */
/*#cssdropdown a {color: white;}
#cssdropdown ul li a:hover {text-decoration: none;}*/
#cssdropdown li.headlink {}
#cssdropdown li.headlink ul {/*padding-bottom: 10px;*/}
/*===================================================================*/
/* END DROPDOWN MENU STYLING */
/*===================================================================*/









/*===================================================================*/
/* HYPERLINK STYLING*/
/*===================================================================*/
A,A:link,A:active,A:visited {
/*color:black;*/
color:#C24641;
text-decoration:underline;
}
A:hover, A.overlink {
/*color:#C24641;*/
color:black;
text-decoration:underline;
}
/*===================================================================*/
#compliance A, #compliance A:link, #compliance A:active, #compliance A:visited {
color:#888;
}
#compliance A:hover, #compliance A.overlink {
color:black;
}
/*===================================================================*/
#menupanel A, #menupanel A:link, #menupanel A:active, #menupanel A:visited {
font-family:'Times New Roman',Times;font-size:1.3em;font-weight:bold;
color : white;
text-decoration: none;
line-height: 130%;
}
#menupanel A:hover, #menupanel A.overlink {
color : black;
text-decoration: none;
}
/*===================================================================*/
#panelheading1 A, #panelheading1 A:link, #panelheading1 A:active, #panelheading1 A:visited, 
#panelheading2 A, #panelheading2 A:link, #panelheading2 A:active, #panelheading2 A:visited, 
#panelheading3 A, #panelheading3 A:link, #panelheading3 A:active, #panelheading3 A:visited {
font-family:'Times New Roman',Times;font-size:1.3em;font-weight:bold;
color : white;
text-decoration: none;
}
#panelheading1 A:hover, #panelheading1 A.overlink, 
#panelheading2 A:hover, #panelheading2 A.overlink, 
#panelheading3 A:hover, #panelheading3 A.overlink {
color : black;
text-decoration: none;
}
/*===================================================================*/
#footerstrip A, #footerstrip A:link, #footerstrip A:active, #footerstrip A:visited {
color : white;
text-decoration: none;
}
#footerstrip A:hover, #footerstrip A.overlink {
color : black;
text-decoration: none;
}
/*===================================================================*/
/* END HYPERLINK STYLING*/
/*===================================================================*/