Subversion Repositories LCARS

Rev

Rev 53 | Rev 172 | Go to most recent revision | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
26 PointedEar 1
<?php
53 PointedEar 2
namespace de\pointedears\css\least;
26 PointedEar 3
 
53 PointedEar 4
\header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT');
5
 
26 PointedEar 6
/* Cached resource expires in HTTP/1.1 caches 24h after last retrieval */
53 PointedEar 7
\header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate');
26 PointedEar 8
 
9
/* Cached resource expires in HTTP/1.0 caches 24h after last retrieval */
53 PointedEar 10
\header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT');
26 PointedEar 11
 
53 PointedEar 12
\header('Content-Type: text/css; charset=UTF-8');
13
 
14
require_once 'css/least/Mixins.php';
26 PointedEar 15
?>
16
@CHARSET "UTF-8";
17
 
18
html, body {
19
  -webkit-font-smoothing: antialiased;
20
}
21
 
22
h1, h2, h3, h4, h5, h6 {
53 PointedEar 23
  /* from SVG for Gecko and WebKit */
26 PointedEar 24
  text-rendering: optimizeLegibility;
25
}
26
 
27
body {
28
  font-family: sans-serif;
29
}
30
 
31
:link, :visited {
32
  text-decoration: none;
33
  color: inherit;
34
}
35
 
36
.hidden {
41 PointedEar 37
  display: none !important;
26 PointedEar 38
}
39
 
40
h1 {
41
  margin: 0;
42
  text-align: center;
43
}
44
 
45
[title] {
46
  cursor: help;
47
/*  border-bottom: 1px dotted black; */
48
}
49
 
50
table {
51
  width: 100%;
52
  border-collapse: collapse;
53
}
54
 
55
th {
56
  width: 20%;
57
  padding: 0.25em 0.5em 0.25em 0;
32 PointedEar 58
  font-weight: normal;
26 PointedEar 59
  text-align: right;
60
}
61
 
62
td:first-child {
63
  width: 1em;
64
  border: none;
65
}
66
 
67
th.recommended {
68
  border-left: 2px solid green;
69
  border-top: 2px solid green;
70
  border-bottom: 2px solid green;
71
}
72
 
73
td:last-child {
74
  padding-right: 0.25em;
75
}
76
 
77
td.recommended {
78
  border-top: 2px solid green;
79
  border-right: 2px solid green;
80
  border-bottom: 2px solid green;
81
}
82
 
83
@font-face {
84
  font-family: "Futura Condensed";
41 PointedEar 85
  src: local("Futura Condensed"), url(/styles/fonts/non-free/futura_condensed.TTF);
26 PointedEar 86
}
87
 
88
@font-face {
89
  font-family: "X-Files";
90
  src: local("X-Files"), url(/styles/fonts/x-files.ttf);
91
}
92
 
93
.akte-x {
94
  padding: 1em 0.25em 0.6em 0.25em;
64 PointedEar 95
  background-image: -(o-|)linear-gradient(12deg,
96
       rgba(236, 244, 235, 0) 33%, rgba(236, 244, 235, 0.9) 68%,
97
       rgba(236, 244, 235, 0.9) 70%, rgba(236, 244, 235, 0) 90%);
53 PointedEar 98
  <?php
99
        Mixins::linear_gradient(
100
                'background-image',
101
                '12deg,
102
       rgba(236, 244, 235, 0) 33%, rgba(236, 244, 235, 0.9) 68%,
103
       rgba(236, 244, 235, 0.9) 70%, rgba(236, 244, 235, 0) 90%',
104
      array('-o-', ''));
105
        ?>
26 PointedEar 106
  background-image:
32 PointedEar 107
    -moz-radial-gradient(65% 60%,
108
      rgba(236, 244, 235, 0.5) 50%, rgba(236, 244, 235, 0.1)),
109
    -moz-linear-gradient(12deg,
110
      rgba(236, 244, 235, 0) 33%, rgba(236, 244, 235, 0.9) 68%,
111
      rgba(236, 244, 235, 0.9) 70%, rgba(236, 244, 235, 0) 90%);
26 PointedEar 112
  background-image:
32 PointedEar 113
    -webkit-radial-gradient(65% 60%, 25% 75%,
114
      rgba(236, 244, 235, 0.5) 50%, rgba(236, 244, 235, 0.1)),
115
    -webkit-linear-gradient(12deg,
116
      rgba(236, 244, 235, 0) 33%, rgba(236, 244, 235, 0.9) 68%,
117
      rgba(236, 244, 235, 0.9) 70%, rgba(236, 244, 235, 0) 90%);
26 PointedEar 118
  background-color: #000;
119
  color: #dcdfdc;
120
  line-height: 2em;
121
  vertical-align: middle;  
122
}
123
 
124
.akte-x .small {
125
  padding-left: 1em;
64 PointedEar 126
  background-image: -()linear-gradient(bottom left, black, transparent);
53 PointedEar 127
        <?php   Mixins::linear_gradient('background-image', 'bottom left, black, transparent'); ?>
26 PointedEar 128
  vertical-align: middle;
129
  font-family: "Futura Condensed", sans-serif;
130
  font-size: 50%;
131
  text-transform: uppercase;
132
  letter-spacing: 1em;
133
}
134
 
135
.akte-x .before-x {
136
  letter-spacing: normal;
137
}
138
 
139
.akte-x .x {
140
  font-family: "X-Files", sans-serif;
141
  font-size: 600%;
142
  font-weight: lighter;
143
  vertical-align: middle;
144
  vertical-align: -webkit-baseline-middle;
145
  color: black;
146
  -webkit-mask-image: -webkit-linear-gradient(-12deg,
147
    rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));
148
}
149
 
150
.alf {
151
  font-family: "URW Bookman L", serif;
152
  font-weight: bold;
153
  font-size: 120%;
154
 
155
}
156
 
157
@font-face {
158
  font-family: "Highguard";
159
  src: local("Highguard"), url(/styles/fonts/Highguard.ttf);
160
}
161
 
162
.andromeda {
163
  position: relative;
164
  font-family: "Highguard", sans-serif;
165
  font-size: 204%;
166
  color: rgba(245, 153, 79, 1);
167
  text-shadow:
168
    /* blurred shadow */
169
    -1px 0 2px black, 0 -1px 2px black, 1px 0 2px black, 0 1px 2px black,
170
 
171
    /* outline */
172
    -1px 0 black, 0 -1px black, 1px 0 black, 0 1px black;
173
}
174
 
175
.andromeda .gradient {
176
  -webkit-mask-image: -webkit-linear-gradient(top,
177
    rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));
178
}
179
 
180
.andromeda .roddenberry {
181
  position: absolute;
32 PointedEar 182
  right: 3.75em;
26 PointedEar 183
  top: 1.7em;
184
  font-family: sans-serif;
185
  font-size: 21%;
186
  text-transform: uppercase;
187
  color: black;
188
  text-shadow: none;
189
  letter-spacing: 0;
190
}
191
 
192
.big-bang-theory {
193
  font-family: Impact, sans-serif;
194
  font-size: 122%;
32 PointedEar 195
  font-weight: bold;
26 PointedEar 196
  text-transform: uppercase;
197
}
198
 
199
.big-bang-theory .lower {
200
  font-size: 0.75em;
201
  text-transform: lowercase;
202
}
203
 
204
.big-bang-theory .i {
205
  text-transform: none;
206
  font-size: 111%;
207
  font-weight: normal;
208
}
209
 
210
.big-bang-theory .bang {
211
  color: #CE152C;
212
}
213
 
214
@font-face {
215
  font-family: "Battlestar";
216
  src: local("Battlestar"), url(/styles/fonts/BATTLEST.TTF);
217
}
218
 
219
.bsg {
220
  font-family: "Battlestar", sans-serif;
221
  font-size: 84%;
222
}
223
 
224
@font-face {
225
  font-family: "Buffied";
226
  src: local("Buffied"), url(/styles/fonts/Buffied.ttf);
227
}
228
 
