/* general styling */
* {
	margin: 0;
	padding: 0;
}
html, body {
	height: auto;
	background: #546473 url('../back5.gif') repeat-x;
	color: #1a3804;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#container {
	width: 740px;
	height: auto;
	margin: 0 auto 0 auto;
	background: #FFFFFF;
	border: 5px solid #000;
}
#tophead{
	height: 37px;
	width: 100%;
	margin: 0;
	padding-bottom:4px;
	
	}
#quicknav{
	background: #dddddd url('../headertop.gif') no-repeat top left;
	position: absolute; top:0px;left:0px;
	margin:0 auto;
	padding-top:7px;
	padding-bottom:0;
	width: 100%;
	height: 60px;
	font-size: 11px;
	}
	
	#quicknav strong{
	border-bottom:1px dashed #000000;
	}

		#quicknav ul, li{
		margin:0px; 
		padding-left:15px;
		display: inline; 
		list-style:none;
		}
		#quicknav li a:link{color: black;padding: 5px;border: 1px solid #ddd;}
		#quicknav li a:visited{color: black;padding: 5px;border: 1px solid #ddd;}
		#quicknav li a:hover{background: white;color: black;border: 1px solid #bdbcbc;}
		#quicknav li a:focus{background: white;color: black;border: 1px solid #bdbcbc;}

#menu {
  margin: 0 auto;
}

#menu ul {
  width: 100%;
  float: left;
  margin: 0;
  padding: 0;

  text-align: left;
  background: #52616F url('../menu.gif') repeat-x;;
}

#menu ul li {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
}

#menu ul li a {
  float: left;
  width: 184px;
  height: 60px;
  font: 400 1.2em arial, sans-serif;
  letter-spacing: 0.1em;
  color: #fff;
  border-top: 6px solid #000;
  border-right: 1px solid #000000;
  border-bottom: 4px solid #758a9f;
}

#menu ul li a span {
  display: block;
  padding: 2px 7px;
}


#menu ul li a span.desc {
  font-size: 0.8em;
  color: #8C8D94;
}


#menu ul li a:hover,
#menu ul li a.here {
  background: #000;
  border-top: 6px solid #FFFFFF;
}

#menu ul li a:hover span.desc,
#menu ul li a.here span.desc {
  color: #FFF;
}


		

#nab {
height: 25px;
border-bottom: 2px solid #000000;
background: #061b1b url('../bb.gif') repeat-x;

}


#nab a {
	background: #061b1b url('../bb.gif') repeat-x;
	border-right: 1px solid #000;
	text-decoration: none;
	border-top: 1px solid #000;
	color: #888;
	float: left;
	padding-top: 4px;
	width: 145px; height: 20px;
}
#nab a span {
	padding-left: 6px;
}
#nab a:hover {
	background: #061b1b url('../broll.gif') repeat-x;
	color: #FFF;
}
#nab a#last {
	width: 153px;
	border-right: none;
}



/* the hyperlinks */
a {
	color: #A50B0B;
	text-decoration: none;
}
a:hover {
	color: #A50B0B;
}




	






#topbar {
	width: 740px;
	height: 20px;
	line-height: 24px;
	vertical-align: middle;
	text-align: right;
}


	#topbar ul {
		float: right;
	}
	#topbar li {
		list-style: none;
		display: block;
		width: auto;
		float: left;
	}
	#topbar a {
		text-decoration: none;
		display: block;
		padding: 0 17px 0 17px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		background: url('../images/arrow.gif') no-repeat 97% center;
		font-size: 9px;
		color: #666;
		text-transform: uppercase;
	}
	#topbar a:hover {
		color: #000;
	}

#header {
	width: 740px;
	height: 138px;
	background: url('../header.jpg') no-repeat top left;
	position: relative
}

#outer {
	width:740px;
	margin-left:auto;/* centre for compliant browsers */
	margin-right:auto;/* centre etc */
	text-align:left;
	position:relative;
}
ul#nav{
	margin:0;
	padding:0;
	list-style:none;
	width:740px;
	height:19px;
	background: #00A0A0;
	color: #000000;
}

ul#nav li {height:19px;
width:80px;
float:left;
text-indent:-999em;
margin:0;
padding:0;
background: #00A0A0;
color: #000000;

}

