/*
Theme Name: Krome
Theme URI: http://www.cyanshiner.co.uk
Description: Krome theme by <a href="http://www.cyanshiner.co.uk">Cyan Shiner</a>.
Version: 1
Author: Matthew Slightam
Author URI: http://www.cyanshiner.co.uk


*/



/* Begin Typography & Colors */
body {
	font-size: 62.5%; /* Resets 1em to 10px */
	font-family: arial, Verdana, Sans-Serif;
	color: #333;
	background-color: #e2e2e2;
	margin: 0px;
	padding: 0px 0px 20px 0px;
	}
	
HR	{
	border-bottom: none;
	border-left: none;
	border-right: none;
	border-top: 1px dotted #999999;
	height: 1px;}	
	
p	{
	line-height: 130%;}
	
UL	{
	font-family: arial, Verdana, Sans-Serif;
	line-height: 130%;
	font-size: 12px;
	padding-left: 0px;
	margin-left: 0px}
	
LI	{
	background: url('images_new/brockhouse-bullet.png') no-repeat 0px 8px;
	padding-left: 10px;	
	padding-top: 4px;
	list-style-type: none;}	
	
	UL.pdf LI	{
		background: url('images_new/krome_PDF.png') no-repeat 0px 4px;
		padding-left: 20px;	
		padding-top: 6px;
		list-style-type: none;}	
	
#page {
	margin: 0px auto;
	padding: 0px 0px 0px 13px;	
	background: url('images_new/brockhouse_background.png') repeat-y center;
	width: 968px;
	text-align: left;
	background-color: #FFFFFF;
	}

