/* Version 2025-05-28 */
  
/* oregano-regular - latin */
@font-face {
  font-family: 'Oregano';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/oregano-v13-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/oregano-v13-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/oregano-v13-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/oregano-v13-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/oregano-v13-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/oregano-v13-latin-regular.svg#Oregano') format('svg'); /* Legacy iOS */
}

/* zilla-slab-highlight-regular - latin */
@font-face {
  font-family: 'Zilla Slab Highlight';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/zilla-slab-highlight-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/zilla-slab-highlight-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/zilla-slab-highlight-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/zilla-slab-highlight-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/zilla-slab-highlight-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/zilla-slab-highlight-v17-latin-regular.svg#ZillaSlabHighlight') format('svg'); /* Legacy iOS */
}  
  
* { 
margin: 0;
padding: 0;
}

BODY            {
    background-color: #f6e9b9;
    font-family: Arial, sans-serif;
    background-image: linear-gradient(hsla(215,30%,70%,0.9) 0%, hsla(215,30%,70%,0) 50%, hsla(215,30%,70%,0.9) 100%), ;
    background-image: linear-gradient(to right, hsla(215,30%,80%,0.8) 30%, white 50%, hsla(215,30%,80%,0.8) 70%);
    /* für alte IE-Versionen zwecks Zentrierung */
    text-align: center;
} 

/* für alte Browser-Versionen */
header, nav, footer, aside, section {
    display: block;
}

.hidden
{
        position:absolute;
        clip:rect(1px 1px 1px 1px); /* IE6 & 7 */
        clip:rect(1px, 1px, 1px, 1px);
}

#wrapper {
/*    background-color: white;*/
    /*background-image: url(bilder/hintergrund-inhalt.png);*/
    /* für alte IE-Versionen zwecks Zentrierung */
}
                                                                                                                                 /* fuer Handy und Co */
header {
         opacity: 0.7; 
         background-size:100% 100%;
         background-repeat: no-repeat;
         background-image: linear-gradient(hsla(215,30%,70%,0.9) 0%, hsla(215,30%,70%,0) 50%, hsla(215,30%,70%,0.9) 100%), ;
         background-image: linear-gradient(to right, hsla(215,30%,80%,0.8) 30%, white 50%, hsla(215,30%,80%,0.8) 70%);
         font-family: 'Oregano', cursive;
         text-align:  center;
         background-color: #ffff0a;
         box-shadow: 5px 0 200px 20px #a3a3a3 inset, 5px 0 50px #a3a3a3;
         clear: both;
}

header span {
    font-size: 1.3em;
}
	
header img
{
        width:39.999999%;
        height:auto;
        padding-top: 1em;
}
        
header p {
    font-family: 'Oregano', cursive;
    font-size: 2em;
    color:#800000;
    text-align:center;
    letter-spacing:.1em;
}  
	
section  {
    background-size: 100% auto;
    background-repeat: no-repeat;
	width: 100%;
	float: left;
	margin-left: 0;
	padding-top:2em;
}

#text {
font-size: 1.4rem;
line-height:1.2em;
color: #800000;
font-family: Arial, Helvetica, Sans-Serif;
text-align:left;
margin: 0 1em .5em 1em;
padding: 0;
}

.video-wrapper {
max-width: 100%;
width: 700px;
left: 0;
right:0;
margin:auto;
padding: 1em 0 1em 0;
}

.videobereich {
    background-color: orange;
    position: relative;
    height: 0;
    padding-bottom: 56.25%;
}

.videoextern {
    background-color: yellow;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
 
#links {
font-size: 1.4rem;
line-height:1.2em;
color: #800000;
font-family: Arial, Helvetica, Sans-Serif;
text-align:center;
margin: 0 10px 0 10px;
padding: 0;
margin-top:3em;
}

#links img {
    opacity:1; 
}

section img {
    position:relative;
    width: 53.999%;
    height: auto;
    margin:0 auto;
    opacity: 0.6; 
}

section p {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;
   text-shadow: none;
   margin: 0 1em .5em 1em;
}

section li {
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;
   text-shadow: none;
   margin: 0 1em .5em 1em;
}

section a {
   text-decoration:none;
}

section a:hover  {
   text-decoration: underline;
   color:#0066ff;
}

