@charset "utf-8";
/* CSS Document */

body	{ margin:0; padding:0; font-family: Verdana, Arial, sans-serif; font-size: small; line-height: 16px; }
img		{ border: 0; }

#page	{ position: relative; width: 900px; height: auto; margin: 20px auto; }

#header	{ position: relative; width: 100%; height: 102px; background: url(../images/bgheader.jpg) left top repeat-x; }
.header	{ position: relative; width: 900px; height: 100px; margin: 0 auto; }
.logo	{ position: relative; float: left; width: 157px; height: auto; margin: 22px 0 0 0; }
.menubar	{ position: relative; float: left; width: auto; height: auto; margin: 47px 0 0 10px; }
.menubar ul		{ position: relative; float: left; width: auto; height: auto; list-style: none; margin: 0; padding: 0; }
.menubar ul li	{ position: relative; float: left; width: auto; height: auto; padding: 0 0 0 10px; font-size: 11px; font-weight:bold; }
.menubar ul li img	{ position: relative; float: left; margin-right: 1px; }
.menubar ul li span	{ position: relative; float: left; margin-top: 3px; padding: 0; }
.menubar ul li a		{ color: #000; text-decoration: none; }
.menubar ul li a:hover	{ color: #f98401; text-decoration: none; } 

.banner	{ position: relative; width: 900px; height: auto; }

.newitem		{ position: relative; float: left; width: 225px; height: auto; }
.newitemhead	{ position: relative; float: left; width: 225px; height: 23px; background: url(../images/bgnewitem_01.jpg) left top no-repeat; }
.newitemhead span	{ position: relative; float: left; color: #fff; text-decoration: none; margin: 3px 0 0 10px; font-weight:bold; }
.newitembody		{ position: relative; float: left; width: 225px; height: 244px; background:url(../images/newitem_02.jpg) left top no-repeat; }
.newitembody img	{ position: absolute; left: 11px; top: 10px; width: 200px; height: 200px; }
.newitembody .more 	{ position: absolute; right: 8px; bottom: 8px; width: auto; height: auto; }
.newitembody .more a 		{ color: #fff; text-decoration: none; padding: 2px 10px; background: #f98401; -moz-border-radius:4px; -webkit-border-radius:4px; }	
.newitembody .more a:hover 	{ color:#fff; text-decoration: none; padding: 2px 10px; background: #ffcc00; -moz-border-radius:4px; -webkit-border-radius:4px; }	
.newitemfooter	{ position: relative; float: left; width: 225px; height: 10px; background: url(../images/newitem_03.jpg) left top no-repeat; }

.bannerslide	{ position: relative; float: right; width: 660px; height: 277px; overflow: hidden;  } 
.bannerslide ul	{ list-style-image:none; list-style-position:inside; list-style-type:none; padding: 0; margin: 0; }

.subcontent-home	{ position: relative; float: left; width: 900px; height: auto; margin: 20px 0; }
.subcontentbox		{ position: relative; float: left; width: 290px; height: 103px; margin-right: 15px; }
.subcontentboxRight	{ position: relative; float: left; width: 290px; height: 103px; }

#contentPan		{ position: relative; float: left; width: 900px; height: auto; margin: 10px 0; }
.leftside		{ position: relative; float: left; width: 225px; height: auto; }
.rightside		{ position: relative; float: right; width: 660px; height: auto; }

.categories		{ position: relative; float: left; width: 225px; height: auto; }
.categories h3	{ position: relative; float: left; width: 225px; height: 28px; margin: 0; padding: 0; }
.categories	ul	{ position: relative; float: left; width: 225px; height: auto; list-style: none; margin: 5px 0 0 0; padding: 0; }
.categories	ul li	{ position: relative; float: left; padding: 10px 0 10px 15px; background: url(../images/icon_cate.jpg) left center no-repeat; width: 180px; border-bottom: 1px #ccc dotted; margin: 0 15px; }
.categories ul li a			{ color: #737373; text-decoration: none; }
.categories ul li a:hover	{ color: #f98401; text-decoration: none; } 

.subbanner		{ position: relative; float: left; width: 225px; height: auto; margin: 20px 0; }
.subbanner img	{ position: relative; float: left; width: 226px; height: auto; margin: 5px 0; }

.topicEach		{ position: relative; float: left; width: 660px; height: 35px; background: url(../images/topicbg.jpg) left top no-repeat; }
.topicEach span	{ position: relative; float: left; width: auto; margin: 7px 0 0 10px; color: #fff; font-weight:bold; }
.contentEach	{ position: relative; float: left; width: 640px; height: auto; margin: 8px 10px; color: #737373; }

.homeProduct	{ position: relative; float: left; width: 640px; height: 200px; border: 1px #d2d0d0 solid; -moz-border-radius:4px; -webkit-border-radius:4px; margin: 15px 0; padding: 20px 0 0 15px;  }

.homeNewsEach			{ position: relative; float: left; width: 310px; height: auto; margin: 0 2px; color: #737373; font-size: 11px; }
.homeNewsEach-img		{ position: relative; float: left; width: auto; height: auto; margin-right: 5px; }
.homeNewsEach-img img	{ position: relative; float: left; border: 1px #d2d0d0 solid; padding: 3px; width: 140px; height: 93px; -moz-border-radius:4px; -webkit-border-radius:4px; }
.homeNewsEach-txt		{ position: relative; float: left; width: 150px; height: auto } 
.homeNewsEach-txt span.topic	{ color: #0072a7; text-decoration: none; }
.homeNewsEach-txt span.topic a			{ color: #0072a7; text-decoration: none; }
.homeNewsEach-txt span.topic a:hover	{ color: #00CCCC; text-decoration: none; }

.newsEach		{ position: relative; float: left; width: 640px; height: auto; border-bottom: 1px #ccc dotted; padding: 10px 0 5px; }
.newsEach-img 	{ position: relative; float: left; width: auto; height: auto; margin-right: 10px; } 
.newsEach-img img	{ position: relative; float: left; border: 1px #d2d0d0 solid; padding: 3px; width: 140px; height: 93px; -moz-border-radius:4px; -webkit-border-radius:4px; }
.newsEach-txt		{ position: relative; float: left; width: 480px; height: auto } 
.newsEach-txt span.topic			{ color: #0072a7; text-decoration: none; }
.newsEach .more		{ position: relative; float: right; width: auto; height: auto; margin: 10px 0; }
.newsEach .more a 	{ color: #ccc; text-decoration: none; padding: 2px 10px; border: 1px #ccc solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
.newsEach .more a:hover 	{ color: #f98401; text-decoration: none; padding: 2px 10px; border: 1px #f98401 solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
.newsEachnav	{ position: relative; float: left; width: auto; height: auto; margin: 10px 0; }
.newsEachnav a	{ color: #ccc; text-decoration: none; padding: 3px 7px; border: 1px #ccc solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
.newsEachnav a:hover { color: #f98401; text-decoration: none; padding: 3px 7px; border: 1px #f98401 solid; -moz-border-radius:4px; -webkit-border-radius:4px; }

.newsEach-in		{ position: relative; float: left; width: 640px; height: auto; }
.newsEach-in-img		{ position: relative; float: left; width: 640px; height: auto; }
.newsEach-in-img img	{ position: relative; float: left; width: 640px; height: 150px; }
.newsEach-in-txt		{ position: relative; float: left; width: 640px; height: auto; margin: 10px 0; }
.newsEach-in-txt p.topic	{ color: #0072a7; text-decoration: none; margin: 8px 0; width: 640px; }
.newsEach-in-txt p		{ color: #737373; text-decoration: none; }

.productEach			{ position: relative; float: left; width: 640px; height: auto; }
.productEach p.topic	{ position: relative; float: left; width: 600px; height: auto; padding-left: 15px; color: #0072a7; font-weight:bold; background: url(../images/icon_topicproduct.jpg) left center no-repeat; margin: 8px 0;  }
.productEach p.topic a	{ color: #0072a7; font-weight:bold; text-decoration: none; }
.productEach p.topic a:hover  { color: #00CCFF; text-decoration: none; }
.productEach .more		{ position: relative; float: right; width: auto; height: auto; margin: 10px 0; }
.productEach .more a 	{ color: #ccc; text-decoration: none; padding: 2px 10px; border: 1px #ccc solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
.productEach .more a:hover 	{ color: #f98401; text-decoration: none; padding: 2px 10px; border: 1px #f98401 solid; -moz-border-radius:4px; -webkit-border-radius:4px; }

.itemEach			{ position: relative; float: left; width: 210px; height: auto; margin: 5px 1px; }
.itemEach-img		{ position: relative; float: left; width: 200px; height: auto;  padding: 3px 3px; border: 1px #ccc solid; -moz-border-radius:4px; -webkit-border-radius:4px; text-align: center; }
.itemEach-img img	{ width: auto; height: 200px; }
.itemEach-txt		{ position: relative; float: left; width: 185px; height: auto; padding: 10px; background-color: #eee; margin: 5px 0 0 2px; -moz-border-radius:5px; -webkit-border-radius:5px; }
.itemEach-txt span.topic	{ color: #0072a7; font-weight:bold; }

.productEachnav		{ position: relative; float: left; width: 640px; height: auto; margin: 25px 0; }
.productEachnav a	{ color: #ccc; text-decoration: none; padding: 3px 7px; border: 1px #ccc solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
.productEachnav a:hover { color: #0072a7; text-decoration: none; padding: 3px 7px; border: 1px #0072a7 solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
	
.colorEach		{ position: relative; float: left; width: 640px; height: auto; }
.colorEach-img		{ position: relative; float: left; width: 100px; height: auto; margin: 3px; }
.colorEach-img img	{ width: 100px; height: 100px; }
	
.colorEachnav		{ position: relative; float: left; width: 640px; height: auto; margin: 25px 0; }
.colorEachnav a	{ color: #ccc; text-decoration: none; padding: 3px 7px; border: 1px #ccc solid; -moz-border-radius:4px; -webkit-border-radius:4px; }
.colorEachnav a:hover { color: #0072a7; text-decoration: none; padding: 3px 7px; border: 1px #0072a7 solid; -moz-border-radius:4px; -webkit-border-radius:4px; }

.contactform	{ position: relative; float: left; width: 250px; height: auto; }
.contactdetail	{ position: relative; float: right; width: 380px; height: auto; color: #737373; }
.contactdetail p.boldtext	{ font-weight:bold; margin: 2px 0; }
.contactdetail span			{ font-weight:bold; }
.contactdetail a			{ color: #006699; text-decoration: none; }
.contactdetail a:hover		{ color: #f98401; text-decoration: none; }

.map			{ position: relative; float: left; width: 640px; height: auto; margin: 20px 0; }
.map img		{ position: relative; float: left; width: 640px; height: auto; }

/* paging */
.css-pager a { text-decoration:none; color:#666; background:#F4F4F4; border:1px solid #e0e0e0; padding:2px 5px; margin:2px; font-weight:700; font-size:11px; }
.css-pager a:hover { text-decoration:none; color:#fff; background:#0A85CB; border:1px solid #3af; padding:2px 5px; margin:2px; }
.current_page { background-color:#0A85CB; border:1px solid #3af; padding:2px 5px; margin:2px; color:#fff; font-weight:700; font-size:11px; }

#footer			{ position: relative; float: left; width: 100%; height: 88px; background: url(../images/bgfooter.jpg) center top repeat-x; color:#b4b4b4; }
.footer			{ position: relative; width: 900px; height: 100px; margin: 0 auto; }
.logofooter		{ position: relative; float: left; width: 111px; height: auto; margin: 25px 0 0 0; }
.company		{ position: relative; float: left; width: 60%; height: auto; margin: 20px 0 0 15px; }
.company p			{ position: relative; margin: 2px; }
.company p.comp		{ position: relative; margin: 2px; font-weight:bold; }
.company a			{ color: #f98401; text-decoration: none; }
.company a:hover	{ color: #e10052; text-decoration: none; }
