/**
 * Code formatting
 */

code {
  text-rendering: optimizeLegibility;
  font-feature-settings: "calt"1;
  font-variant-ligatures: normal;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  font-size: 15px;
  padding: 1px 4px;
  position: relative;
  top: -1px;
  border: 1px solid #d8d8d8;
  background-color: #f6f6f6;
  border-radius: 2px;
  font-family: $syntax-font-family;
}

pre.highlight {
  margin: 0 calc(51% - 50vw);
  padding: 25px;
  line-height: 1;
  font-family: $syntax-font-family;
  display: block;
  overflow-x: auto;

  >code {
    width: 100%;
    max-width: 37rem;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.5;
    display: block;
    border: 0;
    font-variant-ligatures: normal;
    background-color: transparent;
    font-feature-settings: "calt"1;
  }
}

.highlight table td {
  padding: 5px;
}

.highlight table pre {
  margin: 0;
}

.highlight,
.highlight .w {
  color: #fbf1c7;
  background-color: #282828;
}

.highlight .err {
  color: #fb4934;
  background-color: #282828;
  font-weight: bold;
}

.highlight .c,
.highlight .cd,
.highlight .cm,
.highlight .c1,
.highlight .cs {
  color: #928374;
  font-style: italic;
}

.highlight .cp {
  color: #8ec07c;
}

.highlight .nt {
  color: #fb4934;
}

.highlight .o,
.highlight .ow {
  color: #fbf1c7;
}

.highlight .p,
.highlight .pi {
  color: #fbf1c7;
}

.highlight .gi {
  color: #b8bb26;
  background-color: #282828;
}

.highlight .gd {
  color: #fb4934;
  background-color: #282828;
}

.highlight .gh {
  color: #b8bb26;
  font-weight: bold;
}

.highlight .k,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .kv {
  color: #fb4934;
}

.highlight .kc {
  color: #d3869b;
}

.highlight .kt {
  color: #fabd2f;
}

.highlight .kd {
  color: #fe8019;
}

.highlight .s,
.highlight .sb,
.highlight .sc,
.highlight .sd,
.highlight .s2,
.highlight .sh,
.highlight .sx,
.highlight .s1 {
  color: #b8bb26;
  font-style: italic;
}

.highlight .si {
  color: #b8bb26;
  font-style: italic;
}

.highlight .sr {
  color: #b8bb26;
  font-style: italic;
}

.highlight .se {
  color: #fe8019;
}

.highlight .nn {
  color: #8ec07c;
}

.highlight .nc {
  color: #8ec07c;
}

.highlight .no {
  color: #d3869b;
}

.highlight .na {
  color: #b8bb26;
}

.highlight .m,
.highlight .mf,
.highlight .mh,
.highlight .mi,
.highlight .il,
.highlight .mo,
.highlight .mb,
.highlight .mx {
  color: #d3869b;
}

.highlight .ss {
  color: #83a598;
}