/*  
Theme Name: Three Columns
Theme URI: http://32sixteen.com/
Description: Three column 32sixteen theme, 
Version: 0.2.1
Author: Nick Wallis
Author URI: http://32sixteen.com/
Tags: burgundy, three column, fixed width sidebars, ems, XHTML
*/

/*

Modifications
0.2.1.3 Removed Live Comment Preview
0.2.1.2 Code styles, shell styles, file styles
0.2.1.1 1942 report only for level 1 headers
0.2.1   Added 1942 report font [by Johan Holmdahl] for headers using typeface.js 
        [http://typeface.neocracy.org/]
        See http://32sixteen.com/wp-content/themes/three_column_0.2.1/fonts/1942.txt
        
0.2.0.4 Updated Sans-Serif fonts
0.2.0.3 Added support for Live Comment Preview
	    [http://plugins.trac.wordpress.org/wiki/LiveCommentPreview]
0.2.0.2 Made active or focus links more obvious when navigating with the 
		keyboard.
0.2.0.1 Used image for page header, with image replacement
0.2.0	Moved style elements back to page
		Add category menu
		New screenshot (not 300x225 tho')
		Removed flickr badge from RH sidebar
		Section 508 Passed
		
0.1.5   Removed specific page templates and amalgamated into the index.
        Simplified templates down to just index and search
		Rationalised archive logo functionality
		More consistent use of quotes
0.1.4	Extract common page elements into their own php
		Remove draggable sidebar elements - who uses that shit anyway?
		Resized font in ems
		Made document structure more logical by use of HTML heading styles
0.1.3	Removed banner ads
0.1.2	Made sidebar elements draggable (not sortable; that will require defining a list style)
0.1.1	Removed temporary blank page

*/

/*******************************************************************************
** Style Summary
**
** #fff : #fff
** #eee : light grey
** #ddd :  |
** #ccc :  |
** #333 :  V
** #222 : dark grey
** #000	: black
** #09c : pale blue
** #c03 : burgundy
** #303 : 
** #8ca3c3 : GeoURL background
**
** Font Summary
** serif:
**	Georgia, 'Times New Roman', Times, serif
** sans-serif fonts:
**	"Lucida Grande", Geneva, Helvetica, sans-serif
** 	Use sans-serif for items that are to be contrasted.
** monospace:
**  'Courier New', Courier, monospace
**  Use monospace for headings
**
** Sizing is in ems and is based on the article 'How to Size Text in CSS' by 
** Richard Rutter
** [http://www.alistapart.com/articles/howtosizetextincss/]
** Font sizes:
**  1.375em = 20px
**  1.125em = 18px
**  1em = 16px
**  0.75em = 12px
**  0.6875em = 11px
**  0.625em = 10px
** 
*******************************************************************************/

/*******************************************************************************
** Document Structure - position and basic styles
*/
body	{
	background-color: #fff;
	color: #000;
	margin: 0px !important;
	padding: 0px !important;
}

#header{
	background: url('http://32sixteen.com/wp-content/themes/three_column_0.2.1/images/sitelogo.gif') no-repeat top left;
	margin: 0px !important;
	padding: 0px !important;
	height:60px;
}

#categorymenu {
	background-color: #000;
	color: #fff;
	height:20px;
	width:100%;
	position: absolute;
	left:0px;
	top: 60px;
	font-size:14px;	/* the one fixed size because it's on a fixed size background */
	font-weight:bold;
	margin:0;
	padding:0;
}

#leftcol {
	position: absolute;
	left:0px;
	top:80px;
	width:120px;
	background: #fff;
	padding:0px;
	z-index:3;
}
		
#content {
	background: #fff;
	border:1px solid #fff;
	margin-left: 125px;
	margin-right:255px;
	margin-top:20px;
	voice-family: "\"}\"";
	voice-family: inherit;
	margin-left:121px;
	margin-right:252px;
	padding:5px;
}
	
html>body #content {
	margin-left: 121px;
	margin-right:251px;
}

#rightcol {
	position: absolute;
	right:0px;
	top:80px;
	width:250px;
	background: #fff;
	padding:0px;
	margin:0px;
	z-index:3;
}	

#topbanner {
	background-color: #fff;
	height:60px;
	padding:5px;
}

#footer {
	clear:both; 
	background-color: #fff;
	border:1px solid #fff;
	border-top: 1px dotted #c03;
	margin-left:125px;
	margin-right:255px;
	voice-family: "\"}\"";
	voice-family: inherit;
	margin-left:121px;
	margin-right:251px;
	padding:0px;
}

html>body #footer {
	margin-left: 121px;
	margin-right:251px;
}


#sk2_footer {
	background-color: #000;
	height:20px;
}

