@charset "utf-8";
/* CSS Document */
body {}
#header {
    margin:auto;
    width:955px;
}
#wrapper {
    margin:0 auto;
    width:960px;
    padding:0 10px;
    overflow:auto;
}
#content {
    margin-left:337px;
    _height:1%;/*IE6hack*/
}
#side {
    float:left;
    width:332px;
}
#footer {
    clear:both;
    _height:1%;/*IE6hack*/
    margin:auto;
    width:955px;
    height:50px;
}


.vertical_line{ width:5px; height:200px; background-image:url(../imgs/vertical_line.gif); background-repeat:no-repeat; float:left}
.horizontal_line{ border-bottom-style:solid; border-color:#99cc33; border-width:1px; padding-top:36px;}
.more{ background-image:url(../imgs/arrow.gif); background-position:right; background-repeat:no-repeat;width:35px; height:16px; float:right; margin-top:12px;}
.boxlist{ background-image:url(../imgs/notice/list.gif); background-position:left; background-repeat:no-repeat; margin:3px 0 5px 20px; padding:0 0 0 10px; }


/*------各版塊設定-------*/
.divStartGame{ background-image:url(../imgs/board/startgame.gif); width:332px;height:129px; margin-bottom:5px;overflow:auto;}
.divStartGame ul{width:332px;overflow:auto;_height:1%;/*IE6hack*/ }
.divStartGame li{float:left; margin:7px 0 0 15px}

/*--------遊戲通告---------*/
.divGameAtt{
	background-image:url(../imgs/board/gameAtt_bg.jpg); 
	width:332px;height:102px; 
	margin-bottom:5px; 
	overflow: hidden;
	}
	
/*--------登入前---------*/
.attTitle{
	overflow:auto;
	}
.titlepic{
	width:114px;
	margin:0px 0px 0px 0px;
	float:left;
	}
.titleTxt{
	width:140px;
	margin:53px 5px 5px 90px;
	font-size: 15px;
}
.login{ 
	}
.bTalk{ 
	height:30px;
	padding-top:2px;
	margin-top:5px;
	background-image:url(../imgs/gameatt/sbtalk.png);
	background-repeat:no-repeat;
	background-position:center;
	clear: both;
		}
.btalkTxt{
/*	width:180px; */
	height:20px;
	margin:7px 20px 0px 90px;
	color: #FFF;
	font-weight: bold;
	font-size: 13px;
}
.boxInfo{
	width:305px;
	height:110px;
	margin:auto;
	background-image:url(../imgs/gameatt/infoboard.gif);
	}
.plusMan{ 
	height:55px;
	background-image:url(../imgs/gameatt/plus_man.gif);
	background-repeat:no-repeat;
	background-position:right;
	}
.plusManTxt{
	width:230px;
	height:40px;
	margin:5px 60px 5px 30px;
	padding-top:10px;
	text-align:center;}
.boxInfo ul{
	height:100px;
	padding:5px;
	}
.boxInfo ul li{
	height:35px;
	}
.row{
	width:300px;
	height:35px;
	}
/*--------遊戲通告 over---------*/

/*-------tab---------*/
.divInfoBoard{
	background-image:url(../imgs/board/infoboard.gif);  
	width:332px;
	height:281px;
	margin-bottom:5px; 
	overflow:auto;
	_height:1%;/*IE6hack*/
	position:relative;
	}
.InfoBoardTitle{ margin:6px 0 0 10px;}
.boxGame{ 
	width:164px;
	height:100%; 
	background-image:url(../imgs/info/game.gif);			
	background-repeat:no-repeat; 
	border-right-style:solid; 	
	border-color:#99cc33; 
	border-width:1px;
	float:left;
	line-height:20px;
	}
.boxEntertainment{ 
	width:165px;
	/* height:130px; */
	background-image:url(../imgs/info/entertainment.gif);			
	background-repeat:no-repeat; 
	position:absolute;
	top:100px;
	left:165px;
	overflow:auto;
	}
.boxShopping{
	width:164px;
	height:60px; 
	background-image:url(../imgs/info/shopping.gif);
	background-repeat:no-repeat;
	background-position:top;
	clear:both;
	border-right-style:solid; 	
	border-color:#99cc33; 
	border-width:1px;
	width:163px\9;
	margin-left:1px/9;
	overflow:auto;
	float:left;
	}
.boxshopping li{ margin-top:1px;}
.boxInformation{ 
	width: 167px;
	background-image:url(../imgs/info/information.gif); 
	/*margin:0 0 0px 164px;*/ 
	background-repeat:no-repeat; background-position:top; 		
	overflow:auto;
	_height:1%;
	height:125px;
	position:absolute;
	top: 0px;
	left: 165px;
	}


/*--------最新公告------------*/
.divNotice{background-image:url(../imgs/board/notice.gif);width:332px;height:250px;margin-bottom:5px; text-align:center; }
.boxNoticeTitle{ background-image: url(../imgs/notice/title.gif); background-position: left 5px; background-repeat:no-repeat; width:300px; height:40px; margin:auto;}


/*--------快速連結--------*/
.divQuickLink{background-image:url(../imgs/board/quicllink.gif); background-repeat:no-repeat; width:332px;height:162px; padding:0;}
.boxquickLink{float:left; margin-left:25px;}
.box2quickLink{margin-left:150px; padding:0;}
.nowupgrade{width:310px; height:20px; background-image:url(../imgs/quicklink/bottom.gif);margin:0 ;padding:0; background-repeat:no-repeat; background-position:bottom; position:relative; }
.gotouptxt{
	width:300px;
	_margin:-5px;
	*margin:-5px;
	position: absolute;/*FF*/
	*position: inherit;/*ie7*/
	_position: inherit;/*ie6*/
	padding:0; 
	}

/* root element for tabs  */
ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:1px solid #666;	
	height:32px;
	width:316px;
}

