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