@charset "utf-8";

#header {
	background-image:url(../system/storage/1/back-tile.jpg);
	
}

#headcontent {
	width: 838px;
	margin:0 auto;
	height: 430px;
	}

#logo {
	margin:0 auto;
	height: 98px;
}

#header #headcontent #logo {
			width: 301px;
			height: 77px;
			float: left;
			padding-top: 21px;
			padding-left: 46px;
			
			}

			#header #headcontent #logo a {
				background:  url(../system/storage/1/logo.gif) no-repeat;
				height: 53px;
				display: block;
				text-indent: -100000em;
				}
				
#showcase{
	margin:0 auto;
	width: 838px;
	height: 226px;
	float: left;
}

#navspace{
	margin:0 auto;
	height: 50px;
	width: 838px;
	float: left;
}
			#navspace .corner-left{
				background:  url(../system/storage/1/corner-banner.png) no-repeat;
				width: 34px;
				height: 30px;
				display: block;
				float: left;
				text-indent: -100000em;
				}
				
			#navspace #nav-main{
				background:  url(../system/storage/1/nav-bg.png) repeat-x;
				width: 770px;
				height: 30px;
				float: left;
				}
						#navspace #nav-main #nav-left {
							float:left;
							padding: 0;
							margin: 0;
							height: 30px;
							background: url(../system/storage/1/nav-bg-normal.gif) repeat-x;
						}
						
								#navspace #nav-main #nav-left ul {
									padding: 0;
									margin: 0;
									white-space: nowrap;
									width: auto;
									height: 100%;
								}
								#navspace #nav-main #nav-left li {
									list-style: none;
									float: left;
									margin: 0;
									text-align: center;
									font-family: NGStdMedium, "Trebuchet MS", Arial, Helvetica, sans-serif;
									font-size: 13px;
									font-weight: 400;
									color:#FFFFFF;
									}
									
								#navspace #nav-main #nav-left li a:link, #navspace #nav-main #nav-left li a:visited {
									display: block;
									float: none;
									text-align: center;
									padding: 0.45em 2em;
									text-decoration: none;
									color: #FFFFFF;
									position: relative;
								}
								
								#navspace #nav-main #nav-left li a:hover, #navspace #nav-main #nav-left li a:active {
									background-color: rgba(0,0,0,0.3);													
									text-decoration: none;
									-webkit-transition: all .2s ease-in;
									-moz-transition: all .2s ease-in;
									-o-transition: all .2s ease-in;
									transition: all .2s ease-in;
									color: #FFFFFF;
								}
								
								#nav-left ul #ro-product {
								 	width: 200px;
									}
						
								#nav-left ul li:hover #ro-product , #nav-left ul a:hover #ro-product {
									position:relative;
									float: none;
									}
									
									
										#navspace #nav-main #nav-left ul#qm0 ul	
											{	
												padding:10px 5px 5px 5px;
												margin:-2px 0px 0px 0px;
												background-color:#F7F7F7;
												font-family: NGStdMedium, "Trebuchet MS", Arial, Helvetica, sans-serif;
												color:#666666;
												border-width:1px;
												border-style:solid;
												border-color:#DADADA;
												height: auto;
												width: 100%;
												min-width: 135px;
											}
										
										#navspace #nav-main #nav-left ul#qm0 li	ul.submenu li
											{	
												font-family: NGStdMedium, "Trebuchet MS", Arial, Helvetica, sans-serif;
												color:#666666;
												text-align: left;
												width: 100%;
												text-align:left;
											}

										#qm0 ul a	
											{	
												padding:3px 10px 3px 5px;
												background-color:transparent;
												font-size:11px;
												border-width:0px;
												border-style:none;
											}
											
										#navspace #nav-main #nav-left ul#qm0 li ul a:hover, #navspace #nav-main #nav-left li ul a:active {
												background-color: rgba(0,0,0,0.3);													
												text-decoration: none;
												color: #FFFFFF;
												-webkit-transition: all .2s ease-in;
												-moz-transition: all .2s ease-in;
												-o-transition: all .2s ease-in;
												transition: all .2s ease-in;
												font-family: NGStdMedium, "Trebuchet MS", Arial, Helvetica, sans-serif;
											}
											
										#navspace #nav-main #nav-left li ul a:link, #navspace #nav-main #nav-left li ul a:visited {
												display: block;
												float: none;
												text-align: left;
												padding: 0.4em 1em;
												text-decoration: none;
												color: #666666;
												position: relative;
												font-family: NGStdMedium, "Trebuchet MS", Arial, Helvetica, sans-serif;
											}

			
						#navspace #nav-main #nav-right {
							float: right;
							padding: 0;
							margin: 0;
							height: 30px;
							background: url(../system/storage/1/nav-bg-special.gif) repeat-x;
						}
						
								#navspace #nav-main #nav-right ul {
									padding: 0;
									margin-top: 0px;
									width: auto;
									height: 100%;
								}
								#navspace #nav-main #nav-right li {
									width: auto;
									list-style: none;
									float: left;
									margin: 0;
									text-align: center;
									font-family: NGStdMedium, "Trebuchet MS", Arial, Helvetica, sans-serif;
									font-size: 13px;
									font-weight: 400;
									color:#FFFFFF;
									}
									
								#navspace #nav-main #nav-right li a:link, #navspace #nav-main #nav-right li a:visited {
									display: block;
									float: left;
									text-align: center;
									padding: 0.4em 2em;
									width: auto;
									text-decoration: none;
									color: #FFFFFF;
								}
								
								#navspace #nav-main #nav-right li a:hover, #navspace #nav-main #nav-right li a:active {
									background-color: rgba(0,0,0,0.3);													
									text-decoration: none;
									-webkit-transition: all .2s ease-in;
									-moz-transition: all .2s ease-in;
									-o-transition: all .2s ease-in;
									transition: all .2s ease-in;
									color: rgba(255,229,186,1);
								}

				
			#navspace .corner-right{
				background:  url(../system/storage/1/corner-banner-right.png) no-repeat;
				width: 34px;
				height: 30px;
				display: block;
				float: left;
				text-indent: -100000em;
				}
				
