@charset "UTF-8";
@media all {

*, *:before, *:after, html {
 box-sizing: border-box; /* ----- globale Vorgabe der Boxgröße (hier für ALLE Elemente geltend) auf Bruttomaße (width = border + padding + content) ----- */
	font-size: 100.00001%;
	line-height: 1.4em;
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
}
 

body { 
 max-width: 50em;
 margin: 0 auto;
 padding: 0.1em 1px 2em 2px;
 font-family: sans-serif;
 background: rgba(218,255,224,1); 
 }
 
h1, h2, h3, h4, h5, h6, #headline #head-h1 { 
	font-family: sans-serif; 
	line-height: 1.3em; 
	font-weight: bold;
	margin: 1em 2em 0.5em; 
	text-shadow: 1px 1px 3px #CCC;
	text-shadow: 0.05em 0.05em 0.1em #CCC, 0.05em 0.05em 0.3em #AAA;
	text-shadow: 0.03em 0.03em 0.15em #AAA;	
	color: #006633;
	}

h1 { font-size: 1.5rem; } /* --- 24px --- */

h2 { font-size: 1.375rem; } /* --- 22px --- */

h3 { font-size: 1.25rem; font-style: italic; } /* --- 20px --- */

h4 { font-size: 1.125rem; } /* --- 18px --- */

h5 { font-size: 1.125rem; font-style: italic; } /* --- 18px --- */

h6 { font-size: 1.00rem; font-style: italic; } /* --- 16px --- */

.main-head { 
	z-index: -5;
	margin: 0 0 1.5em 0;
	padding: 0 0 0 3em;
	background: none;
	border: none;
	border-bottom: 0.2em solid #EEE;
	border-radius: 0;
	box-shadow: none;
}

.main-head h1 { 
	margin: 1em 2em 0.5em 0; }

.untertitel { 
	color: #000; 
	font-size: 112.5%;
	font-weight: bold;
	font-family: sans-serif;
	text-shadow: 0.05em 0.05em 0.2em #AAA; 
	}

header, main, footer { 
 display: block;
 position: relative; 
 z-index: 0; /*--- für main zwingend, um untere Kalenderblatt-Eckenschatten zu sehen ---*/
 mar_gin: 0 auto;
 padding: 1em 2em;
 border: 0px solid black;
 border-radius: 2em;
 box-shadow: 0 0 0.3em 0 #000; 
 }
	
header, footer { 
 padding: 1em;
 background: #FFFAE6; /* rgba(255,250,230,1) */
 }
		
footer { 
 z-ind_ex: -1;
 padding: 2em;
 text-align: center;
 }
.lightbox footer { z-index: -1; }

.aktual { font-size: 80%; }
 
main { 
 padding: 1em 2em 2em;
 background: rgba(255, 255, 255, 1); 
 }
	
/*---------
section {
	margin: 1em 0;
	padding: 1em 1em 0.1em;
	box-shadow: 0 0 0.3em #CCC;
	backg_round: lightyellow;
}
-----------*/

sect_ion#hea_dline { box-shadow: none; }

article { 
 margin: 0 0 1em;
	padding: 1em 1em 0.5em;
	back_ground: lightblue;
	}

article header { 
 margin: 0 0 1em;
 padding: 0;
	background: transparent;
 border: 0px solid black;
 border-radius: 0;
 box-shadow: none; 
	
}
article header p { 
 margin: 0 0 0.5em;
}
article header h2, 
article header h3, 
article header h4, 
article header h5, 
article header h6 { 
 margin: 0 0 0.5em 1em;
}

/*------------ Header --------------*/
#seitenkopf {
	position: relative;
	overflow: hidden;
	backgr_ound: #FFDDAA;
	backgro_und: lightyellow;
	backgro_und-image: 
		/*radial-gradient(at 28% 65%, #FFFAE6 10%, transparent 75%),*/
  repeating-conic-gradient(
   from 0deg at 25% 65%, 
			#FDF3D0 0 1.5deg, 
			#FFF7D9 0 8.5deg, 
			#FDF3D0 0 10deg, 
   transparent 0 20deg
			);				
	background: #FFFAE6; /* rgba(255,250,230,1) */
	background: radial-gradient(at 25% 70%, #FFFAE6 20%, #FFDDAA); 	
}

#seitenkopf::before {
	content: "";
	position: absolute;
	top: -40%;
	left: -1%;
	height: 160%;
	width: 160%;
	z-index: -1;
	backgr_ound: #FFFAE6; /* rgba(255,250,230,1) */
	backgr_ound: #FFDDAA;
	backgr_ound: lightblue;
	backgr_ound: transparent;
	background-image: 
		radial-gradient(at 25% 70%, #FFFAE6 10%, transparent 25%), 
  repeating-conic-gradient(
   from 15.5deg at 25% 70%, 
			#FAF0C0 0 1.5deg, 
			#FFF7D9 0 11deg, 
			#FAF0C0 0 12.5deg, 
   transparent 0 20deg
			);	
	animation-name: drehung;
	animation-duration: 15s;
	animation-iteration-count: infinite; 
	animation: drehung 14s linear infinite;
	transform-origin: 25% 65%; 
	filter: blur(5px); 
}

@keyframes drehung {
  0% {transform:rotate(-5deg);}
	 1% {transform:rotate(-5deg);}
  40% {transform:rotate(5deg);}
  60% {transform:rotate(5deg);}
	 90% {transform:rotate(-5deg);}
	 100% {transform:rotate(-5deg);}
  } 

#datenzeile_1,
#datenzeile_2 { 
 text-align: center; 
 font-family: sans-serif; 
 font-size: 75%;
 font-weight: normal; 
 line-height: 2em; 
 margin: 0 -1em 1em;
 padding: 0 0 0.5em 0;
 border-bottom: 2px solid #bbb;
 }
 
#datenzeile_2 { display: none; margin-bottom: 1em; padding-bottom: 1em; }

hr { width: 85%; margin: 1em; border: 0.1rem solid #EEE; }

ul, ol { margin: 0.5em 0 1em 0; padding-left: 1em; /* Einzug der Listenpunkte */ }

li { margin: 0 auto 0.5em; }

#headline { 
	height: auto; 
	margin: 0.5em 0 0 0; 
	padding: 0.5em 0;
	box-shadow: none;
	}

#headline a {
 font-family: sans-serif;
 text-decoration: none;
 color: #006622;
 }
  
#headerimage { 
 margin: 0;
 padding: 0.3em 0 0;
 height: 7em;
 width: auto;
 filter: drop-shadow(2px 2px 4px #AAA);
 border: none;
 backgr_ound: lightgreen;
 }

#headline ul {
	display: flex;
	margin: 0;
	padding: 0;
 backg_round: lightgreen;
}

#headline ul li { 
	margin: 0;
	padding: 0;
	list-style-type: none; 
	}
	
#headline ul li#headli1 { margin: 0 4%; }
 
#headline p {
	font-size: 1.1125rem; 
	text-shadow: 1px 1px 1px #DDD, 1px 1px 2px #AAA;
	text-shadow: 0.05em 0.05em 0.2em #AAA;
 margin: 0.5em 0 0.5em 0;
	padding: 0.2em 0 0 0;
	backg_round: lightyellow;
}

#headline h1#head-h1 {
	font-size: 1.875em;
	font-size: 2em;
	text-sha_dow: 0.05em 0.05em 0.1em #CCC, 0.05em 0.05em 0.3em #AAA;
 line-height: 1em;
 margin: 0;
}

#headline span#jubilee {
	/*animation-name: blink_5s;
	animation-timing-function: ease-in;
	animation-duration: 1.5s; 
 animation-iteration-count: 3;  
 animation-fill-mode: both; */
	animation: blink_5s 1.25s linear 4 both;
	visib_ility: hidden;
}

@keyframes blink_5s {
   0% { color: #006622; }
		35% { color: #006622; }
		37% { color: transparent; text-shadow: none; }
		60% { color: transparent; text-shadow: none; }
		62% { color: #006622; }
  100% { color: #006622; }
}


#headline span#since {
	position: relative;
	top: -0.5em;
	font-size: 0.4em;
	font-weight: normal;
}


/*------------ Ende Headerinhalt --------------*/

/* ----------- Kalenderblatt --------- */
#kalenderblatt {
 display: inline-block; 
 position: relative; 
 top: -1.14em;
	float: right;
	margin: 0 3% 0 2em;
	max-width: 10em;
	border: 1px solid #ccc;
	border-top: 0;
	border-radius: 0 0 1em 1em;
	padding: 1em 0.2em 0.5em 0.2em;
	color: #08439a;
	font-family: sans-serif;
	text-shadow: 1px 1px 2px #BBB;
	text-align: center;
	line-height: 1.3;
	font-size: 87.5%;
	background: rgba(231,255,244,1);
	background: #FFF3E0;
 background: linear-gradient(-10deg, #FFF, #FFFaEC 25%, #FFFdEe 80%, #FFede9 100%);
 box-shadow: 1px 1px 5px -1px #555;
 border: none;
 border-bottom-right-radius:3em 0.5em;
 border-bottom-left-radius:3em 0.2em;
}

#wochentag {
	display: block;
	padding: 0 0.5em;
	margin: 0.3em 0 0;
}
#datum {
	display: block;
	font-weight: 600;
	padding: 0 0.5em;
	margin: 0;
}
#woche-jahr {
	display: block;
	padding: 0em 0.5em 0.3em;
	margin: 0;
}

/*------Ecke rechts unten-----------*/
#kalenderblatt::after {
 content:"";
 display: inline-block;
 position: absolute;
 bottom: -0em;
 right: -0em;
 width: 70%;
 height: 20%;
 background: #AEAEAE;
 transform: rotate(8deg);
 z-index: -1; /*--- main muss z-index: 0; sein oder irgend ein anderer Wert --*/
 filter: blur(3px);
}

/*------Ecke links unten-----------*/

#woche-jahr::after {
 content:"";
 display: inline-block;
 position: absolute; /*---#kalenderblatt -> position: relative------*/
 bottom: 0.1em;
 left: 0.2em;
 width: 70%;
 height: 15%;
 background: #AEAEAE;
 transform: rotate(-9deg);
 z-index: -1; /*--- main muss z-index: 0; sein oder irgend ein anderer Wert --*/
 filter: blur(3px);
}

