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