1 html,
2 body {
3 color:#3f3b33;
4 font-family:"Iosevka Aile", "Dejavu Sans", sans-serif;
5 background-color:#292929;
6 font-size:17px;
7 margin:0px;
8 padding:0px;
9 }
10
11 a,
12 a:visited {
13 color:#107d8e;
14 }
15
16
17 h1,
18 h1.title {
19 font-size:2.5em;
20 font-weight:300;
21 display:block;
22 border:none;
23 border-bottom:1px solid #aaa;
24 padding-left:0px;
25 }
26
27 h1 a:link,
28 h1 a:visited {
29 color:#444;
30 }
31
32
33 h2, h3, h4, h5, h6 {
34 font-weight:300;
35 font-family:"Dejavu Sans", sans-serif;
36 word-spacing:-.05em;
37 letter-spacing:-.02em;
38 padding-left:0px;
39 }
40
41 h2 {
42 color:#107d8e;
43 font-size:2.2em;
44 }
45
46 h3 {
47 color:#207d8e;
48 font-size:1.8em;
49 }
50
51 h4 {
52 color:#207d8e;
53 font-size:1.5em;
54 border:none;
55 }
56
57 h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {
58 border-left:3px solid #55aacc;
59 padding-left:3px;
60 font-weight:400;
61 border-radius:4px;
62 }
63
64 .index h2:hover {
65 border:none;
66 padding-left:0px;
67 font-weight:300;
68 border-radius:0px;
69 }
70
71
72 h2 a.link,
73 h3 a.link,
74 h4 a.link,
75 h5 a.link,
76 h6 a.link {
77 text-decoration:none;
78 }
79
80
81
82 span.line-through,
83 .strikethrough,
84 .strike {
85 text-decoration: line-through;
86 }
87
88
89 span.monospaced {
90 font-family:monospace;
91 background-color:#e0e0e0;
92 padding:2px;
93 border:1px solid #bbb;
94 border-radius:3px;
95 }
96
97
98 /**
99 * Text Styles
100 */
101 span.green {
102 color:#66dd66;
103 }
104
105 span.blue {
106 color:#6666dd;
107 }
108
109 span.red {
110 color:#dd6666;
111 }
112
113 span.yellow {
114 color:#dddd66;
115 }
116
117
118 /**
119 * Navbar Styles
120 */
121 div#nav-header {
122 background-color:#333;
123 background:linear-gradient(#0000, #0000, #0000, #0000, #221), #333;
124 box-shadow:0px 0px 4px #4f4b43;
125 color:#eee;
126 display:grid;
127 grid-template-columns:49% 50%;
128 }
129
130 div#nav-header div#nav-header-logo img {
131 margin:2px;
132 width:100%;
133 max-width:240px;
134 }
135
136
137 /**
138 * Nav header link bar
139 */
140 div#nav-header-links {
141 border:none;
142 padding:0px 2px 10px 0px;
143 text-align:right;
144 }
145
146 div#nav-header-links ul {
147 padding:0px;
148 margin:0px;
149 }
150
151 div#nav-header-links ul li {
152 list-style:none;
153 display:inline;
154 padding:0px 8px;
155 border-right:1px solid #999;
156 }
157
158 div#nav-header-links ul li:last-child {
159 border:none;
160 }
161
162 div#nav-header-links a,
163 div#nav-header-links a:link,
164 div#nav-header-links a:visited {
165 color:#dff;
166 text-decoration:none;
167 }
168
169 div#nav-header-links a:hover {
170 text-decoration:underline;
171 }
172
173
174 /**
175 * Body Styles
176 */
177 div#body-wrapper {
178 background-color:#eee;
179 padding:7px 0px 20px 0px;
180 }
181
182
183 div#body-content {
184 background:none;
185 padding:10px;
186 margin-left:auto;
187 margin-right:auto;
188 max-width:70em;
189 }
190
191
192 div.quoteblock,
193 pre {
194 background-color:#f9f9f9;
195 border:1px dotted #999;
196 padding:5px 15px 7px 15px;
197 border-radius:5px;
198 margin:5px 0px;
199 color:#555;
200 font-size:1.0em;
201 display:inline-block;
202 }
203
204 pre {
205 display:block;
206 overflow:auto;
207 }
208
209 blockquote {
210 background-color:#eee;
211 padding:5px;
212 border:1px dotted #aaa;
213 border-radius:4px;
214 margin-top:10px;
215 margin-bottom:10px;
216 }
217
218 div.index-post {
219 width:98%;
220 margin: 10px auto 10px auto;
221 border:1px solid #ccc;
222 background-color:#e5e5e5;
223 border-radius:5px;
224 padding:10px;
225 }
226
227 div.index-post .readmore {
228 display:block;
229 width:98%;
230 margin-left:0px;
231 margin-right:auto;
232 text-align:right;
233 font-size:.9em;
234 }
235
236 div#footer {
237 background:none;
238 background-color:#292929;
239 color:#eee;
240 margin:5px 0px 0px 0px;
241 width:100%;
242 text-align:center;
243 font-size:.9em;
244 padding:20px 0px;
245 }
246
247 div#footer a,
248 div#footer a:visited {
249 color:#40adbe;
250 }
251
252 div#left-navigation {
253 margin-left:176px;
254 }
255
256 div#p-logo {
257 height:85px;
258 position:relative;
259 top:5px;
260 left:0px;
261 }
262
263 div#p-logo a {
264 height:65px;
265 width:140px;
266 }
267
268
269 div#p-personal { background:none; }
270
271 div#p-personal a:link,
272 div#p-personal a:visited {
273 color:#eee;
274 }
275
276
277 /**
278 * Table styles
279 */
280 table { border-collapse: collapse; }
281
282 table td, table th {
283 border: 1px solid #999;
284 padding:1px 5px;
285 background-color:#f5f5f5;
286 }
287
288
289 /**
290 * Definition lists
291 */
292 dl dt {
293 color:#333;
294 font-size:1.04em;
295 font-weight:800;
296 padding-top:5px;
297 line-height:.9em;
298 }
299
300 dl dd p {
301 line-height:.5em;
302 color:#555;
303 }
304
305 dl {
306 padding:10px 0px;
307 }
308
309 div.terminal div {
310 display:block;
311 padding:5px;
312 margin:5px 0px;
313 background-color:#222;
314 border:1px solid #999;
315 border-radius:5px;
316 overflow:auto;
317 }
318
319 div.terminal div pre,
320 div.terminal div div.paragraph,
321 div.terminal div div.paragraph p {
322 font-family: monospace;
323 background:none;
324 padding:0px;
325 margin:0px 0px;
326 border:none;
327 overflow:auto;
328 color:#ddd;
329 }
330
331 ul li p {
332 line-height:1.2em;
333 margin-top:5px;
334 margin-bottom:5px;
335 }
336
337 /*
338 * Header sections
339 */
340
341 /*
342 * Zeroth level (page label)
343 */
344 div.sect1.index {
345 width:100%;
346 }
347
348 /*
349 * First level (section headers on index page)
350 */
351 div.index.sect1 {
352 background-color:#e7e7e7;
353 padding:0px;
354 border:1px solid #ccc;
355 width: 100%;
356 border-radius:4px;
357 margin:10px 0px 10px 0px;
358 }
359
360 div.index.sect1 h2 {
361 padding:3px 0px 3px 7px;
362 margin:0px;
363 background-color:#dadada;
364 border-bottom:2px solid #aaa;
365 color:#333;
366 font-size:1.5em;
367 font-weight:300;
368 }
369
370 div.index.sect1 div.ulist {
371 padding-left:0px;
372 }
373
374 div.index.sect1 div.ulist ul {
375 list-style-type:none;
376 padding-left:7px;
377 margin-left:0px;
378 }
379
380 div.index.sect1 div.ulist ul li {
381 border-left:4px solid #bbb;
382 padding-left:5px;
383 margin-left:0px;
384 }
385
386 div.index.sect1 div.ulist ul li:hover {
387 border-left:4px solid #cc7733;
388 }
389
390
391
392 /*
393 * Second-level nested header sections
394 */
395 div.index.sect1 div.sect2 {
396 padding-left:5px;
397 width: 96%;
398 margin: 10px auto 10px auto;
399 }
400
401 div.index.sect1 div.sect2 h3 {
402 padding:7px 0px 2px 0px;
403 margin:0px;
404 }
405
406 div.index.sect1 div.sect2 div.ulist {
407 padding-left:0px;
408 }
409
410 div.index.sect1 div.sect2 div.ulist ul {
411 list-style-type:none;
412 padding-left:2px;
413 margin-left:0px;
414 }
415
416 div.index.sect1 div.sect2 div.ulist ul li {
417 border-left:4px solid #bbb;
418 padding-left:5px;
419 margin-left:0px;
420 }
421
422
423 div.datelastedit p {
424 margin-top:2em;
425 margin-bottom:0px;
426 color:#888;
427 font-style:italic;
428 text-align:right;
429 }
430
431 div.center,
432 .align-center,
433 p.center {
434 text-align:center;
435 margin-left:auto;
436 margin-right:auto;
437 }
438
439 img {
440 max-width: 100%;
441 }
442
443 img.align-center {
444 display:block;
445 }
446
447 div.title {
448 font-weight:700;
449 margin-top:1.5em;
450 }
451
452 img#piwik-img {
453 display:none;
454 }
455
456
457 .grid-container-left {
458 display:grid;
459 grid-template-columns:39% 60%;
460 grid-column-gap: 15px;
461 }
462
463 .grid-container-right {
464 display:grid;
465 grid-template-columns:60% 39%;
466 grid-column-gap: 15px;
467 }
468
469
470 span.docutils.literal {
471 font-family:monospace;
472 border:1px dotted #aaa;
473 border-radius:3px;
474 background-color:#e0e0e0;
475 color:#555;
476 }
477
478 /**
479 * Overrides for portrait mode (EG: a phone or tablet)
480 */
481 /* Smaller mobile displays with a lower resolution */
482 @media only screen and (orientation: portrait) and (max-width: 850px) {
483 html, body { font-size: 15px; }
484 div#nav-header, .grid-container-left, .grid-container-right {
485 grid-template-columns:100%;
486 }
487 }
488
489 /* More modern mobile displays with a higher resolution */
490 @media only screen and (orientation: portrait) and (min-resolution: 220dpi) {
491 html, body { font-size: 19px; }
492 div#nav-header, .grid-container-left, .grid-container-right {
493 grid-template-columns:100%;
494 }
495 }
|
