@charset "UTF-8";
/* CSS Document BUF-UM */

:root {--EnteH:100px; --EnteW:115px;}

/* --- Grundseite --- */
body	{margin:0px; padding:0px; background-image:url(../media/Back/wolken.jpg); text-align:left;
		 background-attachment:fixed; overflow-y:scroll; font-size:.9em;}
div.body	{background:var(--bgcol); max-width:1360px; padding:0; padding-bottom:12px; margin:0 auto; box-shadow:10px 10px 20px #333}

/* Aufzählungen, Listen */
/*
ol {margin:6px 0px;}
ol li {line-height:1.0em; border:0; padding:3px 0; margin:0 0 0 20px;}
ul {list-style-type:disc; margin: 6px 0 12px 0;}
ul li {line-height:1.0em; border:0; padding:3px 0; margin:0 0 0 17px;}	*/
hr {height:1px; color:var(--bufcol); background-color:var(--bufcol); border:0;}


/* --- Grundeinstellungen, Raster und Lage --- */
/* Header */
header,
div.header	{position:relative; margin:0 0 4px 0; padding:0px; border-bottom:24px solid var(--bufcol); background:var(--bufcol);}
header img	{width:100%; max-width:1920px; border:0px; z-index:2;}
/* div.slogan	{position:absolute; font-size:24px; text-align:left; margin-left:230px; bottom:-24px; color:white; z-index:20;} */
div.slogan	{position:absolute; font-size:2em; line-height:1em; text-align:left; margin-left:230px; bottom:-24px; color:white; z-index:20;}

/* Vogel */
@keyframes Flug {
  0% {scale: 0 .8; left: 0px;}
  4% {scale: 1 1;}
 46% {scale: 1 1;}
 50% {scale: 0 .8; left:calc(min(100vw, 1360px) - 91px);}
 54% {scale:-1 1;}
 96% {scale:-1 1;}
100% {scale: 0 .8; left: 0px;}
}
@keyframes Wing {
/* Prozent beziehen sich auf das rel. Element, also den Header an sich! */
  from {height:73%; width:7%; top:0px;}
  to   {height:43%; width:7%; top:30%;}
}
#Ente	{height:var(--EnteH); width:var(--EnteW); margin:0; padding:0; position:absolute; top:0px; left:0px; scale:0 .8;
			 animation: Flug 16s ease-in-out infinite, Wing 0.4s linear infinite alternate;}
/* #Ente {position:absolute; width:91px; height:100px; left:0px; top:0px; margin:0; padding:0; cursor:pointer;}	/* left:16px; top:-26px;  */

/* Breadcrumbs */
/* div.locator	{margin:0 6px 20px 6px; padding:6px 0px; border-bottom:1px solid #090;}	*/

