blob: d7c33406e6aceaf385c1588070bf2c97f5350b6d [file] [log] [blame]
JJ Allaireefa6ad42016-01-30 13:12:05 -05001/**
2 * Solarized Dark theme for reveal.js.
3 * Author: Achim Staebler
4 */
5@import url(../../lib/font/league-gothic/league-gothic.css);
JJ Allairecff9e7c2016-01-30 14:04:35 -05006
7@font-face {
8 font-family: 'Lato';
9 font-style: normal;
10 font-weight: 400;
11 src: url(fonts/Lato.ttf) format('truetype');
12}
13@font-face {
14 font-family: 'Lato';
15 font-style: normal;
16 font-weight: 700;
17 src: url(fonts/LatoBold.ttf) format('truetype');
18}
19@font-face {
20 font-family: 'Lato';
21 font-style: italic;
22 font-weight: 400;
23 src: url(fonts/LatoItalic.ttf) format('truetype');
24}
25@font-face {
26 font-family: 'Lato';
27 font-style: italic;
28 font-weight: 700;
29 src: url(fonts/LatoBoldItalic.ttf) format('truetype');
30}
31
32
JJ Allaireefa6ad42016-01-30 13:12:05 -050033/**
34 * Solarized colors by Ethan Schoonover
35 */
36html * {
37 color-profile: sRGB;
38 rendering-intent: auto; }
39
40/*********************************************
41 * GLOBAL STYLES
42 *********************************************/
43body {
44 background: #002b36;
45 background-color: #002b36; }
46
47.reveal {
48 font-family: "Lato", sans-serif;
49 font-size: 36px;
50 font-weight: normal;
51 color: #93a1a1; }
52
53::selection {
54 color: #fff;
55 background: #d33682;
56 text-shadow: none; }
57
58.reveal .slides > section,
59.reveal .slides > section > section {
60 line-height: 1.3;
61 font-weight: inherit; }
62
63/*********************************************
64 * HEADERS
65 *********************************************/
66.reveal h1,
67.reveal h2,
68.reveal h3,
69.reveal h4,
70.reveal h5,
71.reveal h6 {
72 margin: 0 0 20px 0;
73 color: #eee8d5;
74 font-family: "League Gothic", Impact, sans-serif;
75 font-weight: normal;
76 line-height: 1.2;
77 letter-spacing: normal;
78 text-transform: uppercase;
79 text-shadow: none;
80 word-wrap: break-word; }
81
82.reveal h1 {
83 font-size: 3.77em; }
84
85.reveal h2 {
86 font-size: 2.11em; }
87
88.reveal h3 {
89 font-size: 1.55em; }
90
91.reveal h4 {
92 font-size: 1em; }
93
94.reveal h1 {
95 text-shadow: none; }
96
97/*********************************************
98 * OTHER
99 *********************************************/
100.reveal p {
101 margin: 20px 0;
102 line-height: 1.3; }
103
104/* Ensure certain elements are never larger than the slide itself */
105.reveal img,
106.reveal video,
107.reveal iframe {
108 max-width: 95%;
109 max-height: 95%; }
110
111.reveal strong,
112.reveal b {
113 font-weight: bold; }
114
115.reveal em {
116 font-style: italic; }
117
118.reveal ol,
119.reveal dl,
120.reveal ul {
121 display: inline-block;
122 text-align: left;
123 margin: 0 0 0 1em; }
124
125.reveal ol {
126 list-style-type: decimal; }
127
128.reveal ul {
129 list-style-type: disc; }
130
131.reveal ul ul {
132 list-style-type: square; }
133
134.reveal ul ul ul {
135 list-style-type: circle; }
136
137.reveal ul ul,
138.reveal ul ol,
139.reveal ol ol,
140.reveal ol ul {
141 display: block;
142 margin-left: 40px; }
143
144.reveal dt {
145 font-weight: bold; }
146
147.reveal dd {
148 margin-left: 40px; }
149
150.reveal q,
151.reveal blockquote {
152 quotes: none; }
153
154.reveal blockquote {
155 display: block;
156 position: relative;
157 width: 70%;
158 margin: 20px auto;
159 padding: 5px;
160 font-style: italic;
161 background: rgba(255, 255, 255, 0.05);
162 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
163
164.reveal blockquote p:first-child,
165.reveal blockquote p:last-child {
166 display: inline-block; }
167
168.reveal q {
169 font-style: italic; }
170
171.reveal pre {
172 display: block;
173 position: relative;
174 width: 90%;
175 margin: 20px auto;
176 text-align: left;
177 font-size: 0.55em;
178 font-family: monospace;
179 line-height: 1.2em;
180 word-wrap: break-word;
181 box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
182
183.reveal code {
184 font-family: monospace; }
185
186.reveal pre code {
187 display: block;
188 padding: 5px;
189 overflow: auto;
190 max-height: 400px;
191 word-wrap: normal; }
192
193.reveal table {
194 margin: auto;
195 border-collapse: collapse;
196 border-spacing: 0; }
197
198.reveal table th {
199 font-weight: bold; }
200
201.reveal table th,
202.reveal table td {
203 text-align: left;
204 padding: 0.2em 0.5em 0.2em 0.5em;
205 border-bottom: 1px solid; }
206
207.reveal table th[align="center"],
208.reveal table td[align="center"] {
209 text-align: center; }
210
211.reveal table th[align="right"],
212.reveal table td[align="right"] {
213 text-align: right; }
214
215.reveal table tr:last-child td {
216 border-bottom: none; }
217
218.reveal sup {
219 vertical-align: super; }
220
221.reveal sub {
222 vertical-align: sub; }
223
224.reveal small {
225 display: inline-block;
226 font-size: 0.6em;
227 line-height: 1.2em;
228 vertical-align: top; }
229
230.reveal small * {
231 vertical-align: top; }
232
233/*********************************************
234 * LINKS
235 *********************************************/
236.reveal a {
237 color: #268bd2;
238 text-decoration: none;
239 -webkit-transition: color 0.15s ease;
240 -moz-transition: color 0.15s ease;
241 transition: color 0.15s ease; }
242
243.reveal a:hover {
244 color: #78b9e6;
245 text-shadow: none;
246 border: none; }
247
248.reveal .roll span:after {
249 color: #fff;
250 background: #1a6091; }
251
252/*********************************************
253 * IMAGES
254 *********************************************/
255.reveal section img {
256 margin: 15px 0px;
257 background: rgba(255, 255, 255, 0.12);
258 border: 4px solid #93a1a1;
259 box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
260
261.reveal section img.plain {
262 border: 0;
263 box-shadow: none; }
264
265.reveal a img {
266 -webkit-transition: all 0.15s linear;
267 -moz-transition: all 0.15s linear;
268 transition: all 0.15s linear; }
269
270.reveal a:hover img {
271 background: rgba(255, 255, 255, 0.2);
272 border-color: #268bd2;
273 box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
274
275/*********************************************
276 * NAVIGATION CONTROLS
277 *********************************************/
278.reveal .controls .navigate-left,
279.reveal .controls .navigate-left.enabled {
280 border-right-color: #268bd2; }
281
282.reveal .controls .navigate-right,
283.reveal .controls .navigate-right.enabled {
284 border-left-color: #268bd2; }
285
286.reveal .controls .navigate-up,
287.reveal .controls .navigate-up.enabled {
288 border-bottom-color: #268bd2; }
289
290.reveal .controls .navigate-down,
291.reveal .controls .navigate-down.enabled {
292 border-top-color: #268bd2; }
293
294.reveal .controls .navigate-left.enabled:hover {
295 border-right-color: #78b9e6; }
296
297.reveal .controls .navigate-right.enabled:hover {
298 border-left-color: #78b9e6; }
299
300.reveal .controls .navigate-up.enabled:hover {
301 border-bottom-color: #78b9e6; }
302
303.reveal .controls .navigate-down.enabled:hover {
304 border-top-color: #78b9e6; }
305
306/*********************************************
307 * PROGRESS BAR
308 *********************************************/
309.reveal .progress {
310 background: rgba(0, 0, 0, 0.2); }
311
312.reveal .progress span {
313 background: #268bd2;
314 -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
315 -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
316 transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }