html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
  margin: 0;
  padding: 0;
  font-family: "microsoft yahei";
}

/*global*/
.logo,
.update-log,
.skin-editor,
.custom-phrase,
.bbs,
.platforms a,
.down a,
.stage .download,
.download-xp {
  /* background-image: url('https://p0.ssl.qhimg.com/t110b9a9301777e8548225c3728.png'); */
  /* background-image: url('https://p1.ssl.qhimg.com/t110b9a93012c58970eecf15ea0.png'); */
  /* background-image: url('https://p5.ssl.qhimg.com/t110b9a93015335415527e76fb9.png'); */
  background-image: url('/_assets/4b05a9d8e6bc388ecc1c.png');
  background-repeat: no-repeat;
}

.logo {
  width: 192px;
  height: 56px;
  position: absolute;
  left: 40px;
  top: 20px;
  background-position: 0 0;
  z-index: 998;
}

.update-log {
  width: 92px;
  height: 30px;
  position: absolute;
  background-position: 0 -56px;
  right: 130px;
  top: 43px;
  z-index: 998;
}

.custom-phrase {
  right: 367px;
  width: 110px;
  height: 30px;
  background-position: -294px -56px;
  z-index: 998;
  position: absolute;
  top: 43px;
  display: none;
}

.skin-editor {
  right: 222px;
  width: 111px;
  height: 30px;
  background-position: -124px -85px;
  z-index: 998;
  position: absolute;
  top: 43px;
  display: none;
}

.bbs {
  width: 65px;
  height: 30px;
  position: absolute;
  background-position: 0 -86px;
  right: 40px;
  top: 43px;
  z-index: 998;
}

a.update-log:hover,
a.skin-editor:hover,
a.custom-phrase:hover,
a.bbs:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.platforms {
  height: 95px;
  width: 354px;
  position: absolute;
  left: 50%;
  margin-left: -177px;
  top: 15px;
  z-index: 9999;
  background-color: #fff;
}

.platforms a.win {
  width: 92px;
  height: 95px;
  background-position: 0 -116px;
  position: absolute;
  bottom: 6px;
  left: 0;
}

.platforms a.win:hover {
  background-position: -92px -116px;
}

.platforms a.win:active {
  background-position: -184px -116px;
}

.platforms a.win.selected {
  background-position: -276px -116px;
  cursor: default;
}

.platforms a.mac {
  width: 92px;
  height: 95px;
  background-position: 0 -211px;
  position: absolute;
  bottom: 6px;
  left: 262px;
}

.platforms a.mac:hover {
  background-position: -92px -211px;
}

.platforms a.mac:active {
  background-position: -184px -211px;
}

.platforms a.mac.selected {
  background-position: -276px -211px;
  cursor: default;
}

.platforms a.ios {
  width: 68px;
  height: 95px;
  background-position: 0 -306px;
  position: absolute;
  bottom: 6px;
  left: 184px;
}

.platforms a.ios:hover {
  background-position: -68px -306px;
}

.platforms a.ios:active {
  background-position: -136px -306px;
}

.platforms a.ios.selected {
  background-position: -204px -306px;
  cursor: default;
}

.platforms a.android {
  width: 72px;
  height: 95px;
  background-position: 0 -401px;
  position: absolute;
  bottom: 6px;
  left: 102px;
}

.platforms a.android:hover {
  background-position: -72px -401px;
}

.platforms a.android:active {
  background-position: -144px -401px;
}

.platforms a.android.selected {
  background-position: -216px -401px;
  cursor: default;
}

.down {
  width: 500px;
  height: 48px;
  position: absolute;
  left: 50%;
  bottom: 23px;
  margin-left: -98px;
  z-index: 999;
  display: none;
  display: flex;
  justify-content: space-between;
}

.down.win .but-s {
  width: 500px;
  height: 48px;
  display: flex;
  justify-content: space-between;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 251px 0 0 0;
  background-position: 0 -640px;
  transform: translate(-50%);
}

.down a {
  display: none;
  position: absolute;
}

