/*
 * The major structure and look of the template is defined here.
 * Copyright Ben Ritter 2009
 */
 

/********************************* Defaults ********************************************/

html{
	border:0 none;
	min-width:900px;
	padding:0;
	margin:0;
}
body{
	font-family: verdana, arial, sans-serif;
	font-size:12px;
	color:#531C3A;
	padding:0;
	min-width:950px;
	margin:0;
}
div{
	border:0 none;
	margin:0;
	padding:0;
}

table{
	border: 0 none;
	border-spacing: 0px;
	border-collapse: collapse;
}
td{
	border: 0 none;
	border-spacing: 0px;
	border-collapse: collapse;
}

img{
	border:0;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
/******** End Defaults ***********/
 
html, body { height:100% } 
body {	background:#FFF url(/img/body_bg.png) top left no-repeat scroll }

/********************************* Major Structure *****************************************/
#wrapper{ /* around entire site to control width and footer positioning*/
	min-height:100%;
	position:relative;
}
#prop{ /* Props the wrapper to at least 950px */
	width:950px;
	height:1px;
	overflow:hidden;
}
	
/* Header positioning */
#header{
	width:100%;
	height:120px;
}
#headerlogo{
	border:0 none;
	margin:12px 0 0 20px;
}


/* Column layout */
#colmask {
	position:relative;	/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:both;
	float:left;
	width:100%;
	padding-bottom:98px; /* height of footer */
	overflow:hidden;		/* This chops off any overhanging divs */
	/* Left column background colour here*/
}
#colmid {
	float:left;
	width:200%;
	position:relative;
	left:200px; /* left col width */
	/* Centre column background colour here */
}
#colright {
	float:left;
	width:100%;
	position:relative;
	left:50%;
	margin-left:-490px; /* width of both sidebars */
	/* Right column background colour */
}
#col1wrap {
	float:right;
	width:50%;
	position:relative;
	right:100%;
}
#contentpad {
	margin:0 10px 0 500px; /* last number is width of both sidebars + content-left-padding */
	overflow:hidden;
}
#contentpad2col { /* for no sidebar */
	margin:0 -250px 0 500px; /* second number is right padding - width of rightbar */
	overflow:hidden;
}
#content {
	width:100%;
	overflow:hidden;
	min-height:600px; /* clearfix doesn't seem to work. This is a dodgey fix for floats in content.*/
	position: relative;
}
#leftbar {
	float:left;
	width:170px;
	position:relative;
	margin-left:-50%;
	left:290px;   /* rightbar width + leftbar-left-padding */
	overflow:hidden;
}
#rightbar {
	float:left;
	width:250px; /*width of rightbar - left and right padding */
	position:relative;
	left:10px;
	overflow:hidden;
}

/* Remove top margin from first element in content */
#content > *:first-child { margin-top:0; }


/* Nav links positioning */
ul.nav{
	list-style:none;
	font-size:14px;
	font-weight:bold;
}

#header ul.nav{
	position:absolute;
	top:40px;
	left:280px;
	margin:0;
	padding:0;
}
#header ul.nav li{
	display:inline;
	margin:0 20px 0 0;
}

#breadcrumbs{
	position:absolute;
	top:80px;
	left:280px;
}
a.crumb { margin-right:20px }
.crumb-sep { margin-right:20px }


#leftbar ul.nav{
	margin:0 0 0 20px;;
	padding:0;
}
#leftbar ul.nav li{
	margin:0 0 20px 0;
}


/* Nav links Looks */
ul.nav a:link,
ul.nav a:visited,
ul.nav a:active{
	color:#534d4d;
	text-decoration:none;
}
ul.nav a:hover {color:#951717}

#leftbar ul.nav a:link,
#leftbar ul.nav a:visited,
#leftbar ul.nav a:active,
#leftbar ul.nav a:hover
{font-style:italic}

a.crumb:link,
a.crumb:visited,
a.crumb:active,
a.crumb:hover	{
	color:#666666;
	text-decoration:underline;
}

a.this:link,
a.this:visited,
a.this:active,
a.this:hover	{
	color:#531C3A !important;
	text-decoration:underline !important;
}

/* Footer positioning and look*/
#wrapper {padding-bottom:0}
#footer{
	/* Positioning: */
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	clear:both;
	/* look: */
	padding:10px 0;
	color:#333333;
	text-align:center;
	clear:both;
}
#footer p { margin:0 }
#footer img { margin-bottom:10px }
#footer a:link,
#footer a:visited,
#footer a:hover {
	color:black;
	text-decoration: underline;
}

#rightbar{
	border-left:3px solid #531C3A;
}


/* Making h1 images cover text that they follow */
h1{
	height: 66px;
	position: relative;
	padding: 0;
}
	h1 img{position: absolute}