1 /**************************
2 * styles for talk slides *
6 **************************/
9 /***** base style *****/
12 font-family: 'Open Sans';
13 src: url('template/OpenSans-Regular-webfont.woff');
19 font-family: 'Open Sans';
20 src: url('template/OpenSans-Semibold-webfont.woff');
26 font-family: 'Open Sans';
27 src: url('template/OpenSans-Italic-webfont.woff');
33 font-family: 'Zilla Slab';
34 src: url('template/ZillaSlab-Regular.woff2');
40 font-family: 'Zilla Slab';
41 src: url('template/ZillaSlab-Bold.woff2');
47 font-family: 'Zilla Slab Highlight';
48 src: url('template/ZillaSlabHighlight-Regular.woff2');
54 font-family: 'Zilla Slab Highlight';
55 src: url('template/ZillaSlabHighlight-Bold.woff2');
61 overflow: hidden; /* to make translations not paint scrollbars */
70 font-family: "Open Sans", sans-serif;
89 font-family: "Zilla Slab", monospace;
90 border-bottom: 3px solid black;
104 background-color: black;
113 width: -moz-fit-content;
114 width: -webkit-fit-content;
120 background-color: black;
123 #header-text.neartime {
127 #header-text.ontime {
131 #header-text.overtime {
140 width: calc(100% - 50px);
149 font-family: "Zilla Slab", monospace;
154 #slidenav a:visited {
170 /* header is 40px, 7px to have a bit of distance,
171 * 3px height-reducing on the bottom for safety */
173 height: calc(100% - 50px);
176 transition-property: transform, opacity;
177 transition-duration: 3s;
178 transition-timing-function: ease;
179 transform-origin: center 5em;
183 transform: translate(-100%, 0);
186 transform: scale(0.1) rotate(360deg) translate(-200%, 0);
188 transform: scale(0.1) translate(-400%, 0);
191 article[aria-selected="true"] {
193 transform: scale(1) rotate(0deg) translate(0, 0);
196 article[aria-selected="true"] ~ article {
199 transform: translate(100%, 0);
202 transform: scale(0.1) rotate(-360deg) translate(200%, 0);
204 transform: scale(0.1) translate(400%, 0);
207 /***** headers *****/
211 font-family: "Zilla Slab", monospace;
218 font-family: "Zilla Slab Highlight", "Zilla Slab", monospace;
224 font-family: "Zilla Slab", monospace;
225 background-color: black;
255 background-color: white;
256 /* box-shadow: 0 0 0 1px black inset; */
257 /* border-bottom: 1px solid black; */
264 .captionedbox-content {
268 border-top: 1px solid black;
271 .captionedbox-caption {
285 .simplebox + .simplebox,
286 .simplebox + .mainbox,
287 .simplebox + .captionedbox,
288 .mainbox + .simplebox,
290 .mainbox + .captionedbox,
291 .captionedbox + .simplebox,
292 .captionedbox + .mainbox,
293 .captionedbox + .captionedbox {
294 border-top: 1px solid black;
297 /***** misc formatting *****/
300 font-family: "Zilla Slab", monospace;
303 background-color: #FFF44F;
307 font-family: "Zilla Slab", monospace;
311 border: 1px solid black;
318 /* box-shadow: black 1px 1px 3px 2px; */
328 .mainbox > .slidepic {
345 list-style-type: none;
349 list-style-type: none;
351 ul.arrows > li:before {
352 content: "\21d2\20"; /* \2192 would be single thin arrow, hex 20 is space */
364 text-decoration: underline;
371 a:link, a:visited { color: #00458B; text-decoration: none; }
372 a:hover, a:active { color: #959595; text-decoration: underline; }
374 mark a:link, mark a:visited { color: #005E5E; }
375 mark a:hover, mark a:active { color: #005E5E; }
377 h1 span a:link, h1 span a:visited,
378 h1 span a:hover, h1 span a:active { color: white; }
382 /***** small stuff *****/
393 margin: 0px 0px 0px 1em;
403 /***** specific slides *****/
408 vertical-align: bottom;
414 border: .5em solid #FF6600;
431 width: calc(100% - 2rem);
445 h2.endslidetext > span,
446 h3.endslidetext > span {
447 background-color: white;
451 .endslidetext:first-child {
455 .endslidetext:nth-child(2) {
459 .endslidetext:nth-child(3) {
463 @media (min-resolution: 1.35dppx) {
468 .endslidetext:first-child {
471 .endslidetext:nth-child(2) {
474 .endslidetext:nth-child(3) {