@font-face {
  font-family: "Vollkorn";
  font-variant-ligatures: common;
  src: url("type/vollkorn-4-105/PS-OTF/Vollkorn-Medium.otf") format("opentype");
}

@font-face {
  font-family: "Public Sans";
  font-variant-ligatures: common;
  src: url("type/public-sans-v2.001/fonts/otf/PublicSans-Light.otf") format("opentype");
}

html {
  font-family: "Public Sans";
  max-width: 720px;
  line-height: 1.35;
  margin: 0 auto;
}

iframe {
    max-width: 100%;
}

.content {
  font-family: "Public Sans";
  line-height: 1.35;
}

@media(min-width:768px) {
    .content {
        width: 40rem;
    }
}

.heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

.timestamp {
  font-family: monospace;
  color: rgba(0, 0, 0, 0.8);
}

h1 {
  font-family: Vollkorn;
  font-size: 2.8em;
  letter-spacing: -1px;
  font-weight: 400;
  margin-bottom: 0;
}

h1 + p { margin-top: 0.32rem; }
h2 + p { margin-top: 0.32rem; }
p + p { margin-top: 0; }

h2 {
  font-family: Vollkorn;
  font-size: 1.6em;
  font-weight: 400;
  letter-spacing: -0.32px;
  margin: 0.5em 0;
}

hr {
    width: 100%;
    border: none;
    border-top: 1px dashed #333;
    margin: 2em 0;
}

pre {
  font-size: 1.2em;
}

h1 a, h2 a{
  color: inherit;           /* Use the h1's text color */
  text-decoration: none;    /* Remove underline */
  cursor: pointer;          /* Keep cursor as pointer (optional) */
}
h1 a:hover, h2 a:hover {
  text-decoration: underline;    /* Remove underline */
}
h1 a:visited, h2 a:visited {
  color: inherit;           /* Use the h1's text color */
  text-decoration: none;    /* Remove underline */
}
