/*
Theme Name: J.B.O.
Theme URI: http://www.jbo.de/
Description: Theme für jbo.de
Version: 1.0
Author: Carsten Dobschat
Author URI: http://dobschat.de/
Tags: jbo, pink

*/



/* Allgemeines Styling
----------------------------------------------- */
body {
	margin:				0;
	padding:			0;
	background:			url(/_images/bg_pattern.jpg) 0px 0px repeat-y #000;
	color:				#fff;
	/* Schriftattribute werden im Selektor #content definiert! */
}


img {
	border:				0px;
}

#wrapper {
	position:			absolute;
	top:				0px;
	left:				0px;
	width:				932px;
	height:				763px;
	background:			url(/_images/mauer.jpg) no-repeat #000;
	color:				#fff;
}


#logo {
	position:			absolute;
	top:				24px;
	left:				49px;
	width:				306px;
	height:				148px;	
}


#poster {
	position:			absolute;
	top:				0px;
	left:				597px;
	width:				319px;
	height:				282px;	
}


#english {
	position:			absolute;
	top:				20px;
	left:				483px;
	width:				63px;
	height:				40px;
}


#english a, #logo a {
	/* Behebt einen Layoutbug in Opera 8.5 */
	display:block;
}


#content {
	position:			absolute;
	top:				300px;
	left:				340px;
	width:				560px;
	height:				auto;
	background:			#000;
	color:				#fff;
	font-size:			14px;
	font-family:		Arial,Helvetica,sans-serif;
	line-height:		125%;
}


#sdmain {
	/* Abstand des Inhalts zum unteren Fensterrand. */
	padding:			0 0 10px 0;
}


#sdmain div#googlemap {
	width: 560px;
	font-size: 0.8em;
	color: #000;
	background: #fff;
}

#sdmain div#googlemap a {
	background: #fff;
}


/* Content-Styling
----------------------------------------------- */
#fotosidebar {
	/* Die Fotos auf den Band-Seiten */
	font-size:			0.8em;
	padding:			0 10px 0 10px;
	margin:				0 10px 0 10px;
	position:			relative;
	width:				200px;
	height:				auto;
	float:				right;
	/*
	border:				dotted 1px #fff;
	*/
}


#fotosidebar p {
	/* Gibt den P-Tags im Foto-DIV auf der Seite nur einen Abstand nach unten. */
	padding:			0;
	margin:				0 0 10px 0;
}


.funktion {
	/* Zum Beispiel "Vokalmasochismus" auf Hannes' Einzel-Bio. */
	font-style:			italic;
}


#cdsidebar {
	/* Auf den Werke-Seiten die Box mit Links zu Amazon und iTunes */
	font-variant:		normal;
	font-size:			0.8em;
	text-decoration:	none;
	visibility:			visible;
	padding:			5px;
	margin:				5px;
	position:			relative;
	width:				210px;
	height:				auto;
	float:				right;
	border:				dotted 1px #fff;
}


.coverbild {
	/* Rahmen um die CD-Covers auf den einzelnen Werke-Seiten und der Werke-Uebersichtsseite. */
	border:				1px solid #999;
}


.cv-frage {
	/* Styling der Fragen in den Einzel-Bios. */
	font-weight:		bold;
	padding:			15px 0 0 0;
	margin:				0;
}


.cv-antwort {
	/* Styling der Antworten in den Einzel-Bios. */
	padding:			0;
	margin:				0;
}


.li-margin-on li {
	/* Abstand zwischen Aufzaehlungpunkten (gut geeignet, wenn es mehrzeiligen Text in den einzelnen Punkten gibt; dient der Uebersicht) */
	margin-top:			15px;
}


.li-margin-off li {
	/* Stellt den Abstand wieder ab, falls man in einer verschachtelten Liste einmal keinen Abstand mehr braucht. Beispiel: Englische Band-Bio */
	margin-top:			0px;
}


.link_section {
	/* Abstand der Zwischenueberschriften auf der Link-Seite nach oben (z.B. "Ausstatter"). Kommt auch einmal in der englischen Bio zum Einsatz. */
	margin-top:			40px;
}


