@charset "utf-8";
*{ margin:0; padding:0}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #666;
	margin:0;
	padding:0;
	background: url(body_bg.png) 0 0 repeat-x #fee45b;
	font-size:13px;
	font-family:microsoft yahei, Arial, Helvetica, sans-serif;
}
ul,li{ list-style:none;}
img{ border:0;}
a{ text-decoration:none; color:#666;}
a:hover{ color:#F06}
#top a{
	width:890px;
	margin:0 auto;
	height:98px;
	background-image: url(topbg.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	display:block;
}

#main{
	width:890px;
	margin:0 auto;
	border:1px solid #eaeaea;
	border-radius:20px;
	background:#fff;
	background: -moz-linear-gradient(top, #f5f5f5 0%, #fff 100px); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5),color-stop(100px,#fff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f5f5f5 0%, #fff 100px); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f5f5f5 0%, #fff 100px); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f5f5f5 0%, #fff 100px); /* IE10+ */
	background: linear-gradient(top, #f5f5f5 0%, #fff 100px); 
	position:relative;
	padding-top:25px;
	}
.loginbtn{ width:31px; position:absolute; top:60px; left:-32px; height:65px;border-radius:10px 0 0 10px; background:url(login.gif) no-repeat 0 0; z-index:1000;}
.loginbtn:hover{ background:url(login.gif) -31px 0 no-repeat;}

#apDiv {
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	z-index:1001;
	display:none;
}
.apDivsub{ position:relative; width:100%; z-index:1000;}
.apDivbg{ position:absolute; top:0; left:0; width:100%;  background:#000; z-index:1000;}
.loginbox{position:relative; z-index:1001; width:350px; height:220px; margin:150px auto; background:#fff; border:4px solid #ccc; position:relative;}
.loginbox h1{ color:#388df7; font-size:15px; margin:0 20px 10px 20px; line-height:35px; border-bottom:1px solid #ccc;}
.loginbox ul{ width:310px; height:180px; margin:0 auto; }
.loginbox ul li{ padding-bottom:10px; width:272px; margin:0 auto;overflow:auto; zoom:1;}
.loginbox p{ float:left; line-height:26px; font-size:13px;}
.loginbox p.left{ width:70px;}
.loginbox p.right{ width:202px;}
.loginbox p.btn{ float:none; text-align:center; margin-top:10px;}
.loginbox input{ height:26px;}
.loginbox input.username,.loginbox input.pwd{line-height:26px; font-size:13px; color:#666; border:1px solid #ccc; width:200px;}
.close{ width:20px; height:20px; cursor:pointer; background:url(../images/X.gif) no-repeat; position:absolute; top:10px; right:24px;}

	
.btn1{
	position:absolute;
	top:115px;
	left:-32px;
	height:107px;
	width:31px;
	background:url(btnsel.gif) 0 0 no-repeat;
	z-index:1000;
	border-radius:10px 0 0 10px;
	}
.btn1:hover{
	width:40px;
	background:url(btnsel.gif) 0 0 no-repeat;
	}
.btn1sel{
	position:absolute;
	top:115px;
	left:-32px;
	height:107px;
	width:40px;
	border-radius:10px;
	background:url(btnsel.gif) 0 0 no-repeat;
	z-index:1003;
	
	}
.btn2{ 
    position:absolute;
	top:197px;
	left:-32px;
	height:107px;
	width:40px;
	background:url(btnsel2.gif) 0 -107px no-repeat;
	z-index:1000;
	border-radius:10px;}
.btn2:hover{
	background:url(btnsel.gif) 0 -107px no-repeat;
	z-index:1000;
	}
.btn2sel{
	position:absolute;
	top:197px;
	left:-32px;
	height:107px;
	width:40px;
	border-radius:10px;
	background:url(btnsel.gif) 0 -107px no-repeat;
	z-index:1003;
	}
.btn3{ 
    position:absolute;
	top:279px;
	left:-32px;
	height:107px;
	width:31px;
	background:url(btnsel.gif) 0 -214px no-repeat;
	z-index:1000;
	border-radius:10px 0 0 10px ;}
.btn3:hover{
	width:40px;
	background:url(btnsel.gif) 0 -214px no-repeat;
	z-index:1000;
	}
.btn3sel{
	position:absolute;
	top:279px;
	left:-32px;
	height:107px;
	width:40px;
	border-radius:10px;
	background:url(btnsel.gif) 0 -214px no-repeat;
	z-index:1003;
	}

.booklisttop{ font-size:14px; margin:0 45px; border-top:1px solid #ccc; padding:10px 0; color:#000;}
.booklist{ overflow:auto; zoom:1; width:850px; margin:0 auto;}
.booklist li {
	text-align: center;
	display: block;
	float: left;
	height: 220px;
	width: 170px;
}
.imgbox{ width:120px; height:160px; border:1px solid #ccc; border-radius:5px; margin:10px auto 0 auto;}
.booklist li p{ margin-top:5px;}

.slidebox{ width:800px; height:260px; margin:0 auto 25px auto;}
#container{ width:800px; height:260px; position:relative;}
#slider{ width:800px; height:260px; overflow:hidden;}
#slider img{ width:800px; height:260px;}
.next{ position:absolute; top:100px; left:-20px; width:54px; height:54px; background:url(lbutton.png) 0 0 no-repeat; z-index:10000; cursor:pointer}
.previous{ position:absolute; top:100px; right:-20px; width:54px; height:54px; background:url(rbutton.png) 0 0 no-repeat; z-index:10000; cursor:pointer}

.rembook{ width:800px; height:220px; margin:0 auto 10px auto;}
.remgame{ width:800px; margin:0 auto 10px auto; overflow:hidden;}
.remtop{ height:31px; border-bottom:1px solid #ccc;}
.remtop *{ display:inline-block;line-height:31px; font-weight:bold; border-radius:5px 5px 0 0; font-size:14px;}
.remtop span{ background:#e02e89; padding:0 25px; color:#fff;}
.remtop a{ color:#000; float:right;}
.remtop a:hover{ color:#e02e89;}

.rembook ul{ overflow:auto; zoom:1; display:block;}
.rembook ul li{ width:266px; float:left; overflow:hidden; zoom:1;}
.rembook ul li .imgbox{width:120px; height:160px; border:1px solid #ccc; border-radius:5px; margin-top:10px; float:left; background:#fff;}
.rembook ul li .desc{ float:left;margin-top:10px; width:120px; margin-left:10px; line-height:20px;}
.rembook ul li .desc a{ color:#F06; text-decoration:none; font-weight:bold;}
#hotgame{ overflow:hidden; zoom:1; width:1200px;}
#hotgame li{ width:120px; background:#fafafa; margin-right:15px; margin-top:5px; float:left;}
.imgbox img{ width:116px; height:156px; margin:2px;}
#hotgame .imgbox img{ width:100px; height:100px;} 
#hotgame .imgbox{ width:120px; height:100px; border:none; text-align:center;}
#hotgame li div.desc{ width:100px; margin:10px;} 
.copy{ width:800px; margin:0 auto; padding:10px 0; line-height:40px; border-top:1px solid #ccc; text-align:center}



.book_list {
	width:800px;
	margin:0 auto;
	overflow:hidden;
	zoom:1;
}

.book_list li {
	padding: .5em 0;
	border-bottom: 1px dotted #dadada;
	text-align: left;
	overflow: auto;
    zoom:1;
}

#gamelist .book_list li img.book_cover {
	float: left;
	width: 80px;
	height: 80px;
	margin: 0 1em 0 0;
	padding: 3px;
	border:none;
}

.book_list li img.book_cover {
	float: left;
	width: 80px;
	height: 100px;
	margin: 0 1em 0 0;
	padding: 3px;
	border: 1px solid #ddd;
}

.book_list li h3 {
	font-size:20px; padding-bottom:5px;
}

.book_list li h3 a {
	color: #000;
}

.book_list li h3 span {
	margin-left: 1em;
	color: #df8607;
}

.book_list li p {
	font: normal 12px/20px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #666;
}

.book_list li p a.btn_view {
	margin-right: 1em;
	display: inline-block;
	font: bold 12px/2 "Trebuchet MS", Arial, Helvetica, sans-serif;
	background: #F60;
	padding:0 10px;
	border-radius:5px;
	color: #fff;
}

.book_list li p a.btn_fav {
	display: inline-block;
	text-indent: 2em;
	font: bold 12px/2 "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #555;
	background-image: url(show/page_btn.png);
	background-repeat: no-repeat;
	background-position: 0 -40px;
}
.bookdetail,.bookshow {
	width: 800px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
.top{ overflow:auto; zoom:1;}
.topright{ float:right; margin-top:10px; width:660px;}
.topright h1{
	font-size:20px;
	color:#000;
	padding-bottom:10px;
}
.topright ul{ line-height:20px; height:100px;}

.mulu{ width:800px; margin:10px auto;}
.mulu h3{ font: 14px/30px; color:#000; border-bottom:1px solid #ccc;}
.mulu h3 span{ display:inline-block; border:1px solid #ccc; border-bottom:none; border-radius:5px 5px 0 0; padding:5px 10px; }
.mulu ul{ overflow:hidden; zoom:1;}
.mulu ul li{ display:block; float:left; margin:10px;  line-height:30px;}
.mulu ul li a{ display:inline-block;padding:0 10px;border:1px solid #ccc; cursor:pointer }
.mulu ul li a:hover{ background:#FC0; border:1px solid #FC0; color:#000;}
.mulu ul li a.sel{ background:#FC0; border:1px solid #FC0; color:#000;}
.mulu p{ padding:10px;}


.bookshow{ overflow:auto; zoom:1;}
.title{ font-size:16px; line-height:30px; color:#000; text-align:center; border-bottom:1px solid #ccc;}
.pagerbox{ text-align:center; margin-top:10px; padding:10px; border-bottom:1px solid #ccc;}
.pagerbox a{ display:inline-block; line-height:18px; padding:5px 10px; border:1px solid #ccc; margin:0 10px;}
.pagerbox a:hover{ background:#FC3;border:1px solid #FC3; color:#fff;}
.pagerbox select{ height:28px; width:60px; line-height:28px; margin:0 10px;}

.contbox{
	text-align:center;
	width:800px;
	height:500px;
	margin:20px 0;
	position: relative;
	overflow:hidden;
}
.contbox img{ height:500px;}

.prevpage1{ position:absolute;top:0; left:0; width:50%; height:500px; filter:alpha(opacity=0); background:#fff; -moz-opacity:0; opacity:0; cursor:pointer; outline:none;}
.prevpage1:hover{ background:url(prev.png) no-repeat 0 center;filter:alpha(opacity=100);  -moz-opacity:1; opacity:1;}
.nextpage1{ position:absolute;top:0; right:0; width:50%;height:500px;cursor:pointer; filter:alpha(opacity=0); background:#fff; -moz-opacity:0; opacity:0; outline:none;}
.nextpage1:hover{ background:url(next.png) no-repeat right center;filter:alpha(opacity=100); -moz-opacity:1; opacity:1;}

.download{ background:#f60; border:1px solid #f30;  padding:3px 8px; display:block; margin-top:3px; text-align:center; color:#fff;}
.download:hover{ background:#F33; color:#fff;}



.playerbox{ position:fixed; left:-480px; bottom:200px; width:500px; height:118px; z-index:1000; clear:both; overflow:hidden; zoom:1;}
.playerCont{ float:left; width:479px; height:118px; background:#292929; clear:both; overflow:hidden; zoom:1;}

.playerArrow{ float:right; width:21px;}
.playerArrow a{ display:block; height:118px; background:url(../images/player.png) no-repeat;}
.playerArrow a.opened{ background-position:-138px 0;}
.playerArrow a.closed{ background-position:right 0;}
.playerArrow a.opened:hover{background-position:-138px -118px;}
.playerArrow a.closed:hover{ background-position:right -118px;}

.process{ height:3px; background:#333; overflow:hidden;}
div.jp-seek-bar {background:#555;width:0px;height:100%;cursor: pointer;
}
div.jp-play-bar {background:#00acdd;width:0px;height:100%;}
.playerbox .imgbox{ width:90px; height:92px; margin:10px 15px; overflow:hidden; float:left;}
.playerbox .imgbox img{ width:100%;}
.programDesc{ float:left; margin-top:10px; width:160px;}
.bigplayer .playerCont{ width:100%}
.bigplayer .programDesc{ width:310px;}
.pTit{ color:#fff; font-size:18px; margin-bottom:8px;}
.bigplayer .pTit{ font-size:25px;}
.pSubTit,.pTime{ color:#999; margin-bottom:8px;}
.pTime span{ color:#fff; font-size:16px; margin-left:15px;}


.playerBtns{ width:190px; float:right;}
.playerBtns .playpauseBtn{ width:65px; height:65px; margin:10px auto; overflow:hidden;}
.playerBtns .playpauseBtn a{ display:block;width:65px; height:65px; background:url(../images/player.png) no-repeat;}
.playerBtns .playpauseBtn a.isPlay{ background-position:0 -26px;}
.playerBtns .playpauseBtn a.isPlay:hover{ background-position:0 -95px;}
.playerBtns .playpauseBtn a.isBuffer{ background:url(../images/loading1.gif) 0 0 no-repeat;}
.otherBtns a{width:16px; height:16px; display:block; float:left; overflow:hidden; margin-right:10px;background:url(../images/player.png) no-repeat; }
.otherBtns a.sharebtn{ background-position:-88px 0;}
.otherBtns a.sharebtn:hover{background-position:-104px 0;}
.otherBtns a.lovebtn{ background-position:-48px 1px;}
.otherBtns a.lovebtn:hover{ background-position:-69px 1px;}

.playerBtns .playpauseBtn a.isPause{ background-position:-70px -26px;}
.playerBtns .playpauseBtn a.isPause:hover{ background-position:-70px -95px;}

.volumeBox{ width:140px; height:16px; margin:0 auto; overflow:hidden; zoom:1;}
.volumeBox .icon{ width:18px; height:16px; float:left;}
.volumeBox .icon a{ display:block; height:16px; background:url(../images/player.png) 0 0 no-repeat;}
.volumeBox .icon a:hover{ background-position:-22px 0;}
.volumeBox .icon a.mute{ width:14px;}
.volumeBar{ float:left; position:relative; width:100px; height:3px; background:#666; margin:6px 0 6px 10px; overflow:hidden;}
.volumeBar div{ position:absolute;  height:3px; left:0; top:0; background:#00acdd}