ul#nav li.web {width:79px;background: url('../web.gif') no-repeat left top}
ul#nav li.services{background: url('../services.gif') no-repeat left top}
ul#nav li.about{background: url('../about.gif') no-repeat left top}
ul#nav li.home{background: url('../home.gif') no-repeat left top}
ul#nav li.sales{background: url(images/bo_sales.gif) no-repeat left top}
ul#nav li.dealers  {width:81px;background: url(images/bo_dealers.gif) no-repeat left top}

ul#nav li a{height:19px;width:80px;display:block;text-decoration:none;}
* html ul#nav li a {float:left;display:inline;}/*weird ie5 bug*/
ul#nav li.web a{width:79px; background: url('../web') no-repeat left top}
ul#nav li.products a{background-color:#00A0A0;}
ul#nav li.racing a{background: url(images/b_racing.gif) no-repeat left top}
ul#nav li.support a{background: url(images/b_support.gif) no-repeat left top}
ul#nav li.sales a{background: url(images/b_sales.gif) no-repeat left top}
ul#nav li.dealers a{width:81px;background: url(images/b_dealers.gif) no-repeat left top}
ul#nav li a:hover {background:transparent}/*hide anchor and let background show through*/

ul#nav ul {
	position:absolute;
	top:19px;
	width:740px;
	left:0;
	margin:0;
	padding:6px 0 2px 0;
	list-style:none;
	overflow:visible;
	display:none;
	z-index:2;
	
}
ul#nav li.current ul{display:block;z-index:1}/* display the submenu for the current page in case js is disabled*/
ul#nav li.current a{background:transparent}/* highlight the current item*/

ul#nav ul li{
	position:relative;
	display:inline;
	background:transparent;
	width:auto;
}
#outer ul#nav ul li a{
	background:transparent;
	font-size:12px;
	color:#000;
	text-indent:0;
	width:auto;
	height:auto;
	display:block;
	padding:0 5px;
	border-right:1px solid #000;
}

#outer ul#nav ul li a.final{border-right:0px solid #000;}/*remove border from last sublist */

#outer ul#nav ul li a:hover{color:red;}/*subnav list text change on hover*/

/* this sets main hovered lists to transparent */
ul#nav li:hover a,ul#nav li.over a { background:transparent;}

ul#nav li:hover ul, ul#nav li.over ul { display: block;	background:transparent url('../subnav_table_background2.gif') repeat-x left top;
 } /* The magic */

/* this subnav just sets the background onto which the subnav is placed */
#subnavbg{
	margin:0px;
	width:740px;
	height:28px;
	line-height:28px;
	background: url('../subnav_table_background2.gif') repeat-x left top;
}


/* the big title text in the header */
	#header h1 {
		font-family: "Trebuchet MS", Tahoma, Verdana, sans-serif;
		font-size: 30px;
		font-weight: 100;
		letter-spacing: -1px;
		color: #FFF;
		position: absolute;
		top: 60px;
		left: 20px;
	}

/* the navigationbar in the header */
#navbar {
float: right;
}

/* the links in the navigationbar are an unordered list */
	#navbar ul {
	}
	
	#navbar li {
		list-style: none;
		display: block;
		width: auto;
		border-right: 1px solid #000;
		
		float: left;
	}
	#navbar a {
		text-decoration: none;
		display: block;
		padding: 4px 10px 4px 10px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		text-transform: uppercase;
	}
	#navbar a:hover {
		color: #FFF;
	}
	
/* the core contains all the site contents */
#core {
	width: 740px;
	height: auto;
	margin-top: 5px;
	background: url('../bot3.jpg') no-repeat top left;
	background-position: 0px 520px;	
}

/* the coreleft contains the left part of the core */

#coreleft {
	width: 145px;
	height: auto;
	float: left;
	border-bottom: 2px solid #CCCCCC;
	border: 1px dashed #CCCCCC;
	}
