/*

Theme Name: Grassland

Theme URI:http://www.spectacu.la/grassland/

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:2.0.0

Author:James R Whitehead (spectacu.la)

Author URI:http://spectacu.la/

Tags: green, brown, blue, white, light, two-columns, fixed-width, threaded-comments



Release: 2.0 	Added new features, visuals and GPL license.

*/



















@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;

	background:url(images/background.gif) repeat-x left top #604830;

	height: 100%;

	min-width: 950px;

}

body{

	color:#000000;

	margin:0;padding:0;

	background:url(images/sun.jpg) no-repeat top center transparent;

}

#layer1 {

	background:url(images/background.png) repeat-x center 105px transparent;

}



#container{

	width:950px;

	margin:0 auto;

	min-height:100%;

	position: relative;

}



	#header{

		height:147px;

		width:950px;

		position: relative;

		top: 0;

		z-index:0;

	}



	#documentBody {

		position: relative;

		padding: 42px 20px 20px;

		margin-bottom: 20px;

		width: 910px;

		background: url(images/content.gif) no-repeat top center transparent

	}

		#navigationBar {

			position:absolute;

			top:10px;

			right:20px;

			width:415px;

			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:#000000;

		}



/* Header */

#titles{

	padding:20px 0 0 0;

	margin:0;

	position: absolute;

	left: 10px;

}

	.login a:hover,

	h1#siteTitle a:hover {

		color:#fe6

	}



	.login{

		position:absolute;

		right: 0;

		z-index: 10;

	}



	.login,

	.login a{

		color:#666666;

		font-size:8pt;

		background-color:transparent;

	}



	/* Navigation Bar */



	#headerPages {

		width:400px;

	}



	#headerPages li {

		list-style-type: none;

		display:inline;

		margin-right: 10px;

	}



	#headerRSS {

		position:absolute;

		width: 70px;

		height: 70px;

		left:10px;

		top:-45px;

	}



	#headerSearcher {

		position: absolute;

		right: 0;

		top: 0;

		height: 20px;

		width:290px;

		background: url(images/searchtext.gif) no-repeat left top transparent;

	}



	#headerSearcher .searchInput {

		border:0 none;

		padding: 2px 10px;

		overflow:hidden;

		background-color:transparent;

		width: 250px;

		height: 16px;

	}



	#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: 20px;

		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:24px;

	width:600px;

	position:relative;

	overflow:hidden;

}



	.postFrameTop,

	.postFrameBottom{

		width:600px;

		height:16px;

		background:url(images/post.png) no-repeat -1200px 0px transparent;

		display:block;

	}



	.postFrameTop{

		background-position: -600px 0px;

	}





	.postContent{

		background:url(images/post.png) repeat-y 0 0 white;

		padding:0 12px 12px 12px;

		width:576px;

	}

	.commentmetadata  *,

	.commentmetadata,

	.postMeta,

	.postMeta *{

		font-size:8pt;

		color: #999;

	}



	.postBody {

		padding-top: 0.5em;

		clear:both;

	}



	.postFooter {

		margin-top: 1em;

		padding: 0.5em 0 50px;

		background-color: #fffff6;

		background:url(images/post-footer.jpg) no-repeat center bottom white;

	}

	.postFooter .postCategories {

		width: 280px;

		list-style-type:none;

		margin-bottom:0;

		float: left;

	}



	.postFooter .postTags {

		margin-left: 290px;

	}

	.postFooter strong{

		display: block;

	}



/* Post body stuff. */



.editMeLink {

	position:relative;

	left:4em

}



/* Foot of post/page  section */

#pageNavigation {

	margin-bottom: 1em;

	font-size: 18px;

	line-height:1.5em;



}

#pageNavigation a {

	color: #fe3;

	text-decoration:none;

}

#pageNavigation a:hover {

	color: #fec;

	text-decoration:underline;

}





#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.png) no-repeat -580px 0 transparent;

	display:block;

	color:black;

}



.widgetTop {

	background-position:-290px 0;

}



.widgetCentre{

	overflow:hidden;

	background-position:0 0;

	background-repeat:repeat-y;

	width:270px;

	height:auto;

	padding:0 10px;

}



