WebSVN - LCARS - Diff - Rev 26 and 28 - /trunk/media/video/series/style.css


<?php
header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT');

/* Cached resource expires in HTTP/1.1 caches 24h after last retrieval */
header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate');

/* Cached resource expires in HTTP/1.0 caches 24h after last retrieval */
header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT');

header('Content-Type: text/css; charset=UTF-8');
?>
@CHARSET "UTF-8";

html, body {
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  text-rendering: optimizeLegibility;
}

body {
  font-family: sans-serif;
}

:link, :visited {
  text-decoration: none;
  color: inherit;
}

.hidden {
  display: none;
}

h1 {
  margin: 0;
  text-align: center;
}

[title] {
  cursor: help;
/*  border-bottom: 1px dotted black; */
}

table {
  width: 100%;
  border-collapse: collapse;
}

th {
  width: 20%;
  padding: 0.25em 0.5em 0.25em 0;
  text-align: right;
}

td:first-child {
  width: 1em;
  border: none;
}

th.recommended {
  border-left: 2px solid green;
  border-top: 2px solid green;
  border-bottom: 2px solid green;
}

td:last-child {
  padding-right: 0.25em;
}

td.recommended {
  border-top: 2px solid green;
  border-right: 2px solid green;
  border-bottom: 2px solid green;
}

@font-face {
  font-family: "Futura Condensed";
  src: local("Futura Condensed"), url(/styles/fonts/futura_condensed.TTF);
}

@font-face {
  font-family: "X-Files";
  src: local("X-Files"), url(/styles/fonts/x-files.ttf);
}

<?php
  $xfiles_pos = '65% 60%';
  $xfiles_angle = '12deg';
  $xfiles_gray = '236, 244, 235';
?>

