/*  
Theme Name: Labbe Zzzebra
(c)2009 Labbé Verlag 

{{Zzzebra }}
82a5ce - Zzz Blau Standard
e4eef6 - Hellblau aus Zzz Hintergrund
c7d9e8 - Mittelblau aus Zzzz Hintergrund
1a6da5 - Testweise aus zzzebra >> Geändert in 5f7d99
9e914d - Gegenfarbe Beige Braun
4f4f4f - Grau

*/
/* Non IE Hack */
@import "non_ie_fix.css" all;

/* ---------- @ 01 HTML Elements ----------- */

* {
	padding:0;
	margin:0;
}

html, body {
	font-family: Verdana, Arial, Sans-Serif;
	color:#4f4f4f;
	text-align:center;
	background-image: url(../a_nav/hin.gif);
}

/* ---------- @ 02 Typo Basics ----------- */
p {
	font-size:12px;
	margin:0 0 12px 0;
	color:#4f4f4f;
	line-height:18px;
}

img {
	border:0;
	font-size:8px;
	color:#999999;
}

a:link, a:visited, a:hover, a:active{
	text-decoration:none;
	border:0;
}


/* -- Headings --*/
/*Überschriften für den Lauftext*/	
h1{
	font-size: 18px;
	font-weight:bold;
	color:#82a5ce;
	margin-bottom:10px;
}

/* 2te Überschrift für den Lauftext */	
h2 {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 12px; 
	COLOR: #7997B3; 
	FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; 
	TEXT-ALIGN: left
}

/* 3.te Überschrift u.a. in Sidebar */	
h3 {
	font-size: 12px;
	font-weight: bold;
	color: #82a5ce;
	margin:3px 0 0;
}



/* ---------- @ 03 Stilelemente Basics ----------- */
/* Gepunktete Trennlinie */	
.trenner {
	width:455px;
	height:26px;
	background-image:url(../a_nav/tre.gif);
	background-repeat:no-repeat;
	margin:-8px 0 0 0;
	padding:0;	
	display:block;
	float:left;
	clear:both;
}

.m-such {
	margin:34px 0 0px 0;
}

.s-such {
	width:424px;
	margin:10px 0 10px 0;
}

.s-index {
	width:424px;
	margin:-4px 0 -12px 0;
	padding:0;
}

a.btn-index2 {
	margin:10px 6px 0 0;
	padding:1px 4px;
 	background-color:#c7d9e8;
}

a:hover.btn-index2 {
 	background-color:#82a5ce;
}

/* Box mit gestricheltem Rahmen */	
.zzz-box {
	border:2px dashed #82a5ce;
	/*border:2px dashed #774422;*/
	background:#e4eef6;
}

/* ---------- @ 04 Header, Suchleiste und Navigation -----------*/
/* Navigations Buttons ganz oben */
.btn-nav {
	display:block;
	float:left;
	border:0;
}

#btn-lab { background-image:  url(../a_nav/btn_lab.gif);}
#btn-lab:hover{ background-image:  url(../a_nav/btn_lab_o.gif);}

#btn-zzz { background-image:  url(../a_nav/btn_zzz_o.gif);}
#btn-zzz:hover{ background-image:  url(../a_nav/btn_zzz_o.gif);}

#btn-mel { background-image:  url(../a_nav/btn_mel.gif);}
#btn-mel:hover{ background-image:  url(../a_nav/btn_mel_o.gif);}

#btn-lied { background-image:  url(../a_nav/btn_lied.gif);}
#btn-lied:hover{ background-image:  url(../a_nav/btn_lied_o.gif);}

#btn-lese { background-image:  url(../a_nav/btn_lese.gif);}
#btn-lese:hover{ background-image:  url(../a_nav/btn_lese_o.gif);}

#btn-lern { background-image:  url(../a_nav/btn_lern.gif);}
#btn-lern:hover{ background-image:  url(../a_nav/btn_lern_o.gif);}

#btn-spiel { background-image:  url(../a_nav/btn_spiel.gif);}
#btn-spiel:hover{ background-image:  url(../a_nav/btn_spiel_o.gif);}

