html {
     min-height: 100%;
     margin-bottom: 1px;
}
	
#wrap, #wrapblank{
	background-position: top center;
	background-color: #ffffff;
}

.blank { background: transparent none; }
#header{ 
	margin: 0 auto; 
	width: 940px; 
}

#home #header{
	margin-top: -10px;
}

#article #header h1{

	float: right;
	height: 43px;
	margin: 20px 0 30px 0;
	text-indent: -9999px;
	width: 200px;
}

#home #header h1{

	float: right;
	height: 43px;
	margin: 20px 0 30px 0;
	text-indent: -9999px;
	width: 200px;
}


		#header h1 a:link,
		#header h1 a:visited{ 
			display: block;
			height: 43px; 
		}
#navigation{
	float: left;
	height: 27px;
	margin: 27px 0 0;
	width: 410px;
}

	#navigation li{ 
		float: left; 
		list-style: none; 
		text-indent: -9999px;
	}
	
		#navigation li a:link,
		#navigation li a:visited{ 
			display: block; 
			height: 27px; 
		}
#masthead{
	background: transparent;
	margin: 0px auto 0;
	width: 980px;
}

	#masthead-inner{
		background: transparent;
		height: 300px;
		position: relative;
	}
	
	#article #masthead-inner{
		height: 56px;
	}
	
	#masthead h2{
		color: #AAAE44;
		height: 27px;
		font-size: 40px;
		letter-spacing: -3px;
		text-indent: -13000em;
	}
	
		#masthead p.tagline{
			color: #000000;
			font-family: "Arial", "Century Gothic" Sans-Serif;
			font-size: 18px;
			font-weight: normal;
			text-align: center;
			padding: 5px 0 20px 0px;
		}
		
#project-slider-wrap{
	height: 250px;
	overflow: hidden;
	margin: 0 auto;
	position: relative;
	width: 975px;
	z-index: 2;
}

#project-slider{
	height: 187px;
	list-style: none;
	margin: 0 auto;
	overflow: hidden;
	position: absolute;
	top: 5px;
	width: 978px;
	z-index: 0;
}

		#project-slider li img{
			left: 29px;
			position: absolute;
			top: 11px;
		}
		
		#project-slider li .panel{
			background: #0a0b07;
			top: 0px;
			height: 26px;
			left: 61px;
			overflow: hidden;
			position: absolute;
			width: 192px;
			z-index: 15;
		}
		
		#project-slider li .panel h2{
			font-size: 0;
			text-indent: -13000em;
		}
		#project-slider li .panel h2.client a {
			
		}
		#project-slider li .panel h2.client a:hover,
		#project-slider li .panel h2.client a:active{ background-position: 0 -26px; }
		
		#project-slider li .panel h2.inhouse a {
			
		}
		#project-slider li .panel h2.inhouse a:hover,
		#project-slider li .panel h2.inhouse a:active{ background-position: 0 -26px; }
		
		#project-slider li .panel h2.inhouse a.act {
			background-position: 0 -52px;
		}
		#project-slider li .panel h2.client a.act {
			background-position: 0 -52px;
		}
	
		#project-slider li .panel p{ 
			color: #ffffff;
			font-size: 10px;
			line-height: 18px;
			margin: 10px 20px 15px;
			text-align: center;
			
		}
		

#masthead a:hover#back,
#masthead a:active#back,
#masthead a:hover#next,
#masthead a:active#next{ background-position: 0 -65px; z-index: 7; }

#home #wrap, #home #wrapblank{ padding-bottom: 40px; }
#home #wrapblank{ margin-top: 20px; }

#content-wrap{
	margin: 0 auto; 
	width: 940px;
	padding: 0 10px;
}
	#home #content-wrap, #article #content-wrap{
		margin: 0 auto; 
		padding: 0 10px;
		width: 960px;
	}
	
.feat-article{
	margin-left: 10px;
	float: left; 
	width: 580px; 
}

