

* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 
 background: #3d3c3c url('../images/mainbg.gif');
background-repeat: repeat-x;
}
#wrapper { 
 margin: 0 auto;
 width: 906px;

}



img.floatrighttab { 
    float: right; 
    margin: -23px 5px 15px 40px; 
}

img.floatright { 
    float: right; 
    margin: 10px 10px 10px 20px; 
}

img.floatleft { 
    float: left; 
    margin: 10px 20px 10px 10px; 
}


#content_text h1  {
 margin:3px 0px 3px 0px;
text-align:left;
position:relative;
color:#ffffff;
font-family: arial;
font-size: 1.6em;
}


 h1  {
 margin:3px 0px 3px 0px;
text-align:left;
position:relative;
color:#000000;
font-family: arial;
font-size: 1.6em;
}

h2  {
 margin:3px 0px 3px 0px;
text-align:left;
position:relative;
color:#306990;
font-family: arial;
font-size: 1.2em;
}

h3  {
 margin:3px 0px 3px 0px;
text-align:left;
position:relative;
color:#306990;
font-family: arial;
font-size: 1em;
}

#subcontent_text ul {


    line-height:1.8;
    list-style-type:none;
}
#subcontent_text li {
    padding-left:45px;
    background:transparent url(../images/bullet.gif) no-repeat;
    background-position:24px 2px;
}


.subbox {
 width: 850px;
 float: left;
 height: auto;
  padding: 10px 10px 10px 10px;
 margin: 20px 10px 20px 0px;
 border:1px solid;
 background: #ffffff;
}

.subbox2 {
 width: 850px;
 float: left;
 height: auto;
  padding: 10px 10px 10px 10px;
 margin: 20px 10px 20px 0px;
 border:1px solid;
 background: #e3f2fb;
}


.subbox3 {
 width: 850px;
 float: left;
 height: auto;
  padding: 10px 10px 10px 10px;
 margin: 20px 10px 20px 0px;
 border:1px solid;
 background: #e1ebf1;
}

.subbox4 {
 width: 544px;
 float: left;
 height: auto;
  padding: 10px 10px 10px 10px;
 margin: 20px 10px 20px 0px;
 border:1px solid;
 background: #e3f2fb;
}



#header {
 color: #333;
 width: 906px;
 float: left;
 padding: 0px;
 height: 104px;
 margin: 0px 0px 0px 0px;
 background: url('../images/header.gif');
background-repeat: no-repeat;
}


/* menu */

#menu {
 color: #333;
 width: 905px;
 float: left;
 padding: 0px;
 height: 50px;
 margin: 0px 0px 0px 0px;
 background: #ffffff;
}


a#home {
width:112px;
height:50px;
background-image:url(../images/home.gif);
display:block;
text-decoration:none;
float:left;
}

a#home:hover {
background-position:112px 0;
}


a#company {
width:138px;
height:50px;
background-image:url(../images/company.gif);
display:block;
text-decoration:none;
float:left;
}

a#company:hover {
background-position:138px 0;
}

a#products {
width:131px;
height:50px;
background-image:url(../images/products.gif);
display:block;
text-decoration:none;
float:left;
}

a#products:hover {
background-position:131px 0;
}

a#markets {
width:129px;
height:50px;
background-image:url(../images/markets.gif);
display:block;
text-decoration:none;
float:left;
}

a#markets:hover {
background-position:129px 0;
}


a#gallery {
width:118px;
height:50px;
background-image:url(../images/gallery.gif);
display:block;
text-decoration:none;
float:left;
}

a#gallery:hover {
background-position:118px 0;
}


a#technical {
width:138px;
height:50px;
background-image:url(../images/technical.gif);
display:block;
text-decoration:none;
float:left;
}

a#technical:hover {
background-position:138px 0;
}


a#contact {
width:139px;
height:50px;
background-image:url(../images/contact.gif);
display:block;
text-decoration:none;
float:left;
}

a#contact:hover {
background-position:139px 0;
}






#flash {
 color: #333;
 width: 906px;
 float: left;
 padding: 0px;
 height: 288px;
 margin: 0px 0px 5px 0px;
 background: #363636;
}




