/*
Graphical Styles for Project Cerbera
Creator: Ben "Cerbera" Millard
Website: http://projectcerbera.com
History: 2005-04-22 -> 2008-11-15 -> 2009-02-05 -> 2009-07-01 -> 2009-08-24 -> 2009-11-29 -> 2010-01-01 -> 2010-06-01 -> 2010-08-29 -> 2010-09-05 -> 2010-10-11 -> 2010-11-10 -> 2011-01-04 -> 2011-03-11 -> 2011-03-30 -> 2011-04-27 -> 2011-05-30 -> 2011-06-19 -> 2011-07-25 -> 2011-09-21 -> 2011-11-10 -> 2011-12-29, 2012-01-12, 2012-01-28, 2012-02-16, 2012-03-29, 2012-04-05, 2012-04-13, 2012-05-04, 2012-05-15, 2012-06-21 to 2012-07-01, 2012-07-19, 2012-08-02, 2012-08-15, 2012-09-08, 2012-12-19, 2013-03-31, 2013-06-20, 2014-05-20, 2015-02-07, 2015-08-30, 2015-09-06, 2023-01-23

* Floating .img causes Guillotine bug in IE6.
* 81% #content for 3 column galleries at 1024x768:
  /gta/2/multislayer/

Moved from Lucida Sans to Lucida Sans Unicode due to it being drawn all wobbly on many Windows XP boxes!
Also added Consolas to the front of monospace font families.
*/

/* Initial Setup */
html, body {
 margin: 0;
 padding: 0;
}
html {
 overflow-y: scroll;
 color: #000;
 font-size: 0.75em; /* 16px is web default */
 word-wrap: break-word; /* Internet Explorer 5.5+, CSS3 */
 background: #fff;
 border: 0; /* Suggested UI styling */
}
body {
 font: 1em/1.5 "Lucida Sans Unicode", "Lucida Grande", Tahoma, sans-serif;
}
#title, h1, h2, h3, h4, h5, h6 {
 font-family: Georgia, Garamond, serif;
}


/* Basic Layout */
/* Note: Wide Layout is at bottom of stylesheet */
#header {
 margin: 0;
 padding: 0;
 color: #000;
 background: #bcc;
 border-bottom: 1px solid #577;
}
#content {
 margin: 0 0.833em; /* 10px */
}
#nav {
 clear: both;
 width: 100%;
}
#footer {
 width: 100%;
 color: #000;
 font-size: 0.917em;
 background: #FAF8F0;
 border: 1px solid #000;
 border-width: 1px 0;
}
/* - Basic Blog Layout */
.blog #sidebar {
 clear: both;
 background: #bcc;
 border: 1px solid #577;
 border-width: 1px 0;
}
/* - All Entries Archive */
.entries #content div {
 display: inline-block;
 padding: 0.5em 0 0 0; /* 6px */
 min-width: 8em;
 max-width: 17em; /* 1024 = 4 columns; 1280 = 5 columns */
 overflow: hidden;
 vertical-align: top;
 border-top: 2px solid #336666;
}
.entries #content ol {
 padding-left: 2.5em;
}
/* - Secondary Content */
#header legend label, #repress, #sidebar h3 {
 display: none;
}



/* Base Styles */
acronym, abbr {
 font-variant: normal;
 border: 0;
}
acronym[title], abbr[title] {
 cursor: help;
}
blockquote { /* Prevent indention */
 margin: 0;
 padding: 0;
}
img {
 margin: 0;
 padding: 0;
 border: 0;
}
ins {
 text-decoration: none;
}
sup {
 vertical-align: top;
 font-size: 0.75em;
}
h1 sup, h2 sup {
 font-size: 0.667em;
}