section h1 {
       font-family: 'Oregano', cursive;
       font-size:34px;
       font-weight:inherit;
       color:green;
	   text-align: center;
	   margin: 0 10px 0 10px;
       z-index:2;
}

.dieHAH {
font-family: 'Oregano', cursive;
font-size: 1.9rem;
font-weight:inherit;
line-height:1.6em;
color: #800000;
margin: 1em auto 0;
padding: 0 10% 0;
}

section h2 {
	font-size: 1em;
	text-align: left;
	font-family: Arial, Helvetica, Sans-Serif;
	margin:0 50% 0;
	padding:1em 0 .1em;
}

section h3 {
	font-size: 1em;
	text-align: left;
	font-family: Arial, Helvetica, Sans-Serif;
	padding:1em 0 2em;
}

section h4 {
font-size: 1.2rem;
letter-spacing: 0.2em;
color: #1e90ff;
margin:5px auto 10px;
text-align:center;
}

section h4 span{
font-size: 1.4rem;
font-weight:bold;
letter-spacing: 0.4em;
}

section h5 {
font-size: 1.3rem; 
letter-spacing: 0.1em;
font-weight:bold;
margin:5px auto 10px;
}

section .bund {
font-size: 1.2rem;
letter-spacing: 0.2em;
color: #1e90ff;
margin:5px auto 10px;
text-align:center;
}

section .bund span{
font-size: 1.4rem;
font-weight:bold;
letter-spacing: 0.4em;
}

section .handvoll {
    position:relative;
    width: 95%;
    height: auto;
    margin:0 auto;
    padding-top:2em;
    opacity: 0.9;
    z-index:-1;
}
 
.space {
    padding-left:2em;
    margin-bottom:-.1em;
 }

.space1 {
    padding-left:8.7em;  
    margin-bottom:-.1em;
 }
 
.space2 {
    padding-left:15.3em;
    margin-bottom:-.1em;
 }
 
.space3 {
    padding-left:1.5em;
    margin-top:2em;
    font-weight:bold;
 } 

.space4 {
    padding-left:16.3em;  
    margin-bottom:-.2em;
 }

.space5 {
    padding-left:50%;  
    margin-bottom:-.2em;
 }

.space5a {
    width:50%;
    margin: 0 70% .1em 30%;
    margin-bottom:-.2em;
 }

hr {
    height:2px;
    width:50%;
    margin: 0 0 .1em .5em;
    color:gray;
    background-color:#800000;
 }

.list {
	padding: 1.6em 0 3em 1.5em;
	line-height: 30px;
}

.list1 { 
   text-align:left;
   line-height: 30px;
   margin:0 0 1em 0;
   padding-left: 2em;
}

.list1 ul{ 
   list-style-type:square;
   margin: 0 1em .5em 1em;
   padding-left:1em;
 }

.list1 li{ 
  list-style-type:circle;
  padding-left: .5em;
}

.list1u { 
   list-style-type: none;
   text-align:left;
   line-height: 30px;
   padding-left: 4em;
}

.list1u li{ 
  list-style-type:none;
  padding-left: 1.8em;
}

.list1forsch { 
   text-align:left;
   line-height: 30px;
   margin:0 0 1em 0;
   padding-left: 2em;
}

.list1forsch ul{ 
   list-style-type:square;
   margin: 0 1em .5em 1em;
   padding-left:1em;
 }

.list2 {
	padding: 1.6em 0 1em 1.5em;
	line-height: 30px;
}

.list1 kopie {
	list-style-type: square;
	padding: .6em 0 1em 2.3em;
	line-height: 30px;
}

.list3 {
	padding: .6em 0 1em 2.3em;
	line-height: 30px;
}

.list4 { 
   line-height: 30px;
   margin:0 0 1em 0;
   padding-left: 4em;
}

.list4 li{ 
   list-style-type:circle;
   margin:0 0 .1em 0;
}

.list5 { 
   line-height: 30px;
   margin:0 0 1em 0;
   padding-left: 1em;
}

.list5 li { 
  list-style-type:circle;
  padding-left: .5em;
  margin:0 0 0 1em;
}

.list6 {
	padding: 0 0 0 1.5em;
}

.list6 li{ 
   margin:0 0 .1em 2em;
}

