*,*:after,*:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
a{text-decoration:none;color:inherit;}
h1,h2,h3,h4{margin:0;}
img{width:100%;vertical-align:top;}
ul{padding:0;margin:0;list-style:none;}
ul li{padding:0;}
ol{margin:0;padding:0 0 0 20px;}
input,button{font-family:inherit;}
button{color:inherit;font:inherit;margin:0;border:none;text-transform:none;-webkit-appearance:button;}
html{height:100%;width:100%;overflow:hidden;padding:0;margin:0;}
body{margin:0;padding:0;height:100%;color:white;background-color:#2d3132;font:normal 12px/1.5 "Helvetica Neue","Luxi Sans","DejaVu Sans",Arial,"Hiragino Sans GB",STHeiti,'Microsoft Yahei',sans-serif;cursor:default;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:auto!important;}
.wh{position:absolute;width:100%;height:100%;}
.hide{display:none;}
.animate{width:100%;height:100%;position: absolute;display:none;}

/* Loader */
.page_arrow_bottom{position:absolute;left:50%;width:36px;height:36px;background-image:url(../img/arrow.png);-webkit-background-size:36px;background-size:36px; bottom: 20px;margin-left:-18px;opacity:0;-webkit-animation:page_arrow_bottom 1.5s 2s ease-in-out infinite;z-index:999;zoom:0.6;}

.page_arrow_right{position:absolute;top:50%;width:36px;height:36px;background-image:url(../img/arrow.png);-webkit-background-size:36px;background-size:36px; right: 20px;margin-top:-18px;opacity:0;-webkit-animation:page_arrow_right 1.5s 2s ease-in-out infinite;z-index:999;zoom:0.6;}

.loader{position:absolute;z-index:999;overflow:hidden;left:0;top:0;right:0;bottom:0;width:100%;height:100%;color:white;background-color:#000;}
.loader-graph,.loader-progress{overflow:hidden;position:absolute;left:50%;bottom:35%;width:128px;height:128px;margin:-32px 0 0 -64px;color:#ccc;}
.loader-graph{width:200px;height:200px;top:50%;left:50%;margin-top:-100px;margin-left:-100px;background:url(../img/logo_dh.png) no-repeat;background-size:contain;-webkit-animation:rotate1 0.72s linear infinite;-o-animation:rotate1 0.72s linear infinite;animation:rotate1 0.72s linear infinite;zoom:0.5;}
.loader-text{position:absolute;width:100px;height:100px;top:50%;left:50%;margin-top:-50px;margin-left:-50px;background:url(../img/logo2.png) no-repeat;background-size:contain;zoom:0.5;}
.loader-progress{font-size:34px;text-align:center;padding-top:80px;line-height:44px;zoom:0.5;}

/* music */
.music-icon{position:fixed;width:7%;height:7%;background-image:url(../img/music.png);background-repeat:no-repeat;background-position:center center;background-size:contain;top:-3px;right:3px;z-index:10;}
.music-icon:after{position:absolute;content:"";display:inline-block;left:-20px;right:-20px;top:-20px;bottom:-20px}
.music-icon.play{-webkit-animation:rotate1 2.3s linear infinite}
@-webkit-keyframes rotate1{
  0%{-webkit-transform:rotate(0deg);}
  100%{-webkit-transform:rotate(360deg);}
}
@-webkit-keyframes page_arrow_bottom {
  0%, 30% { opacity: 0; transform: translate(0, 20px) }
  60% { opacity: 1; transform: translate(0, 0) }
  100% { opacity: 0; transform: translate(0, -16px) }
}
@-webkit-keyframes page_arrow_right {
  0%, 30% { opacity: 0; transform: translate(20px, 0) rotate(-90deg) }
  60% { opacity: 1; transform: translate(0, 0) rotate(-90deg) }
  100% { opacity: 0; transform: translate(-16px, 0) rotate(-90deg) }
}
.page-arrow {
  position: absolute;
  right: 47%;
  bottom:4%;
  width: 18px;
  height: 18px;
  background-image: url(../img/arrow.png);
  -webkit-background-size: 18px;
  background-size: 18px;
  margin-top: -9px;
  opacity: 0;
  -webkit-animation:page_arrow_bottom 1.5s 1s ease-in infinite;
  z-index:999;
  zoom:0.9;
}
/* Animation */
.scaleOut{opacity:0;-webkit-transform:scale(1.25);-webkit-transition:all .8s;transform:scale(1.25);transition:all .8s;}