.feat-article div.feat-article-content p { display: block; }

	.blog-header img.author-small{ 
		border: 1px solid #D0CDB5; 
		float: left; 
		margin: 0 10px 0 0;
		padding: 2px;
	}
		
	.blog-header h2{ 
		color: #363517; 
		font: bold 18px/20px 'Arial','Helvetica',sans-serif;
		margin: 2px 0 1px; 
		padding: 2px 0 0;
	}
	
		.blog-header h2 a:link,
		.blog-header h2 a:visited{ color: #363832; }
		
		.blog-header h2 a:hover,
		.blog-header h2 a:active{ color: #B66611; }
			
	.blog-header .date{ 
		color: #000000; 
		font: bold 32px/28px "Trebuchet MS", "Arial", Sans-Serif;
		height: 114px;
		left: -3px;
		padding: 15px 0 0 5px;
		position: absolute;
		text-align: center;
		top: -5px;
		width: 56px;
	}
		
		.blog-header .date span{
			color: #333333;
			display: block;
			font: 10px "Times New Roman", "Georgia", Serif;
			letter-spacing: .4em;
			padding: 3px 0 0 8px;
			text-align: center;
			text-transform: uppercase;
		}
			
	.feat-article p{ 
		color: #363211;
		font-size: 11px;
		line-height: 20px;
		margin: 0 0 10px 0;
		padding: 0 0 0 60px;
	}
	
		.feat-article p a:link,
		.feat-article p a:visited{ 
			border-bottom: 1px dashed #A4A833; 
			color: #B66611; 
			padding: 1px 0; 
			text-decoration: none;
		}
		
		.feat-article p a:hover{ 
			border-bottom: 1px solid #A5956A; 
			color: #633B10; 
		}
			
		.feat-article .blog-header p{ 
			color: #999999;	
			font: italic 10px "Georgia", "Times New Roman", Serif; 
			margin: 0;
			padding: 0;
		}
		
			.feat-article .blog-header p a:link,
			.feat-article .blog-header p a:visited{ 
				border: 0;
				color: #FF9933;
				font: 11px "Tahoma", "Trebuchet MS", "Arial", Sans-Serif;
				letter-spacing: .2em;
				margin: 0 3px; 
				padding: 3px 0;
				text-decoration: none;
				text-transform: uppercase; 
			}
				
				.feat-article .blog-header p a:link.blog-cat,
				.feat-article .blog-header p a:visited.blog-cat{ color: #666666; }
				
			.feat-article .blog-header p a:hover,
			.feat-article .blog-header p a:active,
			.feat-article .blog-header p a:hover.blog-cat,
			.feat-article .blog-header p a:active.blog-cat{ color: #B66611; }
		
		.feat-article p.cont-reading{
			margin: 0 0 0 56px;
			padding: 0;
			text-indent: -13000em;
			width: 193px;
			display: none;
		}
			
			.feat-article p.cont-reading a:hover,
			.feat-article p.cont-reading a:active{ background-position: 0 -35px; }
			#recent-blogs{ 
				float: right;
				padding: 0 0 0 20px; 
				width: 340px; 
			}	
		#recent-blogs li{ 
			background-position: 5px 8px;
			background-repeat: no-repeat;
			border-bottom: 1px dashed #999999;
			padding: 8px 10px 8px 40px;
			width: 290px; 
		}
		
		#recent-blogs li.general{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/general.jpg); }
		#recent-blogs li.design{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/design.jpg); }
		#recent-blogs li.development{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/development.jpg); }
		#recent-blogs li.event{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/event.jpg); }
		#recent-blogs li.stats{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/stats.jpg); }
		#recent-blogs li.clan-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/clan-trix.jpg); }
		#recent-blogs li.club-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/club-trix.jpg); }
		#recent-blogs li.howz-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/howz-trix.jpg); }
		#recent-blogs li.site-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/site-trix.jpg); }
		#recent-blogs li.shop-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/shop-trix.jpg); }
		#recent-blogs li.kidi-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/kidi-trix.jpg); }
		#recent-blogs li.skin-trix{ background-image: url(http://www.howz-trix.co.uk/css/images/icons/skin-trix.jpg); }
		
		#article #recent-blogs, #article #recent-blogs ul { width: 220px; }
		#article #recent-blogs li{ width: 170px; }
		
			#recent-blogs li span{ 
				color: #666666; 
				font-size: 10px; 
			}
		
			#recent-blogs li h2{
				font: bold 13px/20px 'Arial','Helvetica',sans-serif;
				line-height: 16px; 
			}
		
				#recent-blogs li h2 a:link,
				#recent-blogs li h2 a:visited{ 
					color: #363517; 
					text-decoration: none; 
				}
		
				#recent-blogs li h2 a:hover{ color: #B66611; }