/* - Tables */
table {
 margin: 0.25em 0 1em 0;
 padding: 0;
 empty-cells: show;
 font: 1em "Lucida Sans Unicode", "Lucida Grande", Tahoma, sans-serif;
}
caption {
 margin: 0;
 padding: 0;
 width: 100%;
 text-align: left;
}
td {
 padding: 0.083em 0.25em 0.167em 0.25em;
 color: #000;
 vertical-align: baseline; /* Row Headers */
 background: #faf8f0; /* before 2011 was: #eeeae0 */
}
tr:nth-child(even) td {
 background: #eeeae0; /* zebra rows, June 2011 */
}
th { /* Header */
 padding: 0.462em 0.231em;
 color: #000;
 font-size: 1.083em; /* 12px -> 13px */
 text-align: center;
 vertical-align: bottom; /* Rowspaned Headers */
 background: #bcc;
}
tfoot td, tfoot th {
 font-weight: bold;
 vertical-align: middle;
 background: #bcc;
}
thead td {
 background: transparent; /* Support for empty-cells:hide; is rare? */
}
tbody th { /* Row Headers */
 padding: 0.083em 0.25em 0.167em 0.25em;
 font-size: 1em; /* 12px */
 text-align: left;
 vertical-align: baseline;
 font-weight: normal;
}
th > code, #content th > code { /* <a href><code> is not selected because that's red */
 color: #000; /* <code> is normally green but <th> has green background */
}
table.number, table .number {
 text-align: right;
}
table.letter, table .letter {
 text-align: center;
}
table.prose, table .prose {
 text-align: left;
}
/* -- Borders */
table {
 border-collapse: collapse;
 border: 0;
}
th, tfoot td {
 border: 1px solid #577;
}
td {
 border: 1px solid #dcc;
 border-color: #aeaaa0;
}
tfoot th, tfoot th {
 border: 1px solid #577;
}
thead td {
 border: 0;
}


/* - Hyperlinks */
a {
 color: #821;
 text-decoration: underline;
/* border-bottom: 1px solid; */ /* why is this miles away from the text?! */
}
a:visited {
 color: #644;
}
a:hover, a:focus, a:active {
 color: #000;
}
a code {
 color: inherit;
}
a img {
 padding: 2px;
 background: #fff; /* Hide underline */
 border: 2px solid;
}



/* Header & Search Box */
#header {
 text-align: right;
}
#header fieldset {
 margin: 0;
 padding: 0.333em 0.25em 0 0;
 border: 0 solid transparent;
}
#header legend {
 margin: 0;
 padding: 0;
 color: #000;
}
#header legend label {
 left: 0.167em; /* Visually aligned with #nav */
 position: absolute;
 font: 2em Georgia, Garamond, serif;
 line-height: 1.25;
 letter-spacing: -0.0417em;
}
#header input {
 margin: 0 0 0.333em 0;
 vertical-align: middle;
}
#header #q, #header #q:invalid { /* no text = :invalid */
 background: #fff url(http://www.google.com/cse/intl/en/images/google_custom_search_watermark.gif) left center no-repeat;
 border: 1px solid #577;
 box-shadow: none; /* Firefox browser styles for invalid state */
}
#header #q:hover, #header #q:focus, #header #q[value], #header #q:valid { /* is in use or contains text */
 background: #fff; /* hide placeholder background-image */
}
/* Select an empty input dynamically with CSS:
http://stackoverflow.com/questions/3617020/matching-an-empty-input-box-using-css/11209779#11209779
*/




/* Content */
#content #breadcrumb {
 margin: 0.25em 0;
 padding: 0;
}
#content p {
 margin: 0 0 1em 0;
}
#content p.meta {
 color: #333;
 font-size: 0.833em;
}