.container {
   column-count: 2;
   column-width: 200px;
   column-gap: 20px;
}

.mark {
	display:block;
	width: 49.999990%;  
    height: auto;
}

.style1 {
	text-decoration: underline;
}

.style1a {
	text-decoration: underline;
	font-weight:bold;
}

.style1b {
	font-weight:bold;
}

.style1c {
    line-height:150%;
	letter-spacing:.05em;
}

.style2 {
    text-align:center;
}

.style2a {
    width:50%;
    margin: 0 70% .1em 30%;
    text-align:center;
}

.style3 {
padding-left:2em;
}

.style44   {
position:relative;
margin:.2em 10% 0 5%;
}

.style4   {
   display: grid;
   justify-content: center;
   align-items: center;
}

.style4a {
   list-style-type:none;
}

.style5 {
	color:#0066ff;
	width:19px;
	height:19px;
	text-decoration:none;
	width:25px;
	height:25px;
}
	
.style6 {
margin:0 auto;
list-style-type:none;
}

.style7 {
margin-bottom:.5em;
}

.style7a {
margin-bottom:2em;
}

.style8 {
font-style:italic;
padding-left:1em;
}

.style9 {
	color: #1588F3;
}
              
.style10 {
    font-style:italic;
	font-size: smaller;
	text-align:right;
}

.style11 {
    text-align:center;
    margin:0 auto;
    padding:1em 0 1em;
    color:#0066ff;
}

.style16 {
	color: #008000;
}

#kingdom {
    width: 25%;
    height: auto;
    margin:0 auto;
    float:right;
}

aside  {
        width: 100%;
        float: right;
 		text-align:center;
 		margin:2em 0 1em 0;
        padding:0;
}
                
aside img {
	display:block;
	width: 49.999990%;  
    height: auto;
    margin-bottom: 2em;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

.leiter {
	width: 34.999990%;  
    height: auto;
    margin-bottom: 2em;
}

aside p {
        font-family: 'Oregano', cursive;
        font-size: 1.3rem;    
        color:green;
        margin-top:-1.5em;
}
 		
aside a {
        text-decoration:none;
}

footer {
         opacity: 0.7; 
         background-size:100% 100%;
         background-repeat: no-repeat;
         background-image: linear-gradient(hsla(215,30%,70%,0.9) 0%, hsla(215,30%,70%,0) 50%, hsla(215,30%,70%,0.9) 10%), ;
         background-image: linear-gradient(to right, hsla(215,30%,80%,0.8) 30%, white 50%, hsla(215,30%,80%,0.8) 70%);
         font-family: 'Oregano', cursive;
         text-align:  center;
         background-color: #ffff0a;
         box-shadow: 5px 0 200px 20px #a3a3a3 inset, 5px 0 50px #a3a3a3;
         clear: both;
}

footer img  {
         width:29.999999%;
         height:auto;
}

footer p {
         font-size: 1.5em;
         font-weight:bold;
         text-align:center;
         color:green;
         padding-top:.5em;
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
 }
 
#rechte {
         font-size:1.5em;
         padding-bottom:1em;
}

div.responsive-foothead {
       /* entspricht "responsive */
        left:1px;
        margin-left:auto;
        margin-right:auto;
        padding:0 0 0 0;
        width:100%;
        height:auto;      
}

div.gallery-foothead { 
       /* entspricht "galerie */
        width:80%;
        margin:0 auto;
        padding:1em 0 1em 0;
        overflow:hidden;
}

.foothead {
        display: flex;
        flex-flow: row wrap;
        align-items: center;
        justify-content: center;
        justify-content: space-between;
        font-size:.8rem;
}

footer nav {
		 width:60%;
		 margin:0 auto;
}

footer nav ul {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

footer nav li {
	list-style: none;
	margin: 0.5em;
	padding: 0;
	font-size: 1.2em;
}

footer nav a {
	display: block;
	padding: 0.4em;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
    border: 1px solid #800000;
	border-radius: 10px;
	box-shadow: 0 5px 10px white inset;
	color: #800000;
	background-color: #d9a954;
	transition: all .25s ease-in;
}

footer nav li[aria-current] a {
	background-color: firebrick;
	color: gold;
}

footer nav ul span {  /* aktuelle Unterseite kennzeichnen */
	display: block;
	padding: 0.4em;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	border: 1px solid darkblue;
	border-radius: 10px;
	box-shadow: 0 5px 10px white inset;
	color: darkblue;
	background-color:#cdea6a;
	transition: all .25s ease-in;
  }

footer nav a:hover,
footer nav li[aria-current] a:hover {
	color: darkblue;
	background-color: #cdea6a;
}

#mobileMenu {
    max-width: 1000px;
    margin: auto;
    position: absolute;
    list-style:none;
    top: 3em;
    right: 0;
    width: 50%;
    z-index: 999;
}

#mobileMenu li { 
    list-style: none;
    text-align: center;
}

#mobileMenu span {
    display: inline-block;
    padding: 0.5em;
    margin: 0 0.2em;
    border: 1px solid #888;
    background-color: #ffd28b;
    min-width: 9rem;
    text-decoration: none;
    color: #800000;
    font-weight: 500;
    font-size: 1.1em;
    width: 100%;
}

#mobileMenu li>a {
    display: inline-block;
    padding: 0.5em;
    margin: 0 0.2em;
    border: 1px solid #888;
    opacity: 0.85;
    min-width: 9rem;
    text-decoration: none;
    color: #800000;
    font-weight: 500;
    font-size: 1.1em;
    width: 100%;
   	box-shadow: 0 5px 10px white inset;
	color: #800000;
	background-color: #d9a954;
	transition: all .25s ease-in;
}

#mobileMenu ul li span { 
    background-color: #fa9800;
    opacity: 0.85;
   	box-shadow: 0 5px 10px white inset;
	color: #800000;
	background-color: #d9a954;
	transition: all .25s ease-in;
}

#mobileMenu ul li ul {
        position: absolute;
        display: none;
        text-align: left;
        padding:0;
        margin:0 auto;
        width: 70%;
        right: 0;
}

#mobileMenu ul li:hover>ul, #mobileMenu ul li:focus-within>ul {
    display: block;
    position: static;
}

#mobileMenu li a:hover {
    background-color: #cdea6a;
}

#mobileMenu ul>li>ul>li>a {
    background-color: #ffd28b;
    font-size: 1.0em;
}

#mobileMenu ul li ul li:hover>a {
    background-color:  #cdea6a;
}

#mobileMenu ul li ul li span {
    background-color:  #cdea6a;
}

#mobileMenu #line {
    line-height:1.5em;
}

/*checkbox*/

#mobileMenu > input, nav label {
    display: none;
}

#mobileMenu ul {
    flex-direction: column;
    /*checkbox Eigenschaften ul*/
    position: static;
    width: 100%;
    display: flex;
}
       
        #menu {
                display:none;
        }
	  
        input {
                width:auto;
        }
        
        #toggleMobile {
                position: absolute;
                top: 10px;
                right:10px;
                display: block;
                width: 40px;
                height: 36px;
                cursor: pointer;
                z-index: 999;
        }
        
        #toggleMobile p {
       
                top: 28px;
                margin-left:-7em;
                color:#9b600d;
                font-size:1.4em;
        }
        
        #toggleMobile span.menu1, #toggleMobile span.menu2, #toggleMobile span.menu3 {
       
                display: block;
                position: absolute;
                width: 40px;
                height: 8px;
                left: 0;
                background-color:#9b600d;
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        
        #toggleMobile span.menu1 {
                top: 0;
        }
        
        #toggleMobile span.menu2 {
                top: 14px;
        }
        
        #toggleMobile span.menu3 {
                top: 28px;
        }
        
        #toggleMobile.active span.menu1 {
                top: 14px;
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                transform: rotate(45deg);
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
                
        #toggleMobile.active span.menu2 {
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                transform: rotate(-45deg);
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        
        #toggleMobile.active span.menu3 {
                opacity: 0;
                -webkit-transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }

#sidenav {
        margin: auto;
        position: absolute;
        list-style:none;
        top: 3em;
        left: 0;
        z-index: 999;
}

#sidenav li { 
    list-style: none;
    text-align: center;
}

#sidenav span {
    display: inline-block;
    padding: 0.5em;
    margin: 0 0.2em;
    border: 1px solid #888;
    background-color: #cdea6a;
    min-width: 9rem;
    text-decoration: none;
    color: #800000;
    font-weight: 500;
    font-size: 1.1em;
    opacity: 0.85;
   	box-shadow: 0 5px 10px white inset;
}

