@import url(reset.css);
/*
   	URL    : www.functionfirst.co.uk
   	Date   : 4th March 2010
   	Author : Alan Jenkins
*/

	BODY {
		font-size: 10px;
		color: #5c5c5c;
		font-family: Helvetica, cArial, Tahoma, sans-serif;
		background: url(http://images.functionfirst.co.uk/bg.png) repeat-x #013032;
	}
	
	a { color: #228286; outline: 0 }
	
	a:hover { color: #156a6e; text-decoration: none}
	
	p { font-size: 1.1em; line-height: 1.6em; margin: 1em 0 }
	
	h1 { float: left; text-indent: -999em; background: url(http://images.functionfirst.co.uk/logo.jpg) no-repeat; height: 167px; width: 467px }
	
	h2 { font-size: 1.4em }
	
	h3 { font-size: 1.2em }
	

	/* layout */
	.container { width: 960px; margin: 0 auto }

	/* nav */
	#nav { float: right; margin: 60px 100px 0 0; font-size: 1.4em; overflow: auto }
	
	#nav li { float: left; display: block }
	
	#nav li a { display: block; padding: 1em; text-decoration: none; color: #fff  }
	
	
	
	/* content layout */
	#content-wrapper { background: #fff; overflow: auto; clear: both }
	
	#content { clear: both; min-height: 330px; height: auto !important; height: 330px; position: relative; overflow: hidden }
	
	#pages { position: absolute; width: 3000px; background: #fff; margin: 0 auto }
	
	.page { float: left; overflow: auto; width: 960px }
	
	.block { float: left; margin: 25px 30px 30px 0; width: 300px; min-height: 275px; height: auto !important; height: 275px }
	
	.last { margin-right: 0 }
	
	/* results lightbox */
	#result-wrapper { z-index: 99; position: absolute; height: 100%; width: 100%; z-index: 99; display: none; background: url(http://images.functionfirst.co.uk/hv.png) }
		
	#result { z-index: 101; height: 150px; width: 300px; position: absolute; left: 50%; top: 50%; margin-top: -80px; margin-left: -150px; background: #fff; padding: 30px }
	
	
	/* portfolio paging */
	#paging { clear: both; min-height: 29px; height: auto !important; height: 29px }

	#paging li { float: left; display: block; margin-right: 3px }

	#paging li a { display: block; padding: .5em 1em; font-size: 1.4em; color: #fff; background-color: #000 }

	#paging li a span { display: block; width: 0; position: absolute }
	
	#paging li a:hover { background-color: #051515 }
	
	#paging li.active a { background-color: #fff; color: #000 }
		#paging li.active a:hover { color: #000 }

	#paging a span { float: left; text-indent: -999em }
	
	
	/* portfolio */
	#portfolio img { margin: 1em 0 } 
	
	#content .view, .content .view { padding: 10px; display: block; float: right; background: #acacac; color: #fff }
	
	#content .view:hover, .content .view:hover  { background: #023234 }
	
	#portfolio .details { position: relative; width: 300px; height: 145px; overflow: hidden }
	
	#content dl , .content dl { font-size: .9em; position: absolute; width: 280px; bottom: -60px; background: url(http://images.functionfirst.co.uk/hv.png); padding: 10px}
	
	.content dl { position: static; background: none; }
	
	#content dt, .content dt { float: left; color: #43a1a5; width: 70px; text-align: right; margin-right: 20px }
	
	#content dd, .content dd { margin-left: 90px; color: #fff }
	
	.content dd { color: #121212 }



	
	/* skills n experience */
	#skills ul { margin-top: 10px; font-size: 1.1em; color: #013032; line-height: 2.2em; border-top: 1px solid #ccc }
	
	#skills li  { padding-left: 5px; border-bottom: 1px solid #ccc }
	
	#skills a { background: #acacac; margin: 0 auto; display: block; float: left; padding: 10px; color: #fff; }
	
	#skills a:hover { background: #023234 }
	
	li.rate1, li.rate2, li.rate3 { background: url(../images/rate.gif) no-repeat 95% 9px }

		li.rate2 { background-position: 95% -21px }

		li.rate3 { background-position: 95% -51px }
	
	/* contact */
	#contact ul { margin: 1em 0; font-size: 1.1em; line-height: 1.6em; list-style: circle; padding-left: 2em }
	
	#twitter_div ul { list-style: none; padding: 0 }
	
	#twitter_div span { display: block }
	

	
	/* print settings */
	@media print {
		h1 { text-indent: 0; float: none }
	
		#nav { display: none }
		
		#pages { width: 300px; border: 1px solid red; overflow: visible }
		
		#page  { float: none }
	}