@charset "UTF-8";
/* CSS Document */


@import url("navigation1.css");


/* 
     
	| 
	| Hullabloo Inbound
	|
	| Base
	|
*/



/* General
----------------------------------------------- */


* {
	margin: 0;
	}
	
html, body {
	height: 100%;
	}

body {
	background: #DAE0E2 url(../images/gen/main_bg.gif) repeat-x fixed;
	font-family: 'Lucida Grande', Arial, Helvetica, sans-serif;
	color: #6A818B;
	}
	
a {
	text-decoration: none;
	color: #000;
	}

.mainWrap {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -200px; /* the bottom margin is the negative value of the footer's height */
	width: 948px;
	}

.header {
	height: 131px;
	background: url(../images/gen/header_box.gif);
	color: #C1BCAB;
	}

.footer, .push {
	height: 200px; /* .push must be the same height as .footer */
	margin: 0 auto;
	}
	
.push {
	clear: both;
	}	

.footer {
	width: 948px;
	background: url(../images/gen/content_bottom.gif) no-repeat #F3F5F5 0 -14px;
	}
		


/* Main Layout
----------------------------------------------- */

#navBar {
	float: left;
	width: 707px;
	height: 44px;
	padding-top: 80px;
	}
	
.contactBar {
	float: left;
	height: 50px;
	width: 240px;
	}	


.contentWrap {
	background: url(../images/gen/content_top.gif) no-repeat;
	padding-top: 10px;
	clear: both;
	}

.footerCont {
	padding: 10px 9px 0 9px;
	}

h1.title {
	display:block;
	height: 1px;
	text-indent: -2000px;
	}
	
.topBox {
	width: 948px;
	background: url(../images/gen/top_box_top.gif) no-repeat;
	float: left;
	padding-top: 18px;
	}
	
.topBoxBottom {
	width: 948px;
	background: url(../images/home/home_top_box_bottom.gif) no-repeat;
	height: 11px;
	}
	
.topBox p {
	padding: 0 460px 0 9px;
	color: #FCEFE8;
	font-size: 13px;
	line-height: 16px;
	}	
	
.wc3 {
	float: right;
	}
	
.whiteBoxWrap {
	width: 948px;
	float: left;
	clear: both;
	background: url(../images/gen/white_box_top.gif) no-repeat;
	}

.whiteBoxBottom {
	width: 948px;
	height: 10px;
	clear: both;
	background:url(../images/gen/white_box_bottom.gif) no-repeat;
	}	
	
.twoColLeft {
	width: 460px;
	float: left;
	margin: 18px 0 0 9px;
	}
	
.twoColRight{
	width: 460px;
	float: left;
	margin: 18px 0 0 18px;
	}	
	
.greyBoxWrap {
	width: 948px;
	float: left;
	clear: both;
	background: url(../images/gen/grey_box_top.gif) no-repeat;
	}
	
.greyBoxWrapWhiteRule {
	width: 948px;
	float: left;
	clear: both;
	background: url(../images/gen/grey_box_top_white_rule.gif) no-repeat;
	}	

.greyBoxBottom {
	width: 948px;
	height: 10px;
	clear: both;
	background: url(../images/gen/grey_box_bottom.gif) no-repeat;
	}
	
#chooseANumberTop {
	background: url(../images/gen/top_box_phones.gif) no-repeat;
	}
	
#mobileClock {
	background: url(../images/top_images/mobile_and_clock.gif) no-repeat;
	} 
	
#worldMouse {
	background: url(../images/top_images/world-and_mouse.gif) no-repeat;
	} 	
	
#manPc {
	background: url(../images/top_images/man_and_pc.gif) no-repeat;
	}
	
#chairHouse {
	background: url(../images/top_images/chair_and_house.gif) no-repeat;
	}
	
#threePhones {
	background: url(../images/top_images/three_phones.gif) no-repeat;
	}		 
		
.whiteFourBoxesWrap {
	background:url(../images/gen/white_four_boxes_top.gif) no-repeat;
	float: left;
	width: 948px;
	clear: both;
	}

.whiteFourBoxesBottom{
	background:url(../images/gen/four_white_boxes_bottom.gif) no-repeat;
	width: 948px;
	height: 10px;
	clear: both;
	}	
	
.orderButton {
	height: 62px;
	width: 62px;
	background: url(../images/gen/order_button.gif) no-repeat;
	}	
	
.orderButton:hover {
	background: url(../images/gen/order_button.gif) no-repeat 0 -145px;
	cursor: pointer;
	}	
	
.orderButton a {
	display: block;
	height: 58px;
	width: 58px;
	}
	
.fourBoxesCol .orderButton, .fourBoxesColEnd .orderButton {
	float: right;
	}	
									
p.orderButt {
	display: block;
	text-indent: -2000px;
	}	
	
#callCentreGrey {
	background: url(../images/gen/call_centre_grey.gif) no-repeat 330px 0;
	}	
	
#callCentreGrey p {
	padding-right: 120px;
	}	
		
	
#officeTower {
	background:url(../images/gen/office_tower.gif) no-repeat 360px 0;
	}	
	
