﻿/* Global Reset */
html, body, p, h1, h2, h3, h4, h5, h6, img, ol, ul, li, dfn, div, strong, em, dd, dt, dl, form, input, textarea, select, option, a, fieldset, legend, table, thead, tbody, th, tr, td, tfoot, address { margin: 0; padding: 0; border: 0; font-size: 100% }
img, a img, table, tr, th, td { border: 0 }
html, body { height: 100% }
body { font-size: 62.5% }
/* End Global Reset */

/* Site Structure */
body { text-align: center; background: url(images/body_bg.jpg) top left repeat-x #A6A6A6; }
#siteHolder { color: #282828; position: relative; font: 1.2em/1.7 Arial, Helvetica, sans-serif; text-align: left; margin: 0 auto }
#header { height: 478px; position: relative; }
#header .wrapper { background: url(images/header_bg.jpg) 277px 0 no-repeat; height: 100%; margin: 0 auto; position: relative; width: 970px; }
#logo { background: #FFF; height: 201px; left: 0; position: absolute; top: 0; width: 290px; }
#feature { background: #FFF; height: 193px; padding: 4px; position: absolute; right: 0; top: 0; width: 278px; }
#intro { background: #343434; color: #FFF; height: 256px; line-height: 1.5; padding: 10px 35px 0 35px; position: absolute; right: 0; top: 201px; width: 216px; }
#content { background: #D2D2D2; }
#content .wrapper { background: #FFF url(images/content_bg.jpg) top left repeat-x; margin: 0 auto; width: 870px; padding: 50px; }
#footer .website_meta { float: left; }
#footer .contact_details { float: right; text-align: right; }
/* End Site Structure */

/* Navigation */
#nav { background: url(images/nav_bg.gif) top left no-repeat #E7E7E7; height: 266px; left: 0; list-style: none; position: absolute; top: 201px; width: 277px }
#nav li a { text-decoration: none }
#nav ul { 
	margin: 40px 0 0 50px; 
	padding: 0; 
	list-style: none;
	text-transform: uppercase;
	width: 177px; /* Width of Menu Items */ 
} 


#nav ul li {
	position: relative;
	}
	
#nav li ul { 
	margin: 0;
	position: absolute; 
	left: 176px; /*Set 1px less than menu width */ 
	top: 0; 
	display: none; 
	width: 277px;
} 

#nav li ul li ul {
	display: none;
	visibility: hidden;
}


/* Styles for Menu Items */
#nav li { background: url(images/nav_li_bg.png) bottom left no-repeat; }
#nav li ul li { background: none; }

#nav ul a { 
	display: block; 
	text-decoration: none; 
	color: #343434; 
	font-size: 1.42em;
	line-height: 85%;
	background: url(images/nav_bullet.png) 0 12px no-repeat; /* IE6 Bug */ 
	padding: 10px;
} 

#nav ul a span {
	color: #236BB7;
	display: block;
	font-size: 0.82em;
}

/* Fix IE. Hide from IE Mac \*/
* html #nav ul li { float: left; height: 1%; }
* html #nav ul li a { height: 1%; }
/* End */

/* Hover Styles */ 
#nav ul a:hover, #nav ul a:hover span { 
	color: #3D89D8!important; 
	/*background: #f9f9f9; */
} 

/* Sub Menu Styles */ 
#nav li ul {
	background: url(images/sub_nav_bg.png) top left no-repeat;
}

#nav li ul a { 
	text-decoration: none; 
	color: #FFF; 
	background: none; /* IE6 Bug */ 
	line-height: 100%;
	padding: 7px 5px; 
	font-size: 1.17em;
} 

/* Sub Menu Hover Styles */ 
#nav li ul a:hover { 
	color: #3D89D8; 
} 
		
#nav li:hover ul, #nav li.over ul { display: block; } /* The magic */

#footer ul { margin: 10px 0; }
#footer li { display: inline; }
/* End Navigation */

/* Footer */
#footer { background: #A6A6A6; clear: both; color: #999; }
#footer .wrapper { background: #343434; margin: 0 auto; padding: 20px 50px; width: 870px; }
/* End Footer */

/* Effects */
/* End Effects */

/* Links */
a { overflow: hidden }
a:focus, a:hover { }
#logo a { background: url(images/hydraguard_logo.gif) center center no-repeat; display: block; height: 120px; margin: 42px auto 0 auto; width: 270px; }
#content a { color: #308ED7; }
#content a:hover { text-decoration: none; }
#footer a { color: #5E7A90; }
#footer li a { color: #999; text-decoration: none; }
/* End Links */

/* Typography */
h1 { color: #308ED7; font-size: 1.8em; font-weight: normal; margin-bottom: 10px; text-transform: uppercase; }
h2 { font-size: 1.2em; text-transform: uppercase; }
h3 { font-size: 1.1em; text-transform: uppercase; }
h2, h3, h4, h5, h6 { margin: 0 0 0.2em; }
#intro h2 { background: url(images/heading_bg.gif) bottom left no-repeat; color: #D3E9FF; font-size: 1.5em; font-weight: normal; margin-bottom: 10px; padding-bottom: 5px; text-transform: none; }
address { font-style: normal; }
p, #content ul, #content ol, table, dl, address { margin: 0 0 1em }
#content p { text-align: justify }
#content li { color: #305566; list-style: square; margin: 5px 0 5px 20px; }
#intro li { font-size: 1.2em; list-style: square; margin: 5px 0 5px 15px; }
#footer li { padding: 0 2px; }
ul.subtle { list-style: none }
tr td:first-child { padding-right: 24px }
.highlight { color: #597D99; }
/* End Typography */

/* Tools */
.discreet, #logo span { position: absolute; top: -9999em; left: -9999em }
.clear { clear: both }
div.clear { font-size: 1px; height: 1px; overflow: hidden }
.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	visibility: hidden;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* End Tools */
