/* variables */ :root { --font-size: 18pt; --line-height: 1.25; --font-family: monospace; /* font-derived width and height units */ --w-un: 1ch; --h-un: calc(var(--font-size) * var(--line-height)); /* colors */ --fg-c: #e2e2e2; --bg-c: #000000; --blue-c: #856cff; --magenta-c: #ff1170; } /* reset */ * { box-sizing: inherit; margin: unset; } :root { box-sizing: border-box; color: var(--fg-c); background-color: var(--bg-c); font: var(--font-size)/var(--line-height) var(--font-family); } :link, :visited { text-decoration: none; color: var(--blue-c); } h1, h2, h3, h4, h5, h6 { color: var(--magenta-c); font: inherit; } button { border: unset; background: unset; font: inherit; cursor: pointer; } select { appearance: none; border: unset; background: unset; font: inherit; cursor: pointer; } div { max-height: 100%; } .float { height: 100%; display: grid; grid-template-rows: 1fr auto; } img { background: var(--fg-c); } .figcaption { } /* layout */ .slide { max-height: 100%; padding: var(--h-un) var(--w-un); } /* footer */ body>footer { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; justify-items: center; } body>footer * { max-width: 100%; color: var(--blue-c); text-transform: lowercase; overflow-x: hidden; text-overflow: ellipsis; } body>footer :active { color: var(--magenta-c); } /* s5 #slide0 */ #slide0 { } #slide0 h1 { /* title */ /* position: static; margin: 1em 0 0; padding: 0; font: bold 2em Helvetica, sans-serif; white-space: normal; background: transparent; */ } #slide0 h2 { /* subtitle */ } #slide0 h3 { /* author */ } #slide0 h4 { /* date */ } #slide0 #footer { } ul, pre { margin: 0; line-height: 1em; } blockquote { padding: 0 2em 0.5em; margin: 0 1.5em 0.5em; text-align: center; font-size: 1em; } blockquote p { margin: 0; } blockquote i { font-style: normal; } blockquote b { display: block; margin-top: 0.5em; font-weight: normal; font-size: smaller; font-style: normal; } blockquote b i { font-style: italic; } kbd { font-weight: bold; font-size: 1em; } sup { font-size: smaller; line-height: 1px; } .slide code { padding: 2px 0.25em; font-weight: bold; color: #533; } .slide code.bad, code del { color: red; } .slide code.old { color: silver; } .slide pre { padding: 0; margin: 0.25em 0 0.5em 0.5em; color: #533; font-size: 90%; } .slide pre code { display: block; } .slide ul { margin-left: 5%; margin-right: 7%; list-style: disc; } .slide li { margin-top: 0.75em; margin-right: 0; } .slide ul ul { line-height: 1; } .slide ul ul li { margin: .2em; font-size: 85%; list-style: square; } .slide img.leader { display: block; margin: 0 auto; } div.long { font-size: 0.75em; } .slide h1 { } .slide h3 { } h1 abbr { font-variant: small-caps; } div#controls { position: absolute; left: 50%; bottom: 0; width: 50%; text-align: right; /* font: bold 0.9em Verdana, Helvetica, sans-serif; */ } html>body div#controls { position: fixed; padding: 0 0 1em 0; top: auto; } div#controls form { position: absolute; bottom: 0; right: 0; width: 100%; margin: 0; padding: 0; } #controls #navLinks a { padding: 0; margin: 0 0.5em; background: #005; border: none; color: #779; cursor: pointer; } #controls #navList { height: 1em; } #controls #navList #jumplist { position: absolute; bottom: 0; right: 0; background: #DDD; color: #227; } ul.urls { list-style: none; display: inline; margin: 0; } .urls li { display: inline; margin: 0; } .note { display: none; } .external { border-bottom: 1px dotted gray; } html>body .external { border-bottom: none; } .external:after { content: " \274F"; font-size: smaller; color: #77B; } .incremental, .incremental *, .incremental *:after { color: #DDE; visibility: visible; } img.incremental { visibility: hidden; } .slide .current { color: #B02; }