/*-- CONTENTS -------------------------------------------

	=1:		[CSS RESET]
	=2:		[COMMON]
	=3:		[SITE]

---------------------------------------------------------*/


/*------=1:	[CSS RESET] -----------------------------*/

html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
vertical-align:baseline;
font-size:100%;
outline:0;
padding:0;
margin:0;
border:0;
}
a{text-decoration:none;}
:focus{outline:0;}
body{background:white;line-height:1;color:black;font-size:10pt;}
ol, ul{list-style:none;}
/* tables still need cellspacing="0" in the markup */
table{border-collapse:collapse;border-spacing:0;}
caption, th, td{font-weight:normal;text-align:left;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q{quotes:"" "";}


/*------=2:	[COMMON] -----------------------------*/

.altText{position:absolute;left:-9999px;}
.seoText{text-indent: -9999px;}
.floatLeft{float:left;display:inline;}
.floatRight{float:right;}
.clearLeft{clear:left;}
.clearRight{clear:right;}
.clearBoth{clear:both;}

body, #backFooter {
	background: #349c01;
}

#pageBack {
	width: 100%;
}

	#whiteBack {
		background: #fff url('images/fade-back.jpg') 0 185px repeat-x;
		min-height: 760px;
	}
	
	.small #whiteBack {
		background: #fff url('images/fade-back.jpg') 0 185px repeat-x;
		min-height: 500px;
	}

	#backHeader {
		background: url('images/header-large-back.jpg') top center;
		position: absolute;
		width: 100%;
		height: 329px;
		top: 0;
		left: 0;
		z-index: 0;
	}

	#contentMain {
		position: relative;
		width: 100%;
		min-height: 400px;
		margin: 0 auto;
	}
	
		#contentHeader {
			background: url('images/header-small.jpg') no-repeat top center;
			position: relative;
			height: 185px;

			
		}
		
			#contentHeader h1 {
			text-indent: -9999px;
				
			
			}
		
			#navigation {
				background: url('images/links.png') 0 0 no-repeat;				
				width: 804px;
				height: 23px;				
				margin:148px auto 0 auto;
				}
			
				#navigation li {
					background: url('images/links.png') no-repeat;
					display: block;
					float: left;
					display: inline;
					height: 23px;
					margin-right: 14px;
					cursor: pointer;
				}
			
				#navigation li a {
					display: block;
					width: 100%;
					height: 100%;
					text-indent: -9999px;
				}
				
				#navigation li.home {
					background-position: 0 -0;
					width: 55px;
				}
				
				#navigation li.home:hover {
					background-position: 0 -23px;
				}
				
				#navigation li.getquote {
					background-position: -68px 0;
					width: 109px;
				}
				
				#navigation li.getquote:hover {
					background-position: -68px -23px;
				}
				
				#navigation li.learn {
					background-position: -192px 0;
					width: 227px;
				}
				
				#navigation li.learn:hover {
					background-position: -192px -23px;
				}
				
				#navigation li.guide {
					background-position: -433px 0;
					width: 118px;
				}
				
				#navigation li.guide:hover {
					background-position: -433px -23px;
				}
				
				#navigation li.about {
					background-position: -566px 0;
					width: 85px;
				}
				
				#navigation li.about:hover {
					background-position: -566px -23px;
				}
				
				#navigation li.blog {
					background-position: -663px 0;
					width: 40px;
				}
				
				#navigation li.blog:hover {
					background-position: -663px -23px;
				}
				
				#navigation li.suppliers {
					background-position: -717px 0;
					width: 86px;
					margin-right: 0;
				}
				
				#navigation li.suppliers:hover {
					background-position: -717px -23px;
				}
		
		
		.clear{
	clear: both;
}

.navigation a:link, .navigation a:visited, .navigation a:active{
	color: blue;
}

.navigation a:hover{
	text-decoration: underline;
	background-color: none;
}

#navigation2 {
	/*width: 960px;*/
	padding: 146px  0 0 0;
	width: 804px;
	margin:0 auto;
}