#btn-kiku { background-image:  url(../a_nav/btn_kiku.gif);}
#btn-kiku:hover{ background-image:  url(../a_nav/btn_kiku_o.gif);}

#btn-news { background-image:  url(../a_nav/btn_news.gif);}
#btn-news:hover{ background-image:  url(../a_nav/btn_news_o.gif);}

#btn-shop { background-image:  url(../a_nav/btn_shop.gif);}
#btn-shop:hover{ background-image:  url(../a_nav/btn_shop_o.gif);}

/* Schriftformatierung für die Suchleiste oben */
.suchleiste p, .suchleiste a, .suchleiste form, .suchleiste input {
	font-size:11px;
	font-weight:bold;
	color:#82a5ce;
	margin-top:4px;
	vertical-align:bottom;
}

/* Formular Einfache Suche Eingabefeld + Button */
.suchleiste input, .suchleiste input[type="text"]  {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	background-color:#FFFFFF;
	vertical-align:middle;
	padding:2px;
	margin-top:2px;
	border:1px dashed #82a5ce;
}
input.search-form-btn {
	background:none;
	border:none;
	cursor:pointer;
}

/* ---------- @ 05 Sidebar  -----------*/
/* RELAUNCH: Sidebar  */
.sidebar {
	margin: 10px 14px 0 14px; 
	padding:0;
	padding-top:16px;
	color:#1a6da5;
	line-height:14px;
}

.sidebar ul, .sidebar li{
  	list-style-type:none;
	list-style-position:outside;
	font-size: 11px;
	font-weight: normal;
	color:#4f4f4f;
}
.sidebar ul {
	margin-bottom:16px;
}
.sidebar li {
  margin:3px 0;
}
.sidebar a{
	text-decoration:none;
	height:12px;
}
.sidebar a:link, .sidebar a:active{
	color:#4f4f4f;
}
.sidebar a:visited{
	color:#999999;
}
.sidebar li a:hover{
	background-color:#82a5ce;
	color:#ffffff;
}
.sidebar img{
	margin-top:0;
}

/* Hervorhebung des aktuellen Menuepunkts */
#current, .current {
	background-color:#82a5ce;
	color:#ffffff;
}

/* ---------- @ 06 Content -----------*/

/* Inhaltsbereich / mittlere Spalte */
.content {
	margin:14px; 
	padding:0;
}

.content ul, .content li{
	list-style-position:outside;
	list-style-type:none;
	list-style-image:url(../a_nav/s_li_zzz.gif);
	font-size: 12px;
	font-weight: normal;
	margin:2px 0;
	padding:0;
	border:0;
	color:#4f4f4f;
	line-height:18px;
}
.content ul{
	padding-left:14px;
}

/* Anordnung eines Bildes */	
.bild {
	text-align:center;
}

/* Untertitel und Footer */
.subline a, .subline img{
	color:#9d9150;
	margin:0 0 4px 0;
}
.subline img {
	vertical-align:middle;
}
.foo-links, .foo-links img {
margin:0 0 5px 0;
padding:0;
}

a.foo {
	font-weight:normal;
	margin-right:9px;
	padding:0;
	font-size:10px;
	vertical-align:text-bottom;
}

/* Content Links */

.fl a:link, .fl a:active,  a.cl{
	color:#82a5ce;
}

.fl a:visited, a:visited.cl {
	color:#999999;
}

a:hover.cl, .fl a:hover {
	background-color:#82a5ce;
	color:#ffffff;
}
/* Detail Bookmarks / Share Buttons */
#bookmarks {
	display:none;
}

/* Suchergebnisse*/
.col-se{
 	width:202px;
	display:block;
	margin:12px 14px 0px 0;
}
.col-se-4{
 	width:101px;
	display:block;
	margin:12px 8px 0px 0;
}

.col-se ul, .col-se li{
	list-style-position:outside;
	list-style-type:none;
	list-style-image:url(../a_nav/s_li_zzz.gif);
	font-size: 11px;
	font-weight: normal;
	color:#9e914d;
	margin:2px 0;
	padding:0;
	border:0;
}

