/* www.libpr0n.com */
/* stylesheet #1 */


/* layout */

  h1 { position: absolute; top: 20px; left: 20px; bottom: auto; right: auto; margin: 0; padding: 0; }
  html { margin: 0; padding: 0; }
  body { margin: 80px; padding: 100px 1em 1em 1em; }
  ul.menu { border-spacing: 0; display: table; margin: 0 1em 1em 1em; padding: 0; float: left; }
  ul.menu > li { display: table-row; }
  ul.menu > li > span { display: table-cell; }
  ul.menu > li > span > :link, 
  ul.menu > li > span > :visited { padding: 0.5em; display: block; margin: 0.25em 0; text-align: center; }
  .footer { clear: both; }
  dt { margin: 1em 0 0 0; }
  li { list-style-position: inside; margin: 1em 0; }
  form[name=utmform] { display: none; }


/* decoration */

  @ debug; * { border: 1px solid white ! important; } /* see below */
  body { border: solid 1em; }
  /* these next two ALSO set border-color!! */
  ul.menu > li > span > :link, ul.menu > li > span > :visited  { border: outset 0.5em; }
  ul.menu > li > span > :link:active, ul.menu > li > span > :visited:active { border: inset 0.5em; }


/* fonts */

  * { font: inherit; }
  html { font: medium Verdana, Arial, Helvetica, sans-serif; }
  h1 { font: 900 9em Tahoma, Verdana, Arial, Helvetica, sans-serif; }
  dt { font-weight: bolder; }
  .legal { font-size: 0.5em; }
  h2 { font-size: 1.5em; }
  em { font-style: italic; }
  strong, h2 { font-weight: bold; }


/* color */

  html { background: green; color: white; } 
  body { border-color: yellow; background: #3f5d1c url(leafbg.png); }
  h1 { background: transparent; color: black; }
  :link { background: transparent; color: #FFFF00; }
  :visited { background: transparent; color: #FFCC00; }
  ul.menu > li > span > :link, ul.menu > li > span > :visited,
  ul.menu > li > span > :link:active, /* need to get more specificity than border-color above */
  ul.menu > li > span > :visited:active { border-color: #CC9900; background: #DD9900; color: black; }
  em, h2 { background: transparent; color: #FFFF00; }



/* What is this @debug stuff???

I use @debug as a very quick way of enabling/disabling a rule.  An
invalid @rule will just be ignored (including its contents), so

    p { color: green; } @invalid { p { color: red; } }

...will result in a green p not a red p.  But, "@ invalid" is not an
@-rule, it's just a broken selector.  So these would end up with a
green p:

    p { color: green; } @invalid p { color: red; }
    p { color: green; } @ invalid p { color: red; }
    p { color: green; } @ invalid; p { color: red; }

    p { color: red; } @invalid; p { color: green; }

Why?

Well, this is because of part of the forward compatability parsing
rules, which is quite an obscure part of the spec. The spec says that
you have to eat a whole @rule if you don't recognise it. @rules end at
the first |{}| or |;|. So @debug ...... ; counts as one rule. Now, an
@rule is only an @rule if it starts with |@| and continues with an
identifier, so |@ debug| is NOT an at rule, it's just a broken
selector -- and unrecognised selectors have to be read from the start
to the end of the |{}| block.

But if you've been paying attention you'll notice that a selector does
NOT get terminated at a |;|! This is the key difference which is used
in this trick.

So |@debug; p { color: green; }| is an @rule followed by a style rule,
but |@ debug; p { color: red; }| is a broken style rule.

In other words, given

    @ debug; p { color: blue; }

...the color of the p will be blue if the " " is removed, and the rule
will be ignored otherwise.

I hope this helps! */