#sidenav li>a {
    display: inline-block;
    padding: 0.5em;
    margin: 0 0.2em;
    border: 1px solid #888;
    opacity: 0.85;
    min-width: 9rem;
    text-decoration: none;
    color: #800000;
    font-weight: 500;
    font-size: 1.1em;
   	box-shadow: 0 5px 10px white inset;
	background-color: #d9a954;
	transition: all .25s ease-in;
}

#sidenav ul li:hover>ul, #sidenav ul li:focus-within>ul {
    display: block;
    position: static;
}

#sidenav li a:hover {
    background-color: #cdea6a;
}
        
        #toggleMobile2
        {
                position: absolute;
                top: 10px;
                left:10px;
                display: block;
                width: 40px;
                height: 36px;
                cursor: pointer;
                z-index: 999;
        }
      
        #toggleMobile2 p
        {
                top: 28px;
                margin-left:2.3em;
                color:#9b600d;
                font-size:1.4em;
        }
        
        #toggleMobile2 span.menu4, #toggleMobile2 span.menu5, #toggleMobile2 span.menu6
        {
                display: block;
                position: absolute;
                width: 40px;
                height: 8px;
                left: 0;
                background-color:#9b600d;
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        
        #toggleMobile2 span.menu4
        {
                top: 0;
        }
        
        #toggleMobile2 span.menu5
        {
                top: 14px;
        }
        
        #toggleMobile2 span.menu6
        {
                top: 28px;
        }
        
        #toggleMobile2.active span.menu4
        {
                top: 14px;
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                transform: rotate(45deg);
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
                
        #toggleMobile2.active span.menu5
        {
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                transform: rotate(-45deg);
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        
        #toggleMobile2.active span.menu6
        {
                opacity: 0;
                -webkit-transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
	
#navcontainer {
               display:none;
              }

.back-to-top
{
     	position: fixed;
        bottom: .6em;
        left: .002em;
        margin:auto;
        font-family:'Montserrat Alternates', sans-serif;
        text-decoration: none;
        color: #800000;
        font-size: 2em;
        padding:.001em;
        text-align:center;
        line-height:0.001em;
}

.back-to-top:hover
{
        color: #d9a954;
        color: green;
}
              
@media only screen and (min-width:37em) and (max-width:50em) and (orientation:landscape){                            /** CSS media query LANDSCAPE **/

.headerhead {
        display: flex;
        flex-flow: row wrap;
        align-items: center;
        justify-content: center;
        justify-content: space-evenly;
}

div.responsive-headerhead { /* entspricht "responsive */
        left:1px;
        margin-left:auto;
        margin-right:auto;
        padding:0 0 0 0;
        width:100%;
        height:auto;      
}

div.gallery-headerhead { /* entspricht "galerie */
        width:88%;
        align-items: center;
        padding-top:1em;
        overflow:hidden;
}

.headerhead img {
        width:17.999999%;
        height:auto;
}
        
.headerhead p { 
        font-size: 1.9em;
} 
 
.headerhead p span { 
        font-size: 1.2em;
}  

#menu {
width: 100%;
padding: 1em 0 ;
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
line-height: 1.2em;
float: inherit;
z-index:999;
display: inline-block;
}

#menu ul {
float: inherit;
width: 100px;
list-style-type: none;
display: inline-block;
}

/*--definiert die Blocküberschriften--*/
#menu p {
    font-size: 1em;
    text-align: center;
    color: #800000;
    border-top: 1px solid #800000;
    border-right: 1px solid #800000;
    border-bottom: 1px solid #ccc;  
    border-left: 1px solid #800000;
    background-size:  100% 100%;
    background-repeat: no-repeat;
    background-color: #d9a954;
    box-shadow: 0 5px 10px white inset;
    font-family: Arial, Helvetica, sans-serif;
    font-weight:bold;
    letter-spacing:inherit;
}

/*--definiert die "Drop-Down-Links" im Normalzustand--*/
#menu a, #menu li ul span {
text-decoration: none;
font-size: 1em;
display: block;
border: 1px solid #ccc;
text-align: center;
background-color: #d9a954;
box-shadow: 0 5px 10px white inset;
transition: all .25s ease-in;
color: #800000;
}