/* the links in coreleft are another unordered list */
	#coreleft ul {
	}
	#coreleft li {
		display: block;
		height: auto;
		width: 130px;
		margin: 2px;
	}
	#coreleft a {
		display: block;
		height: auto;
		padding: 4px;
		width: 128px;
		color: #000;
		text-decoration: none;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		border: 0px none;
	}

	#coreleft a:hover {
		background: #DDDDDD; url('../images/arrow.gif') color: #FFF; no-repeat
	}
	
	#coreleft a:hover .img{
		background: #FFFFFF; url('../images/arrow.gif') color: #FFF; no-repeat
	}


	#coreleft h3 {
		padding: 20px 4px 0 4px;
		font-family: "Trebuchet MS", Tahoma, Verdana, sans-serif;
		font-size: 18px;
		margin: 0;
		color: #A50B0B;
	}
	
	#coreleft p {
		padding: 5px;
		margin-top: 0px;
		line-height: 16px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 10px;
		color: #666;
	}
	
	#low {
	width: 740px;
	height: 27px;
	background: url('../gh2.jpg') no-repeat top left;
	position: relative

	}
	
#corecenter {
	width: 590px;
	height: auto;
	float: left;
}

#corecenter2 {
	width: 740px;
	height: auto;
	float: right;
}

	#corecenter h2 {
		font-family: "Trebuchet MS", Tahoma, Verdana, sans-serif;
		font-size: 15px;
		color: #FFFFFF;
			
		padding: 10px 0 0 10px;
	}
	
	#corecenter h1 {
		font-family: "Trebuchet MS", Tahoma, Verdana, sans-serif;
		font-size: 15px;
		color: #000;
			
		padding: 10px 0 0 10px;
	}
	#corecenter p {
		line-height: 20px;
		padding: 0 10px 10px 10px;
		color: #666;
	}
	#corecenter p2 {
		line-height: 20px;
		padding: 0 10px 10px 10px;
		color: #fff;
	}
	
	#corecenter ul {
		padding: 40px;
		width: auto;
	}
	#corecenter li {
		list-style: none;
		line-height: 40px;
		border-bottom: 1px solid #DDD;
	}
	#corecenter li a {
		text-decoration: none;
		color: #A50B0B;
		font-size: 14px;
		display: block;
		height: auto;
		padding: 4px;
	}
	#corecenter li a:hover {
		background: #CC7A7A;
		color: #000;
	}

/* the footer contains all copyright info etcetera */
#footer {
	clear: both;
	width: 740px;
	height: 30px;
	background: #000000;
	line-height: 30px;
	vertical-align: middle;
	text-align: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}
	#footer p {
		color: #FFF;
		padding-right: 20px;
	}
	#footer a {
		color: #FFF;
	}
	
	
	#subox {
	position: relative;
	width:545px;
	margin-left: 15px;
}

#subox2 {
	position: relative;
	width:700px;
	background: #000 url('../3step2.jpg') no-repeat top right;
	
}

#subox3 {
	width:300px;
	float:right;
	
}

#subox .image {
margin-left: 5px;
text-align: left;
padding: 4px;

}

#subinfobox {
	position: relative;
	width:300px;
}
#subinfobox .banner {
	height: auto;
	min-height: 100px;
}

#subinfobox .banner h4 {
	color: #000000;
	font: 132% Tahoma, "Lucida Grande CE", lucida, sans-serif;
	margin: 0px 0px 5px 0px;
}

#subinfobox .banner.b1 {
	float: left;
	margin-right: 4px;
	width: 160px
	
}

#subinfobox .banner.b2 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	margin-right: 4px;
	width: 170px
	
}

#subinfobox .banner.b2 p.info {
	font-size: 87%;
	line-height: 120%;
	margin: 0;
}

#subinfobox .banner.b3 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	margin-right: 4px;
	width: 170px
	
}

#subinfobox .banner.b4 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	width: 170px

}


ul#navigation {
	margin:5 0 20px 0;
	padding:0;
	float:center;
	list-style:none;
	width:525px;
	height:10
}

ul#navigation li {
	border-left:1px solid #e5e5e5; border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; float:left;
	border-top:0px none;
	font-size:95%
}

ul#navigation li a {
	color:#333;
	text-decoration:none;
	display:block;
	padding:0px 27px;
}

ul#navigation li a:hover {
	background:#fff url('images/nav-li.gif') no-repeat top left;
}	


#mainimage {
height: 504px;
width: 740px;
background: url('../main1.jpg') no-repeat top left;
}

#main1 {
height: 504px;
width: 740px;
background-color: #000000;
}

#con {
padding-top:50px;

height: 300px;
width: 515px;
float:right;
}

