/*  CSS RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}

/* End CSS RESET */
		
		
html{
	font-family: "Hoefler Text", Garamond, Times;
	margin:0;
	padding:0;
}

body{
	line-height: 1.2em;
	margin:0;
	padding:0;
	border: 0;
	width:100%;
	background:#fff;
	min-width:60em;
}

h1, h2, h3, h4, h5{ font-variant:small-caps; padding:1em;}
h1{font-size:180%;}
h2{font-size:160%;}

a{color:#009;}
a:visited{color:#403;}
a:hover{color:#00f !important;}
a img{border: none;}

img { -ms-interpolation-mode:bicubic; } /* Making IE suck slightly less - woot! */

em{font-style: italic;}

cite{font-size:80%; vertical-align:top;}
cite:before{content: "[";}
cite:after{content: "]";}
cite a{text-decoration:none;}

br{clear: both;}

blockquote{
	max-width: 25em;
	display: block;
	padding: 1em;
	margin:1em auto;
	background-color: #fdfdfd;
	color: #555;
	text-align: right;
	border-bottom: thin solid #ddd;
	border-top: thin solid #ddd;
	font-style: italic;
}

ol{
	list-style: decimal;
	}

blockquote:before, blockquote:after {
	color:#999;
	line-height:0;
	font-size:5em;
}

blockquote:after {
	content: close-quote;
	font-size:5em;
	line-height:0;
	vertical-align:-0.8em;

}

blockquote:before {
	content: open-quote;
	padding-right:10px;
	vertical-align:-0.3em;
}


code{
	clear:both;
	font-family: Courier, monospaced;
	font-size: 80%;
	display:block;
	padding:0.8em;
	background-color: #eef;
	border-top: thin solid #999;
	border-bottom: thin solid #999;
	margin-bottom: 0.8em;
	}

p.minor{
	font-size: 90%;
	font-style: oblique;
}

#header h1 {
	font-weight:normal;
	letter-spacing:0.2em;
	border-bottom: thin solid #ddd;
	margin:0;
	padding:0.4em;
	float:left;
}
#header h1 a{color: #000; text-decoration:none;}
#header h1 a:hover{color:#00f;}
#header h1 .pagetitle:before{content : "| ";}
#header h1 .pagetitle {font-size:60%; color:#999;} 
#header h2{float:left;}

#header #search{
	margin:0.5em;
	padding:0;
	float:right;
	overflow:hidden;
	border:thin solid #fff;
	font-size:80%;
}
#header #search form{
	padding:0;
	margin:0;
}
#header #search label{display:none;}
#header #search input.blur{color:#999; font-style: italic;}
#header #search input.button{
	padding:0;
	margin:0;
	border:thin solid #ddd;
	border-left:none;
	float:left;
	display:block;
	
	background:url('../images/search.png') no-repeat left top;
	-moz-border-radius-topright:1.1em;
	-webkit-border-top-right-radius:1.1em;
	-moz-border-radius-bottomright:1.1em;
	-webkit-border-bottom-right-radius:1.1em;
	background-color:#eee;
	
	/* IE SUX!!! */
	height :0 !important;
	overflow: hidden;
	padding-top: 18px;
	width:1.7em;
	height /**/:18px;		
}
#header #search #query{
	max-width:12em;
	margin:0;
	padding:0;
	padding-left:0.9em;
	height:18px;
	-moz-border-radius-topleft:1.1em;
	-moz-border-radius-bottomleft:1.1em;
	border:thin solid #ddd;
	display:block;
	float:left;
	}
#header #search #query:focus{outline:none; background-color:#eef;}

#page {
	position:relative;		
	clear:both;
	float:left;
    width:100%;
	overflow:hidden;		
}



#content{
	width:35em;
	margin:0 auto;
	padding-top: 3em;
	padding-left:3em;
	float:left;
	/*text-align:justify;*/
	padding-bottom:4em;
	min-height: 40em;
}

#content p{
	padding-bottom:1em;
	display:block;
}

#content h2{
	line-height: 1.1em;
	}

#content .abstract{font-size: 80%; font-style: oblique; text-align: center; max-width: 35em; margin:0 auto;}

#content .photo{
	float:right;
	display:block;
	border:thin solid #ddd;
	padding:0.5em;
	margin:0.5em;
}

#content .feature.photo{
	float:none;
	text-align: center;
	margin: 0.5em auto;
	padding:1.5em;
}
#content .feature.photo img{width: 30em; margin:0 auto;}


#content a.photo{
	text-decoration:none;
}

#content .photo.onblack{
	background:#000;
	color:#fff;
}

#content .photo span, #content .photo .caption{
	font-size:90%;
	display:block;
	font-style:italic;
	text-align:center;
	padding-top:0.2em;
	
}

