header {
  padding: 12px;
  margin: 12px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-style: normal;
  color: whitesmoke;
  

}

#teaser {
  width: 100%;
  height: 300px;
  padding: 0px;
  padding-top: 8px;
  padding-bottom: 8px;
  margin: 0px;
  
}
#teaser img {
  width: 100%;
  height: 100%;
  object-fit: cover;

}



body {
padding: 24px;
margin: 0px;
background-color: rgb(15, 15, 15);
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-style: normal;
color: whitesmoke;
margin: 0 auto;

}

  .mitte {
      display: flex; 
      justify-content: center;
      align-items: center;
        
  }
  
  .headline {
    color: rgb(252, 239, 33);
    font-size: larger;
    text-transform: uppercase;
    text-align: left;
  }

  .headline2 {
    color: rgb(252, 239, 33);
    font-size: larger;
    text-transform: uppercase;
    text-align: left;
  }


  .subline {
    font-size: large;
    text-transform: uppercase;
    text-align: left;
    font-weight: bold;
  }
 .liste ul {
    font-size: smaller;
    list-style: circle;
    color:whitesmoke;

  }
 .imgl {
    margin-left: auto;
    margin-right: 4px;
    padding-left: 0px;
    padding-right: 24px;  
    width: 100%;
    height: 250px;
    padding-top: 4px;
    padding-bottom: 4px;
    object-fit: cover;
  
  }

.imgklein {
    height: 200px;
 
  }

 .fuhrpark {
    margin-left: auto;
    margin-right: 4px;
    padding-left: 0px;
    padding-right: 24px;  
    width: 100%;
    height: 250px;
    padding-top: 4px;
    padding-bottom: 4px;
    object-fit: cover;
  
  }  


    #galerie figure img {
    margin-left: -2em;
    margin-right: 4px;
    padding-left: 0px;
    padding-right: 24px;  
    width: 16em;
    height: 10em;
    padding-top: 4px;
    padding-bottom: 4px;
    object-fit: cover;
    }

      #galerie figcaption {
      color: rgb(15, 15, 15);
      position:relative;
      text-align: center;
      width: 16em;
      text-transform: uppercase;
      font-weight: bold;
    }

      nav {
        position: sticky;
        top: 0;        
        max-width: 60em; 
        padding-top: 2px;
        padding-bottom: 0;
        padding-left: 2px;
        padding-right: 2px;
        z-index: 99;
        background-color: rgb(65, 58, 58);
                
      }

      

     nav ul, footer ul {
      list-style: none;
      margin: 0;
      padding: 4px;
      margin-top: 0px;
      margin-bottom: 8px;
     
      
     }

     
    
     nav ul li a, footer ul li a {
      padding: 5px;    
      color: rgb(255, 0, 0);
      text-transform: uppercase;
      font-weight: 700;
      padding-top: 2px;
      font-size: 7pt;
      
     }
   
      
       section {
         left: 1em;
         top: 30em;
         margin-left: auto;
         margin-right: auto;
         margin-top: 8px;
         margin-bottom: 8px;
         box-sizing: border-box;
         font-size: larger;
         max-width: 60em;
       
       
         padding-top: 48px;
         transform: translateY(-48px);
         
       }
       
       
      footer {
        max-width: 60em; 
          padding: 2px;
         padding-top: 1px;
        padding-bottom: 20px;
          background-color: rgb(65, 58, 58);

                
      }

     .karte {
        width: 350px; 
        height: 250px;
        margin-left: 0px;
        margin-right: auto;
        padding-left: 24px;
        padding-right: auto;
        padding-top: 0;
        padding-bottom: 0;  
        object-fit: cover;
       }
        
      

     a:link {
        color: rgb(255, 0, 0);
        background-color: transparent;
        text-decoration: none;
      }
      
      a:visited {
        color: rgb(255, 0, 0);
        background-color: transparent;
        text-decoration: none;
      }
      
      a:hover {
        color: rgb(252, 239, 33);
        background-color: rgb(63, 63, 63);
        text-decoration: none;


      }

      
      a:active {
        color: rgb(255, 0, 0);
        background-color: transparent;
        text-decoration: none;
      }

      .copyright {
        color: whitesmoke;
        padding-top: 0px;
        font-size: 5pt;
        
      }

    

      .icon {
        padding: 1px;
        margin: 1px;
        height: 12px;
      }

     

      .logo {
        height: 40px;
        padding: 2px;
        margin: 2px;

      }

 .headerlogo {
        width: 50px;
        padding-top: 15px;
        padding: 2px;
        margin: 2px;
        margin-left: 2px;
        margin-right: 2px;
      }

     


    #kontakt a:hover {
      padding-top: 5px;
      
    }

  nav ul li a:hover {
      padding-top: 5px;
      
    }

footer ul li a:hover {
      padding-top: 5px;
      
    }



    .headline_mitte {
      color: rgb(252, 239, 33);
      font-size: larger;
      text-transform: uppercase;
      display: flex; 
      justify-content: center;
      align-items: center;
    }

    .headline_team {
      color: rgb(252, 239, 33);
      font-size: 9px;
      font-weight: bold;
      text-transform: uppercase;
      text-align: left;
      margin: 5px;
      
    }

    #teamfoto {
      width: 300px;
      padding-top: 15px;
      padding: 2px;
      margin: 2px;
      margin-left: 2px;
      margin-right: 2px;
    }

    .portrait, .portrait_l, .portrait_r {
      width: 100px;
      height: 140px;  
      object-fit: cover;
      
      }

      .portrait:hover{
        width: 250px;
        height: 350px;   
        transition: 2s ease-in-out;

        
        
    }

    .portrait_l:hover{
      width: 250px;
      height: 350px;   
      transition: 2s ease-in-out;
      margin-left: 10em;
      
      
      
  }

  .portrait_r:hover{
    width: 250px;
    height: 350px;   
    transition: 2s ease-in-out;
    margin-right: 10em;
    
    
}


    #team {
      font-size: 10px;
     
    
    }

    td {
      width: 100px;
    }

