/*
Theme Name: Evening Sun
Theme URI:http://demo.spectacu.la/evening/
Description: A light, fresh, widget friendly, two column theme particularly suited to ecology and nature blogs, but suitable for a wide range of bloggers.
Version:1.0.4
Author:James R Whitehead (spectacu.la)
Author URI:http://spectacu.la/
Tags: two columns,fixed width,tagging,threaded comments,gravatars,paged comments,widget support

Release: 1.0.4 	Added next and previous post links into the post footer,
				Fixed the comment textarea box so that webkit won't let you expand the box beyond the frame and sorted out the its size in IE.
Release: 1.0.3 	Fixed missing margin from some html elements,
				Fixed slight CSS bug with IE7 and a form border.
				Added: jQuery to squash trackbacks should they get too big.
Release: 1.0.2 	Fixed slight issue with the header alignment. Now using PNG, with IE6 hack, so no need to align.
				Fixed the html to validate as xhtml strict. DOC type is still transitional so as to work with older WPs.
Release: 1.0.1 	Removed an extra link from the footer so as to be allowed into the WP themes repo.
Release: 1.0.0 	Initial release.
*/

@import "typography.css";
* {
	margin:0;
	padding:0;
	outline:0 none;
}

fieldset, form {
	border: 0 none;
}

.clear{ /* 1px prop for opening floated boxs and other fun things. */
	clear:both;
	height:1px;
	width:1px;
	overflow:hidden;
	visibility:hidden
}

.alignright {
	float:right;
	margin:0.2em 0 0.2em 0.75em;
	clear:right
}

.alignleft {
	float:left;
	margin:0.2em 0.75em 0.2em 0;
	clear:left
}

.aligncenter {
	display: block;
	margin: 1em auto;
	clear:both;
	text-align: center;
}

/* Basic layout */
html {
	margin:0;padding:0;
	height: 100%;
	min-width: 950px
}
body{
	/*background:url(images/roots.jpg) repeat-x center 220px transparent;*/
	background:url(images/background.jpg) repeat-x top center #3D2E1F;
	color:#6f6060;
	margin:0;padding:0;
}

#container{
	width:950px;
	margin:0 auto;
	min-height:100%;
	position: relative;
}

	#header{
		height:180px;
		width:950px;
		position: relative;
		top: 0;
		z-index:0;
	}

	#documentBody {
		position: relative;
		padding: 37px 20px 20px;
		margin-bottom: 20px;
		width: 910px;
		background: url(images/content.jpg) no-repeat top center #ffffff
	}
		#navigationBar {
			position:absolute;
			top:10px;
			right:20px;
			width:500px;
			height:20px;
		}

		#content{
			width:600px;
			display:inline;
			float:left;
		}

		#sidebar{
			width:290px;
			margin-left: 620px;
			z-index: 10;
		}

		#footer {
			clear:both;
			text-align:center;
		}
		#footer * {
			color:silver;
		}

/* Header */
#titles{
	padding:20px 0 0 0;
	margin:0;
	position: absolute;
	left: 10px;
}
	#logoImage {
		display: block;
		position: absolute;
		left: 430px;
		top:0;
		background:url(images/sun.png) no-repeat 0 0 transparent;
		width: 464px;
		height: 156px;
	}
	.login a:hover,
	h1#siteTitle a:hover {
		color:#fe6
	}

	.login{
		position:absolute;
		right: 0;
		z-index: 10;
	}

	.login,
	.login a{
		color:#a90;
		font-size:8pt;
		background-color:transparent;
	}

	/* Navigation Bar */

	#headerPages {
		width:500px;
	}

	#headerPages li {
		list-style-type: none;
		display:inline;
		margin-right: 10px;
	}

	#headerRSS {
		position:absolute;
		width: 169px;
		padding-right: 21px;
		height: 20px;
		background: url(images/feed-icon-16x16.gif) no-repeat right center transparent;
		left:0;
		top:0;
	}

	#headerSearcher {
		position: absolute;
		right: 0;
		top: 0;
		height: 20px;
		width:290px;
	}

	#headerSearcher .searchInput {
		border:0 none;
		background-color:transparent;
		width: 226px;
		height: 19px;
		line-height:20px;
		vertical-align:text-top;
		border-bottom: dotted 1px #800;
	}

	#headerSearcher .searchSubmit  {
		line-height:20px;
		height: 16px;
		border: 0 none;
		background-color: transparent;
		background: url(images/search.gif) no-repeat left top transparent;
		position: absolute;
		right: 0;
		top:0;
		width: 64px;
		height: 20px;
	}
	.searchInput {
		color:#999
	}
	.searchForm {position:relative}

