/* CSS Document 

HBW

Contents
1.	Main
2	Colour
3. Type styles

*/


/* 1. Main
----------------------------------------------- */

	
body {
	font-family: 'PT Sans', Arial, sans-serif;}

a {
	text-decoration: none;
	color: #d7d9da;}
	
a:hover {
	color: #fff;}	
	
strong {
	font-weight: bold;}
	
em {
	font-style: italic;}		


/* 2. Colour
----------------------------------------------- */

body, .middlePanel p, footer p, footer a, .emailIcon a, .topPanelBottom h2  {
	color: #747c80;}  /* Mid grey */
	
.news .main h1 {
	border-top: 1px solid #747c80;
	border-bottom: 1px solid #747c80;} /* Mid grey */				
		
.col4 h2 a {
	border-bottom: 1px solid #747c80;} /* Mid grey */	
		
.topPanel, .main, .news h2 a:hover  {
	color: #fff;}	
	
.contactInfo p, .contactInfo p a, .contact .topPanelTop h1, .contact .topPanelTop h2,  .topPanelBottom p, .footerCont p a:hover, .emailIcon a:hover {
	color: #384349;} /* Dark gray */
	
.contact .topPanelTop h1, .contact .topPanelTop h2, .home .main a:hover {
	color: #fff;}
	
.projects .main h1, .projects .main .twoCol h2  {
	color: #e1eff9;} /* Pale blue */	
	
.projects .main .twoCol h2 {
	border-top: 1px solid #e1eff9; 
	border-bottom: 1px solid #e1eff9;} /* Pale blue */					
		
.main .fourCol p, .main .twoCol h1 {
	color: #d7d9da;} /* pale grey */
	
.news .main h1, .news .main h2 {
	color: #b0c9ce;} /* Pale torquoise */		
	
.topPanelBottom p	{
	color: #747c80;} /* Mid grey */
	
.services .main .twoCol p strong{	
	color: #2fb457} /* Green */
	
.about .cells h1 {
	color: #747c80;} /* Dark gray */
	
.about .cells.alt h1 {
	color: #384349;} /* Dark gray */
	
.home .main a {
	color: #c4c7c8;} /* Mid grey */	
	
.projects .main h1  {
	color: #68aee0;} /* Blue */	
	
.news .main h2 {
	color: #fff;}	
	

/* 3. Type styles
----------------------------------------------- */
				

/* p ----------------------------------------------- */

p {
	font-size: 15px;
	line-height: 22px;
	padding-top: 10px;}
	
.contactInfo p {
	font-size: 14px;
	line-height: 12px;
	background: url(http://www.hbw.co.uk/images/icons/phone.png) no-repeat 0 12px;
	font-weight: bold;
	padding-left: 30px;
	}
	
.contactInfo p a {
	padding-left: 30px;
	background: url(http://www.hbw.co.uk/images/icons/email.png) no-repeat 6px 3px;}	
	
.contactInfo p a:hover {
	padding-left: 30px;
	background: url(http://www.hbw.co.uk/images/icons/email.png) no-repeat -274px 3px;}	
	
.topPanelTop p {
	font-size: 14px;
	line-height: 20px;}	
	
.topPanelBottom p {
	font-size: 14px;
	line-height: 20px;}		
	
.main .fourCol p {
	font-weight: bold;
	font-size: 14px;
	line-height: 22px;}
	
.middlePanel p {
	font-size: 16px;
	line-height: 22px;
	padding: 10px 0 0 10px;}
	
.footerCont p {
	padding: 0 10px;
	font-size: 14px;
	line-height: 22px;}	
	
.telephoneIcon {
	background: url(http://www.hbw.co.uk/images/icons/phone.png) no-repeat 0 6px;
	padding: 0 0 0 38px;}	
	
.faxIcon {
	background: url(http://www.hbw.co.uk/images/icons/fax.png) no-repeat 0 0px;
	padding: 0 0 0 38px;}	
	
.emailIcon a {
	background: url(http://www.hbw.co.uk/images/icons/email.png) no-repeat 0 3px;
	padding: 0 0 0 38px;}	
		
.emailIcon a:hover {
	background: url(http://www.hbw.co.uk/images/icons/email.png) no-repeat -280px 3px;}	
	
.about .twoCol .cells p {
	font-size: 16px;
	line-height: 26px;
	display: block;
	width: 385px;
	float: left;
	padding-bottom: 8px;
	padding-top: 0;}
	
/* H1 ----------------------------------------------- */

h1 {
	font-size: 21px;
	line-height: 27px;}
	
.topPanel h1 {
	font-weight: bold;}
	
.main h1 {
	padding-top: 14px;}
	
.topPanel hgroup h1 {
	font-size: 18px;
	font-weight: normal;}
	
.home .topPanel h1 {
	padding-right: 140px;}			
	
.col1 h1, .col2 h1, .col3 h1, .cells h1 {
	font-size: 52px;
	line-height: 48px;
	display: block;
	width: 36px;
	height: 60px;
	float: left;
	font-weight: bold;
	padding-top: 0px;}
	
.col3 h1 {
	width: 67px;}	

.cells h1 {
	line-height: 56px;
	width: 74px;}
	
.quotes  h1 {
	width: 74px;}		
	
.col4 h1 {
	font-size: 17px;
	line-height: 22px;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 8px;
	padding-top: 0px;}
	
.fourCol.right	h1 {
	font-size: 18px;
	line-height: 18px;}
	
.news .main h1 {
	margin: 8px 0 14px 0;
	padding: 4px 0;
	font-size: 18px;}
	
.services .main .twoCol h1 {
	font-size: 24px;
	line-height: 28px;
	}

/* H2 ----------------------------------------------- */

	
.topPanel h2 {
	font-size: 18px;
	line-height: 24px;
	padding-right: 60px;}
	
.contact .topPanel h2 {
	padding-right: 0px;}	
	
.topPanel hgroup h2 {
	font-size: 20px;
	font-weight: bold;}
	
.topPanelBottom h2 {
	font-size: 16px;
	line-height: 24px;
	font-weight: normal;}		
	
.col1 h2, .col2 h2, .col3 h2 {
	font-size: 15px;
	line-height: 23px;
	display: block;
	width: 148px;
	float: left;
	text-transform: uppercase;
	letter-spacing: 1px;}
	
.quotes h2 {
	text-indent: -10px;}	
	
.quotes h2 strong{
	font-size: 18px;}	
	
.col4 h2 {
	font-size: 14px;
	line-height: 18px;
	padding-bottom: 5px;
	margin-bottom: 5px;}
	
.col4 h2 a {
	padding: 0 0 8px 24px;
	display: block;
	background: url(http://www.hbw.co.uk/images/icons/news.png) no-repeat;}
	
.col4 h2 a:hover {
	background: url(http://www.hbw.co.uk/images/icons/news.png) no-repeat -501px 0;}
	
.news h2 {
	font-size: 24px;
	margin-bottom: 8px;}	
	
.news .twoCol h2 {
	padding-left: 24px;
	background: url(http://www.hbw.co.uk/images/icons/news_2.png) no-repeat;}
	
.news h2 a {
	font-size: 14px;
	font-weight: bold;
	padding-left: 12px;
	background: url(http://www.hbw.co.uk/images/icons/arrow.png) no-repeat 0px 5px;}
	
.news h2 a:hover {
	background: url(http://www.hbw.co.uk/images/icons/arrow.png) no-repeat -500px 5px;}	
	
.projects .main .twoCol h2 {
	font-size: 14px;
	margin: 8px 0 24px 0;
	padding: 8px 0;
	line-height: 22px;}								

/* H3 ----------------------------------------------- */

.news .twoCol h3 {
	margin: 0px 0 34px 0;
	padding: 12px 0;}

.news .twoCol h3 a {
	padding: 0 12px;
	background: url(http://www.hbw.co.uk/images/icons/arrow.png) no-repeat 0px 5px;}		
		
.news .twoCol h3 a:hover {
	color: #fff;
	background: url(http://www.hbw.co.uk/images/icons/arrow.png) no-repeat -500px 5px;}
	
.col1 h3, .col2 h3, .col3 h3, .col4 h3 {
	font-size: 14px;
	line-height: 20px;
	display: block;
	clear: both;
	font-weight: normal;}			

/* Lists ----------------------------------------------- */	
	
.subMenu ul {
	}
		
.subMenu li {
	font-size: 14px;
	margin-top: 10px;
	line-height: 18px}
	
.subMenu li a {
	padding-left: 10px;
	display: block;
	background: url(http://www.hbw.co.uk/images/icons/arrow.png) no-repeat 0px 5px;
	font-weight: bold;}						
	
.subMenu li a:hover {
	background: url(http://www.hbw.co.uk/images/icons/arrow.png) no-repeat -500px 5px;}
	
.subMenu a.select {
	color: #fff;
	cursor: default;}	
	
.contact ol {
	list-style: decimal;
	margin-left: 22px;
	padding-top: 12px;}
	
.contact ol li {
	margin-bottom: 10px;
	font-size: 14px;
	line-height: 22px;}