styles.css

/*
$f-2:  123.364px;
$f-1:  104.717px;
*/
/*
$f10: 6.876px;
$f11: 5.836px;
$f12: 4.250px;
*/
b, strong {
  font-weight: 600; }

h1 {
  font-size: 64.72px; }

h2 {
  font-size: 47.123px;
  text-align: center; }

h3 {
  font-size: 29.124px;
  border-bottom: solid thin #888; }

h4 {
  font-size: 18px; }

h5 {
  font-size: 15.279px; }

h6 {
  font-size: 11.125px; }

h1, h2, h3, h4, h5, h6 {
  font-family: "p22-underground", sans-serif;
  margin-top: 0;
  text-rendering: optimizeLegibility; }

h1, h2, h3 {
  margin-bottom: 17.3054px; }

h4, h5, h6 {
  margin-bottom: -17.3054px; }

header {
  padding-left: 34.6108px;
  padding-right: 34.6108px;
  padding-bottom: 17.3054px;
  padding-top: 34.6108px;
  margin-left: -34.6108px;
  margin-right: -34.6108px;
  margin-top: -34.6108px;
  margin-bottom: 34.6108px;
  text-align: center; }
  header h1 {
    margin-top: 0;
    margin-bottom: 0;
    font-family: "p22-underground-pc", courier, sans-serif;
    font-size: 29.124px; }
    header h1 a, header h1 a:visited {
      text-decoration: none; }
  header .byline {
    font-size: 18px;
    margin-top: 0;
    padding-top: 0; }

@media all and (max-width: 700px) {
  h1 {
    font-size: 40px; }

  h2 {
    font-size: 29.124px; }

  h3 {
    font-size: 18px; }

  h4 {
    font-size: 15.279px; }

  h5 {
    font-size: 11.125px; }

  h6 {
    font-size: 9.443px; }

  header h1 {
    font-size: 18px; }
  header .byline {
    font-size: 15.279px; } }
h2.subtitle {
  border-bottom: none;
  font-family: "p22-underground-pc", courier, sans-serif;
  font-weight: 100;
  font-size: 29.124px;
  text-align: center; }

body, p, li, td {
  font-family: "cronos-pro";
  font-size: 24.722px;
  line-height: 1.4;
  text-rendering: optimizeLegibility; }

body {
  width: 741.66px;
  margin: 0 auto;
  overflow-x: hidden; }

.page {
  padding: 34.6108px; }

@media all and (max-width: 700px) {
  body {
    width: 95%; }

  .page {
    padding: 8.6527px; } }
pre, code {
  font-family: "anonymous-pro", monospace; }

pre code {
  padding: 0;
  font-size: 29.124px;
  overflow-x: scroll; }

p code {
  font-size: 18px; }

@media all and (max-width: 700px) {
  code {
    word-wrap: break-word; }

  article.code-listing code {
    word-wrap: normal; } }
pre {
  margin: 0; }

article.code-listing {
  border-radius: 17.3054px;
  padding: 17.3054px;
  overflow-x: hidden; }
  article.code-listing pre code {
    font-size: 18px; }

@media all and (max-width: 700px) {
  article.code-listing {
    padding: 8.6527px; } }
article.code-listing footer h1 {
  font-size: 15.279px;
  font-family: "anonymous-pro", monospace;
  border-bottom: none;
  margin: 0;
  padding: 0;
  text-align: right; }

body {
  background: #efffef;
  background: -webkit-linear-gradient(top, white, #efffef);
  background-repeat: no-repeat;
  background-attachment: fixed; }

header {
  color: white;
  background: black;
  background: -webkit-linear-gradient(top, black, #242424);
  background-repeat: no-repeat; }
  header h1 a, header h1 a:visited {
    color: white; }

.page {
  background: white;
  color: black;
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }

a, a:visited {
  color: black; }

a:hover {
  color: #0d0d0d; }

.toc a, .toc a:visited {
  text-decoration: none; }

.toc a:hover {
  text-decoration: underline; }

code {
  border: solid thin #777;
  background: #ddd;
  padding: 4.32635px;
  padding-right: 4.32635px;
  border-radius: 4.32635px; }

pre code {
  border-radius: 8.6527px;
  border: solid thin #657b83; }

@media all and (max-width: 700px) {
  pre code {
    border-radius: 4.32635px; } }
pre code[class~='language-shell'] {
  background: black;
  background: -webkit-linear-gradient(top, black, #112211);
  background-repeat: no-repeat;
  color: white;
  border: none; }

img {
  width: 100%;
  display: block;
  position: relative;
  background-color: #fff;
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); }

.toc ol li ol li {
  line-height: 1.19; }

ol.front-matter {
  list-style: upper-roman;
  margin-bottom: 0; }
  ol.front-matter ol {
    list-style: lower-roman; }

ol.main-matter {
  margin-top: 0;
  margin-bottom: 0;
  list-style: decimal; }

ol.back-matter {
  margin-top: 0;
  list-style: upper-alpha; }

li.chapter {
  font-size: 24.722px; }

li.section {
  font-size: 18px; }

footer ol {
  list-style: none;
  padding: 0;
  margin: 0; }

footer ol li {
  display: inline; }

footer ol li.previous {
  float: left; }

footer ol li.next {
  float: right; }

footer .clearfix {
  clear: both; }

footer .copyright {
  font-size: 15.279px; }

footer .copyright img {
  width: auto; }