@namespace epub "http://www.idpf.org/2007/ops"; body{ font-family: georgia, serif; font-size: 18px; margin: 8rem auto 3rem; max-width: 55ch; min-height: calc(100vh - 8rem - 3rem); /* Size of header - body margin */ padding: 0 3rem; } body > header{ background: #fff; border-bottom: 1px solid #999; box-shadow: 0 0 3px #ccc; left: 0; position: absolute; right: 0; top: 0; z-index: 1000; /* Required so that SVGs don't scroll over the header */ } body > header ul{ align-items: center; display: flex; list-style: none; margin: 0; padding: 0.5em 1em; } body > header li{ margin-left: 1.5em; } body > header li:first-child{ margin-left: 0; margin-right: auto; } body > header li:first-child > a{ background: no-repeat center / 100% url("/images/logo-full.svg"); display: block; font-size: 0; height: 42px; transition: transform 200ms ease; width: 180px; } body > header li:first-child > a:hover{ transform: scale(1.025) rotate(1deg); } body > section[epub|type~="titlepage"], body > section[epub|type~="halftitlepage"]{ min-height: auto; } nav + section, section + nav, section + section, section + article, article + section, article + article{ box-sizing: border-box; margin-top: 12em !important; padding: 0; } nav[epub|type~="toc"] ol{ list-style: none; } @media(max-width: 96ch){ body > header{ position: fixed; } body > header li:first-child > a{ height: 21px; width: 90px; } } @media(max-width: 65ch){ body{ padding: 0 2rem; } section[epub|type~="imprint"] p{ width: 100%; } } @media(prefers-color-scheme: dark){ body, body > header{ background: #222222; color: #ffffff; } /* These three link colors provide WCAG AAA compliance at 16px */ a:link{ color: #6bb9f0; } a:active{ color: #e6cc22; } a:visited{ color: #dda0dd; } body > header li:first-child > a, img[epub|type~="se:image.color-depth.black-on-transparent"]{ filter: invert(1); } } @media(pointer: coarse) or (pointer: none){ nav[epub|type~="toc"] ol li{ margin-bottom: 2em; margin-top: 2em; } }