/* für die Zentrierung der gesamten Seite: */
div.body	{width:1048px; margin:6px auto; padding:10px; background-color:#333; border-radius:9px; box-shadow:0px 0px 20px #666;}

/* für die Zentrierung der einzelnen Bereiche: */
div.inner	{max-width:1048px; margin:0px auto; padding-left:10px; padding-right:10px}	/* ; vertical-align:top */

/* Header */
header		{margin-top:2px; text-align:right; max-height:124px;}
div.header	{padding:4px 10px 0px 10px;}
div.logo	{position:relative; z-index:5; margin-bottom:-48px; margin-left:4px;width:130px; height:45px;}
header img	{position:relative; width:100%; max-width:1048px; z-index:1;}
div.slogan	{position:relative; z-index:5; top:-4.8em; margin-right:4px; margin-bottom:0px; text-align:right; font-size:1.6em; line-height:1em; font-style:italic; color:white;}
@media only screen and (max-width: 880px) {
	div.slogan	{font-size:1.5em; top: -2em;}
}

/* Breadcrumbs */
div.locator	{}
div.bread	{padding-top:6px; padding-bottom:6px; border-top:1px solid #f80; border-bottom:1px solid #f80}

/******************** Navigation ************************/
nav			{line-height:1.5; margin:0px;}
/* nav:after	{content:""; clear:both; float:none;} */
div.nav		{padding:0px;}

nav span, footer span, footer a,
nav a		{font-size:1.1em; color:#000; text-decoration:none; text-transform:uppercase;
				 padding:4px; margin-right:6px; }
nav a:hover, footer a:hover	{background-color:#111; color:#fff; text-decoration:none;}
nav a.withsub, footer span,
nav span	{background-color:#abf; color:#003; text-decoration:none;}
div.naviL2	{padding:20px 0px;}
span.L2, a.L2	{font-size:.9em; text-decoration:underline; text-transform:none;}

/* ---- falls 2. Navigation vorhanden ist ---- */
div.nav1	{display:inline-block; float:left;}
div.nav2	{display:inline-block; float:right;}
div.nav2:after	{clear:both;}
/* ---- für Dropdown -- */
nav ul span,
nav ul a {display:inline-block;}
/* ---- horizontal ---- */
nav ul		{list-style:none; padding-left:0;}
nav ul li	{float:left; position:relative; background-color:#fff;}	/*  margin:0 10px 0 0; */
nav ul li:last-child {margin-right:0px;}
nav ul li span,
nav ul li a	{}	/* color:#d0d0d0; font-weight:400; */
nav ul li:hover > a,
nav ul li span {}	/* padding-bottom:3px; border-bottom:4px solid #e20021; color:#d0d0d0; */
/* ---- dropdown ---- */
nav ul li ul {position:absolute; top:100%; left:auto; z-index:99; display:none; padding-top:2px;} /* float:left;  + max-height:0px; overflow:hidden; statt d:none*/
nav ul li:hover > ul,
nav ul li.focus > ul {display:block;}	/*   max-height:400px; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2); */
nav ul ul li {}	/* margin:0 1px 1px 0; background:#3a3a3a; border:none; */
nav ul ul li a,
nav ul ul li span {width:120px; padding-left:8px;}
nav ul ul li:hover > a,
nav ul ul li:hover > span {}	/* border:none; padding-bottom:7px; background:#E40023; */

/* ---- Level 3 ----
nav ul ul li.isParent:hover > a {background: url("/media/Icons/arrow-single.png") no-repeat scroll right 10px top 9px / 13px auto #e40023;}
nav ul ul ul {left:100%; top:0; padding-left:1px; padding-top:0;}	*/

/* Inhalt / Content (der äußere contentwrapper umschließt auch nicht-main-Elemente, z.B. eine 2. Navigation) */
div.contentwrapper,
div.wrapper	{min-height:600px; padding-top:28px;}
div.wrap	{min-height:600px; padding:10px}
main		{display:block}
div.content	{display:inline-block; float:left; width:100%; max-width:732px; min-height:580px; margin:0; position:relative;}

/* --- Sidebar / Infobox / Bildleiste --- */
div.sidebar		{display:inline-block; width:280px;}
div.sidebarleft	{margin:0 30px 10px 0; float:left;}
div.sidebarright{margin:0 0 10px 30px; float:right;}
aside, aside.imagebar,
aside.sidebar	{display:block; position:relative; padding:9px; background-color:#ddd; font-size:0.9em;
			 box-shadow:5px 5px 10px #000; border-radius:6px; margin-left:30px;}

@media only screen and (max-width: 1080px) {
	aside, div.imagebar, div.sidebar	{margin-left:0px;}
}
/* --------------------- Hamburger ------------ */
.line {background: #fff;}

@media only screen and (max-width: 679px) {
	label.hamburg {background:#555;}
	.nav1 ul li {display:block; width:100%; margin:6px 0px;}
	.nav1 ul li ul {position:relative; transition: 2s}
	nav ul li span ul {max-height:800px}
	nav {max-height:0px; overflow: hidden; transition: 1s}
	div.slogan	{font-size:1.2em; margin-top: -22px;}
}
@media only screen and (max-width: 546px) {
	div.slogan	{font-size:0.9em; margin-top: -22px; z-index:7;}
}
/* ------------------ Search-Icon ------------------- */
input#search	{display:none; width:10px;}
label.search	{width:20px;}
#search:checked	{display:inline-block; top:30px}

/* Footer */
footer		{clear:both; width:100%;}
div.footer	{padding:10px; background-color:#ddd}
footer div.footer {display:flex; flex-flow:row wrap; width:100%; margin:0 auto;}
footer div.section {flex:auto;}
footer ul {list-style:none; text-align: right;}
footer ul li {display:block; float:none; margin-bottom:8px;}

/* Cookie-Hinweise: */
#cookies   {border:1px solid yellow; background-color:#eee; color:black; text-align:center;}

/* --- Allgemeine HTML-Vorgaben für den Content (= editor.css für TinyMCE) --- */
img		{border:none;}
p		{margin-top:0px;}
p.error	{font-weight:bold; padding:4px 0px; color:red;}
p.passnote	{font-style:italic; font-size:0.9em;}
.search	{background-color:#ffffd0; padding:6px;}
.hilite	{background-color:yellow;}

/* Formulare */
fieldset	{border:1px solid #f80; border-radius:8px; margin:0px;}
label		{display:inline-block; width:180px;}
input[type=text], input[type=button], input[type=submit], input[type=password], input[type=email], textarea	{width:300px; padding:2px;}
textarea	{height:100px;}
legend		{color:#33f;}
img.waiting	{width:32px; height:32px; border:none; margin:-16px 0 0 32px; visibility:hidden;}

.selDay 	{width: 60px;}
.selMon		{width:159px;}
.selYear	{width: 80px;}

.sidebar label	{display:inline;}
.sidebar input[type=text], .sidebar input[type=password],
.sidebar input[type=submit]	{width:98%;}

/* Content */
/* Überschriften - hier bitte auch gleich für den Pflegebereich berücksichtigen, Danke! */
.h1,.h2,.h3,.h4,.h5,.h6,.p {line-height:22px !important; font-weight:normal !important;  background-color:#eee !important; color:#678 !important;}
.h1			{font-size:1.3em !important; color:#567 !important}
.h3, .h4	{font-size:16px !important}

/* --- Foren (Gästebuch, Diskussion, Blog) --- */
.gbwrapper	{width:100%; height:536px; overflow:auto; margin-bottom:4px;}
.gbtitle	{border:1px solid #08c; border-radius:8px 8px 0px 0px; padding:4px; background-color:#08c; color:#fff}
.gbentry	{border:1px solid #08c; border-radius:0px 0px 8px 8px; padding:3px; margin-bottom:6px;}
.gbtitle.first	{color:#eee}
.gbentry.first	{font-weight:400; background-color:#ffd}
.gbtitle a	{color:white; text-decoration:none}
.gbedit		{font-size:0.9em;}
/*.gbedit a	{color:#cc3; text-decoration:none;}
.gbedit a:hover {text-decoration:underline; color:#9af;}	*/
input#Nickname	{display:none;}

/* --- Bilder --- */
/* --  Diashow  -- */
div#Galerie1	{position:relative; overflow:hidden; height:470px;}
/* --  manuelle Steuerung  -- */
div#Galerie1 a	{text-decoration:none; margin:0px 4px; font-size:20px; line-height:28px;}
div#Galerie1 a:hover, div#Galerie1 a:active	{color:black;}
div#Galerie1 a.normal	{color:#ccc; cursor:pointer;}
div#Galerie1 a.aktiv	{color:#000; cursor:default;}
/* --  Die Dias selbst -- */
img.Home		{position:relative; top:0px; left:0px; width:600px; height:450px; border-radius:50px; box-shadow:5px 5px 10px #000; opacity:1;}
img#Home1		{position:absolute; top:0px; left:0px; opacity:0;}

img.Galerie2	{height:120px;}
img.Lage		{cursor:pointer; width:184px; height:132px;}
img#L1,img#L2	{position:absolute; width:640px; height:460px; top:0px; left:-100px; display:none; cursor:pointer;
				 border-radius:10px; box-shadow:0px 0px 20px;}

.picbox img	{width:100px;}
img.voll	{width:336px; height:488px;}

/* --- Angaben für den Kalender --- */
/* -- Kalender mit CSS-Buttons: -- */
div.calbutton	{width:100px; height:80px; margin-top:20px; border-radius:20px; box-shadow:0px 0px 20px white; background:#cdf; color:black;
				text-align:center; padding-top:20px; transform:rotate(-5deg);}

/* -- Kalender allgemein (>3 Termine) -- */
p.calsummary	{font-weight:bold; padding-top:9px;}
div.calsummary	{display:inline-block;}

/* Routenplaner */
.map	{width:400px; height:240px;}

/* --  Styles für die KissGallery -- */
.kissgallery_head {text-align:center;}
.kissgallery {width:100%; background:none; text-align:center; border:none; font-size:0.9em}
/* Seitenauswahl */
.pageselect {display:inline-block; width:70px; border:1px solid #333; margin:0 1px 5px 1px; background:#fff;}
a.pageselect {color:blue;}
a.pageselect:hover, span.pageselect	{color:black;}
/* thumbs (table) */
.kissgallery_thumbs {background:none; margin:0 auto;}
.kissgallery_thumb_td {background:none; border:0px solid #bbb; padding:4px; text-align:center; vertical-align:top; font-size:12px; width:150px; height:130px;}
.kissgallery_thumb_td img {background:#fff; padding:4px;}
.kissgallery_thumb_td a img {border: 1px solid #aaa;}
.kissgallery_thumb_td a:hover img {background:#bba; border:1px solid #999;}
.kissgallery_thumb_td_empty {width:1px;}
.kissgallery_thumb_td input	{width:20px;}
.desc1 {}
.desc2 {color:orange;}
.desc3 {color:lightgreen;}
.desc4 {color:lightblue;}
/* Bildergruppierung */
.groupleft  {border:2px solid red; border-right:0px solid black; width:300px;}
.groupright {border:2px solid red; border-left:0px solid black; width:300px;}

.kisspictures {float:right;}
.kisspictures img {background:#fff; padding:4px;}
.kisspictures a img {border: 1px solid #aaa;}
.kisspictures a:hover img {background:#bba; border:1px solid #999;}

.formWishlist	{padding:0px 0px 10px 0px;}
.formWishlist .small	{font-size:.8em}
.formWishlist .short	{width:34px}

p.kissgallery_legal {font-size:.8em; padding:8px;}
p.kissgallery_clearlist {font-size:.8em; padding:6px;}

/* workaround Alben: */
div.centre, div.rightside	{display:inline-block; width:45%; vertical-align:top}
div.centre img, div.rightside img	{max-width:100%; height:auto;}

/* --- Die Buttons für hervorgehobene Hinweise --- */
div.nobutton{width:245px; height:85px; font-size:16px; line-height:22px; font-weight:normal; color:#764E3F; padding-top:100px;}
div.stern	{position:relative; margin:0px auto; padding-top:50px; width:187px; height:135px; color:white; font-size:20px; line-height:26px; text-align:center; vertical-align:middle; transform:rotate(-5deg);}
div.stern a {color:white;}
/* --- Allgemein Buttons für Hervorhebungen --- */
div.srot	{background:url(../media/Buttons/stern_rot.png);}
div.sblau	{background:url(../media/Buttons/stern_blau.png);}
div.sgelb	{background:url(../media/Buttons/stern_gelb.png);}
div.sgreen	{background:url(../media/Buttons/stern_green.png);}
div.eule	{position:relative; margin:0 auto; width:245px; height:185px; color:white;}
div.erot	{background:url(../media/Buttons/veranstaltung_eule.png); font-size:20px; line-height:26px;}
div.egelb	{background:url(../media/Buttons/leseeulegelb.jpg); font-size:18px; line-height:20px;}
div.eultext	{position:absolute; text-align:left; vertical-align:middle; transform:rotate(5deg);}
.erot .eultext	{top:18px; left:90px;}
.egelb .eultext	{top:16px; left:128px;}

/* --- Default-Bilder: --- */
img.calmissing	{width:336px; height:254px; margin-top:200px;}

div.overlay	{z-index:100; position:absolute;}

/* --- Ende des Contents und Extra-Content --- */
div.contend	{clear:both; width:100%;}

/* --- DruckAnsicht --- */
body.print {max-width:18cm; padding:0 5mm; margin:2mm auto; height:25cm; border:1px solid red; background-color:white}
body.print div.inner, body.print aside,
body.print div.sidebar	{background-color:white}
body.print {color:black}
body.print .noprint, .helper {display:none;}
.printlegal {font-size:1em; color:#009;}