#cookiePopup {
    background-color: #ffffff;
    position: sticky;
    top: 0;  
    font-size: 14px;
    width: 100%;
    max-width: 42.85em;
    box-shadow: 0 0 2em rgba(5, 0, 31, 0.15);
    font-family: "Poppins", sans-serif;
    text-align: justify;
    line-height: 1.8em;
    padding: 2em 1.4em;
    border-radius: 6px;
    transition: all 0.5s ease-in;
  }

  #cookiePopup p {
    text-align: center;
    margin: 1.4em 0;
  }
  #cookiePopup button {
    background-color: #080808;
    border: none;
    color: #ffffff;
    font-size: 1.2em;
    padding: 1em 1.4em;
    display: block;
    position: relative;
    margin: auto;
    border-radius: 5px;
  }
  #cookiePopup a {
    color: #6859fe;
  }
  .hide {
    visibility: hidden;
    bottom: 2em;
    right: 0;
  }
  .show {
    visibility: visible;
    right: 0;
    bottom: 0;
  }

    @media screen and (min-width: 800px) {
      #teaser {
        height: 600px;
        padding-top: 24px;
        padding-bottom: 24px;
      }

      .imgl {
          width: 400px;
          height: 350px;
          object-fit: cover;
          margin-right: 8px;
          margin-bottom: 4px;
          margin-top: 50px;
          }
      
.imgklein {
    height: 250px;
 
  }

   nav{
       max-width: 100%; 
       padding-top: 2px;
       padding-bottom: 0;
       padding-left: 6px;
       padding-right: 8px;
      }
      
   footer{
     max-width: 100%;  
     padding: 2px;
       padding-top: 2px;
      padding-bottom: 80px;

     
      }

  nav ul li a, footer ul li a {
      padding: 8px;
      font-size: large;
          
          
  }

  .karte {
      width: 500px; 
      height: 300px;
      margin-left: 12px;
      }

  .icon {
      height: 20px;
      margin-left: 5px;
      margin-right: 5px;
       }

  .logo {         
      height: 100px;
      padding: 5px;
      margin: 5px;

  
      }
      
   .headerlogo {         
      width: 40%;
      padding: 12px;
      margin: 12px;
      margin-left: 5px;
      margin-right: 5px;
  
      }

  .copyright{
      font-size: 12pt;
  
      }
      
  a:hover {
        color: rgb(252, 239, 33);
        background-color: rgb(63, 63, 63);
        text-decoration: none;
        padding-bottom: 0;

      }

      #teamfoto {
        width: 900px;
        padding-top: 15px;
        padding: 2px;
        margin: 2px;
        margin-left: 2px;
        margin-right: 2px;
      }

      
      .headline_team {
        color: rgb(252, 239, 33);
        font-size: larger;
        font-weight: bold;
        text-transform: uppercase;
        text-align: left;
        
      }

      .portrait, .portrait_l, .portrait_r {
        width: 300px;
        height: 420px;
        object-fit: cover;
        
        }
  
        .portrait:hover{
          width: 500px;
          height: 700px;    
          transition: 2s ease-in-out;
  
          
          
      }
  
      .portrait_l:hover{
        width: 500px;
        height: 700px;   
        transition: 2s ease-in-out;
        margin-left: 0em;
        
        
        
    }
  
    .portrait_r:hover{
      width: 500px;
      height: 700px;  
      transition: 2s ease-in-out;
      margin-right: 10em;
      
      
  }

      #team {
        font-size: larger;
        margin-left: 5px;
      }

      td {
        width: 300px;
      }
}
     @media screen and (min-width: 900px) and (max-width: 1800px)  { 
  #galerie figure {
      background: #FFF;
      box-shadow: 0 0 0 rgba(0, 0, 0, 0);
      display: inline-block;
      height: 8em;
      margin: 0;
      margin-left: 10em;
      margin-right: 10em;
      overflow: hidden;
      padding: 0;
      width: 16em;
      transition: all 0.25s ease-in;

    }
    
    #galerie figure img {
      width: 16em;
      height: 8em;
      margin-left: 0;

    }
    
    #galerie figure:hover,
    #galerie figure:focus {
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.8);
      margin-left: 15em;
      margin-right: 10em;
      padding: 5px 5px 30px 5px;
      width: 16em;
      z-index: 2;
      transform: scale(2);
    }
    
    #galerie figcaption {
      color: #333;
      position:relative;
      text-align: center;
      width: 16em;
    }
      .maschinen{
     margin-left: 10em;}
     
     .headline2 {
       margin-left: 10em;}
}

   @media screen and (min-width: 1800px) { 
  #galerie figure {
      background: #FFF;
      box-shadow: 0 0 0 rgba(0, 0, 0, 0);
      display: inline-block;
      height: 20em;
      margin: 0;
      margin-left: 0;
      overflow: hidden;
      padding: 0;
      width: 30em;
      transition: all 0.25s ease-in;

    }
    
    #galerie figure img {
      width: 30em;
      height: 20em;
      margin-left: 0;

    }
    
    #galerie figure:hover,
    #galerie figure:focus {
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.8);
      margin-left: 15em;
      padding: 5px 5px 30px 5px;
      width: 30em;
      z-index: 2;
      transform: scale(2);
    }
    
    #galerie figcaption {
      color: #333;
      position:relative;
      text-align: center;
      width: 30em;
    }

    }