.down.win a.win {
  float: right;
}

.down.win a.download-xp {
  float: left;
}

.down.win a {
  position: static;
}

.down .win.download-xp {
  background-position: 0 -688px;
}

.down.win {
  width: 500px;
  position: absolute;
  left: 50%;
  transform: translate(-50%);
  display: flex;
  justify-content: space-between;
  margin-left: 0px;
}

.down .win,
.down .android {
  width: 196px;
  height: 48px;
  left: 0;
  top: 0;
  background-position: 0 -592px;
}

.down .win:hover,
.down .android:hover {
  background-position: -196px -592px;
}

.down .win:active,
.down .android:active {
  background-position: -392px -592px;
}

.down .mac {
  width: 196px;
  height: 48px;
  left: 0;
  top: 0;
  background-position: 0 -640px;
}

.down .mac:hover {
  background-position: -196px -640px;
}

.down .mac:active {
  background-position: -392px -640px;
}

.down .ios {
  width: 196px;
  height: 48px;
  left: 20px;
  top: 0;
  margin: 0 auto;
  background-position: 0 -496px;
}

.down .ios:hover {
  background-position: -196px -496px;
}

.down .ios:active {
  background-position: -392px -496px;
}

.down.win,
.down.android,
.down.ios,
.down.mac {
  display: block;
}

.down.win .win {
  display: block;
}

.down.android .android {
  display: block;
}

.down.android .android.soon {
  background-position: 0 -470px;
  cursor: default;
}

.down.ios .ios {
  display: block;
}

.down.mac .mac {
  display: block;
}

.indexes {
  width: 12px;
  height: 160px;
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -80px;
  z-index: 999;
}

.indexes span {
  display: block;
  overflow: hidden;
  border-radius: 12px;
  width: 10px;
  height: 10px;
  background-color: #cfe6ff;
  margin-top: 15px;
  cursor: default;
}

.indexes span.current {
  width: 10px;
  height: 10px;
  border: none;
  background-color: #4fa4ff;
}

.line {
  width: 100%;
  height: 1px;
  overflow: hidden;
  background-color: #4fa4ff;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: 210px;
}

.line.other {
  top: 100px;
  margin: 0;
}

.stage {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  perspective: 1000px;
}

.stage .elem {
  position: absolute;
  left: 50%;
  top: 50%;
}

.stage .scene {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: none;
}

