/* ========================================================================================
Altius: Main Layout 
Version:1.0
Author: Raphael Marsh
Email: raphael@on-brand.co.uk
Last Updated: 26 Marsh 2009
=========================================================================================== */

/* STANDARD FORMATTING 
=========================================================================================== */
* {
	margin: 0;
 	padding: 0;
}

body {
	font-family:Myriad, Arial, Helvetica, sans-serif;
	font-size:63.3%;
	margin:0;
	text-align:left;
	line-height:140%;                         
	background-position:top;
	background-repeat:repeat-x;
	background-color:#d3d3d3;
}


/* Generic 
=========================================================================================== */
h1 {
	font-family:"Helvetica", Arial, Helvetica, sans-serif;
	font-size: 2.4em;
	margin:0;
}
h2 {
	font-size: 2.0em;
	margin:0;
}
h3 {
	margin:0;
}
img {
  border:none;
}
p {
	color:#272727;
	font-size:110%;
	margin:0;
}
hr {
	border:0;
}
ul {
	list-style-type:none;
	margin:0;
	padding:0;
}
a:link {
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}
a:active {
	text-decoration:none;
}

/* Structure 
=========================================================================================== */
div#wrapper {
	width: 948px; 
	margin: auto; 
	text-align: left;

}
#header {
	height:300px; 
	z-index:50;
}
.clear {
	clear: both;
    text-indent: -9999px;
}	
		
#mainColumn {
	float:right; margin:30px 30px 20px 0; width:580px; background:#ffffff;
}
	#homepage #mainColumn {
		margin:22px 30px 20px 0;
}
#sideColumn {
	float:left;
	width:296px;
	margin:30px 0 20px 0px;
}
	#homepage #sideColumn {
		margin:22px 0 20px 22px;
}
#bios {
	float:left; margin:16px 0 0 20px; width:436px; background:#ffffff;
}
#biosPic {
	float:left; margin:12px 0 0 10px; width:132px; background:#ffffff;
}


/* Content 
=========================================================================================== */
#mainColumn h1 {
	font-size:300%; line-height:100%; font-weight:normal; color:#003263; margin-bottom:10px; display:block;
}
#mainColumn h2 {
	font-size:210%; line-height:100%; margin-bottom:10px; font-weight:normal;
	}
#mainColumn p {
	font-size:130%; line-height:160%;
}
#mainColumn p a.red {
	color:#d81f2a; text-decoration:underline;
}
	#mainColumn p a.red:hover {
		text-decoration:none;
	}			
	#mainColumn .twoCol {
		float:left; width:280px; margin-right:20px;
	}
		#mainColumn .twoCol.end {
			margin-right:00px;
		}

#mainColumn ul {
		font-size:130%;
		padding:15px 2px;
	}
	#mainColumn ul li {
		line-height:140%;
		padding-left:18px;
		padding-bottom:7px;
		background:url(../images/generic/bullet-arrow.gif) 0 3px no-repeat;
	}



	/*because bloody ie can't do hr elements with bg images */
	div.hr {
  		height: 1px; background:url(../images/generic/footer-overline.gif) top left repeat-x;
	}
		div.hr hr {
			display: none;
		}


/* News 
=========================================================================================== */
	#mainColumn p.date {
		font-size:120%;
		line-height:110%;
		padding-top:4px;
		font-weight:bold;
		color:#00234c;
	}
		#mainColumn h3 {
			font-size:160%;
			line-height:120%;
			margin-bottom:10px;
			font-weight:normal;
		}
			#mainColumn h3 a {
				color:#272727;
				text-decoration:none;
			}
				#mainColumn h3 a:hover {
					color:#d81f2a;
					text-decoration:underline;
				}
				
	#mainColumn .twoCol div {
		font-size:90%;
		line-height:90%;
		padding-bottom:10px;
	}
		#mainColumn a.more {
			float:right;
			color:#00234c;
			padding:0 10px 10px 0;
			font-size:140%;
			text-decoration:none;
		}
			#mainColumn a.more:hover {
				color:#d81f2a;
				text-decoration:underline;
			}



/*  Bios
=========================================================================================== */
#bios h1 {
	font-size:300%; line-height:100%; font-weight:normal; color:#003263; margin-bottom:10px; display:block;
}
#bios h2 {
	font-size:210%; line-height:100%; margin-bottom:10px; font-weight:normal;
	}
