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