

nav{
    background-color:var(--menu-hintergrund);
    font-family: 'Poppins', sans-serif;
    display:flex;
    justify-content: flex-end;
    width:100%;
    margin:0px;
    position:relative;
    z-index:500;
  
}

 .show,  .icon, nav input{
    display:none;
}

nav ul {
    list-style:none;
}

nav div.logo{
position: absolute;
left:20px;

}


@media not all and (max-width:767px){
    
    nav .logo img {
    height:40px;
    margin-top:10px;      
}


    nav ul  {
        list-style: none;
        display:flex; 
        flex-wrap: wrap;        
       
    }

    nav ul li {
        margin-right: 20px;
        font-size:20px;   
    }

    nav ul >li ul {  
     
    }

    nav ul li ul li ul {
        display:inline;  
        padding:0px;
    }    

    nav > ul >li > ul {
        display:none;  
        flex-direction: row;
        flex-wrap: wrap;
        position :absolute; 
        z-index:100;
        right:1%;
        top: 45px;  
        justify-content: left;    
        background-color:var(--menu-hintergrunddunkel);
        border-style: none;
        max-width:95%;
        
        justify-self: right;
        border-top:solid;
        border-color:var(--highlight);
        padding-bottom: 30px;  
    }
    
    nav > ul >li:hover > ul{
        display:flex;    
 
    }
    
    .flex {
        display:flex;
    }
    
    
    nav ul li ul li {
        width:7em;
        margin-top:7px;
        margin-bottom:7px;
        font-weight: bold;
        overflow:hidden;
    
        display:block;
       
    }
    
 
    
    nav ul li ul li ul li
    {
        border-style: none;
        font-size:15px;
        margin:0px;
        line-height:1.1em;
      
        font-weight:normal;
        width:100%;
    } 
 
    
    nav ul li ul li ul li ul li {
   
        font-size:11px;
        line-height:1em;
        margin-left:12px;
    }

}
@media all and (max-width:767px) {
    nav {
           display:block;
           height:50px;
          
        } 
    nav .show + .drop, nav ul{
        display:none;
      }
        
    nav .logo img {
    height:30px;
    margin-top:10px;      
    }
      
    nav .icon{
        display:block;
        color:var(--menu-schrift);
        position:absolute;
        top:10px;
        right:20px;        
      }
      
    nav .icon img {
        height:30px;       
    }   

    nav>ul{
      margin-top:50px;    
      float:left;      
      font-size:20px;
      background-color:var(--menu-hintergrund);
      width:100%;
      padding-left:5px;   
    }  
      
    nav ul ul{     
        font-size:15px;
        line-height:1.3em; 
        padding-top:5px;
        padding-bottom:5px;
        padding-left:10px;
        background-color:var(--menu-hintergrunddunkel);
      }  
       
    nav ul ul ul {     
        background-color:var(--menu-hintergrunddunkel2);
    }
   
    [id^=btn]:checked + ul{
        display:block;
      }

    .show{
        display:block;
   
      }



}
  

