@charset "utf-8";

html,
body,
div,
section,
article,
p,
span,
label,
h1,
h2,
h3,
h4,
h5,
h6,
a,
img {
  margin: 0;
  padding: 0;
}

a,
img {
  border: 0 none;
  outline: 0 none;
}

@media screen and (max-width: 434px) {
  html {
    font-size: 14px;
  }
}

@media screen and (min-width: 435px) and (max-width: 479px) {
  html {
    font-size: 16px;
  }
}

@media screen and (min-width: 480px) and (max-width: 639px) {
  html {
    font-size: 18px;
  }
}

@media screen and (min-width: 640px) and (max-width: 749px) {
  html {
    font-size: 20px;
  }
}

@media screen and (min-width: 750px) {
  html {
    font-size: 22px;
  }
}

html,
body,
#wrapper {
  width: 100%;
  height: 100%;
  overflow: hidden;
  max-width: 720px;
  margin: 0 auto;
}

#wrapper {
  background: #000 url(../img/bg.jpg) no-repeat center top;
  background-size: 100%;
  position: relative;
}

#wrapper img {
  width: 100%;
  display: block;
}

#wrapper .content {
  position: absolute;
  bottom: 2rem;
  width: 100%;
}

#wrapper .content section {
  margin: 0 auto;
}

#wrapper .content .font {
  width: 81.3%;
}

#wrapper .content .download {
  width: 46.5%;
}

#footer {
  background: #000;
  color: #fff;
  text-align: center;
  padding: 20px 0;
  line-height: 1.6;
}

#footer a {
  color: #fff;
  -webkit-transition: color .3s;
  -moz-transition: color .3s;
  -ms-transition: color .3s;
  -o-transition: color .3s;
  transition: color .3s;
}

#footer a:hover {
  color: #39c3fb;
}