body {
	font-family: "trebuchet ms", helvetica, arial, sans-serif;
	background-image:url(../images/paws_background.png);
	background-color: #ffc; 
	color: #6E1F02;
	margin: 1em 2em;
	}		
* {
	margin: 0;
	padding: 0;
	}
div#mainwrap {
	min-width:47em; 
	max-width:70em; /* sets the max and miin widths */
	margin-left:auto; 
	margin-right:auto; /* centers the layout in SCBs */
	text-align:left; /* stops elements inheriting the body's text-center */
	}
img {
	border:none;
	}
	
div#header {
	text-align:center;
	}
div#header img {
	margin: -1em 1em 1em 1em;
	border: none;
	}
div#contentarea { 
	background-color: tranparent;
	position:relative; /* set positioning context for left sidebar div */
	}
div#contentarea2 {
	background-color:tranparent;
	position:relative; /* set positioning context for right sidebar div */
	}
	
div#column1 {
	width:9em; /* left col width */
	position: absolute; /* contextual positioning in contentarea container */	
	top:0; left:10px; /*positions col within contentarea container */
	overflow:hidden; /* prevents overlarge elements breaking out of column */
	}
div#listmenu {
	padding: 1em 1em 1em 1em;
	background-color:#630; /* left col menu bg color*/
	}
div#column1 ul {	
	background-color:#C96;
	font-size: 0.9em;
	padding: 0.5em;
	}
div#listmenu li {
	font-variant: small-caps;
	list-style: none;
	margin: 1.75em 0.5em 1.75em 0.5em;
	}
div#listmenu a {
	font-weight: bold;
	text-decoration:none;	
	color:#4E0901;
	}
div#listmenu a:hover {
	color:#993D03;
	text-decoration: underline;
	}	
img#welsh {
	position: absolute;
	top: 0em;
	left: 0em;
	}	
	
div#column2 {
	background-color:transparent; 
	margin:0 11em 0 10em; /* left and right margins to make room for sidebars */
	min-height: 21em;
	}
div#column2 img {
	margin-left:1.5em;
	display: block;
		}
div#column2 p {
	font-size: 0.8em;
	margin: 0 1em 1em 1em;
	}
div.image_left {
	font-size: 0.6em;	
	float: left;
	margin: 1em 1em 1em 1em;
	}
div.image_right {	
	font-size: 0.6em;
	/*text-align: right;*/
	float: right;
	margin: 0.5em 1em 1em 0;
	}
span.caption_right {
	margin-left: 9em;
	}
span.caption_left {
	margin-left: 5em;
	}
div#column2 a {
	font-weight: bold;
	font-size: 1em;
	color:#4E0901;
	}
div#column2 a:hover {
	color:#993D03;
	text-decoration: underline;
	}
	
div#column3 {
	width:10em;
	position:absolute;  /* contextual positioning in contentarea container */
	top:-74px;
	right:-3px; /*positions col within contentarea container */
	background-color:transparent; /* left col bg color - (change color to see divs is position : ) */
	padding-right: 0.25em;
	overflow:hidden; /* prevents overlarge elements breaking out of column */
	}
div#column3 h4 {
	font-size: 0.9em;
	font-weight: bold;
	font-variant: small-caps;
	margin-top: 5.5em;
	}
div#column3 p {
	margin: 1em 0 1em 0;
	font-size: 0.7em;
	font-style: italic;
	}
div#column3 p.name {
	font-weight: bold;
	text-align: center;
	margin: -0.5em 0 2em 0;
	}
div#column3 p.copyright {
	font-size: 0.53em;
	text-align:right;
	}
img#weeks {
	position: absolute;
	top: 3.5em;
	right: 0em;
	}	

div#footer {
	background-color:transparent;
	font-size: 0.7em;
	text-align:center; 
	margin: 0 1em 1em	1em;
}
div#footer a {
	font-weight: bold;
	text-decoration:none;	
	color:#4E0901;
	}
div#footer a:hover {
	color:#993D03;
	text-decoration: underline;
	}
	
	/* 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 */