body {
	margin: 1px 0 0;
	padding: 0;
}
body, table, p {
	background: #000;
	color: #CCC;
	font-size: 100%;
} /* text is not in body from google cache */

a {
	text-decoration: underline;
}
a:link    { color:#DDB; }
a:visited { color:#CCCCC0; }
a:active  { color:#FF0; }
a:hover   { color:#FF0; text-decoration: none}

p, pre, table {
	margin: 0 1em 2ex;
}

/* headers */

h1 {
	border: 1px solid #A00;
	background: #700;
	padding: 0 0.66em; /* 1em / 150% */
	margin: 3ex -1px 1ex;
	font: bold 150% Verdana, sans-serif;
	letter-spacing: 1px;
	text-transform: uppercase;
}
h2 {
	border: 1px solid #800;
	background: #400;
	padding: 0 1em;
	margin: 2ex -1px 1.5ex;
	font-size: 100%;
	font-weight: bold;
}
h2 small.aside {
	position: absolute;
	margin-top: 1px; /* h2 border */
	margin-left: 2em;
	font-size: 100%;
	font-weight: normal;
}
h3 {
	margin: 2ex 1em 1.5ex;
	font-size: 100%;
}
.item,
.index thead b, .index thead a,
dt b, dt a {
	border: 1px solid #800;
	background: #400;
	font-weight: bold;
	padding: 0 1em;
}
a:hover .item,
.index thead a:hover,
dt a:hover {
	background: #700;
}

hr {
	height: 2px;
	border: 0;
	background: #800;
	color: #800
}

h1 q {
	text-transform: none;
	font-style: italic;
}
h1 q:before {
	color: #F00;
	content: '» ';
}
h1 q:after {
	color: #F00;
	content: ' «';
}

/* lists */

ul, ol, dl {
	margin: 1ex 1em 2ex;
	padding: 0;
}
ul {
	list-style-type: disc;
}
li {
	margin: 0;
	padding: 0;
	margin-left: 1.5em;
}
li p {
	margin-left: 0;
}

dd {
	margin: 0.5ex 0 2ex 1em;
	padding-left: 1px; /* dt border */
}
dd p {
	margin: 1ex 0 1.5ex;
}

dl.compact dt b,
dl.compact dt a {
	border: none;
	background: none;
	padding: 0;
}
dl.compact dd {
	margin: 0 0 1ex 2em;
}

/* header */

#head {
	border: 2px solid #600;
}
#head #logo {
	float: left;
	background: #800;
	border: 1px solid #D00;
	margin: -2px; /* overlap parent border */
	padding: 1px 5px;
}

#menu {
	float: right;
	width: 21em;
	text-align: left; /* so msie puts div left */
}
#menu span {
	display: none; /* structural text, unneccessary if styled */
}
#menu a {
	text-align: right;
	color: #CCC;
	text-decoration: none;
	display: block;
	padding: 0 8px;
	border: 0;
}
#menu a:hover {
	color: #FF0;
	background: #600;
}
#menu b a {
	letter-spacing: 2px;
	font-weight: normal;
	color: #EEA;
}
#submenu {
	visibility: hidden;
	position: absolute;
	width: 14em;
	margin-right: 2em;
	border: 2px solid #600;
	margin-top: 1ex;
	background: #400;
	float: left;
} /* opera is weird when using #menu #submenu */

#headsub {
	clear: both;
	border-top: 2px solid #600;
	background: #400;
	padding: 1px 8px;
}
#page-update {
	float: right;
}
#loc a {
	text-decoration: none;
}

p.intro {
	border: 2px solid #600;
	border-top: 0;
	display: table;
	max-width: 84%;
	margin: 0 auto;
	padding: 0.8ex 1em;
}

/* side bar */

dl.bar {
	float: right;
	width: 10em;
	text-align: center;
	border: 1px solid #A00;
	border-width: 0 0 1px 1px;
	background: #400;
	margin: 0 0 1ex 1em;
	padding: 0;
}
h1 + dl.bar {
	margin-top: -1.6ex; /* 1ex * 150% + 1px */
}
dl.bar dt {
	background: #000;
	border: 1px solid #800;
	font-weight: bold;
	margin: 1.5ex 1em 0.5ex 0.5em;
}
dl.bar dd {
	margin: 0.5ex 1em 1.5ex 0.5em;
}
dl.bar dd ul, dl.bar dd li {
	list-style: none;
	margin: 0;
}
dl.bar dd ul {
	margin-bottom: 1ex
}
dl.bar p {
	background: none;
	margin: 0 0 1ex;
}