.akte-x {
  padding: 1em 0.25em 0.6em 0.25em;
  background-image:
    linear-gradient(<?php echo $xfiles_angle; ?>,
      rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,
      rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
  background-image:
    -moz-radial-gradient(<?php echo $xfiles_pos; ?>,
      rgba(<?php echo $xfiles_gray; ?>, 0.5) 50%, rgba(<?php echo $xfiles_gray; ?>, 0.1)),
    -moz-linear-gradient(<?php echo $xfiles_angle; ?>,
      rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,
      rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
  background-image:
    -o-linear-gradient(<?php echo $xfiles_angle; ?>,
      rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,
      rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
  background-image:
    -webkit-radial-gradient(<?php echo $xfiles_pos; ?>, 25% 75%,
      rgba(<?php echo $xfiles_gray; ?>, 0.5) 50%, rgba(<?php echo $xfiles_gray; ?>, 0.1)),
    -webkit-linear-gradient(<?php echo $xfiles_angle; ?>,
      rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,
      rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
  background-color: #000;
  color: #dcdfdc;
  line-height: 2em;
  vertical-align: middle;  
}

.akte-x .small {
  padding-left: 1em;
  background-image: linear-gradient(bottom left, black, transparent);
  background-image: -moz-linear-gradient(bottom left, black, transparent);
  background-image: -o-linear-gradient(bottom left, black, transparent);
  background-image: -webkit-linear-gradient(bottom left, black, transparent);
  vertical-align: middle;
  font-family: "Futura Condensed", sans-serif;
  font-size: 50%;
  text-transform: uppercase;
  letter-spacing: 1em;
}

.akte-x .before-x {
  letter-spacing: normal;
}

.akte-x .x {
  font-family: "X-Files", sans-serif;
  font-size: 600%;
  font-weight: lighter;
  vertical-align: middle;
  vertical-align: -webkit-baseline-middle;
  color: black;
  -webkit-mask-image: -webkit-linear-gradient(-12deg,
    rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));
}

.alf {
  font-family: "URW Bookman L", serif;
  font-weight: bold;
  font-size: 120%;
 
}

@font-face {
  font-family: "Highguard";
  src: local("Highguard"), url(/styles/fonts/Highguard.ttf);
}

.andromeda {
  position: relative;
  font-family: "Highguard", sans-serif;
  font-size: 204%;
  color: rgba(245, 153, 79, 1);
  text-shadow:
    /* blurred shadow */
    -1px 0 2px black, 0 -1px 2px black, 1px 0 2px black, 0 1px 2px black,
   
    /* outline */
    -1px 0 black, 0 -1px black, 1px 0 black, 0 1px black;
}

.andromeda .gradient {
  -webkit-mask-image: -webkit-linear-gradient(top,
    rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));
}

.andromeda .roddenberry {
  position: absolute;
  right: 3.5em;
  top: 1.7em;
  font-family: sans-serif;
  font-size: 21%;
  text-transform: uppercase;
  color: black;
  text-shadow: none;
  letter-spacing: 0;
}

.big-bang-theory {
  font-family: Impact, sans-serif;
  font-size: 122%;
  text-transform: uppercase;
}

.big-bang-theory .lower {
  font-size: 0.75em;
  text-transform: lowercase;
}

.big-bang-theory .i {
  text-transform: none;
  font-size: 111%;
  font-weight: normal;
}

.big-bang-theory .bang {
  color: #CE152C;
}

@font-face {
  font-family: "Battlestar";
  src: local("Battlestar"), url(/styles/fonts/BATTLEST.TTF);
}

.bsg {
  font-family: "Battlestar", sans-serif;
  font-size: 84%;
}

@font-face {
  font-family: "Buffied";
  src: local("Buffied"), url(/styles/fonts/Buffied.ttf);
}

@font-face {
  font-family: "Slayer";
  src: url(/styles/fonts/slayer11.eot?);
  src: local("Slayer"),
    url(/styles/fonts/slayer11.eot?) format(eot),
    url(/styles/fonts/slayer11.woff) format(woff),
    url(/styles/fonts/slayer11.ttf) format(truetype),
    url(/styles/fonts/slayer11.svg#Slayer) format(svg);
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Kruella";
  src: local("Kruella"), url(/styles/fonts/kruella.ttf);
}

.buffy {
  display: inline-block;
  padding: 0.75em 0.5em 0.5em 0.5em;
  background-color: #000700;
  background-image: -moz-radial-gradient(circle, #6d7a9c 35%, transparent 45%);
  background-image: -webkit-radial-gradient(circle, #6d7a9c 35%, transparent 45%);
  color: #feffff;
  line-height: 1em;
  text-align: center;
  text-shadow: 1px 1px 1px black;
}

.buffy .title {
  font-family: "Buffied", fantasy;
  font-size: 200%;  
}

.buffy .subtitle {
  display: block;
  font-family: "Slayer", sans-serif;
  font-size: 50%;
  font-variant: small-caps;
}

@font-face {
  font-family: "Arno Pro Caption";
  src: local("Arno Pro Caption"), url(/styles/fonts/arnopro-caption.otf);
}

.castle {
  font-family: "Arno Pro Caption", serif;
  font-size: 120%;
  text-transform: uppercase;
}

@font-face {
  font-family: "KopyKattKut Bold";
  src: local("KopyKattKut Bold"), url(/styles/fonts/KopyKattKut-Bold.otf);
}

.charmed {
  font-family: "KopyKattKut Bold", serif;
  font-size: 115%;
  /*letter-spacing: -0.125em;*/
  text-transform: uppercase;
}

.charmed .c {
  /* font-size: 150%; */
}

.charmed span {  
  /* vertical-align: middle; */
}

@font-face {
  font-family: "Coolvetica";
  src: local("Coolvetica"), url(/styles/fonts/coolvetica.ttf);
}

.columbo {
  padding: 0 0.25em;
  background-color: #273d50;
  color: #fde06c;
  font-family: "Coolvetica", sans-serif;
  font-size: 130%;
  letter-spacing: 0.0625em;
  text-transform: uppercase;
  text-shadow: 2px 2px 1px black;
}

@font-face {
  font-family: "ITC Serif Gothic LT Bold";
  src: url(/styles/fonts/itc_serif_gothic--lte50299.ttf);
}

@font-face {
  font-family: "ITC Serif Gothic LT Heavy";
  src: url(/styles/fonts/itc_serif_gothic--lte50301.ttf);
}

.countdown-x {
  display: inline-block;
  font-family: "ITC Serif Gothic LT Heavy", sans-serif;
  line-height: 0.9em;
  text-align: center;
  text-shadow: 1px 1px #999;
}

.countdown-x .title:before {
  content: "\2013\00A0";
}

.countdown-x .subtitle {
  display: block;
  font-family: "ITC Serif Gothic LT Bold", sans-serif;
}

.dead-zone {
  font-family: serif;
  text-transform: uppercase;
}

@font-face {
  font-family: "Doctor Who";
  src: local("Matt Smith Doctor Who"), url(/styles/fonts/matt_smith_doctor_who.ttf);
}

.doctor-who {
  position: relative;
  color: #386688;
  font-family: "Doctor Who", serif;
  font-size: 250%;
  text-transform: uppercase;
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
}

.doctor-who .gradient {
  position: absolute;
  left: 0;
  top: 0;
  -webkit-mask-image:
    -webkit-radial-gradient(0.15em 0.125em, 15% 50%, rgba(0, 0, 0, 0.4) 10%, rgba(0, 0, 0, 1));
  z-index: 2;
}

.doctor-who .gradient2 {
  -webkit-mask-image:
    -webkit-radial-gradient(1.2em 0.125em, 15% 50%, rgba(0, 0, 0, 0.2) 15%, rgba(0, 0, 0, 1));
}

.doctor-who .gradient3 {
  -webkit-mask-image:
    -webkit-radial-gradient(2.4em 0.25em, 15% 50%, rgba(0, 0, 0, 0.2) 15%, rgba(0, 0, 0, 1));
}

.doctor-who:after {
  content: "Doctor Who";
  color: #f7f9fb;
}

@font-face {
  font-family: "a_Futura Orto";
  src: local("Futura Orto"), url(/styles/fonts/a_futuraorto.ttf);
}

@font-face {
  font-family: "a_Futura Orto Bold";
  src: local("Futura Orto Bold"), url(/styles/fonts/a_futuraorto_bold.ttf);
}

.efc {
  position: relative;
  display: inline-block;
  background-color: #000;
  background-image:
    /* Terra */
    -moz-radial-gradient(28.6541% -128%, circle, black 67%, #1C1F1C 71%, #394138 72.5%, transparent 73%),
   
    /* Sol */
    -moz-radial-gradient(56.729378% 52.895753%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);
  background-image:
    /* Terra */
    -webkit-radial-gradient(28.654124% -155%, circle, black 67%, #1c1f1c 71%, #394138 72.5%, transparent 73%),
   
    /* Sol */
    -webkit-radial-gradient(55.137482% 42.084942%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);
  color: #eeeeec;
  font-family: "a_Futura Orto Bold", sans-serif;
  line-height: 1em;
  text-align: center;
  text-transform: uppercase;
}

.efc .glare {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: -webkit-radial-gradient(56% 43%, 50% 8%, #fafdfa 14%, rgb(249, 198, 153) 15%, rgba(249, 198, 153, 0) 30%);
  -webkit-transform: rotate(-11.5deg);
}

.efc:after {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  content: "";
  background-image:
    -moz-radial-gradient(55.137482% 42.084942%,
      rgba(255, 255, 255, 0.2) 18%,
      rgba(255, 255, 255, 0.04));
  background-image:
    -webkit-radial-gradient(55.137482% 42.084942%, rgba(255, 255, 255, 0.2) 18%, rgba(255, 255, 255, 0.04));
}

.efc .gr {
  display: block;
  margin-top: 1em;  
  margin-bottom: 2.5em;
  font-family: "a_Futura Orto", sans-serif;
  font-size: 50%;
}

.efc .earth {
  position: relative;
  display: block;
  padding: 0 0 0 0.35em;
  font-size: x-large;
  letter-spacing: 0.35em;
  color: #efd065;
  line-height: 1em;
  text-shadow: 0 0 1px rgba(0, 0, 0, 0.75);
}

.earth .gradient {
  position: absolute;
  padding: 0 0 0 0.35em;
  left: 0;
  top: 0;
  -webkit-mask-image: -webkit-linear-gradient(
    rgba(255, 255, 255, 1), rgba(243, 205, 98, 0.5) 50%, rgba(0, 0, 0, 0));
  z-index: 2;
}

.efc .earth:after {
  content: "Earth";
  color: #9b411a;
}

@font-face {
  font-family: "Troglodyte";
  src: local("Troglodyte"), url(/styles/fonts/TROGLO__.ttf);
}

.efc .fc {
  position: relative;
  top: -0.5em;
  display: block;
  color: #ac493d;
  font-family: "Troglodyte", sans-serif;
  font-size: 71%;
  line-height: normal;
  text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
}

@font-face {
  font-family: "Interstate";
  src: local("Interstate"), url(/styles/fonts/interstate_ultra-black_condensed.ttf);
}

.eureka {
  position: relative;
  padding: 0.25em 0.5em 0.125em 0.5em;
  font-family: "Interstate", sans-serif;
  font-size: 130%;
  background-color: #8de5f9;
  background-image: -moz-radial-gradient(bottom, ellipse,
    #f4fff7 20%, #8de5f9, #285e8d);
  background-image: -webkit-radial-gradient(bottom, 100% 125%,
    #f4fff7 20%, #8de5f9, #285e8d);
  color: rgb(251, 254, 247);
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 -1px rgb(77, 148, 168), 1px 0 1px rgb(168, 217, 231),
    1px -1px rgb(77, 148, 168);
  text-shadow: 0 -1px rgba(77, 148, 168, 0.9), 1px 0 1px rgba(168, 217, 231, 0.9),
    1px -1px rgba(77, 148, 168, 0.9);
}

.eureka .gradient {
  display: inline-block;
  -webkit-transform: matrix(1, 0, 0, 0.9, 0, 0);
/*
  position: absolute;
  padding: 0.25em 0.5em 0.125em 0.5em;
  left: 0;
  top: 0;
  -webkit-mask-image: -webkit-linear-gradient(
    rgba(0, 0, 0, 1) 30%, transparent 55%, rgba(0, 0, 0, 1) 80%);
  z-index: 2;
*/
}
/*
.eureka:after {
  content: "EUReKA";
  color: red;
}
*/

.eureka .eur {
  text-transform: uppercase;
}

.eureka .e {
  display: inline-block;
  position: relative;
  bottom: 0.25em;
  text-shadow: 0 1px 1px rgb(168, 217, 231), 0 1px rgb(77, 148, 168);
  text-shadow: 0 1px 1px rgba(168, 217, 231, 0.9), 0 1px rgba(77, 148, 168, 0.9);
  <?php
    $matrix = 'matrix(1, 0, 0, 0.9, 0, 0)';
    $transforms3d = 'perspective(50px) rotateX(45deg)';
  ?>
  -moz-transform: <?php echo $matrix; ?>;
  -moz-transform: <?php echo $transforms3d; ?>;
  -o-transform: <?php echo $matrix; ?>;
  -ms-transform: <?php echo $matrix; ?>;
  -webkit-transform: <?php echo $transforms3d; ?>;
  transform: <?php echo $transforms3d; ?>;
}

.eureka .ka {
  text-shadow: -1px 0 1px rgb(168, 217, 231), -1px -1px rgb(77, 148, 168),
    0 -1px rgb(77, 148, 168);
  text-shadow: -1px 0 1px rgba(168, 217, 231, 0.9), -1px -1px rgba(77, 148, 168, 0.9),
    0 -1px rgba(77, 148, 168, 0.9);  
  text-transform: uppercase;
}

@font-face {
  font-family: "Middleton";
  src: url(/styles/fonts/middleto.ttf);
}

.frasier {
  font-family: "Middleton", sans-serif;
  font-size: 120%;
  text-transform: uppercase;
}

.frasier span {
  font-size: 75%;
}

@font-face {
  font-family: "Century Gothic";
  src: local("Century Gothic"), url(/styles/fonts/Century_Gothic.TTF);
}

<?php
  $fringe_color = '#101811';
  $fringe_shadow = '#5b6e65';
?>

.fringe {
  display: inline-block;
  padding: 0.125em 0.5em 0.125em 0.5em;
  background-color: #000;
  background-image: -moz-radial-gradient(center, #D6DBD3 4%, #7d9b9d 60%, black);
  background-image: -webkit-radial-gradient(center, 67% 67%, #D6DBD3 4%, #7d9b9d 60%, black);
  color: <?php echo $fringe_color; ?>;
  font-family: "Century Gothic", sans-serif;
  font-weight: bolder;
  font-size: 140%;
  text-transform: uppercase;
}

.fringe .gradient {
  display: inline-block;
  /*
  -webkit-mask-image: -webkit-radial-gradient(center, 150% 150%,
    rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.125));
  */
  <?php $transforms3d = 'perspective(50px) rotateX(4.43deg)'; ?>
  -moz-transform: <?php echo $transforms3d; ?>;
  -webkit-transform: <?php echo $transforms3d; ?>;
  transform: <?php echo $transforms3d; ?>;
}

.fringe .f {
  display: inline-block;

  /*-webkit-transform: matrix(1, 0, -0.06, 1, 0, 0);*/
  text-shadow:
     0.5px   0.25px <?php echo $fringe_shadow; ?>,
     0.75px  0.5px  <?php echo $fringe_shadow; ?>,
     1.25px  0.75px <?php echo $fringe_shadow; ?>,
     1.5px   1.25px <?php echo $fringe_shadow; ?>,
     1.75px  1.5px  <?php echo $fringe_shadow; ?>,
     2px     1.75px <?php echo $fringe_shadow; ?>,
     2.25px     2px <?php echo $fringe_shadow; ?>;
 
  /* text-shadow: 1px 0.75px 2px #5b6e65, 1px 1.75px 0px #758278; */
  /* shadow-pos: y = -0.83909963 * x */
/*
  text-shadow: 0.5px 0.25px #111910, 0.75px 0.5px #111910,
    1.25px 0.75px #111910, 1.5px 1.25px #111910, 1.75px 1.5px #111910,
    1.75px 1.5px #111910, 2.25px 1.75px #111910;
 */    
}


.fringe .r {
  display: inline-block;
  /*-webkit-transform: matrix(1, 0, -0.04, 1, 0, 0);*/
  /*
  text-shadow:
     0.25px   0.25px <?php echo $fringe_shadow; ?>,
     0.5px  0.5px  <?php echo $fringe_shadow; ?>,
     1px  0.75px <?php echo $fringe_shadow; ?>,
     1.25px   1.25px <?php echo $fringe_shadow; ?>,
     1.5px  1.5px  <?php echo $fringe_shadow; ?>,
     1.75px     1.75px <?php echo $fringe_shadow; ?>,
     2px     2px <?php echo $fringe_shadow; ?>;
  */
  /* Same shadow as .f */
  text-shadow:
     0.5px   0.25px <?php echo $fringe_shadow; ?>,
     0.75px  0.5px  <?php echo $fringe_shadow; ?>,
     1.25px  0.75px <?php echo $fringe_shadow; ?>,
     1.5px   1.25px <?php echo $fringe_shadow; ?>,
     1.75px  1.5px  <?php echo $fringe_shadow; ?>,
     2px     1.75px <?php echo $fringe_shadow; ?>,
     2.25px     2px <?php echo $fringe_shadow; ?>;
}

.fringe .i {
  display: inline-block;
  /* -webkit-transform: matrix(1, 0, -0.02, 1, 0, 0); */
  /*
  text-shadow:
     0   0.25px <?php echo $fringe_shadow; ?>,
     0.5px  0.5px  <?php echo $fringe_shadow; ?>,
     0.75px  0.75px <?php echo $fringe_shadow; ?>,
     1px   1.25px <?php echo $fringe_shadow; ?>,
     1.25px  1.5px  <?php echo $fringe_shadow; ?>,
     1.5px     1.75px <?php echo $fringe_shadow; ?>,
     1.75px     2px <?php echo $fringe_shadow; ?>;
   */
  /* Same shadow as .f */
  text-shadow:
     0.5px   0.25px <?php echo $fringe_shadow; ?>,
     0.75px  0.5px  <?php echo $fringe_shadow; ?>,
     1.25px  0.75px <?php echo $fringe_shadow; ?>,
     1.5px   1.25px <?php echo $fringe_shadow; ?>,
     1.75px  1.5px  <?php echo $fringe_shadow; ?>,
     2px     1.75px <?php echo $fringe_shadow; ?>,
     2.25px     2px <?php echo $fringe_shadow; ?>;
}

.fringe .n {
  display: inline-block;
  /*- webkit-transform: matrix(1, 0, -0.01, 1, 0, 0); */
  text-shadow:
    0   0.25px <?php echo $fringe_shadow; ?>,
    0  0.5px  <?php echo $fringe_shadow; ?>,
    0  0.75px <?php echo $fringe_shadow; ?>,
    0   1.25px <?php echo $fringe_shadow; ?>,
    0  1.5px  <?php echo $fringe_shadow; ?>,
    0     1.75px <?php echo $fringe_shadow; ?>,
    0     2px <?php echo $fringe_shadow; ?>;
}

.fringe .g {
  display: inline-block;
  /* -webkit-transform: matrix(1, 0, 0.01, 1, 0, 0); */
  /* text-shadow:
    0   0.25px <?php echo $fringe_shadow; ?>,
     -0.5px  0.5px  <?php echo $fringe_shadow; ?>,
     -0.75px  0.75px <?php echo $fringe_shadow; ?>,
     -1px   1.25px <?php echo $fringe_shadow; ?>,
     -1.25px  1.5px  <?php echo $fringe_shadow; ?>,
     -1.5px     1.75px <?php echo $fringe_shadow; ?>,
     -1.75px     2px <?php echo $fringe_shadow; ?>; */
  /* Same shadow as .e */
  text-shadow:
    -0.25px   0.25px <?php echo $fringe_shadow; ?>,
    -0.5px  0.5px  <?php echo $fringe_shadow; ?>,
    -1px  0.75px <?php echo $fringe_shadow; ?>,
    -1.25px   1.25px <?php echo $fringe_shadow; ?>,
    -1.5px  1.5px  <?php echo $fringe_shadow; ?>,
    -1.75px     1.75px <?php echo $fringe_shadow; ?>;
    -2px     2px <?php echo $fringe_shadow; ?>;
}

.fringe .e {
  display: inline-block;
  /* -webkit-transform: matrix(1, 0, 0.02, 1, 0, 0); */
  text-shadow:
    -0.25px   0.25px <?php echo $fringe_shadow; ?>,
    -0.5px  0.5px  <?php echo $fringe_shadow; ?>,
    -1px  0.75px <?php echo $fringe_shadow; ?>,
    -1.25px   1.25px <?php echo $fringe_shadow; ?>,
    -1.5px  1.5px  <?php echo $fringe_shadow; ?>,
    -1.75px     1.75px <?php echo $fringe_shadow; ?>;
    -2px     2px <?php echo $fringe_shadow; ?>;
}

@font-face {
  font-family: "Futurama Title";
  src: local("Futurama Title"), url(/styles/fonts/futurama-title.ttf);
}

.futurama {
  display: block;
  padding-top: 0.5em;
  font-family: "Futurama Title", serif;
  text-transform: uppercase;
  line-height: 1em;
  -webkit-transform: translateX(-0.67em);
}

.futurama span {
  display: inline-block;
   line-height: 1em;
}

.futurama .f {
  -webkit-transform: rotate(-36deg) translateY(0.125em);
}

.futurama .u {
  -webkit-transform: rotate(-25.7deg) translateX(0.25em) translateY(-0.25em);
}

.futurama .t {
  -webkit-transform: rotate(-15.4deg) translateX(0.33em) translateY(-0.625em);
}

.futurama .u2 {
  -webkit-transform: rotate(-5.1deg) translateX(0.4em) translateY(-0.825em);
}

.futurama .r {
  -webkit-transform: rotate(5.1deg) translateX(0.45em) translateY(-0.95em);
}

.futurama .a {
  -webkit-transform: rotate(15.4deg) translateX(0.5em) translateY(-0.9em);
}

.futurama .m {
  -webkit-transform: rotate(25.7deg) translateX(0.55em) translateY(-0.7em);
}

.futurama .a2 {
  -webkit-transform: rotate(36deg) translateX(0.67em) translateY(-0.4em);
}

@font-face {
  font-family: "ITC Avant Garde Gothic Medium";
  src: local("ITC Avant Garde Gothic Medium"), local("ITC Avant Garde Gothic"),
    url(/styles/fonts/itc_avant_garde_gothic--lte52011.ttf);
}

.glee {
  padding: 0.125em 0.5em;
  /* background-image: -moz-radial-gradient(#FFEA8C, #FFD727);
  background-image: -webkit-radial-gradient(#FFEA8C, #FFD727);
  background-color: #FFD727; */
  background-color: #000;
  color: #fff;
  font-family: "ITC Avant Garde Gothic Medium", sans-serif;
  font-size: 120%;
  text-transform: lowercase;
  letter-spacing: -0.0625em;
}

.glee .lee {
  letter-spacing: -0.125em;
}

@font-face {
  font-family: "SKM Avant Garde Two";
  src: local("SKM Avant Garde Two"), url(/styles/fonts/SKM%20Avant%20Garde%20Two.ttf);
}

.heroes {
  position: relative;
  padding: 0.25em 0.75em 0.125em 0.75em;
  background-color: black;
  color: #fff;
  font-family: "SKM Avant Garde Two", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.5em;
}

.heroes .o {
  position: relative;
  color: #ffffed;
  padding: 0.25em 0.125em;
}

.heroes .o:after {
  position: absolute;
  left: -0.25em;
  top: 0;
  right: 0;
  bottom: 0;
  background-image:
    /* glare */
    -webkit-radial-gradient(48% 20%, circle, #ffffff 0%, #ffffff 7%,
      rgb(250, 226, 182) 8%, rgba(250, 226, 182, 0) 23%),
     
    /* moon */
    -webkit-radial-gradient(41% 50%, circle, black 35%, transparent 40%),
   
    /* corona */
    -webkit-radial-gradient(41% 50%, circle, #f5eccd 35%, transparent 50%),
   
    /* flares */
    -webkit-radial-gradient(44% 44%, circle, #ffffff 35%, transparent 55%);
   
  content: "";
}

.heroes .s {
  letter-spacing: normal;
}

@font-face {
  font-family: "House";
  src: local("House"), url(/styles/fonts/House.ttf);
}

.house {
  /* text-transform: uppercase; */
}

.house .h {
  font-family: House, sans-serif;
  /*
  display: inline-block;
  border: 1px solid black;
  width: 1em;
  height: 1em;
  line-height: 1em;
  text-align: center;
  margin-right: 0.125em;
  */
}

.house .ouse {
  font-family: House, sans-serif;
  /* text-decoration: underline; */
}

.house .md {
  position: relative;
  bottom: -0.4em;
  font-size: 0.6em;
}

.house .md-de {
  position: relative;
  font-size: 0.6em;
  text-decoration: underline;
}

@font-face {
  font-family: "MacEnvy DB";
  src: local("MacEnvy DB"), url(/styles/fonts/MacEnvy_DB-Regular.ttf);
}

.ijon-tichy {
  display: inline-block;
  padding: 0.25em 0.5em;
  background-color: #000;
  color: #B9B7BA;
  line-height: 1em;
  font-family: "MacEnvy DB", sans-serif;
  text-align: center;
  text-transform: uppercase;
}

.ijon-tichy .title {
  display: block;
  letter-spacing: 0.0625em;
}

.ijon-tichy .title .i {
  text-shadow: 1.5px 0.5px #59575A, 2px 0.75px #59575A;
}

.ijon-tichy .title .j {
  text-shadow: 1.5px 0.5px #59575A, 1.5px 0.75px #59575A;
}

.ijon-tichy .title .o {
  text-shadow: 1.5px 0.5px #59575A, 1px 0.75px #59575A;
}

.ijon-tichy .title .n {
  text-shadow: 1px 0.75px #59575A;
}

.ijon-tichy .title .t {
  text-shadow: 0 0.75px #59575A;
}

.ijon-tichy .title .i2 {
  text-shadow: -0.5px 0.75px #59575A;
}

.ijon-tichy .title .c {
  text-shadow: -1px 0.75px #59575A;
}

.ijon-tichy .title .h {
  text-shadow: -1.5px 0.75px #59575A, -1px 0.5px #59575A;
}

.ijon-tichy .title .y {
  text-shadow: -1.5px 0.75px #59575A, -1.5px 0.5px #59575A;
}

.ijon-tichy .subtitle {
  display: block;
  font-size: 67%;
  letter-spacing: 0.4em;
}

.ijon-tichy .subtitle .r {
  text-shadow: 1.5px 0.5px #59575A;
}

.ijon-tichy .subtitle .a {
  text-shadow: 1px 0.5px #59575A;
}

.ijon-tichy .subtitle .u {
  text-shadow: 0.5px 0.5px #59575A;
}

.ijon-tichy .subtitle .mpi {
  text-shadow: 0 0.5px #59575A;
}

.ijon-tichy .subtitle .l {
  text-shadow: -0.5px 0.5px #59575A;
}

.ijon-tichy .subtitle .o {
  text-shadow: -1px 0.5px #59575A;
}

.ijon-tichy .subtitle .t {
  text-shadow: -1.5px 0.5px #59575A;
}

.ijon-tichy .subtitle2 {
  display: block;
  font-size: 50%;
  line-height: 1em;
}

.ijon-tichy .subtitle2 .die {
  text-shadow: 1px 0.5px #59575A;
}

.ijon-tichy .subtitle2 .ster {
  text-shadow: 0.5px 0.5px #59575A;
}

.ijon-tichy .subtitle2 .ntag {
  text-shadow: 0 0.5px #59575A;
}

.ijon-tichy .subtitle2 .ebuec {
  text-shadow: -0.5px 0.5px #59575A;
}

.ijon-tichy .subtitle2 .her {
  text-shadow: -1px 0.5px #59575A;
}

@font-face {
  font-family: "Digital1";
  src: local("Transponder AOE"), url(/styles/fonts/digital/TRANA___.TTF);
}

.it-crowd {
  position: relative;
  padding: 0.125em 0.75em 0.125em 0.5em;
  background-color: black;
  color: #d4774b;
  font-family: "Digital1", monospace;
  font-size: 120%;
  text-transform: uppercase;
  text-shadow: 0 0 1px #d4774b;
}

.it-crowd:after {
  position: absolute;
  top: 0;
  content: "\258E";
  letter-spacing: 0;
}

.life-on-mars {
  display: inline-block;
  padding: 0.25em 0.5em;
  background-color: #000;
  background-image:
    -webkit-linear-gradient(left,
        rgba(255, 255, 255, 0) 35%,
        rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 1) 36%,
        rgba(255, 255, 255, 0) 38%),
        -webkit-linear-gradient(top,
                rgba(255, 255, 255, 0) 81%,
                rgba(255, 255, 255, 1) 81%, rgba(255, 255, 255, 1) 89%,
                rgba(255, 255, 255, 0) 89%);
  color: #fff;
  text-shadow: 0 0 0.5px #fff;
  text-transform: uppercase;
  -webkit-text-fill-color: transparent;
}

.life-on-mars .e {
  letter-spacing: 0.5em;
}
 
.life-on-mars .on {
  text-shadow: 0 0 1px #fff;
}

.life-on-mars .mars {
  text-shadow: 0 0 2px #fff;
}

.macgyver {
  padding: 0.125em 0.5em;
  background-color: #080a09;
  color: #bb1e15;
  font-family: "Copperplate Gothic Bold", serif;
  font-size: 150%;
  font-variant: small-caps;
  font-weight: bold;
  <?php
    $darkred = '#9f1512';
    $gold = '#d9ad7e';
  ?>
  text-shadow:
    -0.5px -0.5px <?php echo $darkred; ?>,
     0px   -0.5px <?php echo $darkred; ?>,
     0.5px -0.5px <?php echo $darkred; ?>,
    -0.5px  0px   <?php echo $darkred; ?>,
     0.5px  0px   <?php echo $darkred; ?>,
    -0.5px  0.5px <?php echo $darkred; ?>,
     0px    0.5px <?php echo $darkred; ?>,
     0.5px  0.5px <?php echo $darkred; ?>,
    -1px   -1px  1px <?php echo $gold; ?>,
     0px   -1px  1px <?php echo $gold; ?>,
     1px   -1px  1px <?php echo $gold; ?>,
    -1px    0px  1px <?php echo $gold; ?>,
     1px    0px  1px <?php echo $gold; ?>,
    -1px    1px  1px <?php echo $gold; ?>,
     0px    1px  1px <?php echo $gold; ?>,
     1px    1px  1px <?php echo $gold; ?>;
}

@font-face {
  font-family: "Gill Sans Ultra Bold";
  src: local("Gill Sans Ultra Bold"), url(/styles/fonts/gilsanu0.TTF);
}

.monk {
  color: #d1122a;
  font-family: "Gill Sans Ultra Bold", sans-serif;
  font-size: 110%;
  text-transform: uppercase;
  text-shadow: 1px 1px 1px black;
}

@font-face {
  font-family: "Swiss 721 Black Extended BT";
  src: local("Swiss 721 Black Extended BT"), url(/styles/fonts/swiss721_bke.TTF);
}

.moonlight {
  padding: 0.125em 0.5em;
  background-color: black;
  color: #020109;
  font-family: "Swiss 721 Black Extended BT", sans-serif;
  text-transform: uppercase;
  background-image: -moz-radial-gradient(24% 50%, circle,
    rgba(224, 211, 106, 1) 33%, rgba(224, 211, 106, 0) 36%, #100d04);
  background-image: -webkit-radial-gradient(24% 50%, circle,
    rgba(224, 211, 106, 1) 33%, rgba(224, 211, 106, 0) 36%, #100d04);
}

.moonlight .moon {
  -webkit-mask-image: -webkit-linear-gradient(-80deg, rgba(0,0,0,0.33), rgba(0,0,0,1) 67%);
  letter-spacing: -0.0625em;
}

.moonlight .moon .n {
  letter-spacing: 0.125em;
}

.moonlight .light {
  color: #ebf062;
  text-shadow: 1px 1px 2px #070400;
}

@font-face {
  font-family: "Terminator";
  src: url(/styles/fonts/TERMINAT.TTF);
}

.mutant-x {
  position: relative;
  padding: 0.25em 0.5em 0.125em 0.5em;
  background-color: black;
  color: #8f6442;
  font-family: "Terminator", sans-serif;
  font-size: 105%;
  text-transform: uppercase;
  white-space: nowrap;
  -webkit-text-stroke: 0.5px rgba(255, 255, 255, 0.1);
}

.mutant-x .gradient {
  position: absolute;
  padding: 0.25em 0.5em 0.125em 0.5em;
  left: 0;
  top: 0;
  -webkit-mask-image: -webkit-linear-gradient(
    rgba(0, 0, 0, 1) 30%, transparent 55%, rgba(0, 0, 0, 1) 80%);
  z-index: 2;
}

.mutant-x:after {
  content: "Mutant X";
  color: #fcf1eb;
}

@font-face {
  font-family: "Walkway SemiBold";
  src: local("Walkway SemiBold"), url(/styles/fonts/Walkway_SemiBold.ttf);
}
 
.numb3rs {
  position: relative;
  padding: 0.25em 0.5em 0.125em 0.5em;
  background-color: #000200;
  /*
  background-image:
    -webkit-repeating-linear-gradient(left, transparent, transparent 9px,
      rgba(244, 247, 244, 0.5) 10px, rgba(244, 247, 244, 0.5) 10px),
    -webkit-repeating-linear-gradient(top, transparent, transparent 4px,
      rgba(244, 247, 244, 0.5) 5px, rgba(244, 247, 244, 0.5) 5px);
  */
  color: #f4f7f4;
  font-family: "Walkway SemiBold", Helvetica, sans-serif;
  font-size: 116%;
  font-weight: lighter;
  letter-spacing: 1px;
  text-shadow: 0 0 2px #f4f7f4;
  text-transform: uppercase;
}

.numb3rs .s {
  letter-spacing: normal;
}

/*  
.numb3rs .gradient {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0.25em 0.5em 0.125em 0.5em;
  color: #f4f7f4;
  -webkit-mask-image: -webkit-linear-gradient(rgba(0, 0, 0, 1), transparent 75%);
  z-index: 2;
}

.numb3rs:after {
  content: "Numb3rs";
  color: #898b88;
  text-transform: uppercase;
} */

@font-face {
  font-family: "Unconform Round";
  src: local("Unconform Round"), url(/styles/fonts/UNCON___.TTF);
}

.odyssey5 {
  padding: 0.5em 0.5em 0.125em 0.5em;
  background-color: #000;
  color: #d1550b;
  font-family: "Unconform Round", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.125em;
}

.odyssey5 .s2 {
  letter-spacing: 0.25em;
}

.odyssey5 .e {
  letter-spacing: 0.5em;
}

.odyssey5 .y2 {
  letter-spacing: 0.5em;
}

.odyssey5 .five {
  letter-spacing: normal;
}

@font-face {
  font-family: "Dateline Bold";
  src: local("Dateline Bold"), url(/styles/fonts/DatelineBold.ttf);
}
 
.psych {
  font-family: "Dateline Bold", serif;
  font-size: 110%;
  letter-spacing: -0.125em;
  color: #749f27;
}
 
@font-face {
  font-family: "Swiss Cheesed";
  src: local("SwissCheese"), url(/styles/fonts/SwissCheesed.ttf);
}

.quantum-leap {
  position: relative;
  display: inline-block;
  left: 0;
  top: 0;
  padding: 0.5em 0.5em 0.25em 0.5em;
  background-color: black;
  <?php
    $ql_shine = '#6f98e5';
    $ql_glow = '#5598ff';
    $ql_glow_range = '8px';
  ?>
  color: <?php echo $ql_glow; ?>;
  font-family: "Swiss Cheesed", sans-serif;
  font-size: 110%;
  letter-spacing: 0.0625em;
  text-transform: uppercase;
  text-align: center;
  text-shadow:
    -1px -1px <?php echo $ql_shine; ?>,
     0   -1px <?php echo $ql_shine; ?>,
     1px -1px <?php echo $ql_shine; ?>,
    -1px  0px <?php echo $ql_shine; ?>,
     0    0px <?php echo $ql_shine; ?>,
     1px  0px <?php echo $ql_shine; ?>,
    -1px  1px <?php echo $ql_shine; ?>,
     0    1px <?php echo $ql_shine; ?>,
     1px  1px <?php echo $ql_shine; ?>,
    -1px -1px <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
     0   -1px <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
     1px -1px <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
    -1px  0   <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
     0    0   <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
     1px  0   <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
    -1px  1px <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
     0    1px <?php echo $ql_glow_range . ' ' . $ql_glow; ?>,
     1px  1px <?php echo $ql_glow_range . ' ' . $ql_glow; ?>;
}

.quantum-leap .gradient {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0.5em 0.5em 0.25em 0.5em;
  color: #000;
  -webkit-text-fill-color: <?php echo $ql_glow; ?>;
  -webkit-mask-image: -webkit-linear-gradient(rgba(0, 0, 0, 1), transparent 33%);
  z-index: 2;
}
.quantum-leap:after {
  content: "Quantum Leap";
  color: #000;
}

@font-face {
  font-family: "Spleeny Decaf GD";
  src: local("Spleeny Decaf GD"), url(/styles/fonts/Spleeny%20Decaf%20GD.ttf);
}

.reaper {
  font-family: "Spleeny Decaf GD", fantasy;
  text-transform: uppercase;
}

@font-face {
  font-family: "Roswell";
  src: local("Roswell"), url(/styles/fonts/Roswell.TTF);
}

.roswell {
  display: inline-block;
  padding: 0.25em 0.5em 0.125em 0.5em;
  background-color: #000;
  background-image: -moz-linear-gradient(left, #6f3811, #000);
  background-image: -o-linear-gradient(left, #6f3811, #000);
  background-image: -webkit-linear-gradient(left, #6f3811, #000);
  background-image: linear-gradient(left, #6f3811, #000);
  color: #ffffbc;
  font-family: "Roswell", sans-serif;
  letter-spacing: 0.25em;
  <?php $roswell_red = '138, 8, 0'; ?>
  text-shadow:
    -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),
    -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),
    -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);
  text-transform: uppercase;
  -webkit-text-stroke: 0.25px rgba(<?php echo $roswell_red; ?>, 0.75);
}

.roswell span {
  letter-spacing: normal;
}

.samantha-who {
  display: inline-block;
  padding: 0.125em 0.25em 0.125em 0.25em;
  background-color: #000;
  color: #e3e5e2;
  line-height: 1em;
}

.samantha-who .text {
  display: inline-block;
}

.samantha-who .samantha {
  display: block;
  position: relative;
  padding-top: 0.25em;
  padding-left: 0.25em;
  font-family: "a_Futura Orto", sans-serif;
  text-transform: uppercase;
}

.samantha-who .samantha::after {
  position: absolute;
  left: -0.2em;
  top: -1.05em;
  right: 0.2em;
  bottom: 1.05em;
  background-image: -webkit-radial-gradient(10% 15%, 20% 20%, transparent 15%, #d29c13 26%, #d29c13 34%, transparent 45%);
  content: "";
  -webkit-transform: rotate(-27deg);
  /*border: 1px solid red;*/
}

.samantha-who .who,
.samantha-who .q {
  color: #e81b04;
}
 
.samantha-who .who {
  display: block;
  font-weight: bold;
  line-height: 0.75em;
}

.samantha-who .q {
  font-family: cursive;
  font-size: 200%;
  font-weight: lighter;
}

@font-face {
  font-family: "Scrubs";
  src: local("TSS Scrubs Logo"), url(/styles/fonts/tsslogo.ttf);
}

.scrubs:before {
  content: "[";
}

.scrubs {
  padding: 0.125em 0.25em 0 0.25em;
  background-color: #15121a;
  color: #d0f9fb;
  font-family: "Scrubs", sans-serif;
  font-size: 150%;
  text-shadow: 0 0 10px #d0f9fb;
}

.scrubs .s {
  text-transform: uppercase;
}

.scrubs:after {
  content: "]";
}

@font-face {
  font-family: "seaQuest";
  src: local("Seaquest"), url(/styles/fonts/SQDSV.TTF);
}

.seaQuest {
  position: relative;
  display: inline-block;
  padding-top: 1.5em;
  background-color: #00001e;
<?php
  // error_reporting(E_ALL | E_STRICT);
  $lambda = 1;
  for ($i = 0; $i < 200; ++$i)
  {
    $x = mt_rand(1, 99);
    /*
     * Decreasing probability of pixels near bottom through exponential distribution;
     * TODO: If coord > 50%, decrease probability of appearance.
     */
    $y = mt_rand(1, $lambda * exp(-$lambda * mt_rand(0, 5)) * 99);
    $coords[] = array('x' => $x, 'y' => $y);
  }
 
  $dots = array_map(function ($coord) {
    return "-webkit-radial-gradient({$coord['x']}% {$coord['y']}%, 1px 1px, rgba(255, 255, 255, 0.75), rgba(0, 0, 30, 0))";
  }, $coords);
  $gold = '#ffc50c';
?>
  /* water bubbles */
  background-image: <?php echo implode(",\n    ", $dots); ?>,
    /* sunlight */
    -webkit-radial-gradient(50% 0%, 50% 200%, #00438c, rgba(0, 0, 31, 0)),
    /* water */
    -webkit-linear-gradient(#030129, #00000c);
  color: <?php echo $gold; ?>;
  font-family: "seaQuest", sans-serif;
  font-size: 92%;
}

.seaQuest #seaQuest {
  display: block;
  padding: 0 0.25em;
  text-transform: uppercase;
  line-height: 1;
}

.seaQuest #seaQuest .s {
  text-shadow:
    0.5px -0.25px 0.5px #f5bd46,
    1px   -0.5px  0.5px #cd8d1f,
    1.5px -0.75px 0.5px #b37b1c,
    2px   -1px    0.5px #805b17,
    2.5px -1.25px 0.5px #2e2000,
    3px   -1.5px  0.5px #040400,
    3.5px -1.75px       #000508;
}

.seaQuest #seaQuest .e {
  text-shadow:
    0.5px -0.25px 0.5px #f5bd46,
    1px   -0.5px  0.5px #cd8d1f,
    1.5px -0.75px 0.5px #b37b1c,
    2px   -1px    0.5px #805b17,
    2.5px -1.25px 0.5px #2e2000,
    3px   -1.5px        #040400;
}

.seaQuest #seaQuest .a {
  text-shadow:
    0.5px -0.25px 0.5px #fdb207,
    1px   -0.5px  0.5px #eb950e,
    1.5px -0.75px 0.5px #ae5900,
    2px   -1px    0.5px #642a00,
    2.5px -1.25px       #261704;
}

.seaQuest #seaQuest .q {
  position: relative;
  visibility: hidden;
  display: inline-block;
  margin-right: 0.5em;
  text-shadow: none;
}

.seaQuest #seaQuest .q:after {
  position: absolute;
  visibility: visible;
  margin-right: 0.125em;
  left: 0;
  top: -0.5em;
  right: 0;
  bottom: 0;
  content: "{";
  text-align: center;
  text-shadow:
    0.5px -0.25px 0.5px #ffb43b,
    1px   -0.5px  0.5px #e28d23,
    1.5px -0.75px 0.5px #853400,
    2px   -1px          #510600;
}

.seaQuest #seaQuest .u {
  text-shadow:
    0.5px -0.25px 0.5px #f7c35d,
    1px   -0.5px  0.5px #a36729,
    1.5px -0.75px 0.5px #3c0800,
    2px   -1px          #1b011c;
}

.seaQuest #seaQuest .e2 {
  text-shadow:
     0.5px -0.25px 0.5px #d8ab56,
     1px   -0.5px  0.5px #5c3605;
}

.seaQuest #seaQuest .s2 {
  text-shadow:
    0px    -0.25px 0.5px #d8ab56,
    -0.5px -0.5px  0.5px #5c3605,
    -1px   -0.75px       #200d00,
     0.5px -0.25px       #200d00;
}

.seaQuest #seaQuest .t {
  text-shadow:
     0.5px -0.25px       #e9bf73,
    -0.5px -0.25px 0.5px #d8ab56,
    -1px   -0.5px  0.5px #5c3605,
    -1.5px -0.75px       #200d00,
     0.5px -0.25px       #200d00;
}

.seaQuest #dsv {
  position: relative;
  visibility: hidden;
  display: block;
  margin-top: 0.5em;
  padding-bottom: 0.25em;
  line-height: 1;
}

.seaQuest #dsv:after {
  position: absolute;
  visibility: visible;
  left: -0.75em;
  top: 0;
  right: 0;
  bottom: 0;
  content: "|";
  text-align: center;
  text-shadow:
    0.5px -0.25px 0.5px #ffb43b,
    1px   -0.5px  0.5px #e28d23,
    1.5px -0.75px 0.5px #853400,
    2px   -1px          #510600;
}

@font-face {
  font-family: "London Tube";
  src: local("P22 Johnston Underground"), url(/styles/fonts/p22-johnston-underground.ttf);
}

.sherlock {
  font-family: "London Tube", sans-serif;
  font-size: 120%;
  text-transform: uppercase;
}

@font-face {
  font-family: "Simpsonfont";
  src: local("Simpsonfont"), url(/styles/fonts/Simpsonfont.ttf);
}

@font-face {
  font-family: "Akbar";
  src: local("Akbar"), url(/styles/fonts/akbar.ttf);
}

.simpsons {
  position: relative;
  display: inline-block;
  min-width: 6em;
  min-height: 2em;
  padding: 0.125em 0.25em;
  background-color: #6598DC;
  color: #FFD166;
  font-family: "Akbar", sans-serif;
  text-align: center;
  text-transform: uppercase;
  overflow: hidden;
}

@-webkit-keyframes zoom-in {
  0% {
    opacity: 0;
    -webkit-transform: perspective(100px) translateX(0) translateY(0) translateZ(-400px);
  }

  20% {
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(100px) translateX(5px) translateY(-4px) translateZ(100px);
  }
}

.simpsons span {
  position: relative;
  display: block;
}

.simpsons:hover span.text {
  -webkit-animation-name: zoom-in;
  /* -webkit-animation-iteration-count: infinite; */
  -webkit-animation-duration: 3s;  
}

@font-face {
  font-family: "Smallville";
  src: local("Smallville"), url(/styles/fonts/Smallville1.ttf);
}

.smallville {
  font-family: "Smallville", sans-serif;
  font-size: 160%;
  text-transform: uppercase;
  color: #FE1318;
}

/* Symmetric "Superman" effect */
.smallville span {
  position: relative;
  top: -0.1em;
  font-size: 90%;
}
 
@font-face {
  font-family: "Stargate";
  src: local("Stargate"), url(/styles/fonts/STARGATE.TTF);
}

.stargate {
  display: inline-block;
  font-family: "Stargate", serif;
  font-size: 122%;
  text-align: center;
  text-transform: uppercase;
}

.stargate > span {
  display: block;
}

.stargate.en {
  letter-spacing: 0.125em;
}

.stargate.en span span:last-child {
  letter-spacing: normal;
}

.stargate.en > span:first-child {
  padding-bottom: 0;
  border-bottom: 1px solid black;
}

.stargate.en > span:last-child {
  padding-top: 0.125em;
}

.stargate.de > span:last-child {
  font-size: 64%;
}

.stargate .a {
  text-transform: lowercase;
}

.atlantis .stargate {
  display: inline-block;
  padding: 0 0.25em;
  border-bottom: 1px solid black;
  font-size: 81%;
  letter-spacing: 0.125em;
}

.atlantis .atlantis {
  margin-top: 0.125em;
  position: relative;
  top: -0.15em;
  padding-top: 0.15em;
  letter-spacing: 0.125em;
}

.atlantis span span:last-child
{
  letter-spacing: normal;
}

.sg-u {
  padding: 0.25em 0.25em 0 0.25em;
  background-color: #000;
  color: #eee;
  font-family: "Eurostile Extended", sans-serif;
  font-size: 122%;
  letter-spacing: -0.125em;
}

.sg-u .ring {
  letter-spacing: -0.2em;
}

@font-face {
  font-family: "Torchwood";
  src: local("Torchwood"), url(/styles/fonts/Torchwood.ttf);
}

@font-face {
  font-family: "Federation Classic";
  src: local("Federation Classic"), url(/styles/fonts/FEC_____.TTF);
}

.star-trek {
  padding: 0.125em 0.25em 0 0.25em;
  background-color: #000;
  color: #F8CB35;
  font-family: "Federation Classic", sans-serif;
  font-size: 150%;
  text-transform: lowercase;
}

.torchwood {
  padding: 0.125em 0.25em;
  background-color: black;
  color: #E72524;
  font-family: "Torchwood", serif;
  font-size: 106%;
  text-transform: uppercase;
}

@font-face {
  font-family: "True Blood";
  src: local("True Blood"), url(/styles/fonts/TRUEBLOOD.ttf);
}

.true-blood {
  font-family: "True Blood", serif;
}

.true-blood .upper {
  text-transform: uppercase;
}

.true-blood .blood {
  color: #991b30;
}

.true-blood .lower {
  text-transform: lowercase;
}

.tara {
  font-family: sans-serif;
  text-transform: uppercase;
}

.visitors {
  display: inline-block;
  position: relative;
  padding: 0.5em 0.5em 0.25em 0.5em;
  background-color: #000;
  color: #ff1700;
  font-family: fantasy;
  font-size: 80%;
  line-height: 2em;
}

.visitors span {
  vertical-align: middle;
}

.visitors .v {
  position: absolute;
  left: 0;
  width: 100%;
  font-size: 300%;
  color: rgba(210, 0, 1, 0.8);
  text-align: center;
}

.visitors .subtitle {
  text-transform: uppercase;
}

@font-face {
  font-family: "Gunplay";
  src: local("Gunplay"), url(/styles/fonts/gunplay.ttf);
}

.warehouse-13 {
  padding: 0 0.25em 0.125em 0.25em;
  background-color: #000;
  color: #BF311A;
  font-family: "Gunplay", sans-serif;
  text-transform: uppercase;
}

.warehouse-13 .numbers {
  color: #B4B4B4;
}

div.box {
  border: 1px solid black;
  position: relative;
  text-align: center;
}

div.meter, div.coverage {
  position: absolute;
  height: 100%;
}

div.meter {
  background-color: rgba(0, 0, 128, 0.5);
}

div.season {
  position: absolute;
  border-left: 1px solid #333;
  background-color: transparent;
  color: #999;
  overflow: hidden;
  white-space: nowrap;
}

div.coverage {
  background-color: rgba(0, 218, 0, 0.5);
}

.percentage {
  position: relative;
  background-color: rgba(255, 255, 255, 0.5);
}
 

Rev 26	Rev 28
1	<?php	1	<?php
2	header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT');	2	header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT');
3		3
4	/* Cached resource expires in HTTP/1.1 caches 24h after last retrieval */	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');	5	header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate');
6		6
7	/* Cached resource expires in HTTP/1.0 caches 24h after last retrieval */	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');	8	header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT');
9		9
10	header('Content-Type: text/css; charset=UTF-8');	10	header('Content-Type: text/css; charset=UTF-8');
11	?>	11	?>
12	@CHARSET "UTF-8";	12	@CHARSET "UTF-8";
13		13
14	html, body {	14	html, body {
15	-webkit-font-smoothing: antialiased;	15	-webkit-font-smoothing: antialiased;
16	}	16	}
17		17
18	h1, h2, h3, h4, h5, h6 {	18	h1, h2, h3, h4, h5, h6 {
19	text-rendering: optimizeLegibility;	19	text-rendering: optimizeLegibility;
20	}	20	}
21		21
22	body {	22	body {
23	font-family: sans-serif;	23	font-family: sans-serif;
24	}	24	}
25		25
26	:link, :visited {	26	:link, :visited {
27	text-decoration: none;	27	text-decoration: none;
28	color: inherit;	28	color: inherit;
29	}	29	}
30		30
31	.hidden {	31	.hidden {
32	display: none;	32	display: none;
33	}	33	}
34		34
35	h1 {	35	h1 {
36	margin: 0;	36	margin: 0;
37	text-align: center;	37	text-align: center;
38	}	38	}
39		39
40	[title] {	40	[title] {
41	cursor: help;	41	cursor: help;
42	/* border-bottom: 1px dotted black; */	42	/* border-bottom: 1px dotted black; */
43	}	43	}
44		44
45	table {	45	table {
46	width: 100%;	46	width: 100%;
47	border-collapse: collapse;	47	border-collapse: collapse;
48	}	48	}
49		49
50	th {	50	th {
51	width: 20%;	51	width: 20%;
52	padding: 0.25em 0.5em 0.25em 0;	52	padding: 0.25em 0.5em 0.25em 0;
53	text-align: right;	53	text-align: right;
54	}	54	}
55		55
56	td:first-child {	56	td:first-child {
57	width: 1em;	57	width: 1em;
58	border: none;	58	border: none;
59	}	59	}
60		60
61	th.recommended {	61	th.recommended {
62	border-left: 2px solid green;	62	border-left: 2px solid green;
63	border-top: 2px solid green;	63	border-top: 2px solid green;
64	border-bottom: 2px solid green;	64	border-bottom: 2px solid green;
65	}	65	}
66		66
67	td:last-child {	67	td:last-child {
68	padding-right: 0.25em;	68	padding-right: 0.25em;
69	}	69	}
70		70
71	td.recommended {	71	td.recommended {
72	border-top: 2px solid green;	72	border-top: 2px solid green;
73	border-right: 2px solid green;	73	border-right: 2px solid green;
74	border-bottom: 2px solid green;	74	border-bottom: 2px solid green;
75	}	75	}
76		76
77	@font-face {	77	@font-face {
78	font-family: "Futura Condensed";	78	font-family: "Futura Condensed";
79	src: local("Futura Condensed"), url(/styles/fonts/futura_condensed.TTF);	79	src: local("Futura Condensed"), url(/styles/fonts/futura_condensed.TTF);
80	}	80	}
81		81
82	@font-face {	82	@font-face {
83	font-family: "X-Files";	83	font-family: "X-Files";
84	src: local("X-Files"), url(/styles/fonts/x-files.ttf);	84	src: local("X-Files"), url(/styles/fonts/x-files.ttf);
85	}	85	}
86		86
87	<?php	87	<?php
88	$xfiles_pos = '65% 60%';	88	$xfiles_pos = '65% 60%';
89	$xfiles_angle = '12deg';	89	$xfiles_angle = '12deg';
90	$xfiles_gray = '236, 244, 235';	90	$xfiles_gray = '236, 244, 235';
91	?>	91	?>
92		92
93	.akte-x {	93	.akte-x {
94	padding: 1em 0.25em 0.6em 0.25em;	94	padding: 1em 0.25em 0.6em 0.25em;
95	background-image:	95	background-image:
96	linear-gradient(<?php echo $xfiles_angle; ?>,	96	linear-gradient(<?php echo $xfiles_angle; ?>,
97	rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,	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%);	98	rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
99	background-image:	99	background-image:
100	-moz-radial-gradient(<?php echo $xfiles_pos; ?>,	100	-moz-radial-gradient(<?php echo $xfiles_pos; ?>,
101	rgba(<?php echo $xfiles_gray; ?>, 0.5) 50%, rgba(<?php echo $xfiles_gray; ?>, 0.1)),	101	rgba(<?php echo $xfiles_gray; ?>, 0.5) 50%, rgba(<?php echo $xfiles_gray; ?>, 0.1)),
102	-moz-linear-gradient(<?php echo $xfiles_angle; ?>,	102	-moz-linear-gradient(<?php echo $xfiles_angle; ?>,
103	rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,	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%);	104	rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
105	background-image:	105	background-image:
106	-o-linear-gradient(<?php echo $xfiles_angle; ?>,	106	-o-linear-gradient(<?php echo $xfiles_angle; ?>,
107	rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,	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%);	108	rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
109	background-image:	109	background-image:
110	-webkit-radial-gradient(<?php echo $xfiles_pos; ?>, 25% 75%,	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)),	111	rgba(<?php echo $xfiles_gray; ?>, 0.5) 50%, rgba(<?php echo $xfiles_gray; ?>, 0.1)),
112	-webkit-linear-gradient(<?php echo $xfiles_angle; ?>,	112	-webkit-linear-gradient(<?php echo $xfiles_angle; ?>,
113	rgba(<?php echo $xfiles_gray; ?>, 0) 33%, rgba(<?php echo $xfiles_gray; ?>, 0.9) 68%,	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%);	114	rgba(<?php echo $xfiles_gray; ?>, 0.9) 70%, rgba(<?php echo $xfiles_gray; ?>, 0) 90%);
115	background-color: #000;	115	background-color: #000;
116	color: #dcdfdc;	116	color: #dcdfdc;
117	line-height: 2em;	117	line-height: 2em;
118	vertical-align: middle;	118	vertical-align: middle;
119	}	119	}
120		120
121	.akte-x .small {	121	.akte-x .small {
122	padding-left: 1em;	122	padding-left: 1em;
123	background-image: linear-gradient(bottom left, black, transparent);	123	background-image: linear-gradient(bottom left, black, transparent);
124	background-image: -moz-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);	125	background-image: -o-linear-gradient(bottom left, black, transparent);
126	background-image: -webkit-linear-gradient(bottom left, black, transparent);	126	background-image: -webkit-linear-gradient(bottom left, black, transparent);
127	vertical-align: middle;	127	vertical-align: middle;
128	font-family: "Futura Condensed", sans-serif;	128	font-family: "Futura Condensed", sans-serif;
129	font-size: 50%;	129	font-size: 50%;
130	text-transform: uppercase;	130	text-transform: uppercase;
131	letter-spacing: 1em;	131	letter-spacing: 1em;
132	}	132	}
133		133
134	.akte-x .before-x {	134	.akte-x .before-x {
135	letter-spacing: normal;	135	letter-spacing: normal;
136	}	136	}
137		137
138	.akte-x .x {	138	.akte-x .x {
139	font-family: "X-Files", sans-serif;	139	font-family: "X-Files", sans-serif;
140	font-size: 600%;	140	font-size: 600%;
141	font-weight: lighter;	141	font-weight: lighter;
142	vertical-align: middle;	142	vertical-align: middle;
143	vertical-align: -webkit-baseline-middle;	143	vertical-align: -webkit-baseline-middle;
144	color: black;	144	color: black;
145	-webkit-mask-image: -webkit-linear-gradient(-12deg,	145	-webkit-mask-image: -webkit-linear-gradient(-12deg,
146	rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));	146	rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));
147	}	147	}
148		148
149	.alf {	149	.alf {
150	font-family: "URW Bookman L", serif;	150	font-family: "URW Bookman L", serif;
151	font-weight: bold;	151	font-weight: bold;
152	font-size: 120%;	152	font-size: 120%;
153		153
154	}	154	}
155		155
156	@font-face {	156	@font-face {
157	font-family: "Highguard";	157	font-family: "Highguard";
158	src: local("Highguard"), url(/styles/fonts/Highguard.ttf);	158	src: local("Highguard"), url(/styles/fonts/Highguard.ttf);
159	}	159	}
160		160
161	.andromeda {	161	.andromeda {
162	position: relative;	162	position: relative;
163	font-family: "Highguard", sans-serif;	163	font-family: "Highguard", sans-serif;
164	font-size: 204%;	164	font-size: 204%;
165	color: rgba(245, 153, 79, 1);	165	color: rgba(245, 153, 79, 1);
166	text-shadow:	166	text-shadow:
167	/* blurred shadow */	167	/* blurred shadow */
168	-1px 0 2px black, 0 -1px 2px black, 1px 0 2px black, 0 1px 2px black,	168	-1px 0 2px black, 0 -1px 2px black, 1px 0 2px black, 0 1px 2px black,
169		169
170	/* outline */	170	/* outline */
171	-1px 0 black, 0 -1px black, 1px 0 black, 0 1px black;	171	-1px 0 black, 0 -1px black, 1px 0 black, 0 1px black;
172	}	172	}
173		173
174	.andromeda .gradient {	174	.andromeda .gradient {
175	-webkit-mask-image: -webkit-linear-gradient(top,	175	-webkit-mask-image: -webkit-linear-gradient(top,
176	rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));	176	rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 1));
177	}	177	}
178		178
179	.andromeda .roddenberry {	179	.andromeda .roddenberry {
180	position: absolute;	180	position: absolute;
181	right: 3.5em;	181	right: 3.5em;
182	top: 1.7em;	182	top: 1.7em;
183	font-family: sans-serif;	183	font-family: sans-serif;
184	font-size: 21%;	184	font-size: 21%;
185	text-transform: uppercase;	185	text-transform: uppercase;
186	color: black;	186	color: black;
187	text-shadow: none;	187	text-shadow: none;
188	letter-spacing: 0;	188	letter-spacing: 0;
189	}	189	}
190		190
191	.big-bang-theory {	191	.big-bang-theory {
192	font-family: Impact, sans-serif;	192	font-family: Impact, sans-serif;
193	font-size: 122%;	193	font-size: 122%;
194	text-transform: uppercase;	194	text-transform: uppercase;
195	}	195	}
196		196
197	.big-bang-theory .lower {	197	.big-bang-theory .lower {
198	font-size: 0.75em;	198	font-size: 0.75em;
199	text-transform: lowercase;	199	text-transform: lowercase;
200	}	200	}
201		201
202	.big-bang-theory .i {	202	.big-bang-theory .i {
203	text-transform: none;	203	text-transform: none;
204	font-size: 111%;	204	font-size: 111%;
205	font-weight: normal;	205	font-weight: normal;
206	}	206	}
207		207
208	.big-bang-theory .bang {	208	.big-bang-theory .bang {
209	color: #CE152C;	209	color: #CE152C;
210	}	210	}
211		211
212	@font-face {	212	@font-face {
213	font-family: "Battlestar";	213	font-family: "Battlestar";
214	src: local("Battlestar"), url(/styles/fonts/BATTLEST.TTF);	214	src: local("Battlestar"), url(/styles/fonts/BATTLEST.TTF);
215	}	215	}
216		216
217	.bsg {	217	.bsg {
218	font-family: "Battlestar", sans-serif;	218	font-family: "Battlestar", sans-serif;
219	font-size: 84%;	219	font-size: 84%;
220	}	220	}
221		221
222	@font-face {	222	@font-face {
223	font-family: "Buffied";	223	font-family: "Buffied";
224	src: local("Buffied"), url(/styles/fonts/Buffied.ttf);	224	src: local("Buffied"), url(/styles/fonts/Buffied.ttf);
225	}	225	}
226		226
227	@font-face {	227	@font-face {
228	font-family: "Slayer";	228	font-family: "Slayer";
229	src: url(/styles/fonts/slayer11.eot?);	229	src: url(/styles/fonts/slayer11.eot?);
230	src: local("Slayer"),	230	src: local("Slayer"),
231	url(/styles/fonts/slayer11.eot?) format(eot),	231	url(/styles/fonts/slayer11.eot?) format(eot),
232	url(/styles/fonts/slayer11.woff) format(woff),	232	url(/styles/fonts/slayer11.woff) format(woff),
233	url(/styles/fonts/slayer11.ttf) format(truetype),	233	url(/styles/fonts/slayer11.ttf) format(truetype),
234	url(/styles/fonts/slayer11.svg#Slayer) format(svg);	234	url(/styles/fonts/slayer11.svg#Slayer) format(svg);
235	font-weight: normal;	235	font-weight: normal;
236	font-style: normal;	236	font-style: normal;
237	}	237	}
238		238
239	@font-face {	239	@font-face {
240	font-family: "Kruella";	240	font-family: "Kruella";
241	src: local("Kruella"), url(/styles/fonts/kruella.ttf);	241	src: local("Kruella"), url(/styles/fonts/kruella.ttf);
242	}	242	}
243		243
244	.buffy {	244	.buffy {
245	display: inline-block;	245	display: inline-block;
246	padding: 0.75em 0.5em 0.5em 0.5em;	246	padding: 0.75em 0.5em 0.5em 0.5em;
247	background-color: #000700;	247	background-color: #000700;
248	background-image: -moz-radial-gradient(circle, #6d7a9c 35%, transparent 45%);	248	background-image: -moz-radial-gradient(circle, #6d7a9c 35%, transparent 45%);
249	background-image: -webkit-radial-gradient(circle, #6d7a9c 35%, transparent 45%);	249	background-image: -webkit-radial-gradient(circle, #6d7a9c 35%, transparent 45%);
250	color: #feffff;	250	color: #feffff;
251	line-height: 1em;	251	line-height: 1em;
252	text-align: center;	252	text-align: center;
253	text-shadow: 1px 1px 1px black;	253	text-shadow: 1px 1px 1px black;
254	}	254	}
255		255
256	.buffy .title {	256	.buffy .title {
257	font-family: "Buffied", fantasy;	257	font-family: "Buffied", fantasy;
258	font-size: 200%;	258	font-size: 200%;
259	}	259	}
260		260
261	.buffy .subtitle {	261	.buffy .subtitle {
262	display: block;	262	display: block;
263	font-family: "Slayer", sans-serif;	263	font-family: "Slayer", sans-serif;
264	font-size: 50%;	264	font-size: 50%;
265	font-variant: small-caps;	265	font-variant: small-caps;
266	}	266	}
267		267
268	@font-face {	268	@font-face {
269	font-family: "Arno Pro Caption";	269	font-family: "Arno Pro Caption";
270	src: local("Arno Pro Caption"), url(/styles/fonts/arnopro-caption.otf);	270	src: local("Arno Pro Caption"), url(/styles/fonts/arnopro-caption.otf);
271	}	271	}
272		272
273	.castle {	273	.castle {
274	font-family: "Arno Pro Caption", serif;	274	font-family: "Arno Pro Caption", serif;
275	font-size: 120%;	275	font-size: 120%;
276	text-transform: uppercase;	276	text-transform: uppercase;
277	}	277	}
278		278
279	@font-face {	279	@font-face {
280	font-family: "KopyKattKut Bold";	280	font-family: "KopyKattKut Bold";
281	src: local("KopyKattKut Bold"), url(/styles/fonts/KopyKattKut-Bold.otf);	281	src: local("KopyKattKut Bold"), url(/styles/fonts/KopyKattKut-Bold.otf);
282	}	282	}
283		283
284	.charmed {	284	.charmed {
285	font-family: "KopyKattKut Bold", serif;	285	font-family: "KopyKattKut Bold", serif;
286	font-size: 115%;	286	font-size: 115%;
287	/letter-spacing: -0.125em;/	287	/letter-spacing: -0.125em;/
288	text-transform: uppercase;	288	text-transform: uppercase;
289	}	289	}
290		290
291	.charmed .c {	291	.charmed .c {
292	/* font-size: 150%; */	292	/* font-size: 150%; */
293	}	293	}
294		294
295	.charmed span {	295	.charmed span {
296	/* vertical-align: middle; */	296	/* vertical-align: middle; */
297	}	297	}
298		298
299	@font-face {	299	@font-face {
300	font-family: "Coolvetica";	300	font-family: "Coolvetica";
301	src: local("Coolvetica"), url(/styles/fonts/coolvetica.ttf);	301	src: local("Coolvetica"), url(/styles/fonts/coolvetica.ttf);
302	}	302	}
303		303
304	.columbo {	304	.columbo {
305	padding: 0 0.25em;	305	padding: 0 0.25em;
306	background-color: #273d50;	306	background-color: #273d50;
307	color: #fde06c;	307	color: #fde06c;
308	font-family: "Coolvetica", sans-serif;	308	font-family: "Coolvetica", sans-serif;
309	font-size: 130%;	309	font-size: 130%;
310	letter-spacing: 0.0625em;	310	letter-spacing: 0.0625em;
311	text-transform: uppercase;	311	text-transform: uppercase;
312	text-shadow: 2px 2px 1px black;	312	text-shadow: 2px 2px 1px black;
313	}	313	}
314		314
315	@font-face {	315	@font-face {
316	font-family: "ITC Serif Gothic LT Bold";	316	font-family: "ITC Serif Gothic LT Bold";
317	src: url(/styles/fonts/itc_serif_gothic--lte50299.ttf);	317	src: url(/styles/fonts/itc_serif_gothic--lte50299.ttf);
318	}	318	}
319		319
320	@font-face {	320	@font-face {
321	font-family: "ITC Serif Gothic LT Heavy";	321	font-family: "ITC Serif Gothic LT Heavy";
322	src: url(/styles/fonts/itc_serif_gothic--lte50301.ttf);	322	src: url(/styles/fonts/itc_serif_gothic--lte50301.ttf);
323	}	323	}
324		324
325	.countdown-x {	325	.countdown-x {
326	display: inline-block;	326	display: inline-block;
327	font-family: "ITC Serif Gothic LT Heavy", sans-serif;	327	font-family: "ITC Serif Gothic LT Heavy", sans-serif;
328	line-height: 0.9em;	328	line-height: 0.9em;
329	text-align: center;	329	text-align: center;
330	text-shadow: 1px 1px #999;	330	text-shadow: 1px 1px #999;
331	}	331	}
332		332
333	.countdown-x .title:before {	333	.countdown-x .title:before {
334	content: "\2013\00A0";	334	content: "\2013\00A0";
335	}	335	}
336		336
337	.countdown-x .subtitle {	337	.countdown-x .subtitle {
338	display: block;	338	display: block;
339	font-family: "ITC Serif Gothic LT Bold", sans-serif;	339	font-family: "ITC Serif Gothic LT Bold", sans-serif;
340	}	340	}
341		341
342	.dead-zone {	342	.dead-zone {
343	font-family: serif;	343	font-family: serif;
344	text-transform: uppercase;	344	text-transform: uppercase;
345	}	345	}
346		346
347	@font-face {	347	@font-face {
348	font-family: "Doctor Who";	348	font-family: "Doctor Who";
349	src: local("Matt Smith Doctor Who"), url(/styles/fonts/matt_smith_doctor_who.ttf);	349	src: local("Matt Smith Doctor Who"), url(/styles/fonts/matt_smith_doctor_who.ttf);
350	}	350	}
351		351
352	.doctor-who {	352	.doctor-who {
353	position: relative;	353	position: relative;
354	color: #386688;	354	color: #386688;
355	font-family: "Doctor Who", serif;	355	font-family: "Doctor Who", serif;
356	font-size: 250%;	356	font-size: 250%;
357	text-transform: uppercase;	357	text-transform: uppercase;
358	text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);	358	text-shadow: 0 0 1px rgba(0, 0, 0, 0.25);
359	}	359	}
360		360
361	.doctor-who .gradient {	361	.doctor-who .gradient {
362	position: absolute;	362	position: absolute;
363	left: 0;	363	left: 0;
364	top: 0;	364	top: 0;
365	-webkit-mask-image:	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));	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;	367	z-index: 2;
368	}	368	}
369		369
370	.doctor-who .gradient2 {	370	.doctor-who .gradient2 {
371	-webkit-mask-image:	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));	372	-webkit-radial-gradient(1.2em 0.125em, 15% 50%, rgba(0, 0, 0, 0.2) 15%, rgba(0, 0, 0, 1));
373	}	373	}
374		374
375	.doctor-who .gradient3 {	375	.doctor-who .gradient3 {
376	-webkit-mask-image:	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));	377	-webkit-radial-gradient(2.4em 0.25em, 15% 50%, rgba(0, 0, 0, 0.2) 15%, rgba(0, 0, 0, 1));
378	}	378	}
379		379
380	.doctor-who:after {	380	.doctor-who:after {
381	content: "Doctor Who";	381	content: "Doctor Who";
382	color: #f7f9fb;	382	color: #f7f9fb;
383	}	383	}
384		384
385	@font-face {	385	@font-face {
386	font-family: "a_Futura Orto";	386	font-family: "a_Futura Orto";
387	src: local("Futura Orto"), url(/styles/fonts/a_futuraorto.ttf);	387	src: local("Futura Orto"), url(/styles/fonts/a_futuraorto.ttf);
388	}	388	}
389		389
390	@font-face {	390	@font-face {
391	font-family: "a_Futura Orto Bold";	391	font-family: "a_Futura Orto Bold";
392	src: local("Futura Orto Bold"), url(/styles/fonts/a_futuraorto_bold.ttf);	392	src: local("Futura Orto Bold"), url(/styles/fonts/a_futuraorto_bold.ttf);
393	}	393	}
394		394
395	.efc {	395	.efc {
396	position: relative;	396	position: relative;
397	display: inline-block;	397	display: inline-block;
398	background-color: #000;	398	background-color: #000;
399	background-image:	399	background-image:
400	/* Terra */	400	/* Terra */
401	-moz-radial-gradient(28.6541% -128%, circle, black 67%, #1C1F1C 71%, #394138 72.5%, transparent 73%),	401	-moz-radial-gradient(28.6541% -128%, circle, black 67%, #1C1F1C 71%, #394138 72.5%, transparent 73%),
402		402
403	/* Sol */	403	/* Sol */
404	-moz-radial-gradient(56.729378% 52.895753%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);	404	-moz-radial-gradient(56.729378% 52.895753%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);
405	background-image:	405	background-image:
406	/* Terra */	406	/* Terra */
407	-webkit-radial-gradient(28.654124% -155%, circle, black 67%, #1c1f1c 71%, #394138 72.5%, transparent 73%),	407	-webkit-radial-gradient(28.654124% -155%, circle, black 67%, #1c1f1c 71%, #394138 72.5%, transparent 73%),
408		408
409	/* Sol */	409	/* Sol */
410	-webkit-radial-gradient(55.137482% 42.084942%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);	410	-webkit-radial-gradient(55.137482% 42.084942%, circle, #fafdfa 7.366136%, #f9c699 9%, transparent 33%);
411	color: #eeeeec;	411	color: #eeeeec;
412	font-family: "a_Futura Orto Bold", sans-serif;	412	font-family: "a_Futura Orto Bold", sans-serif;
413	line-height: 1em;	413	line-height: 1em;
414	text-align: center;	414	text-align: center;
415	text-transform: uppercase;	415	text-transform: uppercase;
416	}	416	}
417		417
418	.efc .glare {	418	.efc .glare {
419	position: absolute;	419	position: absolute;
420	left: 0;	420	left: 0;
421	right: 0;	421	right: 0;
422	top: 0;	422	top: 0;
423	bottom: 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%);	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);	425	-webkit-transform: rotate(-11.5deg);
426	}	426	}
427		427
428	.efc:after {	428	.efc:after {
429	position: absolute;	429	position: absolute;
430	left: 0;	430	left: 0;
431	right: 0;	431	right: 0;
432	top: 0;	432	top: 0;
433	bottom: 0;	433	bottom: 0;
434	content: "";	434	content: "";
435	background-image:	435	background-image:
436	-moz-radial-gradient(55.137482% 42.084942%,	436	-moz-radial-gradient(55.137482% 42.084942%,
437	rgba(255, 255, 255, 0.2) 18%,	437	rgba(255, 255, 255, 0.2) 18%,
438	rgba(255, 255, 255, 0.04));	438	rgba(255, 255, 255, 0.04));
439	background-image:	439	background-image:
440	-webkit-radial-gradient(55.137482% 42.084942%, rgba(255, 255, 255, 0.2) 18%, rgba(255, 255, 255, 0.04));	440	-webkit-radial-gradient(55.137482% 42.084942%, rgba(255, 255, 255, 0.2) 18%, rgba(255, 255, 255, 0.04));
441	}	441	}
442		442
443	.efc .gr {	443	.efc .gr {
444	display: block;	444	display: block;
445	margin-top: 1em;	445	margin-top: 1em;
446	margin-bottom: 2.5em;	446	margin-bottom: 2.5em;
447	font-family: "a_Futura Orto", sans-serif;	447	font-family: "a_Futura Orto", sans-serif;
448	font-size: 50%;	448	font-size: 50%;
449	}	449	}
450		450
451	.efc .earth {	451	.efc .earth {
452	position: relative;	452	position: relative;
453	display: block;	453	display: block;
454	padding: 0 0 0 0.35em;	454	padding: 0 0 0 0.35em;
455	font-size: x-large;	455	font-size: x-large;
456	letter-spacing: 0.35em;	456	letter-spacing: 0.35em;
457	color: #efd065;	457	color: #efd065;
458	line-height: 1em;	458	line-height: 1em;
459	text-shadow: 0 0 1px rgba(0, 0, 0, 0.75);	459	text-shadow: 0 0 1px rgba(0, 0, 0, 0.75);
460	}	460	}
461		461
462	.earth .gradient {	462	.earth .gradient {
463	position: absolute;	463	position: absolute;
464	padding: 0 0 0 0.35em;	464	padding: 0 0 0 0.35em;
465	left: 0;	465	left: 0;
466	top: 0;	466	top: 0;
467	-webkit-mask-image: -webkit-linear-gradient(	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));	468	rgba(255, 255, 255, 1), rgba(243, 205, 98, 0.5) 50%, rgba(0, 0, 0, 0));
469	z-index: 2;	469	z-index: 2;
470	}	470	}
471		471
472	.efc .earth:after {	472	.efc .earth:after {
473	content: "Earth";	473	content: "Earth";
474	color: #9b411a;	474	color: #9b411a;
475	}	475	}
476		476
477	@font-face {	477	@font-face {
478	font-family: "Troglodyte";	478	font-family: "Troglodyte";
479	src: local("Troglodyte"), url(/styles/fonts/TROGLO__.ttf);	479	src: local("Troglodyte"), url(/styles/fonts/TROGLO__.ttf);
480	}	480	}
481		481
482	.efc .fc {	482	.efc .fc {
483	position: relative;	483	position: relative;
484	top: -0.5em;	484	top: -0.5em;
485	display: block;	485	display: block;
486	color: #ac493d;	486	color: #ac493d;
487	font-family: "Troglodyte", sans-serif;	487	font-family: "Troglodyte", sans-serif;
488	font-size: 71%;	488	font-size: 71%;
489	line-height: normal;	489	line-height: normal;
490	text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);	490	text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
491	}	491	}
492		492
493	@font-face {	493	@font-face {
494	font-family: "Interstate";	494	font-family: "Interstate";
495	src: local("Interstate"), url(/styles/fonts/interstate_ultra-black_condensed.ttf);	495	src: local("Interstate"), url(/styles/fonts/interstate_ultra-black_condensed.ttf);
496	}	496	}
497		497
498	.eureka {	498	.eureka {
499	position: relative;	499	position: relative;
500	padding: 0.25em 0.5em 0.125em 0.5em;	500	padding: 0.25em 0.5em 0.125em 0.5em;

Subversion Repositories LCARS

(root)/trunk/media/video/series/style.css - Rev 26 → 28