html {
	color:#555;
	background: #fefefe;
	overflow-y: scroll;
}

body {
	font-family: times, Times New Roman, times-roman, georgia, serif;
	font-size:16px;
	line-height:18px;
}

#template {
	width:960px;
	margin:42px auto;
	padding:42px;
}

div#main {
	display:none;
}

h1 {
	font-size:56px;
	letter-spacing:-1px;
	color:#678197;
	margin-bottom:18px;
}

h2, h3 {
	font-size:18px;
	font-style:italic;
	letter-spacing:-1px;
	color: #555;
}

h2 span {
	font-family:Baskerville, Palatino, "Palatino Linotype", Constantina, "URW Paladio L", georgia, times, serif;
}

h3{
	margin-bottom:18px;
}

img {
	margin-top:18px;
}

table {
	border:none;
	border-spacing:0;
	border-collapse:collapse;
}

thead {
	background:#F7FBFF;
}

thead th {
	color:#678197;
	font-size:12px;
	text-align:center;
	text-transform:uppercase;
	border-right:1px solid #aaa;
	padding:4px;
}

thead tr {
	border-top:1px solid #aaa;
}

thead tr th {
	border-top:1px solid #aaa;
}

tbody {
	border:none;
}

tbody#top {
	border-bottom:1px solid #aaa;
}

td{
    text-align:center;
}

td.area {
	color:#678197;
	background:#F7FBFF;
	text-transform:uppercase;
	border-top:1px solid #aaa;
	border-left:1px solid #aaa;
}

td.area span.updated{
    text-transform:none;
    font-size:12px;
}

td.location {
	color:#678197;
	background:#F7FBFF;
	text-align:center;
	padding:4px;
	border-right:1px solid #aaa;
	border-left:1px solid #aaa;
	border-top:1px solid #aaa;
}

/* TODO remove this when extra tds go away */
td.location+td {
	display:none;
}

/* 	TODO Zebra stripes and hovers only for modern browsers
	use Modernizr for js fallback for older browsers - worth the bother?
*/

tr.court:nth-child(odd) {
	background:#f4f4f4;
}

/* Not sure if it works - not associated with any functionality */
/*tr.location:hover {
    background:#CCE6FF;
}

tr.location:hover tr.court:nth-child(odd) {
    background:rgba(250,250,250,0.5);
}*/

td.court, td.casenumbers, td.names, td.statuses, td.updated  {
	font-size:14px;
	padding:4px;
	border-right:1px solid #aaa;
	border-top:1px solid #aaa;
}

td.area{
    width:100px;
}
td.location{
    width:100px;
}

td.court{
	text-align:center;
    width:60px;
}

table.casenumbers {
	text-align:center;
    width:80px;
}

table.names{
    width:250px;
}

table.statuses{
    text-align:center;
    width:250px;
}

/* Don't tell anyone I did this! */
@-moz-document url-prefix() { td table td table { margin-top:-1px; } }
@-moz-document url-prefix() { td table { margin-top:-1px; } }