body {
  background: #f5f7fa;
  color: #343537;
  font: 400 15px/21px "Open Sans", Arial, Helvetica, sans-serif;
  margin: 0;
  min-width: 320px;
  text-align: center;
}

#main-wrapper {
  padding: 20px;
}

#inner-wrapper {
  padding-top: 40px;
}

#logo {
  border: 0;
}

#logo img {
  border: 0;
  margin-bottom: 10px;
  width: 220px;
}

h1 {
  color: #7b92d8;
  font: 300 25px/29px "Open Sans", Arial, Helvetica, sans-serif;
  margin: 0 0 6px;
}

h2 {
  font: 300 18px/21px "Open Sans", Arial, Helvetica, sans-serif;
  margin: 4.5px 0 25px;
}

p {
  margin: 0;
}

a {
  border: 0;
  color: #5472cc;
  text-decoration: none;
}

.small {
  font-size: 75%;
  line-height: 85%;
}

a:hover { text-decoration: underline; }

.hidden-xs {
  display: none;
}

.break-xs {
  display: block;
  margin-bottom: 10px;
}

@media only screen and (min-width: 768px) {
  .hidden-xs {
    display: inherit;
  }

  .break-xs {
    display: inline;
  }
}

@media only screen and (min-width: 768px) and (max-width: 967px) {
  h1 {
    font: 300 29px/33px "Open Sans", Arial, Helvetica, sans-serif;
  }

  h2 {
    font: 300 21px/24px "Open Sans", Arial, Helvetica, sans-serif;
    margin: 8px 0 40px;
  }

  #logo img {
    margin-bottom: 20px;
    width: 270px;
  }
}

@media only screen and (min-width: 968px) {
  h1 {
    font: 300 35px/44px "Open Sans", Arial, Helvetica, sans-serif;
  }

  h2 {
    font: 300 26px/29px "Open Sans", Arial, Helvetica, sans-serif;
    margin: 10.5px 0 55px;
  }

  #logo img {
    margin-bottom: 30px;
    width: 320px;
  }
}