.stage a:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.stage .anim {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.s0 .win,
.s0 .mac,
.s0 .ios,
.s0 .android {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
}

.s0 .win .elem {
  background-image: url('/_assets/3014f5123be6ea392b13.png');
  background-repeat: no-repeat;
}

.s0 .win .elem.display {
  width: 452px;
  height: 347px;
  background-position: 0 0;
  margin: -130px 0 0 -226px;
  z-index: 1;
}

.s0 .win .elem.lamp {
  width: 304px;
  height: 379px;
  background-position: -452px 0;
  margin: -168px 0 0 -490px;
  z-index: 2;
}

.s0 .win .elem.cup {
  width: 61px;
  height: 66px;
  background-position: -756px -150px;
  margin: 110px 0 0 310px;
  z-index: 2;
}

.s0 .win .elem.brush {
  width: 77px;
  height: 150px;
  background-position: -756px 0;
  margin: -20px 0 0 420px;
  z-index: 2;
}

.s0 .win a.download {
  /* width: 196px;
  height: 48px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 250px 0 0 -99px;
  background-position: 0 -592px; */
}

.s0 .win .but-s {
  width: 500px;
  height: 48px;
  display: flex;
  justify-content: space-between;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 251px 0 0 0;
  background-position: 0 -640px;
  transform: translate(-50%);
}

.s0 .win .but-s .download {
  width: 196px;
  height: 48px;
  display: inline-block;
  background-position: 0 -592px;
}

.s0 .win .but-s .download-xp {
  width: 196px;
  height: 48px;
  display: inline-block;
  background-position: 0 -688px;
}

.s0 .win a.download:hover {
  background-position: -196px -592px;
}

.s0 .win a.download:active {
  background-position: -392px -592px;
}

.s0 .win .but-s .download-xp:hover {
  background-position: -196px -688px;
}

.s0 .win .but-s .download-xp:active {
  background-position: -392px -688px;
}

.s0 .win .desc {
  width: 300px;
  overflow: hidden;
  text-align: center;
  line-height: 24px;
  font-size: 14px;
  font-family: microsoft yahei;
  color: #a2c5ff;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 310px 0 0 -150px;
}

.s0 .win .desc a {
  color: #a2c5ff;
  text-decoration: underline;
}

.s0 .win .desc a:hover {
  opacity: 0.9;
  filter: alpha(opacity=90);
}

.s0 .mac .elem {
  background-image: url('/_assets/77691803a1330bb4b79c.png');
  background-repeat: no-repeat;
}

.s0 .mac .elem.display {
  width: 450px;
  height: 385px;
  background-position: 0 0;
  margin: -165px 0 0 -225px;
  z-index: 1;
}

.s0 .mac .elem.tree {
  width: 240px;
  height: 321px;
  background-position: -450px 0;
  margin: -110px 0 0 -560px;
  z-index: 1;
  -webkit-transform-origin: center 100%;
  -moz-transform-origin: center 100%;
  transform-origin: center 100%;
}

.s0 .mac .elem.snow {
  width: 129px;
  height: 27px;
  background-position: -450px -321px;
  margin: 183px 0 0 -270px;
  z-index: 1;
  -webkit-transform-origin: center 100%;
  -moz-transform-origin: center 100%;
  transform-origin: center 100%;
}

.s0 .mac .elem.snowman {
  width: 258px;
  height: 209px;
  background-position: -690px 0;
  margin: 1px 0 0 260px;
  z-index: 1;
  -webkit-transform-origin: center 100%;
  -moz-transform-origin: center 100%;
  transform-origin: center 100%;
}

.s0 .mac .elem.c1 {
  width: 17px;
  height: 17px;
  background-color: #4fa4ff;
  border-radius: 17px;
  margin: -160px 0 0 -390px;
  z-index: 1;
  -webkit-animation: breath 3s ease-in-out 0.1s infinite both;
  -moz-animation: breath 3s ease-in-out 0.1s infinite both;
  animation: breath 3s ease-in-out 0.1s infinite both;
}

.s0 .mac .elem.c2 {
  width: 8px;
  height: 8px;
  background-color: #4fa4ff;
  border-radius: 8px;
  margin: -200px 0 0 -280px;
  z-index: 1;
  -webkit-animation: breath 4s ease-in-out 0.2s infinite both;
  -moz-animation: breath 4s ease-in-out 0.2s infinite both;
  animation: breath 4s ease-in-out 0.2s infinite both;
}

.s0 .mac .elem.c3 {
  width: 8px;
  height: 8px;
  background-color: #4fa4ff;
  border-radius: 8px;
  margin: -230px 0 0 280px;
  z-index: 1;
  -webkit-animation: breath 6s ease-in-out 0.3s infinite both;
  -moz-animation: breath 6s ease-in-out 0.3s infinite both;
  animation: breath 6s ease-in-out 0.3s infinite both;
}

.s0 .mac .elem.c4 {
  width: 5px;
  height: 5px;
  background-color: #4fa4ff;
  border-radius: 5px;
  margin: 0 0 0 390px;
  z-index: 1;
  -webkit-animation: breath 5s ease-in-out 0.4s infinite both;
  -moz-animation: breath 5s ease-in-out 0.4s infinite both;
  animation: breath 5s ease-in-out 0.4s infinite both;
}

.s0 .mac .elem.x1 {
  width: 34px;
  height: 35px;
  background-position: -690px -209px;
  margin: -280px 0 0 -200px;
  z-index: 1;
  -webkit-animation: breath 3s ease-in-out 0.5s infinite both;
  -moz-animation: breath 3s ease-in-out 0.5s infinite both;
  animation: breath 3s ease-in-out 0.5s infinite both;
}

.s0 .mac .elem.x2 {
  width: 34px;
  height: 35px;
  background-position: -690px -209px;
  margin: -240px 0 0 160px;
  z-index: 1;
  -webkit-animation: breath 4s ease-in-out 0.6s infinite both;
  -moz-animation: breath 4s ease-in-out 0.6s infinite both;
  animation: breath 4s ease-in-out 0.6s infinite both;
}

.s0 .mac .elem.x3 {
  width: 26px;
  height: 26px;
  background-position: -724px -209px;
  margin: -100px 0 0 330px;
  z-index: 1;
  -webkit-animation: breath 3.5s ease-in-out 0.7s infinite both;
  -moz-animation: breath 3.5s ease-in-out 0.7s infinite both;
  animation: breath 3.5s ease-in-out 0.7s infinite both;
}

.s0 .mac a.download {
  width: 196px;
  height: 48px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 250px 0 0 -99px;
  background-position: 0 -640px;
}

.s0 .mac .but-s .download-xp {
  background-position: 0 -688px;
}

.s0 .mac a.download:hover {
  background-position: -196px -640px;
}

.s0 .mac a.download:active {
  background-position: -392px -640px;
}

.s0 .mac .desc {
  width: 300px;
  overflow: hidden;
  text-align: center;
  line-height: 24px;
  font-size: 14px;
  font-family: microsoft yahei;
  color: #a2c5ff;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 310px 0 0 -150px;
}

.s0 .ios .elem {
  background-image: url('/_assets/7fdc706194358b76ac3a.png');
  background-repeat: no-repeat;
}

.s0 .ios .elem.display {
  width: 220px;
  height: 434px;
  background-position: 0 0;
  margin: -223px 0 0 -110px;
  z-index: 1;
}

.s0 .ios .elem.tree {
  width: 157px;
  height: 260px;
  background-position: -220px 0;
  margin: -47px 0 0 -500px;
  -webkit-transform-origin: center 100%;
  -moz-transform-origin: center 100%;
  transform-origin: center 100%;
}

.s0 .ios .elem.balloon-big {
  width: 79px;
  height: 189px;
  background-position: -436px 0;
  margin: -250px 0 0 -300px;
}

.s0 .ios .elem.balloon-small {
  width: 59px;
  height: 154px;
  background-position: -377px 0;
  margin: -310px 0 0 -180px;
}

.s0 .ios .elem.signs {
  width: 176px;
  height: 174px;
  background-position: -220px -260px;
  margin: 37px 0 0 400px;
  -webkit-transform-origin: center 100%;
  -moz-transform-origin: center 100%;
  transform-origin: center 100%;
}

.s0 .ios .elem.bird {
  width: 67px;
  height: 64px;
  background-position: -396px -260px;
  margin: -110px 0 0 280px;
}

.s0 .ios .qrcode {
  width: 200px;
  height: 220px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -50px 0 0 170px;
}

.s0 .ios .qrcode img {
  display: block;
  width: 180px;
  height: 180px;
  overflow: hidden;
  margin: 0 auto;
}

.s0 .ios .qrcode .text {
  line-height: 40px;
  text-align: center;
  color: #a6c8ff;
  font-size: 14px;
}

.s0 .ios a.download {
  width: 196px;
  height: 48px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 250px 0 0 -97px;
  background-position: 0 -496px;
}

.s0 .ios a.download:hover {
  background-position: -196px -496px;
}

.s0 .ios a.download:hover {
  background-position: -392px -496px;
}

.s0 .ios .desc {
  width: 300px;
  overflow: hidden;
  text-align: center;
  line-height: 24px;
  font-size: 14px;
  font-family: microsoft yahei;
  color: #a2c5ff;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 310px 0 0 -150px;
}

.s0 .android .elem {
  background-image: url('/_assets/e4a4a847b77eefa109e2.png');
  background-repeat: no-repeat;
}

.s0 .android .elem.display {
  width: 225px;
  height: 431px;
  background-position: 0 0;
  margin: -221px 0 0 -112px;
  z-index: 1;
}

.s0 .android .elem.planet {
  width: 433px;
  height: 266px;
  background-position: -225px 0;
  margin: -56px 0 0 -630px;
}

.s0 .android .elem.bubbles {
  width: 417px;
  height: 229px;
  background-position: -225px -266px;
  margin: -300px 0 0 -220px;
}

.s0 .android .elem.meteorites {
  width: 195px;
  height: 195px;
  background-position: 0 -431px;
  margin: -280px 0 0 300px;
}

.s0 .android .qrcode {
  width: 200px;
  height: 220px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -50px 0 0 170px;
}

.s0 .android .qrcode img {
  display: block;
  width: 180px;
  height: 180px;
  overflow: hidden;
  margin: 0 auto;
}

.s0 .android .qrcode .text {
  line-height: 40px;
  text-align: center;
  color: #a6c8ff;
  font-size: 14px;
}

.s0 .android a.download {
  width: 196px;
  height: 48px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 250px 0 0 -99px;
  background-position: 0 -592px;
}

.s0 .android a.download:hover {
  background-position: -196px -592px;
}

.s0 .android a.download:active {
  background-position: -392px -592px;
}

.s0 .android a.download.soon {
  background-position: 0 -470px;
  cursor: default;
}

.s0 .android .desc {
  width: 300px;
  overflow: hidden;
  text-align: center;
  line-height: 24px;
  font-size: 14px;
  font-family: microsoft yahei;
  color: #a2c5ff;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: 310px 0 0 -150px;
}

.s0 .copyright {
  width: 100%;
  height: 24px;
  line-height: 24px;
  text-align: center;
  color: gray;
  font-family: verdana;
  position: absolute;
  bottom: 10px;
  left: 0;
  font-size: 12px;
  z-index: 10;
}

.s1 .elem,
.s2 .elem,
.s3 .elem,
.s4 .elem,
.s5 .elem {
  background-image: url('http://p1.qhimg.com/d/inn/fb8ddc9c/page.png');
  background-repeat: no-repeat;
}

.s1 .text,
.s2 .text,
.s3 .text,
.s4 .text,
.s5 .text {
  background-image: url('/_assets/83d052450ced6cdfb84f.png');
  background-repeat: no-repeat;
  position: absolute;
  left: 50%;
  top: 50%;
}

.s1 .text {
  width: 498px;
  height: 94px;
  background-position: 0 0;
  margin: 3px 0 0 -49px;
}

.s1 .elem.leaves-big {
  width: 239px;
  height: 150px;
  background-position: 0 0;
  margin: -25px 0 0 -350px;
}

.s1 .elem.leaves-small {
  width: 90px;
  height: 65px;
  background-position: 0 -150px;
  margin: -50px 0 0 -470px;
  -webkit-animation: drop 6s linear infinite;
  -moz-animation: drop 6s linear infinite;
  animation: drop 6s linear infinite;
}

.s2 .text {
  width: 271px;
  height: 119px;
  background-position: 0 -94px;
  margin: 3px 0 0 -420px;
}

.s2 .elem.circular {
  width: 137px;
  height: 136px;
  background-position: 0 -482px;
  margin: -30px 0 0 280px;
  -webkit-animation: rotateZ 1.5s ease-in-out infinite;
  -moz-animation: rotateZ 1.5s ease-in-out infinite;
  animation: rotateZ 1.5s ease-in-out infinite;
}

.s2 .elem.triangle {
  width: 170px;
  height: 170px;
  background-position: 0 -311px;
  margin: -50px 0 0 200px;
  -webkit-animation: rotateZ 3s ease-in-out 1s infinite;
  -moz-animation: rotateZ 3s ease-in-out 1s infinite;
  animation: rotateZ 3s ease-in-out 1s infinite;
}

.s2 .elem.square {
  width: 96px;
  height: 96px;
  background-position: 0 -215px;
  margin: 24px 0 0 330px;
  -webkit-animation: rotateZ 2s ease-in-out 2s infinite;
  -moz-animation: rotateZ 2s ease-in-out 2s infinite;
  animation: rotateZ 2s ease-in-out 2s infinite;
}

.s3 .text {
  width: 271px;
  height: 119px;
  background-position: 0 -213px;
  margin: 0 0 0 200px;
}

.s3 .elem.bulb {
  width: 191px;
  height: 267px;
  background-position: 0 -620px;
  margin: -90px 0 0 -410px;
}

.s3 .elem.light {
  width: 341px;
  height: 256px;
  opacity: 0;
  background-position: 0 -887px;
  margin: -165px 0 0 -486px;
  -webkit-animation: breath 2s ease-in-out 1s infinite;
  -moz-animation: breath 2s ease-in-out 1s infinite;
  animation: breath 2s ease-in-out 1s infinite;
}

.s4 .text {
  width: 231px;
  height: 119px;
  background-position: -271px -94px;
  margin: -10px 0 0 -480px;
}

.s4 .elem.plane {
  width: 225px;
  height: 220px;
  background-position: -239px 0;
  margin: -120px 0 0 250px;
}

.s4 .elem.l1 {
  width: 156px;
  height: 153px;
  background-position: -239px -220px;
  margin: -80px 0 0 80px;
  -webkit-animation: plane_line 0.3s linear infinite;
  -moz-animation: plane_line 0.3s linear infinite;
  animation: plane_line 0.3s linear infinite;
}

.s4 .elem.l2 {
  width: 75px;
  height: 73px;
  background-position: -165px -150px;
  margin: -80px 0 0 240px;
  -webkit-animation: plane_line 0.5s linear infinite;
  -moz-animation: plane_line 0.5s linear infinite;
  animation: plane_line 0.5s linear infinite;
}

.s4 .elem.l3 {
  width: 156px;
  height: 153px;
  background-position: -239px -373px;
  margin: 30px 0 0 280px;
  -webkit-animation: plane_line 0.7s linear infinite;
  -moz-animation: plane_line 0.7s linear infinite;
  animation: plane_line 0.7s linear infinite;
}

.s4 .elem.l4 {
  width: 94px;
  height: 93px;
  background-position: -395px -220px;
  margin: 140px 0 0 280px;
  -webkit-animation: plane_line 0.8s linear infinite;
  -moz-animation: plane_line 0.8s linear infinite;
  animation: plane_line 0.8s linear infinite;
}

.s5 .text {
  width: 199px;
  height: 119px;
  background-position: -271px -213px;
  margin: 0 0 0 200px;
}

.s5 .elem.label {
  width: 234px;
  height: 234px;
  background-position: -239px -526px;
  margin: -84px 0 0 -400px;
  -webkit-animation: go_top 1s ease-in-out alternate infinite;
  -moz-animation: go_top 1s ease-in-out alternate infinite;
  animation: go_top 1s ease-in-out alternate infinite;
}

.s5 .elem.shadow {
  width: 217px;
  height: 28px;
  background-position: -239px -760px;
  margin: 170px 0 0 -400px;
  -webkit-animation: go_scale 1s ease-in-out alternate infinite;
  -moz-animation: go_scale 1s ease-in-out alternate infinite;
  animation: go_top 1s ease-in-out alternate infinite;
}

@-webkit-keyframes plane_line {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-300px) translateX(300px);
  }

  50% {
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(300px) translateX(-300px);
  }
}

