/* font */ @font-face { font-family: "IBM Plex Mono"; src: url("/static/fonts/ibm-plex-mono-medium-normal.woff2") format("woff2"); font-style: normal; font-weight: 400; } @font-face { font-family: "IBM Plex Mono"; src: url("/static/fonts/ibm-plex-mono-medium-italic.woff2") format("woff2"); font-style: italic; font-weight: 400; } @font-face { font-family: "IBM Plex Mono"; src: url("/static/fonts/ibm-plex-mono-bold-normal.woff2") format("woff2"); font-style: normal; font-weight: 600; } @font-face { font-family: "IBM Plex Mono"; src: url("/static/fonts/ibm-plex-mono-bold-italic.woff2") format("woff2"); font-style: italic; font-weight: 600; } @font-face { font-family: "Recoleta"; src: url("/static/fonts/recoleta-medium-normal.woff") format("woff"); font-style: normal; font-weight: 400; } @font-face { font-family: "Recoleta"; src: url("/static/fonts/recoleta-bold-normal.woff") format("woff"); font-style: normal; font-weight: 600; } /* page */ * { font-family: "IBM Plex Mono", monospace; } body { margin: 0 10vw 0 10vw; max-width: 96ch; } /* title */ h1 { font-size: 2em; margin-top: 1em; } header h1 { margin-bottom: 30vh; } header h1 a { text-decoration: none; font-size: 2em; font-family: "Recoleta"; letter-spacing: .08em; background-image: url("/static/underline.svg"); background-position-y: .5em; background-repeat: repeat-x; background-size: auto; } /* elements */ a, a:hover, a:visited { color: blue; } ul { padding-inline-start: 0; } ul li { display: block; } footer { background-color: blue; margin: 4em 0 4em 0; } footer a, footer a:hover, footer a:visited { color: white; } img { cursor: crosshair; max-width: 100%; } .figure-container { display: flex; flex-direction: row; width: 100%; margin: 4em 0 4em 0; } .figure-container figure { margin: 0; width: 100%; } .figure-container figure:not(:last-child) { margin-right: 1em; } figcaption { padding: 0 1em 0 1em; } /* mobile */ @media only screen and (max-width: 72ch) { /* title */ header h1 a { font-size: 13vw; } }