.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: 9px;

	width: 9px;

	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: 16px;}

#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;}



.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;

}



#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: 572px; background: url(images/leaf.jpg) no-repeat 98% 95% #fff; max-width: 572px;}

.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;

}





div.postDate{

	width: 50px;

	height:60px;

	position: relative;

	top:-4px;

	float:right;

	background:url(images/calendar.gif) no-repeat center center white

}

span.postMonth{

	display:block;

	width:50px;

	text-align:center;

	position:absolute;

	top: 1px;

	color:white;

	font-weight: bold;

	background-color:transparent

}

span.postDay{

	line-height:60px;

	font-size:22pt;

	display:block;

	width:48px;

	height:60px;

	position:absolute;

	letter-spacing:-2px;

	text-align:center;

	font-weight: 900;

	z-index:10;

	top:3px;

	color: #000;

}

span.postYear{

	display:block;

	width:50px;

	text-align:center;

	position:absolute;

	bottom:0;

	font-weight: 900;

	bottom: 2px;

	font-size: 7.5pt;

	color: #000;

}



input.submit {

	border: 0 none;

	color: #fff;

	font-weight: bold;

	padding: 1px 10px;

	background: url(images/submit.gif) repeat-x left top #000;

}



/* Pagination */



.pageLinks {

	text-align:right

}



#commentPagination, .pageNavigationLinks {

	clear:both;

	text-align: center;

	padding: 1em 0 2em;

}

.page-numbers {

	line-height: 26px;

	height: 26px;

	min-width: 20px;

	padding: 0 3px;

	margin-right: 2px;

	display: inline-block;

	text-align:center;

	text-decoration:none;

	-moz-border-radius: 2px;

	-webkit-border-radius: 2px;



	background-color: #fff;

	color:#000;

}



a.page-numbers:focus,

a.page-numbers:hover {

	background-color: #ccc;

	color: #333;

}



span.dots,

a.prev, a.next {

	background-color:transparent;

	color: #fff;

}



a.prev, a.next {

	font-size: 200%;

	vertical-align:top;

}



a.prev:focus,

a.next:focus,

a.prev:hover,

a.next:hover {

	color:#ccc;

	background-color:transparent;

}



.current {

	background-color:#ccc;

	color:#999;

}



/*////////////////////*/



.pageLinks .page-numbers,

#commentPagination span.current {

	background-color:#eee;

	color:#ccc;

}



.pageLinks a {text-decoration:none}



.pageLinks a .page-numbers,

#commentPagination .page-numbers {

	color:#5E882F;

	background-color: #ddd;

}

#commentPagination span.dots,#commentPagination a.prev,#commentPagination a.next {

	background-color:transparent;

	color: #333;

}

.pageLinks a:hover .page-numbers,

#commentPagination a.page-numbers:focus,

#commentPagination a.page-numbers:hover {

	background-color: #5E882F;

	color: #fff;

}



#commentPagination a.prev:focus,

#commentPagination a.next:focus,

#commentPagination a.prev:hover,

#commentPagination a.next:hover {

	background-color:transparent;

	color:#5E882F;

}



.rssscroller {height:200px}



#navigation{

	background: #fff;

	color: white;

	float: left;

	height: 52px;

	padding: 12px 0px 0px 15px;

}



#navigation ul li{

	display: block;

	float: left;

	height: 41px;

	margin-left: 9px;

}



#navigation ul li a{

	background-color: green;

	color: white;

	display: inline-block;

	font-size: 14px;

	height: 27px;

	padding: 14px 0 0;

	text-align: center;

	text-transform: capitalize;

	width: 107px;

	text-decoration: none;

}



#navigation ul li a:hover,#navigation ul li.current_page_item a{

	background-color: blue;

	color: white;

	font-weight: 700;

	text-decoration: none;

}



#companyinfo{

    background-color: white;

	float: left;

	padding: 12px 0px 0px 15px;

	width: 880px;

    }

	

#checkmarklist ul{

list-style-image: url(images/check.png);

}

      