h4 {
	/* Entfernung des unteren Abstands zum Nachfolgerelement. Workaround, da adjacent sibiling selectors in IE6 nicht funktionieren.
	h4 wird beispielsweise im Fliesztext der Kontaktseite und der band/index.html verwendet. */	
	padding:			30px 0 0 0;
	margin-bottom:		0;
}

.adjacent {
	/* Entfernung des oberen Abstands zum Vorgaengerelement. Workaround, da adjacent sibiling selectors in IE6 nicht funktionieren. */
	padding-top:		0;
	margin-top:			0;
	padding-bottom:		0;
	margin-bottom:		0;
}


address {
	/* Adressen, z.B. auf der Kontaktseite */
	padding-top:		0;
	margin-top:			0;
	font-style:			normal;
}


#subnavi {
	position:			absolute;
	top:				235px;
	left:				340px;
	width:				250px;
	height:				auto;
	background:			#000;
	color:				#fff;
	font-size:			14px;
	font-family:		Arial,Helvetica,sans-serif;
	line-height:		125%;
}



.anmerkung {
	font-style:			italic;
}



.pressefoto {
	/* Auf band/fotos.html fuer die Thumbnails */
	float:				left;
	width:				200px;
	margin:				0 10px 40px 0;
}

.pressefoto_container {
	clear:				both;
	padding:			5px;
	border:				1px dashed #999;
	/* Da das Foto mit float aus dem Fluss genommen wird, ist die Box nur so gross wie der enthaltene Text. Daher muss height in band/foto.html direkt im jeweiligen DIV-Container angegeben werden, damit der Rahmen korrekt dargestellt wird. */
}


.fotograf {
	font-size:			0.8em;
	color:				#999;
}


#termine h4 {
	margin:				20px 10px 0 0;
	width:				100%;
	border-bottom:		1px dashed #999;
}


#termine table {
	margin:				0 0 0 15px;
}




/* Guestbook
----------------------------------------------- */
.gb_header,.gb_footer {
	margin:				0 0 20px 0;
}


.gb_entry {
	padding:			20px 0 0 20px;
}


.gb_number {
	margin:				0;
	font-size:			2.4em;
	font-style:			italic;
	color:				#333;
	margin:				0 0 0 -20px;
	padding:			0 0 5px 0;
}


.gb_more {
	/* Styling des Links fuer aeltere Eintraege. */
	text-align:			right;
}


.gb_entry {
	/* Ein einzelner Gaestebuch-Eintrag. */
	margin:				0 0 50px 0;
}


.gb_name {
	/* Darstellung des Namens in einem GB-Eintrag. */
	padding:			0;
	margin:				0;
}


.gb_mail {
	/* Darstellung der Mail-Adresse des Autors. */
}


.gb_date {
	/* Darstellung des Datums des GB-Eintrags. */
	padding:			0;
	margin:				0;	
	font-size:			0.8em;
	color:				#999;
}


.gb_text {
	/* Darstellung des Texts im GB-Eintrag. */
	padding:			0;
	margin:				0;		
}


.gb_form {
	/* Das komplette Eingabeformular im GB. */
	
}


.gb_row1 {
	/* Formatierung der ersten Spalte des Eingabeformulars. */
	text-align:			right;
	vertical-align:		top;
	width:				50px;
	padding:			0 5px 0 0;
}


#gb_form_name {
	/* Eingabe des Namens */
}


#gb_form_mail {
	/* Eingabe der Mail-Adresse */
}


#gb_form_text {
	/* Eingabe des Textes */
	font-size:			1.2em;
}




/* News
----------------------------------------------- */
.articlebox {
	padding:			0;
	margin:				50px 0 0 0;
}


.articlehead3,.articlenotes {
	padding:			0;
	margin:				0;
}


.articlemore {
	padding:			0;
	margin:				0;
	text-align:			right;
	font-size:			0.8em;
}


.articlemaintext {
	padding-bottom:		0;
	margin-bottom:		0;
}


.articlesubhead {
	padding:			0;
	margin:				0;
	font-size:			0.8em;
	color:				#999;
}


p.postmetadata {
	font-size: 0.8em;
}

/* Pseudo-Klassen
----------------------------------------------- */
a:link {
	color:				#CB398C;
	background:			#000;
	text-decoration:	underline;
}


