/**

* Description：Layout CSS for the website

* Author：Gavin

* E-mail: shengzhizhang@gmail.com

* Created On：2008-10-27

* Last modification On：2010-3-8

**/



/***** Container *****/

#container {

background:#fff;

margin:0 auto;

width:1002px;

}



/***** Header *****/

#header{

position: relative;

z-index: 10;

}

#headTop {

height:83px;

position:relative;

z-index: 10;

}



/***** Logo *****/

#logo {

left:0;

position:absolute;

top:0;

}



/***** Secondary navigation *****/

#secondaryNav {

position:absolute;

right:10px;

top:10px;

text-align:right;

}

#secondaryNav li {

display:inline;

float:right;

margin:0 8px;

}

#secondaryNav li a:hover {

text-decoration:underline; 

}



#searchbar{

position: absolute;

right: 50px;

top: 86px;

}



/***** HeadContact *****/

#headContact {

position:absolute;

right:20px;

bottom:10px;

text-align:right;

}

#headContact a{

margin: 0px 5px;

}



/***** Banner *****/

#banner {

overflow:hidden;

height: 167px;

}

#banner img{

display: block;

}



/***** Main *****/

#main {

overflow: hidden;

text-align:left;

border-bottom: 1px solid #C1C1C1;

padding: 3px 0;

}



/***** Sidebar *****/

#sidebar {

float:left;

width:240px;

}



/***** Content *****/

#content {

float:right;

width:730px;

padding:15px;

}



/***** Footer *****/

#footer {

background:#EDEEEE;

padding:20px;

border-top: 1px solid #fff;

}

#copyright {

line-height:20px;

}



/***** Index modules *****/

#columnLeft{

float: left;

width: 210px;

}

#columnCenter{

float: left;

display: inline;

margin-left: 25px;

width: 500px;

}

#columnRight{

float: right;

width: 242px;

}

.title{

background-color: #E6E6E6;

height: 26px;

line-height: 26px;

overflow: hidden;

position: relative;

z-index:1;

}

.title h2{

background: url(icon_title.gif) no-repeat 10px 50%;

font-size: 15px;

font-family: "微软雅黑";

color: #212121;

padding-left: 30px;

}

.title h2 em{

font-style: normal;

color: #DE1B19;

}

.title span{

position: absolute;

right: 10px;

top: 0;

}

.title span a{

color: #333;

}

.title span a:hover{

color: #f00;

}

.title span a.more{

width: 45px;

height: 12px;

display: block;

overflow: hidden;

text-indent: -9999em;

background: url(btn_more.gif) no-repeat 0 0;

margin-top: 6px;

}

#service .content{

padding:8px;

line-height:23px;

}



/***** Sub navigation *****/

#subNav {

margin:10px auto 20px;

width: 201px;

}

#subNav h2 {

font-size:14px;

line-height:32px;

text-align:left;

margin-bottom: 8px;

}

#subNav ul li {

float:left;

font-size:13px;

width:100%;

background: url(listDiv01.gif) repeat-x 0 100%;

padding-bottom: 1px;

}

#subNav ul ul {

display:none;

}

#subNav ul li a {

background:url(listIcon01.gif) no-repeat 0 50%;

display:block;

line-height:14px;

padding:8px 0 8px 20px;

}

#subNav ul li a.current{

color:#f00; 

background:#EBEBEB;

}

#subNav ul li li{

border-bottom: 1px solid #fff;

padding-bottom: 0;

}

#subNav ul li li a {

background:#F7F7F7;

padding:6px 0 6px 50px;

}



/***** Inside Pages *****/

#inside #main{

background: url(bg_main_top.gif) repeat-x 0 0;

padding: 0;

}

#mainWrap1{

background: url(bg_main_bottom.gif) repeat-x 0 100%;

width: 100%;

padding: 8px 0;

}

#mainWrap2{

background: url(bg_sidebar.gif) repeat-y 241px 0;

}