#searchform {
	margin: 10px auto;
	padding: 5px 3px; 
}

#save{
	width:80%;
}

#pagelogo {
	background: url("http://32sixteen.com/wp-content/themes/three_column_0.2.1/images/logo.jpg") no-repeat; 
	position: absolute;
	float:right;
	right:0px;
	top:0px;
	width:250px;
	height:60px;
}

#title {
	position: absolute;
	left:150px;
	top: 0px;
}

/*******************************************************************************
** Font Styles, Sizes and Weights
*/
body	{
    font-family: Georgia, 'Times New Roman', Times, serif;
	font-size:100%;
    line-height:1.125em; /* 18px / 16px = 1.125em */
}

h1 {
    font-family: '1942 report', 'Courier New', Courier, monospace;
}

h2, h3, h4, h5, h6,
code,
.archive-date,
.archive-title,
.caption,
.commentscount, 
.file,
.pings,
.respond,
.shell,
.attribution, 
#categorymenu {
    font-family: 'Courier New', Courier, monospace;
}

.attribution, 
.caption,
.sans {
	font-family: "Lucida Grande", Geneva, Helvetica, sans-serif;
}

#title,
.archive-date,
.archive-title,
.post-title {
    font-size:1.375em; /* 20px */
    line-height:1.636em; /* 36px */
}

blockquote:before, blockquote:after {
    font-size: 2em;
    padding:0;
}

h2,
.archive-date {
    font-size:1.125em; /* 18px */
}

h3,
.caption {
    font-size:1.0em; /* 16 px */
}

h2.sideheader,
h4,
cite,
p,
li,
.commentlist p,
.commentlist li {
	font-size: 0.875em; /* 14px */
}

h5,
.commentscount,
.pings,
.respond,
.sidecontainer {
    font-size:0.75em; /* 12px */
}

h6 {
    font-size:0.6875em; /* 11px */
}

small, address {
	font-size: 0.625em; /* 10 px */
}

h3, 
strong, 
#title,
.archive-date,
.archive-title,
.caption, 
.commentscount,
.post-title {
	font-weight: bold;
}


/*******************************************************************************
** HTML Tags
*/
a {
	color: #09c;
	text-decoration: none;
	border: none;
}

a:hover {
    color: #000;
    background: #ddd;
}

a:visited {
	color: #c03;
	text-decoration: none;
}

blockquote {
    background: #eee;
    display: block;
    margin: 0 1em;
    padding: 1em 1em 0 1em;
    width: 36em; /* body width - 4em */
}

blockquote:before, blockquote:after {
    color: #c03;
    display: block;
    width: 50px;
}

blockquote:before {
    content:open-quote;
    height: 0;
    margin-top: -0.4em;
    margin-left: -0.55em;
}
blockquote:after {
    content: close-quote;
    height: 50px;
    margin-top: -1.1em;
    margin-left: 18em;
}

.categorymenu ul {
	margin:0;
	padding:0 250px 0 120px;
}

.categorymenu li {
	color: #000;
	display:inline;
	width:4em;
	text-align:center;
	border:0;
}

.categorymenu li a:link,
.categorymenu li a:visited {
	color: #fff;
	padding: 0 0.2em;
	margin: 0 0.2em;
}

.categorymenu li a:hover
{
	color: #c03;
	background-color: #fff;
	font-weight:bold;
	border-bottom: 3px solid #c03;
	border-top: 1px solid #fff;
}

/* HR is replaced with a bar when styles are turned on */
hr {
	display: none;
}

h1,
h2,
h3,
h4,
h5,
h6, 
.post-title  {
	color: #000;
	text-decoration: none;
	text-transform:none;
}

h2	{
	border-bottom: 2px solid #c03;
}

h3	{
	border-bottom: 1px solid #ccc;
}

h3, h3 a, h3 a:hover, h3 a:visited, h4, h4 a, h4 a:hover, h4 a:visited {
	text-decoration: none;
	color: #333;
}

/*******************************************************************************
 * Classes and named regions
 */
#title,
.post-title, .archive-date, .archive-title {
	border: none;
	text-decoration:none;
	padding: 0 0.25em 0.25em 0.25em;
}

.archive-date {
	border-top: 2px solid #c03;
}

.post-title, .post-title a, .post-title a:hover, .post-title a:visited,
.post-title	{
	background: #c03;
	color: #fff;
}

.post, .excerpt, .entry  {
	margin-bottom:5px;
	padding:5px;
}

.post td,
.post th {
	border:1px solid #ccc;
	margin:0px;
	padding:2px;
	vertical-align:top;
}

.comments-title  {
	border-bottom: 2px solid #c03;
}

.commentlist p,
.commentlist li,
#commentform,
#comment {
	text-transform: none;
}