#bios p {
	font-size:130%; line-height:160%;
}
#bios p a.red {
	color:#d81f2a; text-decoration:underline;
}
	#bios p a.red:hover {
		text-decoration:none;
	}			
	#bios .twoCol {
		float:left; width:280px; margin-right:20px;
	}
		#bios .twoCol.end {
			margin-right:00px;
		}

#bios ul {
		font-size:130%;
		padding:15px 2px;
	}
	#bios ul li {
		line-height:140%;
		padding-left:18px;
		padding-bottom:7px;
		background:url(../images/generic/bullet-arrow.gif) 0 3px no-repeat;
	}


	
	
	
/*  Graphical Button
=========================================================================================== */
.button {
	font-size:13px;
	float:left; width: 274px; position: relative; height: 49px; overflow:hidden; margin-right:14px; margin-bottom:8px;
}
	/*just makes them stack nicer on DW screen*/
	.button.end {
		margin-right:0;
	}
	.button p {
		text-indent:13px;
		letter-spacing:-1px;
	}
		.button p a {
			color:#292929;
		}
		.button p a:hover {
			color:#ffffff !important;
		}
			.button p a span {
				display:block;
				margin-top:10px;
			}
	.button a {
		text-decoration:none;
		background: url(../images/generic/button.gif) 0 0; left: 0px; bottom:0; width: 274px; position: absolute; height: 49px !important; 
	}
		.button a:hover {
			background-position: 0px -49px;
		}

/*  Side Panel
=========================================================================================== */
.sidePanel-outer {
	width:276px;
	background:url(../images/generic/sidePanel-outer.gif) bottom no-repeat;
}
.sidePanel-inner {
	padding:20px;
	background:url(../images/generic/sidePanel-inner.gif) top no-repeat;
}
	.sidePanel-inner h2 {
		font-size:180%;
		font-weight:normal;
	}
	.sidePanel-inner ul {
		font-size:120%;
		padding-top:12px;
	}
		.sidePanel-inner ul li {
			line-height:140%;
			padding-left:18px;
			padding-bottom:7px;
			background:url(../images/generic/bullet-arrow.gif) 0 2px no-repeat;
		}

.sidePanel-client {
	width:276px;
	margin-bottom:10px;
	height:37px;
	background:url(../images/generic/sidePanel-client.gif) top left no-repeat;
}
	.sidePanel-client label {
		float:left; position:relative; font-size:130%; display:block; padding-right:7px; margin-top:5px;
	}
	.sidePanel-client input {
		width:150px; height:19px; border:1px #8d8e86 solid; font-size:130%; padding:2px 0 0 2px;
	}
.sidePanel-client-holder {
	width:250px;
	padding:7px 0 9px 14px;
}





/* Image Control 
=========================================================================================== */
#homepage #header {
	background:url(../images/headers/header-homepage.jpg) top left no-repeat;
}
#about #sideColumn {
	height:450px; background:url(../images/headers/header-about.jpg) top left no-repeat;
}
#team #sideColumn {
	height:450px; background:url(../images/headers/header-team.jpg) top left no-repeat;
}
#news #sideColumn {
	height:450px; background:url(../images/headers/header-news.jpg) top left no-repeat;
}
#contact #sideColumn {
	height:450px; background:url(../images/headers/header-contact.jpg) top left no-repeat;
}



/* Flash Replacement - These are standard sIFR styles... do not modify 
=========================================================================================== */	
.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}
.sIFR-replaced {
	visibility: visible !important;
}
span.sIFR-alternate {
	position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden;
}
/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}
.sIFR-hasFlash h1 {
	visibility: hidden;	
	font-size: 400% !important;
}
.sIFR-hasFlash h2 {
	visibility: hidden;
	font-size: 320% !important;
}

/* Footer
=========================================================================================== */
#footer { 
	position:relative;
	clear: both;
	height:89px;
	padding: 5px 40px;
	background:url(../images/generic/footer-bg.png) top no-repeat;
} 
#footer p {
	color:#272727;
	font-size:110%;
}
#footer p.language {
	float:right;
	margin:5px 2px 0 0;
}
	#footer p.language a {
		font-size:110%;
		color:#272727;
		text-decoration:none;
	}
		#footer p.language a:hover, #footer p.language a.active {
			text-decoration:underline;
		}
	#footer p.copyright {
		float:left; position:absolute; left:40px; bottom:40px;
	}
		#footer p.copyright a {
			color:#272727;
			text-decoration:none;
		}
			#footer p.copyright a:hover {
				text-decoration:underline;
			}
	#footer p.phone {
		float:right;
		position:absolute;
		right:42px;
		bottom:40px;
	}