#mainTitle{

border-bottom: 1px solid #BDBDBD;

position: relative;

z-index: 1;

height: 24px;

line-height: 24px;

}

#mainTitle h2{

background: url(bg_main_title.gif) no-repeat 10px 50%;

font-size: 14px;

padding-left: 25px;

}

#mainTitle span{

position: absolute;

right: 10px;

top: 0;

}

#function {

font-size: 13px;

line-height:22px;

}

#sideService .title{

background: url(listDiv02.gif) repeat-x 0 100%;

}

#sideService .title h2{

background: none;

padding-left: 5px;

}

#sideService .content{

padding: 8px;

}



#message{

padding:15px;

line-height:22px;

}



/***** Product list *****/

.productList {

text-align:left;

}

.productList li {

display: -moz-inline-stack;

display:inline-block;

*display:inline;

vertical-align: top;

zoom:1;

width:49.5%;

min-height:60px;

_height: 60px;

padding: 15px 0;

}

.productList .proImage {

float: left;

width:108px; 

display: inline;

margin: 0 10px;

}

.productList .proImage a img {

display:block; 

border:#BFBFBF 1px solid;

padding:4px;

width:98px;

height:98px; 

}

.productList .proImage a:hover img {

border-color:#EB6E29;

}

.productList .proInfo{

padding: 0 16px 0 125px;

line-height: 20px;

}

.productList .proInfo strong{

display: block;

font-size: 13px;

margin: 8px 0;

}

.productList .proInfo strong a{

color: #225EB0;

}

.productList .proInfo strong a:hover{

color: #C84443;

}

.productList02 li{

padding:9px 0 5px 0;

}

.productList02 .proImage{

width: 65px;

}

.productList02 .proImage a img {

padding:1px;

width:61px;

height:61px; 

}

.productList02 .proInfo{

padding: 0 16px 0 85px;

line-height: 18px;

}

.productList02 .proInfo strong{

margin: 3px 0;

line-height: 22px;

font-weight: normal;

color: #C84443;

background: url(listDiv01.gif) repeat-x 0 100%;

}

.productList .zebra li{

height: 120px;

}

.productList .zebra li.hilight{

background: #F7F7F7;

}



/***** News list *****/

.newsList {

margin:0 auto;

}

.newsList li {

float:left;

line-height:14px;

padding:10px 0;

position:relative;

text-align:left;

width:100%;

background: url(listDiv01.gif) repeat-x 0 100%;

}

.newsList li a {

background:url(listIcon01.gif) no-repeat 0 0;

*background-position:0 -2px;

padding-left:20px;

}

.newsList li span {

color:#999;

position:absolute;

right:10px;

}

.newsList .zebra li{

background: none;

}

.newsList .zebra li.odd{

background: #F2F2F2;

}

.newsList02 li{

padding:8px 0; 

}

.newsList02 li a{

background-image:url(listIcon02.gif);

}

.news_img{

text-align: center;

margin-top: 10px;

}



/***** Pagination *****/

.pagination {

height:22px;

padding:30px 0;

}

.pagination span, .pagination a {

background:#fff;

border:1px solid #ddd;

display:inline;

float:left;

height:20px;

line-height:20px;

margin-right:4px;

padding:0 8px;

}

.pagination a:hover {

background:#EDFEFF;

border-color: #78D0D6;

color:#0B93C6;

}

.pagination .current {

border:none;

color:#f00;

font-weight:bold;

}

.pagination .pr_off, .pagination .nt_off {

color:#ccc;

}



/***** Question list *****/

.questionList dt, .jobList dt {

font-weight:normal;

margin-top:10px;

}

.questionList dt span, .jobList dt span {

cursor:pointer;

font-weight:bold;

margin:0 4px;

}

.questionList dd, .jobList dd {

border:#ccc 1px solid;

padding:6px 10px;

}



/***** Video list *****/