/*--definiert die "Drop-Down-Links" im Hoverzustand--*/
#menu a:hover, #menu li ul span {
color: #800000;
background-color: #cdea6a;
}

#menu li ul span {  /* aktuelle Unterseite kennzeichnen */
    bbbackground: url('../images/bg200.gif') no-repeat;
}

/*verhindert im Zusammenhang mit position absolute bei ul ul
*eine Höhenvergrößerung von #menu beim Hovern--
*/

#menu li {
position: relative;
}

/*--versteckt die "Drop-Down-Links", solange nicht gehovert wird--*/
#menu ul ul {
position: absolute;
z-index: 2;
display: none;
}

/*--lässt die Dropdown-Links beim Hovern erscheinen--*/
#menu ul li:hover ul {
display: block;
}

/*--nur für IE-Versionen kleiner gleich 6 erkennbar--*/
* html #menu ul li{
float: left;
width: 100%;
}

/*--nur für IE 7 erkennbar--*/
*+ html #menu ul li {
float: left;
width: 100%;
}

/*--bewirkt Hover-Effekt für IE kleiner 7 auch für ul- und li-Elemente--*/
*html body {
behavior: url(csshover3-source.htc);
font-size: 100%;
}

*html #menu ul li a {
height: 1%;
}

section  {
                 width: 62%;
                 float: left;
                 margin-left: 0;
                 padding-top:3em;
                 margin-bottom:3em;
}

section h1 {
            font-size:1.8em;
}

section h2 {
            font-size:1.6em;
}

section h2 {
	font-size: 1em;
	text-align: left;
	font-family: Arial, Helvetica, Sans-Serif;
	padding:1em 0 .1em;
}

section h3 {
	font-size: 1em;
	text-align: left;
	font-family: Arial, Helvetica, Sans-Serif;
	padding:1em 0 2em;
}

section h4 {
            font-size:1.1em;
}

section h4 span {
            font-size:1.1em;
}

section .bund {
            font-size:1.1em;
}

section .bund span {
            font-size:1.1em;
}

.space1 {
    padding-left:8.7em;  
    margin:0 auto;
 }


.space5 {
    padding-left:45%;  
    margin-bottom:-.2em;
 }

#text {
padding: 0 7% 0 7%;
}

#home-hah {
padding: 0 15% 0;
}

aside  {
                   width: 20%;
                   float: right;
                   padding:0;
                   margin-top:3em;
}
             
aside img {
                 width: 60%;
                 height: auto;
}               

footer  {
              font-family: 'Oregano', cursive;
              margin:0;
              background-size:100%;
}

footer nav {
		 width:100%;
		 margin:0 auto;
	}

footer nav ul {
		flex-direction: row;
	}
	
footer nav li {
		flex: 1;
		font-size: 1em;
	}

div.responsive-foothead {
       /* entspricht "responsive */
        left:1px;
        margin-left:auto;
        margin-right:auto;
        padding:0 0 0 0;
        width:100%;
        height:auto;      
}

div.gallery-foothead { 
       /* entspricht "galerie */
        width:80%;
        margin:0 auto;
        padding:.1em 0 1em 0;
        overflow:hidden;
}

.foothead {
        display: flex;
        flex-flow: row wrap;
        align-items: center;
        justify-content: center;
        justify-content: space-evenly;
        font-size:1em;
}

footer img {
	        width:19.999999%;     
}

footer p {
    font-size: 1.5em;
    letter-spacing:.15em;
    text-align:center;
}

#rechte {
         font-size:1.3em;
         padding-bottom:1em;
}

#navcontainer {
               float:left;
               width: 18%;
               background-image:   url(../images/lili.gif);
               background-size: 33px 930px;
               background-repeat: no-repeat;
               background-position: 36%;
               font-family: Arial, Helvetica, sans-serif;
               font-size: .7em;
               display:inherit;
}

#navcontainer ul {
	width: 85%;
	margin:2em auto 0;
	list-style:none;
}

#navcontainer a {
	display: block;
	overflow: hidden;
	padding: 0.4em;
	text-decoration: none;
	font-weight: bold;
	text-align: center;

