/**
 * 公共样式
 * @type {Number}
 */
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,label,dl,dt,dd,fieldset,img{margin:0;padding:0;border:0;list-style:none;font-weight:normal; }
img{ border:none;padding:0;margin:0;vertical-align:top;}
body {
    font-family:'微软雅黑',Arial, sans-serif;
    color: #a36131;
    padding: 0;
    margin: 0;
    font-size: 24px;
    background-color: #000;
}
html,body{ overflow:hidden}
a{text-decoration:underline;}
a:link { text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:none;}
.clear{clear:both; height:0px; font-size:0px;overflow:hidden; display:block; font-size:0px;}

body .hide{display:none; z-index:0;}
body .show{display:block; z-index:5;}
body .active{ display:block; z-index:10}
body .level{display:block;z-index:3}

/*头部功能按钮*/
header{position: absolute; z-index: 111; top:0px; width: 100%; top:25px; font-size: 32px; color: #fff; display: none;}
header .leftBtn{float: left; width:120px; height:120px; text-align: center; background: url(wgIco.png) no-repeat; margin-left: 50px; display: block;}
header .rightBtn{float: right; width:200px; height:120px; text-align: center; background: url(ruleIco.png) no-repeat;}

/**
 * 加载
 * @type {[type]}
 */
.loading{ position:fixed; z-index:111110; width:100%; height:100%; top:0; left:0; background-color:#000;}

.main{width: 640px; height:100%; position: absolute; display: none; overflow: hidden; left:50%; margin-left:-320px; }
.main .bg{width:100%; height:100%; background:url(bg.jpg) center no-repeat;}



.main .saveBtn{width:200px; height:80px; background-color: #fff; border-radius: 5px; position: absolute; left:50%; margin-left: -100px; bottom:10%; text-align: center; line-height: 80px; z-index: 111;}

/*广告标语*/
.main .tipCon{position: absolute; left:50%; top:50%; z-index: 11; width:400px; height: 250px; margin-left: -60px; margin-top: -190px;  }
.main .tipCon img{position: absolute; z-index: 1;}
.main .tipCon img:last-child{margin-top: -85px; margin-left: -80px; z-index: 0;}

/*游戏开始按*/
.main .enterGameBtn,
.main .startBtn{width:350px; height:75px; line-height: 75px; background-color: rgba(203,26,54,0.9); border-radius: 5px; position: absolute; left:50%; margin-left: -175px; top:50%; margin-top: 290px; font-size:32px; color:#fff; text-align: center;  z-index: 111; }

.main .startBtn{display: none;}

.main .mskBox{position: absolute; width: 640px; height:100%; background:url(msk.png) center no-repeat;}

.main .step2 .bay,
.main .t2,
.main .scoreImg{position: absolute; left:50%; top: 50%; }

.main .step2 .bay{margin-top: -190px; margin-left: -20px;  z-index: 11;
	-webkit-transform:rotate(20deg);
			transform:rotate(20deg);
	}
.main .t2{   margin-left: -265px; z-index: 11; margin-top: 140px;}
.main .scoreImg{z-index: 11;  margin-left: 120px; margin-top: 60px; width:122px; height:47px; display: block}

.main .aim{width:100px; height:100px; position: absolute;  left:50%; top:50%; margin-left: -50px; margin-top: -154px; z-index: 22;}
.main .aim span{background-color: rgba(0,0,0,.5); display: block; position: absolute; }
.main .aim span:first-child{ width: 6px; height:100px; margin-left: 47px; }
.main .aim span:last-child{ width: 100px; height:6px; margin-top: 47px;}



.main .photoBtn{width:160px; height:160px; position: absolute;}

.mskBox{display: none;}
.step2{display: none;}
.step3{display: none;}

.main .takePhotoBtn{width:160px; height:160px; background-color:rgba(0,0,0,.6); 
-webkit-border-radius: 160px;
		border-radius: 160px;
border:2px solid #06bee8;
position: absolute; left:50%; top:50%; margin-left: -80px; margin-top: 280px;  z-index: 111;

background-image:url(photoIco.png);
background-repeat: no-repeat;;
background-position: center;

-webkit-transition:all 0.6s;
}


.main .shine{
	width: 170px; height:170px; background:url(shine2.png) no-repeat; margin-left: -5px; margin-top: -5px; position: absolute;
}

.main .countDown{width: 200px; height:200px; position: absolute; left:50%; top:50%; margin-left:-100px; margin-top: -220px; color: #fff; font-size: 180px; text-align: center; z-index: 33;}

.main #bayStage{width:640px; height:100%; position: absolute; z-index: 20; display: block; background-color: rgba(0,0,0,.3); display: none;}
.main #takePhoto{width:534px; height:477px; position: absolute; z-index: 1112; top:50%; margin-top: -343px; left:50%; margin-left: -267px; display: block; background-color: #efefef;display: none;}

.main #bayRole{width: 154px; height:205px; position: absolute; z-index: 20; top:0px; left:0; display: block; margin-left: -77px; margin-top: -102.5px; background-repeat: no-repeat; }

.main .screenshot {width:534px; height: 477px; position: absolute; left:50%; margin-left: -267px; top:50%; margin-top: -343px; z-index: 22; display: none;}
.main .screenshot li{
	width:534px; height: 477px; background-color: rgba(0,0,0,.6);
	background: url(gBg.jpg) -3px no-repeat;
	-webkit-box-sizing:border-box;
			box-sizing:border-box;
	display: block;
	border:5px solid #fff; position: absolute;
}
.main .screenshot li .bayMsk{ position: absolute; width: 100%; height:100%; overflow: hidden; z-index: 1;}

.main .screenshot .sBay{width:154px; height:205px; background-repeat: no-repeat; position: absolute; margin-left: -77px; margin-top: -102.5px; }
.main .screenshot li span{display: none; position: absolute; width: 100%; height:100%; background-color: rgba(255,255,255,0.95); z-index: 1;}

.main .gameEnd{width:540px; height:330px;  position: absolute; z-index: 22; top:50%; left:50%; margin-left: -270px; margin-top: 150px; color: #fff; display: none;}

.main .gameEnd .scoreNum{width:100%; text-align: center; height:60px; font-size:42px; color: #ef3438; /* -webkit-text-stroke:2px #fff; */ font-weight: bold;}
.main .gameEnd .scoreNum span{-webkit-transform: translate(0px,2px);display: inline-block;}
.main .gameEnd .txt{width:100%; height:110px;  font-size: 26px;text-align:center}
.main .gameEnd .againBtn{width:250px; height:75px; background-color: #cb1a36; margin:0 auto; border-radius: 8px; text-align: center; line-height: 75px; margin-top: 10px; font-size: 32px; }



.main .rulePage{
	position: absolute; z-index: 3333; width: 100%; height:100%; background-color: #c12529; top:0px; left:0px;  display: none;
}

.rulePage .backBtn{width:100px; height:39px; position: absolute; left:20px; top:35px; z-index: 11; background: url(backBtn.png) no-repeat; padding-left: 60px; line-height: 39px; color: #fff; font-size: 36px;}
.rulePage .ruleCon{width:100%; height:100%; position: absolute; }
.rulePage .ruleCon .rScroller{width:100%; height:1300px; background: url(rulePage.jpg) no-repeat;}


/**
 * 版权
 */
.main .copyright{width: 100%; position: absolute; bottom:10px; text-align: center; color: #c12529;}
.main .copyright a{color: #c12529;}
/**
 * css3
 */


.shineRotateAm{
	-webkit-animation-name: shineRotateAm;
	-webkit-animation-duration: 4s;
	-webkit-animation-timing-function:ease; 
	-webkit-animation-iteration-count:infinite;
}
@-webkit-keyframes shineRotateAm {
  0%{ -webkit-transform:rotate(0deg); opacity: 0;}
  50%{opacity: 1;}
  100%{ -webkit-transform:rotate(360deg); opacity: 0;}
}


/**
 * loading
 */
.roundSpinner {margin: 0px auto 0; width: 150px; text-align: center; position: absolute; left:50%; margin-left: -75px; top:50%; margin-top: -30px; z-index: -1; } .roundSpinner > div {width: 30px; height: 30px; background-color: #fff; border-radius: 100%; display: inline-block; -webkit-animation: bouncedelay 1.4s infinite ease-in-out; animation: bouncedelay 1.4s infinite ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .roundSpinner .bounce1 {-webkit-animation-delay: -0.32s; animation-delay: -0.32s; } .roundSpinner .bounce2 {-webkit-animation-delay: -0.16s; animation-delay: -0.16s; } @-webkit-keyframes bouncedelay {0%, 80%, 100% { -webkit-transform: scale(0.0) } 40% { -webkit-transform: scale(1.0) } } @keyframes bouncedelay {0%, 80%, 100% {transform: scale(0.0); -webkit-transform: scale(0.0); } 40% {transform: scale(1.0); -webkit-transform: scale(1.0); } }


/*150902*/
.main .gameEnd .txt{height: 50px; word-break: break-all;}
.main .enterGameBtn, .main .startBtn{background-color: rgba(61,141,215,0.9); margin-top: 280px;}
.main .gameEnd .againBtn{background-color: #3d8dd7;}
.rulePage .ruleCon .rScroller{height: 1350px;}
.main .rulePage{background-color: #3d8dd7;}
.main .tipCon{margin-top: -345px; margin-left: -175px;}