body {
  font: 11px "Roboto", "Helvetica Neue", helvetica, arial, sans-serif;
  background: #272727;
  color: white;
}

a {
  color: #82B6EA;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

.container {
  width: 80%;
  max-width: 940px;
  margin: 0 auto;
  margin-bottom: 50px;
}

.hero {
  padding-top: 20px;
  text-shadow: 0 0 8px rgba(0, 0, 0, .4);
  text-align: center;
}

.branding {
  margin: 0;
  font-weight: 700;
  font-size: 54px;
}

.hero p {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}

.description {
  margin: 5px auto 0 auto !important;
  color: #CACACA;
}

.subtext {
  font-size: 16px;
  font-weight: 300;
  line-height: 22px;
}

.screenshot {
  text-align: center;
  padding: 40px 0 20px 0;
}

.screenshot img {
  max-width: 940px;
  width: 70%;
}

.content {
  border-top: 1px solid rgba(0, 0, 0, .3);
  padding-top: 20px;
  font-size: 1.3em;
}

p.center {
  text-align: center;
  margin: 30px 0;
}

code {
  font-family: consolas, monospace;
  font-size: 80%;
  padding: 2px;
  color: rgba(255, 255, 255, .6);
}

ul.simple {
  list-style-type: none;
  padding-left: 20px;
}

ul.simple li {
  margin-bottom: 10px;
}

ul.simple li:before {
  content: "—";
  color: #CACACA;
  padding-right: 10px;
}

.content h2 {
  color: #D4D4D4;
  text-shadow: 0 0 3px rgba(0, 0, 0, .4);
}

p.download-links {
  margin: 30px auto;
  line-height: 44px;
  width: 50%;
}

.button {
  background: #4288CE;
  color: #F3F3F3;
  text-decoration: none;
  font-size: 1.4em;
  padding: 12px;
  white-space: nowrap;
}

.button:hover {
  background: #31679D;
  text-decoration: none;
}

pre .str, code .str { color: #79E3E1; }  /* string  */
pre .kwd, code .kwd { color: #FDFF62;  font-weight: bold; }  /* keyword*/
pre .com, code .com { color: #A5A5A5; font-weight: bold; } /* comment */
pre .typ, code .typ { color: #E16CA1; }  /* type  */
pre .lit, code .lit { color: #49DF9D; }  /* literal */
pre .pun, code .pun { color: #51D743; font-weight: bold;  } /* punctuation  */
pre .pln, code .pln { color: #BBBBBB; }  /* plaintext  */
pre .tag, code .tag { color: #9c9cff; }  /* html/xml tag  */
pre .htm, code .htm { color: #dda0dd; }  /* html tag */
pre .xsl, code .xsl { color: #d0a0d0; }  /* xslt tag */
pre .atn, code .atn { color: #46eeee; font-weight: normal;} /* html/xml attribute name */
pre .atv, code .atv { color: #EEB4B4; }  /* html/xml attribute value  */
pre .dec, code .dec { color: #3387CC; }  /* decimal  */
pre.prettyprint, code.prettyprint {
  font-family: consolas, monospace;
  font-size: 16px;
  background: #181818;
  padding: 20px;
  color: #929292;
  -moz-border-radius: 16px;
  -webkit-border-radius: 16px;
  border-radius: 16px;
}
pre.prettyprint {
  white-space: pre-wrap;
}

@media (max-width: 480px) {
  p.download-links {
    line-height: inherit;
  }
  .button {
    white-space: normal;
    display:block;
    padding: 10px;
    margin-bottom: 5px;
  }

  pre {
    white-space: pre;
    word-wrap: break-word;
  }
}