.col-se ul{
	margin-bottom:12px;
}

.col-se li{
	margin:3px 0 0 17px;
}


.col-se a{
	color:#9e914d;
}

.col-se li a:hover{
	color:#FFFFFF;
	/*background-color:#9e914d;*/
}
/* Liste mit Bildern im Inhaltsverzeichnis nach Themen */
.img-list{
margin-bottom:8px;
}
.img-list a{
margin:0 14px 0px 0;
}
/*Meta Navigation */
.meta, .meta a {
	text-align:center;
	font-size: 10px;
	font-weight:normal;
	color:#82a5ce;
}
.meta a{
	line-height:16px;
}
.meta a:visited{
color:#999999;
}
.seitenstark{
	margin-left: 55px;
}


/* ---------- @ 07 Formulare -----------*/
input, textarea, submit {
	font-family:Verdana, Arial, Sans-Serif;
	font-size:12px;
	margin:0;
	padding:0;
}

input[type="text"], input[type="password"], textarea{
	border:1px solid #ACACAC;
}

submit {
 /* bringt leider nichts */
	border:0px;
}

.form-box {
	width:455px;
	padding:0;
	margin:0 0 20px 0;
	float:left;
	display:block;
	text-align:left;
}
.form-box p{
	font-size: 12px;
	color: #4f4f4f;
}
.col-left{
 	width:165px;
	margin:12px 0 0 7px;
	float:left;
	display:block;
	border:0;
}
/* Groessere Abstand bei Karte */
.m-card{
	margin-top:52px;
}

.col-left p {
 text-align:left;
 margin-left:6px;
}

.col-left input {
	width:155px;
}
.col-right{
	width:255px;
	margin:12px 7px 14px 17px;
	float:left;
	display:block;
	border:0;
}

.col-left-sf{
	margin:12px 0 0 7px;
}

.col-right-sf{
	width:245px;
	margin:12px 7px 14px 27px;
}

.col-right-sf{
	width:225px;
}

/* Einspaltige Box */
.col-s {
	width:290px;
	padding:0;
	margin:12px 0 4px 14px;
}

.col-s-breit {
	width:auto;
	padding:0;
	margin:12px 0 0 14px;
	text-align:left;
}

input.form-btn, .form-btn {
	font-size:10px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	background-color:#5f7d99;
	border:none;
	margin:10px 6px 0 0;
	padding:0 3px;
	width:auto;
	vertical-align:middle;
	overflow:visible;
	cursor:pointer;
}
input.btn-index {
	background-color:#c7d9e8;
	margin-top:3px;
}

textarea.send_msg {
	height:111px;
	width:248px;
}
.err-box {
	height:115px;
}
.post-box {
	height:155px;
	background-image:url(../a_nav/post.gif);
	background-repeat:no-repeat;
	background-position:right;
}

.form-img {
	padding:0;
	border:0;
	margin:2px 0 20px;
}

.nl-box{
	height:155px;
	background-image:url(../a_nav/nl.gif);
	background-repeat:no-repeat;
	background-position:right;
}

.such-box {
	height:178px;
}

.post-p{
	width:290px;
}
/* Versenden */
#vform-send {
	display:block;
}

#versenden, #vform-error, #vform-success {
	display:none;
}

.such-p {
	width:110px;
	display:block;
	float:left;
	font-size:11px;
	margin:0;
	padding:0;
}

.such-p p{
	font-size:11px;
	line-height:22px;
	margin:0;
	padding:0;
}


/* ---------- @ 08 Warnhinweis -----------*/
#warning{
	background-image:url(../a_nav/win.png);
	background-repeat:no-repeat;
	display:none;
	width:427px;
	height:250px;
	position:absolute;
	zIndex:100;	
	text-align:left;

}
#warn_shop, #warn_blog, #warn_kiku, #warn_news, #warn_sstark, #warn_stumbleupon, #warn_delicious, #warn_mrwong{
	display:none;
}

p.warn {
	margin:-2px 45px 5px 39px;
}
p.warn_btn {
	margin:10px 45px 5px 39px;
}

