header{ display: flex;
    justify-content: center;
    align-items: center;
       background: url('../images/screen/bg-storchenwiese.gif') repeat-x ;
       background-position: bottom; 
       gap: 50px;
       margin-top: 25px;
       }

.header{
    display: grid;
    grid-template-rows: 50px 300px 20px; 
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas:  "logo   navi   navi"
                          "wimpel wimpel baum" 
                          "wimpel wimpel baum" ;
    grid-gap: 2px;
    }

   .logo{
    height:290px;
    grid-area: logo;
    }

.navi {height:290px;
    grid-area: navi;
    }

.wimpel{
     grid-area: wimpel;
     margin-top: 100px;
     margin-left: 70px;
   }
 
.baum{
     grid-area: baum;
     margin-left: 100px;
   }
    

.header_text{
    width: 650px;
}
.circle{
    height: 290px;
    width: 290px;

    max-height: 80vw;
    max-width: 80vw;
    overflow: hidden;
    border-radius: 50%;
   
    display: flex;
    justify-content: center;
    align-items: center;
    }
.circle img{
    height: 100%;
}

/*Hauptnavigation*/
nav{ margin-bottom: 200px;display: flex; justify-content: center; align-items: center;}
nav ul{color:#666; float: right; list-style: none; display: flex; margin:5px 0 0 15px;}

/*nav a{text-decoration: none;}*/
nav ul li {float: left; list-style: none; position: relative; margin:20px 20px 0px 20px; font-family: "felt-tip-woman", "sans-serif";}
nav ul li a {color:#666; font-size:24px; font-weight:normal; text-decoration:none !important;}
nav ul li a:hover {color:#977297;} 

#kontakt .nav-kontakt,
#index .nav-index,
#foto .nav-foto,
#konzept .nav-konzept,
#meezen .nav-meezen{
  color:#977297;
}

/* Unternavigation */
nav ul li ul{display: none; position: absolute;}
nav ul li:hover ul{ display: block;}
nav ul li ul li a{color:#666; font-size:20px; font-weight:normal; text-decoration:none;font-family: "felt-tip-woman", "sans-serif";}
nav ul li ul li a:hover{color:#977297;}




@media(max-width: 800px){
   }