@namespace epub "http://www.idpf.org/2007/ops"; body{ font-family: Georgia, serif; font-size: 18px; padding: 0 3em; margin: 8em auto 3em; max-width: 55ch; } body > header{ position: absolute; left: 0; right: 0; top: 0; background: #fff; border-bottom: 1px solid #999; box-shadow: 0 0 3px #ccc; } body > header ul{ display: flex; align-items: center; 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{ display: block; width: 180px; height: 42px; background: no-repeat center/100% url(/images/logo-full.svg); font-size: 0; } @media(max-width: 96ch){ body > header{ position: fixed; } body > header li:first-child > a{ width: 90px; height: 21px; } } body > nav, body > section, body > article{ min-height: 100vh; } body > section[epub|type~="titlepage"], body > section[epub|type~="halftitlepage"]{ min-height: auto; } 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: 65ch){ body{ padding: 0 1em; } 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-top: 2em; margin-bottom: 2em; } }