/* CSS Document */

/*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-family: trebuchet, verdana, sans-serif; 
	text-align:center;
	}
	
* {margin:0; padding:0;} /* removes defaults of all elements */

div#mainwrap {min-width:780px; 
	max-width:960px;
	margin-left:auto; 
	margin-right:auto;
	text-align: left; 
	background-color: #FFF;
	}
	
div#header {
	height:200px;
	background-color:#FFF;
	background-position: right;
	background-image: url(graphics/banner_bg.jpg);
	background-repeat: no-repeat;
}

div#header2 {
	height:141px;
	background-color:#FFF;
	background-position: right;
	background-image: url(graphics/banner2_bg.jpg);
	background-repeat: no-repeat;
}


div#navigation {height: 20px; background-color:#666666; text-align:left; padding: 5px 0 3px 37px; color: #FFF;}

div#navigation a {color: #FFF; text-decoration: none;}

div#navigation a:hover {color: #CCCCCC; text-decoration: none;}

div#contentarea { background-color:#FFF; /* ensures bg is white if faux graphic doesn't load */
	position:relative; /* set positioning context  for left sidebar div */
	}
	
div#contentarea2 {background-color:#FFF; /* ensures bg is white if faux graphic doesn't load */
	position:relative; /* set positioning context  for right sidebar div */
	}

div#column1 {
	background-color:#FFF; 
	margin:0 270px 20px 40px;
	}
	
div#column1left {
	width: 50%;
	float:left;
}

div#column1right {
	width: 50%;
	margin-top: -25px;
	float:left;
}

div#column1right p {
	padding-left: 10px;
}

div#imageposition {
	margin-left: 30px;
}
	
div#column1 p {margin: 10px 20px 0 0; text-align: left; font-size: 1em; color:#000000;}

div#column1 a {color: #cc0000; text-decoration: underline;}

div#column1 a:hover {color:#333333;}

div#column1 h1 {font-family: trebuchet, verdana, sans-serif; font-size: 1.3em; text-align: left; color: #000; margin: 20px 20px 5px 0px;}

div#column1 h2 {font-family: trebuchet, verdana, sans-serif; font-size: 1.1em; text-align: left; color: #000; margin: 0px 20px 5px 0px;} 

div#column1 img {
	margin-right: 20px;
	border: none;
	}
	
div#column2 {width:230px; 
	position:absolute;  /* contextual positioning in contentarea container */
	top:0px; right:10px; /*positions col within contentarea container */
	background-color:#ccc; /* right col bg color - (change color to see divs is position : ) */
	overflow:hidden; /* prevents overlarge elements breaking out of column */
	}
	
div#column2 p {margin: 20px 0px 0px 15px; text-align: left; font-size: 1em;}

div#column2 a {margin: 20px 10px 0 0px; text-align: left; color: #000; text-decoration: none;}

div#column2 a:hover {color: #cc0000;}

div#blackrule {background-color:#000; padding-top:6px;}

div#footer {font-size: .9em; color:#333333; padding-top: 10px; text-align: center; border-bottom: 1px solid #cc0000;}

div#footer a {color: #333333; text-decoration: underline;}

div#footer a:hover {color: #cc0000; text-decoration: underline;}

div#sitesource {
	font-size: .9em; color:#333333; padding: 10px 0 25px 45px; text-align: left;}

div#sitesource a {color: #333333; text-decoration: none;}

div#sitesource a:hover {color: #000000;}
	



/* 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 */