a:visited {
	color:				#999;
	background:			#000;
	text-decoration:	underline;
}


a:hover {
	color:				#f00;
	background:			#000;
	text-decoration:	underline;
}


a:active {
	color:				#f00;
	background:			#000;
	text-decoration:	underline;
}


/* Podcast */
.box {
float: left;
width: 215px;
padding-right: 18px;
padding-bottom: 15px;
}

p.author {
border-top: 1px dotted black;
clear: both;
width: 669px;
margin-bottom: 1.2em;
padding-top: 0.4em;
}



.audiobox {
float: left;
width: 200px;
font-size: 11px;
}

.audiobox a, .audiobox a:link, .audiobox a:visited , .audiobox a:hover, .audiobox a:active {
	text-decoration: none;
}
#content dd {
padding: 0 0 12px 12px;
}
#content dt {
font-weight: bold;
}

#prevnext {
background: url(http://www.jbo.de/jbo-podcast/loudblog/custom/contentbottom.png) left bottom no-repeat;
text-align: center;
padding: 1em 16px 2em 0;
}

#prevnext p {
margin: 0;
padding: 0;
font-weight: bold;
}

h3#commentheadline {
margin-top: 30px;
}

#commentlist h4 {
margin: 5px 0 7px 0;
}

ol#commentlist {
list-style: none;
}

ol#commentlist li {
width: 600px;
overflow: hidden;
margin: 0 0 1.5em 0;
list-style: none;
}

#commentlist li div {
float: left;
width: 150px;
padding: 6px;
margin-right: 10px;
}

form {
border-top: 1px dotted black;
padding-top: 1.2em;
margin-top: 1.2em;
/* width: 667px; */
}

div.input {
width: 222px;

}

label {
display: block;
font-weight: bold;
margin-bottom: 0.5em;
}

div.input input {
width: 212px;
}

div#message {
width: 320px; 

margin-top: 1.2em;
}

div#message textarea {
width: 310px;
height: 120px;
}

div#file {
width: 330px;

margin-top: 1.2em;
}

div#file input {
width: 320px;
}

div#buttons {
width: 330px;

margin-top: 35px;
overflow: hidden;
}

div#buttons input {
width: 160px;

}

div#footer {
	font-size: 0.8em;
	border-top: 2px dotted white;
	text-align: center;
	margin-top: 10px;
	padding-top:5px;
	padding-bottom: 40px;
}


/* Allgemein, Position der Navi [Anfang] */
#navi { position: absolute; left:6px; top:180px; width:154px; height:800px; z-index:90; text-indent:-9999px; }
/* Allgemein, Position der Navi [Ende] */

div#navi ul li a { display:block; width:100%; height:100%; text-indent:-9999px; text-decoration:none; }



/* band [Anfang] */
#navi_band { position:absolute; left:0px; top:0px; width:154px; height:70px; background: url("/_images/navi/band.jpg") no-repeat; list-style-type:none; }

li#navi_band a:link { background: url("/_images/navi/band.jpg") no-repeat; width:100%; height:100%; }

li#navi_band a:visited { background: url("/_images/navi/band.jpg") no-repeat; width:100%; height:100%; }

li#navi_band a:hover { background: url("/_images/navi/band_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_band a:active { background: url("/_images/navi/band_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_band_active { position:absolute; left:0px; top:0px; width:154px; height:70px; background: url("/_images/navi/band_f2.jpg") no-repeat; list-style-type:none; }

li#navi_band_active a { background: url("/_images/navi/band_f2.jpg") no-repeat; width:100%; height:100%; }
/* band [Ende] */



/* werke [Anfang] */
#navi_werke { position:absolute; left:0px; top:70px; width:154px; height:54px; background: url("/_images/navi/werke.jpg") no-repeat; list-style-type:none; }

li#navi_werke a:link { background: url("/_images/navi/werke.jpg") no-repeat; width:100%; height:100%; }

li#navi_werke a:visited { background: url("/_images/navi/werke.jpg") no-repeat; width:100%; height:100%; }

