Subversion Repositories LCARS

Rev

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

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