/*this version uses absolute/relative positioning between the side columns and their respective faux column containers. */
/* se notes on min and max width above
/* the content is first in the markup followed by the two side columns*/
/* this "content-first" markup is good for accessability and search engine optimization */
body {font: 1.0em verdana, arial, sans-serif;  /* overal font and sizing */
	text-align:center; background-image:url(images/background.jpg); 
	background-repeat:repeat-x ; background-color:#68ABE0; margin-top:10px;
	}
* {margin:0; padding:0;} /* removes defaults of all elements */
div#mainwrap {min-width:760px; max-width:875px; /* sets the max and miin widths */
	margin-left:auto; margin-right:auto; /* centers the layout in SCBs */
	text-align:left; background-color:#FFFFFF; /* stops elements inheriting the body's text-center */
 border:1px solid #419E36}
div#header {height:200px; background-color:#57D348; background-image: url("images/header.jpg"); background-position:center; 
 text-align:center;} /* tempoarary placeholder styles for header */
div#contentarea { background-color:#FFF; /* ensures bg is white if faux graphic doesn't load */
	background:url(images/faux_left.gif) repeat-y top left; /* faux columns graphic left column */
	position:relative; /* set positioning context  for left sidebar div */
	}
div#contentarea2 {background-color:#FFF; /* ensures bg is white if faux graphic doesn't load */
	background:url(images/faux_right.gif) repeat-y top right; /* faux columns graphic right column */
	position:relative; /* set positioning context  for right sidebar div */
	}
div#column1 {width:115px; /* left col width */
	position: absolute; /* contextual positioning in contentarea container */
	top:0px; left:0px; /*positions col within contentarea container */
	background:transparent; /* left col bg color - (change color to see divs is position : ) */
	overflow:hidden; /* prevents overlarge elements breaking out of column */
	}

div#column2 {background-color:#FFF; 
	margin:0 170px 0 115px; /* left and right margins to make room for sidebars */
	}
div#column2 p {font-size:.8em; line-height:1.25em; margin:0 30px 1em ; }
div#column2 ul {font-size:.8em; line-height:1.25em; margin:0 30px 1em ; list-style-type:none; }
div#column2 img { border:1px solid #5D43C4; margin:0px 15px 0px 15px;}
div#column2 h2 { color:#419E36; margin:0px 15px 5px 15px;}
div#column2 h5 { color:#419E36; margin:5px 15px 5px 15px;}
div#column2 h6 { color:#419E36; margin:5px 15px 5px 15px;}
div#column2 span { font-size:.75em; line-height:1.3em; margin:5px 15px 1em 15px; display:block;}
div#column2 h6 img { border:0px;}
div#column2 #gallery img { margin-bottom:10px;}
div#column3 {width:170px; 
	position:absolute;  /* contextual positioning in contentarea container */
	top:0px; right:0px; /*positions col within contentarea container */
	background-color:#FFEA58; /* left col bg color - (change color to see divs is position : ) */
	overflow:hidden; /* prevents overlarge elements breaking out of column */
	}
div#column3 ul {margin: 20px 0 5px 0px;  list-style-type:none; font-size:1.1em;}
div#column3 ul li { margin:5px 5px 5px 10px}
div#column3 ul li a:link {color:#419E36; text-decoration:none; 
 }
div#column3 ul li a:visited { color:#419E36; text-decoration:none; }
div#column3 ul li a:hover { color:#57D348; text-decoration:none; 
border-bottom:1px dashed #419E36; }
div#column3 ul li a:focus { color:#57D348; text-decoration:none; border-bottom:1px dashed #419E36; 
}
div#column3 p {margin: 20px 5px 5px 15px; font-size:.8em; font-style:italic; color:#419E36} 
div#footer {background-color:#6DD960; text-align:center; padding-top:6px; font-size:.85em; color:#5D43C4;} /* temp footer styles */







/* here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
/* simply add the clearfix class to any containter that must enclose floated elements */
/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {
    content: ".";              /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;                  /* ensure the period is not visible */
    clear: both;               /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

.clearfix {display: inline-block;}   /* a fix for IE Mac */

/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* end of "no-extra-markup" clearing method */