* { box-sizing: border-box; } body { background-color: #fffaf7; font-family: system-ui, "Helvetica Neue", "Lucida Grande", sans-serif; line-height: 1.55; margin: 1rem auto; max-width: 60ch; padding: 10px; } h1,h2,h3,h4,h5,h6 { line-height: 1.2; } h2,h3,h4,h5,h6 { border-bottom: 1px solid; margin: 3rem 0 0; padding-bottom: 0.5rem; } a,a:visited { color: darkred; } a:hover,a:focus { background: yellow; color: black; } figcaption { font-size: 12px; } hr { background: grey; border: 0; height: 1px; margin: 2rem 0; } img { height: auto; max-width: 100%; width: auto; } code { background-color: white; border: 1px solid; font-size: 90%; padding: 0.1rem 0.3rem; tab-size: 4; } pre { background-color: white; border: 1px solid; } pre code { border: 0; display: block; overflow-x: auto; padding: 0.3rem 0.6rem; } table { border-collapse: collapse; margin: 2rem 0; display: block; overflow-x: auto; white-space: nowrap; text-align: left; width: 100%; } tbody { display: table; min-width: 500px; width: 100%; } tr { border-bottom: 1px solid lightgrey; } td:last-of-type,th:last-of-type { text-align: right; } .post-list { list-style: none; margin: 1rem 0 0; padding: 0; } .post-list li { align-items: center; display: flex; flex-direction: row-reverse; justify-content: space-between; margin: 0 0 10px; } .post-list li small { font-variant-numeric: tabular-nums; } @media(max-width:650px) { .post-list li { align-items: flex-start; flex-direction: column; justify-content: baseline; margin: 0 0 15px; } }