#header {
	background: url('images_new/brockhouse_header_background.png') no-repeat center;
	height: 150px;
	width: 952px;
	margin: 0px;
	}
	
	#header-index	{
		position: absolute;
		width: 952px;
		z-index: 2000;}
		
		#logo {
			display: block;
			float: left;
			margin: 18px 0px 34px 9px;
			width: 228px;
			height: 65px;
			text-indent: -5000px;
			text-decoration: none;
			background: transparent url('images_new/brockhouse-logo.png') no-repeat 0 0;}
			
		.logo-youtube	{
			margin: 0px 8px -5px 8px;
			border: 0px;}
		
	#menu-strip	{
		clear: both;
		width: 100%;}
	
	#header_image	{
		height: 236px;
		background: url('images_new/brockhouse_banner_background.png');
		width: 947px;
		margin: 0px 0px 0px 3px;}
		
		#header_image_subpage	{
			height: 136px;
			background: url('images_new/brockhouse_banner_background_subpage.png');
			width: 947px;
			margin: 0px 0px 0px 2px;}		
			
		
			#tab_overview	{
				display: block;
				position: absolute;
				z-index: 5;
				margin: 20px 0px 0px 760px;
				width: 166px;
				height: 56px;
				border: none;}
				
			#tab_overview:hover	{		
				}
				
				#tab_overview_subpage	{
					display: block;
					position: absolute;
					z-index: 5;
					margin: 16px 0px 0px 765px;
					width: 166px;
					height: 46px;
					border: none;}
					
				#tab_overview_subpage:hover	{		
					background: url('images_new/brockhouse_banner_button_overview_subpage_hover.png');	
					cursor:pointer;
					cursor:hand;}
				
			#tab_demo	{
				display: block;
				position: absolute;
				z-index: 5;
				margin: 85px 0px 0px 760px;
				width: 166px;
				height: 56px;
				border: none;}
				
			#tab_demo:hover	{		
				}
			
			#tab_brochure	{
				display: block;
				position: absolute;
				z-index: 5;
				margin: 150px 0px 0px 760px;
				width: 166px;
				height: 56px;
				border: none;}
				
			#tab_brochure:hover	{		
				}
				
				#tab_brochure_subpage	{
					display: block;
					position: absolute;
					z-index: 5;
					margin: 69px 0px 0px 765px;
					width: 166px;
					height: 46px;
					border: none;}
				
				#tab_brochure_subpage:hover	{		
					background: url('images_new/brockhouse_banner_button_brochure_subpage_hover.png');	
					cursor:pointer;
					cursor:hand;}
			
			#area_landing	{
				width: 947px;
				height: 236px;
				position: absolute;}
				
				#area_landing_subpage	{
					width: 947px;
					height: 136px;
					position: absolute;}	
						
			#area_overview, #area_demo, #area_brochure	{
				width: 947px;
				height: 236px;
				position: absolute;
				margin-left: -3000px;}
				
				#area_overview{					
					background: url('images_new/brockhouse_banner_background_overview.png');
					}
					
				.area_overview_banner_corner	{
					width: 11px;
					height: 11px;
					background: url('images_new/brockhouse-banner-corner.gif');
					margin: 226px 0px 0px -1px;
					position: absolute;
					z-index: 100;}
					
				.area_overview_banner_corner_brochure	{
					width: 11px;
					height: 11px;
					background: url('images_new/brockhouse-banner-corner-brochure.gif');
					margin: 226px 0px 0px -1px;
					position: absolute;
					z-index: 100;}
					
				.area_overview_banner_corner_brochure_link	{
					display: block;
					width: 45px;
					height: 45px;
					background: url('images_new/brochure-menu.gif');
					margin: 180px 0px 0px 226px;
					position: absolute;
					z-index: 101;}
					
					.area_overview_video	{
						height: 230px;
						width: 277px;
						display: block;
						float: left;
						overflow: hidden;
						background-color:#737381;
						margin: 1px 0px 0px 5px;}
						
						.area_overview_brochure	{
							height: 230px;
							width: 277px;
							display: block;
							float: left;
							overflow: hidden;
							background-color:#737381;
							border-right: 1px solid #737381;
							margin: 1px 0px 0px 5px;}
						
					.area_overview_text	{
						height: 233px;
						width: 370px;
						display: block;
						margin-left: 40px;
						float: left;}
						
						.area_overview_text_brochure	{
							width: 190px;}
							
							li.brochure_arrow	{								
								background: url('images_new/brockhouse-brochure-arrow.gif') 0px 9px no-repeat;
								padding-left: 12px;
								font-size: 14px;
								list-style-image: none;
								font-weight: 900;
								padding-top: 6px;
								font-style: italic;}
						
					.area_overview_text_main	{
						width: 270px;
						margin-left: 440px;}
						
						.area_overview_text_subpage	{
							width: 450px;
							height: 136px;
							margin-left: 280px;}
						
						.area_overview_text	p{
							color: #b3071b;
							font-size: 14px;
							font-style: italic;
							font-weight: 900;
							padding-bottom: 8px;}
							
							.area_overview_text_main	p{
								font-size: 20px;
								padding-bottom: 8px;}
						
							.area_overview_text_subpage   p{
								font-size: 17px;}
						
						.banner_container { 
							height: 233px; 
							display: table; 
							border: 1px solid ##333333;}
							
							.banner_container_subpage { 
								height: 136px; }
						
						.banner_position { 
							display: table-cell; 
							vertical-align: middle; 
							width: 100%; 
							text-align: left;}
						
						.banner_position { 
							display: table-cell; 
							vertical-align: middle; 
							width: 100%; 
							text-align: left;}
			
				#area_demo	{					
					background: url('images_new/brockhouse_banner_background_demo.png');
					}
					
				#area_brochure	{					
					background: url('images_new/brockhouse_banner_background_brochure.png');
					}
					
	
	
	#product_area_top	{
		height: 37px;
		background: url('images_new/brockhouse_product_area_top.png');
		width: 947px;
		margin: 4px 0px 0px 3px;}
		
		#product_area_top_link	{
			display: block;
			float: left;
			width: 179px;
			height: 37px;
			padding: 0px 4px 0px 4px;
			cursor:pointer;}

	#product_area	{
		background: url('images_new/brockhouse_product_area_background.png') repeat-y left bottom;
		width: 947px;
		margin: 0px 0px 0px 3px;
		padding-left: 0px;}	

		.product_areas	{
			display: block;
			float: left;
			width: 179px;
			text-align: center;
			padding: 0px 5px 0px 5px;
			cursor:pointer;}
				
			.product_areas_extra_spacing	{
				margin-left: 1px;}
				
			.product_areas	img{
				border-bottom: 1px solid #464a54;}
				
			.product_areas	h2{
				color: #ffffff;
				font-size: 13px;
				background-color: #686b77;
				margin: 0px 0px 0px 0px;
				padding: 6px 0px 6px 0px;
				line-height: 140%;
				border-bottom: 1px dotted #464a54;}
				
				.product-area-glazed h2	{
					font-size: 12px;
					border-bottom: none;
					padding: 8px 10px 4px 10px;
					line-height: 100%;}
				
			.product_areas	p{
				color: #ffffff;
				font-size: 12px;
				margin: 0px 0px 0px 0px;
				padding: 6px 0px 6px 0px;
				line-height: 140%;}
	
	
	#product_area_bottom_links	{
		background: url('images_new/brockhouse_product_area_bottom_links.png') repeat-y left;
		width: 947px;
		height: 37px;
		margin: 0px 0px 0px 3px;
		padding-left: 0px;}	
		
		.product_areas_bottom_link	{
			display: block;
			float: left;
			width: 179px;
			height: 32px;
			margin: 0px 5px 0px 5px;}
			
			.product_areas_bottom_link_extra_spacing	{
				margin-left: 6px;}
			
		.product_areas_bottom_link:hover	{
			background: url('images_new/brockhouse_product_area_find_out_more_hover.png');}
			
	
	
	#details_area_top	{
		height: 37px;
		background: url('images_new/brockhouse_detail_area_top.png');
		width: 377px;
		padding-left: 570px;
		margin: 6px 0px 0px 3px;}
		
		#product_area_top_link	{
			display: block;
			float: left;
			width: 179px;
			height: 37px;
			padding: 0px 4px 0px 4px;
			cursor:pointer;}
	
	#details_area	{
		background: url('images_new/brockhouse_detail_area_background.png') repeat-y left bottom;
		width: 947px;
		margin: 0px 0px 0px 3px;
		padding-left: 0px;}	

		.details_areas	{
			display: block;
			float: left;
			width: 179px;
			text-align: center;
			padding: 0px 5px 0px 5px;}
			
			.details_area_about	{
				width: 368px;
				text-align: left;}
				
			.details_area_news	{				
				text-align: left;}
				
			.details_areas_extra_spacing	{
				margin-left: 1px;}
				
			.details_areas	img{
				border-bottom: 1px solid #464a54;}
				
			.details_areas	h1{
				color: #b3071b;
				font-size: 14px;
				margin: 5px 0px 0px 0px;
				padding: 6px 15px 6px 12px;
				line-height: 140%;}
			
			.details_areas	h3{
				color: #b3071b;
				font-size: 13px;
				margin: 5px 0px 0px 0px;
				padding: 6px 15px 0px 12px;
				line-height: 140%;}
				
			.details_areas	p{
				color: #4f525b;
				font-size: 12px;
				margin: 0px 0px 0px 0px;
				padding: 3px 15px 3px 12px;
				line-height: 140%;}
				
				.details_area_news	{
					padding-bottom: 10px;}
				
				.details_area_news	p{
					padding: 10px 10px 0px 12px;
					font-size: 11px;
					font-family: tahoma, Arial, Helvetica, sans-serif;
					font-weight: 900;}
				
				.details_area_news	p.date{
					padding: 2px 8px 0px 10px;
					font-size: 11px;
					font-weight: 400;}
				
			.details_areas	UL{
				padding: 0px 10px 0px 10px;
				margin-top: 0px;
				font-weight: 900;}
				
	.details_areas_case_study h3, .details_areas_featured h3	{
		padding: 6px 5px 0px 5px;}
		
	#details_area_bottom_links	{
		background: url('images_new/brockhouse_detail_area_bottom_links.png') repeat-y left;
		width: 947px;
		height: 37px;
		margin: 0px 0px 0px 3px;
		padding-left: 0px;}	
		
		.details_areas_bottom_link	{
			display: block;
			float: left;
			width: 179px;
			height: 32px;
			margin: 0px 6px 0px 5px;}
		
			.details_areas_bottom_link_about	{
				width: 368px;
				height: 32px;}			
			
			.details_areas_bottom_link_extra_spacing	{
				margin: 0px 0px 0px 4px;}
			
		.details_areas_bottom_link:hover	{
			background: url('images_new/brockhouse_details_area_find_out_more_hover.png');}
			
			.details_areas_bottom_link_about:hover	{
				background: url('images_new/brockhouse_details_area_find_out_more_about_hover.png');}
				
			.details_areas_bottom_link_news:hover	{
				background: url('images_new/brockhouse_details_area_find_out_more_news_hover.png');}			
			

	#main-area-top	{
		height: 15px;
		background: url('images_new/brockhouse_main_area_top.png');
		width: 947px;
		margin: 4px 0px 0px 4px;}

	#main-area	{
		background: url('images_new/brockhouse_main_area_middle.png') repeat-y;
		width: 947px;
		margin: 0px 0px 0px 4px;
		padding-left: 0px;}	
		
		#main-area-padding	{
			padding: 0px 20px 0px 20px;}
		
	#main-area-bottom	{
		background: url('images_new/brockhouse_main_area_bottom.png');
		width: 947px;
		height: 31px;
		margin: 0px 0px 0px 4px;
		padding-left: 0px;}	
		

#footer {
	background: url('images_new/brockhouse_footer_background.png') no-repeat left;
	border: none;
	width: 945px;
	margin: 6px 0px 0px -11px;
	padding: 0px 0px 0px 30px;
	clear: both;
	height: 121px;
	}
	
	.footer-left-container	{
		float: left;
		display: block;
		margin: 5px 20px 0px 0px;}
		
	.footer-right-container	{
		float: right;
		text-align: right;
		display: block;
		margin: 5px 30px 0px 0px;}
	
	#footer	p {
		color: #efe8e9;}
		
	#footer a  {
		color: #ffffff;}
		
	#footer a.web-site-link  {
		color: #f5eff0;}



/* End Typography & Colors */


	

	
a:link {color: #b3071b;}

a:visited {color: #b3071b;}

a:active {color: #b3071b;}

a:hover {color: #b3071b;}

a {text-decoration: none;}
	
	

.clear {
	clear: both;
}

/* End Structure */