/**
 * Stylesheet for <Trendwolves>
 * @media	screen, projection
 * @copyright	Netlash <http://www.netlash.com>
 * @author	name <yoni@netlash.com>
 */

/* Typography and text styles */

body {
	font: 300 12px "Lucida Grande", Arial, sans-serif;
	line-height: 1.48; /* Safari 2.0.4 */
	color: #000;
	background: #000 url(../images/background.gif) repeat-x;
}

#container {
	width: 900px;
	margin: 0 auto;
	position: relative;
}

/* Headings and links */

h1, h2, h3, h4 {
	font-weight: 700;
	line-height: 1.1;
	font-family: Arial, sans-serif;
}

h1 a, h2 a, h3 a, h4 a {
	text-decoration: none;
}

h1 {
	font-size: 18px;
}

h2 {
	font-size: 16px;
	padding: 0 0 10px 0;
}

h3 {
	font-size: 14px;
	padding: 10px 0;
}

h4 {
	font-size: 12px;
	padding: 8px 0 0 0;
}

p {
	padding-bottom: 10px;
}

a:link,
a:visited {
	color: #ff3623;
}

a:hover,
a:active {
	color: #333;
}

/* Page structure and layout */

	/* Header */
	
	#header {
		height: 180px;
		position: relative;
	}

	/* Logo */

	#header h1 {
		width: 279px;
		height: 180px;
		background: url(../images/logo.gif) no-repeat;
		text-indent: -9999px;
		float: left;
		position: absolute;
		top: 0;
		left: 20px;
	}

	#header h1 a {
		width: 100%;
		height: 100%;
		display: block;
		overflow: hidden;
	}

	/* Language */

	#language {
		position: absolute;
		top: 0;
		right: 0;
		
	}

	#language li {
		float: left;
		padding: 0 0 0 5px;
	}

	#language li a:link,
	#language li a:visited {
		font-size: 11px;
		color: #f74236;
		text-decoration: none;
		line-height: 19px;
		background: #fff;
		display: block;
		padding: 0 3px;
	}

	#language li a:active,
	#language li a:hover {
		color: #000;
	}

	#language li.active a:link,
	#language li.active a:visited,
	#language li.active a:active,
	#language li.active a:hover {
		color: #fff;
		background: #f74236;
		font-weight: bold;
	}

	/* Navigation */

	#navigation {
		position: absolute;
		top: 129px;
		left: 0;
		width: 100%;
		background: #111111;
	}

	#navigation li {
		float: left;
		border-right: 1px solid #222;
	}

	#navigation li a:link,
	#navigation li a:visited {
		color: #fff;
		text-decoration: none;
		padding: 0 20px;
		line-height: 24px;
		display: block;
	}

	#navigation li a:active,
	#navigation li a:hover {
		color: #f74236;
	}

	#navigation li.active a:link,
	#navigation li.active a:visited,
	#navigaion li.active a:active,
	#navigation li.active a:hover {
		color: #fff;
		background: #ff3623;
		font-weight: bold;
	}

	/* Search */

	#search {
		position: absolute;
		top: 124px;
		right: 0;
		background: #111111;
		border: 1px solid #222222;
	}

	#search input.input_search {
		margin: 5px 0 5px 5px;
		width: 108px;
	}

	#search input.input_submit {
		margin: 5px 5px 5px 0;
	}

	/* Body */

	#content {
		background: #f5f5f5;
	}

	#leftcolumn {
		float: left;
		padding: 25px 20px 40px 20px;
		width: 530px;
	}

	#rightcolumn {
		float: left;
		padding: 25px 20px 40px 20px;
		width: 290px;
	}

	/* Leftcolumn */

	/* Innercontent */

	.innercontent {
		padding: 16px;
		position: relative;
		background: #fff url(../images/body_top.gif) no-repeat;
	}

	.close_innercontent {
		display: block;
		width: 530px;
		height: 5px;
		background: #fff url(../images/body_bottom.gif) no-repeat bottom left;
		margin: 0 0 5px 0;
	}

	.innercontent h2 {
		font-size: 24px;
		padding: 0 100px 10px 0;
	}

	.innercontent a.city:link,
	.innercontent a.city:visited {
		position: absolute;
		top: 16px;
		right: 16px;
		font-size: 15px;
		background: #F74236;
		color: #fff;
		padding: 2px 5px;
		text-decoration: none;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
	}

	.innercontent a.city:hover,
	.innercontent a.city:active {
		background: #c43e34;
	}


	.innercontent .avatar {
		padding: 0 0 10px 0;
	}

	.innercontent .avatar img {
		float: left;
		display: block;
	}

	.innercontent .avatar ul {
		float: left;
		padding: 7px 0 7px 12px;
		line-height: 17px;
	}

	/* Underposttags */

	#leftcolumn .underposttags {
		text-align: right;
		display: block;
		padding: 0 0 10px 0;
	}
	
	#leftcolumn .notoppadding {
		padding: 10px 0;
	}

	#leftcolumn .underposttags li {
		display: inline;
		padding: 0px 5px;
		border-right: 1px solid #000;
	}

	#leftcolumn .underposttags li.last {
		border-right: none;
	}

	#leftcolumn #tags h3 {
		padding: 0 0 10px 0;
	}

	#leftcolumn #tags p.backlink {
		padding: 10px 0 0 10px;
	}

	/* Postcomment form */

	#postcomment {
		padding: 10px 0 20px 0;
	}

	#postcomment h4 {
		font-size: 19px;
		padding: 0 0 15px 0;
	}

	#postcomment label {
		width: 104px;
		display: block;
		float: left;
		text-align: right;
		padding: 0 10px 0 0;
	}

	#postcomment span {
		font-size: 11px;
		color: #444444;
		font-style:italic;
	}

	#postcomment p {
		clear: both;
	}

	#postcomment textarea {
		width: 414px;
	}

	#postcomment input.input_submit {
		margin: 0 0 0 114px;
	}
	
	#postcomment span.form-error {
		display: block;
		color: #FF3623;
	}

	/* Comments */

	#leftcolumn .comment {
		border-bottom: 1px solid #dddddd;
		padding: 20px 0 10px 0;
	}

	#leftcolumn .comment span.light {
		color: #444444;
	}

	#leftcolumn .comment span.dark {
		font-weight: bold;
	}

	/* Rightcolumn */

	#rightcolumn .general_element  {
		padding: 20px 0 10px 0;
	}
	
	#rightcolumn .general_element h3 {
		padding: 0 0 5px 0;
	}
	
	#rightcolumn a.previous:link,
	#rightcolumn a.previous:visited,
	#rightcolumn a.next:link,
	#rightcolumn a.next:visited {
		background: #F74236;
		color: #fff;
		padding: 5px;
		text-decoration: none;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
	}
	
	#rightcolumn a.previous:hover,
	#rightcolumn a.previous:active,
	#rightcolumn a.next:hover,
	#rightcolumn a.next:active {
		background: #c43e34;
	}

	/* Intro */

	#rightcolumn #intro {
		background: #000 url(../images/intro_top.gif) no-repeat;
		color: #fff;
		font-size: 13px;
		padding: 20px 0 0 0;
	}

	#rightcolumn #intro a:link,
	#rightcolumn #intro a:visited {
		color: #fff;
	}

	#rightcolumn #intro a:active,
	#rightcolumn #intro a:hover {
		color: #ff3623;
	}

	#rightcolumn #intro span {
		width: 290px;
		height: 8px;
		display: block;
		background: #f5f5f5 url(../images/intro_bottom.gif) no-repeat;
	}

	#rightcolumn #intro p {
		padding: 0 20px 20px 20px;
	}

	/* Latestcomments */

	#rightcolumn #latestcomments li {
		color: #444444;
	}

	#rightcolumn #latestcomments span.username {
		text-decoration: none;
		font-size: 14px;
		font-weight: bold;
		color: #000;
	}

	/* Blog */
	
	table.datagrid td {
		padding: 3px;
		vertical-align: top;
	}
	
	table.datagrid tbody tr {
		border-bottom: 1px solid #f5f5f5;
	}
	
	#blogarchive-mini {
		padding: 20px 0 10px;
	}
	
	#blogarchive-mini h3 {
		padding: 0 0 5px 0;
	}
	
	#blogarchive-mini li {
		padding: 0 0 0 10px
	}

	/* Search */
	
	div#searchresults {
		padding: 10px 0 0 0;
	}
	
	div#searchresults dt {
		padding: 10px 0 0 0;
	}

	/* Reactions */

	a.reactionlink {
		text-decoration: none;
		color: #000;
	} 

	/* Share */

	div.iconwrapper {
		position: relative;
		top: -5px;
		float: left;
	}

	div.share {
		float: left;
	}

	i.toggleShareList {
		background: #fff;
		padding: 10px;
		font-style: normal; 
		cursor: pointer
	}

	ul.shareList {
		position: absolute;
		top: 27px;
		right: 0;
		min-width: 140px;
		z-index: 999;
		overflow: auto;
		background: #fff;
	}

	ul.shareList li {
		padding: 3px 10px;
		border-bottom: 1px solid #eee;
	}

	ul.shareList a:link {
		display: block;
	}

	ul.sharelist li strong {
		display: hidden;
	}

	/* Pagination */

	div.pagination ul {
		margin: 3px;
		padding: 3px;
	}

	div.pagination li {
		float: left;
		margin: 3px;
		padding: 3px;
		background: #fff;
	}

	/* Image padding */
	
	div.blogpost-content img {
		padding: 10px;
		clear: both;
	}

	/* Footer */

	#footer {
		padding: 20px 10px 20px 20px;
		background: #F5F5F5;
	}

	#footer ul {
		text-align: right;
	}

	#footer li {
		display: inline;
		padding: 0px 10px;
		border-left: 1px solid #000;
	}
	
	#footer li.first {
		border-left: none;
	}

/* Defaults */
.hidden { display: none; }
.block { display: block; }
.nopadding { padding: 0 !important; }
.floatleft { float: left; }
.floatright { float: right; }
.center { text-align: center;}

/* Clearfix */

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}