@font-face {
  font-display: swap;
  font-family: "Inconsolata";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/inconsolata-v36-latin-regular.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Inconsolata";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/inconsolata-v36-latin-800.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Schoolbell";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/schoolbell-v18-latin-regular.woff2") format("woff2");
}
@media (640px <= width) {
  main {
    position: relative;
    width: calc(100% - 18em - 3em);
    left: 18em;
    display: flex;
    flex-wrap: wrap;
  }
  nav {
    position: fixed;
    overflow-y: scroll;
    height: 100%;
    width: 18em;
    left: 0;
    top: 0;
    border-right: #090909 0.28em solid;
  }
  nav #portrait {
    left: -0.11em;
    top: 6.3em;
  }
  nav h1 {
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    left: 3em;
    top: 0.25em;
    font-size: var(--main-font-size);
  }
  nav h1 #logo-desktop {
    display: inline-block;
    width: 9em;
  }
  nav h1 #logo-mobile {
    display: none;
  }
  nav #menu {
    position: relative;
    top: 18em;
    padding-bottom: 2.5em;
  }
  nav #menu #menu-box {
    display: none;
  }
  nav #menu #menu-container li {
    display: table;
    margin: 0;
    padding: 0.4em 1.5em 0.4em 2.5em;
  }
  nav #menu #menu-container li::before {
    display: none;
  }
  nav #menu #menu-container li.here::after {
    content: "";
    background-image: url("../img/bullet-emph.svg");
    background-repeat: no-repeat;
    background-size: 100%;
    transition: rotate 0.4s;
    display: inline-block;
    width: 1em;
    height: 1em;
    position: relative;
    top: 0.15em;
    left: 0.35em;
  }
  nav #menu #menu-container li.here:hover::after {
    rotate: 108deg;
    transition: rotate 0.4s;
  }
  nav #menu #menu-container a {
    text-decoration: none;
  }
  footer {
    font-size: 80%;
    background-color: #141519;
    position: fixed;
    width: 18em;
    bottom: 0;
    padding-top: 1em;
    padding-left: 2.185em;
    padding-right: 2.185em;
  }
}
@media (640px <= width < 1000px) {
  article {
    width: calc(100% - 3em);
    min-width: calc(100% - 3em);
  }
}
@media (1000px <= width) {
  main {
    padding-left: 1.5em;
    padding-right: 1.5em;
  }
  article:not(.fullwidth) {
    width: calc(50% - 3em);
    min-width: calc(50% - 3em);
  }
  article.fullwidth {
    width: calc(100% - 3em);
    min-width: calc(100% - 3em);
  }
  article.fullwidth figure {
    width: 60%;
  }
  article.fullwidth div.highlight pre {
    margin-left: 2em;
    margin-right: 2em;
  }
}

/*# sourceMappingURL=desktop.css.map */