img.home-icon {
	border: 0;
	height: 10px;
}


			#headerText {
				position: absolute;
				top: 92px;
				left: 273px;
				width: 345px;
				height: 160px;
				font: normal 14px/18px Arial, Helvetica, sans-serif;
				color: #2b2e35;
				letter-spacing: -1px;
			}
		
				#headerText h2 {
					font: normal 21px/24px Arial, Helvetica, sans-serif;
				}
		
			#checkPostcode {
				background: url('images/sprite-sheet.jpg') -1px 0 no-repeat;
				position:absolute;
				width: 184px;
				height: 127px;
				top: 5px;
				left:73%;
			}
			
				.small #checkPostcode {
					background-position: -337px 0;
					top: 5px;
					left: 654px;
				}
			
				#checkPostcode .text {
					background: #fff;
					border: 0;
					position: absolute;
					top: 52px;
					left: 18px;
					width: 149px;
					height: 24px;
					font: normal 16px/20px Arial, Helvetica, sans-serif;
				} 
				
				#checkPostcode .submit {
					background: url('images/sprite-sheet.jpg') -186px 0 no-repeat;
					border: 0;
					position: absolute;
					top: 86px;
					left: 17px;
					width: 151px;
					height: 32px;
					cursor: pointer;
				}
				
				#checkPostcode .submit:hover {
					background-position: -186px -32px;
				}

	.small #backHeader {
		background: url('images/header-small.jpg') top center;
		height: 185px;
	}
	
		.small #contentHeader {
			background: url(null);
			height: 185px;
		}
		
	#largeGreenBoxes {
		padding: 38px 0 0 0;
		margin: 0 auto;
		width: 799px;
		height: 170px;
	}
		#largeGreenBoxes a {
			background: url('images/sprite-sheet.jpg') no-repeat;
			width: 251px;
			height: 170px;
			display: block;
			float: left;
			display: inline;
			cursor: pointer;
			text-indent: -9999px;
		}
	
		#largeGreenBoxes a.learn {
			background-position: 0px -127px;
			margin-right: 20px;
		}
	
		#largeGreenBoxes a.learn:hover {
			background-position: 0px -297px;
		}
	
		#largeGreenBoxes a.tellus {
			background-position: -251px -127px;
			margin-right: 20px;
		}
	
		#largeGreenBoxes a.tellus:hover {
			background-position: -251px -297px;
		}

		#largeGreenBoxes a.compare {
			background-position: -502px -127px;
		}

		#largeGreenBoxes a.compare:hover {
			background-position: -502px -297px;
		}
		
	#content
	{
	background: url('images/fade-box.png') no-repeat;
	width: 767px;
	margin: 20px auto;
	font: normal 14px/18px Arial, Helvetica, sans-serif;
	min-height: 305px;
	}	
		
	.fadeBox {
		background: url('images/fade-box.png') no-repeat;		
		width: 517px;
		min-height: 305px;
		float:left;
		padding: 30px 20px 30px 20px;
		font: normal 14px/18px Arial, Helvetica, sans-serif;
	}
	
		.fadeBox h1 {
			color:#168500;
			font: bold 21px/24px Arial, Helvetica, sans-serif;
			padding-bottom: 5px;
			}
	
		
		.fadeBox h2 {
			color: #408000;
			font: bold 21px/24px Arial, Helvetica, sans-serif;
			padding-bottom: 5px;
			
		}

		
		.fadeBox h2 a{
			color: #168500;
			font: bold 21px/24px Arial, Helvetica, sans-serif;
			padding-bottom: 5px;
			
		}
				
		.fadeBox p {
			padding: 10px 0 10px 0;
		}
		
		.fadeBox ul {
			list-style: none;
			list-style-position:inside;
			margin:10px 0 15px 0;
			padding:15;
		}

		
		.fadeBox ul li { 
			background-image: url('images/bullet.gif');
			background-repeat: no-repeat;
			background-position: 0 0.4em;
			margin-left:20px;
			padding: 6px 3px 6px 20px; 
		}
	

#backFooter {
	background: url('images/footer-back.jpg') top center;
	clear: both;
	width: 100%;
	height: 145px;
}
	
	#contentFooter {
		background: url('images/footer.jpg') #349c01;
		position: relative;
		width: 850px;
		margin: 0 auto;
		height: 40px;
		padding-top: 105px;
		font: normal 12px/16px Arial, Helvetica, sans-serif;
		text-align: center;
	}
	
#sidebar 
{
padding: 30px 0 30px 0px;
float:left;

width:200px;

}	
	
#sidebar h2 {
	margin: 5px 0 0;
	padding: 0;
	font-weight:normal;
	color: #168500;
	}
#sidebar ul ul
{
padding:5px 0 0 5px;

}

/*added*/

#sidebar ul ul li{
	background: url(images/bullet.gif) top left no-repeat;
	padding-left: 20px;
}

#commentform input {
	width: 170px;
	padding: 2px;
	margin: 5px 5px 1px 0;
	}

#commentform {
	margin: 5px 10px 0 0;
	}
#commentform textarea {
	width: 100%;
	padding: 2px;
	}
.commentlist {
	padding: 0;
	text-align: justify;
	margin:0;
	}

.commentlist li {
	margin: 15px 0 10px;
	padding: 5px 5px 10px 10px;
	list-style: none;

	}
.commentlist li ul li { 
	margin-right: -5px;
	margin-left: 10px;
}

.commentlist p {
	margin: 10px 5px 10px 0;
}			
	
/*------=3:	[SITE] -----------------------------*/