
/*
CSS - FluidMasters - Created by Karl - 26th Oct 06
It came without warning,
A love like I aint never felt before,
She's like my destiny calling
ON THIS DAY...1863 - The Football Association, the oldest governing body in football, was formed in London in England.
*/

img { border: 0; }
.hidden { display: none; }
p.development { color: #ff0000; }

/* =Clearfix
----------------------------------------------- */
.clearfix:after {
    content: "."; 
    clear: both; 
    display: block; 
    height: 0; 
    visibility: hidden;
}
.clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
 /* End hide from IE-mac */

/* =Containers
border,height,width,padding,margin,position,top,left,right,bottom,float and clear only
----------------------------------------------- */
body {
	margin: 0;
	padding: 0;
}
div#wrapper {
	border: 4px solid #fff;
	height: auto;
	margin: 15px auto;
	width: 750px;
}
div#header {
	height: 138px;
	position: relative;
	width: 750px;
}
div#navigation {
	border-bottom: 2px solid #fff;
	height: 31px;
	width: 750px;
}
div#call_to_action {
	border-bottom: 1px solid #fff;
	height: 150px;
	width: 750px;
}
div#content_wrapper {
	height: auto;
	width: 750px;
}
div#content-main {
	float: left;
	height: auto;
	padding: 15px;
	width: 470px;
}

div#content-main.inner {
	width: 720px !important;
}

div#content-side {
	float: right;
	height: auto;
	margin-left: 20px;
	padding: 15px;
	width: 200px;
}
* html body div#content-side {
	margin-left: 0;
	padding-right: 15px;
	width: 215px;
}

/* =Body
----------------------------------------------- */
body {
	background: #425daa;
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 70%;
}

/* =Header
----------------------------------------------- */
div#header {
	background: url(../images/header-bg.jpg) repeat-x 0 0;
}
div#header a#header-logo {
	background: url(../images/header-logo.jpg) no-repeat 0 0;
	display: block;
	height: 115px;
	left: 27px;
	position: absolute;
	top: 11px;
	width: 266px;
}
div#header div#header-phone {
	background: url(../images/header-phone.jpg) no-repeat 0 0;
	height: 82px;
	left: 524px;
	position: absolute;
	top: 21px;
	width: 202px;
}

/* =Navigation
----------------------------------------------- */
div#navigation {
	background: url(../images/nav-bg.jpg) repeat-x 0 0;
	font-size: 1.1em;
}

ul#nav {
	background: url(../images/nav-ul_bg.jpg) no-repeat right top;
	height: 31px;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 750px;
}
ul#nav li {
	float: left;
	position: relative;
	z-index: 100;
	margin: 0;
	padding: 0; 
}
ul#nav li a {
	display: block;
	height: 31px;
	width: 150px;
}
ul#nav a:hover, ul#nav li:hover a  {
	background-position: 0 -31px;
}
a.nav-home {
	background: url(../images/nav-home.gif) no-repeat 0 0;
}
a.nav-company_profile {
	background: url(../images/nav-company_profile.gif) no-repeat 0 0;
}
a.nav-products_services {
	background: url(../images/nav-our_services.gif) no-repeat 0 0;
}
a.nav-accessories {
	background: url(../images/nav-our_products.gif) no-repeat 0 0;
}
a.nav-contact_us {
	background: url(../images/nav-contact_us.gif) no-repeat 0 0;
}

ul#nav li ul {
	list-style: none;
	border: 1px solid #ebe8dd;
	height: auto;
	position: absolute;
	top: 100%;
	left: -9999em;
	width: 150px;
	margin: 0;
	padding: 0; 
}

ul#nav li:hover ul, ul#nav li.over ul { left: 0; }

ul#nav li ul li {
	background: #fefefd;
}

ul#nav li ul li a {
	color: #1b2950;
	display: block;
	height: 20px;
	padding: 2px 5px;
	text-decoration: none;
	width: 140px;
}

ul#nav li ul li a:hover {
	background: #2e4176;
	color: #fff;
}

/* =Call_to_action
----------------------------------------------- */
div.call_to_action {
	height: 150px;
	width: 750px;
}
* html body div.call_to_action {
	margin-bottom: -3px;
}
div.call_to_action#call_to_action-index {
	height: 200px;
	position: relative;
	background-color: #E3E0D1;
}
img.first { display: block; }
#call_to_action-index img { display: none; }

div.call_to_action#call_to_action-index #flash-left {
	position: absolute;
	top: 10px;
	left: 3px;
}

div.call_to_action#call_to_action-index #flash-middle {
	position: absolute;
	top: 10px;
	left: 253px;
}

div.call_to_action#call_to_action-index #flash-right {
	position: absolute;
	top: 10px;
	left: 503px;
}