#footer, #learnmore{
	margin: -15px auto 0;
	padding: 51px 0 35px;
	width: 940px;
}

	#learnmore { text-align: center; padding: 30px 0 5px; }
	
	

	#footer-wrap p{ 
		color: #3A3522; 
		font-size: 11px;
		line-height: 18px; 
		margin: 10px 0; 
	}

		#home #footer-wrap p, #article #footer-wrap p { color: #adaca1; }


		#footer-wrap p a:hover,
		#footer-wrap p a:active{ 
			border: none;
		}

#foot-left,
#foot-center,
#foot-right{ 
	float: left; 
	width: 260px;
}
#foot-center img.foot-center { float: left; margin-right: 10px; }
	#foot-center,
	#foot-right{ margin-left: 20px; }

		#foot-center{ width: 380px; }
		#foot-center legend{ 
			font-size: 0; 
			line-height: 0; 
		}

	


#copyright img { display: inline; margin-right: 5px; border: 0;}


		#footer-wrap #copyright p{ 
			color: #999999; 
			padding: 20px 0; 
			margin: 0;
		}

		#footer-wrap #copyright p a#howz { color: #CCCC00; }
		#footer-wrap #copyright p a#club { color: #9900CC; }
		#footer-wrap #copyright p a#shop { color: #009900; }
		#footer-wrap #copyright p a#site { color: #990000; }
		#footer-wrap #copyright p a#kidi { color: #CC00CC; }
		#footer-wrap #copyright p a#clan{ color: #006699; }
		#footer-wrap #copyright p a#skin { color: #CC6633; }
		
		#footer-wrap #copyright p a.img_link { border: 0; }
		#footer-wrap #copyright p a:hover { border: 0; background-color: #000000; }

#article  #wrap{
	background-image: none;
	padding-top: 20px; 
	padding-bottom: 40px;
}