#officeTower p {
	padding-right: 120px;
	}		
	
#orderTopBox {
	background: url(../images/gen/order_top_box.gif) no-repeat;
	}
	
.formTitle {
	width: 948px;
	margin-top: 4px;
	background: #fff;
	padding-top: 20px;
	}	
	
.innerBoxesCol {
	width: 222px;
	float: left;
	}
	
.formBottom {
	background: #fff;
	height: 40px;
	clear: both;
	padding: 20px 10px 0 0;
	text-align: right;
	}
	
.sendButton {
	background: url(../images/gen/buton_bg.gif) no-repeat;
	width: 70px;
	height: 40px;
	border: 0px;
	color: #fff;
	text-indent: -2000px;
	cursor: pointer;
	}				
		
.sendButton:hover {
	background: url(../images/gen/buton_bg.gif) no-repeat 0 -61px;
	}		

.threeColleft {
	float: left;
	width: 227px;
	margin: 22px 0 0 9px;
	}
	
.threeColCentre {
	float: left;
	width: 451px;
	margin: 22px 0 0 12px;
	}	
	
.threeColRight {
	float: left;
	width: 227px;
	margin: 22px 0 0 12px;
	}	
		
.bespokeBox {
	background: url(../images/gen/bespoke_box_top.gif) no-repeat;
	padding-top: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
	}
	
.bespokeBoxBottom {
	background: url(../images/gen/bespoke_box_bottom.gif) no-repeat;
	height: 14px;
	width: 451px;
	}			

#tandc {
	padding-bottom: 60px;
}

/* Text and links
----------------------------------------------- */	


	
.contentWrap p {
	font-size: 13px;
	line-height: 17px;
	margin-bottom: 9px;
	}
	
.threeColCentre ul {
	font-size: 13px;
	line-height: 17px;
	margin-bottom: 9px;
	padding: 0 9px 0 24px;
	}
	
.threeColCentre li {
	margin-bottom: 9px;
	}	
	
.threeColCentre p {
	font-size: 13px;
	line-height: 17px;
	margin-bottom: 9px;
	padding: 0 9px 0 9px;
	}
	
.contactAddress p {
	font-size: 12px;
	line-height: 17px;
	margin-bottom: 9px;
	padding: 0 9px 0 9px;
	}	
	
.bespokeBox p {
	color: #fff;
	}

h2 {
	padding: 0 9px 18px 9px;
	font-weight: normal;
	font-size: 18px;
	}
	
h4 {
	padding: 0 9px 9px 9px;
	color: #fff;
	font-weight: normal;
	font-size: 22px;
	}				
	
.colContLeft p {
	padding-right: 20px;
	color: #000;
	}
	
.colContRight p {
	padding: 0 9px;
	}				
	
.centreBoxLeft p, .centreBoxMiddle p, .centreBoxRight p {
    color: #F0F2F4;
	color: #6A818B;
	padding-right: 100px;
	}
	
.bottomBoxRight p {
    padding: 0 8px;
	}
	
.footerCont p {
	font-size: 13px;
	}
	
.bottomBoxes  a {
	color: #6A818B;
	font-weight: bold;
	border-bottom: 1px solid #CDD5D8;
	}
	
.bottomBoxes  a:hover {
	color: #385764;
	}				

.footerCont a {
	color: #6A818B;
	}
	
.footerCont a:hover {
	color: #385764;
	}
	
h3 {
	font-size: 17px;
	font-weight: normal;
	color: #fff;
	margin-bottom: 8px;
	}	

ul.tick {
	margin-left: 12px;
	padding: 0;
	font-size: 13px;
	}
	
ul.tick	li {
	list-style: none;
	background:url(../images/gen/tick.gif) no-repeat 0 6px;
	padding: 0 9px 0 16px;
	color: #2C4D5A;
	}
	
ul.tick2 {
	border-top: 1px solid #768c94;
	border-bottom: 1px solid #768c94;
	margin: 12px 0 0 0;
	padding: 16px 0 16px 0;
	font-size: 15px;
	}
	
ul.tick2 li {
	list-style: none;
	background:url(../images/gen/tick2.gif) no-repeat 0 6px;
	padding: 0 0 0 16px;
	margin-bottom: 8px;
	color: #2C4D5A;
	}
	
ul.tick3 {
	margin: 0;
	padding: 0 9px 0 9px;
	font-size: 13px;
	}
	
ul.tick3 li {
	list-style: none;
	background:url(../images/gen/tick2.gif) no-repeat 0 6px;
	padding: 0 0 0 16px;
	margin-bottom: 8px;
	color: #2C4D5A;
	}
	
#homeBoxes p {
	padding-right: 100px;
	font-size: 13px;
	line-height: 17px;
	}
	
.greyBoxWrap p, .greyBoxWrapWhiteRule p {
	padding: 0 0 10px 0;
	font-size: 13px;
	line-height: 17px;
	color: #fff;
	}	

#hullabalooBg p {
	margin: 40px 110px 0 14px;
	}	
	
a.moreInfo {
	background: url(../images/gen/more_info_button.gif) no-repeat 0 3px;
	padding-left: 16px;
	color: #2C4D5A;
	}