@-moz-keyframes plane_line {
  0% {
    opacity: 0;
    -moz-transform: translateY(-300px) translateX(300px);
  }

  50% {
    opacity: 1;
    -moz-transform: translateY(0) translateX(0);
  }

  100% {
    opacity: 0;
    -moz-transform: translateY(300px) translateX(-300px);
  }
}

@keyframes plane_line {
  0% {
    opacity: 0;
    transform: translateY(-300px) translateX(300px);
  }

  50% {
    opacity: 1;
    transform: translateY(0) translateX(0);
  }

  100% {
    opacity: 0;
    transform: translateY(300px) translateX(-300px);
  }
}

@-webkit-keyframes go_top {
  0% {
    -webkit-transform: translateY(0px);
  }

  100% {
    -webkit-transform: translateY(-30px);
  }
}

@-moz-keyframes go_top {
  0% {
    -moz-transform: translateY(0);
  }

  100% {
    -moz-transform: translateY(-30px);
  }
}

@keyframes go_top {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-30px);
  }
}

@-webkit-keyframes go_scale {
  0% {
    -webkit-transform: scale(1);
  }

  100% {
    -webkit-transform: scale(0.8);
  }
}

@-moz-keyframes go_scale {
  0% {
    -moz-transform: scale(1);
  }

  100% {
    -moz-transform: scale(0.8);
  }
}

@keyframes go_scale {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.8);
  }
}

@-webkit-keyframes breath {
  0% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-moz-keyframes breath {
  0% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes breath {
  0% {
    opacity: 0;
  }

  40% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-webkit-keyframes rotateZ {
  0% {
    -webkit-transform: rotateZ(0);
  }

  30% {
    -webkit-transform: rotateZ(360deg);
  }

  100% {
    -webkit-transform: rotateZ(360deg);
  }
}

@-moz-keyframes rotateZ {
  0% {
    -moz-transform: rotateZ(0);
  }

  30% {
    -moz-transform: rotateZ(360deg);
  }

  100% {
    -moz-transform: rotateZ(360deg);
  }
}

@keyframes rotateZ {
  0% {
    transform: rotateZ(0);
  }

  30% {
    transform: rotateZ(360deg);
  }

  100% {
    transform: rotateZ(360deg);
  }
}

@-webkit-keyframes drop {
  0% {
    -webkit-transform: rotateZ(-10deg) translateX(0) translateY(-250px);
    opacity: 0;
  }

  30% {
    -webkit-transform: rotateZ(10deg) translateX(150px) translateY(-50px);
    opacity: 1;
  }

  60% {
    -webkit-transform: rotateZ(30deg) translateX(300px) translateY(150px);
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateZ(30deg) translateX(300px) translateY(150px);
    opacity: 0;
  }
}

@-moz-keyframes drop {
  0% {
    -moz-transform: rotateZ(-10deg) translateX(0) translateY(-250px);
    opacity: 0;
  }

  30% {
    -moz-transform: rotateZ(10deg) translateX(150px) translateY(-50px);
    opacity: 1;
  }

  60% {
    -moz-transform: rotateZ(30deg) translateX(300px) translateY(150px);
    opacity: 0;
  }

  100% {
    -moz-transform: rotateZ(30deg) translateX(300px) translateY(150px);
    opacity: 0;
  }
}

@keyframes drop {
  0% {
    transform: rotateZ(-10deg) translateX(0) translateY(-250px);
    opacity: 0;
  }

  30% {
    transform: rotateZ(10deg) translateX(150px) translateY(-50px);
    opacity: 1;
  }

  60% {
    transform: rotateZ(30deg) translateX(300px) translateY(150px);
    opacity: 0;
  }

  100% {
    transform: rotateZ(30deg) translateX(300px) translateY(150px);
    opacity: 0;
  }
}

@media screen and (max-height: 800px) {
  /* .s0 .win a.download {
    margin: 225px 0 0 -99px;
  } */

  .s0 .mac a.download {
    margin: 225px 0 0 -99px;
  }

  .s0 .ios a.download {
    margin: 225px 0 0 -97px;
  }

  .s0 .android a.download {
    margin: 225px 0 0 -99px;
  }

  .s0 .copyright {
    bottom: 0;
  }

  .s0 .win .desc {
    height: 24px;
    overflow: hidden;
    margin: 340px 0 0 -150px;
  }

  .s0 .mac .desc {
    height: 24px;
    overflow: hidden;
    margin: 280px 0 0 -150px;
  }

  .s0 .ios .desc {
    height: 24px;
    overflow: hidden;
    margin: 280px 0 0 -150px;
  }

  .s0 .android .desc {
    height: 24px;
    overflow: hidden;
    margin: 280px 0 0 -150px;
  }
}