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