li#navi_werke a:hover { background: url("/_images/navi/werke_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_werke a:active { background: url("/_images/navi/werke_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_werke_active { position:absolute; left:0px; top:70px; width:154px; height:54px; background: url("/_images/navi/werke_f2.jpg") no-repeat; list-style-type:none; }

li#navi_werke_active a { background: url("/_images/navi/werke_f2.jpg") no-repeat; width:100%; height:100%; }
/* werke [Ende] */



/* news [Anfang] */
#navi_news { position:absolute; left:0px; top:124px; width:154px; height:56px; background: url("/_images/navi/news.jpg") no-repeat; list-style-type:none; }

li#navi_news a:link { background: url("/_images/navi/news.jpg") no-repeat; width:100%; height:100%; }

li#navi_news a:visited { background: url("/_images/navi/news.jpg") no-repeat; width:100%; height:100%; }

li#navi_news a:hover { background: url("/_images/navi/news_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_news a:active { background: url("/_images/navi/news_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_news_active { position:absolute; left:0px; top:124px; width:154px; height:56px; background: url("/_images/navi/news_f2.jpg") no-repeat; list-style-type:none; }

li#navi_news_active a { background: url("/_images/navi/news_f2.jpg") no-repeat; width:100%; height:100%; }
/* news [Ende] */



/* tour [Anfang] */
#navi_tour { position:absolute; left:0px; top:180px; width:154px; height:46px; background: url("/_images/navi/tour.jpg") no-repeat; list-style-type:none; }

li#navi_tour a:link { background: url("/_images/navi/tour.jpg") no-repeat; width:100%; height:100%; }

li#navi_tour a:visited { background: url("/_images/navi/tour.jpg") no-repeat; width:100%; height:100%; }

li#navi_tour a:hover { background: url("/_images/navi/tour_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_tour a:active { background: url("/_images/navi/tour_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_tour_active { position:absolute; left:0px; top:180px; width:154px; height:46px; background: url("/_images/navi/tour_f2.jpg") no-repeat; list-style-type:none; }

li#navi_tour_active a { background: url("/_images/navi/tour_f2.jpg") no-repeat; width:100%; height:100%; }
/* tour [Ende] */




/* gb [Anfang] */
#navi_gb { position:absolute; left:0px; top:226px; width:154px; height:47px; background: url("/_images/navi/gb.jpg") no-repeat; list-style-type:none; }

li#navi_gb a:link { background: url("/_images/navi/gb.jpg") no-repeat; width:100%; height:100%; }

li#navi_gb a:visited { background: url("/_images/navi/gb.jpg") no-repeat; width:100%; height:100%; }

li#navi_gb a:hover { background: url("/_images/navi/gb_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_gb a:active { background: url("/_images/navi/gb_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_gb_active { position:absolute; left:0px; top:226px; width:154px; height:47px; background: url("/_images/navi/gb_f2.jpg") no-repeat; list-style-type:none; }

li#navi_gb_active a { background: url("/_images/navi/gb_f2.jpg") no-repeat; width:100%; height:100%; }
/* gb [Ende] */



/* store [Anfang] */
#navi_store { position:absolute; left:0px; top:273px; width:154px; height:51px; background: url("/_images/navi/store.jpg") no-repeat; list-style-type:none; }

li#navi_store a:link { background: url("/_images/navi/store.jpg") no-repeat; width:100%; height:100%; }

li#navi_store a:visited { background: url("/_images/navi/store.jpg") no-repeat; width:100%; height:100%; }

li#navi_store a:hover { background: url("/_images/navi/store_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_store a:active { background: url("/_images/navi/store_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_store_active { position:absolute; left:0px; top:273px; width:154px; height:51px; background: url("/_images/navi/store_f2.jpg") no-repeat; list-style-type:none; }

li#navi_store_active a { background: url("/_images/navi/store_f2.jpg") no-repeat; width:100%; height:100%; }
/* store [Ende] */



/* fans [Anfang] */
#navi_fans { position:absolute; left:0px; top:324px; width:154px; height:53px; background: url("/_images/navi/fans.jpg") no-repeat; list-style-type:none; }

li#navi_fans a:link { background: url("/_images/navi/fans.jpg") no-repeat; width:100%; height:100%; }

li#navi_fans a:visited { background: url("/_images/navi/fans.jpg") no-repeat; width:100%; height:100%; }