/* - Headings */
#content h1, #content h2, #content h3, #content h4, #content h5, caption {
 margin: 0;
 padding: 0;
 color: #366;
 font-weight: normal;
}
#content h1 {
 margin: 0.25em 0 0 0;
 font-size: 2em; /* 12px -> 24px */
 line-height: 1.25; /* 24px -> 30px */
 letter-spacing: -0.0208em; /* 24px -> 0.5px */
}
#content h2 {
 margin-top: 0.571em; /* 21px to 12px */
 font-size: 1.75em; /* 12px -> 21px */
 line-height: 1.1904; /* 21px -> 25px */
 letter-spacing: -0.0238em; /* 21px -> 0.5px */
 word-spacing: 0.048em; /* 21px -> 1px */
}
#content .gallery h2  { /* Used by: /gta/2/ */
 margin-top: 0;
 padding-right: 0; /* undo gutter */
}
#content h3 {
 color: inherit;
 font-size: 1.5em; /* 12px -> 18px */
 line-height: 1.222; /* 18px -> 24px */
 letter-spacing: -0.0139em; /* 18px -> 0.25px */
 word-spacing: 0.056em; /* 18px -> 1px */
}
#content .gallery h3 { /* Used by: /gta/2/multislayer */
 padding-right: 0; /* undo gutter */
}
#content h4, #content h5 {
 color: inherit;
 font-size: 1.083em; /* 12px -> 13px */
 line-height: 1.222; /* 18px -> 22px */
}
#content h5 {
 font-style: italic;
}
#content .group { /* Related commands in: /gta/2/tutorials/scripting */
 clear: right; /* Used in: /gta/5/ */
 padding-top: 0.75em; /* h3 */
 border-top: 2px solid #336666;
}
#content h1 code {
 font-size: 0.917em; /* 24px -> 22px */
 line-height: 1.136; /* 22px -> 25px */
 letter-spacing: -0.045em; /* 22px -> 1px */
}
#content h2 code {
 font-size: 0.857em; /* 21px -> 18px */
 line-height: 1.222; /* 18px -> 22px */
 letter-spacing: -0.056em; /* 18px -> 1px */
 word-spacing: 0;
}
#content h2 samp, #content h3 samp {
 font: inherit; /* looks weird otherwise: /tools/textstudio/changelog/0.0.614 */
}
#content blockquote h2, #content blockquote h3, #content blockquote h4, #content blockquote h5, #content blockquote caption {
 margin-top: 0;
}
caption {
 font-size: 1.25em; /* 12px -> 15px */
 letter-spacing: -0.0167em; /* 15px -> 0.5px */
}

/* - Lists */
#content dl, #content ul, #content ol {
 margin: 0 0 1em 0;
}
#content dl dl, #content li dl, #content dl ul, #content dl ol, #content li ul, #content li ol {
 margin: 0;
 padding-right: 0; /* Undo gutter */
}
#content ol {
 padding-left: 3.5em;
 list-style: decimal;
}
#content ol ol {
 padding-left: 2em;
 list-style: lower-alpha;
}
#content ol ol ol {
 list-style: lower-roman;
}
#content ol ol ol ol {
 list-style: upper-roman;
}
#content ul {
 padding-left: 2em;
}
#content dt {
 display: inline;
 font-weight: bold;
}
#content dd {
 margin: 0 0 0.5em 0;
 padding: 0;
}
/* -- <dl compact> */
#content dl.compact, .compact #content dl {
 float: left; /* contain inner floats */
 width: 74%; /* +25% padding-right */
}
#content .compact dt, .compact #content dt,
#content .compact dd, .compact #content dd {
 clear: left;
 float: left;
 margin: 0;
 padding: 0 0.5em 0 0;
}
#content .compact dd, .compact #content dd {
 clear: none;
}
/* -- Image Gallery */
#content ol.gallery, #content ul.gallery {
 float: left;
 margin: 0 0 1em 0;
 padding: 0;
 width: 100%;
 list-style-type: none;
}
#content .gallery > li {
 float: left;
}
#content .gallery > h3 {
 margin: 0;
 padding: 0;
}
#content .gallery a img {
 padding: 0;
 border: 0;
}
/* -- Image Gallery for Index Pages */
.index #content .gallery > li {
 width: 256px; /* Images width */
 height: 240px; /* Image height + 25px h2 + 17px caption */
 overflow: hidden; /* Just in case there are differently sized images or text */
 border-right: 2px solid #fff;
 border-bottom: 2px solid #fff;
}
.index #content .gallery > li > * > a {
 width: 256px; /* Fitt's Law */
}
.index #content .gallery a {
 border: 0;
}
#content .gallery a > img {
 display: block; /* Text captions below image: /gta/2/ */
}
/* -- Image Gallery for Blog Index Pages */
.blog.index #content .gallery > li {
 height: auto;
}
/* -- Category Clouds */
.categories #content ul, .categories #content ol, #content ul.categories, #content ol.categories {
 padding: 0;
 list-style: none;
}
.categories #content li, ul.categories li, ol.categories li, #footer li {
 display: inline-block;
 margin-right: 0.333em; /* 4px */
 padding-right: 0.333em; /* 4px */
 border-right: 2px solid #366;
}
.categories #content li:last-child, ul.categories li:last-child, ol.categories li:last-child, #footer li:last-child {
 margin-right: 0;
 padding-right: 0;
 border-right: 0;
}
/* -- Category Clouds after Group Headings */
/* /gta/2/tutorials/scripting */
#content h3.group {
 padding-left: 20%; /* align text with main content */
 width: 75%; /* not quite sure why this number fits... */
 left: -20%; /* fill #nav on left */
 position: relative;
}
#content h3.group + ol.categories {
 float: left; /* pull subsequent content up */
 left: -20%; /* relative to #content which is 82% of <body> */
 margin-right: -20%; /* remove layout ghost */
 width: 18%;
 position: relative;
}
#content h3.group + ol.categories li {
 display: block; /* one per line */
 padding-left: 0;
 border-left: 0;
}
/* - Images */
#content img {
 vertical-align: middle;
}
#content .img {
 float: right;
 margin: 0 0 1em 0;
 padding: 0; /* <blockquote class="img"> in /ui/ie8/b1/download/ */
 width: 100%;
 vertical-align: top;
}
#content blockquote.img h3 {
 margin-left: 0.667em; /* 12px */
}
#content blockquote.img ol, #content blockquote.img p, #content blockquote.img ul {
 margin-left: 1em;
}
#content .img h2, #content .img h3 {
 margin: 0;
}
#content .img img, #content .img div {
 display: block;
 float: right;
 margin: 0 0 0 1em;
}
#content .img img {
 padding: 0 4px; /* Align horizontally with 2px padding and 2px border of hyperlinked images */
}
#content .img a img {
 padding: 2px; /* "a img" adds 2px border */
 background: transparent; /* Show <blockquote> background in /ui/ie8/b1/download/ */
}
#content .img div a {
 display: block;
 margin: 0 0 0.5em 0;
 border: 0;
}
#content .img div a img {
 margin: 0;
 background: #fff; /* <blockquote> in narrow viewports here: /me/ */
}
#content .img div img {
 float: none;
}