/* ----------- Ende Kalenderblatt --------- */

/*-------------- Navigationen --------------*/
#nav-recht,
#nav-main,
.skip-menu {
 position: relative;
 z-index: 10;
 }
 
.skip-menu {
 position: absolute;
 top: 0;
 margin: 0.5em auto;
 padding: 1.5em;
 font-size: 125%; /* -- 20px -- */
 font-family: sans-serif;
 font-weight: bold;
 color: #000;
 text-decoration: none;
 background: rgba(255, 255, 255, 0.90);
 border-radius: 2em;
 box-shadow: 3px 3px 15px 5px #000;
 transform: translateY(-150%);
 }

.skip-menu:focus {
 transform: translateY(10%);
 transition: 0.2s transform; 
 }

#nav-recht,
#nav-main,
.themen {
 display: block;
 width: 93%;
 margin: 0 auto;
 padding: 0 1px 1px;
 background: /*#DAFFE0;*/ rgba(218,255,224,1);
 animation-name: backgroundanimation;
 animation-duration: 18s;
 animation-iteration-count: infinite;
 }
	
.themen {
 background: /*#DAFFE0;*/ rgba(218,255,224,1);
 animation-name: none;
 animation-duration: 18s;
 animation-iteration-count: infinite;
	background: none;
}

#nav-recht-ul,
#nav-main-ul,
.sprungbrett {
 display: flex; 
 flex-wrap: wrap;
	margin: 0;
 padding: 0;
 }

#nav-recht-ul li,
#nav-main-ul li, 
.sprungbrett li {
 display: inline-block;
 flex: 1;
 margin: 1px;
 padding: 0;
 }
 