input.warn {
	background-color:#82a5ce;
	font-size:11px;
}
a.btn-warn {
	padding:1px 4px;
 	background-color:#82a5ce;
	font-size:11px;
	
}
/* ---------- @ 09 Colours -----------*/
/* Zzzebra */
.s-zzz h1, .s-zzz h3{
	color:#82a5ce;
}
.s-zzz ul, .s-zzz li, .s-zzz a{
	color:#9e914d;
}
/* MO in IE8 fix */
.s-zzz li a:hover {
	color: #ffffff;
	background-color: #9e914d;
}
.s-zzz .col-se li{
	list-style-image:url(../a_nav/s_li_zzz.gif);
}


/* Mellvil */
.s-mel h1, .s-mel h3{
	color:#72abbb;
}
.s-mel ul, .s-mel li, .s-mel a{
	color:#b99766;
}
.s-mel a:hover {
	color: #ffffff;
	background-color: #b99766;
}
.s-mel .col-se li{
	list-style-image:url(../a_nav/s_li_mel.gif);
}

h2.s-mel-sub {
	/*font-size:11px;
	font-weight:normal;
	color:#4f4f4f;
	margin:14px 0 -4px;*/
	font-size:14px;
	font-weight:bold;
	color:#72abbb;
	margin:14px 0 -4px;
}

/* Liederbaum */
.s-lied h1, .s-lied h3{
	color:#83c669;
}
.s-lied ul, .s-lied li, .s-lied a{
	color:#a385a2;
}
.s-lied a:hover {
	color: #ffffff;
	background-color: #a385a2;
}
.s-lied .col-se li{
	list-style-image:url(../a_nav/s_li_lied.gif);
}

/* Spielotti */
.s-spiel h1, .s-spiel h3{
	color:#c9c12d;
}
.s-spiel ul, .s-spiel p{    
    font-size:11px;
    margin-bottom:0px;
}
.s-spiel li {    
    margin-top:0px;
    margin-bottom:0px;
    padding-top:0px;
    padding-bottom:0px;
    line-height:12px;
}
.s-spiel p {
    margin-left:14px;
    margin-top:0px;
    margin-bottom:6px;
    padding-top:0px;
    padding-bottom:0px;
}
.s-spiel ul, .s-spiel li, .s-spiel a{
	color:#73820e; /*8999ce;*/
}
.s-spiel a:hover {
	color: #ffffff;
	background-color: #73820e; /*8999ce;*/	
}
.s-spiel .col-se li{
	list-style-image:url(../a_nav/s_li_spiel.gif);
}

/* Lerntrix */
.s-lern h1, .s-lern h3{
	color:#ffc20e;
}
.s-lern ul, .s-lern li, .s-lern a{
	color:#8fb2cd;
}
.s-lern a:hover {
	color: #ffffff;
	background-color: #8fb2cd;
}
.s-lern .col-se li{
	list-style-image:url(../a_nav/s_li_lern.gif);
}

/* Lesekorb */
.s-lese h1, .s-lese h3{
	color:#faa61a;
}
.s-lese ul, .s-lese li, .s-lese a{
	color:#6d98de;
}
.s-lese a:hover {
	color: #ffffff;
	background-color: #6d98de;
}
.s-lese .col-se li{
	list-style-image:url(../a_nav/s_li_lese.gif);
}



/* ---------- @ 10 Misc -----------*/
.left{ text-align:left;}
.right{ text-align:right;}
.center{ text-align:center;}
.vmiddle { vertical-align:middle;}
.vtop{ vertical-align:top;}

.fleft{ float:left;}
.fright{ float:right;}
.flc{ clear:both;}

.inl { display:inline;}

.no-m, .no_m, img.no-m, img.no_m{ margin:0;}
.no-p, .no_p, img.no-p, img.no_p{ padding:0;}
.sm-m {margin:4px 0;}
.bw{ background-color:#FFFFFF;}
.w-auto, .w_auto{ width:auto;}
.f-normal, input.f-normal, .f_normal, input.f_normal{ font-weight:normal;color:#4f4f4f;}
.thin, input.thin{ border-width:1px;}