border-top: 1px solid #800000;
border-right: 1px solid #ccc;
border-bottom: 1px solid #800000;
border-left: 1px solid #800000;

	box-shadow: 0 5px 10px white inset;
	color: #800000;
	background-color: #d9a954;
	transition: all .25s ease-in;
}

#navcontainer li[aria-current] a {
	background-color: firebrick;
	color: gold;
}

#navcontainer ul span {  /* aktuelle Unterseite kennzeichnen */
	display: block;
	padding: 0.4em;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	width:100%;
	
border-top: 1px solid #800000;
border-right: 1px solid #ccc;
border-bottom: 1px solid #800000;
border-left: 1px solid #800000;
	
	box-shadow: 0 5px 10px white inset;
	background-color: #cdea6a;
}

#navcontainer a:hover,
#navcontainer ul span:focus,
#navcontainer li[aria-current] a:hover {
    width:100%;
	color: darkblue;
	background-color: #cdea6a;
}

#toggleMobile p
        {
                display:none;  
        }

#toggleMobile
        {
                display: none;
        }
        
#toggleMobile2
        {
                display: none;
        }
                
#toggleMobile2 p
        {
                display:none;  
        }
        
#mobileMenu {
                display: none;
}
 
#sidenav {
                display: none;
}

#sidenav .closebtn {
                display:none;
}
	
   .clearfix:after {
    content: "";
    display: table;
    clear: both;
}

}
                                                      
@media only screen and (min-width:50em) {                                                              /* fuer PC, Laptop und Co */

body{
    max-width:160em;
    margin:0 auto;
}

.headerhead {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    justify-content: space-evenly;
}

div.responsive-headerhead { /* entspricht "responsive */
    left:1px;
    margin-left:auto;
    margin-right:auto;
    padding:0 0 0 0;
    width:100%;
    height:auto;      
}

div.gallery-headerhead { /* entspricht "galerie */
    width:88%;
    align-items: center;
    padding-top:1em;
    overflow:hidden;
}

.headerhead img {
    width:17.999999%;
    height:auto;
}
        
.headerhead p { 
    font-size: 2.7em;
} 
 
.headerhead p span { 
    font-size: 1.2em;
}  

#menu {
    width: 100%;
    padding: 1em 0 ;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.2em;
    line-height: 1.2em;
    float: inherit;
    z-index:999;
    display: inline-block;
}

#menu ul {
    float: inherit;
    width: 140px;
    list-style-type: none;
    display: inline-block;
}

/*--definiert die Blocküberschriften--*/
#menu p {
    font-size: 1em;
    text-align: center;
    color: #800000;
    border-top: 1px solid #800000;
    border-right: 1px solid #800000;
    border-bottom: 1px solid #ccc;  
    border-left: 1px solid #800000;
    background-size:  100% 100%;
    background-repeat: no-repeat;
    background-color: #d9a954;
    box-shadow: 0 5px 10px white inset;
    font-family: Arial, Helvetica, sans-serif;
    font-weight:bold;
    letter-spacing:inherit;
}

/*--definiert die "Drop-Down-Links" im Normalzustand--*/
#menu a, #menu li ul span {
    text-decoration: none;
    font-size: 1em;
    display: block;
    border: 1px solid #ccc;
    text-align: center;
    background-color: #d9a954;
    box-shadow: 0 5px 10px white inset;
    transition: all .25s ease-in;
    color: #800000;
}

/*--definiert die "Drop-Down-Links" im Hoverzustand--*/
#menu a:hover, #menu li ul span {
    color: #800000;
    background-color: #cdea6a;
}

#menu li ul span {  /* aktuelle Unterseite kennzeichnen */
    bbbackground: url('../images/bg200.gif') no-repeat;
    color: #800000;
    background-color: #cdea6a;
}

/*verhindert im Zusammenhang mit position absolute bei ul ul
*eine Höhenvergrößerung von #menu beim Hovern--
*/

#menu li {
    position: relative;
}

/*--versteckt die "Drop-Down-Links", solange nicht gehovert wird--*/
#menu ul ul {
    position: absolute;
    z-index: 2;
    display: none;
}

/*--lässt die Dropdown-Links beim Hovern erscheinen--*/
#menu ul li:hover ul {
    display: block;
}

