/* ####################### Navigation alle Seiten  #################### */   
 
       
.card{ 
   position: fixed;
   top: 25%; 
   left: 1%;
   z-index: 9;  
   border: solid thin var(--schrift-color);
   padding: 5px;
   border-radius: 5px; 
}   

.nav-con{ 
   width: 238px;
   background-color: var(--nav-color);
   position: sticky; 
}  

@media(max-width:800px){ 
   .card{ 
      position: fixed;
      top: 0%; 
      left: 0%; 
      width: 100%;
      border: none;
      border-bottom: thin solid var(--schrift-color);
      padding: 0;
      border-radius: 0px; 
      z-index: 999; 
   }  
   .nav-con { 
      width: 100%; 
   }
}               

              
#hamitems { 
   display: inline-block; 
}

#hamitems a {
  flex-grow: 1;
  flex-basis: 0;  
  align-items: left; 
  color: var(--schrift-nav-color);
  padding: 3px;
  text-decoration: none; 
} 
       

#hamnav label, #hamb { 
   display: none; 
} 


@media screen and (max-width: 800px){
  #hamitems a {
    box-sizing: border-box;
    display: block;
    max-width: 100%;
    height: auto;
   } 

  #hamnav label {
    display: inline-block; 
    background-color: var(--nav-color); 
    font-size: 28px;
    color: var(--schrift-color);
    padding: 5px;
    z-index: 999;
   }

  #hamitems { 
   display: none; 
}

  #hamnav input:checked ~ #hamitems { 
   display: block; 
   } 
}

.nav-logo{ 
   max-width: 150px;
   height: auto;
   margin:8px; }

.nav-logo:hover{ 
   opacity: 1; 
}

.nav-text{ 
   font-weight: 300;
   font-size: 18px;
   letter-spacing: 1px;
   line-height: 25px;
   margin-top: 5px;
   margin-left: 30px;
   color: var(--schrift-color); 
} 

@media(max-width:900px){ 
   .nav-text{ 
      font-weight: 300;
      font-size: 16px;
      margin-top: 15px;
      letter-spacing: 2px;
      line-height: 19px;  
   } 
}

.nav-text:hover{ 
   color: var(--schrift-nav-color-hover);  
}


.nav-fyt{ 
   max-width: 150px; 
   height: auto;
   margin-left: 3px;
   margin-top: 10px;
} 


.logos{ 
   float: left; 
   padding: 0 10px; 
}


@media screen and (max-width: 800px){  
   .nav-logo {
      max-width: 150px;
      height: auto;
      margin-top: -30px; 
      margin-left: 40px;
   } 
}

      
 @media only screen and (min-width: 800px) { 
   .card div {  
      display: flex; 
    }  
   }