a.moreInfo:hover {
	background: url(../images/gen/more_info_button.gif) no-repeat 0 -25px;
	color: #EC297B;
	}
	
a.moreInfoGrey {
	background: url(../images/home/more_info_button_grey.gif) no-repeat 0 3px;
	padding-left: 16px;
	color: #fff;
	}
	
a.moreInfoGrey:hover {
	background: url(../images/home/more_info_button_grey.gif) no-repeat 0 -25px;
	color: #d4ea41;
	}	
	
p.checkbox {
	padding-bottom: 10px;
	border-bottom: 1px solid #E6EAEB;
	}
		
.field {
	padding-bottom: 10px;
	}
	
#form p {
	font-size: 14px;
	margin-bottom: 12px;
	}	
	
.fieldWrap {
	float: left;
	width: 460px;
	}
	
.fieldLeft {
	float: left;
	width: 160px;
	}
	
.fieldRight {
	float: left;
	width: 290px;
	}	
					
input.field {
	width: 282px;
	height: 16px;
	border: 1px solid #6A818B;
	color: #6A818B;
	padding: 4px;
	font-size: 13px; 
	}	
	
.topBox a {
	color: #fff;
	}	
	
.topBox a:hover {
	color: #2d4e5b;
	}
	
#tandc a {
	color: #333;
	border-bottom: 1px solid #ccc;
}
	
#tandc a:hover {
	color: #385764;
}	
		 

/* Home page layout
----------------------------------------------- */

#headerHome {
	background: url(../images/home/header_image_home.gif) no-repeat;
	}

#homeTopBox {
	background: url(../images/home/home_top_box_top.gif) no-repeat;
	}
	
.fourBoxesWrap {
	width: 948px;
	background: url(../images/home/home_four_boxes_top.gif) no-repeat;
	float: left;
	}
	
.fourBoxesCol {
	width: 230px;
	float: left;
	margin: 18px 9px 0  0;
	}
	
.fourBoxesColEnd {
	width: 228px;
	float: left;
	margin: 18px 0 0  2px;
	}		
	
.fourBoxesWrap p, .whiteFourBoxesWrap p {
	padding: 0 9px;
	color: #2C4D5A;
	font-size: 13px;
	margin-bottom: 6px;
	}	
	
.fourBoxesBottom {
	width: 948px;
	height: 76px;
	clear: both;
	background: url(../images/home/home_four_boxes_bottom.gif) no-repeat;
	}
	
.option1Bottom {
	width: 230px;
	height: 76px;
	float: left;
	background: url(../images/home/option1_details.gif) no-repeat 8px 0;
	}
	
.option2Bottom {
	width: 230px;
	height: 76px;
	margin-left: 10px;
	float: left;
	background: url(../images/home/option2_details.gif) no-repeat 8px 0;
	}
	
.option3Bottom {
	width: 230px;
	height: 76px;
	float: left;
	margin-left: 10px;
	background: url(../images/home/option3_details.gif) no-repeat 8px 0;
	}
	
.option4Bottom {
	width: 228px;
	height: 76px;
	float: left;
	margin-left: 8px;
	background: url(../images/home/option4_details.gif) no-repeat 8px 0;
	}

.fourBoxesBottom a {
	display: block;
	height: 76px;
	width: 80px;
	margin-left: 150px;
	text-indent: -2000px;
	}				
		
.fourBoxesBottom a:hover {
	background: url(../images/home/option_details_hover.gif) no-repeat 10px 0;
	}					

#bespoke { /* Home page Bespoke info panel */
	background: url(../images/gen/call_centre.jpg) top right no-repeat;
	}
	
#chooseANumber {
	background: url(../images/gen/handset.jpg) top right no-repeat;
	}
	
#callSolutions {
    background: url(../images/home/running_man.gif) no-repeat 360px 0;
	}	
	
#callSolutions p {
    padding-right: 120px;
	}	
	
#hullabalooBg {
	background: url(../images/home/hullabaloo_bg.gif) no-repeat;
	height: 110px;
	}
	
.twoColRight p {
	padding-right: 20px;
	}
	

#offcomIcon {
	background: url(../images/home/0870_icon.gif) no-repeat top right;
	height: 130px;
	}
	
#offcomIcon h3 {
	padding-right: 250px;
	}		
		
	
#offcom a {
 	color: #fff;
	font-weight: bold;
	}	
	
#offcom a:hover {
 	color: #d4ea41;
	}		
	
/* Home page login */	


.login a {
	font-size: 13px;
	color: #fff;
	display: block;
	padding-left: 16px;
	background: url(../images/home/login_button.gif) no-repeat 0 3px;
	}
	
.login p a:hover {
	color: #fae3d5;
	background: url(../images/home/login_button.gif) no-repeat 0 -25px;
	}	

	
.login {
	padding-top: 26px;
	}	
	
.login p {
	font-weight: bold;
	color: #fae3d5;
	}		
	
	
.ie6Msg { 
	width: 948px;
	height: 60px;
	padding: 30px 0;	
	margin: 0 auto;
	color: #fff;
	}
	
.ie6Msg p { 
	font-weight: bold;
	}	