td.videoList a {

background:#fff url(videoIcon.jpg) no-repeat left 50%;

padding-left:25px;

}

div.videoShow {

background:#fff;

border:solid 1px #eee;

margin:0 auto;

padding:10px;

text-align:center;

width:80%;

}

div.videoShow h4 {

background:url(videoIcon.jpg) no-repeat left 50%;

font-size:14px;

height:50px;

line-height:50px;

margin:0 auto;

padding-left:25px;

text-align:left;

width:80%;

}



/***** Search result list *****/

#mainContentSearch {

margin:30px;

}

.searchTitle {

background:#f8f8f8;

border:1px solid #ddd;

border-width:1px 0;

line-height:22px;

padding:0 10px;

}

.searchTitle a {

background:url(listImg.gif) no-repeat right 50%;

padding-right:10px;

}

#mainContentSearch strong {

padding-left:2em;

}

.resultTopicTitle {

}

#mainContentSearch .newsList {

width:100%;

}



/***** Webmap *****/

#webmap {

padding:20px 20px 20px 80px;

}

.mapList ul {

margin-left:40px; 

margin-bottom:3px;

padding-bottom:12px; 

background:url(ulBg.gif) repeat-y 0 0;

}

.mapList ul ul{

padding:0; 

}

.mapList ul li{

line-height:19px;

margin-top:5px; 

float:left;

width:100%; 

}

.mapList li a{

height:19px; 

line-height:19px; 

display:inline-block; 

background:url(webmapBg.gif) no-repeat 100% -19px;

}

.mapList li a span{

display:inline-block; 

height:19px; 

line-height:19px; 

background:url(webmapBg.gif) no-repeat 0 -57px;

padding:0 20px 0 40px; 

cursor:pointer;

white-space:nowrap;

}

.mapList li a:hover{

background-position:100% 0;

}

.mapList li a:hover span{

background-position:0 -38px;

}

.mapList li a.firstItem{

background-position:100% 0;

}

.mapList li a.firstItem span, .mapList li a.firstItem:hover span{

background-position:-19px -38px;

padding:0 20px; 

}

.mapList li a.lastChild span{

background-position:0 -95px;

}

.mapList li a.lastChild:hover span{

background-position:0 -76px;

}



/***** Article *****/

.article h3 {

border-bottom:1px solid #ddd;

font-size:14px;

line-height:28px;

text-align:center;

}

.article .newsDate {

line-height:22px;

margin-bottom:16px;

text-align:center;

}



/***** Related news list *****/

.relatedNews {

padding:10px;

}

.relatedNews h3 {

font-size:14px;

margin-bottom:8px;

}

.relatedNews a {

background:url(listIcon06.gif) no-repeat 0 50%;

line-height:22px;

padding-left:12px;

}



/***** Product details *****/

.productImg{

width: 369px;

height: 252px;

margin: 30px auto;

}

.largeImg{

width: 252px;

float: left;

}

.thumbnails{

float: right;

width: 106px;

padding-left:10px;

}

.thumbnails li{

float: left;

margin-bottom: 5px;

}

.thumbnails img{

width: 54px;

height: 54px;

margin-bottom:5px;

}

.largeImg img, .thumbnails img{

display: block;

border: 1px solid #BBBCBC;

}

.thumbnails li.active img{

border-color: #000;

}

.productDescription{

width: 680px;

margin: 0 auto;

background: url(listDiv01.gif) repeat-x 0 0;

padding: 20px 0;

}

.productDescription h1{

text-align: center;

font-size: 14px;

color: #2F2F2F;

}

.productDescription h1 span{

margin: 0px 10px;

}

.productDescription p{

}



/***** Form elements *****/

fieldset {

border:none;

padding-left:60px;

}

fieldset legend {

font-weight:bold;

height:40px;

line-height:40px;

*margin-left:-7px;

}

fieldset ol {

list-style: none;

margin-top: 1em;

}