/* single tab */
ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a {
	background: url(../imgs/quicklink/linktitle.png) no-repeat 0px 0;
	font-size:15px;
	display:block;
	height: 33px;
	line-height:37px;
	width: 158px;
	text-align: center;
	text-decoration:none;
	padding:0px;
	margin:0px;
	position:relative;
	top:1px;
	outline: none; /* for Firefox */
	hlbr:expression(this.onFocus=this.blur()); /* for IE */
}

ul.tabs a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {
	background-position: -0px -33px;	
	/* color:#fff; */
}

/* active tab uses a class name "current". its highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs current a {
	background-position: 0px -65px;		
	cursor: pointer !important; 
	color:#578B3A !important;
}

/* initially all panes are hidden */ 
.panes .pane {
	display:none;		
}

/* tab pane styling */
.panes div {
	display:none;		
	padding:10px 10px;
	border:1px solid #99cc33;
	border-top:0;
	height:90px;
	background-color:#fff;
	width:294px;
	-moz-border-radius:0px 0 6px 6px;
	-webkit-border-radius:0px 0 6px 6px;
}
.quick{ background-image:url(../imgs/quicklink/tabicon.png); background-repeat:no-repeat; background-position: 25px 5px;width:158px;height:34px; margin-left:15px;}
.link{ background-image:url(../imgs/quicklink/tabicon2.png); background-repeat:no-repeat; background-position: 30px 7px;width:158px;height:34px; margin-left:15px;}



/*-----------大看板default----------------*/
.divBigBoard{background-image:url(../imgs/board/bigboard.gif); width:623px;height:384px;margin-bottom:5px; }
.bpic{width:580px; height:270px; margin: 0px auto ; position:absolute;}

/*-----------大看板 BFWeb----------------*/
.divShowCase{background-image:url(../imgs/board/showcase.gif); width:623px;height:293px;margin-bottom:5px; }
.bpic{width:580px; height:270px; margin-top:15px; margin-left:20px; position:absolute;}

/*------------Google 617_300------------*/
.divGoogleAD617x300{background-image:url(../imgs/board/google.gif); width:623px; height:90px; margin-bottom:5px; }
.iframeGAD{margin-top:15px; }