229
@font-face {
230
  font-family: "Slayer";
231
  src: url(/styles/fonts/slayer11.eot?);
232
  src: local("Slayer"),
53 PointedEar 233
    url(/styles/fonts/slayer11.eot?) format("eot"),
234
    url(/styles/fonts/slayer11.woff) format("woff"),
235
    url(/styles/fonts/slayer11.ttf) format("truetype"),
236
    url(/styles/fonts/slayer11.svg#Slayer) format("svg");
26 PointedEar 237
  font-weight: normal;
238
  font-style: normal;
239
}
240
 
241
@font-face {
242
  font-family: "Kruella";
41 PointedEar 243
  src: local("Kruella"), url(/styles/fonts/non-free/kruella.ttf);
26 PointedEar 244
}
245
 
246
.buffy {
247
  display: inline-block;
248
  padding: 0.75em 0.5em 0.5em 0.5em;
249
  background-color: #000700;
53 PointedEar 250
  <?php Mixins::radial_gradient('background-image', 'circle, #6d7a9c 35%, transparent 45%'); ?>
26 PointedEar 251
  color: #feffff;
252
  line-height: 1em;
253
  text-align: center;
254
  text-shadow: 1px 1px 1px black;
255
}
256
 
257
.buffy .title {
258
  font-family: "Buffied", fantasy;
259
  font-size: 200%;  
260
}
261
 
262
.buffy .subtitle {
263
  display: block;
264
  font-family: "Slayer", sans-serif;
265
  font-size: 50%;
266
  font-variant: small-caps;
267
}
268
 
269
@font-face {
270
  font-family: "Arno Pro Caption";
41 PointedEar 271
  src: local("Arno Pro Caption"), url(/styles/fonts/non-free/arnopro-caption.otf);
26 PointedEar 272
}
273
 
274
.castle {
275
  font-family: "Arno Pro Caption", serif;
276
  font-size: 120%;
29 PointedEar 277
  line-height: 1;
26 PointedEar 278
  text-transform: uppercase;
279
}
280
 
281
@font-face {
282
  font-family: "KopyKattKut Bold";
283
  src: local("KopyKattKut Bold"), url(/styles/fonts/KopyKattKut-Bold.otf);
284
}
285
 
286
.charmed {
53 PointedEar 287
  position: relative;
288
  display: inline-block;
289
  background-color: #080E32;
290
  color: rgb(223, 229, 251);
291
  color: rgba(255, 255, 255, 0.75);
292
  padding: 1.5em 0.5em 0.75em 0.5em;
26 PointedEar 293
  font-family: "KopyKattKut Bold", serif;
294
  font-size: 115%;
295
  /*letter-spacing: -0.125em;*/
53 PointedEar 296
  line-height: 2;
297
  overflow: hidden;
26 PointedEar 298
  text-transform: uppercase;
299
}
300
 
53 PointedEar 301
.charmed .circle {
302
  position: absolute;
303
  left: 50%;
304
  top: 60%;
305
  width: 2em;
306
  height: 2em;
307
  margin-left: -1.3em;
308
  margin-top: -1.3em;
309
  border-radius: 50%;
310
  border: 0.325em solid rgba(36, 63, 219, 0.33);
311
}
312
 
313
.charmed .circle:before {
314
  position: absolute;
315
  left: 50%;
316
  top: 50%;
317
  width: 75%;
318
  height: 75%;
319
  margin-left: -1.7em;
320
  margin-top: -0.7em;
321
  border: 0.325em solid rgba(36, 63, 219, 0.33);
322
  border-radius: 100% 0;
323
  content: "";
64 PointedEar 324
  -(moz-|webkit-|)transform: rotate(15deg);
53 PointedEar 325
  <?php
326
        Mixins::prefix_property('transform', '',
327
                'rotate(15deg)',
328
                array('-moz-', '-webkit-', ''));
329
        ?>
330
}
331
 
332
.charmed .circle:after {
333
  position: absolute;
334
  left: 50%;
335
  top: 50%;
336
  width: 75%;
337
  height: 75%;
338
  margin-left: -1.05em;
339
  margin-top: -1.85em;
340
  border: 0.325em solid rgba(36, 63, 219, 0.33);
341
  border-radius: 100% 0;
342
  content: "";
343
  <?php
344
        Mixins::prefix_property('transform', '',
345
                'rotate(-45deg)',
346
                array('-moz-', '-webkit-', ''));
347
        ?>
348
}
349
 
350
.charmed .arc3 {
351
  position: absolute;
352
  left: 50%;
353
  top: 50%;
354
  width: 1.5em;
355
  height: 1.5em;
356
  margin-left: -0.3em;
357
  margin-top: -0.3em;
358
  border: 0.325em solid rgba(36, 63, 219, 0.33);
359
  border-radius: 0 100% 0 100%;
360
  content: "";
361
  <?php
362
        Mixins::prefix_property('transform', '',
363
                'rotate(-15deg)',
364
                array('-moz-', '-webkit-', ''));
365
        ?>
366
}
367
 
26 PointedEar 368
.charmed .c {
369
  /* font-size: 150%; */
370
}
371
 
372
.charmed span {  
53 PointedEar 373
  position: relative;
26 PointedEar 374
  /* vertical-align: middle; */
375
}
376
 
377
@font-face {
378
  font-family: "Coolvetica";
41 PointedEar 379
  src: local("Coolvetica"), url(/styles/fonts/non-free/coolvetica.ttf);
26 PointedEar 380
}
381
 
382
.columbo {
383
  padding: 0 0.25em;
384
  background-color: #273d50;
385
  color: #fde06c;
386
  font-family: "Coolvetica", sans-serif;
387
  font-size: 130%;
388
  letter-spacing: 0.0625em;
389
  text-transform: uppercase;
390
  text-shadow: 2px 2px 1px black;
391
}
392
 
393
@font-face {
394
  font-family: "ITC Serif Gothic LT Bold";
41 PointedEar 395
  src: url(/styles/fonts/non-free/itc_serif_gothic--lte50299.ttf);
26 PointedEar 396
}
397
 
398
@font-face {
399
  font-family: "ITC Serif Gothic LT Heavy";
41 PointedEar 400
  src: url(/styles/fonts/non-free/itc_serif_gothic--lte50301.ttf);
26 PointedEar 401
}
402
 
403
.countdown-x {
404
  display: inline-block;
405
  font-family: "ITC Serif Gothic LT Heavy", sans-serif;
406
  line-height: 0.9em;
407
  text-align: center;
408
  text-shadow: 1px 1px #999;
409
}
410
 
411
.countdown-x .title:before {
412
  content: "\2013\00A0";
413
}
414
 
415
.countdown-x .subtitle {
416
  display: block;
417
  font-family: "ITC Serif Gothic LT Bold", sans-serif;
418
}
419
 
420
.dead-zone {
29 PointedEar 421
  display: inline-block;
422
  background-color: black;
423
  background-image: -webkit-radial-gradient(50% 20%, 20% 100%, white, transparent 75%);
424
  color: white;
26 PointedEar 425
  font-family: serif;
29 PointedEar 426
  font-size: 120%;
32 PointedEar 427
  font-weight: bold;
29 PointedEar 428
  line-height: 1;
429
  text-align: center;
26 PointedEar 430
  text-transform: uppercase;
431
}
432
 
29 PointedEar 433
.dead-zone .text {
434
  display: block;
32 PointedEar 435
  margin-top: 1em;
436
  padding: 0 1em;
437
  background: white;
438
  background:
439
    -webkit-linear-gradient(-5deg, rgba(255, 255, 255, 0),
440
      rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)),
441
    -webkit-linear-gradient(5deg, rgba(255, 255, 255, 0),
442
      rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
443
  background:
444
    linear-gradient(-5deg, rgba(255, 255, 255, 0),
445
      rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)),
446
    linear-gradient(5deg, rgba(255, 255, 255, 0),
447
      rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
448
  color: black;
29 PointedEar 449
}
450
 
451
.dead-zone .text .dead {
452
  display: block;
453
  top: -0.125em;
454
  position: relative;
455
  font-size: 90%;
456
  color: #222;
457
  text-shadow: 0 0 10px white;
458
}
459
 
460
.dead-zone .text .zone {
461
  display: block;
462
  position: relative;
463
  top: -0.5em;
464
  font-size: 110%;
53 PointedEar 465
  <?php
466
        Mixins::prefix_property('transform', '',
467
                'perspective(15px) rotateX(35deg)',
468
                array('-webkit-', ''));
469
        ?>
29 PointedEar 470
  -webkit-mask-image: -webkit-linear-gradient(
32 PointedEar 471
    rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.67));
29 PointedEar 472
}
473
 
26 PointedEar 474
@font-face {
475
  font-family: "Doctor Who";
476
  src: local("Matt Smith Doctor Who"), url(/styles/fonts/matt_smith_doctor_who.ttf);
477
}
478
 
479
.doctor-who {
480
  position: relative;
481
  color: #386688;
482
  font-family: "Doctor Who", serif;
483
  font-size: 250%;
484
  text-transform: uppercase;
485
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
486
}
487
 
488
.doctor-who .gradient {
489
  position: absolute;
490
  left: 0;
491
  top: 0;
492
  -webkit-mask-image:
493
    -webkit-radial-gradient(0.15em 0.125em, 15% 50%, rgba(0, 0, 0, 0.4) 10%, rgba(0, 0, 0, 1));
494
  z-index: 2;
495
}
496
 
497
.doctor-who .gradient2 {
498
  -webkit-mask-image:
499
    -webkit-radial-gradient(1.2em 0.125em, 15% 50%, rgba(0, 0, 0, 0.2) 15%, rgba(0, 0, 0, 1));
500
}
501
 
502
.doctor-who .gradient3 {
503
  -webkit-mask-image:
504
    -webkit-radial-gradient(2.4em 0.25em, 15% 50%, rgba(0, 0, 0, 0.2) 15%, rgba(0, 0, 0, 1));
505
}
506
 
507
.doctor-who:after {
508
  content: "Doctor Who";
509
  color: #f7f9fb;
510
}
511
 
512
@font-face {
513
  font-family: "a_Futura Orto";
514
  src: local("Futura Orto"), url(/styles/fonts/a_futuraorto.ttf);
515
}
516
 
517
@font-face {
518
  font-family: "a_Futura Orto Bold";
519
  src: local("Futura Orto Bold"), url(/styles/fonts/a_futuraorto_bold.ttf);
520
}
521
 
