@import url('https://fonts.googleapis.com/css?family=Open+Sans');
@import url('https://fonts.googleapis.com/css?family=Catamaran:400,700');
html {
      height: 100%;
      box-sizing: border-box;
      background-color: #212120;
      color: rgb(238, 238, 238);
}

* {
      background: inherit
}

body {
      margin: 0;
      min-height: 100%;
      font-family: "Open sans", "sans serif";
      font-size: 18px;
      line-height: 1.51857143;
      display: flex;
}

h1, h2, h3, h4 {
      -webkit-margin-before: 0.0em;
      -webkit-margin-after: 0.0em;
      font-weight: bold;
      color: #c53a34;
      font-family: "Catamaran";
}

a {
      text-decoration: none;
      font-weight: bold;
}

a:visited {
      text-decoration: none
}

h1 {
      font-size: 2em;
}

h2 {
      font-size: 1.6em;
}

h3 {
      font-size: 1.3em;
}

ul {
      padding: 0;
}

ul li {
      list-style-type: none;
      padding-bottom: 14px;
}

.menu {
      padding: 40px;
      padding-right: 60px;
      display: flex;
      position: sticky;
      top: 10px;
      z-index: 1;
      flex-flow: column;
}

.content {
      padding: 60px;
      width: 1024px;
}

.content a {
      font-family: "Open sans", "sans serif";
}

a.direction, .menu a:not(.project-name) {
      color: #212120;
      background-color: #c53a34;
      padding: 3px 5px;
      font-family: "Catamaran";
      display: inline-block;
      border-radius: 2px;
      font-size: 1.1em;
}

.content a:not(.direction), .menu a.current, .menu a:hover {
      color: #c53a34;
      background-color: #212120;
}

.content ul li {
      list-style-type: circle;
      padding: 5px
}

.project-name {
      color: #c53a34;
      background-color: #212120;
      font-size: 1.3em;
      padding: 0;
}

.previous {
      display: inline-block;
      margin-right: 20px;
      margin-bottom: 20px;
}

.current {
      border-bottom: 3px solid #c53a34;
}

@media (max-width:600px) {
      .menu, .content {
            max-width: 100%;
            padding: 5px 10px;
      }
      body {
            display: block;
      }
      div {
            width: 100%;
            display: block;
      }

      p {
            display: block;
    word-wrap: break-word;
    max-width: 97vw;

      }

}

.highlight .c {
      color: #75715e
}

/* Comment */

.highlight .err {
      color: #960050;
      background-color: #1e0010
}

/* Error */

.highlight .k {
      color: #66d9ef
}

/* Keyword */

.highlight .l {
      color: #ae81ff
}

/* Literal */

.highlight .n {
      color: #f8f8f2
}

/* Name */

.highlight .o {
      color: #f92672
}

/* Operator */

.highlight .p {
      color: #f8f8f2
}

/* Punctuation */

.highlight .cm {
      color: #75715e
}

/* Comment.Multiline */

.highlight .cp {
      color: #75715e
}

/* Comment.Preproc */

.highlight .c1 {
      color: #75715e
}

/* Comment.Single */

.highlight .cs {
      color: #75715e
}

/* Comment.Special */

.highlight .ge {
      font-style: italic
}

/* Generic.Emph */

.highlight .gs {
      font-weight: bold
}

/* Generic.Strong */

.highlight .kc {
      color: #66d9ef
}

/* Keyword.Constant */

.highlight .kd {
      color: #66d9ef
}

/* Keyword.Declaration */

.highlight .kn {
      color: #f92672
}

/* Keyword.Namespace */

.highlight .kp {
      color: #66d9ef
}

/* Keyword.Pseudo */

.highlight .kr {
      color: #66d9ef
}

/* Keyword.Reserved */

.highlight .kt {
      color: #66d9ef
}

/* Keyword.Type */

.highlight .ld {
      color: #e6db74
}

/* Literal.Date */

.highlight .m {
      color: #ae81ff
}

/* Literal.Number */

.highlight .s {
      color: #e6db74
}

/* Literal.String */

.highlight .na {
      color: #a6e22e
}

/* Name.Attribute */

.highlight .nb {
      color: #f8f8f2
}

/* Name.Builtin */

.highlight .nc {
      color: #a6e22e
}

/* Name.Class */

.highlight .no {
      color: #66d9ef
}

/* Name.Constant */

.highlight .nd {
      color: #a6e22e
}

/* Name.Decorator */

.highlight .ni {
      color: #f8f8f2
}

/* Name.Entity */

.highlight .ne {
      color: #a6e22e
}

/* Name.Exception */

.highlight .nf {
      color: #a6e22e
}

/* Name.Function */

.highlight .nl {
      color: #f8f8f2
}

/* Name.Label */

.highlight .nn {
      color: #f8f8f2
}

/* Name.Namespace */

.highlight .nx {
      color: #a6e22e
}

/* Name.Other */

.highlight .py {
      color: #f8f8f2
}

/* Name.Property */

.highlight .nt {
      color: #f92672
}

/* Name.Tag */

.highlight .nv {
      color: #f8f8f2
}

/* Name.Variable */

.highlight .ow {
      color: #f92672
}

/* Operator.Word */

.highlight .w {
      color: #f8f8f2
}

/* Text.Whitespace */

.highlight .mf {
      color: #ae81ff
}

/* Literal.Number.Float */

.highlight .mh {
      color: #ae81ff
}

/* Literal.Number.Hex */

.highlight .mi {
      color: #ae81ff
}

/* Literal.Number.Integer */

.highlight .mo {
      color: #ae81ff
}

/* Literal.Number.Oct */

.highlight .sb {
      color: #e6db74
}

/* Literal.String.Backtick */

.highlight .sc {
      color: #e6db74
}

/* Literal.String.Char */

.highlight .sd {
      color: #e6db74
}

/* Literal.String.Doc */

.highlight .s2 {
      color: #e6db74
}

/* Literal.String.Double */

.highlight .se {
      color: #ae81ff
}

/* Literal.String.Escape */

.highlight .sh {
      color: #e6db74
}

/* Literal.String.Heredoc */

.highlight .si {
      color: #e6db74
}

/* Literal.String.Interpol */

.highlight .sx {
      color: #e6db74
}

/* Literal.String.Other */

.highlight .sr {
      color: #e6db74
}

/* Literal.String.Regex */

.highlight .s1 {
      color: #e6db74
}

/* Literal.String.Single */

.highlight .ss {
      color: #e6db74
}

/* Literal.String.Symbol */

.highlight .bp {
      color: #f8f8f2
}

/* Name.Builtin.Pseudo */

.highlight .vc {
      color: #f8f8f2
}

/* Name.Variable.Class */

.highlight .vg {
      color: #f8f8f2
}

/* Name.Variable.Global */

.highlight .vi {
      color: #f8f8f2
}

/* Name.Variable.Instance */

.highlight .il {
      color: #ae81ff
}

/* Literal.Number.Integer.Long */

.highlight .gh {}

/* Generic Heading & Diff Header */

.highlight .gu {
      color: #75715e;
}

/* Generic.Subheading & Diff Unified/Comment? */

.highlight .gd {
      color: #f92672;
}

/* Generic.Deleted & Diff Deleted */

.highlight .gi {
      color: #a6e22e;
}

/* Generic.Inserted & Diff Inserted */

code.highlighter-rouge {
      border: 1px solid rgba(255, 255, 255, .1);
      padding: 0 .3em;
      border-radius: 3px;
      font-size: 1.1em;
}