/* other constructions */

.spot {
	padding: 1ex;
	border: 1px solid #800;
	border-width: 2px 0;
}
p.spot {
	width: 42%;
	text-align: center;
	margin: 0 auto;
}
pre.spot {
	float: left;
	margin-left: 2em;
	padding: 1ex 3em;
}
pre.spot code {
	letter-spacing: 0.2em;
	line-height: 2;
}

/* tables */

table, th, td {
	border-color: #700;
	border-style: solid;
}
th {
	background: #700;
}
th, td {
	vertical-align: top;
}

#cont table[border="1"] {
	border-width: 1px;
}
#cont table[border="1"] th {
	font-weight: bold;
	text-align: left;
}
#cont table[border="0"] td {
	border: 0;
}
#cont table[border="1"] th.sub {
	font-size: 75%;
	background: #400;
	font-weight: normal;
}

.index thead td {
	padding-bottom: 1ex;
}
.index tbody td {
	text-align: center;
}

/* screenshots */

table.shot {
	border-spacing: 0;
	border-width: 1px 2px;
	outline: 1px solid #800;
}
table.shot th, table.shot td {
	border-width: 1px 0;
	padding: 0.25em;
}

table.shot td.shot {
	text-align: center;
	padding: 0.25em 0.5em;
	background: #400;
	border-right: 1px solid #500;
}

table.shot td p {
	margin: 0.5ex 16px 0; /* horizontal eq .item */
	padding: 2px;
}
table.shot td div.head {
	overflow: auto;
}
table.shot td div.head p {
	float: left;
}
table.shot td div.head p,
table.shot td p.head {
	margin: 0;
	padding: 1px; /* gecko fix border in overflow */
}
table.shot td div.head p.aside {
	float: right;
	font-size: 75%;
}

table.shot td.grade {
	vertical-align: middle;
	text-align: right;
	font-weight: bold;
	padding: 0.5em;
}

/* images */

img {
	border: 0;
}
img[border="1"] {
	border: 2px solid #800;
	margin: 0 8px;
}

img.left {
	float: left;
	margin-right: 1em;
}
img.right {
	float: right;
	margin-left: 1em;
	margin-right: -1em;
}

/* footer */

#foot {
	border: 1px solid #600;
	border-width: 1px 2.5em;
	background: #400;
	width: 100%;
	margin: 2ex 0 0;
	padding: 0 1em;
}
#foot td {
	border: 0;
	font-size: 75%;
}

/* forms */

input[type="text"] {
	color: #CCC;
	background-color: #200;
	border: 1px solid #700;
}
input[type="submit"] {
	color: #CCC;
	background: #700;
	border: 1px ridge #C00;
}
input[type="button"] {
	color: #CCC;
	background: #300;
	border: 1px ridge #800;
}

/* code */

code {
	margin: 0;
}
span.comment {
	color: #888;
}
em.comment {
	color: #B97;
	font-style: normal;
}
p code,
strong.comment {
	color: #CC4;
	font-weight: normal;
}

.snippets {
	float: left;
}
.snippets li {
	border-top: 2px solid #800;
	list-style: none;
	padding: 2ex 0 0;
}

/* stats */

strong.counter {
	letter-spacing: 0.4em;
	padding-left: 0.3em; /* match rightmost spacing */
	border-bottom: 3px double #600;
	margin-bottom: 0.5ex;
	display: inline-block;
}

dd form.poll li,
form.poll li {
	text-align: left;
	margin: 0;
	margin-left: 3em;
	text-indent: -3em;
	list-style: none;
}
.bar .poll li {
	font-size: 70%;
}
.poll li .value {
	color: #B86;
}
.bar .poll p.value {
	text-align: right;
}
.poll .pctbar {
	display: block;
	border: 1px solid #500;
	border-bottom-color: #600;
	border-left-color: #600;
	background: #200;
	color: #532;
	text-align: left;
	margin: -1.25ex 0 0.5ex auto;
	padding-left: 1px; /* seperate just a bit from border; em is very irregular at such size */
}