522
.efc {
523
  position: relative;
524
  display: inline-block;
525
  background-color: #000;
526
  background-image:
527
    /* Terra */
528
    -moz-radial-gradient(28.6541% -128%, circle, black 67%, #1C1F1C 71%, #394138 72.5%, transparent 73%),
529
 
530
    /* Sol */
531
    -moz-radial-gradient(56.729378% 52.895753%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);
532
  background-image:
533
    /* Terra */
534
    -webkit-radial-gradient(28.654124% -155%, circle, black 67%, #1c1f1c 71%, #394138 72.5%, transparent 73%),
535
 
536
    /* Sol */
537
    -webkit-radial-gradient(55.137482% 42.084942%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);
538
  color: #eeeeec;
539
  font-family: "a_Futura Orto Bold", sans-serif;
540
  line-height: 1em;
541
  text-align: center;
542
  text-transform: uppercase;
543
}
544
 
545
.efc .glare {
546
  position: absolute;
547
  left: 0;
548
  right: 0;
549
  top: 0;
550
  bottom: 0;
551
  background-image: -webkit-radial-gradient(56% 43%, 50% 8%, #fafdfa 14%, rgb(249, 198, 153) 15%, rgba(249, 198, 153, 0) 30%);
552
  -webkit-transform: rotate(-11.5deg);
553
}
554
 
555
.efc:after {
556
  position: absolute;
557
  left: 0;
558
  right: 0;
559
  top: 0;
560
  bottom: 0;
561
  content: "";
562
  background-image:
563
    -moz-radial-gradient(55.137482% 42.084942%,
564
      rgba(255, 255, 255, 0.2) 18%,
565
      rgba(255, 255, 255, 0.04));
566
  background-image:
567
    -webkit-radial-gradient(55.137482% 42.084942%, rgba(255, 255, 255, 0.2) 18%, rgba(255, 255, 255, 0.04));
568
}
569
 
570
.efc .gr {
571
  display: block;
572
  margin-top: 1em;  
573
  margin-bottom: 2.5em;
574
  font-family: "a_Futura Orto", sans-serif;
575
  font-size: 50%;
576
}
577
 
578
.efc .earth {
579
  position: relative;
580
  display: block;
581
  padding: 0 0 0 0.35em;
582
  font-size: x-large;
583
  letter-spacing: 0.35em;
584
  color: #efd065;
585
  line-height: 1em;
586
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.75);
587
}
588
 
589
.earth .gradient {
590
  position: absolute;
591
  padding: 0 0 0 0.35em;
592
  left: 0;
593
  top: 0;
594
  -webkit-mask-image: -webkit-linear-gradient(
595
    rgba(255, 255, 255, 1), rgba(243, 205, 98, 0.5) 50%, rgba(0, 0, 0, 0));
596
  z-index: 2;
597
}
598
 
599
.efc .earth:after {
600
  content: "Earth";
601
  color: #9b411a;
602
}
603
 
604
@font-face {
605
  font-family: "Troglodyte";
606
  src: local("Troglodyte"), url(/styles/fonts/TROGLO__.ttf);
607
}
608
 
609
.efc .fc {
610
  position: relative;
611
  top: -0.5em;
612
  display: block;
613
  color: #ac493d;
614
  font-family: "Troglodyte", sans-serif;
615
  font-size: 71%;
616
  line-height: normal;
617
  text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
618
}
619
 
620
@font-face {
621
  font-family: "Interstate";
41 PointedEar 622
  src: local("Interstate"), url(/styles/fonts/non-free/interstate_ultra-black_condensed.ttf);
623
}
26 PointedEar 624
 
625
.eureka {
626
  position: relative;
627
  padding: 0.25em 0.5em 0.125em 0.5em;
628
  font-family: "Interstate", sans-serif;
629
  font-size: 130%;
630
  background-color: #8de5f9;
631
  background-image: -moz-radial-gradient(bottom, ellipse,
632
    #f4fff7 20%, #8de5f9, #285e8d);
633
  background-image: -webkit-radial-gradient(bottom, 100% 125%,
634
    #f4fff7 20%, #8de5f9, #285e8d);
635
  color: rgb(251, 254, 247);
636
  color: rgba(255, 255, 255, 0.9);
637
  text-shadow: 0 -1px rgb(77, 148, 168), 1px 0 1px rgb(168, 217, 231),
638
    1px -1px rgb(77, 148, 168);
639
  text-shadow: 0 -1px rgba(77, 148, 168, 0.9), 1px 0 1px rgba(168, 217, 231, 0.9),
640
    1px -1px rgba(77, 148, 168, 0.9);
641
}
642
 
643
.eureka .gradient {
644
  display: inline-block;
53 PointedEar 645
  <?php
646
    Mixins::prefix_property('transform', '',
647
        'matrix(1, 0, 0, 0.9, 0, 0)',
648
        array('-moz-', '-webkit-', ''));
649
  ?>
26 PointedEar 650
/*
651
  position: absolute;
652
  padding: 0.25em 0.5em 0.125em 0.5em;
653
  left: 0;
654
  top: 0;
655
  -webkit-mask-image: -webkit-linear-gradient(
656
    rgba(0, 0, 0, 1) 30%, transparent 55%, rgba(0, 0, 0, 1) 80%);
657
  z-index: 2;
658
*/
659
}
660
/*
661
.eureka:after {
662
  content: "EUReKA";
663
  color: red;
664
}
665
*/
666
 
667
.eureka .eur {
668
  text-transform: uppercase;
669
}
670
 
671
.eureka .e {
672
  display: inline-block;
673
  position: relative;
674
  bottom: 0.25em;
675
  text-shadow: 0 1px 1px rgb(168, 217, 231), 0 1px rgb(77, 148, 168);
676
  text-shadow: 0 1px 1px rgba(168, 217, 231, 0.9), 0 1px rgba(77, 148, 168, 0.9);
32 PointedEar 677
 
678
  -moz-transform: matrix(1, 0, 0, 0.9, 0, 0);
679
  -moz-transform: perspective(50px) rotateX(45deg);
680
  -o-transform: matrix(1, 0, 0, 0.9, 0, 0);
681
  -ms-transform: matrix(1, 0, 0, 0.9, 0, 0);
682
  -webkit-transform: perspective(50px) rotateX(45deg);
683
  transform: perspective(50px) rotateX(45deg);
26 PointedEar 684
}
685
 
686
.eureka .ka {
687
  text-shadow: -1px 0 1px rgb(168, 217, 231), -1px -1px rgb(77, 148, 168),
688
 
689
  text-shadow: -1px 0 1px rgba(168, 217, 231, 0.9), -1px -1px rgba(77, 148, 168, 0.9),
690
 
691
  text-transform: uppercase;
692
}
693
 
694
@font-face {
41 PointedEar 695
  font-family: "Marriage-Script";
696
  font-weight: normal;
697
  src: local("Marriage-Script"), url(/styles/fonts/MARRIAGE.TTF);
698
}
699
 
700
.firefly {
701
  display: inline-block;
702
  padding: 0.4em 0.8em 0.4em 0.95em;
53 PointedEar 703
  background-color: #762109;
704
  <?php
705
    Mixins::linear_gradient('background-image',
706
        'rgba(73, 1, 2, 0.8) 15%,
707
         rgba(155, 73, 49, 0) 15%, rgba(155, 73, 49, 0) 85%,
708
         rgba(73, 1, 2, 0.8) 85%, rgba(73, 1, 2, 0.8)');
709
  ?>
41 PointedEar 710
        color: #fefcff;
711
  font-family: "Marriage-Script", cursive;
712
  font-size: 160%;
713
  text-shadow: -1px 0px 1px #300202, 2px 2px 4px #fed700, 0px 0px 4px #270201;
714
  text-transform: lowercase;
715
}
716
 
717
.firefly .e {
718
  text-shadow: 0px 0px 4px #fed700;
719
}
720
 
721
@font-face {
26 PointedEar 722
  font-family: "Middleton";
41 PointedEar 723
  src: url(/styles/fonts/non-free/middleto.ttf);
26 PointedEar 724
}
725
 
726
.frasier {
727
  font-family: "Middleton", sans-serif;
728
  font-size: 120%;
729
  text-transform: uppercase;
730
}
731
 
732
.frasier span {
733
  font-size: 75%;
734
}
735
 
32 PointedEar 736
.fresh-hell {
737
  position: relative;
738
  background-color: white;
739
  color: #fff900;
740
  font-family: Kruella, fantasy;
741
  font-size: 150%;
742
  text-transform: uppercase;
743
  white-space: nowrap;
744
  -webkit-text-stroke: 0.25px #333;
745
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
746
}
747
 
748
.fresh-hell .gradient {
749
  position: absolute;
750
  left: 0;
751
  top: 0;
752
  -webkit-mask-image: -webkit-linear-gradient(
753
    rgba(0, 0, 0, 1), transparent);
754
  z-index: 2;
755
}
756
 
757
.fresh-hell:after {
758
  content: "Fresh Hell";
759
  color: #bf170a;
760
}
761
 
26 PointedEar 762
@font-face {
763
  font-family: "Century Gothic";
41 PointedEar 764
  src: local("Century Gothic"), url(/styles/fonts/non-free/Century_Gothic.TTF);
26 PointedEar 765
}
766
 
767
.fringe {
768
  display: inline-block;
769
  padding: 0.125em 0.5em 0.125em 0.5em;
770
  background-color: #000;
771
  background-image: -moz-radial-gradient(center, #D6DBD3 4%, #7d9b9d 60%, black);
772
  background-image: -webkit-radial-gradient(center, 67% 67%, #D6DBD3 4%, #7d9b9d 60%, black);
32 PointedEar 773
  color: #101811;
26 PointedEar 774
  font-family: "Century Gothic", sans-serif;
775
  font-weight: bolder;
776
  font-size: 140%;
777
  text-transform: uppercase;
778
}
779
 
780
.fringe .gradient {
781
  display: inline-block;
782
  /*
783
  -webkit-mask-image: -webkit-radial-gradient(center, 150% 150%,
784
    rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.125));
785
  */
53 PointedEar 786
        <?php
787
          Mixins::prefix_property('transform', '',
788
                'perspective(50px) rotateX(4.43deg)',
789
                array('-moz-', '-webkit-', ''));
790
        ?>
26 PointedEar 791
}
792
 
793
.fringe .f {
794
  display: inline-block;
795
 
796
  /*-webkit-transform: matrix(1, 0, -0.06, 1, 0, 0);*/
797
  text-shadow:
32 PointedEar 798
     0.5px   0.25px #5b6e65,
799
     0.75px  0.5px  #5b6e65,
800
     1.25px  0.75px #5b6e65,
801
     1.5px   1.25px #5b6e65,
802
     1.75px  1.5px  #5b6e65,
803
     2px     1.75px #5b6e65,
804
     2.25px     2px #5b6e65;
26 PointedEar 805
 
806
  /* text-shadow: 1px 0.75px 2px #5b6e65, 1px 1.75px 0px #758278; */
807
  /* shadow-pos: y = -0.83909963 * x */
808
/*
809
  text-shadow: 0.5px 0.25px #111910, 0.75px 0.5px #111910,
810
    1.25px 0.75px #111910, 1.5px 1.25px #111910, 1.75px 1.5px #111910,
811
    1.75px 1.5px #111910, 2.25px 1.75px #111910;
812
 */    
813
}
814
 
815
.fringe .r {
816
  display: inline-block;
817
  /*-webkit-transform: matrix(1, 0, -0.04, 1, 0, 0);*/
818
  /*
819
  text-shadow:
32 PointedEar 820
     0.25px   0.25px $fringe_shadow,
821
     0.5px    0.5px  $fringe_shadow,
822
     1px      0.75px $fringe_shadow,
823
     1.25px   1.25px $fringe_shadow,
824
     1.5px    1.5px  $fringe_shadow,
825
     1.75px   1.75px $fringe_shadow,
826
     2px      2px    $fringe_shadow;
26 PointedEar 827
  */
828
  /* Same shadow as .f */
829
  text-shadow:
32 PointedEar 830
     0.5px   0.25px #5b6e65,
831
     0.75px  0.5px  #5b6e65,
832
     1.25px  0.75px #5b6e65,
833
     1.5px   1.25px #5b6e65,
834
     1.75px  1.5px  #5b6e65,
835
     2px     1.75px #5b6e65,
836
     2.25px     2px #5b6e65;
26 PointedEar 837
}
838
 
839
.fringe .i {
840
  display: inline-block;
841
  /* -webkit-transform: matrix(1, 0, -0.02, 1, 0, 0); */
842
  /*
843
  text-shadow:
32 PointedEar 844
 
845
     0.5px  0.5px  $fringe_shadow,
846
     0.75px 0.75px $fringe_shadow,
847
     1px    1.25px $fringe_shadow,
848
     1.25px 1.5px  $fringe_shadow,
849
     1.5px  1.75px $fringe_shadow,
850
     1.75px 2px    $fringe_shadow;
26 PointedEar 851
   */
852
  /* Same shadow as .f */
853
  text-shadow:
32 PointedEar 854
     0.5px   0.25px #5b6e65,
855
     0.75px  0.5px  #5b6e65,
856
     1.25px  0.75px #5b6e65,
857
     1.5px   1.25px #5b6e65,
858
     1.75px  1.5px  #5b6e65,
859
     2px     1.75px #5b6e65,
860
     2.25px     2px #5b6e65;
26 PointedEar 861
}
862
 
863
.fringe .n {
864
  display: inline-block;
865
  /*- webkit-transform: matrix(1, 0, -0.01, 1, 0, 0); */
866
  text-shadow:
32 PointedEar 867
 
868
 
869
 
870
 
871
 
872
 
873
 
26 PointedEar 874
}
875
 
876
.fringe .g {
877
  display: inline-block;
878
  /* -webkit-transform: matrix(1, 0, 0.01, 1, 0, 0); */
879
  /* text-shadow:
32 PointedEar 880
 
881
     -0.5px  0.5px  $fringe_shadow,
882
     -0.75px 0.75px $fringe_shadow,
883
     -1px    1.25px $fringe_shadow,
884
     -1.25px 1.5px  $fringe_shadow,
885
     -1.5px  1.75px $fringe_shadow,
886
     -1.75px 2px    $fringe_shadow; */
26 PointedEar 887
  /* Same shadow as .e */
888
  text-shadow:
32 PointedEar 889
    -0.25px 0.25px #5b6e65,
890
    -0.5px  0.5px  #5b6e65,
891
    -1px    0.75px #5b6e65,
892
    -1.25px 1.25px #5b6e65,
893
    -1.5px  1.5px  #5b6e65,
894
    -1.75px 1.75px #5b6e65,
895
    -2px    2px    #5b6e65;
26 PointedEar 896
}
897
 
898
.fringe .e {
899
  display: inline-block;
900
  /* -webkit-transform: matrix(1, 0, 0.02, 1, 0, 0); */
901
  text-shadow:
32 PointedEar 902
    -0.25px 0.25px #5b6e65,
903
    -0.5px  0.5px  #5b6e65,
904
    -1px    0.75px #5b6e65,
905
    -1.25px 1.25px #5b6e65,
906
    -1.5px  1.5px  #5b6e65,
907
    -1.75px 1.75px #5b6e65,
908
    -2px    2px    #5b6e65;
26 PointedEar 909
}
910
 
911
@font-face {
912
  font-family: "Futurama Title";
913
  src: local("Futurama Title"), url(/styles/fonts/futurama-title.ttf);
914
}
915
 
916
.futurama {
917
  display: block;
918
  padding-top: 0.5em;
919
  font-family: "Futurama Title", serif;
920
  text-transform: uppercase;
921
  line-height: 1em;
922
  -webkit-transform: translateX(-0.67em);
923
}
924
 
925
.futurama span {
926
  display: inline-block;
927
   line-height: 1em;
928
}
929
 
930
.futurama .f {
931
  -webkit-transform: rotate(-36deg) translateY(0.125em);
932
}
933
 
934
.futurama .u {
935
  -webkit-transform: rotate(-25.7deg) translateX(0.25em) translateY(-0.25em);
936
}
937
 
938
.futurama .t {
939
  -webkit-transform: rotate(-15.4deg) translateX(0.33em) translateY(-0.625em);
940
}
941
 
942
.futurama .u2 {
943
  -webkit-transform: rotate(-5.1deg) translateX(0.4em) translateY(-0.825em);
944
}
945
 
946
.futurama .r {
947
  -webkit-transform: rotate(5.1deg) translateX(0.45em) translateY(-0.95em);
948
}
949
 
950
.futurama .a {
951
  -webkit-transform: rotate(15.4deg) translateX(0.5em) translateY(-0.9em);
952
}
953
 
954
.futurama .m {
955
  -webkit-transform: rotate(25.7deg) translateX(0.55em) translateY(-0.7em);
956
}
957
 
958
.futurama .a2 {
959
  -webkit-transform: rotate(36deg) translateX(0.67em) translateY(-0.4em);
960
}
961
 
962
@font-face {
963
  font-family: "ITC Avant Garde Gothic Medium";
964
  src: local("ITC Avant Garde Gothic Medium"), local("ITC Avant Garde Gothic"),
41 PointedEar 965
    url(/styles/fonts/non-free/itc_avant_garde_gothic--lte52011.ttf);
26 PointedEar 966
}
967
 
968
.glee {
969
  padding: 0.125em 0.5em;
970
  /* background-image: -moz-radial-gradient(#FFEA8C, #FFD727);
971
  background-image: -webkit-radial-gradient(#FFEA8C, #FFD727);
972
  background-color: #FFD727; */
973
  background-color: #000;
974
  color: #fff;
975
  font-family: "ITC Avant Garde Gothic Medium", sans-serif;
976
  font-size: 120%;
977
  text-transform: lowercase;
978
  letter-spacing: -0.0625em;
979
}
980
 
981
.glee .lee {
982
  letter-spacing: -0.125em;
983
}
984
 
985
@font-face {
986
  font-family: "SKM Avant Garde Two";
41 PointedEar 987
  src: local("SKM Avant Garde Two"), url(/styles/fonts/non-free/SKM%20Avant%20Garde%20Two.ttf);
26 PointedEar 988
}
989
 
990
.heroes {
991
  position: relative;
992
  padding: 0.25em 0.75em 0.125em 0.75em;
993
  background-color: black;
994
  color: #fff;
995
  font-family: "SKM Avant Garde Two", sans-serif;
996
  text-transform: uppercase;
997
  letter-spacing: 0.5em;
998
}
999
 
1000
.heroes .o {
1001
  position: relative;
1002
  color: #ffffed;
1003
  padding: 0.25em 0.125em;
1004
}
1005
 
1006
.heroes .o:after {
1007
  position: absolute;
1008
  left: -0.25em;
1009
  top: 0;
1010
  right: 0;
1011
  bottom: 0;
1012
  background-image:
1013
    /* glare */
1014
    -webkit-radial-gradient(48% 20%, circle, #ffffff 0%, #ffffff 7%,
1015
      rgb(250, 226, 182) 8%, rgba(250, 226, 182, 0) 23%),
1016
 
1017
    /* moon */
1018
    -webkit-radial-gradient(41% 50%, circle, black 35%, transparent 40%),
1019
 
1020
    /* corona */
1021
    -webkit-radial-gradient(41% 50%, circle, #f5eccd 35%, transparent 50%),
1022
 
1023
    /* flares */
1024
    -webkit-radial-gradient(44% 44%, circle, #ffffff 35%, transparent 55%);
1025
 
1026
  content: "";
1027
}
1028
 
1029
.heroes .s {
1030
  letter-spacing: normal;
1031
}
1032
 
1033
@font-face {
1034
  font-family: "House";
1035
  src: local("House"), url(/styles/fonts/House.ttf);
1036
}
1037
 
1038
.house {
1039
  /* text-transform: uppercase; */
1040
}
1041
 
1042
.house .h {
1043
  font-family: House, sans-serif;
1044
  /*
1045
  display: inline-block;
1046
  border: 1px solid black;
1047
  width: 1em;
1048
  height: 1em;
1049
  line-height: 1em;
1050
  text-align: center;
1051
  margin-right: 0.125em;
1052
  */
1053
}
1054
 
1055
.house .ouse {
1056
  font-family: House, sans-serif;
1057
  /* text-decoration: underline; */
1058
}
1059
 
1060
.house .md {
1061
  position: relative;
1062
  bottom: -0.4em;
1063
  font-size: 0.6em;
1064
}
1065
 
1066
.house .md-de {
1067
  position: relative;
1068
  font-size: 0.6em;
1069
  text-decoration: underline;
1070
}
1071
 
1072
@font-face {
1073
  font-family: "MacEnvy DB";
1074
  src: local("MacEnvy DB"), url(/styles/fonts/MacEnvy_DB-Regular.ttf);
1075
}
1076
 
1077
.ijon-tichy {
1078
  display: inline-block;
1079
  padding: 0.25em 0.5em;
1080
  background-color: #000;
1081
  color: #B9B7BA;
1082
  line-height: 1em;
1083
  font-family: "MacEnvy DB", sans-serif;
1084
  text-align: center;
1085
  text-transform: uppercase;
1086
}
1087
 
1088
.ijon-tichy .title {
1089
  display: block;
1090
  letter-spacing: 0.0625em;
1091
}
1092
 
1093
.ijon-tichy .title .i {
1094
  text-shadow: 1.5px 0.5px #59575A, 2px 0.75px #59575A;
1095
}
1096
 
1097
.ijon-tichy .title .j {
1098
  text-shadow: 1.5px 0.5px #59575A, 1.5px 0.75px #59575A;
1099
}
1100
 
1101
.ijon-tichy .title .o {
1102
  text-shadow: 1.5px 0.5px #59575A, 1px 0.75px #59575A;
1103
}
1104
 
1105
.ijon-tichy .title .n {
1106
  text-shadow: 1px 0.75px #59575A;
1107
}
1108
 
1109
.ijon-tichy .title .t {
1110
  text-shadow: 0 0.75px #59575A;
1111
}
1112
 
1113
.ijon-tichy .title .i2 {
1114
  text-shadow: -0.5px 0.75px #59575A;
1115
}
1116
 
1117
.ijon-tichy .title .c {
1118
  text-shadow: -1px 0.75px #59575A;
1119
}
1120
 
1121
.ijon-tichy .title .h {
1122
  text-shadow: -1.5px 0.75px #59575A, -1px 0.5px #59575A;
1123
}
1124
 
1125
.ijon-tichy .title .y {
1126
  text-shadow: -1.5px 0.75px #59575A, -1.5px 0.5px #59575A;
1127
}
1128
 
1129
.ijon-tichy .subtitle {
1130
  display: block;
1131
  font-size: 67%;
1132
  letter-spacing: 0.4em;
1133
}
1134
 
1135
.ijon-tichy .subtitle .r {
1136
  text-shadow: 1.5px 0.5px #59575A;
1137
}
1138
 
1139
.ijon-tichy .subtitle .a {
1140
  text-shadow: 1px 0.5px #59575A;
1141
}
1142
 
1143
.ijon-tichy .subtitle .u {
1144
  text-shadow: 0.5px 0.5px #59575A;
1145
}
1146
 
1147
.ijon-tichy .subtitle .mpi {
1148
  text-shadow: 0 0.5px #59575A;
1149
}
1150
 
1151
.ijon-tichy .subtitle .l {
1152
  text-shadow: -0.5px 0.5px #59575A;
1153
}
1154
 
1155
.ijon-tichy .subtitle .o {
1156
  text-shadow: -1px 0.5px #59575A;
1157
}
1158
 
1159
.ijon-tichy .subtitle .t {
1160
  text-shadow: -1.5px 0.5px #59575A;
1161
}
1162
 
1163
.ijon-tichy .subtitle2 {
1164
  display: block;
1165
  font-size: 50%;
1166
  line-height: 1em;
1167
}
1168
 
1169
.ijon-tichy .subtitle2 .die {
1170
  text-shadow: 1px 0.5px #59575A;
1171
}
1172
 
1173
.ijon-tichy .subtitle2 .ster {
1174
  text-shadow: 0.5px 0.5px #59575A;
1175
}
1176
 
1177
.ijon-tichy .subtitle2 .ntag {
1178
  text-shadow: 0 0.5px #59575A;
1179
}
1180
 
1181
.ijon-tichy .subtitle2 .ebuec {
1182
  text-shadow: -0.5px 0.5px #59575A;
1183
}
1184
 
1185
.ijon-tichy .subtitle2 .her {
1186
  text-shadow: -1px 0.5px #59575A;
1187
}
1188
 
1189
@font-face {
1190
  font-family: "Digital1";
1191
  src: local("Transponder AOE"), url(/styles/fonts/digital/TRANA___.TTF);
1192
}
1193
 
1194
.it-crowd {
1195
  position: relative;
1196
  padding: 0.125em 0.75em 0.125em 0.5em;
1197
  background-color: black;
1198
  color: #d4774b;
1199
  font-family: "Digital1", monospace;
1200
  font-size: 120%;
1201
  text-transform: uppercase;
1202
  text-shadow: 0 0 1px #d4774b;
1203
}
1204
 
1205
.it-crowd:after {
1206
  position: absolute;
1207
  top: 0;
1208
  content: "\258E";
1209
  letter-spacing: 0;
1210
}
1211
 
32 PointedEar 1212
.superman {
1213
  font-weight: bold;
1214
}
1215
 
26 PointedEar 1216
.life-on-mars {
28 PointedEar 1217
  display: inline-block;
26 PointedEar 1218
  padding: 0.25em 0.5em;
28 PointedEar 1219
  background-color: #000;
26 PointedEar 1220
  background-image:
28 PointedEar 1221
    -webkit-linear-gradient(left,
32 PointedEar 1222
      rgba(255, 255, 255, 0) 35%,
1223
      rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 1) 36%,
1224
      rgba(255, 255, 255, 0) 38%),
1225
    -webkit-linear-gradient(top,
1226
      rgba(255, 255, 255, 0) 81%,
1227
      rgba(255, 255, 255, 1) 81%, rgba(255, 255, 255, 1) 89%,
1228
      rgba(255, 255, 255, 0) 89%);
28 PointedEar 1229
  color: #fff;
32 PointedEar 1230
  font-weight: bold;
28 PointedEar 1231
  text-shadow: 0 0 0.5px #fff;
26 PointedEar 1232
  text-transform: uppercase;
28 PointedEar 1233
  -webkit-text-fill-color: transparent;
26 PointedEar 1234
}
1235
 
28 PointedEar 1236
.life-on-mars .e {
1237
  letter-spacing: 0.5em;
1238
}
1239
 
1240
.life-on-mars .on {
1241
  text-shadow: 0 0 1px #fff;
1242
}
1243
 
1244
.life-on-mars .mars {
1245
  text-shadow: 0 0 2px #fff;
1246
}
1247
 
26 PointedEar 1248
.macgyver {
1249
  padding: 0.125em 0.5em;
1250
  background-color: #080a09;
1251
  color: #bb1e15;
1252
  font-family: "Copperplate Gothic Bold", serif;
1253
  font-size: 150%;
1254
  font-variant: small-caps;
1255
  font-weight: bold;
32 PointedEar 1256
 
26 PointedEar 1257
  text-shadow:
32 PointedEar 1258
    -0.5px -0.5px #9f1512,
1259
     0px   -0.5px #9f1512,
1260
     0.5px -0.5px #9f1512,
1261
    -0.5px  0px   #9f1512,
1262
     0.5px  0px   #9f1512,
1263
    -0.5px  0.5px #9f1512,
1264
     0px    0.5px #9f1512,
1265
     0.5px  0.5px #9f1512,
1266
    -1px   -1px  1px #d9ad7e,
1267
     0px   -1px  1px #d9ad7e,
1268
     1px   -1px  1px #d9ad7e,
1269
    -1px    0px  1px #d9ad7e,
1270
     1px    0px  1px #d9ad7e,
1271
    -1px    1px  1px #d9ad7e,
1272
     0px    1px  1px #d9ad7e,
1273
     1px    1px  1px #d9ad7e;
26 PointedEar 1274
}
1275
 
1276
@font-face {
1277
  font-family: "Gill Sans Ultra Bold";
41 PointedEar 1278
  src: local("Gill Sans Ultra Bold"), url(/styles/fonts/non-free/gilsanu0.TTF);
26 PointedEar 1279
}
1280
 
1281
.monk {
1282
  color: #d1122a;
1283
  font-family: "Gill Sans Ultra Bold", sans-serif;
1284
  font-size: 110%;
1285
  text-transform: uppercase;
1286
  text-shadow: 1px 1px 1px black;
1287
}
1288
 
1289
@font-face {
1290
  font-family: "Swiss 721 Black Extended BT";
41 PointedEar 1291
  src: local("Swiss 721 Black Extended BT"), url(/styles/fonts/non-free/swiss721_bke.TTF);
26 PointedEar 1292
}
1293
 
1294
.moonlight {
1295
  padding: 0.125em 0.5em;
1296
  background-color: black;
1297
  color: #020109;
1298
  font-family: "Swiss 721 Black Extended BT", sans-serif;
1299
  text-transform: uppercase;
53 PointedEar 1300
  <?php
1301
        Mixins::radial_gradient('background-image',
1302
                '24% 50%, circle,
1303
                 rgba(224, 211, 106, 1) 33%, rgba(224, 211, 106, 0) 36%, #100d04');
1304
  ?>
26 PointedEar 1305
}
1306
 
1307
.moonlight .moon {
1308
  -webkit-mask-image: -webkit-linear-gradient(-80deg, rgba(0,0,0,0.33), rgba(0,0,0,1) 67%);
1309
  letter-spacing: -0.0625em;
1310
}
1311
 
1312
.moonlight .moon .n {
1313
  letter-spacing: 0.125em;
1314
}
1315
 
1316
.moonlight .light {
1317
  color: #ebf062;
1318
  text-shadow: 1px 1px 2px #070400;
1319
}
1320
 
1321
@font-face {
1322
  font-family: "Terminator";
1323
  src: url(/styles/fonts/TERMINAT.TTF);
1324
}
1325
 
1326
.mutant-x {
1327
  position: relative;
1328
  padding: 0.25em 0.5em 0.125em 0.5em;
1329
  background-color: black;
1330
  color: #8f6442;
1331
  font-family: "Terminator", sans-serif;
1332
  font-size: 105%;
1333
  text-transform: uppercase;
1334
  white-space: nowrap;
1335
  -webkit-text-stroke: 0.5px rgba(255, 255, 255, 0.1);
1336
}
1337
 
1338
.mutant-x .gradient {
1339
  position: absolute;
1340
  padding: 0.25em 0.5em 0.125em 0.5em;
1341
  left: 0;
1342
  top: 0;
1343
  -webkit-mask-image: -webkit-linear-gradient(
1344
    rgba(0, 0, 0, 1) 30%, transparent 55%, rgba(0, 0, 0, 1) 80%);
1345
  z-index: 2;
1346
}
1347
 
1348
.mutant-x:after {
1349
  content: "Mutant X";
1350
  color: #fcf1eb;
1351
}
1352
 
1353
@font-face {
1354
  font-family: "Walkway SemiBold";
1355
  src: local("Walkway SemiBold"), url(/styles/fonts/Walkway_SemiBold.ttf);
1356
}
1357
 
1358
.numb3rs {
1359
  position: relative;
1360
  padding: 0.25em 0.5em 0.125em 0.5em;
1361
  background-color: #000200;
1362
  /*
1363
  background-image:
1364
    -webkit-repeating-linear-gradient(left, transparent, transparent 9px,
1365
      rgba(244, 247, 244, 0.5) 10px, rgba(244, 247, 244, 0.5) 10px),
1366
    -webkit-repeating-linear-gradient(top, transparent, transparent 4px,
1367
      rgba(244, 247, 244, 0.5) 5px, rgba(244, 247, 244, 0.5) 5px);
1368
  */
1369
  color: #f4f7f4;
1370
  font-family: "Walkway SemiBold", Helvetica, sans-serif;
1371
  font-size: 116%;
1372
  font-weight: lighter;
1373
  letter-spacing: 1px;
1374
  text-shadow: 0 0 2px #f4f7f4;
1375
  text-transform: uppercase;
1376
}
1377
 
1378
.numb3rs .s {
1379
  letter-spacing: normal;
1380
}
1381
 
1382
/*  
1383
.numb3rs .gradient {
1384
  position: absolute;
1385
  left: 0;
1386
  top: 0;
1387
  padding: 0.25em 0.5em 0.125em 0.5em;
1388
  color: #f4f7f4;
1389
  -webkit-mask-image: -webkit-linear-gradient(rgba(0, 0, 0, 1), transparent 75%);
1390
  z-index: 2;
1391
}
1392
 
1393
.numb3rs:after {
1394
  content: "Numb3rs";
1395
  color: #898b88;
1396
  text-transform: uppercase;
1397
} */
1398
 
1399
@font-face {
28 PointedEar 1400
  font-family: "Unconform Round";
1401
  src: local("Unconform Round"), url(/styles/fonts/UNCON___.TTF);
1402
}
1403
 
1404
.odyssey5 {
1405
  padding: 0.5em 0.5em 0.125em 0.5em;
1406
  background-color: #000;
1407
  color: #d1550b;
1408
  font-family: "Unconform Round", sans-serif;
1409
  text-transform: uppercase;
1410
  letter-spacing: 0.125em;
1411
}
1412
 
1413
.odyssey5 .s2 {
1414
  letter-spacing: 0.25em;
1415
}
1416
 
1417
.odyssey5 .e {
1418
  letter-spacing: 0.5em;
1419
}
1420
 
1421
.odyssey5 .y2 {
1422
  letter-spacing: 0.5em;
1423
}
1424
 
1425
.odyssey5 .five {
1426
  letter-spacing: normal;
1427
}
1428
 
1429
@font-face {
26 PointedEar 1430
  font-family: "Dateline Bold";
1431
  src: local("Dateline Bold"), url(/styles/fonts/DatelineBold.ttf);
1432
}
1433
 
1434
.psych {
1435
  font-family: "Dateline Bold", serif;
1436
  font-size: 110%;
1437
  letter-spacing: -0.125em;
1438
  color: #749f27;
1439
}
1440
 
1441
@font-face {
1442
  font-family: "Swiss Cheesed";
1443
  src: local("SwissCheese"), url(/styles/fonts/SwissCheesed.ttf);
1444
}
1445
 
1446
.quantum-leap {
1447
  position: relative;
1448
  display: inline-block;
1449
  left: 0;
1450
  top: 0;
1451
  padding: 0.5em 0.5em 0.25em 0.5em;
1452
  background-color: black;
32 PointedEar 1453
 
1454
  color: #5598ff;
26 PointedEar 1455
  font-family: "Swiss Cheesed", sans-serif;
1456
  font-size: 110%;
1457
  letter-spacing: 0.0625em;
1458
  text-transform: uppercase;
1459
  text-align: center;
1460
  text-shadow:
32 PointedEar 1461
    -1px -1px #6f98e5,
1462
 
1463
     1px -1px #6f98e5,
1464
    -1px  0px #6f98e5,
1465
 
1466
     1px  0px #6f98e5,
1467
    -1px  1px #6f98e5,
1468
 
1469
     1px  1px #6f98e5,
1470
    -1px -1px 8px #5598ff,
1471
 
1472
     1px -1px 8px #5598ff,
1473
    -1px  0   8px #5598ff,
1474
 
1475
     1px  0   8px #5598ff,
1476
    -1px  1px 8px #5598ff,
1477
 
1478
     1px  1px 8px #5598ff;
26 PointedEar 1479
}
1480
 
1481
.quantum-leap .gradient {
1482
  position: absolute;
1483
  left: 0;
1484
  top: 0;
1485
  padding: 0.5em 0.5em 0.25em 0.5em;
1486
  color: #000;
32 PointedEar 1487
  -webkit-text-fill-color: #5598ff;
26 PointedEar 1488
  -webkit-mask-image: -webkit-linear-gradient(rgba(0, 0, 0, 1), transparent 33%);
1489
  z-index: 2;
1490
}
1491
.quantum-leap:after {
1492
  content: "Quantum Leap";
1493
  color: #000;
1494
}
1495
 
1496
@font-face {
1497
  font-family: "Spleeny Decaf GD";
41 PointedEar 1498
  src: local("Spleeny Decaf GD"), url(/styles/fonts/non-free/Spleeny%20Decaf%20GD.ttf);
26 PointedEar 1499
}
1500
 
1501
.reaper {
1502
  font-family: "Spleeny Decaf GD", fantasy;
1503
  text-transform: uppercase;
1504
}
1505
 
1506
@font-face {
1507
  font-family: "Roswell";
1508
  src: local("Roswell"), url(/styles/fonts/Roswell.TTF);
1509
}
1510
 
1511
.roswell {
1512
  display: inline-block;
1513
  padding: 0.25em 0.5em 0.125em 0.5em;
1514
  background-color: #000;
53 PointedEar 1515
  <?php
1516
    Mixins::linear_gradient('background-image', 'left, #6f3811, #000');
1517
  ?>
26 PointedEar 1518
  color: #ffffbc;
1519
  font-family: "Roswell", sans-serif;
1520
  letter-spacing: 0.25em;
32 PointedEar 1521
 
26 PointedEar 1522
  text-shadow:
32 PointedEar 1523
    -1px -1px 1px rgba(138, 8, 0, 0.5),
1524
     0px  1px 1px rgba(138, 8, 0, 0.5),
1525
     1px  1px 1px rgba(138, 8, 0, 0.5);
26 PointedEar 1526
  text-transform: uppercase;
32 PointedEar 1527
  -webkit-text-stroke: 0.25px rgba(138, 8, 0, 0.75);
26 PointedEar 1528
}
1529
 
1530
.roswell span {
1531
  letter-spacing: normal;
1532
}
1533
 
1534
.samantha-who {
1535
  display: inline-block;
1536
  padding: 0.125em 0.25em 0.125em 0.25em;
1537
  background-color: #000;
1538
  color: #e3e5e2;
1539
  line-height: 1em;
1540
}
1541
 
1542
.samantha-who .text {
1543
  display: inline-block;
1544
}
1545
 
1546
.samantha-who .samantha {
1547
  display: block;
1548
  position: relative;
1549
  padding-top: 0.25em;
1550
  padding-left: 0.25em;
1551
  font-family: "a_Futura Orto", sans-serif;
1552
  text-transform: uppercase;
1553
}
1554
 
1555
.samantha-who .samantha::after {
1556
  position: absolute;
1557
  left: -0.2em;
1558
  top: -1.05em;
1559
  right: 0.2em;
1560
  bottom: 1.05em;
1561
  background-image: -webkit-radial-gradient(10% 15%, 20% 20%, transparent 15%, #d29c13 26%, #d29c13 34%, transparent 45%);
1562
  content: "";
1563
  -webkit-transform: rotate(-27deg);
1564
  /*border: 1px solid red;*/
1565
}
1566
 
1567
.samantha-who .who,
1568
.samantha-who .q {
1569
  color: #e81b04;
1570
}
1571
 
1572
.samantha-who .who {
1573
  display: block;
1574
  font-weight: bold;
1575
  line-height: 0.75em;
1576
}
1577
 
1578
.samantha-who .q {
1579
  font-family: cursive;
1580
  font-size: 200%;
1581
  font-weight: lighter;
1582
}
1583
 
1584
@font-face {
1585
  font-family: "Scrubs";
1586
  src: local("TSS Scrubs Logo"), url(/styles/fonts/tsslogo.ttf);
1587
}
1588
 
1589
.scrubs:before {
1590
  content: "[";
1591
}
1592
 
1593
.scrubs {
1594
  padding: 0.125em 0.25em 0 0.25em;
1595
  background-color: #15121a;
1596
  color: #d0f9fb;
1597
  font-family: "Scrubs", sans-serif;
1598
  font-size: 150%;
1599
  text-shadow: 0 0 10px #d0f9fb;
1600
}
1601
 
1602
.scrubs .s {
1603
  text-transform: uppercase;
1604
}
1605
 
1606
.scrubs:after {
1607
  content: "]";
1608
}
1609
 
1610
@font-face {
1611
  font-family: "seaQuest";
1612
  src: local("Seaquest"), url(/styles/fonts/SQDSV.TTF);
1613
}
1614
 
1615
.seaQuest {
1616
  position: relative;
1617
  display: inline-block;
1618
  padding-top: 1.5em;
1619
  background-color: #00001e;
1620
<?php
1621
  // error_reporting(E_ALL | E_STRICT);
1622
  $lambda = 1;
1623
  for ($i = 0; $i < 200; ++$i)
1624
  {
1625
    $x = mt_rand(1, 99);
1626
    /*
1627
     * Decreasing probability of pixels near bottom through exponential distribution;
1628
     * TODO: If coord > 50%, decrease probability of appearance.
1629
     */
1630
    $y = mt_rand(1, $lambda * exp(-$lambda * mt_rand(0, 5)) * 99);
1631
    $coords[] = array('x' => $x, 'y' => $y);
1632
  }
1633
 
1634
  $dots = array_map(function ($coord) {
1635
    return "-webkit-radial-gradient({$coord['x']}% {$coord['y']}%, 1px 1px, rgba(255, 255, 255, 0.75), rgba(0, 0, 30, 0))";
1636
  }, $coords);
1637
?>
1638
  /* water bubbles */
1639
  background-image: <?php echo implode(",\n    ", $dots); ?>,
1640
    /* sunlight */
1641
    -webkit-radial-gradient(50% 0%, 50% 200%, #00438c, rgba(0, 0, 31, 0)),
1642
    /* water */
1643
    -webkit-linear-gradient(#030129, #00000c);
32 PointedEar 1644
  color: #ffc50c;
26 PointedEar 1645
  font-family: "seaQuest", sans-serif;
1646
  font-size: 92%;
1647
}
1648
 
1649
.seaQuest #seaQuest {
1650
  display: block;
1651
  padding: 0 0.25em;
1652
  text-transform: uppercase;
1653
  line-height: 1;
1654
}
1655
 
1656
.seaQuest #seaQuest .s {
1657
  text-shadow:
1658
    0.5px -0.25px 0.5px #f5bd46,
1659
    1px   -0.5px  0.5px #cd8d1f,
1660
    1.5px -0.75px 0.5px #b37b1c,
1661
    2px   -1px    0.5px #805b17,
1662
    2.5px -1.25px 0.5px #2e2000,
1663
    3px   -1.5px  0.5px #040400,
1664
    3.5px -1.75px       #000508;
1665
}
1666
 
1667
.seaQuest #seaQuest .e {
1668
  text-shadow:
1669
    0.5px -0.25px 0.5px #f5bd46,
1670
    1px   -0.5px  0.5px #cd8d1f,
1671
    1.5px -0.75px 0.5px #b37b1c,
1672
    2px   -1px    0.5px #805b17,
1673
    2.5px -1.25px 0.5px #2e2000,
1674
    3px   -1.5px        #040400;
1675
}
1676
 
1677
.seaQuest #seaQuest .a {
1678
  text-shadow:
1679
    0.5px -0.25px 0.5px #fdb207,
1680
    1px   -0.5px  0.5px #eb950e,
1681
    1.5px -0.75px 0.5px #ae5900,
1682
    2px   -1px    0.5px #642a00,
1683
    2.5px -1.25px       #261704;
1684
}
1685
 
1686
.seaQuest #seaQuest .q {
1687
  position: relative;
1688
  visibility: hidden;
1689
  display: inline-block;
1690
  margin-right: 0.5em;
1691
  text-shadow: none;
1692
}
1693
 
1694
.seaQuest #seaQuest .q:after {
1695
  position: absolute;
1696
  visibility: visible;
1697
  margin-right: 0.125em;
1698
  left: 0;
1699
  top: -0.5em;
1700
  right: 0;
1701
  bottom: 0;
1702
  content: "{";
1703
  text-align: center;
1704
  text-shadow:
1705
    0.5px -0.25px 0.5px #ffb43b,
1706
    1px   -0.5px  0.5px #e28d23,
1707
    1.5px -0.75px 0.5px #853400,
1708
    2px   -1px          #510600;
1709
}
1710
 
1711
.seaQuest #seaQuest .u {
1712
  text-shadow:
1713
    0.5px -0.25px 0.5px #f7c35d,
1714
    1px   -0.5px  0.5px #a36729,
1715
    1.5px -0.75px 0.5px #3c0800,
1716
    2px   -1px          #1b011c;
1717
}
1718
 
1719
.seaQuest #seaQuest .e2 {
1720
  text-shadow:
1721
     0.5px -0.25px 0.5px #d8ab56,
1722
     1px   -0.5px  0.5px #5c3605;
1723
}
1724
 
1725
.seaQuest #seaQuest .s2 {
1726
  text-shadow:
1727
    0px    -0.25px 0.5px #d8ab56,
1728
    -0.5px -0.5px  0.5px #5c3605,
1729
    -1px   -0.75px       #200d00,
1730
     0.5px -0.25px       #200d00;
1731
}
1732
 
1733
.seaQuest #seaQuest .t {
1734
  text-shadow:
1735
     0.5px -0.25px       #e9bf73,
1736
    -0.5px -0.25px 0.5px #d8ab56,
1737
    -1px   -0.5px  0.5px #5c3605,
1738
    -1.5px -0.75px       #200d00,
1739
     0.5px -0.25px       #200d00;
1740
}
1741
 
1742
.seaQuest #dsv {
1743
  position: relative;
1744
  visibility: hidden;
1745
  display: block;
1746
  margin-top: 0.5em;
1747
  padding-bottom: 0.25em;
1748
  line-height: 1;
1749
}
1750
 
1751
.seaQuest #dsv:after {
1752
  position: absolute;
1753
  visibility: visible;
1754
  left: -0.75em;
1755
  top: 0;
1756
  right: 0;
1757
  bottom: 0;
1758
  content: "|";
1759
  text-align: center;
1760
  text-shadow:
1761
    0.5px -0.25px 0.5px #ffb43b,
1762
    1px   -0.5px  0.5px #e28d23,
1763
    1.5px -0.75px 0.5px #853400,
1764
    2px   -1px          #510600;
1765
}
1766
 