#subbanner {
 color: #333;
 width: 906px;
 float: left;
 padding: 0px;
 height: 70px;
 margin: 0px 0px 10px 0px;

}



#tabscontain {
 color: #333;
 width: 906px;
 float: left;
 padding: 0px;
 height: 259px;
 margin: 0px 0px 10px 0px;
 background: url('../images/tabcontainbg.gif');
 background-repeat: repeat-x;
}






/* frontpage content area */


#contentwrap {
 width: 896px;
 float: left;
 height: 290px;
 padding: 0px 0px 0px 0px;
 margin: 0px 0px 0px 0px;
}


#content {
 color: #333;
 width: 900px;
 float: left;
 padding: 0px;
 height: 270px;
 padding: 0px 0px 0px 0px;
 margin: 0px 0px 10px 0px;
 background: #4d8eb9 url('../images/contentbg.gif');
 background-repeat: no-repeat;
 background-position: bottom;
}

#content_text {
 color: #333;
 width: 860px;

 height: auto;
  padding: 0px 0px 0px 0px;
 margin: -5px 0px 0px 15px;

}

#contentbgtop {
 color: #333;
 width: 900px;
 float: left;
 margin: 0px 0px 0px 0px;
 padding: 0px;
 height: 15px;;
 background: #4d8eb9 url('../images/contentbgtop.gif');
 background-repeat: no-repeat;
 background-position: top;
}


#content p{
font-family: arial;
font-size: 14px;
color: #ffffff;
margin:10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
line-height: 19px;
}

#content a{ 
text-decoration: none;
font-family: arial;
font-size: 14px;
color: #ffffff;
margin:0px 0px 0px 0px;
 }
 
#content a:hover{ 
text-decoration: underline;
font-family: arial;
font-size: 14px;
color: #eeeeee;
margin:0px 0px 0px 0px;
 }
 

 
#video {
 float:right;
 width: 290px;;
 height: 250px;
 padding: 0px 0px 0px 0px;
 margin: -30px 0px 0px 20px;
}










/* sub content area */


#subcontentwrap {

 width: 896px;
 float: left;
 height: auto;
  padding: 0px 0px 0px 0px;
 margin: 0px 0px 0px 3px;
}


#subcontent {
 color: #333;
 width: 900px;
 float: left;
 padding: 0px;
 height: auto;
  padding: 0px 0px 0px 0px;
 margin: 0px 0px 10px 0px;
 background: #e4e4e4 url('../images/subcontentbg.gif');
background-repeat: no-repeat;
background-position: bottom;
}

#subcontent_text {
 color: #333;
 width: 860px;

 height: auto;
  padding: 0px 0px 20px 0px;
 margin: -5px 0px 0px 15px;

}

#subcontentbgtop {
 color: #333;
 width: 900px;
 float: left;
   margin: 0px 0px 0px 0px;
 padding: 0px;
 height: 15px;;
 background: #e4e4e4 url('../images/subcontentbgtop.gif');
background-repeat: no-repeat;
background-position: top;
}


#subcontent p{
font-family: arial;
font-size: 12px;
color: #000000;
margin:10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
line-height: 19px;
}

#subcontent a{ 
text-decoration: none;
font-family: arial;
font-size: 12px;
color: #306990;
margin:0px 0px 0px 0px;
 }
 
#subcontent a:hover{ 
text-decoration: underline;
font-family: arial;
font-size: 12px;
color: #000000;
margin:0px 0px 0px 0px;
 }
 
 
 
 
 
 
 
 
 
 
 






 
 
 
 
 
 
 
 #footer { 
 text-align:center;
 width: 905px;
 height: 68px;
 clear: both;
 color: #333;
 background: #BD9C8C;
 margin: 5px 0px 20px 2px;
 padding:1px 0px 0px 0px;
 
  background: url('../images/footbg.gif');
background-repeat: no-repeat;
background-position: top;
}


#footer p{
font-family: verdana;
font-size: 12px;
color: #ffffff;
margin:8px 0px 10px 0px;
padding: 0px 0px 0px 0px;
line-height: 19px;
}