/* - Text Samples */
#content address, #content blockquote, #content .dialogue {
 margin-top: 0.25em;
 margin-bottom: 1em;
 color: #000;
 font-style: normal;
 background: #faf8f0;
 border: 1px solid #bebab0;
}
#content address {
 padding: 1em;
}
#content li address {
 margin-right: 0; /* Undo gutter */
}
#content blockquote {
 padding: 1em 1em 0 1em;
}
#content blockquote blockquote, #content blockquote address {
 margin-right: 0; /* Undo gutter */
}
#content blockquote p.citation, #content blockquote address { /* Migrate to <address> for this */
 margin: 0 0 1em 0;
 padding: 0;
 text-align: right;
 border: 0;
}
/* -- Dialogue */
#content .alt {
 color: #000;
 background: #fff;
}
#content .dialogue {
 padding: 0 1em;
}
#content .dialogue cite {
 float: left;
 display: block;
}
#content .dialogue blockquote {
 margin: 0 0 0.2em 15%;
 padding: 0;
 border: 0;
}
#content .dialogue p {
 margin: 0;
 padding: 0;
}
/* -- IRC */
/* See: /blog/2008/03/hixie-compliments
        /blog/2007/05/xhtml-html */
#content blockquote.irc {
 padding: 0 1px; /* Firefox 2 clipped border-right of .me rows */
}
#content blockquote.irc table {
 margin: 0;
 padding: 0;
 width: 100%; /* Make .me rows fill <blockquote> */
}
#content blockquote.irc td, #content blockquote.irc th {
 margin: 0;
 padding: 0 0.5em;
 font-weight: normal;
 background: transparent;
 border: 0;
}
#content blockquote.irc th {
 width: 5em; /* Shrink to width of name */
 word-wrap: normal; /* IE6 override earlier break-word */
}
#content blockquote.irc td blockquote {
 /* /blog/2008/08/headers */
 margin: 0;
 padding: 0;
 border: 0;
}
#content blockquote.irc .me th, #content blockquote.irc .me td { /* IE6 won't style <tr> */
 background: #eeeae0;
}

