body, div, ul, dl, ol, form, img, label { margin: 0; }

body { width: 320px; margin: 0 auto; font-family: "Microsoft YaHei", "微软雅黑", "宋体"; font-size: 14px; color: #FFF; background-color: #3C3C3C; }
p { margin: 10px 0; line-height: 180%; }
h1 { margin: 10px 0; text-align: center; font-size: 20px; }
h2 { text-align: center; font-size: 14px; }
hr { border: 0; height: 1px; background-color: #CCC; margin: 5px 0; }
a { color: #FFF; }
a:hover { color: #FF7830; }


/** 游戏 **/
#game { position: relative; width: 320px; height: 320px; background: #000; overflow: hidden;  }
#game div, #game img, #game label, #game button { position: absolute; }
#game button { border: 0; top: 266px; height: 54px; line-height: 54px; font-size: 18px; color: #FFF; text-align: center; z-index: 104; }

.bg { left: 0; top: 80px; width: 640px; height: 48px; z-index: 101; }
.bg .bg1 { left: 0; top: 0; }
.bg .bg2 { left: 320px; top: 0; }

.track { left: 0; width: 640px; height: 54px; z-index: 102; }
.track .bg1 { left: 0; top: 0; }
.track .bg2 { left: 320px; top: 0; }
.track .meter { top: 40px; font-size: 12px; padding: 1px; color: #FFF; background-color: #000; }
.track .meter1 { left: 100px; }
.track .meter2 { left: 420px; }
.track1 { top: 128px; }
.track2 { top: 182px; }
.endline { width: 17px; height: 35px; left: 407px; top: 0; background: url(img/endline.png) no-repeat 0 0; z-index: 102; }

.player { width: 27px; height: 32px; left: 70px; background: no-repeat 0 0; z-index: 103; }
.player1 { top: 124px; background-image: url(img/player1.png); }
.player2 { top: 178px; background-image: url(img/player2.png); }

.name { left: 10px; }
.name1 { top: 20px; }
.name2 { top: 40px; }
.time { left: 130px; }
.time1 { top: 20px; }
.time2 { top: 40px; }
.bestLabel { left: 250px; top: 20px; }
.bestTime { left: 250px; top: 40px; }
.debug { left: 20px; top: 60px; }

.welcome { left: 20px; top: 85px; width: 260px; height: 120px; padding: 10px; border: 2px solid #FFF; background-color: green; opacity: .9; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; z-index: 104; }

/* .start { left: 0; top: 236px; width: 300px; height: 84px; padding: 10px; background-color: #000; } */
.start { left: 0; top: 236px; width: 320px; height: 84px; line-height: 84px; font-size: 24px; text-align: center; background-color: #000; }
.cheerup { left: 0; top: 236px; width: 320px; height: 84px; background: #000 url(img/foot.png) no-repeat 0 0; display: none; }

.reload { left: 0; width: 107px; background-color: #7C1E00; display: none; }
.share { left: 107px; width: 106px; background-color: #0F6619; display: none; }
.rank { left: 213px; width: 107px; background-color: #00354E; display: none; }



/** 排行榜 **/
h1.nav a { text-decoration: none; }
h1.nav .split { margin: 0 10px; }
.ranklist { width: 100%; }
.ranklist tr.header { font-weight: bold; }
.ranklist tr.header td { text-align: center; }
.ranklist td { padding: 5px; }
img.avatar { width: 40px; height: 40px; vertical-align: middle; margin-right: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
p.myinfo { padding: 0 10px; }