1767
@font-face {
1768
  font-family: "London Tube";
41 PointedEar 1769
  src: local("P22 Johnston Underground"), url(/styles/fonts/non-free/p22-johnston-underground.ttf);
26 PointedEar 1770
}
1771
 
1772
.sherlock {
1773
  font-family: "London Tube", sans-serif;
1774
  font-size: 120%;
1775
  text-transform: uppercase;
1776
}
1777
 
1778
@font-face {
1779
  font-family: "Simpsonfont";
1780
  src: local("Simpsonfont"), url(/styles/fonts/Simpsonfont.ttf);
1781
}
1782
 
1783
@font-face {
1784
  font-family: "Akbar";
1785
  src: local("Akbar"), url(/styles/fonts/akbar.ttf);
1786
}
1787
 
1788
.simpsons {
1789
  position: relative;
1790
  display: inline-block;
1791
  min-width: 6em;
1792
  min-height: 2em;
1793
  padding: 0.125em 0.25em;
1794
  background-color: #6598DC;
1795
  color: #FFD166;
1796
  font-family: "Akbar", sans-serif;
1797
  text-align: center;
1798
  text-transform: uppercase;
1799
  overflow: hidden;
1800
}
1801
 
1802
.simpsons span {
1803
  position: relative;
1804
  display: block;
1805
}
1806
 