#nav-recht-ul a,
#nav-main-ul a, 
.menu-toggle, 
.sprungbrett a {
 display: block;
 margin: 0;
 padding: 0 0.3em; 
 text-align: center;
 white-space: nowrap;
	line-height: 2;
 font-family: sans-serif;
 text-decoration: none;
 color: #666; 
	text-shadow: 1px 1px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
 background: #DDD;
 background: linear-gradient(#FFF, #CCC); 
	background: linear-gradient(#FFF, #E5E5E5);  
	background: #EEE;
 background: linear-gradient(#FFF, #EEE);  
	border-radius: 0.5em/3em; 
	box-shadow: 1px 1px 5px #BBB, 0px 0px 3px #D0D0D0;
 }
	
.sprungbrett a {
 padding: 0 0.3em; 
	line-height: 2.5;
 font-size: 87.5%;
 background: #E5E5E5;
 background: linear-gradient(#FFF, #ECECEC); 
	background: #FBFBFB;
 background: linear-gradient(#FFF, #F7F7F7); 	
	box-shadow: 1px 1px 5px #DDD, 0px 0px 3px #EEE;	
	
	box-shadow: 1px 1px 3px #EEE, 0px 0px 1px #AAA;	
	box-sh_adow: 0px 0px 3px #EEE, 0px 0px 2px #EEE;
 }

#nav-recht-ul a:focus, 
#nav-main-ul a:focus,
.flexies h3:focus, 
.sprungbrett a:focus,
#nav-recht-ul a:hover, 
#nav-main-ul a:hover, 
.flexies h3:hover,
.sprungbrett a:hover,
#nav-recht-ul a:active, 
#nav-main-ul a:active,
.flexies h3:active,
.sprungbrett a:active { 
 font-variant: small-caps;
	font-size: 112.5%;
	line-height: 1.77;
	color: #FFF; 
	text-shadow: 1px 1px 2px #000, 1px 1px 4px #222;
	background: #008833;
 background: linear-gradient(#009933, #007722);
	box-shadow: 1px 1px 5px #999, 0px 0px 3px #CCC;
	box-sh_adow: 1px 1px 5px #C0C0C0, 0px 0px 3px #DDD;
	box-shad_ow: 1px 1px 5px #BBB, 0px 0px 3px #D0D0D0;
 }

#nav-recht-ul a:active, 
#nav-main-ul a:active,
.sprungbrett a:active { 
 position: relative;
 top: 0.05em;
 left: 0.05em; 
	font-size: 100%;
	line-height: 2;
 color: #fff; 
	text-shadow: 0px 0px 2px #000, 0px 0px 4px #222;
	background: #005522;
 background: linear-gradient(#007733, #004400); 
	box-shadow: inset 1px 1px 4px #000, 0px 0px 3px #AAA;
 }
	
.sprungbrett a:focus, 
.sprungbrett a:hover, 
.sprungbrett a:active { 
	line-height: 1.94;
 }
	
.sprungbrett a:active { 
	line-height: 2.1;
 }
	
#Angebot #nav-angebot a,
#Ueber_uns #nav-ueber_uns a,
#So_geht #nav-so_geht a,
#Kundenbuch #nav-kundenbuch a,
#AGB #nav-agb a,
#Datenschutz #nav-datenschutz a, 
#Kontakt #nav-kontakt a, 
#Impressum #nav-impressum a, 
#Preise #nav-preise a, 
#Empfehlung #nav-empfehlung a {
  font-variant: small-caps;
	color: #000;
	text-decoration: underline;
	text-shadow: 0px 0px 4px #FFF, 0px 0px 5px #FFF;
	cursor: default;
	pointer-events: none;
  background: #C0F5C0;
	background: linear-gradient(#99DDAA, #80C090); 
	box-shadow: inset 1px 1px 5px #999, 0px 0px 3px #AAA;
}	

/* #Home ul#nav-main { text-decoration: underline; } */

/*-------------- Navigation einblenden und verbergen --------------*/
.menu-toggle {
 display: none;
	margin: 0 -0.2em;
	padding: 2em; 
 font-size: 112.5%;
	border-radius: 0.3em/3em;
	border-left: 1px solid #EFEFEF;
	box-shadow: 1px 1px 3px -1px #444, 1px 1px 3px #CCC; 
 }
 
#menubutt-recht-close,
#menubutt-main-close {
 color: #D40000;
	text-shadow: 1px 1px 3px #FFF, 0px 0px 2px #fff;
	text-shadow: 1px 1px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
 background: #FFD2D2;
	background: linear-gradient(#FFEEE0, #FFBBB0);
 } 
#menubutt-recht-close:focus, 
#menubutt-main-close:focus, 
#menubutt-recht-close:hover, 
#menubutt-main-close:hover, 
#menubutt-recht-close:active, 
#menubutt-main-close:active{ 
 color: #FFF; 
	text-shadow: 1px 1px 2px #000, 1px 1px 4px #222;
 background: #EE5550; 
 background: linear-gradient(#EEb9ae, #EE302a); 
	border-left: 1px solid #009955;
	box-shadow: 1px 1px 5px #999, 0px 0px 3px #CCC;
 } 
#menubutt-recht-close:active, 
#menubutt-main-close:active{ 
 position: relative;
 top: 0.05em;
 left: 0.05em; 
 color: #fff; 
	text-shadow: 0px 0px 2px #000, 0px 0px 4px #222;
 background: #DD201a; 
 background: linear-gradient(#DD4440, #880a05); 
	border-left: 1px solid #004400;
	box-shadow: inset 1px 1px 4px #000, 0px 0px 4px #333;
 }
 
#menubutt-recht-open,
#menubutt-main-open {
 color: #005522;
	text-shadow: 1px 1px 2px #BBFFCC;
	text-shadow: 1px 1px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
 background: #C0F5C0;
	background: linear-gradient(#bbffcc, #80b090); 
 } 
#menubutt-recht-open:focus, 
#menubutt-main-open:focus, 
#menubutt-recht-open:hover, 
#menubutt-main-open:hover, 
#menubutt-recht-open:active, 
#menubutt-main-open:active{ 
 color: #FFF; 
	text-shadow: 1px 1px 2px #000, 1px 1px 4px #222;
 background: linear-gradient(#00AA44, #006622);  
	border-left: 1px solid #009955;
	box-shadow: 1px 1px 5px #999, 0px 0px 3px #CCC;
 } 
#menubutt-recht-open:active, 
#menubutt-main-open:active{ 
 position: relative;
 top: 0.05em;
 left: 0.05em; 
 color: #fff; 
	text-shadow: 0px 0px 2px #000, 0px 0px 4px #222;
 background: linear-gradient(#007733, #004400); 
	border-left: 1px solid #004400;
	box-shadow: inset 1px 1px 4px #000, 0px 0px 4px #333;
 }
 
#menubutt-recht-close svg,
#menubutt-main-close svg,
#menubutt-recht-open svg,
#menubutt-main-open svg { 
 display: inline;
 position: relative;
 width: 1em;
 height: 1em;
 }

#menubutt-recht-close svg,
#menubutt-main-close svg { 
 top: 0.15em;
 fill: #D40000;
 }

#menubutt-recht-open svg,
#menubutt-main-open svg {
 top: 0.1em;
 fill: #005522;
 } 

#toggle-image-close,
#toggle-image-open {
 display: none;
 }

/*-------------- Ende Navigationen --------------*/ 

/*---------- Links ------------*/

a.link_ext::before { 
 content: "\279A\00A0\00A0"; 
 margin: 0 -0.2em 0 0;
 }

a.link_int::before { 
 content: "\279D\00A0\00A0"; 
 margin: 0 -0.2em 0 0;
 } 
	
a.link_pgdwn::before { 
	content: "\25BC\00A0";
 margin: 0 -0.2em 0 0;
 }


		
a.seitenanfang::before { 
	content: "\25B2\00A0\00A0";
 margin: 0;
 } 

.seitenanfang, 
.formbutton {
 display: block;
 margin: 1em auto;
 padding: 1em 2em; 
 font-family: sans-serif;
	text-decoration: none;
 color: #666; 
	text-shadow: 1px 1px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
 background: #FBFBFB;
 background: linear-gradient(#FFF, #F7F7F7);  
	border-radius: 0.5em/3em; 
	border-left: 1px solid #EFEFEF;
	box-shadow: 1px 1px 3px #EEE, 0px 0px 1px #ccc;	
	box-sha_dow: 0px 0px 3px #EEE, 0px 0px 2px #EEE;
	tran_sition: all 2s ease;
	
 }

button {
	display: inline-block;
	margin: 1em auto;
	border: none;
}

.formbutton { 
	display: inline-block;
	width: 50%;
}

.seitenanfang:focus,
.seitenanfang:hover,
.seitenanfang:active, 
.formbutton:focus,
.formbutton:hover,
.formbutton:active { 
 font-variant: small-caps;
	font-size: 112.5%;
	padding: 0.7em 2em;
 color: #FFF; 
	text-shadow: 1px 1px 2px #000, 1px 1px 4px #222;
 background: linear-gradient(#00AA44, #006622);	
	background: #008833;
	background: linear-gradient(#009933, #007722);	
	box-shadow: 1px 1px 5px #C0C0C0, 0px 0px 3px #DDD;
 }

.seitenanfang:active, 
.formbutton:active {
 position: relative; 
	top: 0.05em;
 left: 0.1em; 
	padding: 1em 2em;
	font-size: 1rem;
 color: #fff; 
	text-shadow: 0px 0px 2px #000, 0px 0px 4px #222;	
	background: #005522;
 background: linear-gradient(#007733, #004400); 
	box-shadow: inset 1px 1px 4px #000, inset 0px 0px 4px #333;
 }
 
/*---------- Links Ende ------------*/

/*---------- Gooding Shop-Widget-Box ------------*/
#Gooding Shop-Widget-Box {
	height: 800px; 
	position: relative; 
	border: 1px solid #000;
}

#Gooding Shop-Widget {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%!important; 
	height: 100%!important;
}

/*---------- Gooding Shop-Widget-Box Ende ------------*/

.warning, .important, .good {
	margin: 1em 0;
	padding: 1.5em 2em 0.5em; 
 border-radius: 0 1.5em 0 1.5em;
	border: 1px solid #f0f0f0;
	border-top: 1px solid #f5f5f5;
 border-bottom: 1px solid #e9e9e9;
	box-shadow: 0 0 0.3em #CCC;
}


.warning {
	background: #FFE8E8;
	background: linear-gradient(#FFF 10%, #FFE3E3);
 }
	
.important, fieldset {
	background: #FFFAE6;
	background: linear-gradient(#FFF 10%, #FFFAE6);
 }
	
.good {
 background: #EAFFEE;
	background: linear-gradient(#FFF 10%, #EAFFEA);
}

.verborgen {display: none; }

#Home #intro {
	position: relative;
	z-index: -2; 
}

p { margin: 0 0 1em; padding: 0; }

.right { text-align: right; }

strong { 
	font-family: sans-serif; 
	font-weight: bold; 
	font-si_ze: 93.75%; /* -- 15px - Angleichung an umgebende Textgröße -- */ 
	line-height: 1.1em; /* --- Angleichung Durchschuss an umgebenden Text --- */
	}
	
sup, sub { font-size: 75%; }

blockquote { 
	margin-inline: 1.5em; 
	font-family: sans-serif; 
	font-size: 93.75%; 
	font-style: italic; 
	}

.homelist { 
 display: flex; 
 flex-wrap: wrap; 
 margin: 0; 
 padding: 0;
 }
 
.flexies { 
 flex: 1;
 display: inline-block;
 min-width: 12em;
 margin: 0 0.2em 0.5em; 
 padding: 0;
 text-decoration: none;
 color: #000; 
 background: #EAFFEE; 
	background: linear-gradient(-10deg, #EAFFEE, #FFF 65%); 
 border: 1px solid #ddd;
	border-radius: 0 1.5em 0 1.5em;
 box-shadow: 1px 1px 4px #CCC;
 }
 
.flexies dt { 
	width: auto;
 margin: -0.1em -0.1em 0.5em 0; 
 padding: 0.5em 0.8em;
	font-family: sans-serif;
 font-size: 112.5%; 
	text-shadow: 1px 1px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
 background: #D0F9CC;
	border-radius: 0 1.5em 0 0
 }

.flexies dd { 
 margin: 0; 
 padding: 0.2em 0.8em 1em;
	backg_round: linear-gradient(rgba(255,255,255,1) 20%, rgba(255,255,255,0), #EAFFEE); 
 }

.flexies h3:focus,
.flexies h3:hover,
.flexies h3:active { 
 color: #FFF; 
	text-shadow: 1px 1px 2px #000, 1px 1px 4px #222;
 background: linear-gradient(#00AA44, #006622);  
	border-left: 1px solid #009955;
	box-shadow: 1px 1px 5px #999, 0px 0px 3px #CCC; 
 }

.faq-flex { 
 display: block;
 margin: 0 1em 1.5em; 
 padding: 0.5em 0.5em 0 0.5em;
 text-decoration: none;
 color: #000; 
 border: 1px solid #ddd;
	border-radius: 0 1.5em 0 1.5em;
 box-shadow: 1px 1px 4px #CCC;
 }

.faq-flex dt { 
 margin: -0.5em -0.5em 0; 
 padding: 1em 1em 1em 2em;
	Font-family: sans-serif;
	text-shadow: 0px 0px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
	text-shadow: 1px 1px 1px #fff, 1px 1px 2px #fff, 0px 0px 1px #000;
 background: #D0F9CC;
	border-radius: 0 1.5em 0 0
 }
	
.faq-flex dd { 
 margin: 0; 
 padding: 1.5em 1.5em 0.5em;
 }
	
.inline { display: inline; margin: 0; }

.nobr { white-space: nowrap; }

.pre { font-family: monospace; }


fieldset {
	dis_play: inline-block;
	pos_ition: relative;
	width: 100%;
	min-width: 10em;
	margin: 1em auto;
	padding: 0 1em 2em; 
	border: 1px solid #EEE;
}

fieldset header h3 { margin: 1em; }

label { 
	display: inline-block;
	width: auto;
	margin: 1em auto 0;
	padding: 0.5em 1em 0.2em;
	text-align: left; 
	font-family: sans-serif; 
	font-variant:small-caps; 
	border: 0px dotted lightgrey; 
	} 

.eingabefeld {
	display: inline-block;
	width: 100%;
	margin: 0 auto; 
	padding: 0.5em 1em;
	font-size: 112.5%;
	background: #FFF;
	border-radius: 0.2em;
	border: 1px solid #EEE;
	box-shadow: inset 0.05em 0.05em 0.4em #DDD;
}

.eingabefeld[type="PLZ"] { width: auto; }
.eingabefeld #ort { width: 100%; }
.eingabefeld#betreff { margin:0 auto; padding: 0.5em 1em; font-size: 87.5%; }

/* input[type="text"]:required, 
input[type="email"]:required, 
textarea:required { font-weight: bold; background: #FFDDDD; } */


.required { 
	font-we_ight: bold; 
	font-s_tyle: italic; 
	background: #FFAAAA; 
	} 


.eingabefeld:focus, 
.eingabefeld:hover, 
.eingabefeld:active {
	background: #E0FFE0;
	border: 1px solid #FFF;
	box-shadow: inset 0.05em 0.05em 0.4em #BBB, 0 0 0.3em #DDD;
}

.eingabefeld:active {
	background: #FFF;
	border: 1px solid #000;
	box-shadow: inset 0.05em 0.05em 0.3em #777, 0 0 0.2em #000;
}

.inl_ine { object-fit: contain;
	height: 100%;
	width: auto;
	display: inline; }

.textbild_left {
	disp_lay: inline;
	height: 4.5em;
	float: left;
	margin: -0.3em 1.5em 1.5em -1em;
	clear: both;
	border: none;
}

.textbild_right {
	height: 8em;
	float: right;
	margin: -0.3em -1em 0.5em 1em;
	clear: both;
	border: none;
	background: none;
 filter: drop-shadow(0.1em 0.1em 0.2em #999);
}
.textbild_karte {
	height: 8em;
	float: right;
	margin: -0.3em -1em 0.5em 1em;
	clear: both;
	border: none;
	background: none;
  filter: drop-shadow(0.1em 0.1em 0.2em #999);
}

.textbild_left_imagolix {
	height: 2em;
  width: auto;
  margin-bottom: 1.5em;
	border: none;
}

.textbild_left_5em {
	dis_play: inline-block;
	height: 7em;
	float: left;
	margin: -0.3em 1.5em 1.5em -1em;
	clear: both;
	border: none;
}

#Logo_Merkur { 
	height: 3.7em;
	margin: -0.3em 1.5em 3em -1em;
	border: 0px solid grey; }

.fleximage_right {
	height: 6em;
	float: right;
	margin: -0.3em -1em 0.5em 1em;
	clear: both;
	border: none;
}
.fleximage_left {
	height: 6em;
	float: left;
	margin: -0.5em 1em 0 0;
	clear: both;
	border: none;
}

.figure { object-fit: contain; margin: 0 0 2em; padding: 0.5em 0.5em 1em; box-shadow: 1px 1px 4px #BBB; }
.figure figcaption { padding: 0.2em; }
.illustration { width: 100%; }
#headerfigure { display: block; margin: 0; padding: 0; box-shadow: none; }

svg.required-mark {
	display: inline;
	position: relative;
	top: -0.4em;
	height: 0.4em;
	width: auto;
	margin: 0 0.1em 0 0.1em;
}

/* Dialog-Box (Bannereinblendungen, die Neutzer wegklicken kann) */

/* Festlegung im Default-Stylesheet der Browser */


/* Styling der geöffneten Popup-Box */
dialog[open]{
	position: fixed;
	z-index: 999999999;
	width: 90%;
	height: 97%;
	margin: 0 auto;
	background: rgba(255,255,255,0.95);
	border-radius: 0 5em 5em;
	border: thick solid green;
	box-shadow: 1em 1em 4em;
}


dialog form { 
	width: 100%;
	height: 100%;
	margin: 0 auto; 
	text-align: center;
    align-content: center;
}

dialog figure { 
	width: 100%;
	margin: 0 auto; 
	text-align: center;
    align-content: center;
}

dialog img { 
	width: 80%;
	margin: 0 auto; 
	border-radius: 1.5em;
	box-shadow: 0.3em 0.3em 1.2em #999;
}

dialog button { 
	display: block;
	width: 100%;
	height: 100%;
	background: none;
	margin: 0 auto;
	border-radius: 5em;

}

/* --- Lightbox --- */
/* #standortkarte {display: none; } --- für Testzwecke --- */

.wiggle {
  display:inline-block;
  margin:0 auto;
}

.wiggle:hover {
  animation:none;
}

.short-animate {
  transition:0.4s 0.4s ease-in-out;
}

.long-animate {
  transition:0.7s 0.7s ease-in-out;
}

.lightbox {
  position:fixed;
  top:-100%;
  bottom:100%;
  left:0;
  right:0;
  z-index:501;
  background-color: rgba(200,200,200,0.7);
}

.lightbox img {
  position:fixed;
  margin: auto;
  top:0;
  left:0;
  right:0;
  bottom:0;
  max-width:0%;
  max-height:0%;
}

.lightbox-banner {
  position:fixed;
  top:0;
  bottom:100%;
  left:0;
  right:0;
  z-index:701;
  background-color: rgba(200,200,200,0.7);
}

.lightbox-banner img {
  position:fixed;
  margin: auto;
  top:0;
  left:0;
  right:0;
  bottom:0;
  max-width:0%;
  max-height:0%;
}

#lightbox-controls {
  display: none;
  position:fixed;
  height:6em;
  width:6em;
  top:0;
  right:0;
  z-index:502;
  background:rgba(255,255,255,1);
  border-radius: 50%;
}

#close-lightbox {
  display:block;
  position:absolute;
  overflow:hidden;
  height:6em;
  width:6em;
  text-indent:-5000em;
  right:0;
  top:2em;
  transform:rotate(45deg);
}

#close-lightbox:before {
  content:'';
  display:block;
  position:absolute;
  height:0;
  width:0.4em;
  left:1.37em;
  top:0em;
  background:white;
  border-radius: 0.25em;
  transition:0.4s 0.4s ease-in-out;
  background: rgba(0,0,0,1);
}

#close-lightbox:after {
  content:'';
  display:block;
  position:absolute;
  width:0px;
  height:0.4em;
  top: 1.37em;
  left:0;
  border-radius: 0.25em;
  transition:0.4s 0.4s ease-in-out;
  background: rgba(0,0,0,1);
}

.lightbox-banner:target,
.lightbox:target {
  top:0%;
  bottom:0%;
}

.lightbox-banner:target img,
.lightbox:target img {
  max-width:100%;
  max-height:100%;
  border: 1em solid rgba(255,255,255,1);
  border-radius: 1.5em;
}

.lightbox-banner:target ~ #lightbox-controls,
.lightbox:target ~ #lightbox-controls {
  display: inline-block;
  top:0px;
  transition:0.4s 0.4s ease-in-out;
}

.lightbox-banner:target ~ #lightbox-controls #close-lightbox:after,
.lightbox:target ~ #lightbox-controls #close-lightbox:after {
  width:3.2em;
}

.lightbox-banner:target ~ #lightbox-controls #close-lightbox:before,
.lightbox:target ~ #lightbox-controls #close-lightbox:before {
  height:3.2em;
}

@-webkit-keyframes wiggle {
	0% {
	transform:rotate(2deg);
  }
  20% {transform:rotate(-2deg);}
  40% {transform:rotate(2deg);}
  60% {transform:rotate(-2deg);}
  80% {transform:rotate(2deg);}
	100% {transform:rotate(-2deg);}
}
/* --- Lightbox - Ende --- */


#preisliste {
	disp_lay:flex;
	margin: 0 auto;
	padding: 0;
}

#preisliste caption,
table#preisliste th { padding: 0.5em; font-family: sans-serif; font-weight: bold; }

table#preisliste {
	fle_x: 1;
	min-width: 40%;
	margin: 0 0 1em 3em;
	padding: 0;
	text-align: center;
	border: 1px solid #BBB;
	fl_oat: left;
	cle_ar: both;
	border-collapse: collapse;
}

table#preisliste tbody tr:nth-child(even) { 
  background-color: #D0F9CC; 
  color: #000; 
}

table#preisliste th { padding: 0.5em 1em; background: #D0F9CC; border-bottom: 1px solid #BBB; }
 
table#preisliste td {
	margin: 0;
	padding: 0.3em 1em;
	font-family: sans-serif; 
	bo_rder-top: 1px solid #BBB;
	border-bottom: 1px solid #BBB;
}

#Preise .faq-flex { margin: 1em 0; }

#AGB ul { list-style-type: disc;  }

#AGB ol ol { list-style-type: lower-alpha; }


}
@media only screen and (max-width: 600px) and (orientation: portrait) {

header, footer { 
 padding: 1em;
 border-radius: 0;
 }
	
main { padding: 1em 0 2em; }

.main-head { padding: 0 0 0 1.5em; }
	
section {
	margin: 1em 0;
	padding: 1em 0 0.1em;
	}

section#headline { box-shadow: none; }

article { 
 margin: 0 0 1em;
	padding: 1em 1.5em 0.5em;
	}
	
.flexies,
.faq-flex,
fieldset { margin: 1em 0; }
#Preise .faq-flex { margin: 1em -1em; }
.faq-flex dd,
.flexies dd { 
 margin: 0; 
 padding: 0.5em 0.5em 1em;
 }
	
form { margin: 1em -1.5em; padding: 1em 1.5em; } 
fieldset { margin: 1em 0; width: 100%; padding: 0 1.5em 1em; }

section .warning, section .important, section .good {
	margin: 1em -1em;
	wid_th: 100%;
	padding: 1.5em 1em 0.5em; 
 border-radius: 0 0 0 1.5em;
	border: 1px solid #f0f0f0;
	border-top: 1px solid #f5f5f5;
 border-bottom: 1px solid #e9e9e9;
	box-shadow: 0 0 0.3em #CCC; 
}

.figure { margin: 1.5em -1em; padding: 1em; }


.seitenanfang { width: 90%; }

/* === Toggle-NAV === */

#nav-recht,
#nav-main { z-index: 0; width: 80%; text-align: center; background: transparent; animation-name: none; }
 
#nav-recht-ul a,
#nav-main-ul a, 
.menu-toggle { padding: 0.75em; }

#nav-recht-ul a:hover,
#nav-recht-ul a:focus,
#nav-recht-ul a:active,
#nav-main-ul a:hover,
#nav-main-ul a:focus,
#nav-main-ul a:active { padding: 0.67em; }


#nav-recht-ul a:active,
#nav-main-ul a:active { padding: 0.75em; }

.menu-toggle:hover,
.menu-toggle:focus,
.menu-toggle:active { padding: 0.75em; }


 
#nav-recht-ul, 
#nav-main-ul { display: block; width: 80%; margin: 0 auto; }

/* Hide Menu */
#nav-recht-ul, 
#nav-main-ul { display: none; }

#nav-recht-ul li, 
#nav-main-ul li ,
#nav-recht-ul a, 
#nav-main-ul a { display: block; }

#menubutt-recht-close, 
#menubutt-main-close { display: none; }

#menubutt-recht-open, 
#menubutt-main-open { display: block; }

/* Show Menu */
#nav-recht:target #nav-recht-ul, 
#nav-main:target #nav-main-ul { display: block; }
#nav-recht:target #menubutt-recht-open, 
#nav-main:target #menubutt-main-open { display: none; }
#nav-recht:target #menubutt-recht-close, 
#nav-main:target #menubutt-main-close { display: block; }

#toggle-image-close,
#toggle-image-open { display: inline; }
 
/* === Ende Toggle-NAV === */ 

/* Nur Firefox * /
@-moz-document url-prefix() {
#menubutt-recht-open::before, 
#menubutt-main-open::before { display: inline; }
#nav-recht:target #menubutt-recht-close::before, 
#nav-main:target #menubutt-main-close::before { display: inline; }
}
*/

#datenzeile_1 { display: none; }
#datenzeile_2 { display: block; }

h1, h2, h3, h4, h5, h6 { fo_nt-size: 87.5%; }

header { padding: 0.5em 1em; }

#seit_enkopf {
	background: #FFFAE6; /* rgba(255,250,230,1) */
	backgr_ound: lightgreen;
	background-image: 
		radial-gradient(
			at 35% 65%, 
			#FFFAE6, transparent 60%
			),
  repeating-conic-gradient(
   from 12deg at 25% 65%, 
			#FDF3D0 0 0.75deg, 
			#FFF7D9 0 9deg, 
			#FDF3D0 0 9.75deg, 
   transparent 0 20deg
			);	
}
 