.evencomment,
.oddcomment {
	padding: 0.25em; /* 4px */
}

.evencomment {
	background-color: #fff;
}

.comment-preview,
.oddcomment {
	background-color: #eee;
}

.caption {
	color: #222;
}

h1,
h2,
h3,
h4,
h5,
h6, 
.archive-title,
.button,
.caption,
.post-title,
.screenshot,
.storyimage,
.center,
#categorymenu,
#footer {
	text-align: center;
}

h1,
h2,
h3,
h4,
h5,
h6, 
.post-title,
.post td,
.post th,
.alignleft {
	text-align: left
}

.attribution,
.avatar,
.commentscount,
.alignright {
	text-align: right;
}

.next,
.floatleft {
	float: left;
	padding-right:5px;
}

.previous,
.floatright {
	float: right;
	padding-left:5px;
}

.pings,
.respond {
	background: #ddd;
	padding: 0.25em;
}

.commentscount {
	margin-top: -0.5em;
}

.attribution,
.avatar {
    font-size:0.6875em; /* 11px */
}

.sidecontainer {
	background: #fff;
	color: #000;
	border:1px solid #000;
	margin-top:3px;
	margin-left:2px;
	margin-right:2px;
	margin-bottom:3px;
	padding-top:0px;
	padding-left:2px;
	padding-right:2px;
	padding-bottom:2px;
}

.sideheader {
	background-color: #000;
	border:2px solid #000;
	color: #fff;
	margin:0px -2px;
	padding:0px;
}

.sidecontainer ul {
	list-style:none;
	padding: 0px;
}

.sidecontainer ul{
}

.sidecontainer ul li:before {
	content: '\00BB \0020';
}

img {
	border: none;
}

img.screenshot,
img.photograph {
	border:1px solid #000;
}

.navigation{
	border:0;
}
/*
** Glassy bar effect
*/
#sk2_footer,
#categorymenu,
.sideheader {
	background: url('http://32sixteen.com/wp-content/themes/three_column_0.2.1/images/blackbar.gif') repeat; 
}

/*******************************************************************************
** Flickr Styles
*/
.zg_div {
	margin:0px 5px 5px 0px; 
	width:117px;
}

.zg_div_inner {
	color: #303;
	font-family: "Lucida Grande", Geneva, Helvetica, sans-serif;
	font-size:11px;
	text-align:center;
}

.zg_div a, .zg_div a:hover, .zg_div a:visited {
	background:inherit !important;
	color: #09c; 
	text-align:center;
	text-decoration:none !important;
}


/*******************************************************************************
** Wordpress Calendar plugin 
*/
#wp-calendar {
	empty-cells: show;
    font-size:0.6875em; /* 11px */
}

#wp-calendar #next a {
	text-align: right;
}

#wp-calendar #prev a {
	text-align: left;
}

#wp-calendar a {
	background: #eee;
	display: block;
	text-decoration: none;
}

#wp-calendar a:hover {
	background: #ddd;
	color: #000;
}

#wp-calendar td {
	color: #ccc;
	text-align: center;
}

#wp-calendar td.pad:hover {
	background: #fff;
}

#wp-calendar #today {
	background: #09c;
	color: #fff;
}

#wp-calendar #today a {
	background: #09c;
	color: #fff;
}

#wp-calendar #today a:hover {
	background: #ddd;
	color: #000;
}

#wp-calendar td:hover{
	background: #09c;
	color: #000;
}

#wp-calendar th {
	text-transform: capitalize;
}

.geourl {
	font-family: "Lucida Grande", Geneva, Helvetica, sans-serif;
	font-size: 0.75em; /* 12px */
	font-weight:bold;
	color: #fff;
	background-color: #8ca3c3;
	border-left:1px solid #ccf;
	border-top:1px solid #ccf;
	border-right:1px solid #55a;
	border-bottom:1px solid #55a;
	padding:0px 3px 0px 3px;
	margin:0px;
	text-decoration:none;
}

/* 
** Make active links really stand out when using the TAB key to move around 
** the page.
*/
a:active, a:focus {
	background: #fb2;
	color: #000;
	border: 2px solid #09c;
}

/*
** Code styles
*/
/* for displaying contents of files */
.file, 
.shell	{
	padding: 1em;
	border: 1px dashed #888;
	color: black;
	background-color: #eee;
	font-size: 0.875em;
	line-height: 0.75em;
	margin:0 1em;
	white-space:pre;
}
/* For shell input */
.shell  {
    font-weight:bold;
}

/* colour keywords, strings, and comments in files */
.comment	{
	color: #080;
	font-style:italic;
}

.keyword	{
	color: #00f;
	font-weight:bold;
}