@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

pre,
code {
  font-family: Menlo, Monaco, "Courier New", monospace;
  font-size: 85%;
}

pre {
  padding: .5rem;
  line-height: 1.25;
  overflow-x: scroll;
}

a,
a:visited {
  color: #3498db;
}

a:hover,
a:focus,
a:active {
  color: #2980b9;
}

.modest-no-decoration {
  text-decoration: none;
}

html {
  background-color: #131516;
  font-size: 12px;
}

@media screen and (min-width: 32rem) and (max-width: 48rem) {
  html {
    font-size: 15px;
  }
}

@media screen and (min-width: 48rem) {
  html {
    font-size: 16px;
  }
}

body {
  line-height: 1.85;
}

p,
.modest-p {
  font-size: 1rem;
  margin-bottom: 1.3rem;
}

h1,
.modest-h1,
h2,
.modest-h2,
h3,
.modest-h3,
h4,
.modest-h4 {
  margin: 1.414rem 0 .5rem;
  font-weight: inherit;
  line-height: 1.42;
}

h1,
.modest-h1 {
  margin-top: 0;
  font-size: 3.998rem;
}

h2,
.modest-h2 {
  font-size: 2.827rem;
}

h3,
.modest-h3 {
  font-size: 1.999rem;
}

h4,
.modest-h4 {
  font-size: 1.414rem;
}

h5,
.modest-h5 {
  font-size: 1.121rem;
}

h6,
.modest-h6 {
  font-size: .88rem;
}

small,
.modest-small {
  font-size: .707em;
}

/* https://github.com/mrmrs/fluidity */

img,
canvas,
iframe,
video,
svg,
select,
textarea {
  max-width: 100%;
}

@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700);

@import url(http://fonts.googleapis.com/css?family=Arimo:700,700italic);

html {
  font-size: 18px;
  max-width: 100%;
}

body {
  color: rgb(200, 195, 188);
  font-family: 'Open Sans Condensed', sans-serif;
  font-weight: 300;
  margin: 0 auto;
  max-width: 48rem;
  line-height: 1.45;
  padding: .25rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Arimo, Helvetica, sans-serif;
}

h1,
h2,
h3 {
  border-bottom: 2px solid #fafafa;
  margin-bottom: 1.15rem;
  padding-bottom: .5rem;
  text-align: center;
}

blockquote {
  border-left: 8px solid #fafafa;
  padding: 1rem;
}

pre,
code {
  background-color: rgb(29, 31, 32);
}

.sourceCode { overflow: overlay; }

.rainbow-text {
  background-image: linear-gradient(to left, #844deb, red , #9f26f0, cyan);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: 0;
  font-weight: bold;
}

.topnav {
  background-color: #691fe0;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 6px;
}

.topnav li {
  float: left;
}

.topnav a {
  display: block;
  color: white;
  text-align: center;
  padding: 12px 12px;
  text-decoration: none;
}

@media screen and (max-width: 900px)  {
    .topnav li {
        float: none;
    }

    .topnav a {
        padding: 7px 7px;
    }
}

.topnav a:hover {
  background-color: #000;
  color: #fff;
}

.profile-section {
  border-radius: 6px;
  padding-top: 10px;
  padding-left: 20px;
  overflow-wrap: normal;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background-color: #dfdfdf;
  border-radius: 10px;
}

h1, h2, h3, h4, h5, h6 {
  color: #cccccc;
}

.highlight {background-color:#fff;color:#333333;}
.highlight .hll {background-color:#ffffcc;}
.highlight .c{color:#999988;font-style:italic}
.highlight .err{color:#a61717;background-color:#e3d2d2}
.highlight .k{font-weight:bold}
.highlight .o{font-weight:bold}
.highlight .cm{color:#999988;font-style:italic}
.highlight .cp{color:#999999;font-weight:bold}
.highlight .c1{color:#999988;font-style:italic}
.highlight .cs{color:#999999;font-weight:bold;font-style:italic}
.highlight .gd{color:#000000;background-color:#ffdddd}
.highlight .ge{font-style:italic}
.highlight .gr{color:#aa0000}
.highlight .gh{color:#999999}
.highlight .gi{color:#000000;background-color:#ddffdd}
.highlight .go{color:#888888}
.highlight .gp{color:#555555}
.highlight .gs{font-weight:bold}
.highlight .gu{color:#800080;font-weight:bold}
.highlight .gt{color:#aa0000}
.highlight .kc{font-weight:bold}
.highlight .kd{font-weight:bold}
.highlight .kn{font-weight:bold}
.highlight .kp{font-weight:bold}
.highlight .kr{font-weight:bold}
.highlight .kt{color:#445588;font-weight:bold}
.highlight .m{color:#009999}
.highlight .s{color:#dd1144}
.highlight .n{color:#333333}
.highlight .na{color:teal}
.highlight .nb{color:#0086b3}
.highlight .nc{color:#445588;font-weight:bold}
.highlight .no{color:teal}
.highlight .ni{color:purple}
.highlight .ne{color:#990000;font-weight:bold}
.highlight .nf{color:#990000;font-weight:bold}
.highlight .nn{color:#555555}
.highlight .nt{color:navy}
.highlight .nv{color:teal}
.highlight .ow{font-weight:bold}
.highlight .w{color:#bbbbbb}
.highlight .mf{color:#009999}
.highlight .mh{color:#009999}
.highlight .mi{color:#009999}
.highlight .mo{color:#009999}
.highlight .sb{color:#dd1144}
.highlight .sc{color:#dd1144}
.highlight .sd{color:#dd1144}
.highlight .s2{color:#dd1144}
.highlight .se{color:#dd1144}
.highlight .sh{color:#dd1144}
.highlight .si{color:#dd1144}
.highlight .sx{color:#dd1144}
.highlight .sr{color:#009926}
.highlight .s1{color:#dd1144}
.highlight .ss{color:#990073}
.highlight .bp{color:#999999}
.highlight .vc{color:teal}
.highlight .vg{color:teal}
.highlight .vi{color:teal}
.highlight .il{color:#009999}
.highlight .gc{color:#999;background-color:#EAF2F5}