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