div.call_to_action#call_to_action-company_profile {
	background: url(../images/call_to_action-company_prof.jpg) no-repeat 0 0;
}
div.call_to_action#call_to_action-our_services {
	background: url(../images/call_to_action-our_services.jpg) no-repeat 0 0;
}
div.call_to_action#call_to_action-our_products {
	background: url(../images/call_to_action-our_products.jpg) no-repeat 0 0;
}
div.call_to_action#call_to_action-contact_us {
	background: url(../images/call_to_action-contact.jpg) no-repeat 0 0;
}
div.call_to_action#index a.call_to_action_link {
	display: block;
}
div.call_to_action a {
	display: block;
	height: 14px;
	left: 528px;
	position: relative;
	top: 106px;
	width: 175px;
}

/* =Content
----------------------------------------------- */
div#content_wrapper {
	background: #f1eee6;
}
div#content-main a,
div#content-side a {
	color: #b00000;
	text-decoration: underline;
}
div#content-main a:hover,
div#content-side a:hover {
	color: #20305a;
}
/* =Main */
div#content-main {
	color: #4e4e4e;
	font-size: 1.1em;
	line-height: 1.8em;
}

div#content-main h1 {
	color: #20305a;
	font-size: 1.8em;
	line-height: 1.1em;
	margin: 0;
	margin-bottom: .5em;
}
div#content-main h2 {
	color: #b00000;
	font-size: 1.6em;
	line-height: 1.1em;
}
div#content-main h3 {
	font-size: 1.3em;
	line-height: 1.1em;
	margin-bottom: -0.5em;
	padding: 0;
}
div#content-main h4 {
	color: #20305a;
	font-size: 1.1em;
	line-height: 1.2em;
	margin-bottom: -0.5em;
	padding: 0;
}
div#content-main h5 {
	color: #20305a;
	font-size: 1.2em;
	line-height: 1.1em;
	margin: 0;
	margin-bottom: .5em;
}

div#content-main a.button-more {
	width: 150px;
	height: 26px;
	display: block;
	background: url(../images/icon-button-more.gif) no-repeat;
}

div#content-main a:hover.button-more {
	background-position: 0 -26px !important;
}

div#content-main img.img-bordered {
	border: 1px solid #4e4e4e;
	padding: 1px;
}
div#content-main img.img-left,
div#content-main img.img-right {
	margin: 10px;
}
div#content-main img.img-left {
	float: left;
	margin-left: 0;
}
div#content-main img.img-right {
	float: right;
	margin-right: 0;
}
div#content-main img.img-center {
	margin: 10px auto;
}
div#content-main a.logo-conoco {
	background: url(../images/main-logo_conoco.jpg) no-repeat 0 0;
	display: block;
	float: left;
	height: 48px;
	width: 112px;
}
div#content-main .logo-hydroclear {
	background: url(../images/main-logo_hydroclear.gif) no-repeat 0 0;
	display: block;
	float: left;
	height: 40px;
	width: 126px;
}
div#content-main .logo-environment {
	background: url(../images/main-logo_environment.gif) no-repeat 0 0;
	display: block;
	float: left;
	height: 40px;
	width: 155px;
}
div#content-main ul.page_anchors,
div#content-main ul.page_anchors li {
	list-style: none;
	margin: 0;
	padding: 0;
}
div#content-main ul.page_anchors li {
	background: url(../images/icon-bullet_arrow.gif) no-repeat left center;
	padding-left: 20px;
}
div#content-main li.PDF {
	list-style-type: none;
	background: url(../images/icon-page_pdf.gif) no-repeat left 5px;
	padding: 2px 0 2px 20px;
}
div#content-main a.page_pdf {
	background: url(../images/icon-page_pdf.gif) no-repeat left center;
	padding: 2px 0 2px 25px;
}
div#content-main a.download_movie {
	background: url(../images/icon-download_movie.gif) no-repeat left center;
	padding: 2px 0 2px 25px;
}
div#content-main p#side-manufacture {
	color: #4e4e4e;
	font-size: 0.9em;
	display: block;
	padding:0 5px;
	margin:0;
}
div.back_to_top {
	border: 1px solid #DBD9D2;
	border-left: 0;
	border-right: 0;
	padding: 5px;
	text-align: right;
	clear: both;
}
div.diagram_image-content {
	margin: 10px auto;
}
div.diagram_image-content#cooling-diagram_image01 {
	background: url(../images/cooling-diagram_image01.jpg) no-repeat left top;
	height: 89px;
	padding: 10px 0 0 109px;
}
div.diagram_image-content#cooling-diagram_image02 {
	background: url(../images/cooling-diagram_image02.jpg) no-repeat left top;
	height: 89px;
	padding: 10px 0 0 120px;
}
div.diagram_image-content#cooling-diagram_image03 {
	background: url(../images/cooling-diagram_image03.jpg) no-repeat left top;
	height: 89px;
	padding: 10px 0 0 68px;
}
div.div-left {
	float: left;
	margin: 5px 10px 5px 0;
	text-align: center;
}
div.div-left p {
	margin: 0;
	padding: 0;
}