53 PointedEar 1807
<?php
1808
  Mixins::keyframes('zoom-in',
1809
    '0% {
1810
       opacity: 0;
1811
       -moz-transform: perspective(100px) translateX(0) translateY(0) translateZ(-400px);
1812
       -webkit-transform: perspective(100px) translateX(0) translateY(0) translateZ(-400px);
1813
     }
1814
 
1815
     20% {
1816
       opacity: 1;
1817
     }
1818
 
1819
     100% {
1820
       -moz-transform: perspective(100px) translateX(5px) translateY(-4px) translateZ(100px);
1821
       -webkit-transform: perspective(100px) translateX(5px) translateY(-4px) translateZ(100px);
1822
     }');
1823
?>
1824
 
26 PointedEar 1825
.simpsons:hover span.text {
53 PointedEar 1826
  <?php
1827
        Mixins::animation('-name', 'zoom-in');
1828
        /* -webkit-animation-iteration-count: infinite; */
1829
        Mixins::animation('-duration', '3s');
1830
  ?>  
26 PointedEar 1831
}
1832
 
1833
@font-face {
1834
  font-family: "Smallville";
1835
  src: local("Smallville"), url(/styles/fonts/Smallville1.ttf);
1836
}
1837
 
1838
.smallville {
1839
  font-family: "Smallville", sans-serif;
1840
  font-size: 160%;
1841
  text-transform: uppercase;
1842
  color: #FE1318;
1843
}
1844
 
