/**
* Template 01
* Structural
*/
html, body {margin: 0; padding: 0; font-family: 'trebuchet ms',arial, verdana, sans-serif; font-size: small;}

/** COMMON **/
.clear {clear: both; height: 2px;}
.clearEl {clear: both;} /* on on existing elements, such as sub heading. Avoids setting height */
.leftHalf {float: left;}
.rightHalf {float: right;}
.noBorder {border: 0;}
.minor {color: #555;}

.center {text-align: center;}
.fixed {position: fixed;}

#logo {position: absolute; top: 0; left: 0; z-index: 2; width: 205px; height: 92px; line-height: 92px; margin: 0;
text-align: center;} /*h2. h1 reserved for DOCUMENT heading*/

#spacer {
	margin: 0; padding: 0; height: 107px; /* height of photo + mainNav. IE margin doesn't work with absolute els above */
}


#photo {
	position: absolute; top: 0; left: 0;
	height: 71px; width: 100%;
}

#mainNav {
	position: absolute; top: 71px; left: 0;
	height: 34px; width: 100%;
}


/* review below this line. copied from template 01. Much unnecessary */
#page {margin: 0 auto; width: 760px;}
#top {margin: 0; padding: 0; position: absolute; top: 0;
	height: 54px; width: 760px;
	}

#container {
	/*margin-top: 107px; /* mainNav + photo + border */
	min-height: 350px;
	/* position: absolute; /* -- works, but looses liquidity, and covers footer (no flow) */
	padding-bottom: 30px;
}

#content {
	/*float: right;
	width: 560px;*/
	padding: 0 20px 20px 20px;
	margin: 0 0 0 204px;
	position: relative;
}
	
#column {
	float: left;
	width: 204px;
	margin: 0;
	}

#footer {height: 50px;}

/* Details */
#mainNav ul {margin: 0 0 0 240px; padding: 0;}
#mainNav ul li {list-style: none; display: inline; height: 34px; line-height: 34px;}
#mainNav ul li a {display: block; height: 34px; float: left;}


#column .menu {margin: 0; padding: 0;}
#column .menu li {list-style: none;}

.bold {font-weight: bold;}


/**
* Template 01
* Style - Colours, Fonts, Images etc.
*/
body {background: #213441;}

#container {background: url('../images/col_bg.gif') repeat-y #FFF;}

#logo {background: url('../images/logo_bg.gif') no-repeat #FFF;}
#logo img {border: 0; width: 180px; height: 85px;}

#content {border-top: 5px solid #D9D9D9;}

	#content h1 {font-family: 'Arial Black', arial, verdana, sans-serif; color: #034593; line-height: 100%;}
	#content h1 .small {color: #595959; font-size: 0.8em; font-weight: normal; font-family: arial, verdana, sans-serif;}
	
	#content a, #content a:visited {color: #034593;}
	#content a:hover {color: #0770eb;}
	
	#content.gallery img {width: 150px; height: 113px;}

#column {background: #595654; border-top: 5px solid #555; color: #FFF;}


#photo {background: url('../images/photo1.jpg') no-repeat #0d4461;}
#mainNav {background: url('../images/mainnav_bg.jpg') repeat-x #E0E0E0; border-style: solid; border-width: 1px 0 1px 0; border-color: #FFF #FFF #A5A5A5 #FFF;}
#mainNav ul li a, #top li a:visited {border-left: 1px solid #CCC; padding: 0 1em; color: #333; text-decoration: none; font-weight: bold;}
#mainNav ul li a:hover {background: #555; color: #FFF; border-color: #000;}

#mainNav .dropable {background: url('../images/drop.gif') 97% 15px no-repeat transparent; padding-right: 30px;}

#footer {
	background: url('../images/footer_bg.png') repeat-x #213441; color: #fff; padding-left: 215px; 
}

#footer ul {margin: 0; padding: 0;}
#footer li {list-style: none; display: inline; height: 50px; line-height: 50px;}
#footer p {margin: 0 0.5em 0 0; height: 50px; line-height: 50px;}
#footer a {color: #46caf6;}
#footer a:hover {background: #000; color: #fff; text-decoration: none;}

#column .menu li {background: url('../images/menu_bg3.gif') repeat-x; line-height: 28px; font-weight: bold; border-bottom: 1px solid #000;}
#column .menu li a {display: block; margin: 0; padding-left: 5px; width: 199px; color: #FFF; text-decoration: none;  /*999488*/}
#column .menu li a:visited {display: block; margin: 0; padding-left: 5px; width: 199px; color: #c7c7c7; text-decoration: none;  /*999488*/}
#column .menu li a:hover {background: #034593; color: #fff;}

/* current menu item */
#column .menu li a.current {background: #fff; color: #222;}


#column .menu li ul {margin: 0; padding: 0; background: #333;}
#column .menu li ul li, 
#column .menu li ul li a {background: transparent;}

#column .menu li ul li a,
#column .menu li ul li a:visited {padding-left: 1.5em; width: auto;}

#column a, #column a:visited {color: #034593;}
#column a:hover {color: #0770eb;}

#column p a {color: #46caf6 !important;}
#column p a:hover {color: #9fe8ff !important;}

img.noBorder {border: 0;}
.highlight {color: #034593;}

#content .pdfFlyer {
	background: url('../images/pdf.png') no-repeat #f0f0f0;
	padding-left: 45px;
	display: block; 
	width: 255px; height: 28px; line-height: 28px;
	font-weight: bold;
}
#content .pdfFlyer:hover {color: #b00; background-color: #f5f5f5;}

/* Photos in sidebar */
#column #photos {margin: 2em auto; padding: 0; text-align: center; width: 162px; /* fit .button */}
#column #photos ul {margin: 0; padding: 0;}
#column #photos li {margin: 0; padding: 0; list-style: none;}
#column #photos ul img {border: 1px solid #000;}

/* Button style link */
#column a.button,
#content a.button {
	display: block;
	width: 160px; height: 30px; line-height: 30px;
	text-align: center;
	color: #fff; font-weight: bold; text-decoration: none;
	background: url('../images/button_bg.png') no-repeat transparent;
}
#column a.button:hover,
#content a.button:hover {
	background-position: 0 -30px;
	text-decoration: underline;
	color: #fff;
}

/**
* Droppy Drop Down Main Nav Styling
*/
 
/* #mainNav ul { display: block; margin: 0; padding: 0; position: relative; } */
#mainNav li { display: block; list-style: none; margin: 0; padding: 0; float: left; position: relative; }
#mainNav a { display: block; }
	#mainNav ul ul { display: none; position: absolute; left: 0; margin: 0; padding: 0; }
	* html #mainNav ul ul { line-height: 0; } /* IE6 "fix" */
		#mainNav ul ul a { zoom: 1; } /* IE6/7 fix */
		#mainNav ul ul li { float: none; line-height: 25px; height: 25px;}
		#mainNav ul ul ul { top: 0; }
    
#mainNav ul ul, #mainNav ul ul li a { width: 200px; }
#mainNav ul ul ul { left: 201px; }


#mainNav li.hover a { background-color: #213441; color: #fff; }
#mainNav ul ul { top: 34px; }
	#mainNav ul ul li a { background-color: #2d495c; color: #fff; height: 30px; line-height: 30px;}
	#mainNav ul ul a.hover { background-color: #46caf6;}
	#mainNav ul ul a { border-bottom: 1px solid #000; border-right: none;}
	
	
/** CAPABILITIES **/
.capImage {width: 200px; height: 150px; float: left; margin: 0;}

.capabilityBox {
	margin: 1em 0 0 0; padding: 0;
	min-height: 200px;
	clear: left;
	border: 1px solid #fff;
}

.capabilityBox h2 {margin: 0 0 0.5em 0;}
.capabilityBox div {margin: 0 0 0 230px; padding: 0;}
.capabilityBox div p {margin: 0 0 1em 0;}




/* NOTIFICATION */
.notification {margin: auto; width: 350px; padding: 0 0 0 100px; min-height: 100px; background: url('../images/notif.png') no-repeat #fff; border-style: solid; border-width: 0 0 2px 0; border-color: #89a2a0;}
.notification h3 {margin: 10px 0 0 0; font-size: 1.5em;}
	.good {background-image: url('../images/notif_good.png'); border-color: #72a911;}
		.good h3 {color: #72a911;}
	.bad {background-image: url('../images/notif_bad.png'); border-color: #912626; min-height: 140px;}
		.bad h3 {color: #912626;}
		

/* MULTI COLUMNS */
.colContainer {}
.colInner {float: left; margin: 0 3% 0 0;}
.colInner.last {margin: 0;}

.colInner.c2 {width: 48%;} /* two cols */
.colInner.c3 {width: 32%;} /* three cols */


/* PHOTO GALLERY GRID */
#galleryGrid .cell {width: 155px; margin: 0 20px 20px 0; float: left; text-align: center;}
#galleryGrid .cell a {text-decoration: none; font-weight: bold;}



/* NEWS */
.newsItem h2 {margin-bottom: 0;}
.newsItem .date {margin-top: 0; color: #666;}


/* PRODUCT DETAIL PAGES */

#description {
	max-width: 800px;
}

.feature {font-weight: bold; font-size: 2em; color: #034593;}



/* Easy Slider */

	#slider {margin-top: 2em;}
	#slider ul li img {border: 0; width: 600px; height: 208px;}
	
	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:600px;
		height:208px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:71px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:600px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(../images/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(../images/btn_next.gif) no-repeat 0 0;	
		}	
		
	/* numeric controls */	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#controls li{
		margin:0 10px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:28px;
		line-height:28px;
		}
	#content ol#controls li a{
		float:left;
		height:28px;
		line-height:28px;
		border:1px solid #ccc;
		background:#e8e8e8;
		color:#555;
		padding:0 10px;
		text-decoration:none;
		}
	#content ol#controls li.current a{
		background:#0770EB;
		color:#fff;
		}
	#content ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
/* // Easy Slider */