html {
  color: #becde3;
  font-family: "Roboto", Arial, Helvetica, sans-serif;
  font-style: normal;
  font-weight: normal;
  line-height: 1.4;
  letter-spacing: .2px;
  font-size: 100%;
  min-width: 320px;
  background: #222a33;
  height: 100%;
}

body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
}

.root-fallback {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: radial-gradient(#2d3340, #1c2127);
  background-attachment: fixed;
}

.root-fallback__container {
  height: 100%;
  width: 100%;
  display: table;
}

.root-fallback__wrapper {
  display: table-cell;
  vertical-align: middle;
  margin: auto;
  max-height: 700px;
  max-width: 920px;
}

.root-fallback__thunderpick-logo {
  margin: 0 auto 30px auto;
  max-width: 720px;
}
.root-fallback__thunderpick-logo .logo {
  display: block;
  margin: 0 auto;
  width: 90%;
}
@media only screen and (min-width: 721px) {
  .root-fallback__thunderpick-logo {
    margin: 0 auto 80px auto;
  }
}


.root-fallback__message {
  padding: 0 20px;
  font-weight: bold;
  color: white;
  text-align: center;
}

.root-fallback__message #title {
  font-size: 22px;
}
@media only screen and (min-width: 721px) {
  .root-fallback__message #title {
    font-size: 26px;
    line-height: 1.6em;
  }
}
@media only screen and (min-width: 1025px) {
  .root-fallback__message #title {
    font-size: 32px;
    letter-spacing: 0.6px;
    line-height: 1.7em;
  }
}
.root-fallback__message #description {
  padding-top: 10px;
  font-size: 16px;
  padding-bottom: 20px;
}
@media only screen and (min-width: 721px) {
  .root-fallback__message #description {
    font-size: 20px;
    line-height: 1.4em;
  }
}
@media only screen and (min-width: 1025px) {
  .root-fallback__message #description {
    font-size: 26px;
    letter-spacing: 0.6px;
    line-height: 1.6em;
  }
}

.root-fallback__message a {
  color: white;
}