1845
/* Symmetric "Superman" effect */
1846
.smallville span {
1847
  position: relative;
1848
  top: -0.1em;
1849
  font-size: 90%;
1850
}
1851
 
1852
@font-face {
1853
  font-family: "Stargate";
1854
  src: local("Stargate"), url(/styles/fonts/STARGATE.TTF);
1855
}
1856
 
1857
.stargate {
1858
  display: inline-block;
1859
  font-family: "Stargate", serif;
1860
  font-size: 122%;
1861
  text-align: center;
1862
  text-transform: uppercase;
1863
}
1864
 
1865
.stargate > span {
1866
  display: block;
1867
}
1868
 
1869
.stargate.en {
1870
  letter-spacing: 0.125em;
1871
}
1872
 
1873
.stargate.en span span:last-child {
1874
  letter-spacing: normal;
1875
}
1876
 
1877
.stargate.en > span:first-child {
1878
  padding-bottom: 0;
1879
  border-bottom: 1px solid black;
1880
}
1881
 
1882
.stargate.en > span:last-child {
1883
  padding-top: 0.125em;
1884
}
1885
 
1886
.stargate.de > span:last-child {
1887
  font-size: 64%;
1888
}
1889
 
1890
.stargate .a {
1891
  text-transform: lowercase;
1892
}
1893
 