/* - Code Samples */
#content kbd {
 margin: 0 1px;
 padding: 0 0.25em;
 font: 1em "Microsoft Sans Serif", Geneva, sans-serif;
 background: #f6f6f6;
 border-width: 1px;
 border-style: solid;
 border-color: #bebab0 #666 #333 #bbb;
}
#content samp {
 line-height: 1.5; /* 1px shift */
}
#content samp, #content samp code {
 font-weight: bold;
 font-family: "Microsoft Sans Serif", Geneva, sans-serif;
}
#content code, #content pre {
 font-family: Consolas, "Lucida Console", Monaco, monospace;
}
code {
 color: #366;
}
#content pre {
 /* Long unbroken code: /blog/2007/12/
    Styling overriden: /web/articles/code-in-pre */
 margin-top: 0;
 margin-bottom: 1em; /* Margin shorthand would undo gutter */
 color: #000;
 white-space: pre-wrap;
 background: #faf8f0;
}
#content pre code, #content pre samp {
 display: block;
 margin: 0; /* Opera adds a margin */
 padding: 0.5em 1em;
 color: #000;
 line-height: 1.25;
 background: transparent;
 border: 1px solid #bebab0;
}

/* -- Syntax Highlighting */
/*
 Make this generic and remove class on <pre>?
 /web/articles/syntax-highlighting
 
 * pre b = Element
 * pre b b = Magic Element (includes, labels)
 * pre i = Comment
 * pre i i = Magic Comment (Doctype, PI)
 * pre span = Value or Keyword
 * pre span span = Magic Value or Keyword (NCR, constants)
 * pre del = Error
 * pre ins = Edited
 * pre var = Varies
 * pre a = reference via hyperlink
*/
/* CSS */
pre code .css { /* Embedded CSS */
 color: #000;
}
.css i { /* Comment */
 color: #080;
 font-style: normal;
}
.css span { /* Property Value */
 color: #00f;
}
.css b, pre code span.css b { /* Selectors and At-Rules */
 color: #808;
 font-weight: normal;
}
.css ins, .css ins b { /* Marked change */
 padding: 0.166em 0 0.083em 0;
 text-decoration: none;
 background: #eeeae0;
}
/* HTML */
pre code i { /* Comment */
 color: #080;
 font-style: normal;
 font-weight: normal;
}
pre code i i { /* Magic Comment */
 color: #48c;
 font-style: normal;
}
pre code b { /* Element */
 color: #808;
 font-weight: normal;
}
pre code b b { /* Magic Element */
 color: #c48;
}
pre code span { /* Value */
 color: #00f;
}
pre code span span { /* Magic Value */
 color: #f40;
 font-weight: normal;
}
pre code del { /* Error */
 color: #f00;
 font-style: normal;
 text-decoration: underline;
}
pre code ins, pre code ins b { /* Changed */
 padding: 0.166em 0 0.083em 0;
 text-decoration: none;
 background: #eeeae0;
}
#content pre code a { /* Reference by Hyperlink */
 color: inherit; /* just underline it */
}
/* Visual Basic 6 */
/* class="vb6" makes the universal highlighting look like the VB6 IDE. */
/* Retire this in favour of universal approach? */
.vb6 i { /* Comment */
 color: #080;
 font-style: normal;
}
.vb6 b { /* Keyword */
 color: #008;
 font-weight: normal;
}
.vb6 span { /* not coloured in IDE */
 color: inherit;
}



/* Blog */
/* Blog - All Entries */
.entries #content h2 {
 clear: none;
 text-align: left;
}
.entries #content h2 a {
 float: none;
}


/* Google Custom Search Results */
/* Presented on: /search?q=keywords */
/* - Remove ads and an empty <table> from results column */
#cse .gsc-adBlock, .gsc-resultsHeader {
 display: none;
}
/* - Yuck, layout tables! */
#cse table, #cse td {
 margin: 0;
 padding: 0;
 background: #fff;
 border: 0;
}
/* - Results, Pagination */
#cse .gsc-webResult .gsc-result, #cse .gsc-cursor-box {
 padding: 1em 0 0 0;
 border: 0;
}
/* Result URLs */
#cse .gs-visibleUrl {
 display: none;
}
#cse .gs-visibleUrl-long {
 display: block;
}
/* Branding */
#cse .gsc-results {
 position: relative; /* layout context */
}
#cse .gcsc-branding {
 right: 0;
 bottom: 5px;
 position: absolute;
}


/* Navigation */
#nav h1 {
 width: 0;
 height: 0;
 position: absolute;
 overflow: hidden;
}

