﻿@charset utf-8;

/* 样式重置 */
html { overflow:scroll; }
body { margin:0; padding:0; background:#362a1e; color:#555; font-size:12px; font-family:Arial,"宋体"; }
form,ul,li,p,h1,h2,h3,h4,h5,h6 { margin:0; padding:0; }
img { border:0; vertical-align:absbottom; }
ul,li { list-style-type:none; }
input, select,textarea { font-size:12px; font-family:Arial; vertical-align:absmiddle; }

/* 常用功能样式 */
.clear { height:0px; font-size:0px; line-height:0px; overflow:hidden; clear:both; }
.overflow { overflow:auto; }
.nobg { background:none!important; }

/* 默认文字字体、文字颜色、背景颜色或者图像等 */
a { color:#555; text-decoration:none; }
a:hover { color:#cc6600; text-decoration:underline; }

/* 头部 */
.header { width:990px; margin:0 auto; background:#362a1e; }
.logo { float:left; }
.set { position:relative; float:right; padding:44px 0 0 0; }
.search { float:left; width:190px; }
.input_serach { width:133px; height:18px; background:url(style/bg_search_input.jpg) no-repeat left; }
.serach_input { width:129px; height:17px; padding:1px 0 0 3px; border:none; background:none; }
.btn_serach { width:35px; height:18px; border:none; background:url(style/btn_search.jpg) no-repeat; cursor:pointer; }
.car { float:left; width:60px; background:url(style/arrow_04.gif) no-repeat right 11px; line-height:28px; text-align:center; }
.car a { color:#afaaa5; }
.language { float:left; width:100px; background:url(style/arrow_04.gif) no-repeat 85px 11px; line-height:28px; text-align:center; }
.language a { display:block; height:28px; color:#afaaa5; }
#lbox { position:absolute; top:70px; right:0px; display:block; width:128px; height:63px; padding-top:8px; border:1px solid #ddd; background:#fff; line-height:18px; text-align:center; z-index:99; }
#lbox a{display:block;}
.banner { clear:both; }


/* 导航 */
.navbox { min-height:58px; _height:58px; background:url(style/bg_nav.jpg) repeat-x top #eee; clear:both; }
.navbox:after { content:'\0020'; display:block; height:0; clear:both; }
.nav { position:relative; width:990px; height:58px; margin:0 auto; background:url(style/bg_nav.jpg) repeat-x top #fff; z-index:99; }
.nav ul { padding:0; }
.nav li { float:left; width:115px; color:#fff; font-weight:bold; font-size:13px; text-align:center; }
.nav li a { display:block; color:#fff; min-height:33px; _height:33px; padding:25px 0 0 0; }
.nav li a:hover,.nav li .current { background:url(style/arrow_01.jpg) no-repeat bottom center; color:#fff; text-decoration:none; }
.nav .line { width:10px; height:58px; background:url(style/nav_line.gif) no-repeat left 58%; }


/* 下拉菜单 */ 
.nav li .shownav { position:absolute; left:0px; top:58px; width:970px; height:31px; margin:0; padding:0 10px; border-bottom:1px solid #ccc; background:url(style/bg_shownav.jpg) repeat-x bottom #fff; color:#555; font-size:12px; font-weight:100; text-align:left; line-height:31px; visibility:hidden; z-index:999; }
.nav li .shownav a { display:inline; padding:0 10px; color:#555; }
.nav li .shownav a:hover,.nav li .shownav .current { background:none; color:#cc6600; }

/* 主体 */
.main { width:990px; margin:0 auto; background:#fff; }
.main:after { content:'\0020'; display:block; height:0; clear:both; }
.main_bottom { width:990px; height:25px; background:url(style/main_bottom.jpg) no-repeat; clear:both; }

.shadow { position:absolute; bottom:0; left:0; width:230px; min-height:250px; _height:250px; background:url(style/left_bottom.jpg) repeat-y right top #fff; }
.right { float:left; width:713px; margin:0 0 0 27px; display:inline; }

/* 位置 */
.location { min-height:20px; _height:20px; padding:5px 30px 2px 0; color:#555; }
.location .ico { float:right; padding-left:20px; background:url(style/ico_location.gif) no-repeat 0 3px; }
.location a { color:#555; }
.location:after { content:'\0020'; display:block; height:0; clear:both; }

/* 二级导航 */
.menu { margin:0 10px 0 0; padding:0 0 34px 0; }
.menu dl { margin:0; }
.menu dt { margin:1px auto 0 auto; text-align:right; }
.menu dt a { display:block; _height:20px; *min-height:20px; padding:1px 18px 1px 0; background:url(style/menu_1.jpg) repeat-y; color:#555; line-height:20px; }
.menu dt a:hover, .menu dt .current { background:url(style/menu_01.jpg) repeat-y; color:#cc6600; text-decoration:none; }

/* 三级导航 */
.menu dd { width:220px; margin:0; line-height:18px; text-align:right; }
.menu dd a{ display:block; padding:2px 18px 0 30px; background:url(style/arrow_02.gif) no-repeat 210px 7px; color:#555; }
.menu dd a:hover, .menu dd .current { color:#cc6600; text-decoration:none; }

/* 右侧 */
.right .title { height:20px; margin:0; padding:8px 0 0 12px; background:url(style/bg_right_title.jpg) no-repeat; color:#555; font-size:12px; text-align:left; }
.bg_title { height:18px; margin:0; padding:3px 0 2px 12px; background:url(style/arrow_03.gif) no-repeat 3px 9px #eee; color:#555; font-weight:bold; font-size:13px; text-align:left; }

/* 文章 */
.display_title { padding:0 18px; color:#777; }
.display_title h1 { padding:22px 0 7px 0; font-size:16px; line-height:22px; text-align:center; }
.display_title .info{ position:relative; height:30px; background:#eee; line-height:30px; text-align:center; }
.display_title .font_size { position:absolute; top:0; right:0; padding:5px 10px 0 0; line-height:21px; text-align:right; }
.display_title .others { padding:5px 10px 0 0; line-height:21px; text-align:left; }
.display_title a { margin:0 5px; color:#555; }
a.btn_order { display:block; float:left; width:63px; height:22px; margin-right:5px; text-indent:-9999px; background:url(style/order.jpg) no-repeat; overflow:hidden; }
.display_content { padding:22px 18px 34px 18px; color:#555; font-size:14px; line-height:150%; text-align:left; clear:both; }

/* 列表样式 */
.list_news_01 { margin:23px 10px; }
.list_news_01 ul li { padding:3px 8px; background:url(bg_news_list_line.gif) repeat-x bottom; color:#333; line-height:20px; clear:both; }
.list_news_01 ul li a { padding-left:5px; color:#555; }
.list_news_01 ul li a:hover { color:#cc6600; text-decoration:underline; }
.list_news_01 .bg { background:#eee; }
.list_news_01 .date { float:right; padding:0 10px 0 8px; color:#a1a1a1; font-size:11px; font-family:Arial; }
.list_news_01 .ico { float:left; width:6px; _width:3px; height:20px; margin:0; background:url(style/arrow_02.gif) no-repeat 0 8px; }

/* 图片列表 */
.pic_list_01 { width:100%; margin:24px 0 70px 0; }
.pic_list_01 .pic_list { float:left; padding:0 0 13px 0; text-align:center; }
.pic_list_01 .pic_list img { margin:0 auto; border:1px solid #bbb; }
.pic_list_01 .pic_list .txt { margin:0 auto; padding:8px 0 0 0; line-height:20px; text-align:center; }
.pic_list_01 .pic_list .txt a { color:#555; }
.pic_list_01 .pic_list .txt a:hover { color:#cc6600; }
.price { margin:0 auto; color:#cc6600; font-size:14px; font-weight:bold; }

/* 向上 */
.page_top { margin-top:17px; padding:0 0 10px 0; background:url(style/page_line.gif) repeat-x top; line-height:27px; }
.page_top span { float:right; }
.page_top a { margin:0 10px; }

/* 分页 */
.page{ height:30px; margin:0 0 5px 0; background:url(style/page_line.gif) repeat-x top; line-height:30px; clear:both; }
.page_line { background:url(style/page_line.gif) repeat-x top; }
.page .recordcount { float:left; width:140px; padding-left:7px; font-size:12px; }
.page .page_no { float:left; width:475px; font-family:Verdana; text-align:center; }
.page .page_no span { font-size:11px; padding:0 10px; }
.page .page_no a { padding:0 5px; }
.page .page_no span a { padding:0 2px; }
.page .page_no .current { color:#cc6600; font-weight:bold; text-decoration:underline; }
.page .top { float:right; width:55px; font-size:12px; text-align:center; }
.message_page .page_no { float:right; padding-right:26px; text-align:right; }

/* 表单 */
.inputbox{ width:710px; margin:10px 0 30px 0; text-align:left; clear:both; }
.inputbox p { text-align:left; clear:both; zoom:1; }
.inputbox .ibl { float:left; width:75px; padding-right:2px; padding-top:13px; color:#555555; text-align:right; }
.inputbox .ibr { float:left; padding-top:10px; +padding-top:8px; color:#555555; text-align:left; }
.input { border:1px solid #B2B2B2; background:#f8f8f8; color:#555555; }

/* 在线留言 */
.message { width:700px; margin:25px auto 10px; color:#333; line-height:20px; }
.bgmessage { position:relative; padding:5px 10px 10px 10px; border:1px solid #ddd; background:#eee; color:#333; }
.message .replyTitle { margin:5px 10px 0 10px; color:#D6990C; }
.message .replyContent { margin:0 10px 10px 10px; }

/* 在线订购 */
.right .orderOnline { margin:8px 0; font-weight:bold; font-size:14px; text-align:right; }
.order { width:645px; margin:20px auto 0 auto; }
.orderlist { border-collapse:collapse; }
.orderlist th, .orderlist td { border:1px solid #ccc; }
.orderlist td { padding:5px; }
.orderBottom { margin-top:20px!important; margin-bottom:40px; text-align:center; }
.orderBottom a { margin:20px; color:#333; text-decoration:underline; }

/* 联系我们 */
.contact { width:680px; margin:25px auto 0; padding:5px 10px 10px 10px; border:1px solid #ddd; background:#eee; color:#333; line-height:20px; }
.map { width:591px; margin:0 auto; padding:5px; border:1px solid #ddd; border-top:none; background:#fff; }

/* 首页 */
.siteL { float:left; width:449px; min-height:165px; _height:165px; }
.siteM { float:left; width:359px; min-height:165px; _height:165px; }
.siteR { float:left; width:180px; min-height:165px; _height:165px; }

.siteL h1,.siteM h1,.siteR h1,.left h1 { font-size:12px; line-height:21px; margin:0 15px; padding:7px 10px 0 12px; }
.siteL h1 { background:url(style/siteL_title.jpg) no-repeat left bottom; }
.siteM h1 { background:url(style/siteM_title.jpg) no-repeat left bottom; }
.siteR h1 { background:url(style/siteR_title.jpg) no-repeat left bottom; }
.more { float:right; color:#999; font-weight:100; }

/* 最新动态 */
.list_01 { margin:6px 15px 0 15px; }
.list_01 ul li { padding:1px 5px 2px 8px; background:url(bg_news_list_line.gif) repeat-x bottom; color:#333; line-height:20px; clear:both; }
.list_01 ul li a { padding-left:5px; color:#555; }
.list_01 ul li a:hover { color:#cc6600; text-decoration:underline; }
.list_01 .bg { background:#eee; }
.list_01 .date { float:right; padding:0 10px 0 8px; color:#a1a1a1; font-size:11px; font-family:Arial; }
.list_01 .ico { float:left; width:6px; _width:3px; height:20px; margin:0; background:url(style/arrow_02.gif) no-repeat 0 8px; }

/* 产品中心 */
.product { float:left; margin:0 0 0 10px; padding:0 29px; display:inline; }
.product .pic_list { float:left; margin:10px 0 0 0; padding:0; }
.product .pic_list .pic { margin:0 auto; border:1px solid #bbb; }
.product .pic_list .pic span { display:block; padding:5px; }
.product .pic_list .txt { margin:0 auto; padding:8px 0 0 0; line-height:20px; text-align:center;  background:url(style/bg_pic_title.jpg) repeat-x top #fff; }
.product .pic_list .txt a { color:#555; }
.product .pic_list .txt a:hover { color:#cc6600; }

/* 底部 */
.footer { width:990px; min-height:60px; _height:60px; margin:0 auto; color:#afaaa5; line-height:150%; }
.footer:after { content:'\0020'; display:block; height:0; clear:both; }
<style type="text/css">
<!--
body,td,th {
 font-family: Verdana, Geneva, sans-serif;
 font-size: 100%;
 color: #666;
}
body {
 background-color: #fff;
 margin-left: 20px;
 margin-top: 20px;
 margin-right: 20px;
 margin-bottom: 20px;
} 
 
a, a:hover, a:active, a:focus {
 outline:0; 
 direction:ltr;
}
 
.wrapper {
 position:relative; height:25px;
}
 
.mainmenu {
 position:absolute; 
 z-index:100;
 font-family:Verdana, Geneva, sans-serif;
 font-weight:normal;
 font-size:90%;
 line-height:25px;
 left:50%; 
 margin-left:-303px; 
 width:606px;
} 
 
ul.menu {
 padding:0; 
 margin:0; 
 list-style:none; 
 width:100px; 
 overflow:hidden; 
 float:left; 
 margin-right:1px;
} 
 
ul.menu a {
 text-decoration:none; 
 color:#fff; 
 padding-left:5px;
}
 
ul.menu li.list {
float:left;
width:250px;
margin:-32767px -125px 0px 0px;
background:url(images/top1.png) no-repeat left bottom;
}
 
ul.menu li.list a.category {
position:relative;
z-index:50;
display:block;
float:left;
width:120px;
margin-top:32767px;
background:transparent;
}
 
ul.menu li.list a.category:hover,
ul.menu li.list a.category:focus,
ul.menu li.list a.category:active {
 margin-right:1px;
 background-image:url(images/tophover1.png);
 background-repeat:no-repeat;
 background-position:left top;
}
 
ul.submenu {
 float:left; 
 padding:25px 0px 0px 0px; 
 margin:0; 
 list-style:none; 
 background-image:url(images/tophover1.png);
 background-repeat:no-repeat;
 background-position:left top;
 margin:-25px 0px 0px 0px;
}
 
ul.submenu li a {
float:left;
width:120px;
background:#369;
clear:left;
}
 
ul.submenu li a.endlist {
 background:url(images/bottom1.png);
}
 
ul.submenu li a.endlist:hover,
ul.submenu li a.endlist:focus,
ul.submenu li a.endlist:active {
background:url(images/bottomhover1.png);
}
 
ul.submenu a:hover,
ul.submenu a:focus,
ul.submenu a:active {
background:#900;
margin-right:1px;
}
-->
 
 
</style>
 
 
<div class="wrapper">
<div class="mainmenu">
<ul class="menu">
<li class="list">
 <a class="category" href="#Home">Home</a>
</li>
</ul>
<ul class="menu">
<li class="list">
 <a class="category" href="#about">About Us&nbsp;&nbsp;&raquo;</a>
 <ul class="submenu">
  <li><a href="#about1">About link 1</a></li>
  <li><a href="#about2">About link 2</a></li>
  <li><a href="#about3">About link 3</a></li>
        <li><a href="#about4">About link 4</a></li>
  <li><a class="endlist" href="#about5">About link 5</a></li>
 </ul>
</li>
</ul>
<ul class="menu">
<li class="list">
 <a class="category" href="#articles">Articles&nbsp;&nbsp;&raquo;</a>
 <ul class="submenu">
  <li><a href="#articles1">Articles link 1</a></li>
  <li><a href="#articles2">Articles link 2</a></li>
  <li><a href="#articles3">Articles link 3</a></li>
  <li><a class="endlist" href="#articles4">Articles link 4</a></li>
 </ul>
</li>
</ul>
<ul class="menu">
<li class="list">
 <a class="category" href="#news">News&nbsp;&nbsp;&raquo;</a>
 <ul class="submenu">
  <li><a href="#news1">News link 1</a></li>
  <li><a href="#news2">News link 2</a></li>
  <li><a class="endlist" href="#news3">News link 3</a></li>
 </ul>
</li>
</ul>
<ul class="menu">
<li class="list">
 <a class="category" href="#donate">Donate</a>
</li>
</ul>
<ul class="menu">
<li class="list">
 <a class="category" href="#contact">Contact</a>
</li>
</ul>
<!-- end mainmenu --></div>
<!-- end wrapper --></div>