#headline ul li#headli1 { margin: 0 3% 0 0; }

#headerimage { 
 height: 6em;
 margin: 1em 0.5em 1em 0;
 }
	
#headline { 
	margin: 0;
	padding: 0; 
	font-size: 87.50%;
 }
	
#headline p { margin: 0; }

#headline p { margin: 0.5em 0 0.5em 0; }

.textbild_left {
	height: 6em;
	margin: 0 1em 0 -0.2em;
}

.textbild_right {
	height: 6em;
	margin: 0 -0.2em 0 1em;
}

table#preisliste {
	fle_x: 1;
	min-width: 40%;
	margin: 0 0 1em;
	padding: 0;
	text-align: center;
	border: 1px solid #BBB;
	fl_oat: left;
	cle_ar: both;
	border-collapse: collapse;
}

table#preisliste th { padding: 0.5em 0.5em; background: #D0F9CC; border-bottom: 1px solid #BBB; }
 
table#preisliste td {
	margin: 0;
	padding: 0.3em 0.5em;
	font-family: sans-serif; 
	bo_rder-top: 1px solid #BBB;
	border-bottom: 1px solid #BBB;
}


}

@media only print {

nav { display: none; }

a.link_ext,
a.link_int { 
 text-decoration: none;
 }
 
a.link_ext::after,
a.link_int::after { 
 content: " " "("attr(href)")";
 font-family: sans-serif;
 font-size: 87.5%;
 color: #000000;
}

.seitenanfang { display: none; }



}