/* CSS Document */
* { margin: 0; padding: 0; outline: none;}

body { text-align:center; font-family:Tahoma, Geneva, sans-serif; font-size: 62.5%;
	   color:#444; background: #fff;}

img {max-width: 100%; height: auto!important;}
	   
/* colours */	   
.darkgrey { color:#444!important;}
.lightgrey { color:#666!important;}
.green { color: #008c00!important;}
.orange { color: #f60!important;}
.white { color: #faf9fa!important;}

.hidden { display:none;}

.center { text-align:center!important;}

.greenbg  { background: #00aa00 url(../images/grad_green.jpg) 0 -2px repeat-x; color: #fff;}
.orangebg { background: #d0392e url(../images/grad_orange.jpg) 0 -2px repeat-x; color: #fff;}
.blackbg  { background: #000 url(../images/grad_black.jpg) 0 0 repeat-x; color: #fff;}
.greybg  { background: url(../images/grad_grey.jpg) 0 -2px repeat-x; color: #444;}
.whitebg  { background: #fff;}
.porangebg { background: #f26522; color: #fff;}

.wash_tube { background:url(../images/wash_tube_s1.jpg) right no-repeat; min-height: 155px; padding-right: 100px!important; width: 192px;}
.wash_cog { background: url(../images/wash_cogs_s1.jpg) right no-repeat; min-height: 155px; padding-right: 116px!important; width: 174px;}

.outer { margin: 0px auto 20px;  }
.frame { margin: auto; width: 1002px; background:url(../images/page_bg.png) repeat-y;}
#main { text-align:left; margin-top: 10px; }
#navigation {  position: relative; background: url(../images/navbar_bg.png) repeat-x; height: 69px; margin: auto 20px;}
.navbar-start { background:url(../images/navbar_l.png); width: 22px; height: 69px; float: left;}
.navbar-end { background:#e8e8e8 url(../images/navbar_r.png); width: 22px; height: 69px; float: right;}

#header { position:relative; text-align: center; }
#logo { margin: auto;}
#slogan { position:absolute; right: 20px; top: 20px;}
.footer { text-align:left; color:#333; margin-top: 20px;}
.banner_tabbed { margin-top: 15px;}

/* composite styles */
.col { float: left;}
.w25 { width: 25%;}
.w33 { width: 33%;}
.w50 { width: 50%;}
.w66 { width: 62%;}
.w75 { width: 75%!important;}
.w100 { width: 95%;}
.h250 { height:320px;}
.h400 { height:380px;}
.h150 { height:255px;}
.h200 { height:130px; clear: both;}

.p15 { padding-left: 15px!important;}

#copy_side { text-align:right;}
#copy_side img { padding: 3px; border: 2px solid #eee;}

.normal { font-weight: normal;}

a { text-decoration: underline; color:#333;}
a:hover { text-decoration: underline; color: #13445B;}

.guttered 		{ margin-left: 20px!important; margin-right: 20px!important;}
.gutter_left 	{ margin-left: 20px!important; }
.gutter_right 	{ margin-right: 20px!important;}
.mini_gutter 		{ margin-left: 10px!important; margin-right: 10px!important;}

.divided { border-left: 1px solid #666; }

.clear { clear: both;}

.floatleft 	{ float: left;}
.floatright { float: right;}
.anchor { position: absolute; left:0; bottom:10px;}

.nomargin { margin: 0!important;}

.absolute { position: absolute;}
.relative { position: relative;}

.rounded_corners {
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	behavior: url(border-radius.htc);
}

.boxed {	-moz-border-radius: 5px;
			-webkit-border-radius: 5px;			
			border: 1px solid #ccc;}

.panel		{ margin: 10px auto 20px; padding: 0 0 10px 0;}			

.panel h1 { background:url(../images/grad_grey.jpg) repeat-x; line-height:30px; color:#444; padding: 0 15px; font-size: 1.3em; margin: 2px 0;}

.panel h2 { line-height:20px; color:#444; padding: 5px 15px; font-size: 1.2em;}

.panel h3 { line-height:20px; color:#444; padding: 10px 15px 5px; font-size: 1.3em; font-weight: normal;}

.panel p { padding: 0 15px; font-size: 1.0em;}

a.btn {  padding: 0 15px; line-height: 25px; margin: 10px auto 5px; 
		text-decoration: none; font-weight: bold;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
		-webkit-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px; 
		-moz-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px;
}

a:hover.btn { color:#fff;}

.anchored { position: absolute; bottom: 10px;}

h3.address  { font-size: 1.0em;}
h3.email  { font-size: 1.0em;}
h3.phone  { font-size: 1.0em;}

.inset		  { position:absolute; top: 105px; left: 20px;}
.tabbed_inset { position:absolute; bottom: 10px; left: 0px;}
.typical_rate { color:#999; font-size: 1.5em; font-weight: normal;}
.shout 		  { font-weight:bold; font-size: 1.4em; color:#444;}

a.btn.squeeze { padding: 0 8px!important;}

/* List styles */
ul 			 { list-style:none; }
ul.bullet li { padding: 5px 5px 5px 20px; }
ul.bullet li { padding-left: 30px;}


ul.indent li a { text-decoration: underline; color: #444; display:block; line-height: 25px; padding-left: 30px;}
ul.indent li a:hover { text-decoration: none; color: #E49D03;}
ul.indent li {
    margin: 10px 020px;
    padding: 0 0 0 15px;
    font-size: 1.4em;
}

ul.dots 	 { list-style: outside disc;}
ul.dots li 	 { margin-left: 35px; padding-left: 0; padding-top:2px!important; padding-bottom:2px!important;}
ul.arrows li { background: url(../images/bullet_arrow_orange_s1.jpg) no-repeat 0 2px; }
ul.lined li:last-child { border-bottom: none;}
ul.lined li { border-bottom: 1px solid #ccc;}

ul.indent li {
    margin: 10px 020px;
    padding: 0 0 0 15px;
    font-size: 1.4em;
}

ol 			 { list-style:none;list-style: outside; }
ol li	{ color: d0392e;} 
ol li 	 { margin-left: 35px; padding-left: 0; width: auto!important;}

ul.lined li a { text-decoration: none; color: #444; display:block; line-height: 25px; padding-left: 30px; }
ul.lined li a:hover { text-decoration: none; color: #008c00;}
ul.lined li a:hover { background:url(../images/grad_grey.jpg) repeat-x;}
ul.lined ul li { margin-left: 15px;}

ul.inner_tabs { margin: 0 15px; font-size:1.4em;}
ul.inner_tabs li { float: left; position: relative; line-height: 27px; top:0px; left:0; margin: auto; background:url(../images/navbar_divide.gif) right no-repeat; padding: 20px 5px 20px 0;}
ul.inner_tabs li:last-child {  background:none; padding: 20px 0px 20px 0;}
ul.inner_tabs li a { display: block; margin: 0 23px; padding: 0px; text-decoration:none; color:#666; font-weight: normal;  border-bottom: 2px solid #F2F2F2; }
ul.inner_tabs li a:hover, ul.inner_tabs li a.on { color:#335435; border-bottom: 2px solid #335435; }

ul.outer_tabs { margin: 0 5px;}
ul.outer_tabs li { float: left; line-height: 23px; top:0px; margin: 5px 2px 0;}
ul.outer_tabs li a { display: block; padding: 1px 10px; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; text-decoration:none; color:#444; font-weight: normal;}
ul.outer_tabs li a		 { background:#ccc;}
ul.outer_tabs.absolute { position: absolute; right: 15px; top: -30px; }
ul.outer_tabs li a.customers.on , ul.outer_tabs li a.customers:hover  { background: #00aa00 url(../images/grad_green.jpg) 0 -2px repeat-x; color: #fff;}
ul.outer_tabs li a.introducers.on, ul.outer_tabs li a.introducers:hover { background: #d0392e url(../images/grad_orange.jpg) 0 -2px repeat-x; color: #fff;}

ul.utility { margin: 0 15px;}
ul.utility li { float: left; position: relative; line-height: 23px; top:0px; left:0; margin: 5px;}
ul.utility li a { display: block; padding: 1px 1px;  text-decoration:none; color:#444; font-weight: normal;}
ul.utility li a:hover { color: #008c00;}
ul.utility.green li a:hover, ul.utility.green li a.on  { color: #008c00!important;}
ul.utility.orange li a:hover, ul.utility.orange li a.on { color: #f60!important;}

ul.light li a{ font-weight: normal!important;}

/* form styles */

ul.mini-form {margin: 10px 15px 5px;}
ul.mini-form li { margin: 5px auto;}
ul.mini-form select { width: 176px; background-position:0 -10px; color:#666;}
ul.mini-form input  { width: 176px; padding: 2px; background-position:0 -10px; color:#666;}

/* boxes */

.panel p { padding: 5px 15px; font-size: 1.0em;}
.boxes ul li { width: auto; padding-top:1px!important; padding-bottom:1px!important; margin-left: 30px!important;}
.boxes h2 { padding: 10px 0 10px 10px!important;}
.panel img { padding: 5px; background: #fff;
			 -webkit-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px; 	-moz-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px;
			 -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0;}
.detail img { padding: 5px; background: #fff; 
			 -webkit-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px; 	-moz-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px;
			 -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px;}		

/* copy styles */
h1 { font-weight: bold; font-size: 1.6em; padding: 5px 20px; color:#65A066; line-height:1.2em;}
h2 { font-weight: bold; font-size: 1.5em; padding: 5px 20px; color:#65A066; line-height:1.2em;}
h3 { font-weight: bold;   font-size: 1.4em; padding: 5px 20px; color:#65A066; line-height:1.2em;}
h4 { font-weight: bold; font-size: 1.8em; padding: 5px 20px; color:#335435; line-height:1.2em;}
p  { font-weight: normal; font-size: 1.4em; padding: 5px 20px; line-height:1.35em; color:#335435;}
a { text-decoration: none; font-weight: normal; color: #335435; line-height: 1.35em;}
a:hover { color: #65A066;}

/*footer styles */
.footer { font-size: 1.0em;}
.footer h1 { font-size: 1.2em; font-weight: normal; padding: 5px 10px;}
.footer h2 { font-size: 1.1em; font-weight: bold;   padding: 10px 15px;}
.footer h3 { font-size: 1.1em; font-weight: bold;   padding: 5px 15px;}
.footer h4 { font-size: 1.1em; font-weight: bold;   padding: 10px 15px 0px;}
.footer p  { font-size: 1.0em; font-weight: normal; padding: 0px 15px 10px;}
.footer ul.bullet li { padding: 0; margin-left: 10px!important;font-size:11px; }
.footer ul.bullet li a {color:#333; }
.footer ul.bullet li a:hover { color: #13445B;}

.footer ul.utility { margin: 0 25px;}
.footer ul.utility li a {color:#ccc; }
.footer ul.utility li a:hover { color: #fff;}
.greytab { -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; background: #efefef; margin: 0 20px; }
.whitetab h3 { font-weight: normal!important; padding: 16px 20px!important; margin-top: 20px;}

.overlay { top: 10px; left: 15px; font-weight: normal!important}


#slider { margin: 10px 14px; width:932px; height: 176px; position:relative; clear:both;  }  

/* 
* Required 
*/  
.container { width:932px; height:176px; overflow:hidden; position:relative; cursor:pointer; background:url(../images/banner_slide_s0.jpg) 0 34px no-repeat; }  
.slides { position:absolute; top:0; left:0; }  
.slides div { position:absolute; top:34px; width:932px; height: 142px; display:none; }  
/* 
 * Optional 
*/  
 
ul.pagination { list-style:none; padding:0; margin:0; float: right}  
ul.pagination li  { float:left; }  
ul.pagination li a { padding:2px 4px; }  
ul.pagination li.active a { color:white; } 


#caption { color: #fff; font-size: 1.1em;}
.caption-container { background:url(../images/banner_head_bg_s1.jpg) repeat-x; width:337px; height:34px; position:absolute; left: 0px; top: 0px; z-index:100;
			line-height:34px; color:#978380; text-align:left; text-indent:15px; opacity: 1.0; }			
.caption-start { background:url(../images/banner_head_l_s1.jpg); width: 14px; height: 34px;float:left;}			
.caption-end { background:url(../images/banner_head_r_s1.jpg); width: 40px; height: 34px; float:right;}			
#pagination {  width:auto; height:34px; position:absolute; left: 237px; top: 0px; z-index:109;width: 60px;
			text-align:right; padding: 0 0 0 0;  opacity: 1.0;}
.pagination a { padding: 0 4px; line-height:32px; display:inline-block; color:#eee; }		
.pagination a:hover { color:#FFFFFF; cursor: hand;}			

/* Bottom Bar */
.botbar { background: url(../images/footer_bg.png) repeat-x; height: 52px; margin: auto 20px; position:relative; left: 0; top: 20px;}
.botbar-start { background:url(../images/footer_l.png); width: 22px; height: 52px; float: left;}
.botbar-end { background:#e8e8e8 url(../images/footer_r.png); width: 22px; height: 52px; float: right;}
#copyright { color:#666; float: left; line-height:52px; font-size:1.0em;}
#designed_by { float: right; color: #666; line-height:52px;}
#designed_by a { text-decoration:none; color: #666;}
#designed_by a:hover { text-decoration:underline; color:#335435; }

/* Page Styles */
.quotation {     font-size: 1.2em;
    font-style: italic;
    font-weight: normal;
    line-height: 1.35em;
    padding: 5px 120px;
    position: relative;
    text-align: center; }
.quotation:before { content: ' \201C'; color:#65A066; font-size: 4.0em; position: relative; top: 23px; left: -5px; font-family: "Bookman Old Style", sans-serif;}
.quotation:after { content: '\201D'; color:#65A066; font-size: 4.0em; position: relative; top:23px; left: 0px; font-family: "Bookman Old Style", sans-serif; height: 1px; line-height:1px;}

/* ############################################################# */

#products 				{ width: 100%; float: left;  position: relative; font-size: 90%; margin: 0px auto 20px; }

#products form 			{ margin: 10px !important;}

#products h1				{  color: #091c92; text-align:left; 
											margin: 0 0 10px 0 ; font-weight:normal; text-transform:capitalize; 
											background-repeat:no-repeat; clear: none;
											position:relative; top: 0px; padding: 16px 0 17px 0;}
#products h4				{ text-align: left; font-size: .7em; margin: 10px 0 10px 0; padding:0; font-style:italic; color:#999;}

.product_item				{ float: left; margin: 5px; width: 23%;  
								 -webkit-box-shadow: rgba(0,0,0,0.3) 2px 2px 12px; 	-moz-box-shadow: rgba(0,0,0,0.3) 2px 2px 12px;
								 -moz-border-radius: 5px; -webkit-border-radius: 5px 5px;}
.product_image			{ width: 100%; height: 150px; text-align:center; margin: 0; padding: 0px 0px 0px; position:relative; cursor:hand;
						  border: 1px solid #999; background:#fff;}
.product_image img		{ margin: 0; padding:0; cursor: pointer; cursor: hand; 
						  width: 100%; } 
#product_main_image 	{ margin: 0; padding:0; cursor: pointer; cursor: hand; 
						  -webkit-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px; 	-moz-box-shadow: rgba(0,0,0,0.3) 2px 2px 2px;
			 			  -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0;
						  width: 400px; height: 400px; } 
				  
.product_img			{ float: left; width: 42px; }
.product_summary		{ font-size: 1.0em; margin: 0 auto;border:1px solid #999999; border-top: 1px solid #eee; min-height: 49px; background:#eee; width:100%;} 
.product_title 			{ color:#000000; font-size:1.1em; text-align:center;}
.product_price 			{ font-size: 1.4em; color:#666; margin: 1px auto; font-weight:bold;}
.noborder				{ border: none!important;}
#product_controls   { width: 100%;}
#product_control    { float: left;}
#product_submit     { float: right;}

.product_image a:hover { text-decoration:none;}

#videolayer  { position:absolute; width:307px; height: 307px; background-color:#000000; left: 0px; top: 0; visibility:hidden;}

.product_item	a { text-decoration:none;}

.product_detail 								{ margin: 0 0 20px 0; text-align:left;  }
.product_detail form						{ margin: 0; font-size:100%; float: none;}
.product_detail_image						{ margin: 0; position:relative;}

.product_options	{ text-align: left; }
.product_options p { text-align:left; font-size:1.2em;}
.product_options fieldset { border: none; width: 200px;}
.product_options ul { list-style:none;}
.product_options li { list-style:none; text-align:left;}
.product_options label { float: left; width: 80%; text-align:right; margin: 5px 10px;}
.product_options input[type="radio"] { float: right; width: 20px; height: 20px; color:#FF9900;}

.product_description  { float: left; margin: 0; color: #333; font-size:1.2em;}
																	
.product_additional_images_1 			{ left:364px; position:absolute; top:-30px;}
.product_additional_images_1 img	{ margin: 0 1px 0 0; border: 1px solid #fff;}

.product_additional_images_2 			{ left:364px; position:absolute; top:250px;}
.product_additional_images_2 img	{ margin: 0 1px 0 0; border: 1px solid #fff;}

.product_technical 				{ width: 363px; text-align:left; float: left;}
.product_technical ul 		{ list-style:none; margin: 0 0 10px 1px; padding: 0;}
.product_technical li 		{ margin: 0; padding: 0; float: left;}
.product_technical label 	{ width:121px; float:left; font-size:70%; font-weight:bold; padding:1px 4px 0 0; 
														background-color:#011d4d;
										 				text-align:right; clear: right; color: #eee; margin: 0; height: 17px;}
.product_technical p		 	{ display:block; margin: 0 0 1px 0; width:233px; height:17px; background-color:#A4A6A5; 
														float: left;font-size:70%; padding:1px 0px 0 4px; }														
																		
* html .product_technical label { height: 18px!important;}														
* html .product_technical p { width:241px; height:18px!important;}														
.buy_now					{ color:#091C92; text-align:left; font-size:1.2em; float: right;}														
#price { float: left; font-size:120%; margin:0; padding:5px 0; color:#000099;}

.product_frame { position:absolute; right:0; text-align:right; bottom:-31px;  }

/* ############################################################# */

form 						{ margin: 30px auto; }
#enquiry fieldset {
    padding: 0;
    margin: 0 20px 10px;
	
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

    
    position: relative;
    border-radius: 10px;
    border: none;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
}
#enquiry legend 			{ display:none; }
#enquiry legend 			{ position: absolute; left: -1px; top: -14px; } /* required for ie compatibility */
						  
#enquiry li 				{ padding:5px 0 5px 5px;  
							  list-style:none; list-style-image:none; }
#enquiry ul 				{ padding:0; margin:20px 0 10px 0; }
#enquiry label 				{ width:120px; float:left; font-size:1em; font-weight:normal; padding:10px 10px 0 0; 
							  text-align:right; font-size: 15px; }
#enquiry .required 			{ color:red; }
#enquiry input.quicksubmit 	{ border: 1px solid #ccc; background:#558555; color:#fff; font-size:1.2em; margin: 10px 0 20px 130px; padding: 10px 20px; border-radius: 5px; text-transform:uppercase}
#enquiry input.quicksubmit:hover {background:#65A066; }
#enquiry input[type="text"], 
#enquiry textarea 			{ display:block; margin:0 ; border: 1px solid #ddd; float:left; width:60%; padding: 10px;}
.textfieldwidth 			{ width:235px; }

#enquiry .checks 			{ font-size:1em; margin:0 0 10px 170px; }
#enquiry .checks input 		{ margin:0 5px 0 0; float:left; }
.ddfmerrors					{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 1.4em; font-weight:bold;
							  color: #f00;}
.errorlist					{ padding: 5px 30px; color:#900; font-size: 1.2em;}		

.ddfmwrap {
    margin: 20px;
    font-size: 12px;
}

.thankyou {
    font-size: 17px;
    color: green;
    padding: 10px 20px;
    display: inline-block;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
    margin: 20px;
    
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,229,229,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
	
	border-radius: 10px;	
	

}

#nav { width: 100%; margin: 15px 0 }
#nav li {  float: left; margin: 0px; list-style: none }
#nav a { padding: 3px; display: block; border-bottom: 2px solid #fff; }
#nav a img { width:140px;  }
#nav a.activeSlide { border-bottom: 2px solid #900; }
#nav a:focus { outline: none; }
#nav img { border: none; display: block }

#map { padding: 0 0 0 20px ;}