/*  
**********************************************************************
Theme Name: 	WordPress Wechselstoff
Theme URI: 		http://wechselstoff.com/
Description:	
Version: 		1.0
Author:	 		Tobias Vogel
Author URI: 	http://www.wechselstoff.de
Update: 			Light-Bikes - 14. Oktober 2007
**********************************************************************
*/

/*RESET
*************************************************************************************************************************************************** */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input 	{ margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th 						{ font-size: 1em; font-weight: normal; font-style: normal; }

ul,ol 			{ list-style: none; }
fieldset,img 	{ border: none; }
caption,th 		{ text-align: left; }
table 			{ border-collapse: collapse; border-spacing: 0; }
strong			{ font-weight: bold;}

.clear 			{ clear:both; height: 0px; display: block; overflow: hidden; padding: 0; margin: 0;}
.clearer 		{ clear: both; display: block; margin: 0; padding: 0; line-height: 1px; font-size: 1px; height: 15px;}


/*Farben im Dokument
********************* *//*
BACKGROUND-BODY			= 	#808080
BACKGROUND-HEADER		= 	#000088
FONT on dark BG			=	#ccc


*//*Standard
********************* */
body					   {
	font-family: "Lucida Grande", Verdana, Arial, sans-serif; background: #ffffff;
}
div#no_ie				{ display: none; visibility: hidden;}
div#page				   { width: 940px; height: auto; margin: 0 auto;}
div#header				{ background: url(images/header.png) no-repeat; width: 940px; height: 50px; display: block; }
div#banner				{ background: url(images/banner.png) no-repeat; width: 940px; height: 150px; display: block; }
div#container			{ background: url(images/site_bg.png) repeat-y; width: 940px; height: auto; display: block; }
div#footer				{ background: url(images/footer.png) no-repeat; width: 940px; height: 120px; display: block; }
div#content				{ width: 600px; margin-left: 30px; padding-top: 30px; padding-bottom: 30px; display: block; float: left;}

div#sidebar				{ width: 250px; margin-left: 20px; padding-top: 30px; padding-bottom: 30px; display: block; float: left;}
div#sidebar				{ padding-left: 10px;}

small					   { font-size: 10px; font-weight: normal;}

a						   { text-decoration: none;}
a:hover					{ color: #000088 }

/* DOWNLOADBUTTON */
a.downloadbutton 			   { display:block; float:right; font-size: 9px; text-decoration:none; cursor:pointer; overflow: hidden;}
a.downloadbutton			   { margin-top: 3px; line-height: 18px;}
a.downloadbutton:hover 		{ text-decoration:none;}
a.downloadbutton em:after	{ content:"."; display:block; height:0; clear:both; visibility:hidden; }

a.downloadbutton strong		{ display:block; float:left; padding:1px 0 1px; width:34px; text-indent:-99999px; font-weight:normal; }
a.downloadbutton strong		{ font-style:normal; background: url(images/btn_download_left.png) no-repeat 0 center;}
		
a.downloadbutton em			{ display:block; float:left; padding:1px 10px 1px 4px; color:#6a6a6a; font-weight:normal; }
a.downloadbutton em			{ font-style:normal; text-align:center; text-transform: uppercase; }
a.downloadbutton em			{ background: url(images/btn_download_right.png) no-repeat 100% center; }


/* Header
********************* */
div#header				   { font-size: 10px;}
div#header p.header		{ padding-top: 10px; padding-left: 20px; height: 61px;}
div#header a			   { color: #000000;}
div#header a:hover		{ color: #000088;}

/*Buttons*/
div#header ul.header	{ float: left; display: block; margin-left: 10px; margin-top: 106px;}
div#header ul.header li	{ display: block; float: left; height: 23px; background: url(images/button_last.png) no-repeat right top;}
div#header ul.header li	{ font-size: 12px; overflow: hidden;}
	
div#header 
ul.header li a			{	display: block; height: 23px;	background: url(images/button_first.png) no-repeat; color: #000000; padding: 5px 10px 0px 10px;}

div#header ul.header li a:hover	{ background-position: 0 -23px;}
div#header ul.header li:hover	{ background-position: 100% -23px;} 

a#home_button			{ display: block; position: absolute; width: 485px; height: 80px; margin-left: 15px; background: transparent;}
a#home_button			{ text-indent: -9999px; margin-top: 0px; overflow: hidden;}

a#forum_button			{ display: block; position: absolute; width: 125px; height: 100px; margin-left: 760px; background: transparent;}
a#forum_button			{ text-indent: -9999px; margin-top: 0px; overflow: hidden;}

/* INDEX
********************* */
div#content					{ font-size: 10px; color: #424242;}
div#content h2				{ font-size: 18px; padding-bottom: 10px; color: #3E403F; text-align: left;}
div#content h2 a			{ color: #3E403F;}
div#content h2 a:hover	{ color: #000088;}

div.story					{ margin-bottom: 15px; text-align: justify;}
div.story.first 			{ width: 600px; display: block; font-size: 13px; border-bottom: 1px dotted #ccc; padding-bottom: 20px;}
div.story.first h2		{ border-bottom: 5px solid #000088; margin-bottom: 10px; }
div.story.first h3		{ font-size: 16px; font-weight: bold; margin-bottom: 3px; text-align: left; color: #000;}

.postmetadata				{ font-size: 12px; background: #fff; color: #000000; display: block; margin-bottom: 3px;}
.postmetadata				{ padding-top: 2px; padding-bottom: 2px; border: 1px dotted #ccc }
.postmetadata a			{ color: #000000;}
.postmetadata a:hover	{ color: #424242; text-decoration: underline;}

div.story.first img			   { border: 1px solid #ccc; margin-bottom: 5px; max-width: 600px;}
div.story.first a img:hover	{ border-color: #000088;}

div.story.next 				{ display: block; float: left;}
div.story.next h3			   { font-size: 10px; font-weight: bold; margin-bottom: 3px; text-align: left; color: #000;}
div.story.next img			{ border: 1px solid #ccc; margin-bottom: 5px; max-width: 185px;}
div.story.next a img:hover	{ border-color: #000088;}

div.placeholder_next		   { min-height: 260px;}

/* Alte Variante erzeugt aber WC3 Fehler = weil id nur einmail vergeben sein sollte
div#postid_1				{ width: 185px; padding-right: 10px; border-right: 1px dotted #ccc }
div#postid_2				{ width: 185px; padding-left: 10px; padding-right: 10px; border-right: 1px dotted #ccc}
div#postid_3				{ width: 188px; padding-left: 10px; }
*/

div.postid_1				{ width: 185px; padding-right: 10px; border-right: 1px dotted #ccc }
div.postid_2				{ width: 185px; padding-left: 10px; padding-right: 10px; border-right: 1px dotted #ccc}
div.postid_3				{ width: 188px; padding-left: 10px; }

a.inDetails					{ font-weight: bold; color: #000088; line-height: 25px;}
a.inDetails:hover			{ text-decoration: underline;}


/* SIDEBAR NAV
********************* */


#sidebar h3, #sidebar h2 {
	font-size: 10px;
	border-top:4px solid #ddd;
	border-bottom:1px solid #ddd;
	padding:5px 0 5px 2px;
	margin:20px 0 15px 0;
	color:#000088;
	}
div#sidebar					{ border-left: 1px dotted #ccc; font-size: 12px; }
div#sidebar h2				{ font-size: 13px; text-transform: uppercase; color: #000088;}
div#sidebar a				{ color: #000000;}
div#sidebar a:hover			{ color: #000088;}

div#sidebar ul ul			{ margin-bottom: 10px;}				
div#sidebar ul li li		{ display: block; border-bottom: 1px dotted #ccc; padding: 2px 0 2px 10px;}

div#sidebar h4				{ font-size: 12px; color: #999; font-weight: bold;}
div#sidebar p				{ color: #999; font-size: 10px; display: block; padding-top: 10px; padding-bottom: 10px;}
div#sidebar p.bloginfo	{ color: #2F323B;}

div.navigation				   { display: block; width: 600px; height: 30px;}
div.navigation .alignleft	{ width: 300px; float: left; text-align: left;}
div.navigation .alignright	{ width: 300px; float: right; text-align: right;}

div.navigation a			   { padding-left: 2px; padding-right: 2px; border: 1px dotted #999; background: #fff}
div.navigation a			   { color: #000088;}
div.navigation a:hover		{ border-color: #999; text-decoration: none; background: #2F323B; color: #fff}


/* SINGLE
********************* */
div.story.single 			   { width: 600px; display: block; text-align: left; padding-bottom: 10px; font: 1.2em/170% Verdana, Helvetica, sans-serif;}
div.story.single h2			{ border-bottom: 5px solid #000088; margin-bottom: 10px; }
div.story.single h3			{ font-size: 16px; font-weight: bold; margin-bottom: 5px; text-align: left; color: #000; margin-top: 10px;}
div.story.single img		   { border: 1px solid #ccc; margin-bottom: 5px; margin-top: 5px; max-width: 600px;}

.postmetadata.alt			   { padding: 5px; background: #2F323B; border-color: #999; color: #999 }
.postmetadata.alt a			{ color: #999;}
.postmetadata.alt a:hover	{ color: #ccc; text-decoration: underline;}


/* Comments
********************* */
div#comments				   { width: 600px; overflow: hidden;}
div#comments h3#comments	{ font-size: 18px; display: block; padding-top: 25px; padding-bottom: 10px;}
div#comments h3#respond		{ font-size: 18px; display: block; padding-top: 25px; padding-bottom: 10px;}
div#comments textarea		{ width: 600px; }
div#comments input			{ margin-top: 10px; }

/*Comments Speak*/
ol.commentlist li			   { background: url(images/comments/comments_bg.jpg) repeat-y; display: block; width: 580px;}
ol.commentlist li 			{ padding-left: 20px; font-size: 12px; color: #fff;}
ol.commentlist li 			{ padding-right: 20px;}

.commentmetadata				{ display: block; width: 560px;}

ol.commentlist cite			{ display: block; float: right; margin-right: 100px; padding-top: 25px; color: #000; font-size: 15px;}
ol.commentlist cite a		{ color: #999;}
ol.commentlist cite a:hover	{ color: #999;}
ol.commentlist cite.alt		{ float: left; margin-left: 80px; }

.commentmetadata a, ol.commentslist li a { color: #fff;}
.commentmetadata a:hover, ol.commentslist li a:hover { text-decoration: underline;}
ol.commentlist li.comments_top { display: block; background: url(images/comments/comments_top.jpg) no-repeat; height: 10px; width: 600px}
ol.commentlist li#comments_bottom { background: url(images/comments/comments_right.jpg) no-repeat; height: 50px;} 
ol.commentlist li.alt#comments_bottom { background: url(images/comments/comments_left.jpg) no-repeat; height: 50px;}

/* WPG2 alignment classes */ 
.g2image_normal { margin: 4px; } 
.g2image_float_left { float: left; clear: left; margin: 4px; } 
.g2image_float_right { float: right; clear: right; margin: 4px; } 
.g2image_centered { display: block; margin-left: auto; margin-right: auto; }