Subversion Repositories LCARS

Rev

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