blob: 8fbda470ea4a0b4d5bbd9c04f77ba44ec00b615e [file] [log] [blame]
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +02001/**
2 * A simple theme for reveal.js presentations, similar
3 * to the default theme. The accent color is darkblue.
4 *
5 * This theme is Copyright (C) 2012 Owen Versteeg, https://github.com/StereotypicalApps. It is MIT licensed.
6 * reveal.js is Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
7 */
Marc Kupietz9c036a42024-05-14 13:17:25 +02008@import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700);
9@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +020010section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 {
11 color: #fff;
12}
13
14/*********************************************
15 * GLOBAL STYLES
16 *********************************************/
17:root {
18 --r-background-color: #fff;
19 --r-main-font: Lato, sans-serif;
20 --r-main-font-size: 40px;
21 --r-main-color: #000;
22 --r-block-margin: 20px;
23 --r-heading-margin: 0 0 20px 0;
24 --r-heading-font: News Cycle, Impact, sans-serif;
25 --r-heading-color: #000;
26 --r-heading-line-height: 1.2;
27 --r-heading-letter-spacing: normal;
28 --r-heading-text-transform: none;
29 --r-heading-text-shadow: none;
30 --r-heading-font-weight: normal;
31 --r-heading1-text-shadow: none;
32 --r-heading1-size: 3.77em;
33 --r-heading2-size: 2.11em;
34 --r-heading3-size: 1.55em;
35 --r-heading4-size: 1em;
36 --r-code-font: monospace;
37 --r-link-color: #00008B;
38 --r-link-color-dark: #00003f;
39 --r-link-color-hover: #0000f1;
40 --r-selection-background-color: rgba(0, 0, 0, 0.99);
41 --r-selection-color: #fff;
Marc Kupietz9c036a42024-05-14 13:17:25 +020042 --r-overlay-element-bg-color: 0, 0, 0;
43 --r-overlay-element-fg-color: 240, 240, 240;
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +020044}
45
46.reveal-viewport {
47 background: #fff;
48 background-color: var(--r-background-color);
49}
50
51.reveal {
52 font-family: var(--r-main-font);
53 font-size: var(--r-main-font-size);
54 font-weight: normal;
55 color: var(--r-main-color);
56}
57
58.reveal ::selection {
59 color: var(--r-selection-color);
60 background: var(--r-selection-background-color);
61 text-shadow: none;
62}
63
64.reveal ::-moz-selection {
65 color: var(--r-selection-color);
66 background: var(--r-selection-background-color);
67 text-shadow: none;
68}
69
70.reveal .slides section,
71.reveal .slides section > section {
72 line-height: 1.3;
73 font-weight: inherit;
74}
75
76/*********************************************
77 * HEADERS
78 *********************************************/
79.reveal h1,
80.reveal h2,
81.reveal h3,
82.reveal h4,
83.reveal h5,
84.reveal h6 {
85 margin: var(--r-heading-margin);
86 color: var(--r-heading-color);
87 font-family: var(--r-heading-font);
88 font-weight: var(--r-heading-font-weight);
89 line-height: var(--r-heading-line-height);
90 letter-spacing: var(--r-heading-letter-spacing);
91 text-transform: var(--r-heading-text-transform);
92 text-shadow: var(--r-heading-text-shadow);
93 word-wrap: break-word;
94}
95
96.reveal h1 {
97 font-size: var(--r-heading1-size);
98}
99
100.reveal h2 {
101 font-size: var(--r-heading2-size);
102}
103
104.reveal h3 {
105 font-size: var(--r-heading3-size);
106}
107
108.reveal h4 {
109 font-size: var(--r-heading4-size);
110}
111
112.reveal h1 {
113 text-shadow: var(--r-heading1-text-shadow);
114}
115
116/*********************************************
117 * OTHER
118 *********************************************/
119.reveal p {
120 margin: var(--r-block-margin) 0;
121 line-height: 1.3;
122}
123
124/* Remove trailing margins after titles */
125.reveal h1:last-child,
126.reveal h2:last-child,
127.reveal h3:last-child,
128.reveal h4:last-child,
129.reveal h5:last-child,
130.reveal h6:last-child {
131 margin-bottom: 0;
132}
133
134/* Ensure certain elements are never larger than the slide itself */
135.reveal img,
136.reveal video,
137.reveal iframe {
138 max-width: 95%;
139 max-height: 95%;
140}
141
142.reveal strong,
143.reveal b {
144 font-weight: bold;
145}
146
147.reveal em {
148 font-style: italic;
149}
150
151.reveal ol,
152.reveal dl,
153.reveal ul {
154 display: inline-block;
155 text-align: left;
156 margin: 0 0 0 1em;
157}
158
159.reveal ol {
160 list-style-type: decimal;
161}
162
163.reveal ul {
164 list-style-type: disc;
165}
166
167.reveal ul ul {
168 list-style-type: square;
169}
170
171.reveal ul ul ul {
172 list-style-type: circle;
173}
174
175.reveal ul ul,
176.reveal ul ol,
177.reveal ol ol,
178.reveal ol ul {
179 display: block;
180 margin-left: 40px;
181}
182
183.reveal dt {
184 font-weight: bold;
185}
186
187.reveal dd {
188 margin-left: 40px;
189}
190
191.reveal blockquote {
192 display: block;
193 position: relative;
194 width: 70%;
195 margin: var(--r-block-margin) auto;
196 padding: 5px;
197 font-style: italic;
198 background: rgba(255, 255, 255, 0.05);
199 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
200}
201
202.reveal blockquote p:first-child,
203.reveal blockquote p:last-child {
204 display: inline-block;
205}
206
207.reveal q {
208 font-style: italic;
209}
210
211.reveal pre {
212 display: block;
213 position: relative;
214 width: 90%;
215 margin: var(--r-block-margin) auto;
216 text-align: left;
217 font-size: 0.55em;
218 font-family: var(--r-code-font);
219 line-height: 1.2em;
220 word-wrap: break-word;
221 box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15);
222}
223
224.reveal code {
225 font-family: var(--r-code-font);
226 text-transform: none;
227 tab-size: 2;
228}
229
230.reveal pre code {
231 display: block;
232 padding: 5px;
233 overflow: auto;
234 max-height: 400px;
235 word-wrap: normal;
236}
237
238.reveal .code-wrapper {
239 white-space: normal;
240}
241
242.reveal .code-wrapper code {
243 white-space: pre;
244}
245
246.reveal table {
247 margin: auto;
248 border-collapse: collapse;
249 border-spacing: 0;
250}
251
252.reveal table th {
253 font-weight: bold;
254}
255
256.reveal table th,
257.reveal table td {
258 text-align: left;
259 padding: 0.2em 0.5em 0.2em 0.5em;
260 border-bottom: 1px solid;
261}
262
263.reveal table th[align=center],
264.reveal table td[align=center] {
265 text-align: center;
266}
267
268.reveal table th[align=right],
269.reveal table td[align=right] {
270 text-align: right;
271}
272
273.reveal table tbody tr:last-child th,
274.reveal table tbody tr:last-child td {
275 border-bottom: none;
276}
277
278.reveal sup {
279 vertical-align: super;
280 font-size: smaller;
281}
282
283.reveal sub {
284 vertical-align: sub;
285 font-size: smaller;
286}
287
288.reveal small {
289 display: inline-block;
290 font-size: 0.6em;
291 line-height: 1.2em;
292 vertical-align: top;
293}
294
295.reveal small * {
296 vertical-align: top;
297}
298
299.reveal img {
300 margin: var(--r-block-margin) 0;
301}
302
303/*********************************************
304 * LINKS
305 *********************************************/
306.reveal a {
307 color: var(--r-link-color);
308 text-decoration: none;
309 transition: color 0.15s ease;
310}
311
312.reveal a:hover {
313 color: var(--r-link-color-hover);
314 text-shadow: none;
315 border: none;
316}
317
318.reveal .roll span:after {
319 color: #fff;
320 background: var(--r-link-color-dark);
321}
322
323/*********************************************
324 * Frame helper
325 *********************************************/
326.reveal .r-frame {
327 border: 4px solid var(--r-main-color);
328 box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
329}
330
331.reveal a .r-frame {
332 transition: all 0.15s linear;
333}
334
335.reveal a:hover .r-frame {
336 border-color: var(--r-link-color);
337 box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
338}
339
340/*********************************************
341 * NAVIGATION CONTROLS
342 *********************************************/
343.reveal .controls {
344 color: var(--r-link-color);
345}
346
347/*********************************************
348 * PROGRESS BAR
349 *********************************************/
350.reveal .progress {
351 background: rgba(0, 0, 0, 0.2);
352 color: var(--r-link-color);
353}
354
355/*********************************************
356 * PRINT BACKGROUND
357 *********************************************/
358@media print {
359 .backgrounds {
360 background-color: var(--r-background-color);
361 }
Marc Kupietz9c036a42024-05-14 13:17:25 +0200362}