1894
.atlantis .stargate {
1895
  display: inline-block;
1896
  padding: 0 0.25em;
1897
  border-bottom: 1px solid black;
1898
  font-size: 81%;
1899
  letter-spacing: 0.125em;
1900
}
1901
 
1902
.atlantis .atlantis {
1903
  margin-top: 0.125em;
1904
  position: relative;
1905
  top: -0.15em;
1906
  padding-top: 0.15em;
1907
  letter-spacing: 0.125em;
1908
}
1909
 
1910
.atlantis span span:last-child
1911
{
1912
  letter-spacing: normal;
1913
}
1914
 
1915
.sg-u {
1916
  padding: 0.25em 0.25em 0 0.25em;
1917
  background-color: #000;
1918
  color: #eee;
1919
  font-family: "Eurostile Extended", sans-serif;
1920
  font-size: 122%;
32 PointedEar 1921
  font-weight: bold;
26 PointedEar 1922
  letter-spacing: -0.125em;
1923
}
1924
 
1925
.sg-u .ring {
1926
  letter-spacing: -0.2em;
1927
}
1928
 
1929
@font-face {
1930
  font-family: "Torchwood";
1931
  src: local("Torchwood"), url(/styles/fonts/Torchwood.ttf);
1932
}
1933
 
1934
@font-face {
1935
  font-family: "Federation Classic";
1936
  src: local("Federation Classic"), url(/styles/fonts/FEC_____.TTF);
1937
}
1938
 
