body {
margin:0px;
text-align:center;
background-image:url(../image/bg/selfstudy_bg.jpg);
font-size:12px;
text-decoration:none;
}

a{ font-family:ËÎÌå; font-size:12px; font-weight:normal; text-decoration:none; color:#000000}
a:link{ font-family:ËÎÌå; font-size:12px; font-weight:normal; text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{color: #ff6600;text-decoration: underline;}
a:active{color: #ff6600;}
.line {border-style:solid; border-width:1px 0px 0px 0px;}
.naviverticalline {border-style:solid; border-width:0px 1px 0px 0px; border-color:#1a5496;height:100%; float:left}

#seachform {color:#0055aa;}
#iptbar1 {width:125px;border-width:1px; border-style:solid; border-color:#ff6600;background-color:#fcfcfc;filter:alpha(opacity=75)}
#iptbar2 {width:125px;border-width:1px; border-style:solid; border-color:#ff6600;background-color:#ffffff;filter:alpha(opacity=100)}
#iptbtn1 {background-color:#ffffff; color:#ff6600 ;cursor:pointer; border-width:1px; border-style:solid; border-color:#ff6600; height:20px; line-height:150%;filter:alpha(opacity=80)}
#iptbtn2 {background-color:#ff6600; color:#ffffff ;cursor:pointer; border-width:2px 1px 0px 1px; border-style:solid; border-color:#ff6600; height:20px; }

#container {
width:820px;
margin:0 auto;
background-image:url(../image/bg/bg_005.png);
}
#con{ width:800px; margin:0 auto;}
#head {
width:100%;
height:177px;
text-align:left;
background-color:#FFFFFF;
}
#content {
width:790px;
height:1000px;
background: #FFFFFF;
padding:0px 5px;
text-align:left;
}
#foot { width:100%;
height:50px;
margin-top:30px;
background-color:#26170f;
font-size:14px;
font-family:"ºÚÌå";
color:#f7f7f7; line-height:50px;
border-color:#000;
border-style:solid;
border-width:1px 0 0 0;
}
#navigation {
width:446px;
height:30px;
padding-left:344px;
background-color:#296dc0;
}
#navigation a {
display:block;
float:left;
padding:7px 18px;
color:#ffffff;
letter-spacing:0px;
font-size:13px;
text-decoration:none;
}
#navigation a:hover {
background-color:#ff6600;
color:#ffffff;
}
#left {
width:160px;
height:800px;
background-color:#ecf4f8;
float:left;
margin-top:10px;
}
#right {
width:630px;
height:800px;
background-color:#ffffff;
float:left;
margin-top:10px;
}
#headpanel {
width:788px;
height:48px;
border-width:1px;
border-color:#d5e4ed;
border-style:solid;
background-color:#ffffff;
}
#headpanel a { margin-right:20px;}
.headpanel1 { height:26px; border-style:solid; border-color:#d5e4ed; border-width:0px 0px 1px 0px; line-height:200%;text-indent:1em;}
#headpanel2 { padding-left:525px;height:21px; background-color:#ecf4f8;text-indent:1em; vertical-align:bottom}
.titlepanel_line {
width:100%;
height:24px;
border-style:solid;
border-color:#d1dfe8;
border-width:0px 0px 1px 0px;
color:#0055aa;
text-indent:1em;
letter-spacing:1px;
font-size:13px;
text-decoration:none;
font-weight:bold;
line-height:200%;
}
.titlepanel_L {
width:303px;
height:200px;
margin-left:10px;
margin-bottom:10px;
float:left;
border-color:#d1dfe8;
border-style:solid;
border-width:1px;
}
.titlepanel_XL {
width:620px;
height:80px;
float: left;
margin-left:10px;
margin-bottom:10px;
background-color:#ecf4f8;}
.titlepanel_S {
width:198px;
height:135px;
float:left;
margin-left:10px;
margin-bottom:10px;
border-color:#d1dfe8;
border-style:solid;
border-width:1px;}
#content {
background:url(../image/bg/self_study_bg.jpg) no-repeat; padding:0px; width:800px; height:2550px;}
#bookcase { width:770px; height:2550px; margin:0px 14px 16px}

<!--************************************************************************************navi************************************************************************************--->
#lists {margin-top:50px; height:300px; width:770px;list-style:none; } 
#lists li {display: inline; float:left; width:82px; height:110px; margin:59px 21px 2px; background:url(../image/bg/book_bg.jpg) no-repeat;z-index:500;}
#lists li a.tl {display:block; width:80px; height:110px;text-decoration:none;border-style:solid; border-color:#555; border-width:1px}
#lists li p.tp {display:block; width:81px; height:28px; margin-top:-36px; text-decoration:none; font-size:12px; font-family:"ºÚÌå"; font-weight: bold; color:#fff; background:#111;filter:alpha(opacity=80); border-style:solid; border-color:#888; border-width:1px 1px 1px 0px; text-align:center }
#lists :hover p.tp { cursor: pointer;}

#lists div { display:none;width:200px;border:1px solid #888; margin-left:-50px; margin-top:-6px;position:absolute;float:left; background:#f5eef0;}

#lists li a:hover {white-space:normal;}
#lists li:hover > a {white-space:normal;}

#lists :hover div.p1 {display:block;width:400px;}
#lists :hover div.p2 {display:block;}

#lists .two:hover {position:relative;}
#lists .single:hover {position:relative;}

#lists .two:hover div.pos3 {background:#f5eef0; width:300px;}
#lists .single:hover div.pos4 {background:#ffefd5; width:150px;}

#lists :hover div dl {display:inline; padding:0; margin:0 10px 10px 10px; float:left; width:180px;}
#lists :hover div dl dt {width:180px; background:#222; text-indent:10px; margin:10px 0 5px 0; text-decoration:none; height:20px; line-height:20px; font-weight:normal;font-size:10pt; color:#fff;}

#lists .two:hover div {left:-150px;}
#lists .two:hover div dl {width:129px;}
#lists .two:hover div dl dt {width:129px;}

#lists .single:hover div dl {width:129px;}
#lists .single:hover div dl dt {width:129px;}

#lists :hover div dl dd {padding:0; margin:0;}

#lists :hover div dt a {text-decoration:none; cursor:default;}
#lists :hover div dd a {display:block; text-decoration:none; font-weight:normal; font-size:12px; color:#000; text-indent:10px; line-height:18px;}
#lists :hover div dd a:hover {text-decoration:underline;  color:#ff0000;}

#lists .clear {clear:both;}