#con h3 {
padding-left:20px;
font-size: 18px;
color:#000;
}
#con p {
padding-left:30px;
font-size: 10px;
color:#000;
}

#con h2 {
padding-left:30px;
font-size: 14px;
color:#000;
}
#con h1 {
padding-left:30px;
font-size: 30px;
color:#00a0a0;
}



#box
{
position: relative;
width: 740px;
height: 140px;
float:none;
margin: 0px; padding: 0px;
}

#boxleft
{
position: relative;
width: 360px;
height: 140px;
float:left;
border-right:1px solid #000000;
margin: 0px; padding-left: 2px;
}

#boxleft3
{
position: relative;
width: 360px;
height: 140px;
float:left;
margin: 0px; padding-left: 2px;
padding-top:350px;
}

#boxleft3 h2 {
		font-family: "Trebuchet MS", Tahoma, Verdana, sans-serif;
		font-size: 15px;
		color: #00A0A0;
			
		padding: 10px 0 0 10px;
	}


#boxright
{
position: relative;
width: 370px;
height: 140px;
float:right;
margin: 0px; padding: 0px;
}

#port (





#subinfobox {
	position: relative;
	width:740px;
	background: url('../f22.jpg') repeat-y left top;

}

#subinfobox .banner {
	height: auto;
	min-height: 100px;
}

#subinfobox .banner h4 {
	color: #000000;
	font: 132% Tahoma, "Lucida Grande CE", lucida, sans-serif;
	margin: 0px 0px 5px 0px;
}

#subinfobox .banner.b1 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	margin-right: 4px;
	width: 160px
	
}



#subinfobox .banner.b1 h5 {
	color: #333333;
	font: bold 100% Tahoma, "Lucida Grande CE", lucida, sans-serif;
	margin: 10px 0 0 1px;
}

#subinfobox .banner.b2 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	margin-right: 4px;
	width: 170px
	
}

#subinfobox .banner.b2 p.info {
	font-size: 87%;
	line-height: 120%;
	margin: 0;
}

#subinfobox .banner.b3 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	margin-right: 4px;
	width: 170px
	
}

#subinfobox .banner.b4 {
	background: url('images/background_banner4.jpg') repeat-x left top;
	float: left;
	width: 170px

}

#subinfobox .clr {
	background: #FFFFFF;
	height: 1px;
	width: 756px;
}

#subinfobox .inner {
	padding: 7px 10px 5px 10px;
}

#subinfobox .inner.smallfont p {
	font-size: 85%;
	margin: 10px 0;
}

#subinfobox a:hover {
	color: #cc0000 !important;
}

#subinfobox form {
	margin: 7px 0 0 0;
}

#subinfobox li {
	font-size: 87%;
	line-height: 130%;
	list-style-type: none;
	margin: 0px;
	padding: 0px 0px 0px 8px;
}

#subinfobox p.info {
	font-size: 87% !important;
	margin: 5px 0 !important;
}

#subinfobox p.link {
	margin: 0.6em 0px 0px 0px;
}

#subinfobox p.link a {
	color: #000000;
	font-size: 87%;
	font-weight: bold;
}

#subinfobox ul {
	margin: 0px;
	padding: 0px;
}

.contentbox-container {clear: both; float: left; width: 425px; margin: 0px 0px 15px 0px; padding: 0px;} /* Width should be 428px, but IE-duplication bug forces us to reduce with 3px to 425px */
.contentbox-full {width: 425px; margin: 0px; padding: 0px;}
.contentbox-half-left {float: left; width: 205px; margin: 0px; padding: 0px;}
.contentbox-half-right {float: right; width: 205px; margin: 0px; padding: 0px;}
.contentbox-third-left {float: left; width: 134px; margin: 0px 13px 0px 0px; padding: 0px;}
.contentbox-third-middle {float: left; width: 134px; margin: 0px; padding: 0px;}
.contentbox-third-right {float: right; width: 134px; margin: 0px; padding: 0px;}



#box2
{
position: relative;
width: 100px;
height: 140px;
float:none;
margin: 0px; padding: 0px;
}

#boxleft2
{
position: relative;
width: 200px;
height: 140px;
float:left;
border-right:1px solid #000000;
margin: 0px; padding-left: 2px;
padding-top:300px;
}