/*------------樂豆推薦------------*/
.divBeanRecommend{background-image:url(../imgs/board/beanrecommend.gif); width:622px;height:273px;margin-bottom:5px; overflow:auto;}
.divBeanRecommend ul{margin:10px 0 0 22px;}
.divBeanRecommend li{float:left;}
.beantabs a{background: url(../imgs/beanrecommend/tab.gif) no-repeat 0px -34px;
	font-size:15px;
	display:block;
	height: 33px;  
	line-height:37px;
	width: 113px;
	text-align:center;	
	text-decoration:none;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
	color:#999;}
.beantabs a:active {
	outline:none;		
}
.beantabs a:hover {
	background-position: 0px 0px;	
	color:#578B3A;	
}
.beanpic{ float:left; margin-left:20px; border:#CCC solid 1px; padding:3px}
.beanbox { width:200px; height:100px; margin-left:195px; }
.beanbox2 { width:170px; height:220px; float:right;margin-right:27px;margin-top:3px; background-image:url(../imgs/beanrecommend/book.gif); background-repeat:no-repeat;}
.beanbook{ width:150px; margin:8px 0px 0 6px;}
.beanquestion{ background-image:url(../imgs/beanrecommend/q.gif); background-repeat:no-repeat; margin-top:2px;padding-left:25px;margin-bottom:5px }


/*-----------遊戲情報-----------------*/
.divGameInfo{ background-image:url(../imgs/board/gameinfo.gif);width:623px;height:246px;margin-bottom:5px; }
.boxGameInfoTitle{background-image: url(../imgs/notice/title.gif); background-position: left 5px; background-repeat:no-repeat; width:570px; height:40px; margin:auto;}
/*------------scroll-----------------*/
/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {
	position:relative;
	overflow:hidden;
	width:530px;
	height:200px;
	margin:0px auto 0px;

}
/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;

}

.items div {
	float:left;
	width:530px;
	
}

/* single scrollable item */
.scrollable img {
	background-color:#fff;
	border:1px solid #ccc;
	width:160px;
	height:110px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	padding:3px
	
}
span.gameItem {
	float:left;
	margin:5px 3px 0px 8px;
	width:165px;
	height:180px;
	
}

/* active item */
.scrollable .active {
	border:2px solid #000;
	position:relative;
	cursor:default;
}
/*--------scroll end--------*/
/*----------scroll btn----------------*/
/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(../imgs/gameinfo/boardarrow.gif) no-repeat;
	display:block;
	width:20px;
	height:85px;
	float:left;
	margin:50px 5px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right 		{ background-position: 0px -86px; clear:right; margin-right: 0px;}
a.right:hover 	{ background-position:-20px -86px;}
a.right:active 	{ background-position:-40px -86px;} 


/* left */
a.left			{ margin-left: 20px;} 
a.left:hover  	{ background-position:-20px 0;}
a.left:active  	{ background-position:-40px 0;}

/* up and down */
a.up, a.down		{ 
	background:url(../img/scrollable/arrow/vert_large.png) no-repeat; 
	float: none;
	margin: 10px 50px;
}

/* up */
a.up:hover  		{ background-position:-30px 0; }
a.up:active  		{ background-position:-60px 0; }

/* down */
a.down 				{ background-position: 0 -30px; }
a.down:hover  		{ background-position:-30px -30px; }
a.down:active  	{ background-position:-60px -30px; } 


/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	
/*------------scroll btn over--------*/

/*-----------FUN樂專區---------------*/
.divFunVideo{background-image:url(../imgs/board/funvideo.gif); width:623px;height:315px;margin-bottom:5px; overflow:auto;}
.divFunVideo ul{margin:10px 0 0 22px;}
.divFunVideo li{float:left;}
ul.boxVideo { margin-left:27px;margin-top:0px;}
ul.boxVideo li{ text-align:center;margin:0px; }
ul.boxVideo li img{border:#CCC solid 1px; padding:3px}
.videoList {background-image:url(../imgs/funvideo/movie_icon.gif); background-repeat:no-repeat; background-position:20px 4px ; }
.videoSelect{ background-image:url(../imgs/funvideo/board.gif); background-position:-2px 5px; width:135px;height:205px; background-repeat:no-repeat; z-index:99; }
.videoSelectNone{ background-image: none; width:135px;height:205px;z-index:99; }
.BoxVideoTxt{width:574px; height:256px; margin: 0 auto; background-image:url(../imgs/funvideo/bottom-board.gif); background-position:bottom; overflow:auto; z-index:1; background-repeat:no-repeat;}
.videotxt{ width:460px;float:left;margin:5px 0 0 15px;}
.watchBtn{margin:5px 10px 0 450px;}
.beanline{ background-image:url(../imgs/beanrecommend/title_line.gif); width:210px ;height:34px;}

.divfooterLink{ width:230px;height:20px;float:right; margin-right:0px;}