/* - Links list */
#nav ul {
 margin: 0;
 padding: 0;
 list-style: none;
 color: #000;
 background: #fff;
}
#nav li, #nav li a {
 height: 1%;
}
#nav li:first-child a, #nav li:first-child.current strong {
 border-top: 0 !important; /* 2011-03-30: First time I ever needed !important.  */
}
#nav > ul > li:last-child a:link {
 margin-bottom: 0; /* avoid :hover trick below */
 border-bottom: 1px solid #aeaaa0;
 border-radius: 0 0 5px 0; /* curved bottom-right */
}
#nav li a, #nav .current strong {
 display: block;
 padding: 0.25em 0 0.25em 0.5em;
 text-decoration: none;
 border-right: 1px solid #aeaaa0;
 border-bottom: 0;
}
#nav .current strong {
 color: #000;
 font-weight: bold;
 background: #fff;
 border-top: 1px solid #aeaaa0;
 border-right: 0; /* Connect to #content */
}
#nav li a:link {
 color: #000;
 background: #faf8f0;
 border-top: 1px solid #aeaaa0;
}
#nav li a:visited {
 color: #333;
 background: #eeeae0;
 border-color: #9e9a90;
}
#nav > ul > li > a:hover, #nav > ul > li > a:focus, #nav > ul > li > a:active {
 margin-bottom: -1px; /* remove space added by border-bottom */
 position: relative; /* enable z-index */
 z-index: 1; /* above subsequent link */
 color: #000;
 background: #bcc;
 border-bottom: 1px solid;
 border-color: #577;
}
/* - Sub Navigation */
#nav ul ul {
 margin-bottom: -1px;
 top: -1px;
 position: relative;
 font-size: 0.917em; /* 12px -> 11px */
 line-height: 1.636; /* 20px -> 18px */
 border-bottom: 0;
}
#nav ul ul a, #nav ul ul .current strong {
 padding: 0.182em 0 0.182em 0.545em; /* 2px 0 2px 6px */
}
#nav ul ul .current strong {
 line-height: 1.455; /* 18px -> 16px */
 padding-left: 1.25em;
 border: 1px solid #aeaaa0;
 border-width: 1px 0 1px 0;
}
#nav ul ul a:link, #nav ul ul a:visited,
#nav ul ul a:hover, #nav ul ul a:focus {
 padding-left: 1.25em;
 border-width: 0 1px 0 0;
}
#nav ul ul a:hover, #nav ul ul a:focus, #nav ul ul a:active {
 text-decoration: underline;
}
#nav ul ul li.current:last-child strong {
 border-bottom: 1px solid #fff;
}
/* - Current Item Sub Navigation */
#nav .current ul {
 margin: -1px 0; /* share parent border-bottom; share subsequent item border-top */
 position: relative;
 border-top: 1px solid #aeaaa0;
}

/* - Irrepressible Rebuilt */
#repress {
 margin-top: 2em;
 overflow: hidden;
 font: 1em/1.167 Helvetica,Arial,sans-serif; /* 12px/14px */
 background: #faf8f0;
 border: 1px solid #9e9a90;
 border-width: 1px 1px 1px 0;
 border-radius: 0 5px 5px 0;
}
#repress h2, #repress blockquote, #repress p, #repress a {
 margin: 0;
 padding: 0;
 display: block;
 font-family: inherit;
}
/* - Common for Links */
#repress a {
 color: #fff;
 text-decoration: none;
 background: #6c3;
 border: 0;
}
/* - Header & Footer */
#repress h2 {
 font-size: 1em; /* 12px */
}
#repress h2 a, #repress > p:last-child a {
 font-weight: bold;
 padding: 3px 2%;
}
#repress a:hover, #repress a:focus, #repress a:active {
 color: #ff0;
}
#repress h2 a:hover span {
 color: #fff;
}
#repress h2 a span {
 display: block;
 color: #ff0;
 font: bold 1em/1.154 "Helvetica Bold","Arial Black",Arial,sans-serif; /* 13px/15px */
 text-transform: uppercase;
 white-space: nowrap;
}
/* - Quote with Citation */
#repress p {
 font-size: 0.917em; /* 11px */
 line-height: 1.182; /* 13px */
}
#repress blockquote a {
 padding: 3px 5px;
 color: #000;
 background: #faf8f0;
}
#repress blockquote a:visited {
 color: #000;
 background: #eeeae0;
}
#repress blockquote a:hover, #repress blockquote a:focus, #repress blockquote a:active {
 color: #fff;
 background: #6c3;
}
#repress p cite {
 display: block;
 padding-top: 3px;
 text-align: right;
}
/* - Description */
#repress blockquote + p {
 padding: 3px 5px;
}
/* - Footer */
#repress > p:last-child a {
 text-align: center;
 text-transform: uppercase;
}