#content .endnote{
	padding-top: 25px;
	padding-bottom:15px;
	font-style: italic;
	font-size: 90%;
	border-top: thin solid #999;
}
#content .download{
	background-color: #e3e3e3;
	border: thin solid #999;
	padding: 10px;
	margin: 5px;
}

#content .alert{
    font-size:120%;
    font-style:italic;
	background-color: #ff9;
	color: #000;
	border: thin dotted #ff940e;
	max-width: 25em;
	padding:2em;
	margin:2em auto;
}

#content .homepage.minor-article{
	padding-bottom: 0.5em;
	padding:0.4em; 
	border-bottom:0.1em solid #efefef;
	border-top:0.1em solid #efefef;
	background-color:#f9f9f9;
	color:#999;
	font-style:italic;
	margin-bottom:2em;

}
#content .homepage.minor-article a{color:#999;}
#content .homepage.minor-article .date{float:right;}

#content .homepage.article{
	padding-bottom: 0.5em;
	border-bottom:0.1em solid #efefef;
	margin-bottom:8em;
	}
#content .homepage.article .date{
	font-style: oblique;
	display: block;
	float:right;
	font-size:90%;
	padding:0.5em;
}
#content .homepage.article .title{margin-bottom:1em;}
#content .homepage.article .title h2{
	float:left;
	padding:0.4em; 
	margin:0; 
	font-size: 200%; 
	max-width: 12em; 
	line-height: 1.05em;}
#content .homepage.article .title h2 a{text-decoration: none; color:#000;}

#content .homepage.article .article_content{
	border-top: 1px solid #999; 
	clear:both;
	padding:1em;
	}
#content .homepage.article .article_content h2{font-size: 110%;}
#content .homepage.article .article_more{
	float:right;
	padding-top: 1em;
}
#content .homepage.article .meta{
	clear:both;
	background-color: #eee;
	font-style: italic;
	color:#555;
	padding:0.5em;
	margin:1em;
	font-size:90%;
	border:thin solid #aaa;
}

#content .comments{
	padding: 3em;
	font-size: 90%;
}

#content .comments .comment-on-this{
float:right;}

#content .comments #comment-form{
	display: none;
}

#content .comments form{
	padding:2em;
	margin:1em;
	border:thin solid #999;
}

#content .comments form label{
	float:left;
}
#content .comments form input, #content .comments form textarea{
	float:right;
	font-family: "Hoefler Text", Garamond, Serif;
	font-size:100%;
	width: 20em;
}
#content .comments form input{

	border: none;
	border-bottom: thin solid #999;
	}
	
#content .comments form textarea{
	border: none;
	background-image: url("../images/lined.png");
	line-height:20px;
}
	
#content .comments form input:focus{
	background-color: #eef;
}

#content .comments form p{
	clear: both;
	margin-bottom: 2em;
	}

#content .comments form .submit input{
	border: thin solid #999;
	width: 5em;
	margin: 1em;
	padding: 0.2em;
	font-style: italic;
}

#content .comments ol{
	clear: both;
	margin-top:3em;
}

#content .comments ol li{
	border-bottom: thin solid #999;
	list-style: none;
	padding:0.5em;
}
#content .comments ol li .author{
	font-variant: small-caps;
	font-size: 120%;
	font-weight: bold;
}
#content .comments ol li .comment{
	width: 20em;
	float: right;
	overflow: hidden;
}

#content .comments ol li br{clear: both}

/* @group Captioned Image */

#content .captionedImage a img, .evenCaptionedImage a img {
	border: none;
}

#content .captionedImage, .evenCaptionedImage{
	padding: 5px;
	margin: 15px;
	clear: both;
}

#content .captionedImage{
	float: right;
}

#content .evenCaptionedImage{
	float: left;
}


#content .captionedImage .caption, .evenCaptionedImage .caption{
	display: block;
	font-size: 80%;
	color: #333;
	text-align: center;
}

/* @end */



#navi{
	height:100%;
	padding: 0;
	margin: 0;
	float:left;
	width:11em;
	border-right:thin solid #ddd;
}

#navi ul{margin:0; padding:0; padding-top:0.5em;}
#navi li{list-style:none; margin:0; font-size:90%; padding: 0; padding-bottom: 0.5em; padding-top: 0.5em}
#navi li li{font-size:90%; margin:0;}
#navi li a{color:#555; text-decoration:none; padding-left:1em; display:block;}
#navi li li a{padding-left:2em;}
#navi div{margin:0; padding-bottom:1em; border-bottom:thin solid #ddd;}
#navi h2{font-size:1em; padding:0.2em; margin: 0; font-weight:normal; color:#999; text-align:center;}

#navi li:hover{background-color:#eef;}
#navi li li:hover{background-color:#ccf;}

/* Web presence icons */
#navi #webpresence ul{margin:0.5em;}
#navi #webpresence li{display: inline; padding:0; margin:0 auto;}
#navi #webpresence a{display:block; float:left;}

