* { margin: 0; padding: 0; outline: 0; }

/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}

@font-face { font-family:'msjh'; src: url('http://event.goldengame.com.tw/adv/font/msjh.ttf') format('opentype');}
@font-face { font-family:'msjhbd'; src: url('http://event.goldengame.com.tw/adv/font/msjhbd.ttf') format('opentype');}

body { font-family:"微軟正黑體"; color: #333; background-color:#cdf335; background-image:url(images/bg.png); background-position:left bottom; background-repeat:repeat-x;}

img { vertical-align: top;}

/*::selection { background-color:rgba(122, 192, 0, 0.2); }
::-moz-selection { background-color:rgba(122, 192, 0, 0.2); border: 10px solid red; }*/

p { font-size: 24px; margin-bottom: 15px; line-height: 36px; }

header { width: 100%; height:600px; background-image:url(images/topbg_2.jpg); background-position:center top; position: relative; z-index: 10; float: left; }
#headercontainer { width: 990px; height:600px; margin: 0 auto; position: relative; }
#contentcontainer { width:1000px; height:800px; margin: 0 auto; float: none; padding-top: 0px; }

section { margin-bottom: 50px; margin-top: 20px; float: left;}

/*txt*/
.item { background:url(images/item.jpg) no-repeat left top; padding-left:30px; font-family:"微軟正黑體"; font-size:16px; line-height:28px; color:#333; margin-bottom:25px;}
.txt1 { font-family:"微軟正黑體"; font-size:16px; line-height:28px; color:#333;}
.c1 {color: #069; font-weight:bold;}
.c2 {color: #F06; font-weight:bold;}
.c3 {color:#FFF; font-weight:bold;}
.c4 {color:#090; font-weight:bold;}

a:hover { text-decoration: none;}
a:link { text-decoration: none;}

.iconTop { width:100%; text-align:right;}

footer { width: 990px; margin: 0 auto; float: none;}
footer ul { margin-bottom: 10px; text-align:center; }
footer ul li { display: inline; font-size:10px; color:#09F;}




/*-----版頭內容-------------------------------------------------------------------*/

.money{
	display:block;
	width:190px;
	position:absolute;
	top:238px;
	left:318px;
	font:37px "Arial Black", Gadget, sans-serif;
	color:#C00;
	text-align:center;
	text-shadow:0 0 8px #FFF, 0 0 8px #FFF, 0 0 8px #FFF, 0 0 8px #FFF;
}

.theme{
	width:402px;
	height:169px;
	position:absolute;
	left: 160px;
	top: 72px;
}

.theme img{
	-webkit-animation:thememove 3s infinite ease-out;
	-moz-animation:thememove 3s infinite ease-out;
	-ms-animation:thememove 3s infinite ease-out;
}



@-webkit-keyframes thememove{
	0%{-webkit-transform: perspective(500px) rotateY(0deg);opacity:1;}
	4%{-webkit-transform:perspective(500px) rotateY(90deg); opacity:0.3;}
	8%{-webkit-transform:perspective(500px) rotateY(180deg);opacity:1;}
	12%{-webkit-transform:perspective(500px) rotateY(270deg); opacity:0.3;}
	16%{-webkit-transform:perspective(500px) rotateY(360deg);opacity:1;}
	100%{-webkit-transform:perspective(500px) rotateY(360deg);opacity:1;}
}

@-moz-keyframes thememove{
	0%{-moz-transform: perspective(500px) rotateY(0deg);opacity:1;}
	4%{-moz-transform:perspective(500px) rotateY(90deg); opacity:0.3;}
	8%{-moz-transform:perspective(500px) rotateY(180deg);opacity:1;}
	12%{-moz-transform:perspective(500px) rotateY(270deg); opacity:0.3;}
	16%{-moz-transform:perspective(500px) rotateY(360deg);opacity:1;}
	100%{-moz-transform:perspective(500px) rotateY(360deg);opacity:1;}
}

@-ms-keyframes thememove{
	0%{-ms-transform: perspective(500px) rotateY(0deg);opacity:1;}
	4%{-ms-transform:perspective(500px) rotateY(90deg); opacity:0.3;}
	8%{-ms-transform:perspective(500px) rotateY(180deg);opacity:1;}
	12%{-ms-transform:perspective(500px) rotateY(270deg); opacity:0.3;}
	16%{-ms-transform:perspective(500px) rotateY(360deg);opacity:1;}
	100%{-ms-transform:perspective(500px) rotateY(360deg);opacity:1;}
}




/*-----按鈕-------------------------------------------------------------------*/
.menu{
	height:40px;
	position:absolute;
	top:-5px;
	left:510px;
	background-color: rgba(97,208,244,1) ;
	border-radius:5px;
	border:3px solid #FFF;
}
.menu li{
	position:relative;
	z-index:10;
	display:inline;

	}
.menu a{
	display:block;
	position:relative;
	float:left;
	color:#FF3;
	text-align:center;
	padding:10px 10px 8px 10px;
	z-index:20;
	border:1px solid #FFF;
	border-width:0 1px;
	text-decoration:none;
	overflow:hidden;
	font: bolder 17px "微軟正黑體";
	text-shadow:0 0 3px #000 ;
	}
	
.menu span{
	width:0%;
	height:100%;
	position:absolute;
	z-index:-1;
	bottom:1px;
	left:0;
	-webkit-transition:all 0.5s;
	-moz-transition:all 0.5s;
	-ms-transition:all 0.5s;
}
.menu a:hover{
	color: #FFF;}
.menu a:hover span{
	left:0;
	width:100%;
	height:100%;}


.menu li:first-child a{border-left:none;}
.menu li:last-child a{border-right:none;}
.menu li:nth-child(1)  span{ background-color:#06C; border-radius:3px 0 0 3px;}
.menu li:nth-child(2)  span{ background-color: #390;}
.menu li:nth-child(3)  span{ background-color:#F90;}
.menu li:nth-child(4)  span{ background-color:#F30;}
.menu li:nth-child(5)  span{ background-color: #339;border-radius: 0 3px 3px 0;}


/*-----跑-------------------------------------------------------------------*/
#ranKing{
	width:1000px;
	}

#run{position:relative; margin-bottom:15px; background-image:url(images/run_bg.png);}
	
#run1,#run2,#run3,#run4,#run5,
#run6,#run7,#run8,#run9,#run10{
	width:58px;
	height:70px;
	position:absolute;
	/* left:420px; */
	top:0px;
	z-index:0;
	}
	
#run1 img,#run2 img,#run3 img,#run4 img,#run5 img,
#run6 img,#run7 img,#run8 img,#run9 img,#run10 img{
	-webkit-animation:runing 0.8s infinite ;
	-moz-animation:runing 0.8s infinite;
	-ms-animation:runing 0.8s infinite;
	}
	
@-webkit-keyframes runing{
	0%{-webkit-transform:translate(0,0);width:61px; height:73px; margin-top:-5px;}
	50%{-webkit-transform:translate(-5px,5px); width:58px; height:70px;margin-top:-5px;}
	100%{-webkit-transform:translate(0,0);width:61px; height:73px;margin-top:-5px;}
	}
	
@-moz-keyframes runing{
	0%{-webkit-transform:translate(0,0);width:61px; height:73px; margin-top:-5px;}
	50%{-webkit-transform:translate(-5px,5px); width:58px; height:70px;margin-top:-5px;}
	100%{-webkit-transform:translate(0,0);width:61px; height:73px;margin-top:-5px;}
	}
	
@-ms-keyframes runing{
	0%{-webkit-transform:translate(0,0);width:61px; height:73px; margin-top:-5px;}
	50%{-webkit-transform:translate(-5px,5px); width:58px; height:70px;margin-top:-5px;}
	100%{-webkit-transform:translate(0,0);width:61px; height:73px;margin-top:-5px;}
	}
	
	
#run1:after,#run2:after,#run3:after,#run4:after,#run5:after,
#run6:after,#run7:after,#run8:after,#run9:after,#run10:after{
	content:"";
	display:block;
	width:25px;
	height:25px;
	position:absolute;
	top:48px;
	left:13px;
	background-image:url(images/w.png);
	border-radius:50%;
	-webkit-animation:wruning 0.8s infinite ;
	-moz-animation:wruning 0.8s infinite;
	-ms-animation:wruning 0.8s infinite;
	}
	
@-webkit-keyframes wruning{
	0%{-webkit-transform:rotateZ(0);opacity:0.5;margin-left:5px;  }
	50%{-webkit-transform:rotateZ(180deg); opacity:0.8;margin-left:0px;}
	100%{-webkit-transform:rotateZ(365deg); opacity:0.5; width:28px;margin-left:5px;}
	}
	
@-moz-keyframes wruning{
	0%{-moz-transform:rotateZ(0);opacity:0.5;margin-left:5px;  }
	50%{-moz-transform:rotateZ(180deg); opacity:0.8;margin-left:0px;}
	100%{-moz-transform:rotateZ(365deg); opacity:0.5; width:28px;margin-left:5px;}
	}
	
@-ms-keyframes wruning{
	0%{-ms-transform:rotateZ(0);opacity:0.5;margin-left:5px;  }
	50%{-ms-transform:rotateZ(180deg); opacity:0.8;margin-left:0px;}
	100%{-ms-transform:rotateZ(365deg); opacity:0.5; width:28px;margin-left:5px;}
	}