#footer a{ 
text-decoration: none;
font-family: verdana;
font-size: 12px;
color: #ffffff;
margin:0px 0px 0px 0px;
 }
 
#footer a:hover{ 
text-decoration: underline;
font-family: verdana;
font-size: 12px;
color: #eeeeee;
margin:0px 0px 0px 0px;
 }
 
 
 
.tabs a{ 
text-decoration: underline;
font-family: arial;
font-size: 14px;
color: #175689;
margin:0px 0px 0px 0px;
 }
 
.tabs a:hover{ 
text-decoration: underline;
font-family: arial;
font-size: 14px;
color: #000000;
margin:0px 0px 0px 0px;
 }
 
 
 
 
h2.tabs  {
 margin:3px 0px 3px 5px;
text-align:left;
position:relative;
color:#235984;
font-family: "Trebuchet MS";
font-size: 1.4em;
}
 
 p.tabs { font-family: arial;
font-size: 14px;
color: #000000;
margin:8px 0px 10px 5px;
padding: 0px 0px 0px 0px;
line-height: 19px;}
 
 
 /* tabs ------------------------- */
 
 
 		* { margin: 0; padding: 0 }
		/* I've used a hard CSS reset above, but you should consider a more sophisticated reset, such as this one: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
		


		p.intro { border-bottom: 1px solid #ccc; margin-bottom: 20px; padding: 20px 0 30px 0; text-align: left; width: 100% }
		
		p#cross-links { text-align: left }
		
		p#cross-links { border-bottom: 1px solid #ccc; margin-bottom: 30px; padding-bottom: 30px }
		
		noscript p, noscript ol { color: #a00; font-size: 13px; line-height: 1.4em; text-align: left }
		noscript a { color: #a00; text-decoration: underline }
		noscript ol { margin-left: 25px; }
		
		a:focus { outline:none }
		
		img { border: 0 }
		
		h3 { border-bottom: 1px solid silver; margin-bottom: 5px; padding-bottom: 3px; text-align: left }

		
		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 30px;
		}
		
		.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			margin: 10px 0;
			position: relative;
			width: 100%;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 100%; height: 200px; background: #fff; overflow: scroll}
		.csw .loading {margin: 200px 0 300px 0; text-align: center}

		.stripViewer { /* This is the viewing window */
		  background: url('../images/tabbg.gif');
			position: relative;
			overflow: hidden; 
			border: 0px solid #000; /* this is the border. should have the same value for the links */
			margin: auto;
			width: 880px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 200px;
			clear: both;
			
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 880px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 10px;
		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: auto;
			float:left;
			padding: 0px 0px 0px 20px;
		}
		
		.stripNav ul { /* The auto-generated set of links */
		float:left;
			list-style: none;
		}
		
		.stripNav ul li {
			float: left;
			margin-right: 2px;
			 /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
		}
		
		.stripNav a { /* The nav links */
			font-size: 14px;
			font-weight: bold;
			text-align: left;
			line-height: 32px;
			color: #fff;
			text-decoration: none;
			display: block;
			padding: 0 15px;
			float:left;
		}
		
		.stripNav li.tab1 a { background: #4d8eb9

		}
		.stripNav li.tab2 a { background: #325e7b }
		.stripNav li.tab3 a { background: #4d8eb9 }
		.stripNav li.tab4 a { background: #325e7b }
		.stripNav li.tab5 a { background: #00e }
		
		.stripNav li a:hover {
			background: #333;
		}
		
		.stripNav li a.current {
			background: #000;
			color: #fff;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 230px;
			text-indent: -9000em;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 40px;
			width: 40px;
		}
		
		.stripNavL {
		float:left;
			left: 0;
		}
		
		.stripNavR {
			right: 0;
		}
		
		.stripNavL {
			background: url("images/arrow-left.gif") no-repeat left;
		}
		
		.stripNavR {
			background: url("images/arrow-right.gif") no-repeat left;
		}
		
		
		
		
		
		
		
		/* drop downs  */
		
		
			
		
		#sddm
{	margin: 0;
	padding: 0;
	z-index: 30}

#sddm li
{	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	font: bold 13px arial}

#sddm li a
{	display: block;
	margin: 0 px 0 0;
	padding: 0px 0px;
	width: 138px;
	background: #transparent;

	text-align: center;
	text-decoration: none}

#sddm li a:hover
{		background: #transparent;}


#sddm div
{	position: absolute;
	visibility: hidden;
	margin: 48px 0px 0px -5px;
	padding: 0;
	background: #4d8eb9;
		z-index: 30
	}

	#sddm div a
	{	border-bottom: #02599e 1px solid;
	border-left: #02599e 1px solid;
	border-right: #02599e 1px solid;
	position: relative;
		display: block;
		margin: 0;
		padding: 5px 10px;
		width: 110px;
		white-space: nowrap;
		text-align: center;
		text-decoration: strong;
	background: #transparent;
		color: #ffffff;
		font: bold 13px arial}

	#sddm div a:hover
	{		background: #0b0c0c;
		color: #FFF}
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		#sddm2
{	margin: 0;
	padding: 0;
	z-index: 30}

#sddm2 li
{	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	font: bold 13px arial}

#sddm2 li a
{	display: block;
	margin: 0 px 0 0;
	padding: 0px 0px;
	width: 131px;
	background: #transparent;

	text-align: center;
	text-decoration: none}

#sddm2 li a:hover
{		background: #transparent;}


#sddm2 div
{	position: absolute;
	visibility: hidden;
	margin: 48px 0px 0px 5px;
	padding: 0;
	background: #4d8eb9;
		z-index: 30
	}

	#sddm2 div a
	{	border-bottom: #02599e 1px solid;
	border-left: #02599e 1px solid;
	border-right: #02599e 1px solid;
	position: relative;
		display: block;
		margin: 0;
		padding: 5px 10px;
		width: 100px;
		white-space: nowrap;
		text-align: center;
		text-decoration: strong;
	background: #transparent;
		color: #ffffff;
		font: bold 13px arial}

	#sddm2 div a:hover
	{		background: #0b0c0c;
		color: #FFF}
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		#sddm3
{	margin: 0;
	padding: 0;
	z-index: 30}

#sddm3 li
{	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	font: bold 13px arial}

#sddm3 li a
{	display: block;
	margin: 0 px 0 0;
	padding: 0px 0px;
	width: 129px;
	background: #transparent;

	text-align: center;
	text-decoration: none}

#sddm3 li a:hover
{		background: #transparent;}


#sddm3 div
{	position: absolute;
	visibility: hidden;
	margin: 48px 0px 0px -11px;
	padding: 0;
	background: #4d8eb9;
		z-index: 30
	}

	#sddm3 div a
	{	border-bottom: #02599e 1px solid;
	border-left: #02599e 1px solid;
	border-right: #02599e 1px solid;
	position: relative;
		display: block;
		margin: 0;
		padding: 5px 10px;
		width: auto;
		white-space: nowrap;
		text-align: center;
		text-decoration: strong;
	background: #transparent;
		color: #ffffff;
		font: bold 13px arial}

	#sddm3 div a:hover
	{		background: #0b0c0c;
		color: #FFF}
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		#sddm4
{	margin: 0;
	padding: 0;
	z-index: 30}

#sddm4 li
{	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	font: bold 13px arial}

#sddm4 li a
{	display: block;
	margin: 0 px 0 0;
	padding: 0px 0px;
	width: 139px;
	background: #transparent;

	text-align: center;
	text-decoration: none}

#sddm4 li a:hover
{		background: #transparent;}


#sddm4 div
{	position: absolute;
	visibility: hidden;
	margin: 48px 0px 0px -3px;
	padding: 0;
	background: #4d8eb9;
		z-index: 30
	}

	#sddm4 div a
	{	border-bottom: #02599e 1px solid;
	border-left: #02599e 1px solid;
	border-right: #02599e 1px solid;
	position: relative;
		display: block;
		margin: 0;
		padding: 5px 10px;
		width: auto;
		white-space: nowrap;
		text-align: center;
		text-decoration: strong;
	background: #transparent;
		color: #ffffff;
		font: bold 13px arial}

	#sddm4 div a:hover
	{		background: #0b0c0c;
		color: #FFF}