/*
	@title:搜狐体操
	@author:喵
	@date:2016-07-22;
*/
body{-webkit-text-size-adjust:none; background:#94e0f0;}
*{-webkit-text-size-adjust:none; font-family:Arial, Helvetica, sans-serif; margin:0; padding:0; outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
input,textarea,select{ font-size:100%;}ul{ list-style:none;}
a{ display:inline-block; border: medium none;display: inline-block;outline: medium none;text-decoration: none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.box img{ vertical-align:top; border:none; width:100%;pointer-events: none; user-select:none;}
.box{width:100%; overflow:; position:absolute; margin:0 auto; left:0;}
.rel{ position:relative;}
.abs{position:absolute; }

.title{ width:52.5%; top:33.8%; left:23.7%;}
.btn_start{ width:27.1%; top:71.2%; left:36.6%;}
.boxActive .title{animation: bounceIn 0.7s 0.3s linear both; -webkit-animation: bounceIn 0.7s 0.3s linear both;}
.boxActive .btn_start{animation: fadeInBottom 0.3s 0.8s linear both; -webkit-animation: fadeInBottom 0.3s 0.8s linear both;}
.btn_help{ width:9%; right:0; top:0;}
.bg_layer{ position:fixed; width:100%; height:100%; top:0; left:0; background:#000; opacity:0.7;  display:none; z-index:20;}
.z_rule{ position:fixed;  width:63%; left:18.5%; top:5.2%; display:none; z-index:30;}
.btn_close{ position:absolute; width:12%; height:17.2%; top:0; right:0; text-indent:-9999px; background:url(../images/btn_help.png) no-repeat -9999px -9999px;}
.gamePage{ background:#a2daf1;}
#gymGame{ width:100%; position:absolute; top:0; left:0;}


.result_peo{ width:9.7%; left:67.8%; top:8.5%;animation: peoIn 0.4s 0.3s linear both; -webkit-animation: peoIn 0.4s 0.3s linear both;}
.btn_share{ width:7%; top:46.7%; left:31%;animation: fadeInBottom 0.2s 0.7s linear both; -webkit-animation: fadeInBottom 0.2s 0.7s linear both;}
.btn_replay{ width:15.8%; top:46.7%; left:41%;animation: fadeInBottom 0.2s 0.8s linear both; -webkit-animation: fadeInBottom 0.2s 0.8s linear both;}
.btn_more{ width:10.6%; top:46.7%; left:57.9%;animation: fadeInBottom 0.2s 0.9s linear both; -webkit-animation: fadeInBottom 0.2s 0.9s linear both;}
.score_con{ font-size:61px; color:#fff; top:19.2%; width:100%; text-align:center; left:0; font-weight:bold; text-shadow:0px 8px 0px #59cbe3;animation: bounceIn 0.6s 1.1s linear both; -webkit-animation: bounceIn 0.6s 1.1s linear both;}
.btn_add,.btn_change,.btn_addlayer,.btn_changelayer{ width:12.7%; bottom:3.2%; left:68%; display:none;}
.btn_changelayer,.btn_addlayer{ z-index:40; display:none;}
.btn_add,.btn_addlayer{ left:83.7%;}
.img_cur{ width:100%; position:absolute; top:0; left:0; display:none;}


@-webkit-keyframes bounceIn {
  0% {opacity: 0;-webkit-transform: scale3d(.3, .3, .3);transform: scale3d(.3, .3, .3);}
  20% {-webkit-transform: scale3d(1.1, 1.1, 1.1);transform: scale3d(1.1, 1.1, 1.1);}
  40% {-webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9);}
  60% {opacity: 1;-webkit-transform: scale3d(1.03, 1.03, 1.03);transform: scale3d(1.03, 1.03, 1.03);}
  80% {-webkit-transform: scale3d(.97, .97, .97);transform: scale3d(.97, .97, .97);}
  100% { opacity: 1;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1); }
}

@keyframes bounceIn {
  0% { opacity: 0;-webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3);}
  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1);}
  40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9);}
  60% {opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03);}
  80% {-webkit-transform: scale3d(.97, .97, .97);transform: scale3d(.97, .97, .97);}
  100% { opacity: 1;-webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}
}

@-webkit-keyframes fadeIn {
  0% {opacity: 0;  -webkit-transform: scale3d(0, 0, 0);}
  100% {opacity: 1; -webkit-transform: scale3d(1, 1, 1);}
}

@keyframes fadeIn {
  0% {opacity: 0; transform: scale3d(0, 0, 0);}
  100% {opacity: 1;transform: scale3d(1, 1, 1);}
}

@-webkit-keyframes fadeInBottom {
  0% {opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);}
  100% {opacity: 1;-webkit-transform: none;transform: none;}
}

@keyframes fadeInBottom {
  0% {opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0);}
  100% {opacity: 1;-webkit-transform: none;transform: none;}
}

@-webkit-keyframes peoIn {
  0% {opacity: 0;  -webkit-transform: scale3d(0, 0, 0); top:100%}
  100% {opacity: 1; -webkit-transform: scale3d(1, 1, 1);top:8.5%;}
}

@keyframes peoIn {
  0% {opacity: 0; transform: scale3d(0, 0, 0); top:100%}
  100% {opacity: 1;transform: scale3d(1, 1, 1);top:8.5%;}
}