div.project_details { float: right; width: 290px; padding-left: 10px;  }
div.project_screens { float: left; width: 640px; height: 433px; background: #ffffff url('http://www.howz-trix.co.uk/css/images/project_screen_bg.gif') no-repeat top center; }
div.project_screens img { margin: 20px 20px 10px 20px; }
ul.screen_links { list-style: none; margin: 0; float: right; margin-right: 10px; }
ul.screen_links li { display: block; float: left; width: 30px; height: 27px; text-align: center; line-height: 27px; margin-right: 10px; }
ul.screen_links li a { color: #000000; display: block; float: left; width: 30px; height: 27px; border: 1px solid #333333; text-align: center; line-height: 27px; background-color: #999999; }
ul.screen_links li a:hover { color: #666666; }
ul.screen_links li a.current { color: #333333; }

.project_details{
	float: left;
	margin-left: 20px;
	width: 280px;
}

	.project_details h2{ 
		color: #000000; 
		font: bold 28px/32px "Tahoma", "Arial", "Trebuchet MS", Sans-Serif; 
		margin: 5px 0 10px 0; 
	}
	
	.project_details h3{ 
		color: #c1701a; 
		font: normal 15px/22px "Tahoma", "Tahoma", "Arial", Sans-Serif; 
		margin: 9px 0 7px 0; 
	}
	
	.project_details p{ 
		color: #333333; 
		font: 11px/20px "Verdana", "Tahoma", "Arial", Sans-Serif; 
		margin: 0 0 16px 0; 
	}
	
		.project_details p span{
			color: #3366CC; 
			font-size: 12px; 
		}
		.project_details p span a{
			color: #B66611; 
			font-size: 12px; 
		}
		.project_details p span a:hover{
			color: #999999; 
		}

	div.project_details div#recent-blogs{ 
				float: left;
				padding: 0 0 0 0px; 
				width: 290px; 
			}
	div.project_details #recent-blogs ul { width: 290px; background: none; border-top: 1px dashed #999999; }
	div.project_details div#recent-blogs li{ 
			background-position: 5px 8px;
			background-repeat: no-repeat;
			border-bottom: 1px dashed #999999;
			padding: 8px 10px 8px 40px;
			width: 240px; 
		}
	div.project_details div#recent-blogs li h2{ 
		margin: 0 0 0 0; 
	}
	
	div.work_pages { float: left; background-color: #ffffff; padding-bottom: 10px; width: 940px; height: 360px; background-image:url('http://www.howz-trix.co.uk/css/images/work_bg.gif'); background-repeat: no-repeat; }
	div.work_pages div { display: block; padding: 10px; float: left; }	
	div.work_pages div p.project { margin: 12px 10px 10px 10px; float: left; background-image:url('http://www.howz-trix.co.uk/css/images/project_sml_bg.jpg'); background-repeat: no-repeat; width: 210px; height: 130px; background-position: top left; }
	div.work_pages div p.project img{ margin-top: 3px; margin-left: 3px; }
		
	ul.work_links { list-style: none; margin: 0; float: right; margin-right: 18px; }
ul.work_links li { display: block; float: left; width: 30px; height: 27px; text-align: center; line-height: 27px; margin-right: 10px; }
ul.work_links li a { color: #000000; display: block; float: left; width: 30px; height: 27px; border: 1px solid #333333; text-align: center; line-height: 27px; background-color: #999999; }
ul.work_links li a:hover { color: #666666; }
ul.work_links li a.current { color: #333333; }
div#services, div#me, div#tools { padding: 0 20px 0 20px; }
div#tools { text-align: center; }
div#services img, div#me img, div#tools img{ float: left; margin: 0 20px 10px 0;  }

.blog-header{ 
	background: #ECECEC url('http://www.howz-trix.co.uk/css/images/double_line.jpg') repeat-x 0 0;
	border-bottom: 1px solid #999999;
	margin: 0 0 11px;
	padding: 11px 10px 9px 60px;
	position: relative;
}

	#recent-blogs ul{
		background: url('http://www.howz-trix.co.uk/css/images/double_line.jpg') repeat-x 0 0;
		list-style: none;
		margin: 0 0 0 0;
		padding: 3px 0 0;
		width: 340px;
	}
	
	#project-slider li{ 
		background: transparent url('http://www.howz-trix.co.uk/css/images/project_panel_frame.png') no-repeat;
		float: left;
		height: 187px;
		position: relative;
		margin-left: 0px;
		width: 326px; 
	}	
	p.block { display: block; width: 192px; float: left; margin-top: 5px;  }
	
	/* SERVICES
----------------------------------------------------------------------------- */
		.half{
			display: block;
			float: left;
			width: 460px;
		}

			.service-image{
				float: left;
				padding: 10px 9px 0 0;
				width: 161px;
			}
			
			div#notebook { background-image: url('../images/notebook.png'); background-repeat: no-repeat; height: 128px; }
			div#box { background-image: url('../images/box.png'); background-repeat: no-repeat; height: 162px;}
			div#tower { background-image: url('../images/tower.png'); background-repeat: no-repeat; height: 140px;}
			div#world { background-image: url('../images/world.png'); background-repeat: no-repeat; height: 140px;}

				.service-image img{ float: right; }

				.half h3{
					font: bold 15px/15px "Trebuchet MS", "Arial", Sans-Serif;
					border-bottom: 1px dashed #aaae44;
					color: #006699;
					padding: 20px 0 5px 0;
					text-transform: uppercase;
					width: 290px;
					float: left;
				}

				.half p{
					display: block;
					width: 290px;
					float: left;
					line-height: 20px;
					margin-top: 5px;
				}

		.right{ padding-left: 15px; }

/* US / PEEPS
----------------------------------------------------------------------------- */