/*  START: CSS by Paul Cripps @ Nine Four - paul@ninefour.co.uk  */
/*	Fluid Grid idea from ALA: http://www.alistapart.com/articles/fluidgrids */

/* 
====== Default CSS Content ======

	0:	Reset
	1: 	Globals
	2: 	Typography
	3:	Navigation
	4: 	Layouts
	5:	Forms
	
============ */




/* 	====== 0: START: Re-set ====== */

	/* remove the inconsistent (among browsers) default ul,ol padding or margin  */
	h1, h2, h3, h4, h5, h6, pre, a, form, body, html, blockquote, fieldset, input{ margin:0; padding:0; border:0; outline:0}
	
	ul,ol{
		padding: 0 0.8em 0.8em 0.8em;
		margin: 0 0.8em 0.8em 0.8em;
	}
	
	li{
		padding: 0 0 0.4em 0;
		margin: 0;
	}
	
	/* whoever thought blue linked image borders were a good idea? */
	a img,:link img,:visited img, img{ border: none; }
	
	.cb{ clear: both; }
	
	
	
	
	
/* 	====== 1: START: Globals ====== */

body {
	background: #616161 url(/assets/images/bg.jpg) repeat-x;
	text-align: center;
	/* font-size 100% in most cases is 16px */
	font: normal 100% Helvetica, Arial, sans-serif;
	color: #FFFFFF;
	}
	
	a:link, a:visited, a:hover, a:active { color: #60CB03; }
	
	.cb{clear: both;}

	
	
	
/* 	====== 2: START: Typography ====== */

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	widows: 2;
	orphans: 2;
	color: #60CB03; 
	}
	
	h1{
		font-size: 30px;
		color: #60CB03;
		text-indent: -999444px;
		background: url(/assets/images/h1_simon_burgess.png) no-repeat 0 0;
		width:300px;
		height: 56px;
		margin: 0 6px;
		}	
		
		h1 span{					
			font-size: 12px;
			color: #999999;
			display: block;
			text-indent: -999444px
		}
		
		#header h1 a{
			background: #151C64 url(/assets/images/haslams_sprite.jpg) no-repeat 0 0;	
			text-indent: -99999999px;
		}
		
	h2{
		font-size: 12px;
		color: #60CB03;
		padding: 13px 0 0 0;		
	}
	
	h3{}
	
	h3{	
		font-size: 14px;
		color: #60CB03;
		padding: 13px 0 10px 0;
	}
	
	#column3 .twitter.recent h3	{
		padding: 0;
	}
	
	#column3 .twitter.recent h3 a{
		display: block;
		width: 50px;
		height: 40px;
		/*background:url(/assets/images/twitter.png) no-repeat 0 0;	*/
		text-indent: -99999999px;
		margin: 9px 5px 0 16px;	
		float: left;
	}	
	
	p{ 
		line-height: 1.46em;
		widows: 3;
		orphans: 3;
	}
	
	#column3 .twitter.recent p{
		font-size: 12px;
		line-height: 1.46em;
		padding: 20px 0 0 0;
	}
	#column3 .twitter.recent p.tweet{ 
		padding: 9px 9px 9px 34px; 
		margin: 0;
		position:absolute;
		top: 440px;
		width: 260px;
		height: 98px;
		/*background: url(/assets/images/twitter_bubble.png) no-repeat 0 0;*/
		color: #000000;
	}	
	/*#column3 .twitter.recent*/ 
	p.follow{ 
		padding: 0 0 0 0; 
		margin: 0 0 0 0; 
		font-size: 10px; 
		color:#CCCCCC; 
	}	
	p.follow.cb{padding: 12px 0 0 0; }
	
	
	
	#copy p, #copy li{
		font-size: 0.75em;
		line-height: 1.42em;		
	}	
	