.errorMessage {
	position: absolute;
	color: #900;
	background-color: #fff;
	padding: 5px 20px;
	border:solid 1px #990000;
	top: -10px;
	left:-10px;
	font-weight: bold;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
	.searchInput.focused {
		color: #000;
	}

/* Posts */
.postFrame{
	margin-bottom:12px;
	width:600px;
	position:relative;
}

	.postFrameTop,
	.postFrameBottom{
		width:600px;
		height:16px;
		background:url(images/post.gif) no-repeat -1200px 0px transparent;
		display:block;
	}

	.postFrameTop{
		background-position: -600px 0px;
	}


	.postContent{
		background:url(images/post.gif) repeat-y 0 0 white;
		padding:0 10px;
	}
	.commentmetadata  *,
	.commentmetadata,
	.postMeta,
	.postMeta *{
		font-size:8pt;
		color: #999;
	}

	.postBody {
		margin-top: 1em;
		overflow:hidden;
	}

	.postFooter {
		margin-top: 1em;
		padding: 0.5em 10px;
		border-top: solid 1px #ddd;
		border-bottom: solid 1px #ddd;
		background-color: #fffff6;
	}
		.postFooter strong{
			display: block;
		}

		.postFooter .postCategories {
			width: 275px;
			list-style-type:none;
			margin-bottom:0;
			float: left;
		}
		.postFooter .nextPostLink,
		.postFooter .postTags {
			margin-left: 280px;
			/*text-align:right;*/
		}

		.postFooter .postNavigation {
			margin-top: 1em;
			padding-top: 1em;
			border-top: dotted 1px #ccc;
		}

			.postFooter .prevPostLink {
				width: 275px;
				float:left;
			}

/* Post body stuff. */

.pageLinks{
	text-align:right;
	margin-bottom:15px
}

.editMeLink {
	position:absolute;
	right: 1em
}

/* Foot of post/page  section */
#pageNavigation {
	margin-bottom: 1em;
	font-size: 18px;
	line-height:1.5em;
}


#previousPosts  {
	width: 40%;
	float:left
}
#nextPosts {
	margin-left:300px;
	width:300px;
	text-align:right;
}

/* Widgets */
.widget{
	width:290px;
	margin-bottom:12px
}

.widgetCentre,
.widgetTop,
.widgetBottom{
	width:290px;
	height:16px;
	background:url(images/widget.gif) no-repeat -580px 0 transparent;
	display:block;
	color:black;
}

.widgetTop {
	background-position:-290px 0;
}

.widgetCentre{
	background-position:0 0;
	background-repeat:repeat-y;
	width:270px;
	height:auto;
	padding:0 10px;
	overflow:hidden
}

.widget ul li {
	list-style-type: none;
}

.widget ul {
	margin-left: 16px;
	list-style-type: none;
}

.expandToggle {
	cursor:pointer;
	display:inline-block;
	position:relative;
	left:-16px;
	margin-right: -10px;
	height: 10px;
	width: 10px;
	background: url(images/plusminus.gif) no-repeat 0 0 transparent;
	overflow:hidden;
}
.expandToggle.active {
	background-position: 0 -9px;
}


/* Some of the default widgets need a little bit of attention */
table#wp-calendar{
	margin:0 auto 10px auto
}

table#wp-calendar th{
	width: 25px
}

table#wp-calendar tr{
	height: 25px;
	line-height:2em;
	text-align:center
}

table#wp-calendar td{
	border:solid 1px #f3f3f3;
	color: silver;
	background-color:white;
	padding:0;
	margin:0
}

table#wp-calendar td a{
	background-color: #f3f3f3;
	color:#608D3D;
	display: block;
	line-height: 2.1em;
	width:100%;
	height:2.1em
}

table#wp-calendar td a:hover{
	color:black;
	background-color: silver
}

table#wp-calendar td.pad{
	border:0
}

table#wp-calendar caption{
	font-size:18pt;
	margin:0 auto 10px auto
}

div.widget_calendar h3{
	display:none
}

