/* logo */
/* if want to show logo in front of the slide, the logo must use position:relative, and the innerHTML must use position: absolute */
/* position: absolute will set the element position according to the nearest parent element which is not in position:static */
.logo {
	position: relative;
}

.logo div {
	width: 211px;
	position: absolute;
	left: 382px;
	z-index: 1000;
}

/* header slide */
.slide {
	width: 980px;
	height: 88px;
	background-image: url(../media/title-bg.png);
}

#roll1 {
	overflow: hidden;
	width: 980px;
	height: 80px;
	position: relative;
}

.slide .roll a {
	width: 196px;
	height: 80px;
}

/* top menu */
.topmenu {
	width: 980px;
	background: url(../media/title-bg2.png) no-repeat;
	position: relative;
	z-index: 100;
}

.menuline {
	margin: 0 auto;
	width: 300px;
}

.topmenu .menucell {
	width: 72px;
	float: left;
}

.topmenu .menucellside {
	width: 3px;
	float: left;
}

.topmenu .menucellmiddle {
	width: 2px;
	float: left;
}

.gamemenu {
	width: 70px;
}

.gamemenu li {
	position: relative;
}

.gamelist {
	width: 200px;
	position: absolute;
	top: 31px;
	left: 0;
	display: none;
	opacity: 0;
}

.gamelist li a {
	height: 48px;
	display: block;
	color: white;
	background-color: #7A7A7A;
}

.gamelist li a:hover {
	text-decoration: none;
	background-color: #3C3C3C;
}