/*--nur für IE-Versionen kleiner gleich 6 erkennbar--*/
* html #menu ul li{
    float: left;
    width: 100%;
}

/*--nur für IE 7 erkennbar--*/
*+ html #menu ul li {
    float: left;
    width: 100%;
}

/*--bewirkt Hover-Effekt für IE kleiner 7 auch für ul- und li-Elemente--*/
*html body {
    behavior: url(csshover3-source.htc);
    font-size: 100%;
}

*html #menu ul li a {
    height: 1%;
}

section  {
     width: 65%;
     float: left;
     margin-left: 0;
     padding-top:3em;
     margin-bottom:3em;
}

section img {
    width: 33.999%;
}

#text {
    padding: 0 5% 0;
}

#home-hah {
    padding: 0 15% 0;
}

section h4 {
    display:inherit;
    color: #1e90ff;
    font-size:1.5em;
    margin:15px auto 30px;
}

section h4 span {
    font-size: 1.6rem;
    font-weight:bold;
    letter-spacing: 0.4em;
}

section .bund {
    display:inherit;
    color: #1e90ff;
    font-size:1.5em;
    margin:15px auto 30px;
}

section .bund span {
    font-size: 1.6rem;
    font-weight:bold;
    letter-spacing: 0.4em;
}

.space5 {
    padding-left:50%;  
    margin-bottom:-.2em;
 }

aside  {
    width: 20%;
    float: right;
    padding:0;
    margin-top:3em;
}
             
aside img {
    width: 60%;
    height: auto;
}               

footer  {
    font-family: 'Oregano', cursive;
    margin:0;
    background-size:100%;
}

footer nav {
    width:80%;
	margin:0 auto;
}

footer nav ul {
    flex-direction: row;
}
	
footer nav li {
    flex: 1;
	font-size: 1.1em;
}
	
footer nav li span {
    background-color:#cdea6a;
}

div.responsive-foothead {
       /* entspricht "responsive */
    left:1px;
    margin-left:auto;
    margin-right:auto;
    padding:0 0 0 0;
    width:100%;
    height:auto;      
}

div.gallery-foothead { 
       /* entspricht "galerie */
    width:80%;
    margin:0 auto;
    padding:.1em 0 1em 0;
    overflow:hidden;
}

.foothead {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    justify-content: space-evenly;
    font-size:1em;
}

footer img {
	        width:19.999999%;     
}

footer p {
    font-size: 1.8em;
    letter-spacing:.15em;
    text-align:center;
}

#navcontainer {
    float:left;
    width: 15%;
    background-image:   url(../images/lili.gif);
    background-size: 33px 930px;
    background-repeat: no-repeat;
    background-position: 36%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: .9em;
    display:inherit;
}

#navcontainer ul {
	width: 85%;
	margin:2em auto 0;
	list-style:none;
}

#navcontainer a {
	display: block;
	overflow: hidden;
	padding: 0.4em;
	text-decoration: none;
	font-weight: bold;
	text-align: center;

    border-top: 1px solid #800000;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #800000;
    border-left: 1px solid #800000;

	box-shadow: 0 5px 10px white inset;
	color: #800000;
	background-color: #d9a954;
	transition: all .25s ease-in;
}

#navcontainer li[aria-current] a {
	background-color: firebrick;
	color: gold;
}

#navcontainer ul span {  /* aktuelle Unterseite kennzeichnen */
	display: block;
	padding: 0.4em;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	width:100%;
	
    border-top: 1px solid #800000;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #800000;
    border-left: 1px solid #800000;
	
	box-shadow: 0 5px 10px white inset;
	background-color: #cdea6a;
}

#navcontainer a:hover,
#navcontainer ul span:focus,
#navcontainer li[aria-current] a:hover {
    width:100%;
	color: darkblue;
	background-color: #cdea6a;
}

#toggleMobile p
        {
                display:none;  
        }
 
#toggleMobile
        {
                display: none;
        }
        
#toggleMobile2
        {
                display: none;
        }
                
#toggleMobile2 p
        {
                display:none;  
        }
        
#mobileMenu {
                display: none;
}
 
#sidenav {
                display: none;
}

#sidenav .closebtn {
                display:none;
}
	
   .clearfix:after {
        content: "";
        display: table;
        clear: both;
        }
}