/* CSS Document 

HBW

Contents
1.	Colour
2	General layout
	2a.	Top section
	2b.	Middle section
	2c.	Specific sections
3.	Backgrounds
4.	Montages
5.	Navigation

*/

/* 1. Colour
----------------------------------------------- */

body {
	background: #384349 url(http://www.hbw.co.uk/images/backgrounds/mid_textured.png);}
	
#map {
	border: 13px solid #d7d9da;} /*Pale gray*/ 
		
.fourCol.right, .mainCont .twoCol {
	border-left: 1px solid #747c80;} /*Mid gray*/
	
.services .topPanelBottom  .fourCol {
	border-left: 1px solid #2fb457;} /* Green */
	
.about .topPanelBottom  .fourCol {
	border-left: 1px solid #ac923c;} /* Brown */
			
.projects .topPanelBottom  .fourCol {
	border-left: 1px solid #68aee0;} /* Brown */	
	

/* 2. General layout
----------------------------------------------- */

html, body {
	height: 100%;}
	
.wrap {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -145px;}
	
footer, .push {
	height: 146px;
	clear: both;}
	
footer {
	display: block;
	background: url(http://www.hbw.co.uk/images/backgrounds/footer_bg.gif) repeat-x #fff;}
	
.footerCont {
	width: 960px;
	margin: 0 auto;
	padding-top: 20px;
	border-left: 1px solid #747c80;}	

.headerCont {
	height: 146px;
	background: #fff;}

header {
	height: 160px;
	width: 960px;
	margin: 0 auto;}
	
.menu {
	float: left;
	width: 480px;
	padding: 116px 0 0 0;
	height: 30px;}	

.contactInfo {
	float: left;
	width: 386px;
	height: 30px;
	padding: 106px 0 0  0;	
	}

.logo {
	text-align: right;
	float: left;
	width: 94px;
	padding-top: 17px;}
	
.oneCol {
	width: 699px;
	padding:10px 10px 20px 10px;
	float: left;}	
	
.twoCol {
	width: 459px;
	padding: 10px 10px 0 10px;
	float: left;
	border-left: 1px solid #fff;}
	
.threeCol {
	width: 370px;
	padding: 20px 10px 0 10px;
	float: left;}
	
.fourCol {
	width: 219px;
	margin: 0 0;
	padding: 0 10px;
	float: left;}	
	
.fourCol.right {
	width: 160px;
	padding: 0 0;}
	
.col1, .col2, .col3 {
	border-left: 1px #fff solid;
	float: left;}	
	
.col4 {
	border-left: 1px #fff solid;
	margin-bottom: 40px;
	float: left;}			
	
/* 2a. Top section styles
----------------------------------------------- */

.topPanel, .topPanelWrap {
	height: 292px;}
	
.topPanel {
	border-bottom: 1px #586569 solid;}	
	
.topPanelWrap.short, .topPanel.short {
	height: 162px;}	
	
.topPanelTop {
	height: 146px;
	width: 960px;
	margin: 0 auto;}	
	
.topPanelBottom {
	height: 146px;
	width: 960px;
	margin: 0 auto;}	
		
/* 2b. Middle section styles 
----------------------------------------------- */

.main {
	clear: both;
	width: 960px;
	margin: 0 auto;}
	
.mainCont {
	width: 960px;
	float: left;
	padding-bottom: 20px;}	
	
.mainCont .twoCol {
	padding: 10px 10px 0 10px;
	margin-bottom: 20px;
	border-left: 1px solid #747c80;}	
	
.mainCont .fourCol {
	margin-bottom: 20px;}	
	
.home .mainCont {
	width: 960px;
	float: left;}	
	
.main .fourCol, .main  .twoCol {
	padding-top: 18px;} 

.subMenu {
	border-left: 1px solid #747c80;}
	
		
/*  2c. Specific section styles 
----------------------------------------------- */

	
.projectImage img {
	margin: 43px 0 0 9px;
	border-top: 12px solid #fff;
	border-left: 12px solid #fff;
	border-right: 12px solid #fff;
	-moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3)}	
	
.projects .topPanelTop {
	height: 292px}
	
.projects .topPanelTop .twoCol {
	height: 282px;}
	
.twoCol.projectImage {
	border-left: 0px;}			
	
.aboutLinks.last {
	width: 219px;
	border-right: 0px;}			
		
.newsLinks {
	width: 219px;}	
	
#map {
	width: 457px;
	height: 287px;}
		
.cells {
	float: left;
	border-left: 0px;
	width: 459px;
	padding: 6px;}
	
.cellWrap {
	float: left;
	background: url(http://www.hbw.co.uk/images/backgrounds/cell_bg.png) repeat-y;}	
	
.alt {background:url(http://www.hbw.co.uk/images/backgrounds/cell-alt_bg.png);}	
	
			
/* 3. Backgrounds 
----------------------------------------------- */	
	
	
.home .topPanelWrap, .contact .topPanelWrap {
	background: url(http://www.hbw.co.uk/images/backgrounds/yellow_bg.gif) repeat-x #fff;}
	
.services .topPanelWrap {
	background: url(http://www.hbw.co.uk/images/backgrounds/green_bg.gif) repeat-x #fff;}
	
.projects .topPanelWrap {
	background: url(http://www.hbw.co.uk/images/backgrounds/blue_bg.gif) repeat-x #fff;}			
	
.about .topPanelWrap {
	background: url(http://www.hbw.co.uk/images/backgrounds/brown_bg.gif) repeat-x #fff;}
	
.news .topPanelWrap {
	background: url(http://www.hbw.co.uk/images/backgrounds/turquoise_bg.gif) repeat-x #fff;}	
	
/* 4. Montage 
----------------------------------------------- */	


.projects .topPanel1 {
	background: url(http://www.hbw.co.uk/images/gen/project-image_bg.png) no-repeat center bottom ;}
		
.home .topPanel {
	background: url(http://www.hbw.co.uk/images/montage/montage-home.png) no-repeat center bottom ;}

.about .topPanel {
	background: url(http://www.hbw.co.uk/images/montage/anjulita.png) no-repeat center 60px;}

.about.more .topPanel {
	background: url()}	
	
.news .topPanel {
	background: url(http://www.hbw.co.uk/images/montage/news.png) no-repeat center bottom ;}	
	
.contact .topPanel {
	background: url(http://www.hbw.co.uk/images/montage/contact.png) no-repeat center bottom ;}	
	
	
/* 5. Navigation
----------------------------------------------- */	
	
.menu ul {
	float: left;
	font-size: 14px;
	height: 30px;}
	
.menu li {
	float: left;
	display: block;
	height: 28px;}
	
.menu li a {
	display: block;
	height: 28px;
	padding: 0px 16px 0 10px;
	border-left: 1px solid #9ca1a4;
	text-transform: uppercase;
	color: #939598;}	
		
.menu li a:hover {
	color: #384349;
	border-left: 1px solid #384349;}	
	
.services a.selected {
	color: #2fb457;
	border-left: 1px solid #2fb457;}	
	
.about a.selected {
	color: #ac923c;
	border-left: 1px solid #ac923c;}	
	
.projects a.selected {
	color: #68aee0;
	border-left: 1px solid #68aee0;}		
		
.news a.selected {
	color: #68aee0;
	border-left: 1px solid #008ea5;}	
	
.contact a.selected {
	color: #f0bf08;
	border-left: 1px solid #f0bf08;}