/* Navigation */
nav		{margin:0px; padding-bottom:12px;}
nav ul	{list-style-type:none; margin:0px; padding:0px;}
nav ul li	{display:inline-block; position:relative;}	/* Für Pflegesymbole in der Sitemap */
nav span, footer span, footer ul a,
nav a	{display:inline-block; background-color:#ffd; padding:5px 6px; margin:5px 6px; border:1px solid #aca; text-decoration:none;}
nav a:hover	{color:#060; background-color:#efe;}

nav span, footer span,
nav a.isSelected	{background-color:#ffff70; color:#120; text-decoration:none;}

footer a.isLocked, footer span.isLocked, .sitemap .isLocked, nav span.isLocked,
nav a.isLocked	{color:red;}
footer a.partLocked, footer span.partLocked, .sitemap .partLocked, nav span.partLocked,
nav a.partLocked	{color:orange;}

span.L1, a.L1	{font-size:1.5em;}



/*--- 1. Ebene Hauptnavigation ---*/
div.nav1	{display:inline-block; padding-right:0px; min-height:32px;}

/* ---- Workaround wegen Dropdown, bis im Code beseitigt --- */
.nav1 ul ul {display:none;}

/*--- 1. Ebene Zusatzmenü 2. Zeile ---*/
div.nav2	{display:inline-block; padding:0;}

/*--- 2. und 3. Ebene, Seitennavigation links ---*/
div.naviL2         {display:inline-block; float:left; margin-left:5px; padding:10px 0 0 0; width:220px;}
.naviL2 li	{display:block;}
span.L2, a.L2		{font-weight:normal; font-size:1.1em; margin-left:0px; width:200px; margin-right:5px; text-decoration:none;}

.naviL2 a.L3,
.naviL2 span.L3	{display:none; padding-left:3px; border-left:3px solid #aca;}
a.L3:hover		{}
li.isParent span.L2 a,
.isSelected span.L3,
.isSelected a.L3,
.thatsMe span.L3,
.thatsMe a.L3	{display:inline-block; width:195px;}

a.L4, span.L4	{display:inline-block; width:180px; padding-left:3px; margin-left:20px; border-left:4px solid #aca;}

/* Inhalt / Content */
div.contentwrapper	{display:inline-block; float:right}
div.content	{display:inline-block; width:680px; padding-right:0px; margin:0 5px; position:relative;}

div.sidebar	{display:inline-block; float:right; width:220px; padding:0px 4px; border:1px solid green; margin:0px 5px 8px 4px; background-color:#ffd;}
.sidebar ul	{padding-left:20px}

ul.sitemap	{list-style-type:none;}

/* --------------------- Hamburger ------------ */

/* --- Hamburger aktivieren und Navigation anpassen für Smartphones etc. --- */
@media only screen and (max-width: 679px) {
/*	label.hamburg { 
		display: inline-block; vertical-align:top;
		position: relative;
	}
	nav {float:none; max-height:0px; padding-bottom:0px; overflow: hidden; transition: 1s}	*/
    div.slogan {margin-left:0px;}
	div.content	{display:inline-block; max-width:100%;}
	nav span, nav a	{margin:2px; padding:3px;}
	span.L1, a.L1	{font-size:1em;}
	span.L2, a.L2,
	span.L3, a.L3,
	span.L4, a.L4	{font-size:.9em;}
	div.wrapper, footer	{font-size:.9em;}
	div.content img		{max-width:100%;}
}

/* Cookie-Hinweise: */
#cookies   {border:1px solid yellow; background-color:#eee; color:black; text-align:center;}

/* Footer */
footer,
div.footer	{clear:both; border-top:1px solid #090; margin:6px; text-align:center;}
footer div	{display:inline-block; width:49%; text-align:right;}
footer ul	{list-style-type:none;}
footer li	{display:inline-block;}

/* Formulare */
fieldset	{border:1px solid #1a6; border-radius:8px; margin:0px;}
label		{display:inline-block; width:180px;}
input[type=text], input[type=password], input[type=email], input[type=button], input[type=submit], button, textarea	{width:300px; padding:1px; box-sizing:border-box;}
textarea	{height:100px;}
legend		{color:#1a6;}
img.waiting	{width:32px; height:32px; border:none; margin:-16px 0 0 32px; visibility:hidden;}

table#energiecheck	{border-collapse:collapse; width:600px;}
table#energiecheck input	{width:120px;}

.selDay 	{width: 60px;}
.selMon		{width:159px;}
.selYear	{width: 80px;}

.sidebar label	{display:inline;}
.sidebar input[type=text], .sidebar input[type=password]	{width:98%;}

/* Content */

table	{border-collapse:collapse;}
th, td	{border:1px solid black;}

/* --- Gästebuch --- */
.gbwrapper	{width:100%; height:536px; overflow:auto; margin-bottom:4px;}
.gbtitle	{border:1px solid #1a6; border-radius:8px 8px 0px 0px; padding:4px; background-color:#1a6; color:white;}
.gbtitle a	{color:white; text-decoration:none}
.gbentry	{border:1px solid #1a6; border-radius:0px 0px 8px 8px; padding:12px 3px; margin-bottom:6px;}
.gbentry a	{text-decoration:none}
.gbedit		{font-size:0.85em; padding-top:12px}
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;}

/* Auto-News */
.AutoNewsWrapper	{}
.AutoNewsTitle		{background-color:#ffd; padding:5px 6px; border:1px solid #aca; text-decoration:none;}
.AutoNews			{padding-left:7px;}
.helper	{display:none;}

/* --  Styles für die KissGallery -- */
.kissgallery_head {text-align:center;}
.kissgallery {width:100%; background:none; text-align:center; border:none;}
/* Seitenauswahl */
.pageselect {display:inline-block; width:70px; border:1px solid #333; margin:0 1px 5px 1px; background:#eee;}
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:330px; height:260px;}
.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; cursor:zoom-in;}
.kissgallery_thumb_td_empty {width:1px;}
.kissgallery_thumb_td input	{width:20px;}
.desc1 {}
.desc2 {color:green;}
.desc3 {color:lightgreen;}
.desc4 {color:lightblue;}
.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;}

.lightbox-gr	{cursor:zoom-in;}

.formWishlist	{padding:0px 0px 10px 0px;}

p.kissgallery_legal {font-size:11px; padding:8px;}
p.kissgallery_clearlist {font-size:12px; padding:6px;}

/* --- 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;}

#dropzone	{min-height:50px; font-size:.8em; padding:4px; border:1px solid blue;}
#previews	{min-height:158px;}
#filelist	{min-height:50px;}
#progress	{display:none;}

/* --- 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%;}

/* --- Suchbegriff --- */
span.hilite	{background-color:#ff5;}

/* --- DruckAnsicht --- */
body.print {padding:0 5mm; margin:2mm auto; border:1px solid green; background-color:white}
body.landscape	{width:29cm; height:20cm;}
body.portrait	{width:20cm; height:29cm;}
body.print p {color:#33f;}
body.print div.inner, body.print aside,
body.print div.sidebar	{background-color:white}
body.print .noprint {display:none;}
.printlegal {font-size:13px;}

/* --- Bedienung --- */
.pointer	{cursor:pointer; text-decoration:none;}
.pointer:hover	{background-color:#efe; text-decoration:none;}
.zoom		{cursor:zoom-in;}

p.help		{font-size:small;}
p.error		{padding:8px; border:2px solid red; color:red; background-color:#fee;}
p.success	{padding:8px; border:2px solid green; color:green; background-color:#efe;}
p.neutral	{padding:8px; border:2px solid blue; color:blue; background-color:#eef;}
