/* ----------  public css ---------- */
html {background:transparent; height:100%; margin:0; padding:0; outline:0; vertical-align:top;}

body {height:100%; font-size:12px; color:#666; background:#f1f8fe url(../images/body_bg.gif) top repeat-x;}

a {color:#3333FF; text-decoration:none;}
a:hover {color:#0191d3; text-decoration:none;}

.wrapper { clear:both; width:100%; margin:0px; padding:0px; overflow:hidden;background: url(../images/wrapper_bg.jpg) top center no-repeat;}

/* button & input style */
.button {-moz-box-shadow: 1px 1px 2px #A9A8A8;background: url(../images/button_bg.gif) repeat-x scroll center top #3333FF;color: #FFF;display: inline-block;font-size: 12px;font-weight: bold;line-height: 35px;padding: 0 19px;position: relative;}
.button:hover {background: url(../images/button_bg_active.gif) repeat-x scroll center top #6aa2d4;text-decoration: none; color:#3333FF;}

.brtools{ clear:both; height:35px; overflow:hidden;}
.detail .brtools{ margin-top:30px;}


/* ----------  header ---------- */
.header{ clear:both; width:960px; margin:0 auto; overflow:hidden;}

.toptools{ width:960px; overflow:hidden; margin:120px 0 10px 0; height:100px;}
.companylogo { float:left; width:350px; height:100px; overflow:hidden; margin-right:10px;}
.toplogo{ text-indent:-9999px; width:350px; height:100px; background-image: url(../images/logo.jpg);display:block;cursor:pointer;position:relative;background-position:0 0; background-repeat:no-repeat;}
.toplogo span.hover{text-indent:-9999px;display:block;cursor:pointer;position: absolute;width:350px; height:100px;z-index:10;background-position:0 -100px;background-repeat:no-repeat; background-image: url(../images/logo.jpg);}

/* menu br style */
.topmenu {width:600px; height:65px; overflow:hidden; float:right; margin-top:15px;}
.menu_01, .menu_01 span.hover, .menu_02, .menu_02 span.hover, .menu_03, .menu_03 span.hover, .menu_04, .menu_04 span.hover, .menu_05, .menu_05 span.hover, .menu_01_current, .menu_02_current, .menu_03_current, .menu_04_current, .menu_05_current, .menu_01_current span.hover, .menu_02_current span.hover, .menu_03_current span.hover, .menu_04_current span.hover, .menu_05_current span.hover{display:block;cursor:pointer; width:120px; height:65px; background-image: url(../images/menu_bg.jpg); text-indent:-9999px;}
.menu_01, .menu_02, .menu_03, .menu_04, .menu_05, .menu_01_current, .menu_02_current, .menu_03_current, .menu_04_current, .menu_05_current{ float:left; position:relative;}
.menu_01 span.hover, .menu_02 span.hover, .menu_03 span.hover, .menu_04 span.hover, .menu_05 span.hover, .menu_01_current span.hover, .menu_02_current span.hover, .menu_03_current span.hover, .menu_04_current span.hover, .menu_05_current span.hover{position: absolute; z-index:10;}

.menu_01 {background-position:600px 0px;}
.menu_01_current{ background-position:600px 65px;}
.menu_01 span.hover, .menu_01_current span.hover{background-position:600px -65px;}

.menu_02 {background-position:480px 0px;}
.menu_02_current{ background-position:480px 65px;}
.menu_02 span.hover, .menu_02_current span.hover{background-position:480px -65px;}

.menu_03 {background-position:360px 0px;}
.menu_03_current{ background-position:360px 65px;}
.menu_03 span.hover, .menu_03_current span.hover{background-position:360px -65px;}

.menu_04 {background-position:240px 0px}
.menu_04_current{ background-position:240px 65px;}
.menu_04 span.hover, .menu_04_current span.hover{background-position:240px -65px;}

.menu_05 {background-position:120px 0px}
.menu_05_current{ background-position:120px 65px;}
.menu_05 span.hover, .menu_05_current span.hover{background-position:120px -65px;}

/* banner */
.banner { clear:both; width:950px; height:200px; padding:0 5px 40px 5px; background:url(../images/banner_bg.jpg) 0 0 no-repeat;}
.scroller {position:relative;height: 160px !important; padding-top:30px; display: inline; float:left; margin-left:25px;margin-right: 25px;}

.scrollable {margin: 0;padding: 0;position:relative;overflow:hidden;width:900px;height:160px; float: left;z-index: 1;}
.scrollable .items {position:relative;width:200000em;height:160px;}
.scrollable .items .item{position: relative;border:5px solid #c8412d; text-align:left;width: 200px;height: 150px;overflow:hidden;margin: 0 20px 0 0;padding: 0;float:left; background:#fff;}
.scrollable .items .item table{clear:both;height:150px;padding:0;margin:0;width:200px;table-layout:fixed; overflow:hidden;}
.scrollable .items .item table td{padding:0;margin:0;vertical-align:middle;height:150px;width:200px;text-align:center;}
.scrollable .items .item table td img{max-width:200px; max-height:150px; width: expression(this.width >200 && this.height < this.width ? 200: true); height: expression(this.height > 150 ? 150: true); cursor:pointer;}
a.browse {position: relative;width:20px;height:20px;float:left;margin:0;padding: 0;cursor:pointer;font-size:1px;}
a.right { background:url(../images/b-slot-navigator-right.png); background-repeat: no-repeat; background-position: 0 0; clear:right; margin-right: 0px;	position: relative;top:-95px; left:885px;}
a.right:hover{ background-position:-20px 0; }
a.right:active{ background-position:-40px 0; } 
a.left	{background:url(../images/b-slot-navigator-left.png); background-repeat: no-repeat; position: relative;top:-95px;left:-25px;} 
a.left:hover{ background-position:-20px 0; }
a.left:active{ background-position:-40px 0; }
.left{text-align:left;}
.right{text-align:right;}
/* disabled navigational button */
a.disabled {visibility:hidden !important;} 	

.b-slot-caption {position:absolute; left:0; top:170px; width:190px; height:20px; line-height:20px; color:#fff;padding: 5px; zoom: 1;background-color:#33f; font-weight:bold; text-align:center;}
.b-slot-caption a{color:#d0e7f5;}
.b-slot-caption a:hover{color:#fff;}

/* ----------  footer ---------- */
.footer {clear:both; width:100%; overflow:hidden; background:url(../images/footer_bg.gif) top repeat-x;}

.copyright {width:960px; overflow:hidden; margin:0 auto; padding:48px 0 80px 0; background:url(../images/copyright_bg.jpg) 0 0 no-repeat; color:#f30;line-height:24px;}
.copyright a{color:#f30; overflow: hidden; line-height:15px; display:inline-block; position: relative; margin-bottom:-4px;}
.copyright a .line{background:#fff; bottom: 0; height:1px !important; left: 50%; position: absolute;width:0;}
.copyright a:hover{color:#fff;}
.copyright .col-1{width:570px;margin-right:20px;overflow:hidden;}
.copyright .col-1 h3{font-size:14px;}
.copyright p{line-height:24px; padding-top:10px;}
.copyright p strong{padding-right:5px;}
.copyright span{padding:0 5px;}
.copyright .col-2{width:370px;overflow:hidden;text-align:right;}


/* ----------  index css  ---------- */

.content{ clear:both; margin:0 auto 20px auto; overflow:hidden; width:960px;}
.content .col-1{width:250px; margin-right:30px;}
.content .col-2{ width:680px;}

.mainphoto{ width:960px; clear:both; overflow:hidden; margin-bottom:20px;}
.mainphoto ul{ margin:0 30px; overflow:hidden;}
.mainphoto li{ width:430px; height:380px; margin-right:40px;background:url(../images/mainphoto_bg.jpg) 0 0 no-repeat; float:left;}
.mainphoto li .photo{ margin:42px 34px 28px 26px; width:370px; height:310px; overflow:hidden; position:relative; text-align:center;}
.mainphoto li .photo .bg{ overflow:hidden; width:370px; height:310px; background-color:#3333FF; position:absolute; z-index:1; top:0px; left:0px;}
.mainphoto li .photo table{clear:both;height:270px;padding:0;margin:5px;width:360px;table-layout:fixed; overflow:hidden; position:relative; z-index:2;}
.mainphoto li .photo table td{padding:0;margin:0;vertical-align:middle;height:270px;width:360px;text-align:center; background-color:#fff;}
.mainphoto li .photo table td img { max-width:360px; max-height:270px; width: expression(this.width >360 && this.height < this.width ? 360: true); height: expression(this.height > 270 ? 270: true); cursor:pointer;}
.mainphoto .last{ margin-right:0;}
.mainphoto li .photo .photoname{ position:relative; z-index:2; line-height:25px; font-size:14px; font-weight:bold; }

.content .titleimg{ height:38px; padding-bottom:10px;}

.mainaboutus{ clear:both; overflow:hidden; margin-bottom:20px; position:relative;}
.mainaboutus p{clear:both; overflow:hidden; font-size:12px; line-height:24px; color:#666;}
.mainaboutus p a{ padding-left:10px; font-size:13px;}
.mainaboutus p a:hover{ text-decoration:underline;}
.mainaboutus .brtools{ top:0px; right:0px; position:absolute;}

.mainnews{clear:both; width:610px; float:left; margin-right:20px;}
.mainnews ul{ padding:0 0 20px 0; margin:0;}
.mainnews li{line-height:30px; padding-left:22px; background:url(../images/marker1.gif) 0 11px no-repeat; }
.mainnews li .date{font-size:12px; font-weight:bold; color:#bebebe; font-style:italic;}
.mainnews li a{font-size:13px; font-weight:bold; padding-right:10px;}
.mainnews li a:hover{color:#0191d3; text-decoration:underline;}

.maincontactus{ width:250px; height:120px; float:left; display:inline; overflow:hidden; padding:90px 40px 40px 40px; background: url(../images/main_contactus_bg.jpg) 0 0 no-repeat;; }
.maincontactus p{line-height:30px; color:#000;}
.maincontactus p strong{ padding-right:5px; font-size:13px;}

/* ----------  pages css  ---------- */
.htmledit{ clear:both; width:100%; overflow:hidden; line-height:150%;}
.htmledit table, .htmledit td,  .htmledit th{ border-collapse:inherit;}
.htmledit ul, .htmledit ol{list-style:inside; margin-left:24px;}
.htmledit ol{ list-style-type:decimal;}
.htmledit ul{ list-style-type:disc;}

.quoteinfo{ clear:both; line-height:20px; padding:15px 15px 15px 80px; background:#f8f8f8 url(../images/ico_quotes.gif) 20px 20px no-repeat; margin-bottom:20px; border:1px solid #acc8e0;}
.detail .htmledit h4{ clear:both; line-height:20px; font-size:14px; color:#f30; background:#fff; padding:5px 10px; margin-bottom:10px;}
.detail .htmledit strong{ color:#333; font-size:13px; }

.navigation{height:38px; margin-bottom:20px; overflow:hidden;}
.navigation h2{float:left; display:inline-block; line-height:38px;}
.navigation .nav{ float:right; text-align:right; line-height:18px; font-weight:bold; padding:10px 0;}
.navigation span{padding:0px 15px;  background:url(../images/divider.gif) center no-repeat;}
.navigation a{color:#3333FF; overflow: hidden; line-height:15px; display:inline-block; position: relative; margin-bottom:-4px;}
.navigation a:hover{color:#0191d3;}
.navigation a .line{background:#0191d3; bottom: 0; height:1px !important; left: 50%; position: absolute;width:0;}
.navigation strong{color:#333; font-size:13px;}

/*leftmenu */
.leftmenu{background:url(../images/productsort_bg.gif) repeat-x center top;border: 1px solid #c8412d; padding:20px 0; width:248px}
.leftmenu li{clear:both; position: relative; margin-bottom:5px;zoom:1;}
.leftmenu li a{ display:block;line-height:30px; position: relative; overflow:hidden;}
.leftmenu li a strong {display:block;line-height:20px; padding: 5px 0 5px 40px; position: relative;z-index: 2;background:url(../images/marker1.gif) 15px 10px no-repeat;  font-size:16px;}
.leftmenu li a em {background:#3333FF;display: block;height: 100%;left:50%;position: absolute;top: 0;width: 0;z-index: 1;}
.leftmenu li.current a:hover strong, .leftmenu li a:hover strong{background-image:url(../images/marker2.gif); color:#fff;}
.leftmenu li.current a strong{color:#333; font-size:16px;}
.leftmenu li ul{ visibility:hidden; position:absolute; width:100%; left:100%; top:0px; background:#9AA561; Z-INDEX:10;}
.leftmenu li li{ margin-bottom:0;padding-bottom:0; background:none;}
.leftmenu li.opened ul{ visibility:inherit; }
.leftmenu .opened a strong, .leftmenu .current li a strong, .leftmenu .current.opened a strong{color:#fff;background-image:url(../images/marker2.gif);}
.leftmenu li li a strong{ color:#fff; background-image:url(../images/marker3.gif); }
.leftmenu li li a em{ background:#AE9169;}

.googlemap{width:248px; border:1px solid #c8412d;}
.googlemap iframe{ margin:0; padding:0; overflow:hidden;}
.maplink{line-height:30px; display:block; background:#f8f8f8; text-align:center;}
.maplink:hover{ color:#fff; background-color:#3333FF; text-decoration:none;}

.mainphoto{ width:960px; clear:both; overflow:hidden; margin-bottom:20px;}
.mainphoto ul{ margin:0 30px; overflow:hidden;}
.mainphoto li{ width:430px; height:380px; margin-right:40px;background:url(../images/mainphoto_bg.jpg) 0 0 no-repeat; float:left;}
.mainphoto li .photo{ margin:42px 34px 28px 26px; width:370px; height:310px; overflow:hidden; position:relative; text-align:center;}
.mainphoto li .photo .bg{ overflow:hidden; width:370px; height:310px; background-color:#3333FF; position:absolute; z-index:1; top:0px; left:0px;}
.mainphoto li .photo table{clear:both;height:270px;padding:0;margin:5px;width:360px;table-layout:fixed; overflow:hidden; position:relative; z-index:2;}
.mainphoto li .photo table td{padding:0;margin:0;vertical-align:middle;height:270px;width:360px;text-align:center; background-color:#fff;}
.mainphoto li .photo table td img { max-width:360px; max-height:270px; width: expression(this.width >360 && this.height < this.width ? 360: true); height: expression(this.height > 270 ? 270: true); cursor:pointer;}
.mainphoto .last{ margin-right:0;}
.mainphoto li .photo .photoname{ position:relative; color:#fff; z-index:2; line-height:25px; font-size:14px; font-weight:bold; }
.mainphoto li .photo .photoname:hover{color:#fff;}

.aboutusphoto{width:680px; clear:both; overflow:hidden; margin-top:20px;}
.aboutusphoto ul{ margin-left:30px; overflow:hidden;}
.aboutusphoto li{ width:300px; height:270px; margin-right:20px;background:url(../images/aboutusphoto_bg.jpg) 0 0 no-repeat; float:left;}
.aboutusphoto li .photo{ margin:40px 30px 30px 30px; width:240px; height:200px; overflow:hidden;}
.aboutusphoto li .photo table{clear:both;height:180px;padding:0;width:240px;table-layout:fixed; overflow:hidden;}
.aboutusphoto li .photo table td{padding:0;margin:0;vertical-align:middle;height:180px;width:240px;text-align:center;}
.aboutusphoto li .photo table td img { max-width:240px; max-height:180px; width: expression(this.width >240 && this.height < this.width ? 240: true); height: expression(this.height > 180 ? 180: true); }
.aboutusphoto li .photo .photoname{ line-height:20px; display:block; color:#3333FF; text-align:center;}

/* content list */
.content_list{ width:100%; overflow:hidden;}
.content_list table { width:100%;table-layout:fixed; overflow:hidden;}
.content_list table th{text-align:left; padding:0 10px 10px 10px; font-size:14px; line-height:20px; color:#333; border-bottom:1px solid #c0cae3;}
.content_list table td{padding:10px; vertical-align:top; line-height:20px;}
.content_list table th.T1{padding-left:25px;}
.content_list table td.T1{padding-left:25px;background:url(../images/marker1.gif) 5px 14px no-repeat;}
.content_list table td a{ font-size:13px; font-weight:bold; color:#666;}
.content_list table td a:hover{ color:#0191d3;}
.content_list table tbody tr.even td{background-color:none;}
.content_list table tbody tr.odd td{background-color:#e0eaf3;}
.content_list table tbody tr.over td{background-color:#fff;}
.content_list table tbody tr.out td{background-color:none;}
.nodata{ text-align:center; line-height:40px;}

.list_news td.T1{ width:80px; color:#BEBEBE; font-style: italic; font-size:10px; font-weight:bold; font-family: Tahoma,Geneva,sans-serif;}
.list_news th.T1{ width:80px; }

/* ----------  page tools css  ---------- */
.grayr {margin:20px 0 0 0; padding:10px; FONT-SIZE:12px;text-align:center;}
.grayr a {PADDING:5px 10px;MARGIN:2px;COLOR:#3333FF;TEXT-DECORATION: none; border:#c0cae3 1px solid;FONT-WEIGHT: bold;}
.grayr a:hover {COLOR:#0191d3; border-color:#0191d3;}
.grayr a:active {COLOR:#fff; BACKGROUND-COLOR:#3333FF;}
.grayr span.current {PADDING:5px 10px; FONT-WEIGHT: bold; MARGIN:3px;COLOR:#fff; BACKGROUND-COLOR:#3333FF;}
.grayr span.disabled {PADDING:5px 10px; MARGIN:3px;COLOR:#ccc;border:#ccc 1px solid;FONT-WEIGHT: bold;}


.detailstitle {border-bottom: 1px solid #C0CAE3;margin-bottom:15px;padding: 5px 0 5px 40px; background:url(../images/icon_label.png) 0 0 no-repeat; position: relative;}
.detailstitle h4 {color:#3333FF; font-size: 14px;line-height:30px;}
.detailstitle .note {line-height:30px;position: absolute;right: 15px;text-align: right;top: 5px;}
.nes {color: #d00;padding: 0 5px;}

.newstitle{border-bottom:1px solid #C0CAE3;margin-bottom:15px;padding:0 0 5px 40px; background:url(../images/icon_pin.png) 0 0 no-repeat;}
.newstitle h4 {color:#3333FF; font-size: 14px;line-height:20px;}
.newstitle .date{color:#BEBEBE;font-family: Tahoma,Geneva,sans-serif;font-size:10px;font-style:italic;font-weight: bold;display:block;padding-bottom:5px;}

/* ----------  product list ----------  */
.productlist{clear:both; width:680px; overflow:hidden; }
.productlist ul{ margin:0 10px; width:660px;}
.productlist li{width:220px; display:inline; float:left; overflow:hidden; margin-bottom:20px;}
.productlist li .photo{ width:190px; margin:0 auto; background:#c8412d; height:145px; position:relative;}
.productlist li .photo .bg{ width:190px; height:145px;z-index:1; position:absolute; left:0px; top:0px; background:#3333FF;}
.productlist li .photo table {clear:both; width:180px; height:135px; top:5px; left:5px; background:#fff; padding:0; border:0; table-layout:fixed; position:relative; z-index:2;}
.productlist li .photo table td{margin:0; padding:0; border:0;text-align:center;vertical-align:middle;width:180px;height:135px; background:#fff;}
.productlist li .photo table td img{max-width:180px; max-height:135px; width: expression(this.width >180 && this.height < this.width ? 180: true); height: expression(this.height > 135 ? 135: true);}
.productlist li .productname{ line-height:20px; text-align:center; padding-top:5px; display:block; font-weight:bold;}

/* ----------  product details ----------  */
.detail .leftcatalog{width:420px; height:350px; float:left;background: url(../images/showpicphoto_bg.jpg) 0 0 no-repeat;}
.detail .rightinfo{width:260px; float:left; overflow:hidden;}

.leftcatalog .showpic{width:370px; height:280px; margin:40px 25px 30px 25px;overflow:hidden; position:relative;}
.leftcatalog .showpic .bg{background-color:#3333FF;height:280px;left: 0;position: absolute;top:0;width:370px;z-index: 1;}
.leftcatalog .showpic table{clear:both;height:270px;width:360px;table-layout:fixed;position:relative; z-index:2; left:5px; top:5px; background-color:#fff;}
.leftcatalog .showpic table td{padding:0;margin:0;text-align:center;vertical-align:middle;height:270px;width:360px;}
.leftcatalog .showpic table td img { max-width:360px; max-height:270px; width:expression(this.width > 360 && this.height < this.width ? 360: true); height: expression(this.height > 270 ? 270: true);}

.productinfo{ width:100%;overflow:hidden; height:290px; overflow:hidden;}
.productinfo table{padding:0; margin:0; width:100%;}
.productinfo table td{padding:10px 0;line-height:18px; vertical-align:top; border-bottom:#ccc 1px dotted;}
.productinfo table td.T1{width:40px; text-align:right; font-weight:bold; color:#333; padding-right:10px; letter-spacing:3px;}
.productinfo table td .productname{font-size:13px; color:#3333FF;}

.rightinfo ul{clear:both;height:47px;overflow:hidden; margin:13px 0 0 0;}
.rightinfo li{width:60px;height:45px;border-width:1px; border-style:solid; float:left; display:inline; margin-right:3px; cursor:pointer; background:#fff;border-color:#ccc;}
.rightinfo li.over{ border-color:#3333FF;}
.rightinfo li.last{ margin-right:0px;}
.rightinfo li table {clear:both;width:60px;height:45px;table-layout:fixed;}
.rightinfo li table td{margin:0;text-align:center;vertical-align:middle;width:60px;height:45px;}
.rightinfo li table td img{max-width:60px; max-height:45px; width: expression(this.width >60 && this.height < this.width ? 60: true); height: expression(this.height > 45 ? 45: true);}

/* ----------  contact us details ----------  */
input{color:#5B5B5B;font: 13px Arial,Helvetica,sans-serif;height: 16px;padding: 9px; border:1px solid #3333FF;-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);background: none repeat scroll 0 0 #fff;}
input:focus{ border-color:#0191d3; background-color:#fff; color:#000;}
input:disabled, select:disabled{ border-color:#999; background-color:#ddd; color:#999;}
input.type1{ width:200px;}
input.type2{ width:75px;}
input.type3{ width:30px;}
.from_post select{border:1px solid #3333FF;background-color:#fff; height:21px;color:#5B5B5B;}
select.type1{ width:208px;}
select.type2{ width:102px;}
select.type3{ width:50px;}
.from_post input, .from_post select, .from_post textarea{ float:left;}
.nes{color:#f00; padding:0px 5px;}
.from_post .fg{padding:0px 5px; line-height:36px; float:left; display:inline;}
.from_post table {clear:both; width:100%; }
.from_post td{padding-bottom:10px; vertical-align:top;}
.from_post td.td1{text-align:right; width:100px; font-weight:bold;line-height:36px; padding-right:10px;color:#3333FF;}
.from_post td.td2{width:250px;vertical-align:top;}
.from_post td.td2 img{vertical-align:middle; padding-left:10px; padding-top:9px; cursor:pointer;}
.from_post td.td3 img{ padding:12px 5px 0 0}
.from_post td.td3 span{color:#aaa; line-height:36px;}
textarea{color:#5B5B5B;font: 13px Arial,Helvetica,sans-serif;height:80px;padding: 9px; border:1px solid #3333FF;-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);background: none repeat scroll 0 0 #fff; width:200px;}
textarea:focus{border-color:#0191d3; background-color:#fff; color:#000;}
.from_post .brtools{ clear:both; margin:20px 0 0 110px;}