fieldset li {

display:inline;

float: left;

padding-bottom: 1em;

width: 100%;

}

fieldset li label {

float: left;

line-height:20px;

margin-right:1em;

text-align: left;

}

fieldset li .tips {

display:inline;

float:left;

line-height:18px;

margin-left:10px;

width:8em;

}

fieldset input.text, fieldset textarea {

display:inline;

float:left;

font:12px Arial, Helvetica, sans-serif;

outline:none;

padding:2px;

width:300px;

}

fieldset em {

float:left;

text-align:center;

width:7px;

}

fieldset input.text2 {

width:42px;

}

fieldset input.text3 {

width:145px;

}

fieldset textarea {

height:8em;

}

/*.focusField {

border:solid 1px #83C6FA;

background:#F6FCFF;

color:#000;

padding:1px;

}

.idleField {

background:#fff;

color: #6F6F6F;

padding:1px;

border: solid 1px #ddd;

}*/



/***** pageNav *****/

.pageNav {

padding:20px;

text-align:center; 

}



/***** Default buttons *****/

button { 

position: relative;

border: 0; 

padding: 0;

height:24px; 

vertical-align:middle;

cursor: pointer;

overflow: visible; /* Remove the self-propagation of the width in Internet Explorer */

}

button::-moz-focus-inner {

border: none;  /* Additional padding covering Firefox */

}

button span, .pageNav a span { 

position: relative;

display: inline-block; 

white-space: nowrap;

cursor: pointer;

}

@media screen and (-webkit-min-device-pixel-ratio:0) {

/* To amend the margin of Safari and Chrome */

button span {

margin-top: -1px;

}

}



/* Customize buttons: */		

.defaultBtn { 

padding: 0 10px 0 0; 

margin-right:5px; 

font-size:12px; 

font-family:Verdana, Geneva, sans-serif;

text-align: center; 

background: transparent url(btn_default_bg.gif) no-repeat 100% -60px; 

display:inline-block;

height:24px; 

}

.defaultBtn span {

padding: 5px 0 0 10px; 

height:19px; 

background: transparent url(btn_default_bg.gif) no-repeat 0 0; 

color:#445560; 

}

.defaultBtn:hover, .defaultBtnHover { /* Extra defaultBtnHover for IE6 */

background-position: 100% -90px; 

}

.defaultBtn:hover span, .defaultBtnHover span {

background-position: 0 -30px;

color:#052028; 

}



/***** Member *****/

#member {

position:relative;

width:100%;

}



/***** Member tools *****/

.toolbar {

position:absolute;

right:0;

text-align:right;

top:0;

background:#fff;

}

#toolbarHandler {

text-align:center;

position:absolute;

right:0;

top:0;

border:1px solid #C1D7E4;

border-width:1px 2px 1px 1px;

height:24px;

line-height:24px;

overflow:hidden;

width:80px;

}

#toolbarHandler img, .toolbar ul a img {

vertical-align:middle;

}

#toolsList {

text-align:left;

display:none;

}

.toolbar ul {

border:1px solid #C1D7E4;

border-width:1px 2px 1px 1px;

padding-top:25px;

width:150px;

}

.toolbar ul li {

float:left;

width:100%;

border-bottom:1px solid #C1D7E4;

}

.toolbar ul a {

display:block;

height:34px;

line-height:34px !important;

overflow:hidden;

}



.links ul{

display:block;

}

.links li {

width:33.3%;

float:left;

padding:10px 0;

text-align:center;

height:70px;

}



.environment li {

float:left;

padding:10px 0; 

width:33.3%;

min-height:170px;

_height: 170px;

}



.environment img {

display:block; 

border:#ddd 1px solid;

padding:2px;

width:210px;

height:150px; 

}



.environment  span {

cursor:pointer;

display:block;

overflow:hidden;

text-align:center;

color:#333;

margin:4px auto 0;

line-height:20px;

}