/* Sidebar */

/* - Blog */
.blog #sidebar {
 font-size: 0.917em; /* 12px -> 11px */
 line-height: 1.455; /* 16px */
}
.blog #sidebar h2, .blog #sidebar h3 {
 margin: 0.125em 0.625em 0 0.625em; /* 2px, 14px, 5px */
 color: #000;
 font-weight: normal;
 font-size: 1.455em; /* 16px */
 line-height: 1.25; /* 20px */
}
.blog #sidebar h2 dfn {
 font-style: normal;
}
.blog #sidebar ol, .blog #sidebar p {
 margin: 0 0.545em 1.273em 0.91em; /* 14px, 5px, 10px */
}
.blog #sidebar ol {
 padding: 0;
 list-style: none;
}
.blog #sidebar li strong {
 line-height: 1.2; /* 12px */
}



/* Footer */
#footer p {
 margin: 0;
 padding: 0.3em 0.5em 0.3em 0.5em;
}
#footer ul {
 float: left;
 margin: 0;
 padding: 0 0.5em 0.5em 0.5em;
}
#footer li {
 border-color: #AEAAA0;
}
#footer #modified {
 padding: 0 0.556em 0.667em 0;
 text-align: right;
 font-size: 0.9em;
}



/* Wide Layout */
@media (min-width: 800px) {

/* - Secondary Content */
#header legend label, #repress, #sidebar h3 {
 display: block;
}

/* Main Layout */
#content {
 float: right;
 margin: 0 1% 0 0;
 width: 82%; /* 77% */
}
#nav {
 clear: none;
 float: left;
 width: 15%; /* 20% */
 margin-bottom: -1px; /* Share #footer border-top when content is short */
 position: relative;
 overflow: hidden;
 color: #000;
}
#footer {
 clear: both;
 top: -2px;
 position: relative; /* Share border-bottom with #sidebar */
}

/* Blog Layout */
.blog #content {
 float: right;
 margin: 0;
 padding: 0;
 left: -17%; /* -21% */
 width: 66%; /* 2-column Gallery at 800x600 */ /* 62% */
 position: relative;
}
.blog #sidebar {
 clear: none;
 float: right;
 top: -1px;
 margin: 0;
 padding: 0;
 left: 66%;
 width: 14.5%;
 position: relative;
 border-width: 0 0 1px 1px;
}
.blog.categories #content, .blog.entries #content {
 margin: 0;
 left: 0;
 width: 83%; /* 77% */
}
.blog.index #content h1 {
 margin-bottom: 0.25em; /* 6px */
}
/* - Blog Home & Months */
.blog.index #content h2 {
 clear: left;
 text-align: right; /* Dates on right */
 border-bottom: 1px solid #fff; /* Keep content below date */
}
.blog.index #content h2 a {
 float: left;
}
/* - Blog Sidebar Layout */
.blog #sidebar .categories + h3 + ol li { /* Recent Months */
 display: block;
 padding: 0;
 border: 0;
}

/* Gutter */
#content address, #content blockquote, #content .dialogue, #content form, #content pre {
 margin: 0 25% 1em 0; /* 23% of <body> width, empty line below */
}
.blog #content address, .blog #content blockquote, .blog #content .dialogue, .blog #content form, .blog #content pre,
#content blockquote pre {
 margin-right: 0; /* Undo gutter */
}
#content dl, #content h2, #content h3, #content h4, #content h5, #content ol, #content p, #content ul {
 padding-right: 25%; /* 23% of <body> width */
}
.blog #content dl, .blog #content h2, .blog #content h3, .blog #content h4, .blog #content h5, .blog #content ol, .blog #content p, .blog #content ul,
#content blockquote dl, #content blockquote p {
 padding-right: 0; /* Undo gutter */
}
.blog #content dl.compact {
 padding-right: 0; /* Undo gutter */
 width: 100%; /* avoid shrink-wrapping effect of float */
}



} /* end wide layout */