div.fact_sheet-wrapper  {
	margin: 10px 0;
}
/* =Side */
div#content-side {
	color: #283969;
	font-size: 1.1em;
	line-height: 1.5em;
}
div#content-side div#side-address_details p {
	margin: 0;
	margin-bottom: 1em;
}
 p.side-title {
	color: #FFFFFF;
	padding: 8px 0 8px 10px;
	margin: 0;
	font-size: 1.3em;
	line-height: 1.1em;
	font-weight: bold;
	background-color: #21305B;
}
div#content-side div#side-environmentally_friendly {
	background: url(../images/side-environmentally_friend.jpg) no-repeat 0 0;
	height: 46px;
	margin-left: -20px;
	width: 234px;
}
* html body div#content-side div#side-environmentally_friendly {
	margin-left: 0;
	margin-right: -15px;
}
div#content-side p#side-manufacture {
	color: #4e4e4e;
	font-size: 0.9em;
	display: block;
	text-align: center;
	margin-left: -13px;
	_margin-left: 0;
	padding: 0;
}


/* =Footer
----------------------------------------------- */
div#footer {
	background: #fff;
	font-size: 1.1em;
	height: 45px;
	width: 750px;
}
div#footer-left {
	float: left;
}
div#footer-left ul {
	margin: 18px 0 0 5px;
}
div#footer-left ul,
div#footer-left ul li {
	list-style: none;
	padding: 0;
}
div#footer-left ul li {
	border-left: 1px solid #ad0100;
	display: inline;
}
div#footer-left ul li.first {
	border-left: 0;
}
div#footer-left ul li a {
	color: #ad0100;
	margin: 0 5px 0 6px;
	text-decoration: none;
}
div#footer-left ul li a:hover {
	color: #000;
}
div#footer-right {
	float: right;
	text-align: right;
}
div#footer-right a#createdby_wf {
	background: url(../images/footer-createdby_webfirm.gif) no-repeat 0 0;
	display: block;
	height: 33px;
	margin: 6px 0 0;
	width: 210px;
}
p#footer-copyright {
	color: #f1eee6;
	display: block;
	font-size: 1.1em;
	margin: 0 auto 20px;
	padding: 0;
	width: 750px;
}

/* =Services
----------------------------------------------- */
div.fact_sheet-screen_cap {
	float: left;
	margin-right: 10px;
	padding-top: 10px;
	width: 70px;
}
div.fact_sheet-content {
	float: left;
	width: 600px;
}
div.fact_sheet-content p {
	margin: 6px 0;
	padding: 0;
}

/* =Contact_us
----------------------------------------------- */
#enquiryform {
	border: 0;
	margin-bottom: 10px;
	padding: 0;
	width: 100%;
}
#enquiryform fieldset {
	border: 0;
	display: block;
	height: auto;
	width: 100%;
}
#enquiryform fieldset ol {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#enquiryform fieldset ol li {
	/*border-bottom: 1px dotted #cbd0e9;*/
	padding: 10px;
}
#enquiryform fieldset ol li.alt {
	background: #e6e1d5;
}

#content-side #enquiryform fieldset ol li.alt {background:none;}

#enquiryform label {
	padding-top: 3px;
	vertical-align: top;
	width: 100px;
}
* html body #enquiryform label {
	display: inline-block;
}
form em {
	color: #ff0000;
}
#enquiryform textarea, #enquiryform input {
	color: #48516f;
	font-size: 1em;
	width: 180px;
}
#enquiryform textarea {
	font: 1.1em/1.2em "Arial", "Helvetica", sans-serif;
	overflow: hidden;
}
p.submit input {
	font-size: 10px;
	float: left;
	margin: -5px 0 0 112px;
	padding-left: 0;
	width: 185px !important;
}

#content-side p.submit input {margin-left:0; width:auto !important;}

/* =Lightbox
----------------------------------------------- */
#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
	
	p.sitecheck {
		font-size: 13px;
		text-align:center; 
		color:#20305A; 
		font-weight: bold;
		padding: 0 0 5px 0;
		margin: 0;
		border-bottom: 1px dotted #20305A;
	}
	
b {
	font-weight: bold;
	color: #FF0000;
}


img.image-style{
	padding: 0 0 15px 10px;
	text-align:center;
}

/*
END OF CSS - FluidMasters
May he turned 21 on the base of Fort Bliss,
Just today he sat down to the flask in his fist
Ain't been sober since maybe October of last year
DID YOU KNOW...that Elm Farm Ollie in 1930 became the first cow to be milked while flying in an airplane?	
*/