41 PointedEar 1939
.star-trek-tos {
26 PointedEar 1940
  padding: 0.125em 0.25em 0 0.25em;
1941
  background-color: #000;
41 PointedEar 1942
  color: #FBB72C;
26 PointedEar 1943
  font-family: "Federation Classic", sans-serif;
1944
  font-size: 150%;
1945
  text-transform: lowercase;
1946
}
1947
 
41 PointedEar 1948
@font-face {
1949
  font-family: "Starnext";
1950
        src: local("Starnext"), url(/styles/fonts/StarNext.ttf);
1951
}
1952
 
1953
.star-trek-tng {
1954
  display: inline-block;
1955
  padding: 0.25em 0.5em 0.25em 0.5em;
1956
  background-color: #000;
1957
  color: #2D7BCD;
1958
  font-family: "Starnext", sans-serif;
1959
  font-size: 120%;
1960
  line-height: 1;
1961
        text-transform: uppercase;
1962
  text-align: center;
1963
}
1964
 
1965
.star-trek-tng span {
1966
  display: block;
1967
}
1968
 
1969
.star-trek-tng .star {
1970
  text-align: left;
1971
}
1972
 
1973
.star-trek-tng .trek {
1974
  position: relative;
1975
  top: -0.2em;
1976
  text-align: right;
1977
}
1978
 
1979
.star-trek-tng .tng {
1980
  font-size: 44%;
1981
}
1982
 
29 PointedEar 1983
.time-trax {
1984
  background-color: #fff;
1985
  color: #003ee5;
1986
  font-size: 120%;
32 PointedEar 1987
  font-weight: bold;
29 PointedEar 1988
  text-shadow: 2px 1px #00021c;
1989
}
1990
 
26 PointedEar 1991
.torchwood {
1992
  padding: 0.125em 0.25em;
1993
  background-color: black;
1994
  color: #E72524;
1995
  font-family: "Torchwood", serif;
1996
  font-size: 106%;
1997
  text-transform: uppercase;
1998
}
1999
 
2000
@font-face {
2001
  font-family: "True Blood";
41 PointedEar 2002
  src: local("True Blood"), url(/styles/fonts/non-free/TRUEBLOOD.ttf);
26 PointedEar 2003
}
2004
 
2005
.true-blood {
53 PointedEar 2006
  font-family: "True Blood", sans-serif;
26 PointedEar 2007
}
2008
 
2009
.true-blood .upper {
2010
  text-transform: uppercase;
2011
}
2012
 
2013
.true-blood .blood {
2014
  color: #991b30;
2015
}
2016
 
2017
.true-blood .lower {
2018
  text-transform: lowercase;
2019
}
2020
 
2021
.tara {
2022
  font-family: sans-serif;
32 PointedEar 2023
  font-weight: bold;
26 PointedEar 2024
  text-transform: uppercase;
2025
}
2026
 
2027
.visitors {
2028
  display: inline-block;
2029
  position: relative;
2030
  padding: 0.5em 0.5em 0.25em 0.5em;
2031
  background-color: #000;
2032
  color: #ff1700;
2033
  font-family: fantasy;
2034
  font-size: 80%;
2035
  line-height: 2em;
2036
}
2037
 
2038
.visitors span {
2039
  vertical-align: middle;
2040
}
2041
 
2042
.visitors .v {
2043
  position: absolute;
2044
  left: 0;
2045
  width: 100%;
2046
  font-size: 300%;
2047
  color: rgba(210, 0, 1, 0.8);
2048
  text-align: center;
2049
}
2050
 
2051
.visitors .subtitle {
2052
  text-transform: uppercase;
2053
}
2054
 
2055
@font-face {
2056
  font-family: "Gunplay";
2057
  src: local("Gunplay"), url(/styles/fonts/gunplay.ttf);
2058
}
2059
 
2060
.warehouse-13 {
2061
  padding: 0 0.25em 0.125em 0.25em;
2062
  background-color: #000;
2063
  color: #BF311A;
2064
  font-family: "Gunplay", sans-serif;
2065
  text-transform: uppercase;
2066
}
2067
 
2068
.warehouse-13 .numbers {
2069
  color: #B4B4B4;
2070
}
2071
 
2072
div.box {
2073
  border: 1px solid black;
2074
  position: relative;
2075
  text-align: center;
2076
}
2077
 
2078
div.meter, div.coverage {
2079
  position: absolute;
2080
  height: 100%;
2081
}
2082
 
2083
div.meter {
2084
  background-color: rgba(0, 0, 128, 0.5);
2085
}
2086
 
2087
div.season {
2088
  position: absolute;
2089
  border-left: 1px solid #333;
2090
  background-color: transparent;
2091
  color: #999;
2092
  overflow: hidden;
2093
  white-space: nowrap;
2094
}
2095
 
2096
div.coverage {
2097
  background-color: rgba(0, 218, 0, 0.5);
2098
}
2099
 
2100
.percentage {
2101
  position: relative;
2102
  background-color: rgba(255, 255, 255, 0.5);
2103
}