body { box-sizing: border-box; max-width: 34rem; margin: 0 auto; padding: 1rem; text-align: justify; font-family: 'Times New Roman', serif; } img { max-width: 100%; height: auto; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.25rem; } .muted { color: #888; font-size: 0.9rem; } .left, .right { display: block; font-size: 0.9rem; } @media (min-width: 58rem) { .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; } .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; } header { display: flex; justify-content: space-between; align-items: baseline; gap: 2rem; } .header-name { white-space: nowrap; } .header-links { text-align: right; } section pre { margin: 0; } .entry-list { margin: 0; } .entry { display: grid; grid-template-columns: 4rem 1fr; align-items: baseline; 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: 0.5rem; } .guestbook-entries { margin: 0; } .guestbook-entry { display: grid; grid-template-columns: 4rem 1fr; align-items: baseline; break-inside: avoid; } .guestbook-form { margin-top: 0.5rem; margin-left: 4rem; } 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; }