/* bodycontent */
#body #maincontent{
	margin: 0 auto;
	margin-top: -65px;
	margin-bottom: 4em;
	width: 770px;
	height: 100%;
	float: none;
}
		#maincontent #maincontentleft {
		float:left;
		width: 64%;
		margin: 0;
		padding: 0;
		margin-bottom: 2em;
		}
		
			#maincontentleft h1 {
			margin-top: 1.5em;
			}
			
		#maincontent #maincontentright {
		float:right;
		width: 30%;
		margin: 5px 0;
		padding-left: 2em;
		padding-bottom: 3em;
		margin-top: 30px;
		margin-bottom: 2em;
		border-left: 1px solid #CECECE;
		}
		
		
#body {
	width: 100%;
	background-color: #ffffff;
	margin-bottom: 1em;
	height: 100%;
	position: relative;
	float:left;
		}

.fc {width:190px; height:100%; border-top-left-radius:9px; border-top-right-radius:9px; background-color: #E0E0E0; padding: .5em 0 .5em 1em;}
.hts {border:1px #E0E0E0 solid; }
.bg8 {background-color:#E0E0E0; color: #838383;}
table.b27 td{border-bottom:1px solid #5b5b5b;}
.b27{width:100%;}
.fc1 {font-size:11px;line-height:17px;}
tr { height: 28px;}
.b27 td { padding-left: 1em; }
.subtable { height: 100%; padding: .75em 0 .75em 0.5em; background-color:#B9B9B9; }
td ul { margin: 0; padding: 1em 0 1em 2em;}

/* footer */
#footer {
	background-color: #b4b6b8;
	width: 100%;
	height: 80px;
	float: left;
	margin: 0;
	padding: 0;
	}
#footer a {
	color:  #F7F7F7;
	}
#footer a:hover {
	color: #FFFFFF;
	text-decoration:underline;
	}
	
	#footer #footerwrap {
		width: 838px;
		margin: 0 auto;
		padding: 0;
		font: 9.3px NGStdMedium, trebuchet ms, helvetica neue, helvetica, arial, sans-serif;
		float: none;
		height: 100%;
		}
		
		#footerleft {
			margin: 0;
			padding: 0;
			width: 100%;
			}
		#footer #footerwrap #footerleft ul {
			list-style:none;
			margin-top: 5px;
			margin-left: 15px;
			padding-left: 0px;
			}
		#footerleft li {
			color: #CCCCCC;
			font-size: 9.3px;
			border-left: 1px solid #F7F7F7;
			float: left;
			margin-right: 1.5em;
			margin-left: 0;
			padding-left: 1.5em;
			}
			
		#footerleft li a{
			color:  #F7F7F7;
			}
			
		#footerleft li.first {
			border: none; 
			padding: 0; 
			width: auto;
			padding-left: 0;
			}
	
		#footerleft li a:hover{
			color: #FFFFFF;
			text-decoration:underline;
			text-shadow: 0px 0px 9px #666666;	
			}
			
		#footerright{
			float: right;
			text-align:right;
			color: #ffffff;
			font-size: 9.3px;
			margin-right: 15px;
			line-height: 13px
			}
			
			
/*product index*/

#pright #checkbutton {
	width: 106px; height: 21px;
	float: left;
	margin-left: auto;
	margin-right: auto;
	margin-top: 75px;
}


#pright #checkbutton li {
	display: inline;
	float: left;
	}
	
#pright #checkbutton li a{
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
	background: url(../system/storage/1/check.jpg) no-repeat;
	float: left;
	width: 106px;
	height: 21px;
	overflow: hidden;
	display: block;
	text-indent: -1000em;
	
	}

#pright #checkbutton li a:hover{
	background-position: 0 -21px;
	}
	
	
#pmain {
	width: 770px;
	padding-bottom: 1em;
	border-bottom: 1px solid #CCCCCC;
	float: left;
	margin: 0 0 2em 0;
	}
	
	#pmain.last{
		border-bottom: none;
		}
		
#pleft {
	width: 325px;
	padding-right: 25px;
	float:left;
	margin: 0;
	}
	
#pmiddle {
	width: 225px;
	float:left;
	margin: 0;
	}	
	
#pright {
	width: 195px;
	float: left;
	margin: 0;
	}
	
#pmiddle #ppicture {
	width: 200px;
	margin-top: 40px;
	margin-left: auto;
	margin-right: auto;
	}
	
/*product detal*/

#dpheader {
	float: left;
	width: 100%;
	}
#dpheaderleft {
	float:left;
	}
#dpheaderright {
	float: right;
	margin-top: 10px;
	margin-bottom: 0;
	font:10px NGStdMedium, trebuchet ms, helvetica neue, helvetica, arial, sans-serif; 
	color: #C8C8C8;
	text-decoration: none;
	}
		#dpheaderright a, #dpheader #dpheaderright a:visited{
			text-decoration:none !important;
			color: #C7C7C7;
			display: inline;
			}
			
		#dpheaderright a:hover {
			-webkit-transition: all .2s ease-out;
			-moz-transition: all .2s ease-out;
			-o-transition: all .2s ease-out;
			transition: all .2s ease-out;
			color: #8D8D8D;
			}
			
#dpoverview {
	width: 650px;
	margin: 0 auto;
	float: left;
	margin-left: 60px;
	margin-bottom: 1em;
	}
	
#dpoverview	#dpdescription {
	width: 60%;
	float: left;
	margin-right: 5%;
	text-align: justify;
	}
	
#dpoverview	#dpdescription h3 {
	line-height: 20px;
	
	}	
	
#dpoverview	#dpdescriptionimage {
	width: 35%;
	float: right;
	height: 350px;
	}
	
	#dpoverview	#dpdescriptionimage.material {
	height: 100%;
	margin-bottom: 1.5em;
	}

	
	#dpoverview #dpcrossview {
	width: 30%;
	float: left;
	border-right: 1px solid #CCCCCC;
	margin-right: 3%;
	}
	
	#dpoverview #dplateralview {
	width: 30%;
	float: left;
	border-right: 1px solid #CCCCCC;
	margin-right: 3%;
	}
	
	#dpoverview #dptable {
	width: 33%;
	float: left;
	}
	
	#dpoverview.divider #dptable.steelpipe {
	width: 100%;
	float: left;
	}

		
		#dptable table {
		font: 10px "Trebuchet MS", Arial, Helvetica, sans-serif;
		text-align: center;
		}
		
		#dptable table td{
		border-top: 1px solid #0095d7;
		}
		
		#dptable table tr.head{
		background: #0095d7;
		color: #fff;
		margin: 0;
		}
		
		#dptable table.g tr{
		height: 20px;
		}
		
		
	#dpoverview #dpwrapfeature {
		width: 33.33%;
		margin: 0;
		float: left;
		margin-bottom: 20px;
}
		
	#dpoverview #dpwrapfeature #dpfeature {
		width: 200px;
		margin: 0 auto;
		text-align: center;
		}	
		
	#dpoverview #dpwrapfeature #dpfeature p{
		font: 10px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;
		}

#spphoto {
	width: 480px;
	height: 110px;
	float: left;
	margin: 0 0 2em 0;
	}
	
#spdesc {
	width: 270px;
	float: left;
	margin: -15px 0 2em 19px;
	min-height: 185px;
	}
	
table#raceway{
		font: 10px "Trebuchet MS", Arial, Helvetica, sans-serif;
		text-align: left;
		}
		
table#raceway TR{
		height: 10px;
		}
		
/*scroll menu*/
ul#menu {
  list-style-type:none;
  margin: 10px;
  padding: 0;
  width: 15em;
}

ul#menu ul {
  list-style-type:none;
  padding: 0;
  width: 15em;
}

ul#menu a {
  display: block;
  text-decoration: none;	
}

ul#menu li {
  margin-top: 1px;
    font-size: 0.9em;
}

ul#menu li a {
  padding: 0.2em;
  padding-left: 1em;
  color: #5A5A5A;
  border-bottom-style: groove;
  border: 1px;
}

ul#menu li a:hover {
  background: #595959;
  color: #fff;	
}

ul#menu li ul li a {
  background: #ccc;
  color: #000;
  padding-left: 20px;
}

ul#menu li ul li a:hover {
  background: #aaa;
  border-left: 5px #000 solid;
  padding-left: 15px;
}

.code { border: 1px solid #ccc; list-style-type: decimal-leading-zero; padding: 5px; margin: 0; }
.code code { display: block; padding: 3px; margin-bottom: 0; }
.code li { background: #ddd; border: 1px solid #ccc; margin: 0 0 2px 2.2em; }
.indent1 { padding-left: 1em; }
.indent2 { padding-left: 2em; }