li#navi_fans a:hover { background: url("/_images/navi/fans_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_fans a:active { background: url("/_images/navi/fans_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_fans_active { position:absolute; left:0px; top:324px; width:154px; height:53px; background: url("/_images/navi/fans_f2.jpg") no-repeat; list-style-type:none; }

li#navi_fans_active a { background: url("/_images/navi/fans_f2.jpg") no-repeat; width:100%; height:100%; }
/* fans [Ende] */



/* links [Anfang] */
#navi_links { position:absolute; left:0px; top:377px; width:154px; height:54px; background: url("/_images/navi/links.jpg") no-repeat; list-style-type:none; }

li#navi_links a:link { background: url("/_images/navi/links.jpg") no-repeat; width:100%; height:100%; }

li#navi_links a:visited { background: url("/_images/navi/links.jpg") no-repeat; width:100%; height:100%; }

li#navi_links a:hover { background: url("/_images/navi/links_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_links a:active { background: url("/_images/navi/links_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_links_active { position:absolute; left:0px; top:377px; width:154px; height:54px; background: url("/_images/navi/links_f2.jpg") no-repeat; list-style-type:none; }

li#navi_links_active a { background: url("/_images/navi/links_f2.jpg") no-repeat; width:100%; height:100%; }
/* links [Ende] */



/* kontakt [Anfang] */
#navi_kontakt { position:absolute; left:0px; top:431px; width:154px; height:43px; background: url("/_images/navi/kontakt.jpg") no-repeat; list-style-type:none; }

li#navi_kontakt a:link { background: url("/_images/navi/kontakt.jpg") no-repeat; width:100%; height:100%; }

li#navi_kontakt a:visited { background: url("/_images/navi/kontakt.jpg") no-repeat; width:100%; height:100%; }

li#navi_kontakt a:hover { background: url("/_images/navi/kontakt_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_kontakt a:active { background: url("/_images/navi/kontakt_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_kontakt_active { position:absolute; left:0px; top:431px; width:154px; height:43px; background: url("/_images/navi/kontakt_f2.jpg") no-repeat; list-style-type:none; }

li#navi_kontakt_active a { background: url("/_images/navi/kontakt_f2.jpg") no-repeat; width:100%; height:100%; }
/* kontakt [Ende] */


/* datenschutz [Anfang] */
#navi_datenschutz { position:absolute; left:0px; top:474px; width:154px; height:34px; background: url("/_images/navi/datenschutz.jpg") no-repeat; list-style-type:none; }

li#navi_datenschutz a:link { background: url("/_images/navi/datenschutz.jpg") no-repeat; width:100%; height:100%; }

li#navi_datenschutz a:visited { background: url("/_images/navi/datenschutz.jpg") no-repeat; width:100%; height:100%; }

li#navi_datenschutz a:hover { background: url("/_images/navi/datenschutz_f2.jpg") no-repeat; width:100%; height:100%; }

li#navi_datenschutz a:active { background: url("/_images/navi/datenschutz_f2.jpg") no-repeat; width:100%; height:100%; }

/* Aktuelle Seite */
li#navi_datenschutz_active { position:absolute; left:0px; top:474px; width:154px; height:34px; background: url("/_images/navi/datenschutz_f2.jpg") no-repeat; list-style-type:none; }

li#navi_datenschutz_active a { background: url("/_images/navi/datenschutz_f2.jpg") no-repeat; width:100%; height:100%; }
/* datenschutz [Ende] */


#navi_social { position: absolute; top: 720px; left: 20px; z-index: 150; height: 42px; width: 140px; }
#navi_social a:link { background: transparent; }
#navi_social a:visited { background: transparent; }
#navi_social a:hover { background: transparent;  }
#navi_social a:active { background: transparent; }
#navi_social a:link img { background: transparent; margin: 3px; }
#navi_social a:visited img { background: transparent; margin: 3px; }
#navi_social a:hover img { background: transparent; margin: 3px; }
#navi_social a:active img { background: transparent; margin: 3px; }




img.alignright {
	float: right;
}

img.aligncenter {
	margin-left: auto;
	margin-right: auto;
}

div.rheight33 {
	display: inline;
}