#navi #webpresence li a{
	border:1px solid #ddd;
	margin:1px;
	padding: 16px 0 0 0;
    overflow: hidden;
    background-repeat: no-repeat;
    width:16px;
    height: 0px !important;
    height /**/:16px;
}
#navi #webpresence li#delicious a{background-image: url("../images/delicious.png");} 
#navi #webpresence li#djangopeople a{background-image: url("../images/django.png");}
#navi #webpresence li#flickr a{background-image: url("../images/flickr.png");}
#navi #webpresence li#github a{background-image: url("../images/github.png");}
#navi #webpresence li#lastfm a{background-image: url("../images/lastfm.png");}
#navi #webpresence li#linkedin a{background-image: url("../images/linkedin.png");}
#navi #webpresence li#reddit a{background-image: url("../images/reddit.png");}
#navi #webpresence li#facebook a{background-image: url("../images/facebook.png");}
#navi #webpresence li#twitter a{background-image: url("../images/twitter.png");}
#navi #webpresence li#dopplr a{background-image: url("../images/dopplr.png");}
#navi #webpresence li#couchsurfing a{background-image: url("../images/couchsurfing.png");}

#sitemap{
	font-size: 80%;
	clear: both;
	padding-bottom: 2em;
	background-color: #eee;
	border-top:thin dotted #999;
}

#sitemap div{
	width: 16em;
	float:left;
	padding:1em;
	border-right: thin solid #bbb;
	}
#sitemap div h2{padding: 0.5em;}

#sitemap li.photo {float:left; padding: 0.2em;}

#footer{
	/*position:absolute;*/
	clear: both;
	bottom: 0;
	width:100%;
	border-top:thin dotted #555;
	background-color:#ccc;
	font-size:80%;
	margin:0;
	padding:0.5em;
}

#footer div, #footer ul{display:inline;}
#footer #meta{font-style:italic;}
#footer li{ display:inline; padding-left:1em;}



ul.tree-list li{
	list-style: circle inside;
	padding-left:2em;
}


/* Page Specific */


/* Resume */
#resume h2{
	background-color: #aaa;
	color :#fff;
	padding:0;
	padding-top:0.2em;
	padding-left:0.2em;
	font-size:120%;
	margin-top:1em;
	margin-bottom:0.8em;
	border-bottom: 1px solid #999;
	}
#resume ol{list-style: none;}
#resume ol li{
	padding-bottom: 2em;
}

#resume ol ul{
	border-top: 1px solid #ddd;
	clear:both;
	padding-top: 0.5em;
	margin-bottom: 1em;
	}

#resume ul li{
	list-style: circle;
	margin-left: 3em;
	padding-bottom: 0.5em;
}

#resume .minor{font-size: 80%;}
#resume .minor .company{padding:0;}
	
#resume .company{
	font-weight: bold;
	font-size: 110%;
	padding-right: 2em;
	}

#resume .location{
	font-weight: bold;
	font-style: italic;
	font-size: 80%;
	display:none;
}
#resume ol li div{
	float:left;
}
	
#resume span.date{
	display: block;
	font-size: 90%;
	font-style: italic;
	text-align: right;
	float:right;}		

/* Search */
#content .search{
	text-align: center;
	}
	
#content form.search{
	display: block;
	margin: 1em auto;
	width:20em;
	padding: 1em;
	outline:thin solid #bbb;
}

#content form.search input.search_query{width:20em; margin-right:1em;}
#content form.search input.button{width:6em; border:thin solid #999; padding:0.2em;}

/* Archives */

#content .archives h2{clear: both;}
#content .archives li{
	clear:both;
	margin:0.5em; 
	padding:0.5em; 
	border-bottom: 1px solid #999; 
	border-top: 1px solid #999; 
	background-color: #efefef;}
#content .archives li.photo-item a img{width:50px; padding:0;}	
#content .archives li .date{float: right; font-style: italic; font-size: 90%;}
#content .archives br{clear:both;}
#content .archives li.run-item{display:none;}	

/* Sitemap */
ul.by-year h3{font-size: 150%; color: #fff; background-color: #ccc; padding: 0.2em; clear: both;}
ul.by-year ul li{ width: 16em; display:block; float: left; }
ul.by-year ul{ margin-bottom: 1em;}

/* Javascript */
.overlay-image{
	position:fixed;
	width:100%;
	z-index:1000;
	top:0;
	height:100%;
	text-align:center;
}
.overlay-image img{
	padding:2em;
	display:block;
	margin:2em auto;
	background-color:#000;
	max-height:80%;
	}

.greyout{
        position: fixed;
        top: 0;
        left: 0;
        z-index: 90;
        width: 100%;
        height: 10000px;
        background-color: #000;
        filter:alpha(opacity=80);
        -moz-opacity: 0.8;
        opacity: 0.8;
        }


.ie6warning{
	background-color: #f99;
	border: thin solid #f00;
	width:40em;
	margin:1em auto;
	padding:1em;
}