/* Comments */
#commentsBlock {margin-top: 26px;}
#commentlist li {list-style-type: none;}
#commentlist li.depth-1{width: 580px;}
#commentlist li.depth-1 li {margin-left: 20px; }

#commentlist ul ul {
}
#commentlist li > div {
	padding: 5px;
	border: solid 1px;
	margin-bottom: 1em;
}

#commentlist li.even > div {		background-color: #ffffff;}
#commentlist li.odd > div {			background-color: #efefef;}
#commentsBlock li.bypostauthor > div:first-child .avatar {border:solid 2px #aa0;padding:1px;background-color:#fff;}

#commentlist .toggle {
	cursor:pointer;
	border:solid 1px;
	background-color: #eeeeff;
	padding: 5px;
	line-height: 16px;
	margin-bottom: 1em;
}
#commentlist .toggle span.posterName {
	font-weight:bold;
	font-style:oblique;
}

#commentlist .depth-1 div,
#commentlist .depth-2 div  {border-color:#ddd}
#commentlist .depth-3 div  {border-color:#aa0}
#commentlist .depth-4 div  {border-color:#0a0}
#commentlist .depth-5 div  {border-color:#00a}
#commentlist .depth-6 div  {border-color:#aa0}
#commentlist .depth-7 div  {border-color:#0a0}
#commentlist .depth-8 div  {border-color:#00a}
#commentlist .depth-9 div  {border-color:#aa0}
#commentlist .depth-10 div {border-color:#0a0}

#commentlist .depth-2  .toggle {background-color:#ffd;border-color:#aa0}
#commentlist .depth-3  .toggle {background-color:#dfd;border-color:#0a0}
#commentlist .depth-4  .toggle {background-color:#ddf;border-color:#00a}
#commentlist .depth-5  .toggle {background-color:#ffd;border-color:#aa0}
#commentlist .depth-6  .toggle {background-color:#dfd;border-color:#0a0}
#commentlist .depth-7  .toggle {background-color:#ddf;border-color:#00a}
#commentlist .depth-8  .toggle {background-color:#ffd;border-color:#aa0}
#commentlist .depth-9  .toggle {background-color:#dfd;border-color:#0a0}
#commentlist .depth-10 .toggle {background-color:#ddf;border-color:#00a}

#trackbackList { margin-left: 2em;}
#trackbackList .says {display:none}
#trackbackList li { margin-bottom: 1em;}

.trackbackToggle {
	display:block;
	margin: 1em 0;
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	padding: 0.5em 1em;
	cursor:pointer;
	background-color:#FFFFF6;
}

.vcard { font-size: 16px; }
.avatar {
	float: left;
	margin-right: 5px;
}
.comment div.commentmetadata {
	margin-bottom: 5px;
}
.comment div.reply {
	width:100%; /*IE7 FIX*/
}

.comment div.reply a {
	text-align:right;
	padding-right: 21px;
	overflow:hidden;
	background-color:#666;
	display:block;
	height: 16px;
	margin-top: 5px;
	background: url(images/reply.gif) no-repeat 100% 0 transparent;
}
.comment div.reply a:hover {
	background-position: 100% -16px;
}

.toggle span.upArrow {
	width: 16px;
	height: 16px;
	margin-left: 10px;
	display: inline-block;
	overflow: hidden;
	background: url(images/uparrow.gif) no-repeat 0 0 transparent;
}
.toggle:hover span.upArrow { /* This'll fail in IE6. */
	background-position: 0 -16px;
}

#commentPagination {
	text-align:right;
	font-size: larger
}

#commentForm { margin-top: 20px}
#commentForm label {font-weight:bold;display:inline}
#author, #email, #url, #comment {
	border: solid 1px #ddd;
	margin-bottom: 10px;
	vertical-align: text-top;
	width: 50%;
}
#author, #email, #url{
	margin-right:10px;
}


#comment {width: 580px;max-width: 580px;}
body.ie #comment {width: 577px;}

.commentSubmit {text-align: right;}
.commentSubmit a {color: #900;margin-right:2em;}
.commentSubmit a:hover {color: #f00;}

.wp-caption {
	padding: 5px 0;
	text-align:center;
	border: solid 1px #eee;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.wp-caption img {
	margin: 0;
}

p.wp-caption-text{
	font-size: 10px;
	margin: 0;
	padding: 0.25em 0 0 0;
}