/* 	====== 3: START: Navigation ====== */
	
	ul#main_links{
		font-size: 0.75em;/* 12 / 16 = 60em  */
		text-align: right;
		list-style:none;
		padding: 0;
		margin: 0;				
		}
		#main_links a:link, #main_links a:visited, #main_links a:hover, #main_links a:active { 
			color: #000000; 
			text-decoration: none; 
			/*text-transform: lowercase;*/
			display: block;
			padding: 0px 6px 2px 6px;
			margin: 0;
			/*text-shadow:0 1px 0 #FFF;*/
		}
		#main_links a:hover, #main_links a.selected{ 
			color: #FFFFFF; 
			background: url(/assets/images/rollover.png) no-repeat 4px 0;
		}
	

	ul#other_links{
		height: 60px;
		list-style:none;
		padding: 0;
		margin: 5px 0 0 0;	
		background: #000000 url(/assets/images/bg_links.jpg) 0 0 repeat-x;	
		}
		
		ul#other_links li{
			display: inline;
			padding: 0;
			margin: 0 0 0 0;
			float: left;
			}
			
			#other_links a:link, #other_links a:visited, #other_links a:hover, #other_links a:active { color: #FFFFFF; text-decoration: none; }
			#other_links a:hover{ color: #60CB03; }
			
			#other_links li.sugarsnap a{				
				display: block;
				width: 80px;
				height: 40px;
				margin: 6px 0 0 12px;
				padding: 0;
				background:url(/assets/images/icon_sugarsnap.jpg) no-repeat 0 0;	
				text-indent: -999444px;	
			}
						
			#other_links li.email a{
				display: block;
				width: 40px;
				height: 40px;
				margin: 8px 0 0 40px;
				padding: 0;
				background:url(/assets/images/icon_email.jpg) no-repeat 0 0;	
				text-indent: -999444px;		
			}	
					
			#other_links li.readmore a{	
				display: block;
				width: 40px;
				height: 40px;
				margin: 10px 0 0 60px;
				padding: 0;
				background:url(/assets/images/icon_pdf.jpg) no-repeat 0 0;	
				text-indent: -999444px;	
			}
			
			
			
			#tooltip{
				position: absolute;
				top: 508px;
				left: 50%;
				margin: 0 0 0 -154px;
				padding: 4px 0;
				width: 307px;
				text-align: center;
				font-size:12px;
				background-color: #333333;
				
			}
			
	
	
	
	
/* 	====== 4: START: Layouts ====== */

#wrapper {
	text-align: left;
	margin: 0 auto;	
	/*max-width: 60em; *//* 960 / 16 = 60  */
	width: 960px;
}


#header {

	}
	
	#statements{
		bottom: 0;
		padding: 0 2em 0 1.25em;
		margin: 3.5em 0 0 0;
		}
		#statements p{font-size: 14px;
		line-height: 19px;
		 }
		#statements p em{ font-style:normal;}
		#statements blockquote { width: 270px;}
	#statements blockquote p em {
		margin: 0 2px 0 2px; /* Add some space on either side of the quote */
	}
	#statements blockquote p span {
		font-size: 18px;
		font-weight: bold;
	}

#content {

	}
	
	#column1{
		width: 33.33%; /* 320 / 960 = 0.33333 */
		float: left;
		background:url(/assets/images/simon_burgess_1.jpg) top center  no-repeat;		
		min-height: 422px;
		height: 422px;
		padding: 218px 0 0 0;
	}
	#column2{
		width: 32%;
		margin: 0 0.6%;
		float: left;
		padding: 2em 0;
		min-height: 381px;
		height: 381px;				
		padding: 149px 0 0 0;
	}
	#column3{
		width: 33.33%;
		float: left; 
		background:url(/assets/images/simon_burgess_2.jpg) top right no-repeat;
		min-height: 635px;
		height: 635px;	
	}
	
	#column3 .twitter.recent{
		margin: 539px 0 0 0;
	}
	
	.twitter.feed .date {
		width:20%;
		margin: 0 3px 0 0;
		clear:left;
		float:left;	
	}
	.twitter.feed .tweet {
		width:72%;
		margin: 0 0 0 3px;
		float: left;	
	}
	.twitter.feed .inner{
		margin: 0 0 6px 0;
		padding: 0 0 3px 0;
		clear: both;
		overflow: auto;
	}
	/**/
	/* root element for scrollable */ 
	div.scrollable { 	 
		position:relative; 
		overflow:hidden; 
		height:290px;
	}	 
	/* root element for scrollable items */ 
	div.scrollable div.items { 
		position:absolute; 
		/*height: 290px;*/
	}
	#actions{
		margin: 14px 0 0 0;
		font-size: 12px;
		background-color: #616161;
	}
	.prevPage{
		float:left;
		cursor:pointer;
	}
	.nextPage{
		float:right;
		cursor:pointer;	
	}
	/**/
		
	#copy{
		height: 330px;
		padding: 0 6px;
		overflow: auto;
	}

		
		
#footer {

	}



/* 	====== 5: START: Forms ====== */