body { box-sizing: border-box; max-width: 48rem; margin: 0 auto; padding: 1rem; text-align: justify; } img { max-width: 100%; height: auto; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.25rem; } .muted { color: #888; } .left, .right { display: block; font-size: 0.9rem; } @media (min-width: 63rem) { .left, .right { display: inline; position: relative; width: 10rem; margin-top: -2.25em; } .left { float: left; margin-left: -12rem; } .right { float: right; margin-right: -12rem; } } div.grid { display: grid; grid-template-columns: minmax(2.375rem, min-content) 1fr; gap: 0.375rem 0.75rem; line-height: 1.25; margin-bottom: 2rem; margin-top: 0; } div.grid .label, div.grid .link { display: block; margin-top: 0.375rem; margin-block: 0; white-space: nowrap; font-variant-numeric: tabular-nums; line-height: 1.4; } div.grid .label { text-align: right; color: #888; font-style: italic; } div.grid .link { text-align: right; } div.grid .content { display: block; } section { margin: 1rem 0; } section .section-label { font-family: monospace; } .home-name-link { display: none; } html[data-just] .home-name { display: none; } html[data-just] .home-name-link { display: inline; } html[data-has] .guestbook-form { display: none; } section pre { margin: 0; } .entry-list { columns: 2 24ch; column-gap: 3ch; font-family: monospace; margin: 0; } .entry { display: grid; grid-template-columns: 10ch 1fr; break-inside: avoid; } .entry-content { display: flex; overflow: hidden; white-space: nowrap; } .entry-content > a { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; } .entry-suffix { flex: 1 10000 0%; min-width: 0; overflow: hidden; text-overflow: ellipsis; text-align: right; padding-left: 1ch; } .guestbook-entries { font-family: monospace; white-space: pre; } .guestbook-entry { display: grid; grid-template-columns: 10ch 1fr; } .guestbook-entry > span:last-child { white-space: normal; } .guestbook-form { margin-top: 0.5rem; margin-left: 10ch; font-family: monospace; } html[data-compact] .list-meta { display: none; } html[data-compact] .entry { display: block; } html[data-compact] .entry-list { columns: 1; } html[data-compact] .guestbook-entry { display: block; } html[data-compact] .guestbook-form { margin-left: 0 !important; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }