@charset "UTF-8";
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }
  :root {
    --gutter: 20px;
  }
html {
  box-sizing: border-box;
  font-size: 62.5%; }
  @media only screen and (max-width: 75em) {
    html {
      font-size: 50%; } }

body {
  font-family: 'Inter-Light';
  color: white;
  background-color: black;
  font-weight: 300;
  line-height: 1.6;
  padding:20px ;
  /* padding:10px ; decide how much!! */

}
p{
  margin-bottom: 0rem;
}
  
  @media only screen and (max-width: 75em) {
    body {
      font-size: 50%; } }
  @media only screen and (max-width: 991.98px) {
    body {
      font-size: 70%; } }

.container {
  display: grid;
  background-color: black;
  grid-template-rows: repeat(auto-fit, min-content);
  grid-row-gap: 1.5rem;
  grid-template-columns: [full-start] minmax(3vw, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(3vw, 1fr) [full-end]; }

  @media only screen and (max-width: 991.98px) {
    .container {
      display: grid;
      background-color: black;
      grid-template-rows: repeat(auto-fit, minmax(0, 1fr));
      grid-row-gap: 1.5rem;
      padding-left: 2vw;
      padding-right: 2vw;
      /* grid-template-columns: [full-start] [center-start] 1fr [center-end] [full-end]; */
       }
    
  }
.containerOverview {
  width: 100%;
  display: grid;
  background-color: black;
  grid-template-rows: repeat(auto-fit, min-content);
  grid-template-columns: [full-start] minmax(7vw, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(7vw, 1fr) [full-end]; }

  .HomePageHeaderPos{
    grid-column:center-start / center-end ;
  }
  .HomePageHeaderPos{
    text-align: center;
    font-size: 14px;
  }
.containerMascOverview {
  display: grid;
  background-color: black;
  grid-template-rows:repeat(auto-fit, min-content);

  grid-template-columns: [full-start] minmax(7vw, 1fr) [center-start] repeat(10, [col-start] minmax(min-content, 14rem) [col-end]) [center-end] minmax(7vw, 1fr) [full-end]; }

  .impressumContainer{
    grid-column: center-start / center-end;
    padding-top:10rem;
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-areas:"textimpr imgimpr";
    align-items: start;
    justify-items: stretch;
  }
  .textCont{
    grid-area:textimpr;
    grid-column: 1;
  }
    .textCont p{
      grid-column: 1 ;
      font-size: 15px;
      padding-bottom: 20px;
      padding-top: 20px;
    }

    
    .textCont h1,h2,h3,h4{
      grid-column: 1 ;
      font-size: 20px;
      color:white;

    }
    .textCont h1{
      font-size: 30px;
      color:white;

    }
    .impressumContainer img{
      grid-area: imgimpr;
      grid-column: 2;
      justify-self: start;
    }

.header {
  /* height: 95vh; */
  background-color: transparent;
  grid-column: full-start / full-end;
  grid-row: 1 / 2;
  
  padding-left: 3.625rem;
  
  padding-right: 2rem;
  
  z-index: 11; }

  .headertest{
    height: 95vh;
    background-size: cover;
    background-position: top;
    color: white;
    width: 100%;
    text-align: center;
    overflow: hidden;
  }

  #myVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
    z-index: -1;
    object-position: center;
    object-fit: cover;
  }
  .logo-box {
    grid-area: logo;
    justify-self: end;
    color: white;
    height: auto;
    z-index: 17;
    display: grid;
    align-items: center; }
    .logo-box__img {
      padding-left: 20px;
      width: 100%;
      height: auto; }
  
  @media only screen and (min-width: 992px) {
  .nav {
    grid-row: 1;
    z-index: 13;
    width: 100%;
    display: grid;
    grid-template-columns: minmax(min-content, max-content) 0.5fr;
    grid-template-areas: "logo . navigation";
    justify-items: end; 
    align-items: center;
    position: fixed;
    background-color: black;
    right: 0;
  
  }
}

@media only screen and (max-width: 991.98px) {
  .nav {
    grid-row: 1;
    padding-top:2rem;
    z-index: 13;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end; 
    align-items: end;
    background-color: black;
    /* position:fixed;
    right:15px;
    background:black; */

  
  }
  /* .sticky {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
} */
  .logo-box {
    padding:1rem ;
    grid-area: logo;
    justify-self: center;
    color: white;
    min-width: 13.938rem;
    height: auto;
    z-index: 17;
    display: grid;
    align-self: center; }

}
    /* @media only screen and (max-width: 68.5em) {
      .nav {
        grid-template-columns: min-content 0.9fr max-content;
        grid-template-areas: "logo . navigation"; } } */

  
/* 
        // Small devices (landscape phones, 576px and up)
        @media (min-width: 576px) { ... }
        
        // Medium devices (tablets, 768px and up)
        @media (min-width: 768px) { ... }
        
        // Large devices (desktops, 992px and up)
        @media (min-width: 992px) { ... }
        
        // Extra large devices (large desktops, 1200px and up)
        @media (min-width: 1200px) { ... }

        @media (max-width: 575.98px) { ... }

        // Small devices (landscape phones, less than 768px)
        @media (max-width: 767.98px) { ... }

        // Medium devices (tablets, less than 992px)
        @media (max-width: 991.98px) { ... }

        // Large devices (desktops, less than 1200px)
        @media (max-width: 1199.98px) { ... } */

  
    .toggle-nav {
      display: none !important;
  
  }
  .main-nav ul{
    display:none;
  }
  .small-nav ul{
    display:none;
  }  
  
  .smallnavigation{
    display: none;
  }
  .toggle-nav {
    display: none;
  }
 
  
   @media screen and ( min-width: 992px) {
  .navigation {
    display: block !important;
    z-index: 12;
    grid-area: navigation;
    justify-self: end;
    list-style: none; 
    margin-right: 100px;
  }
  
  .main-nav{
    display: block !important;
  }
  .small-nav{
    display: none !important;
  }
  
    .main-nav ul{
      position: relative;
      display: inline-block;
      z-index: 10;
      display: flex;
      flex-direction: row;
      list-style-type: none;
      margin-right:20px;
    }
  
    .main-nav ul li {
      background-color: transparent;
      color: white;
      padding: 16px;
      font-size: 1.5rem;
      border: none;
      cursor: pointer; }

     

      }

    
    .main-nav ul ul {
  
      display: none;
      font-size: 1.5rem;
      background-color: rgb(0, 0, 0);
      opacity: 80%;
      min-width: 160px;
      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
      position: absolute;
      z-index: 1; 
  }
  
  .main-nav ul li a {
    color: white;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    /*border-bottom: 1px dotted grey; */
  }
  
    .main-nav ul li a:hover {
    background-color: #222222;
    
   }
   
  
    .main-nav:hover .main-nav ul li {
      display: block; }
  .main-nav > .main-nav ul li:hover > .main-nav ul li ul > a {
    display: block; }
  
    .main-nav > .main-nav ul li > .main-nav ul li ul > a {
      display: none; }
    
    .main-nav:hover .main-nav ul li {
      background-color: #222222; }
    
  
  .main-nav ul li:hover > ul {
    display: block;
  }
  



  .small-nav ul{
    position: relative;
    display: inline-block;
    z-index: 10;
    display: flex;
    flex-direction: row;
    list-style-type: none;
    margin-right:20px;
  }

  .small-nav ul li {
    background-color: transparent;
    color: white;
    padding: 16px;
    font-size: 1.5rem;
    border: none;
    cursor: pointer; }


  
  .small-nav ul ul {

    display: none;
    font-size: 1.5rem;
    background-color: rgb(0, 0, 0);
    opacity: 80%;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    position: absolute;
    z-index: 1; 
}

.small-nav ul li a {
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  /*border-bottom: 1px dotted grey; */
}

  .small-nav ul li a:hover {
  background-color: #222222;
  
 }
 

  .small-nav:hover .small-nav ul li {
    display: block; }
.small-nav > .small-nav ul li:hover > .small-nav ul li ul > a {
  display: block; }

  .small-nav > .small-nav ul li > .small-nav ul li ul > a {
    display: none; }
  
  .small-nav:hover .small-nav ul li {
    background-color: #222222; }
  

.small-nav ul li:hover > ul {
  display: block;
}



  
  .linie {
    width: 20px;
    height: 1px;
    background-color: white;
    margin: 5px 0; }
  
  @media only screen and (max-width: 991.98px) {
    .smallnavigation {
      display: block;
      grid-area: navigation; }
      .toggle-nav {
        display: inline-block !important;
      }
      a.toggle-nav {
        color: #fff;
        transition: color linear 0.15s;
        font-size:20px;
        text-decoration: none;
    }
    a.toggle-nav:hover, a.toggle-nav:active {
        text-decoration: none;
        color: #fff;
    } 
    
    a.toggle-nav:link, 
      a.toggle-nav:visited,
      a.toggle-nav:hover, 
      a.toggle-nav:active {
            text-decoration: none;
            color: #fff;
        } 
  
    .navigation {
      text-align: left;
      z-index: 12;
      justify-self: center;
      align-self:center;
      list-style: none;
      
      
    }
    #menu-small-nav{
      display: grid;
     grid-template-columns: 1fr 1fr;
     grid-auto-rows: min-content;

    }
    #menu-item-4569{
      grid-column: 1;
      grid-row: 1;
    }
    #menu-item-4570{
      grid-column: 1;
      grid-row: 2;
    }
    #menu-item-4574 {
      grid-column: 1;
      grid-row: 3;
    }
    #menu-item-4573 {
      grid-column: 1;
      grid-row: 4;
    }
    #menu-item-4571 {
      grid-column: 2;
      grid-row: 1;
    }
    #menu-item-4572{
      grid-column: 2;
      grid-row: 2;
    }
    #menu-item-4575{
      grid-column: 2;
      grid-row: 3;
    }
    #menu-item-4576{
      grid-column: 2;
      grid-row: 4;
    }
    #menu-item-4577{
      grid-column: 2;
      grid-row: 5;
    }
    
    .header {
      height: min-content;
      background-color: transparent;
      grid-column: full-start / full-end;
      grid-row: 1;
      z-index: 11; }

    .main-nav{
      position: relative;
      display: none;
      z-index: 10;
    }
    .small-nav{
      position: relative;
      display: none;
      z-index: 10;
    }
  
    .menu-navbar{
      display: none;
      font-size: 1.5rem;
      background-color: black;
      min-width: 160px;
      box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
      position: absolute;
      z-index: 1; }
  
    
    .main-nav ul {
      display: inline-block;
      left:0px;
      z-index: 10;
      list-style-type: none;
      }
      .main-nav ul li 
      {
        
        background-color: transparent;
        
        color: white;
        font-size: 1.5rem;
        border: none;
        cursor: pointer; 
        
  
      }
  
     
      .main-nav ul ul {
        display: none;
        font-size: 1.5rem;
        background-color: black;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  
        z-index: 1; 
    }
  
    .main-nav ul li a {
      color: white;
      padding: 12px 16px;
      text-decoration: none;
      display: block;
      /* border-bottom: 1px dotted grey; */
     
    }
    .main-nav ul li:hover {
      background-color: #0c0c0c; }
  
    .main-nav:hover .menu-navbar li {
      display: block; }
  
    .main-nav ul li:hover > ul {
      display: block; }
    
      .main-nav ul li > ul{
      display: none; }

      .small-nav ul {
        display: inline-block;
        left:0px;
        z-index: 10;
        list-style-type: none;
        }
        .small-nav ul li 
        {
          
          background-color: transparent;
          
          color: white;
          font-size: 1.5rem;
          border: none;
          cursor: pointer; 
          
      
        }
      
       
        .small-nav ul ul {
          display: none;
          font-size: 1.5rem;
          background-color: black;
          min-width: 160px;
          box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
      
          z-index: 1; 
      }
      
      .small-nav ul li a {
        color: white;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        /* border-bottom: 1px dotted grey; */
       
      }
      .small-nav ul li:hover {
        background-color: #0c0c0c; }
      
      .small-nav:hover .menu-navbar li {
        display: block; }
      
      .small-nav ul li:hover > ul {
        display: block; }
      
        .small-nav ul li > ul{
        display: none; }
  
  
      }
   
  
    
  
    
  
  .history {
    background-color: black;
    grid-column: center-start / center-end;
    display: grid;
    grid-template-rows: min-content 3, minmax(163.5px, 1fr);
    grid-row-gap: 2.5rem;
    justify-items: center; }
    @media only screen and (max-width: 50.5em) {
      .history {
        grid-template-rows: 1fr;
        grid-row-gap: 2.5rem;
        justify-self: center;
        padding-bottom: 8rem; } }
    @media only screen and (max-width: 50.5em) {
      .history {
        grid-row-gap: rem; } }
  
  .historyTitle {
    grid-row: 1;
    font-family: 'Inter-Thin' ;
    text-align: center;
    font-size: 3rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1.5rem;
    /* 80% */
    padding-bottom: 2rem; }
  
  .historyCard {
    background: #2a2a2a;
    display: grid; 
    transition: transform .2s;

  
  }
  .imgCard:hover{
    transform: scale(1.1);
      }
      

    @media only screen and (max-width: 50.5em) {
      .historyCard {
        grid-template-areas: "imgcard" "textcard";
        grid-template-rows: min-content min-content;
        max-width: 400px; } }
    @media only screen and (max-width: 30em) {
      .historyCard {
        max-width: 300px; } }
    @media only screen and (min-width: 50.5em) {
      .historyCard {
        grid-template-columns: 1fr 2fr;
        grid-template-areas: "imgcard textcard"; } }
  
  @media only screen and (min-width: 50.5em) {
    #myBtn {
      display: none; }
    #myBtn2 {
      display: none; }
    #myBtn3 {
      display: none; }
    #dots {
      display: none; }
    #more {
      display: block; } }
  
  @media only screen and (max-width: 50.5em) {
    #more2 {
      display: none; }
    #more3 {
      display: none; }
    #more {
      display: none; } }
  
  .imgCard {
    grid-area: imgcard; }
  
  .historyCard img {
    width: 100%;
    height: 100%;
    flex-shrink: 0; }
  
  .textCard {
    width: 100%;
    height: 100%;
    grid-area: textcard;
    color: white;
    padding: 3.125rem;
    align-content: center;
    justify-self: center;
    display: grid;
    grid-template-rows: repeat(2, min-content);
    grid-template-areas: "title" "par"; }
    .textCard a{
      text-decoration: none;
      color:white;
    }
    @media only screen and (max-width: 50.5em) {
      .textCard {
        background-color: #454545;
        padding: 2rem; } }
    @media only screen and (max-width: 30em) {
      .textCard {
        height: 100%; } }
    .textCard__title {
      grid-area: title;
      align-self: center;
      font-family: 'Inter-Thin' ;
      font-size: 2.0rem;
      font-style: normal;
      font-weight: 200;
      line-height: 1.5rem;
      padding-bottom:1rem;
      /* 68.571% */ }
    .textCard__par {
      grid-area: par;
      align-self: center;
      font-size: 1.8rem;
      font-family: 'Inter-Thin' ;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }
  
  .imageSeq {
    background-color: black;
    grid-column: full-start / full-end;
    display: grid;
    grid-template-columns: [full-start] minmax(3rem, 1fr) repeat(4, [col-start] minmax(min-content, 1fr) [col-end]) minmax(3rem, 1fr) [full-end];
    grid-auto-rows: repeat(2, minmax(auto, min-content));
    grid-gap: 5%;
    align-items: center;
    justify-content: center;
    padding-bottom: 6.875rem;
    padding-top: 3.125rem; }
    .imageSeq__rectangle {
      height: auto;
      width: 100%;
      height: calc(1vw + 60%);
      background-color: #171717;
      grid-column: full-start / full-end;
      grid-row: 1; }
    .imageSeq__im1 {
      grid-column: 2;
      grid-row: 1;
      
    }

    .imageSeq__im1 img {
      width: calc(5vw + 80%);
      height: auto;
      opacity: 0.6; 
      transition: transform .2s;
}
  .imageSeq__im1 img:hover{
    transform: scale(1.1);
      }


    .imageSeq__MaschineDesc1 {
      text-align: center;
      grid-column: 2;
      grid-row: 2; }
    
    .imageSeq__MaschineDesc1 p{
      color: white; 
      text-align: center; 
      font-size: 1.2vw;
    }

    .imageSeq__im2 {
      grid-column: 3;
      grid-row: 1; }
    .imageSeq__im2 img {
      width: calc(5vw + 80%);
      height: auto;
      opacity: 0.6; 
      transition: transform .2s;
    }
      .imageSeq__im2 img:hover{
        transform: scale(1.1);
          }
    .imageSeq__MaschineDesc2 {
      text-align: center;
      grid-column: 3;
      grid-row: 2; }
      .imageSeq__MaschineDesc2 p{
        color: white; 
        text-align: center; 
        font-size: 1.2vw;
      }
    .imageSeq__im3 {
      grid-column: 4;
      grid-row: 1; }
    .imageSeq__im3 img {
      width: calc(5vw + 80%);
      height: auto;
      opacity: 0.5; 
      transition: transform .2s;
}
  .imageSeq__im3 img:hover{
    transform: scale(1.1);
      }
    .imageSeq__MaschineDesc3 {
      text-align: center;
      grid-column: 4;
      grid-row: 2; }
      .imageSeq__MaschineDesc3 p{
        color: white; 
        text-align: center; 
        font-size: 1.2vw;
      }
    .imageSeq__im4 {
      grid-column: 5;
      grid-row: 1; }
    .imageSeq__im4 img {
      width: calc(5vw + 80%);
      height: auto;
      opacity: 0.5; 
      transition: transform .2s;
}
  .imageSeq__im4 img:hover{
    transform: scale(1.1);
      }
    .imageSeq__MaschineDesc4 {
      text-align: center;
      grid-column: 5;
      grid-row: 2; }
      .imageSeq__MaschineDesc4 p{
        color: white; 
        text-align: center; 
        font-size: 1.2vw;
      }
  .image2 {
    background-color: black;
    grid-column: center-start / center-end;
     }
    .image2__pic {
      width: 100%;
      height: auto; }

  .wp-image-5576{
      width: 100%;
      height: auto; }
  .image2 img{
    width: 100%;
    height: auto;
  }
  .wp-block-button__link{
    background-color: red;
  }

 
  div.wp-block-cover.image2 div.wp-block-cover__inner-container.is-layout-constrained.wp-block-cover-is-layout-constrained div.wp-block-buttons.is-layout-flex.wp-block-buttons-is-layout-flex div.wp-block-button a.wp-block-button__link.has-vivid-red-background-color.has-background.has-small-font-size.has-text-align-right.has-custom-font-size.wp-element-button{
    background-color: red;
    width: max-content;
    padding: 10px;
    line-height: 0px;
  }
  .wp-block-buttons a {
    line-height: 0px;
  }
  .kontakt {
    background-color: black;
    grid-column: full-start / full-end;
    grid-row: 20;
    padding-bottom: 5rem;
    display: grid;
    grid-auto-rows: max-content;
    grid-template-columns: 0.5fr repeat(4, minmax(min-content, 1fr)) 0.5fr;
    align-content: stretch; }
    @media only screen and (max-width: 50.5em) {
      .kontakt {
        display: grid;
        grid-template-rows: min-content min-content;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        grid-column-gap: 10rem;
        grid-row-gap: 3rem;
        padding: 0px;
        margin: 0px; } }
    @media only screen and (max-width: 30em) {
      .kontakt {
        display: grid;
        grid-template-rows: min-content min-content;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-column-gap: 2rem;
        grid-row-gap: 3rem;
        padding: 0px;
        margin: 0px; } }
  
  .contacts {
    grid-row: 1;
    grid-column: 2;
    color: white;
    font-size: 2.5rem; }
    @media only screen and (max-width: 50.5em) {
      .contacts {
        grid-row: 2;
        grid-column: 3;
        justify-self: center; } }
    @media only screen and (max-width: 30em) {
      .contacts {
        grid-row: 2;
        grid-column: 2;
        justify-self: center; } }
  
  .contacts br {
    margin: 1em;
    display: block;
    font-size: 24%; }
  
  .contacts p {
    font-family: 'Inter-Thin' ;
    font-size: 1.5rem; }
  
  .contacts b {
    font-family: 'Inter-Thin' ;
    font-size: 2rem; }
  
  .mapSite {
    align-self: center;
    font-size: 1.5rem;
    grid-row: 1;
    grid-column: 3 / 4;
    color: white;
    border-left: 2px solid white;
    padding-left: 20px;
    justify-self: center; }
    @media only screen and (max-width: 50.5em) {
      .mapSite {
        grid-row: 2;
        grid-column: 4;
        justify-self: center; } }
    @media only screen and (max-width: 30em) {
      .mapSite {
        grid-row: 2;
        grid-column: 3;
        justify-self: center; } }
  
  .mapSite > ul > li {
    font-family: 'Inter-Thin' ; }
  
  .icons {
    grid-row: 1;
    grid-column: 5 / 6;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(3, max-content);
    grid-auto-rows: max-content;
    align-self: end;
    justify-self: end; }
    @media only screen and (max-width: 50.5em) {
      .icons {
        grid-row: 1;
        grid-column: 2 / 6;
        justify-self: center; } }
    @media only screen and (max-width: 30em) {
      .icons {
        grid-row: 1;
        grid-column: 2 / 4;
        justify-self: center; } }
  
  .youtube {
    align-self: end;
    grid-row: 1;
    grid-template-columns: 1;
    align-self: end; }
  
  .instagram {
    grid-row: 1;
    grid-template-columns: 2;
    align-self: end; }
  
  .linkedin {
    grid-row: 1;
    grid-template-columns: 3;
    align-self: end; }
  
  .kundenzufriedenheit {
    grid-column: col-start 2 / col-end 9;
    margin: 5rem 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr));
    justify-items: stretch;
    grid-row-gap: 3rem;
   
  }

  

  .iconsgroup {
    max-width: 3rem;
    max-height: 3rem; }
  
  .feature {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, min-content);
    justify-items: center;
    grid-row-gap: 3rem;
    align-content: baseline; 
    
    
  }
    .feature__icon {
      justify-self: center;
      height: auto;
      align-self: end; }
    .feature__num p {
      color: white;
      font-size: 5rem;
      text-shadow: 0px 0px 30px rgba(255, 255, 255, 0.3), 0px 0px 30px rgba(255, 255, 255, 0.3), 0px 0px 30px rgba(255, 255, 255, 0.3), 0px 0px 10px rgba(255, 255, 255, 0.3), 0px 0px 10px rgba(255, 255, 255, 0.3);
      line-height: 1.5rem;
      font-family: 'Inter-Thin' ; 
      text-decoration: none;
    }
    .feature__text {
      font-size: 2rem;
      text-decoration: none;
      text-align: center;
      font-weight: 300;
      line-height: 1.5rem;
      letter-spacing: 0em;
      font-family: 'Inter-Thin' ;
      display: grid;
      grid-template-rows: min-content min-content;
      grid-row-gap: 1rem; }
    .feature__text p:nth-child(1) { 
      color: white; 
      font-weight: bold;
    }
    .feature__text p:nth-child(2) { 
      color: white; 
    }
    @media only screen and (max-width: 991.98px) {
      .kundenzufriedenheit {
      grid-column: col-start 2 / col-end 9;
      margin: 5rem 0;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr));
      justify-items: stretch;
      grid-row-gap: 3rem;
     
    }
    .feature {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: repeat(3, min-content);
      justify-items: center;
      grid-row-gap: 3rem;
      align-content: baseline; 
      
      
    }
      .feature__icon {
        
        height: auto;
        align-self: end; 
        display: grid;
        grid-template-columns: repeat(3, min-content);

        }
        .feature__icon figure  {
          grid-column: 2;
          justify-self:center;
           }
           .feature__icon img  {
            width: 10vw;
             }
      .feature__num p {
        color: white;
        font-size: 2rem;
        text-shadow: 0px 0px 30px rgba(255, 255, 255, 0.3), 0px 0px 30px rgba(255, 255, 255, 0.3), 0px 0px 30px rgba(255, 255, 255, 0.3), 0px 0px 10px rgba(255, 255, 255, 0.3), 0px 0px 10px rgba(255, 255, 255, 0.3);
        line-height: 1.5rem;
        font-family: 'Inter-Thin' ; 
        text-decoration: none;
      }
      .feature__text {
        font-size: 2rem;
        text-decoration: none;
        text-align: center;
        font-weight: 300;
        line-height: 1.5rem;
        letter-spacing: 0em;
        font-family: 'Inter-Thin' ;
        display: grid;
        grid-template-rows: min-content min-content;
        grid-row-gap: 1rem; }
      .feature__text p:nth-child(1) { 
        color: white; 
        font-weight: bold;
        font-size: 1.8rem;
      }
      .feature__text p:nth-child(2) { 
        color: white; 
        font-size: 1.8rem;
      }
  
    }
  hr {
    display: block;
    height: 1px;
    width: 100%;
    grid-column: 1 / -1;
    padding: 0;
    border: 0.1885rem solid #7a0000; }
  
  .video-box {
    background-color: black;
    grid-column: full-start / full-end;
    grid-row: 2;
    display: grid;
    justify-content: center;
    /* width: 100%; */
    /* height: 100%; 
    /* position: relative; */
    }
    
  
  /* #video-box:before {
    min-height: 100%;
    content: '';
    position: absolute;
    width: 100%;
    background: linear-gradient(to right, #000000, transparent, transparent, transparent, transparent), linear-gradient(to top, #000000, #1d1d1d, transparent, transparent, transparent); }
  .video {
    width: 90%;
    height: auto; }
   */
  .description {
    border-top: 1px solid #1c1c1c;
    background-color: black;
    color: white;
    grid-column: center-start / center-end;
    display: grid;
    grid-template-areas: ". text-group .";
    grid-template-columns: 1fr max-content 1fr;
    justify-items: center;
    grid-row-gap: 0.7rem;
    padding-bottom: 8vw;
    padding-top: 4vw; }
    .description__text-group {
      grid-area: text-group;
      display: grid;
      grid-template-areas: "desctitle" "descpar1" "descpar2";
      grid-row-gap: 0.938vw; }
    .description__title {
      grid-area: desctitle;
      font-family: 'Inter-Thin' ;
      font-size: 1.875vw;
      font-weight: 300;
      line-height: 2.25rem;
      letter-spacing: 0em;
      text-align: center; }
    .description__par1 {
      grid-area: descpar1;
      font-family: 'Inter-Thin' ;
      font-size: 1.25vw;
      font-style: italic;
      font-weight: 300;
      line-height: normal;
      text-align: center; }
    .description__par2 {
      grid-area: descpar2;
      font-family: 'Inter-Thin' ;
      font-size: 1.25vw;
      font-style: italic;
      font-weight: 300;
      line-height: normal;
      text-align: center; }
  
  .kundenzufriedenheitTitle {
    padding-top: 7rem;
    background-color: black;
    grid-column: full-start / full-end;
     }
  
  .kundenzufriedenheitTitle p {
    color: white;
    font-size: 2rem;
    text-align: center;
    letter-spacing: 0em;
    font-weight: 300; }

  .kundenzufriedenheitTitle p:nth-child(2) { 
    font-size: 1.5rem;
  }
  
  .video-overview {
    background-color: black;
    grid-column: full-start / full-end;
    grid-row: 2; }
  
  .video {
    width: 100%;
    height: auto; }
  
  .imageSeqOverview {
    background-color: black;
    grid-column: full-start / full-end;
    grid-row: 4;
    display: grid;
    grid-template-columns: [full-start] minmax(3rem, 1fr) repeat(3, [col-start] minmax(min-content, 1fr) [col-end]) minmax(3rem, 1fr) [full-end];
    grid-auto-rows: minmax(auto, min-content);
    align-items: center;
    justify-content: center;
    padding-bottom: 6.875rem;
    padding-top: 3.125rem; }
    .imageSeqOverview__rectangle {
      width: calc(5vw + 100%);
      height: calc(1vh + 60%);
      background-color: #7A0000;
      grid-column: full-start / full-end;
      grid-row: 1; }
    .imageSeqOverview__im1 {
      grid-column: 2 / 5;
      grid-row: 1; }
    .imageSeqOverview__im1 img {
      width: 100%;
      height: auto; }
      .video-box video{
        object-fit: fill;
        width: 100%;
        height: 600px;
      }
      
  .maschinesIcons {
    padding-bottom: 20rem;
    background-color: black;
    grid-column: center-start / center-end;
    display: grid;
    grid-auto-rows: min-content;
    grid-row-gap: 30px; }
  
  .myDivFrasenTitle {
    grid-row: 1;
    font-family: 'Inter-Thin';
    font-size: 3rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  .Frasendivcont {
    grid-column: 1 / -1; }
  
  .myDivFrasen {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: min-content;
    justify-content: center; }
  
  .myDivDrehenTitle {
    grid-column: 1 / -1;
    padding:3rem;
    justify-self: start;
    font-family: 'Inter-Thin';
    font-size: 3rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  .myDivDrehen {
    display: none;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, min-content));
    grid-column-gap: 10rem;
    grid-auto-rows: min-content;
    justify-content: start; }

  
  .myDivSchleifenTitle {
    grid-row: 1;
    font-family: 'Inter-Thin';
    font-size: 3rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  .myDivSchleifen {
    display: none;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: min-content;
    justify-items: center; }
  .myDivSchleifen{
    display: none;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(300px, min-content));
    grid-column-gap: 10rem;
    grid-auto-rows: min-content;
    justify-content: start; }
    .myDivFrasen{
      display: none;
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns:repeat(auto-fit, minmax(300px, min-content));
      grid-column-gap: 10rem;
      grid-auto-rows: min-content;
      justify-content: start; }
      
  .buttonsList {
    grid-row: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 1.25rem; }
  
  .buttonFrasen {
    grid-column: 1;
    width: 35rem;
    height: 8rem;
    background-color: #606060;
    border: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-self: start; }
  
  .buttonFrasen img {
    grid-column: 2;
    width: 8rem;
    height: 8rem; }
  
  .buttonFrasen p {
    grid-column: 3;
    color: white;
    text-align: center;
    align-self: center; }
  
  .buttonDrehen {
    grid-column: 2;
    width: 35rem;
    height: 8rem;
    background-color: #606060;
    border: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-self: center; }
  
  .buttonDrehen img {
    grid-column: 2;
    width: 8rem;
    height: 8rem; }
  
  .buttonDrehen p {
    grid-column: 3;
    color: white;
    text-align: center;
    align-self: center; }
  
  .buttonSchleifen {
    grid-column: 3;
    width: 35rem;
    height: 8rem;
    background-color: #606060;
    border: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-self: end; }
  
  .buttonSchleifen img {
    grid-column: 2;
    width: 8rem;
    height: 8rem; }
  
  .buttonSchleifen p {
    grid-column: 3;
    color: white;
    text-align: center;
    align-self: center; }
  
  .FräsenIcon2 {
    grid-row: 2;
    grid-column: 2;
    justify-self: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(4, 1fr); }
  
  .FräsenIcon1 {
    grid-row: 2;
    grid-column: 1;
    justify-items: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(4, 1fr); }
  
  .FräsenIcon1 img {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .FräsenIcon1 p {
    grid-row: 2;
    grid-column: 2 / -1;
    justify-self: start; }

  
  
  .FräsenIcon1 ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .FräsenIcon2 img {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .FräsenIcon2 p {
    grid-row: 2;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .FräsenIcon2 ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .DrehenIcon2 {
    grid-row: 2;
    grid-column: 2;
    justify-self: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(3, 1fr); }
  
  .MaschineIcon {
    padding:3rem;
    justify-items: center;
    display: grid;
    grid-template-rows: 1fr min-content min-content;
    grid-auto-columns: repeat(auto-fit, min-content);
    
  }
  
  .MaschineIcon figure{
    grid-row: 1;
    transition: transform .2s;
  }
  .MaschineIcon img {
    width:100%;
    
  }

  .MaschineIcon img:hover {
    transform: scale(1.1); 
  }
  .MaschineIcon p {
    grid-row: 2;
    font-size: 2rem;
    justify-self: center; }
  
  .MaschineIcon ul {
    padding-left: 1rem;
    grid-row: 3;
    justify-self: center; }
  
  .DrehenIcon2 img {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .DrehenIcon2 p {
    grid-row: 2;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .DrehenIcon2 ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .SchleifenIcon2 {
    grid-row: 2;
    grid-column: 2;
    justify-self: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(4, 1fr); }
  
  .SchleifenIcon1 {
    grid-row: 2;
    grid-column: 1;
    justify-items: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(4, 1fr); }
  
  .SchleifenIcon1 img {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .SchleifenIcon1 p {
    grid-row: 2;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .SchleifenIcon1 ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .SchleifenIcon2 img {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .SchleifenIcon2 p {
    grid-row: 2;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .SchleifenIcon2 ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .kontaktList {
    animation: pop 5s;
    position:sticky;
    padding-bottom: 10rem;
    background-color: black;
    grid-column: col-start 5 / col-end 6;
    display: grid;
    grid-auto-rows: repeat(3, min-content);
    grid-row-gap: 0.5rem; }
  
  .button1 {
    border: 1px solid black;
    width: 100%;
    grid-row: 1;
    padding: 1rem;
    background: #9F0000;
    color: white;
    border: none; }
  
  .button2 {
    width: 100%;
    grid-row: 2;
    padding: 1rem;
    background-color: #9F0000;
    color: white;
    border: none; }
  
  .button3 {
    width: 100%;
    grid-row: 3;
    padding: 1rem;
    background-color: #9F0000;
    color: white;
    border: none; }
  
  .referenzen {
    grid-column: center-start / center-end;
    overflow: hidden;
    padding-top: 10rem;
    background-color: black;
    grid-row: 8;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, min-content);
    grid-row-gap: 10rem; }
  
  .referenzenTitle {
    grid-column: 1 / -1;
    grid-row: 1;
    color: #FFF;
    font-family: 'Inter-Thin';
    font-size: 3.5rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  .referenzenList {
    padding-top: 5rem;
    grid-column: 1 / -1;
    background-color: black;
    grid-row: 2;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-column-gap: 22rem; }
  
  @keyframes infiniteScroll {
    0% { background-position: 0 0; }
  50% { background-position: 0 -500px; }
  100% { background-position: 0 -900px; } }
  
  .horizontal-scrolling-items {
    display: flex;
    justify-content: space-evenly;
    grid-column-gap: 20rem;
    width: 100%;
    font-size: 4rem;
    animation-name: infiniteScroll;
    animation-duration: 40s;
    animation-iteration-count: infinite;
    animation-timing-function: linear; }
  
  .horizontal-scrolling-items__item {
    white-space: nowrap; }
  
  .horizontal-scrolling-items__item p {
    color: #606060;
    font-family: 'Inter-Thin';
    font-size: 3.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal; }
  
  .videoDesc {
    background-color: transparent;
    grid-row: 2;
    grid-column: col-start 1 / col-start 2;
    align-self: center;
    margin-top: 15rem;
    display: grid;
    grid-template-rows: repeat(6, min-content);
    z-index: 4;
    transition: transform .2s;
  }
  .videoDesc img:hover{
    transform: scale(1.1);
      }
    @media only screen and (max-width: 68.75em) {
      .videoDesc {
        grid-column: center-start / center-end;
        /* grid-row: min-content; */
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        justify-items: center;
        margin-top: 10rem;
      } }
  
  @media only screen and (max-width: 68.75em) {
    .videofrasenimg {
      grid-row: 1; } }
  
  @media only screen and (max-width: 68.75em) {
    .videofrasenpar {
      grid-row: 2; } }
  
  @media only screen and (max-width: 68.75em) {
    .videodrehenimg {
      grid-row: 1; } }
  
  @media only screen and (max-width: 68.75em) {
    .videodrehenpar {
      grid-row: 2; } }
  
  @media only screen and (max-width: 68.75em) {
    .videoschleifenimg {
      grid-row: 1; } }
  
  @media only screen and (max-width: 68.75em) {
    .videoschleifenpar {
      grid-row: 2; } }
  
  .videoDesc p {
    text-align: center;
    font-size: 2rem; }
  
  .videoDesc img {
    justify-self: center; }
  
  .videoDesc img {
    justify-self: center; }
    @media only screen and (min-width: 68.75em) {
      .videoDesc img {
        width: 13rem;
        height: auto; } }
    @media only screen and (max-width: 68.75em) {
      .videoDesc img {
        width: 15rem;
        height: auto; } }
    @media only screen and (max-width: 50.5em) {
      .videoDesc img {
        width: 10rem;
        height: auto; } }
  
  .video-box-overview {
    background-color: black;
    grid-column: col-start 2 / full-end;
    
    grid-row: 2;
    width: 100%;
    height: 100%;
    justify-content: end;
    padding-bottom: 2%;
    position: relative; }
  
  #video-box-overview:before {
    min-height: 100%;
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    background: linear-gradient(to right, #000000, transparent, transparent, transparent, transparent), linear-gradient(to top, #000000, #1d1d1d, transparent, transparent, transparent); }
  /* black gradient 1 */

  .videoOv {
    width: 100%;
    height: auto; }

  .videoImg {
    background-color: black;
    padding-top: 10em;
    display: grid;
    align-items: center; }
  
  .videoImg figure img {
    width: 25vw;
    height: auto;
    z-index: 15; }

    @media only screen and (max-width: 50.5em) {
      .videoImg {
        grid-column: col-start 1 / col-start 2;
        grid-row: 1 / 2;
        display: grid;
        justify-items: left;
      }
    }
  
  .maschineSpecsImg {
    background-color: black;
    grid-column: col-start 1 / col-end 9;
    position: relative;
    padding-bottom: 10rem; }
  
  #maschineSpecsImg:before {
    min-height: 100%;
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    background: linear-gradient(to right, #000000, transparent, transparent, transparent, transparent), linear-gradient(to top, #000000, #1d1d1d, transparent, transparent, transparent); }
  
  .maschineSpecsImg img {
    width: 100%;
    height: auto; }
  
  .maschineInfos {
    background-color: black;
    grid-row: 5;
    grid-column: center-start / center-end;
    display: grid;
    justify-items: center; }
  
  .maschineInfos th {
    text-align: start; }
  /* 
  table {
    border-collapse: separate;
    border-spacing: 3.125rem 0; }
  
  table tr td {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem; } */
  
  .wp-block-table 
  {
    border-collapse: separate;
    border-spacing: 3.125rem 0; }
  
    .wp-block-table tr td {
      
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    
  }
  
  .wp-block-table table tbody tr th{
    border:none;
  }
  
    .wp-block-table th {
    padding: 0.625rem 0;
    color: #FFF;
    font-family: 'Inter-Thin' ;
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal; }
  
   
    .wp-block-table td {
    color: #FFF;
    border: none;
    font-family: 'Inter-Thin' ;
    font-size: 2rem;
    font-style: normal;
    font-weight: 300;
    line-height: normal; }
  
  .imageSeqOverviewMaschine {
    background-color: black;
    grid-column: full-start / full-end;
    display: grid;
    grid-template-columns: [full-start] minmax(3rem, 1fr) repeat(3, [col-start] minmax(min-content, 1fr) [col-end]) minmax(3rem, 1fr) [full-end];
    grid-auto-rows: minmax(auto, min-content);
    align-items: center;
    justify-items: stretch;
    padding-bottom: 6.875rem;
    padding-top: 3.125rem; }
    .imageSeqOverviewMaschine__rectangle {
      width: minmax(100%,(5vw + 100%));
      height: calc(1vh + 60%);
      background-color: #7A0000;
      grid-column: full-start / full-end;
      grid-row: 1; }
    .imageSeqOverviewMaschine__im1 {
      grid-column: 2 / 5;
      grid-row: 1; }
    .imageSeqOverviewMaschine__im1 figure {
      width: 100%;
      height: auto; }
      .imageSeqOverviewMaschine__im1 iframe {
        width: 100%;
        height: auto; }

  /* VIDEOS */

  .imageSeqOverviewMaschineVideoMed {
    display: grid;
    grid-gap: calc(var(--gutter) / 2);
    grid-template-columns: 10px;
    grid-template-rows: minmax(150px, 1fr);
    grid-auto-flow: column;
    grid-auto-columns: calc(25% - var(--gutter) * 2);

    overflow-x: scroll;
    scroll-snap-type: x proximity;
    padding-bottom: calc(.75 * var(--gutter));
    margin-bottom: calc(-.25 * var(--gutter));}
    
    .imageSeqOverviewMaschineVideoMed:before,
    .imageSeqOverviewMaschineVideoMed:after {
      content: '';
      width: 10px;
    }

    .imageSeqOverviewMaschineVideoMed > div,
    .imageSeqOverviewMaschineVideo__im1Med {
      scroll-snap-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border-radius: 8px;
    }

    .imageSeqOverviewMaschineVideoMed > * {
      /* grid-column: 2 / -2; */
    }

    .imageSeqOverviewMaschineVideo__im1Med iframe {
        aspect-ratio: 16 / 9;
        width: 100% !important;
    }

    .imageSeqOverviewMaschineVideo__im1Med{
      
      
    }

    .imageSeqOverviewMaschineVideo {
      background-color: black;
      grid-column: full-start / full-end;
      display: grid;
      grid-template-columns: [full-start] minmax(3rem, 1fr) repeat(3, [col-start] minmax(min-content, 1fr) [col-end]) minmax(3rem, 1fr) [full-end];
      grid-auto-rows: minmax(auto, min-content);
      align-items: center;
      justify-items: stretch;
      padding-bottom: 6.875rem;
      padding-top: 3.125rem; }
      .imageSeqOverviewMaschineVideo__rectangle {
        width: minmax(100%,(5vw + 100%));
        height: calc(1vh + 60%);
        background-color: #7A0000;
        grid-column: full-start / full-end;
        grid-row: 1; }
      .imageSeqOverviewMaschineVideo__im1 {
        grid-column: 2 / 5;
        grid-row: 1; }
        .imageSeqOverviewMaschineVideo__im1 iframe {
            aspect-ratio: 16 / 9;
            width: 100% !important;
        }
  
  
  
  .m600Img {
    background-color: black;
    grid-column: col-start 1 / col-end 9;
    position: relative;
    padding-bottom: 10rem; }
  
  #m600Img:before {
    min-height: 100%;
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    background: linear-gradient(to right, #000000, transparent, transparent, transparent, transparent), linear-gradient(to top, #000000, #1d1d1d, transparent, transparent, transparent); }
  
  .m600Img img {
    width: 100%;
    height: auto; }
  
  .historyMaschine {
    background-color: black;
    grid-column: 3 / 11;
    padding-top: 5rem;
    display: grid;
    grid-template-rows: min-content 3, minmax(163.5px, 1fr);
    grid-row-gap: 2.5rem;
    justify-items: center; }
    @media only screen and (max-width: 50.5em) {
      .historyMaschine {
        grid-template-rows: 1fr;
        grid-row-gap: 2.5rem;
        justify-self: center;
        padding-bottom: 8rem; } }
    @media only screen and (max-width: 50.5em) {
      .historyMaschine {
        grid-row-gap: rem; } }
  
  .historyTitle {
    grid-row: 1;
    font-family: 'Inter-Thin' ;
    text-align: center;
    font-size: 3rem;
    font-style: normal;
    font-weight: 300;
    line-height: 1.5rem;
    /* 80% */
    padding-bottom: 2rem; }

    .historyTitle p{
      color: white;
    }
  
  .historyCard {
    background: #2a2a2a;
    display: grid; }
    @media only screen and (max-width: 50.5em) {
      .historyCard {
        grid-template-areas: "imgcard" "textcard";
        grid-template-rows: min-content min-content;
        max-width: 400px; } }
    @media only screen and (max-width: 30em) {
      .historyCard {
        max-width: 300px; } }
    @media only screen and (min-width: 50.5em) {
      .historyCard {
        grid-template-columns: 1fr 2fr;
        grid-template-areas: "imgcard textcard"; } }
  
  @media only screen and (min-width: 50.5em) {
    #myBtn {
      display: none; }
    #myBtn2 {
      display: none; }
    #myBtn3 {
      display: none; }
    #dots {
      display: none; }
    #more {
      display: block; } }
  
  @media only screen and (max-width: 50.5em) {
    #more2 {
      display: none; }
    #more3 {
      display: none; }
    #more {
      display: none; } }
  
  .imgCard {
    grid-area: imgcard; }
  
  .historyCard img {
    width: 100%;
    height: 100%;
    flex-shrink: 0; }
    
  .historyCardImg {
    width: 100%;
    height: 100%;
    flex-shrink: 0; }
  
  .textCard {
    width: 100%;
    height: 100%;
    grid-area: textcard;
    color: white;
    padding: 3.125rem;
    align-content: center;
    justify-self: center;
    display: grid;
    grid-template-rows: repeat(2, min-content);
    grid-template-areas: "title" "par"; }
    @media only screen and (max-width: 50.5em) {
      .textCard {
        background-color: #454545;
        padding: 2rem; } }
    @media only screen and (max-width: 30em) {
      .textCard {
        height: 100%; } }
    .textCard__title {
      grid-area: title;
      align-self: center;
      font-family: 'Inter-Thin' ;
      font-size: 2.0rem;
      font-style: normal;
      font-weight: 200;
      line-height: 1.5rem;
      /* 68.571% */ }
    .textCard__par {
      grid-area: par;
      align-self: center;
      font-size: 1.8rem;
      font-family: 'Inter-Thin' ;
      font-style: normal;
      font-weight: 400;
      line-height: normal; }
      
  
  .barsMaschine {
    background-color: black;
    grid-column: center-start / center-end;
    margin: 100px auto;
    width: 500px;
    text-align: center; }
  
  .title {
    justify-self: start;
    align-self: center;
    grid-row: 1;
    padding-right: 10px; }
  
  .advancement {
    padding: 1rem;
    grid-row: 1; }
  
  .progress {
    padding: 6px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  
  .progress-bar {
    text-align: end;
    align-content: center;
    height: 2.5rem;
    background-color: #3A3A3A;
    border-radius: 4px;
    transition: 0.4s linear;
    transition-property: width, background-color;
    display: grid;
    grid-template-rows: 1fr 1fr; }
  
  .progress-striped .progress-bar {
    background-color: #3A3A3A;
    width: 100%;
    background-image: linear-gradient(45deg, #3A3A3A 25%, transparent 25%, transparent 50%, #3A3A3A 50%, #3A3A3A 75%, transparent 75%, transparent);
    animation: progressAnimationStrike 6s; }
  
  @keyframes progressAnimationStrike {
    from {
      width: 0; }
    to {
      width: 100%; } }
  
  .progress2 {
    padding: 6px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  
  .progress-bar2 {
    text-align: end;
    align-content: center;
    height: 2.5rem;
    background-color: #3A3A3A;
    border-radius: 4px;
    transition: 0.4s linear;
    transition-property: width, background-color;
    display: grid;
    grid-template-rows: 1fr 1fr; }
  
  .progress-striped2 .progress-bar2 {
    background-color: #3A3A3A;
    width: 100%;
    background-image: linear-gradient(45deg, #3A3A3A 25%, transparent 25%, transparent 50%, #3A3A3A 50%, #3A3A3A 75%, transparent 75%, transparent);
    animation: progressAnimationStrike2 6s; }
  
  @keyframes progressAnimationStrike2 {
    from {
      width: 0; }
    to {
      width: 100%; } }
  
  .progress3 {
    padding: 6px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  
  .progress-bar3 {
    text-align: end;
    align-content: center;
    height: 2.5rem;
    background-color: #3A3A3A;
    border-radius: 4px;
    transition: 0.4s linear;
    transition-property: width, background-color;
    display: grid;
    grid-template-rows: 1fr 1fr; }
  
  .progress-striped3 .progress-bar3 {
    background-color: #3A3A3A;
    width: 80%;
    background-image: linear-gradient(45deg, #3A3A3A 25%, transparent 25%, transparent 50%, #3A3A3A 50%, #3A3A3A 75%, transparent 75%, transparent);
    animation: progressAnimationStrike3 6s; }
  
  @keyframes progressAnimationStrike3 {
    from {
      width: 0; }
    to {
      width: 80%; } }
  
  .progress4 {
    padding: 6px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  
  .progress-bar4 {
    text-align: end;
    align-content: center;
    height: 2.5rem;
    background-color: #3A3A3A;
    border-radius: 4px;
    transition: 0.4s linear;
    transition-property: width, background-color;
    display: grid;
    grid-template-rows: 1fr 1fr; }
  
  .progress-striped4 .progress-bar4 {
    background-color: #3A3A3A;
    width: 80%;
    background-image: linear-gradient(45deg, #3A3A3A 25%, transparent 25%, transparent 50%, #3A3A3A 50%, #3A3A3A 75%, transparent 75%, transparent);
    animation: progressAnimationStrike4 6s; }
  
  @keyframes progressAnimationStrike4 {
    from {
      width: 0; }
    to {
      width: 80%; } }
  
  .progress5 {
    padding: 6px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  
  .progress-bar5 {
    text-align: end;
    align-content: center;
    height: 2.5rem;
    background-color: #3A3A3A;
    border-radius: 4px;
    transition: 0.4s linear;
    transition-property: width, background-color;
    display: grid;
    grid-template-rows: 1fr 1fr; }
  
  .progress-striped5 .progress-bar5 {
    background-color: #3A3A3A;
    width: 100%;
    background-image: linear-gradient(45deg, #3A3A3A 25%, transparent 25%, transparent 50%, #3A3A3A 50%, #3A3A3A 75%, transparent 75%, transparent);
    animation: progressAnimationStrike5 6s; }
  
  @keyframes progressAnimationStrike5 {
    from {
      width: 0; }
    to {
      width: 100%; } }
  
  .progress6 {
    padding: 6px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  
  .progress-bar6 {
    text-align: end;
    align-content: center;
    height: 2.5rem;
    background-color: #3A3A3A;
    border-radius: 4px;
    transition: 0.4s linear;
    transition-property: width, background-color;
    display: grid;
    grid-template-rows: 1fr 1fr; }
  
  .progress-striped6 .progress-bar6 {
    background-color: #3A3A3A;
    width: 100%;
    background-image: linear-gradient(45deg, #3A3A3A 25%, transparent 25%, transparent 50%, #3A3A3A 50%, #3A3A3A 75%, transparent 75%, transparent);
    animation: progressAnimationStrike6 6s; }
  
  @keyframes progressAnimationStrike6 {
    from {
      width: 0; }
    to {
      width: 100%; } }
  
  .title {
    padding: 1rem; }
  
  .referenzenMaschine {
    grid-column: center-start / center-end;
    overflow: hidden;
    padding-top: 10rem;
    background-color: black;
    display: grid;
    /* grid-template-columns: repeat(4, 1fr); */
    grid-template-rows: repeat(2, min-content);
    grid-row-gap: 10rem; }

  
  .referenzenTitle {
    grid-column: 1 / -1;
    grid-row: 1;
    color: #FFF;
    font-family: 'Inter-Thin';
    font-size: 3.5rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  .referenzenList {
    padding-top: 5rem;
    grid-column: 1 / -1;
    background-color: black;
    grid-row: 2;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-column-gap: 22rem; }

    
  
  @keyframes infiniteScroll {
    from {
      transform: translateX(0); }
    to {
      transform: translateX(-100%); } }
  
  .horizontal-scrolling-items {
    grid-row: 2;
    overflow: hidden;
    display: flex;
    justify-content: space-evenly;
    grid-column-gap: 20rem;
    width: 100%;
    font-size: 4rem;
    animation-name: infiniteScroll;
    animation-duration: 40s;
    animation-iteration-count: infinite;
    animation-timing-function: linear; }
  
  .horizontal-scrolling-items__item {
    white-space: nowrap; }
  
  .horizontal-scrolling-items__item p {
    color: #606060;
    font-family: 'Inter-Thin';
    font-size: 3.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal; }

    @media only screen and (max-width: 991.98px) {
      .referenzenMaschine {
        grid-column: center-start / center-end;
        overflow: hidden;
        padding-top: 5rem;
        background-color: black;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, min-content);
        grid-row-gap: 5rem; }

        .referenzenTitle {
          grid-column: 1 / -1;
          grid-row: 1;
          color: #FFF;
          font-family: 'Inter-Thin';
          font-size: 3rem;
          font-style: normal;
          font-weight: 200;
          line-height: normal; }

        .horizontal-scrolling-items__item p {
          color: #606060;
          font-family: 'Inter-Thin';
          font-size: 2rem;
          font-style: normal;
          font-weight: 700;
          line-height: normal; }
        
          .horizontal-scrolling-items {
            display: flex;
            justify-content: space-evenly;
            grid-column-gap: 1rem;
            margin-bottom:20px;
            width: 100%;
            font-size: 4rem;
            animation-name: infiniteScroll;
            animation-duration: 40s;
            animation-iteration-count: infinite;
            animation-timing-function: linear; }
      

    }

  
  .imageSeqOverviewMaschine2 {
    background-color: black;
    grid-column: full-start / full-end;
    display: grid;
    grid-template-columns: [full-start] minmax(3rem, 1fr) repeat(5, [col-start] minmax(min-content, 1fr) [col-end]) minmax(3rem, 1fr) [full-end];
    grid-auto-rows: minmax(auto, min-content);
    align-items: center;
    justify-content: center;
    padding-bottom: 6.875rem;
    padding-top: 3.125rem; }
    .imageSeqOverviewMaschine2__rectangle {
      width: calc(5vw + 100%);
      height: calc(1vh + 60%);
      background-color: #7A0000;
      grid-column: full-start / full-end;
      grid-row: 1; }
    .imageSeqOverviewMaschine2__im1 {
      grid-column: 3 / 6;
      grid-row: 1; }
    .imageSeqOverviewMaschine2__im1 img {
      width: 100%;
      height: auto; }
  
  .kontaktMaschine {
    background-color: black;
    margin-top: 100px;
    grid-column: full-start / full-end;
    grid-row: 13;
    padding-bottom: 5rem;
    display: grid;
    grid-auto-rows: max-content;
    grid-template-columns: 0.5fr repeat(4, minmax(min-content, 1fr)) 0.5fr;
    align-content: stretch; }
    @media only screen and (max-width: 50.5em) {
      .kontaktMaschine {
        display: grid;
        grid-template-rows: min-content min-content;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        grid-column-gap: 10rem;
        grid-row-gap: 3rem;
        padding: 0px;
        margin: 0px; } }
    @media only screen and (max-width: 30em) {
      .kontaktMaschine {
        display: grid;
        grid-template-rows: min-content min-content;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-column-gap: 2rem;
        grid-row-gap: 3rem;
        padding: 0px;
        margin: 0px; } }
  
  .contacts {
    grid-row: 1;
    grid-column: 2;
    color: white;
    font-size: 2.5rem; }
    @media only screen and (max-width: 50.5em) {
      .contacts {
        grid-row: 2;
        grid-column: 3;
        justify-self: center; } }
    @media only screen and (max-width: 30em) {
      .contacts {
        grid-row: 2;
        grid-column: 2;
        justify-self: center; } }
  
  .contacts br {
    margin: 1em;
    display: block;
    font-size: 24%; }
  
  .contacts p {
    font-family: 'Inter-Thin' ;
    font-size: 1.5rem; }
  
  .contacts b {
    font-family: 'Inter-Thin' ;
    font-size: 2rem; }
  
  .mapSite {
    align-self: center;
    font-size: 1.5rem;
    grid-row: 1;
    grid-column: 3 / 4;
    color: white;
    border-left: 2px solid white;
    padding-left: 20px;
    justify-self: center; }
    @media only screen and (max-width: 50.5em) {
      .mapSite {
        grid-row: 2;
        grid-column: 4;
        justify-self: center; } }
    @media only screen and (max-width: 30em) {
      .mapSite {
        grid-row: 2;
        grid-column: 3;
        justify-self: center; } }
  
  .mapSite > ul > li {
    font-family: 'Inter-Thin' ; }
  
  .icons {
    grid-row: 1;
    grid-column: 5 / 6;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(3, max-content);
    grid-auto-rows: max-content;
    align-self: end;
    justify-self: end; }
    @media only screen and (max-width: 50.5em) {
      .icons {
        grid-row: 1;
        grid-column: 2 / 6;
        justify-self: center; } }
    @media only screen and (max-width: 30em) {
      .icons {
        grid-row: 1;
        grid-column: 2 / 4;
        justify-self: center; } }
  
  .youtube {
    align-self: end;
    grid-row: 1;
    grid-template-columns: 1;
    align-self: end; }
  
  .instagram {
    grid-row: 1;
    grid-template-columns: 2;
    align-self: end; }
  
  .linkedin {
    grid-row: 1;
    grid-template-columns: 3;
    align-self: end; }
  
  .maschineInfos2 {
    background-color: black;
    grid-column: center-start / center-end;
    display: grid;
    justify-items: center; }
  
  
  .maschineInfos2 th {
    text-align: start; }
  
  table {
    border-collapse: separate;
    border-spacing: 3.125rem 0; }
  
  table tr td {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem; }
  
  th {
    padding: 0.625rem 0;
    
    font-family: 'Inter-Thin' ;
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal; }
  
  td {
    color: blue;
   
    font-family: 'Inter-Thin' ;
    font-size: 2rem;
    font-style: normal;
    font-weight: 300;
    line-height: normal; }

    .maschineInfos2 figure table tbody tr td {
      font-size: 1.3vw;
  
  
    }
    @media only screen and ( min-width: 992px) {
    .maschinesIcons2 {
      padding-bottom: 20rem;
      background-color: black;
      grid-column: center-start / center-end;
      display: grid;
      grid-auto-rows: min-content;
    }
    
    .buttonsList2 {
      grid-row: 1;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-column-gap: 1.25rem; }

      #buttonFrasen2 a{
        grid-column: 1;
        width: 45rem;
        height: 8rem;
        background-color: #606060;
        border: none;
        display: grid;
        grid-template-columns: 1fr repeat(2, min-content) 1fr;
        justify-self: start; 
      text-decoration: none;}
      #buttonDrehen2 a {
        grid-column: 2;
        width: 45rem;
        height: 8rem;
        background-color: #606060;
        border: none;
        display: grid;
        grid-template-columns: 1fr repeat(2, min-content) 1fr;
        justify-self: end;
        justify-self: center; 
        text-decoration: none;}
      #buttonSchleifen2 a{
        grid-column: 3;
        width: 45rem;
        height: 8rem;
        background-color: #606060;
        border: none;
        display: grid;
        grid-template-columns: 1fr repeat(2, min-content) 1fr;
        justify-self: end;
      text-decoration: none; }
    }



      @media only screen and (max-width: 991.98px) {
        .maschinesIcons2 {
          padding-bottom: 20rem;
          padding-top: 10rem;
          grid-column: center-start / center-end;
          display: grid;
          grid-template-columns: minmax(0,1fr);
          grid-auto-rows: min-content;
        }
        .buttonsList2{
          grid-row: 1;
          display: grid;
          grid-template-rows: repeat(3, 1fr); 
          justify-self: center;
          grid-row-gap: 1em;}
          #buttonFrasen2 a{
            grid-row: 1;
            width: 40rem;
            height: 8rem;
            background-color: #606060;
            border: none;
            display: grid;
            grid-template-columns: 1fr repeat(2, min-content) 1fr;
            justify-self: start;
          text-decoration: none; }
          #buttonDrehen2 a {
            grid-row: 2;
            width: 40rem;
            height: 8rem;
            background-color: #606060;
            border: none;
            display: grid;
            grid-template-columns: 1fr repeat(2, min-content) 1fr;
            justify-self: end;
            justify-self: center; 
            text-decoration: none;}
          #buttonSchleifen2 a{
            grid-row: 3;
            width: 40rem;
            height: 8rem;
            background-color: #606060;
            border: none;
            display: grid;
            grid-template-columns: 1fr repeat(2, min-content) 1fr;
            justify-self: end;
            text-decoration: none; }
       }
    
   
     
    
     
    
    #buttonFrasen2 a img {
      grid-column: 2;
      width: 8rem;
      height: 8rem; }
    
    #buttonFrasen2 a p {
      grid-column: 3;
      color: white;
      text-align: center;
      align-self: center; }
    
    
  
    
    #buttonDrehen2 img {
      grid-column: 2;
      width: 8rem;
      height: 8rem; }
    
    #buttonDrehen2 p {
      grid-column: 3;
      color: white;
      text-align: center;
      align-self: center; }
    
    
    
    #buttonSchleifen2 img {
      grid-column: 2;
      width: 8rem;
      height: 8rem; }
    
    #buttonSchleifen2 p {
      grid-column: 3;
      color: white;
      text-align: center;
      align-self: center; }
    

      /* @media only screen and (max-width: 50.5em) {
        
        #buttonFrasen2 {
          grid-row: 1;
          grid-column: 2;
          width: 100%;
          height: 8rem;
          background-color: #606060; 
          border: none;
          display: grid;
          grid-template-columns: 1fr repeat(2, min-content) 1fr;
          justify-self: start; }

          .buttonDrehen2 {
            grid-row: 2;
            grid-column: 2;
            width: 45rem;
            height: 8rem;
            background-color: #606060;
            border: none;
            display: grid;
            grid-template-columns: 1fr repeat(2, min-content) 1fr;
            justify-self: end;
            justify-self: center; }

            .buttonSchleifen2 {
              grid-row: 3;
              grid-column: 2;
              width: 45rem;
              height: 8rem;
              background-color: #606060;
              border: none;
              display: grid;
              grid-template-columns: 1fr repeat(2, min-content) 1fr;
              justify-self: end; }
            
      } */
  
  
    
  
  .myDivFrasenTitle2 {
    grid-row: 1;
    font-family: 'Inter-Thin';
    font-size: 3rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  .Frasendivcont2 {
    display:none;
    grid-column: 1 / -1; }
    .Schleifendivcont2 {
      display:none;
      grid-column: 1 / -1; }
  
    .Drehendivcont2 {
      display:none;
      grid-column: 1 / -1; }

    .myDivFrasen2 {
      display: grid;
      grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
      justify-content: start;
}
    
    
    .FräsenIcon {
      display: grid;
      grid-template-rows: repeat(auto-fit, min-content);
      grid-auto-columns: min-content;
    }
 
      
    .FräsenIcon figure {
      grid-row: 1;
      grid-column: 1 / -1; }

    .FräsenIcon figure img{
      /* FPA3_transparent_wo CONTUR 1 */
      width: 209px;
      height: 206px;
      filter: drop-shadow(0px 4px 23px rgba(255, 255, 255, 0.6));

    }
    hr{
      border:0 solid transparent;
    }
    
    .FräsenIcon p {
      justify-self: center; }

  .FräsenIcon p:first-of-type { 
    font-weight: bold; }
    
    .FräsenIcon ul {
      padding-left: 1rem;
      grid-row: 3;
      justify-self: center; }

      @media only screen and (max-width: 50.5em) {
        .FräsenIcon {
          justify-self: center;
          display: grid;
          grid-template-rows: repeat(3, min-content);
          grid-template-columns: min-content;
          justify-content: center;
        }
      }
    
  .myDivSchleifen2 {
    display: grid;
      grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
      justify-content: start;}
      
  .myDivSchleifenTitle2 {
    grid-row: 1;
    font-family: 'Inter-Thin';
    font-size: 3rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  
  
  
   .myDivDrehenTitle2 {
      grid-row: 1;
      font-family: 'Inter-Thin';
      font-size: 3rem;
      font-style: normal;
      font-weight: 200;
      line-height: normal; }
    
    .myDivDrehen2 {
      display: grid;
      grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
      grid-auto-rows: min-content;
      justify-content: start;}

    .DrehenIcon {
      justify-self: center;
        display: grid;
        grid-template-rows: repeat(3, min-content);
        grid-template-columns: repeat(4, 1fr);}
      
  .MaschineIcon2 {
    grid-row: 2;
    grid-column: 1;
    justify-items: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(4, 1fr); }
  
  .DrehenIcon figure {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .DrehenIcon p {
    grid-row: 2;
      grid-column: 2 / -1;
      justify-self: start; }
  
  .DrehenIcon ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  
  
  .SchleifenIcon {
    justify-self: center;
    display: grid;
    grid-template-rows: repeat(3, min-content);
    grid-template-columns: repeat(4, 1fr);}
  
  .SchleifenIcon12 figure {
    grid-row: 1;
    grid-column: 1 / -1; }
  
  .SchleifenIcon p {
    grid-row: 2;
    grid-column: 2 / -1;
    justify-self: start; }
  
  .SchleifenIcon ul {
    padding-left: 1rem;
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: start; }
  
  
  #menu-item-86 a{
    color: red;
  }
  .mapSite a{
    color: white;
    text-decoration: none;
  }
  .html5-video-container video{
      width: 100%;
      height: 400px;
      left: 0px;
      top: 0px;
  }
  .wp-image-303{
    width: 100%;
    height: auto;

  }
  #player{
    width: 100%;
    height: auto;
  }

  .wp-image-302{
    width: 100%;
    height: auto;
  }

  .form_edit{
    grid-column: 1 / -1;
    background-color: black;
    border: 1px solid gray;
    border-radius: 25px;
    margin-top: 5rem;
    padding: 2rem;
    width: 30%;
    height: auto;
    text-align: center;
    justify-self: center;
  }
  .form_edit_Newsletter{
    grid-column: 1 / -1;
    background-color: black;
    border: 1px solid gray;
    border-radius: 25px;
    margin-top: 5rem;
    padding: 2rem;
    width: 30%;
    height: auto;
    justify-self: center;
  }
  .form_edit_Newsletter p{
    font-family: 'Inter-Light';
    color: #919191;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    padding:1rem;

  }
  /* Vector */



  #wsf-1-field-20, #wsf-1-field-21, #wsf-1-field-22, #wsf-1-field-23, #wsf-1-field-24{
  background-color: #646464;
  border: 1px solid transparent;
  }

  #wsf-1-field-7{
    background-color: #646464;
    font-family: 'Inter-Light';
  }
  .wsf-label{
    color: white;
  }

  .form_edit img{
    width: 50%;
    
  }
  .center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding:1rem;
    width: 60%;
  }
  .form_edit p{
    font-family: 'Inter-Light';
    color: #919191;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    padding:1rem;

  }
  #wsf-1-help-26{
    color: white;
  }
  #wsf-1-label-27, #wsf-1-label-28{
    padding:0px;
    color:#959595;
  }
  #wsf-1-field-wrapper-27{
    
    margin:0px;
  }
  #wsf-1-field-27-row-1{
    background-color: transparent;
  }

  .MaschineDes{
    grid-row: 2;
    align-self: end;
    display: grid;
    grid-template-columns: 1fr min-content;
    align-items: center;
    grid-column-gap: 0.5rem;
    margin-top: 15rem;
  }
  .MaschineDes p{
    color: white;
    font-weight: bold;
    font-family: 'Inter-Light';
    font-size: 4rem;
    white-space:nowrap;
  }
  @media only screen and (max-width: 991.98px) {
    .MaschineDes p{
      color: white;
      font-weight: bold;
      font-family: 'Inter-Light';
      font-size: 2.5rem;
      white-space:nowrap;
    }
  }

  .MaschineDes img{
    width: 5rem;
    height: auto;
  }

  .captionHeaderMasDetail{
    display:grid;
    align-items: center;
    grid-template-rows: repeat(5,min-content);

  }

  .titleHeaderMasDetail{
    display:grid;
    grid-template-columns: repeat(2,min-content);
    font-weight: bold;
  }
  .captionHeaderMasDetail p{
    font-family: 'Inter-Thin';
    font-size: 0.9vw;
    text-align:justify;  
    text-justify:inter-character;
    padding-bottom: 2rem;

    
  }
  .captionHeaderMasDetail h4{
    font-family: 'Inter-Thin';
    font-size: 1.2vw;
    text-align:justify;  
    text-justify:inter-character;
    padding-bottom: 2rem;

    
  }
  .captionHeaderMasDetail ul li{
    font-family: 'Inter-Thin';
    font-size: 1.2vw;
    text-align:justify;  
    text-justify:inter-character;
  

    
  }
  
  .titleHeaderMasDetail p{
    align-self: center;
    font-family: 'Inter-Light';
    font-size: 2.3vw;
    white-space: nowrap;
    text-align:justify;  
    text-justify:inter-word;
  }

.titleHeaderMasDetail img{
  width: 9rem;
  height: auto;
}
.headerContainer{
  grid-row: 2;
  grid-column: center-start / center-end;
  z-index: 10;
  grid-template-rows: min-content min-content;
}
.videoImg{
  grid-column: 1;
  background-color: transparent;

}




/* MODAL CSS */

/* Modal container */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 1000;
}

.modal.show {
  opacity: 1;
  pointer-events: auto;
}

.modalBtn{
  background-color: transparent;
  border: 0px transparent;

}
/* Modal content */
.modal-content {
  background-color: black;
  padding: 20px;
  border-radius: 6px;
  max-width: 400px;
  width: 100%;
  transform: scale(0.9);
  opacity: 0;
  transition: all 0.3s ease;
}
.modal-content p{
  margin: 1em auto;
}
.modal.show .modal-content {
  transform: scale(1);
  opacity: 1;
}

/* Close button */
.close {
  float: right;
  font-size: 24px;
  font-weight: bold;
  color: #888;
  cursor: pointer;
}

.close:hover {
  color: #000;
}


/* essential code */
/* 
.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, .5);
  transition: all ease 1s;
}

.closeoverlay {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  display: block;
  z-index: 2;
  position: fixed;
  cursor: pointer;
}

.closebutton {
  color: red;
  text-decoration: none;
  font-size: 30px;
  margin: 0 auto;
  display: table;
}

.modal:target {
  opacity: 1;
  pointer-events: auto;
  
}

.modal:target>.closeoverlay {
  display: block;
}

.modal>div {
  width: 300px;
  height: 500px;
  max-width: 75vw;
  max-height: 75vh;
  text-align: center;
  position: relative;
  background: #131418;
  z-index: 3
}

.wrap,
.modal {
  display: flex;
  align-items: center;
  justify-content: center
}

.modal-content {
 overflow-y:auto
}


/*demo fluff */

.modal p {
  color: white;
  font-size: 20px;
  display: block;
}

.feature {
  margin: 2em 0 0 0;
  cursor: pointer;
}
.wrap a{
  text-decoration: none;
}
.closebutton:hover {
  color: white;
  cursor: pointer;
}

.clutter {
  margin: 2em auto;
  padding: 40px;
  max-width: 100%;
  text-align: justify;
}


.clutter {width: 400px;
display: none;} */


/* second form BEGIN */


#wsf-2-field-29, #wsf-2-field-32, #wsf-2-field-33, #wsf-2-field-36, #wsf-2-field-31{
  background-color: #646464;
  border: 1px solid transparent;
  }

  .wsf-label{
    color: white;
  }

/* temp begin */
.modalDialog {
  position: fixed;
  font-family: Arial, Helvetica ;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 99999;
  transition: opacity 400ms ease-in;
  
  opacity:0;  
  animation: show_modal 400ms forwards;
  animation-delay: 4000s;
  display: flex;
    justify-content: center;
    align-items: center;

}

#popupcont{
  left:25%;
  width: 40%;
}
.modalDialog.show {
  opacity: 1;
  animation: none;
}

@keyframes show_modal {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* temp */

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}


/* SERVICE PAGE */

.ServiceParagraph{
  grid-column: col-start 2 / col-end 8;
  justify-self: center;
  display: grid;
  text-align: center;
  margin:50px;

}
.ServiceParagraph p{
  font-family: 'Inter-Light';
  font-size: 22px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: center;

}

.ServiceParagraph h2{
  font-family: 'Inter-Light';
  font-size: 35px;
  font-weight: 300;
  text-align: center;

}

.ServiceImgPar{
  grid-column: center-start / center-end;
  margin:100px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 5rem;
  font-family:  'Inter-Light'; ;
}
.ServiceImgPar img{
  width: 425px;
  height: auto;  
  gap: 0px;
  opacity: 0px;

}



.ServiceTextList{
  display: grid;
  grid-template-rows: min-content min-content;
  grid-row-gap: 3rem;
}

.ServiceTextList h2{
  font-family: 'Inter-Light';
  font-size: 35px;
  font-weight: 300;
  text-align: left;

}

.ServiceTextList ul{
  font-family: 'Inter-Light';
  font-size: 22px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .ServiceImgPar{
    grid-column: col-start 2 / col-end 9;
    margin:40px;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-auto-columns: 1fr;
    
  
  }
  .ServiceImgPar figure{
    grid-column: 1 / -1;
    display: grid;
    justify-content: center;
  }
  .ServiceImgPar img{

    
    width: 100%;
    height: auto;  
    gap: 0px;
    opacity: 0px;
    justify-self: center;
    
  
  }
  
  .ServiceTextList{
    grid-row: 2;
    grid-column: 1 /-1;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-row-gap: 3rem;
  }
  .ServiceTextList h2{
    font-family: 'Inter-Light';
    font-size: 18px;
    font-weight: 100;
    text-align: left;
  
  }
  .ServiceTextList p{
    font-family: 'Inter-Light';
    font-size: 15px;
    font-weight: 100;
    line-height: 15px;
    text-align: left;
  
  }
  .ServiceTextList ul{
    font-family: 'Inter-Light';
    font-size: 15px;
    font-weight: 100;
    line-height: 15px;
    text-align: left;
  
  }
  .contacts{
    margin:5px;
  }
  .ServiceParagraph{
    grid-column: col-start 2 / col-end 8;
    justify-self: center;
    display: grid;
    text-align: center;
    margin:50px;
  
  }
  .ServiceParagraph p{
    font-family: 'Inter-Light';
    font-size: 18px;
    font-weight: 300;
    line-height: 34.15px;
    text-align: center;
  
  }
  
  .ServiceParagraph h2{
    font-family: 'Inter-Light';
    font-size: 25px;
    font-weight: 300;
    text-align: center;
    margin-bottom: 10px;
  
  }
  
 }
@media only screen and (max-width: 767px) {
  .ServiceImgPar{
    grid-column: center-start / center-end;
    margin:40px;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-auto-columns: 1fr;
    
  
  }
  .ServiceImgPar figure{
    grid-column: 1 / -1;
    
  }
  .ServiceImgPar img{

    
    width: 60%;
    height: auto;  
    gap: 0px;
    opacity: 0px;
    justify-self: center;
    
  
  }
  .ServiceImgPar figure{

    justify-self: center;
    
  
  }
  
  .ServiceTextList{
    grid-row: 2;
    grid-column: 1 /-1;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-row-gap: 3rem;
  }
  .ServiceTextList h2{
    font-family: 'Inter-Light';
    font-size: 15px;
    font-weight: 100;
    text-align: left;
  
  }
  .ServiceTextList p{
    font-family: 'Inter-Light';
    font-size: 12px;
    font-weight: 100;
    line-height: 15px;
    text-align: left;
  
  }
  .ServiceTextList ul{
    font-family: 'Inter-Light';
    font-size: 12px;
    font-weight: 100;
    line-height: 15px;
    text-align: left;
  
  }
  .ServiceParagraph{
    grid-column: center-start / center-end;
    justify-self: center;
    display: grid;
    text-align: center;
    margin:50px;
  
  }
  .ServiceParagraph p{
    font-family: 'Inter-Light';
    font-size: 14px;
    font-weight: 300;
    line-height: 25.15px;
    text-align: center;
  
  }
  
  .ServiceParagraph h2{
    font-family: 'Inter-Light';
    font-size: 22px;
    font-weight: 300;
    text-align: center;
    margin-bottom: 10px;
  
  }
  
}
/* ANWENDE STYLE */
  .anwenderTitle {
    grid-column: center-start / center-end;
    justify-self: start;
    display: grid;
    grid-template-columns: 0.5fr 1fr 0.5fr;
  
}

.anwenderTitle h2{
  font-family: 'Inter-Light';
  grid-column: 2;
  font-size: 5rem;
  font-weight: 100;
  line-height: 5rem;
  text-align: center;

}

.anwenderTextImg{
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: repeat(2,minmax(100px,1fr));
  margin-bottom: 3rem;
  grid-column-gap: 5rem;
  align-items: center;
}
.uberunsTextImg{
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  margin-bottom: 3rem;
  grid-column-gap: 5rem;
  align-items: center;
}


.uberunsTextImg img{
  width: 100%;
  height: auto;
  gap: 0px;
  opacity: 0px;

}
.uberunsTextImg p{
  font-family: 'Inter-Thin';
  font-size: 2.5rem;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}
.uberunsOnlyText{
  grid-column: center-start / center-end;
  margin-bottom: 10rem;

  
}
.uberunsOnlyText h2{
    
    font-family: 'Inter-Thin';
    font-style: normal;
    font-weight: 300;
    font-size: 30px;
    line-height: 55px;
    /* identical to box height */
    margin-bottom: 3rem;

    color: #FFFFFF;



  
}
.uberunsOnlyText p{
  font-family: 'Inter-Light';
  font-size: 22px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}
.uberunsrect{
  margin-top: 10rem;
  grid-column: full-start / full-end;
  background-color:#404040 ;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-row-gap: 2rem;
  padding: 6rem;

}
.uberunsicon{
  grid-column: 2 / 5;
  display: grid;
  grid-template-columns: min-content 1fr;
  grid-column-gap: 2rem;
  
}



.uberunsiconTxt{
  display: grid;
  grid-template-rows: repeat(2,min-content);
}
.uberunsiconTxt h2{
  /* Kundenorientiert */

  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 30px;
  line-height: 55px;
  /* identical to box height */

  color: #FFFFFF;


}
.uberunsiconTxt p{
  /* Flexible technische Anpassungen der Maschinen an die Wünsche und Anwendungen des Kunden.Schnelle und flexible Reaktion auf kurzfristige Kundenwünsche durch umfangreiche Lagerhaltung. */


  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 18px;
  line-height: 34px;

  color: #FFFFFF;


}

/* Karl Zimmermann: Produktmanagement, technische Vertriebsunterstützung Christian Seeburger: GeschäftsführerShoji Yamanaka: Vertrieb Nord-DE, ProduktmanagementDaniel Dalwigk: EinkaufMaik Seeburger: Technische LeitungVanessa Mastandrea: Vertrieb Süd-/West-DEAnna Traudt: Vertrieb Süd-/Ost-DE Bild: Geschäftsführung und Mitarbeiter von links nach rechts mit ihrem jeweiligen Zuständigkeitsbereich: */
.UberUnsText{
  display: grid;
  grid-template-rows:repeat(8,min-content);
  align-items: center;
}

.uberbottombar{
  grid-column: col-start 2 / col-end 8;
  margin-top: 10rem;
  display: grid;
  grid-template-columns: 2fr 1fr;
  justify-items: center;
  grid-column-gap: 5rem;
  margin-left: -5rem;
}
.tuv{
  display: grid;
  grid-template-columns: min-content 2fr;
  grid-column-gap: 2rem;

}




/* Die Norm DIN EN ISO 9001 ist ein international anerkannter Standard, um das Qualitätsmanagement von Unternehmen nachhaltig zu bewerten und zu optimieren, welches bei SAEILO seit 2007 erfolgreich umgesetzt wird. */
.tuvtxt p{
  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 17px;
  line-height: 27px;

  color: #FFFFFF;
}

.tuvtxt h2{

  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 22x;
  line-height: 38px;

  color: #FFFFFF;
}

.ubermanual{
  display: grid;
  grid-template-columns: min-content 1fr;
  grid-column-gap: 1rem;
}
.ubermanual p{
  
  font-family: 'Inter-Thin';
  font-style: normal;
  font-size: 20px;
  text-decoration-line: underline;

  color: #FFFFFF;


}
.ubermanual a{
  color: #FFFFFF;
}

@media only screen and (max-width: 991.98px) {
  .uberunsTextImg{
    grid-column: center-start / center-end;
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: 3rem;
    grid-column-gap: 5rem;
    align-items: center;
  }
  .anwenderTitle h2{
    font-family: 'Inter-Light';
    font-size: 2.8rem;
    font-weight: 100;
    line-height: 5rem;
    text-align: center;
  
  }
  .uberunsOnlyText{
    grid-column: 1fr;
    margin-bottom: 10rem;
  
    
  }
  .uberunsOnlyText p{
    font-family: 'Inter-Light';
    font-size: 2.3rem;
    font-weight: 300;
    line-height: 25px;
    text-align: left;
  
  }
  .uberunsTextImg p{
    font-family: 'Inter-Thin';
    font-size: 2rem;
    font-weight: 300;
    line-height: 25px;
    text-align: left;
}
.uberunsOnlyText h2{
    
  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 25px;
  line-height: 35px;
  /* identical to box height */
  margin-bottom: 3rem;

  color: #FFFFFF;




}
.uberunsiconTxt p {
  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 12px;
  line-height: 18px;
  color: #FFFFFF;
}
.uberunsiconTxt h2 {
  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 20px;
  line-height: 35px;
  color: #FFFFFF;
}
.tuvtxt h2 {
  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 22px;
  line-height: 30px;
  color: #FFFFFF;
  margin-bottom: 5px;
}
}
.praxisticker{
  grid-column: col-start 10 / center-end;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
  flex-direction: column;
  background-color: rgba(42, 42, 42, 0.566);
  text-align: center;
  position: fixed;
  left: 85%;
  top: 70%;
  margin-left: -30px; /*half the width*/
}


@media only screen and (max-width: 991.98px) {
  .uberbottombar{
    grid-column: col-start 2 / col-end 8;
    margin-top: 10rem;
    display: grid;
    /* grid-template-rows: 1fr 1fr; */
    grid-template-columns: 1fr;
    justify-items: center;
    grid-row-gap: 5rem;
    margin-left: 2rem;
  }
  .tuv{
    grid-row: 1;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-template-columns: 1fr;
    grid-row-gap: 2rem;
    justify-items: center;
  
  }
  .ubermanual{
    display: grid;
    grid-template-rows: repeat(2,min-content);
    grid-template-columns: 1fr;
    grid-row-gap: 1rem;
  }
  .uberunsrect{
    margin-top: 10rem;
    grid-column: full-start / full-end;
    background-color:#404040 ;
    display: grid;
    grid-template-columns: 1fr;
    grid-row-gap: 2rem;
    padding: 6rem;
  
  }
  .praxisticker{
    grid-column: col-start 10 / center-end;
    padding-top: 1rem;
    padding-bottom: 1rem;
    display: flex;
    flex-direction: column;
    background-color: rgba(42, 42, 42, 0.566);
    text-align: center;
    position: fixed;
    left: 85%;
    top: 70%;
    margin-left: -150px; /*half the width*/
  }
}



.anwenderTextImg img{
  width: 700px;
  height: auto;
  gap: 0px;
  opacity: 0px;

}
.anwenderTextImg p{
  font-family: 'Inter-Thin';
  font-size: 22px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}

.AnwendeOnlyText{
  grid-column: center-start / center-end;
  margin-bottom: 10rem;

  
}

.AnwendeOnlyText h2{
    
    font-family: 'Inter-Thin';
    font-style: normal;
    font-weight: 300;
    font-size: 30px;
    line-height: 55px;
    /* identical to box height */
    margin-bottom: 3rem;

    color: #FFFFFF;



  
}
.AnwendeOnlyText p{
  font-family: 'Inter-Light';
  font-size: 22px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}
.SchumacherTextImg{
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-column-gap: 5rem;
  margin-bottom: 20rem;
}
.SchumacherTextImg h2{
  font-family: 'Inter-Light';
  font-size: 30px;
  font-weight: 300;
  line-height: 68.3px;
  text-align: left;

}
.SchumacherTextImg p{
  font-family: 'Inter-Light';
  font-size: 22px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}
.SchumacherTextImg img{
  width: 655px;
  height: 480px;
  gap: 0px;
  opacity: 0px;

}

/* DATENSCHUTZ */

.DatenStruct{
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: 1fr;
}
.DatenStruct p{
  font-size: 15px;
  font-family: sans-serif;
  margin-bottom: 4rem;
}

.DatenStruct ul{
  margin-left: 4rem;
  margin-bottom: 2rem;
}
.DatenStruct li{
  font-size: 15px;
  font-family: sans-serif;
}

.DatenStruct h1,h2{
  margin-top: 4rem;
  margin-bottom: 4rem;
  font-size: 36px;
}

/* KOntakt */

.KontaktTextList{
  display: grid;
  grid-template-rows: min-content min-content;
  grid-row-gap: 3rem;
}





.KontaktTextList{
  display: grid;
  grid-template-rows: min-content min-content;
  grid-row-gap: 3rem;
}

.KontaktTextListDaten{
  display: grid;
  grid-template-rows: min-content min-content;
}

.KontaktTextListDaten img{
  width: 655px;
  height: auto;
}

.KontaktTextListDaten h2{
  font-family: 'Inter-Light';
  font-size: 40px;
  font-weight: 300;
  line-height: 68.3px;
  text-align: right;
  text-justify: right;

}
.KontaktTextListDaten p{
  font-family: 'Inter-Light';
  font-size: 20px;
  font-weight: 300;
  text-align: right;
  margin: 0px;

}

.KontaktTextListDaten p:nth-of-type(3) {
  margin-bottom: 2rem;
}
.KontaktTextListDaten p:nth-of-type(6) {
  margin-top: 2rem;
}
.KontaktTextList img{
  width: 655px;
  height: auto;
}
.KontaktTextList h2{
  font-family: 'Inter-Light';
  font-size: 30px;
  font-weight: 300;
  text-align: left;

}
.KontaktTextList p{
  font-family: 'Inter-Light';
  font-size: 18px;
  font-weight: 300;
  text-align: left;

}


.DatenStruct h1, h2 {
  margin-top: 0px;
  margin-bottom: 0px;
  font-size: 30px;
  text-align: center;
}
.KontaktTextList ul{
  font-family: 'Inter-Light';
  font-size: 18px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}


.KontaktImgPar{
  grid-column: col-start 1 / col-end 10;
  margin:100px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 5rem;
  align-items: center;

}
.KontaktImgPar img{
  width: 625px;
  height: 415px;  
  gap: 0px;
  opacity: 0px;
  align-self: stretch;

}

.NewsletterButton {
  grid-column: col-start 1 / col-end 10;
  display: grid;
  grid-template-columns: 1fr;
  width: 50%;
  justify-self: center;

}

.NewsletterButton div{
  align-self: center;
}
.wp-block-buttons a{
  grid-row: 2;
  align-self: center;
  justify-self: center;
  height: 55px;
  display:block;
  text-align: center;
  font-size: 25px;
  line-height: 34px;
  font-family: 'Inter-Thin';
font-style: normal;
font-weight: 300;
margin-left: 10rem;
margin-right: 10rem;
line-height: 55px;
}

/* SAEILO eNewsletter hier abonnieren! */

.KontaktHead{
  grid-column: col-start 1 / col-end 10;
  display:grid;
  grid-row-gap:1rem;
  font-style: normal;
  font-weight: 300;
  font-size: 28px;
  line-height: 41px;
  font-family: 'Inter-Thin';
  text-align: center;
  color: #FFFFFF;
}

#kontakt-form{
  grid-row:4;
}

.KontaktImgPar2{
  grid-column: col-start 1 / col-end 10;
  margin:100px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 5rem;
  align-items: center;

}
.KontaktImgPar img2{
  width: 625px;
  height: 415px;  
  gap: 0px;
  opacity: 0px;
  align-self: stretch;

}
.KontaktHeadIconTel{
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: min-content max-content;
  grid-template-rows: repeat(auto-fit, min-content);
  justify-content: center;
}
.is-hidden{
  display: none;
}

/* praxisberichte */

.searchbar{
  grid-column: center-start / center-end;
  display: grid;
  justify-items: end;
  grid-template-columns: 1fr 1fr;
}
.searchbar input{
  width: 300px;
  height: 40px;
  color: white;
  padding-right:30px;
  background:  #2A2A2A url("http://localhost/wp-content/uploads/search-icon.png") no-repeat right;
  background-size: 20px;
  margin: 10px;
  text-align: end;

}
.txticon{
  display: grid;
  justify-items: end;
  grid-template-rows: 1fr;


  

}
.hide { display: none; };
.input{
  
}
.buttonReadMore{
  grid-column: col-start 4 / col-start 5;
  width: 23rem;
  padding:1rem;
  color: white;
  background-color: #2A2A2A;
  border: 0px solid transparent;
}



.praxisticker p{
  font-family: 'Inter-Light';
  font-size: 1.3vw;
  padding: 1rem;
}
.praxisticker .wp-block-button__link{
  background-color: #860000;
  color: white;
}

.wp-block-buttons a{
  margin-left: 3rem;
  margin-right: 3rem;
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3) 
{ 
  .praxisticker{
  grid-column: col-start 10 / center-end;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
  flex-direction: column;
  background-color: rgba(42, 42, 42, 0.566);
  text-align: center;
  position: fixed;
  left: 85%;
  top: 70%;
  margin-left: -200px; /*half the width*/
}}
/* Mediathek */

.mediaTitleImg{
  grid-column: center-start / center-end;
  text-align: center;
  display: grid;
  grid-template-rows: min-content min-content;
  grid-template-columns: 1fr;
  grid-template-areas: "tex"
  "imag";
  overflow-y: scroll;
}

.no-scrollbar {
  scrollbar-width: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.mediatxt{
  grid-area: tex;
}

.mediaTitleImg h2{
  /* SAEILO */

  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 50px;
  line-height: 68px;
  /* identical to box height */
  text-align: left;

  color: #FFFFFF;


}
.mediaTitleImg p{
  /* Erfahren Sie in diesen Videos mehr über uns. */


  
  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 25px;
  line-height: 34px;
  text-align: left;

  color: #FFFFFF;


}

.PostTitle{
  /* Lieferbare Sonderangebote */

  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 900;
  font-size: 60px;
  line-height: 82px;

  color: #FFFFFF;


}

.KarriereBottomBild{

  grid-column: center-start / center-end;
  display: grid;
  justify-items: center;

}

.KarriereParagraph{
  grid-column: col-start 3 / col-end 8;
  display: grid;
  justify-items: center;
  text-align: center;
}
.KarriereParagraph{
    /* Wenn Sie gerne in einem solchen Team arbeiten würden und diese Stelle zu Ihnen passt, bewerben Sie sich bei uns! Bewerbungen schicken Sie gerne an info@saeilo.de */



  font-family: 'Inter-Thin';
  font-style: normal;
  font-weight: 300;
  font-size: 20px;
  line-height: 34px;
  text-align: center;

  color: #FFFFFF;


}

.Karrieresticker{
  grid-column: col-start 10 / center-end;
  border-radius: 20px;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
  flex-direction: column;
  background-color: rgba(42, 42, 42, 0.566);
  text-align: center;
  position: fixed;
  left: 85%;
  top: 70%;
  margin-left: -30px; /*half the width*/
  line-height: 1;
}

.Karrieresticker p{
  font-family: 'Inter-Light';
  font-size: 1.3vw;
  padding: 1rem;
}
.Karrieresticker .wp-block-button__link{
  background-color: #7A7A7A;
  color: white;
  border-radius:30px;
}
.Karrieresticker .wp-block-buttons a{
  font-size: 20px;
}

/* youtube */

.youtube-video {

  width: 100%;
}

@media only screen and (max-width: 991.98px) {
  
  .MaschineIcon img{
    width: 70%;
    height: auto;
    align-items: center;
  }
  .MaschineIcon figure{
    text-align: center;
  }
  .myDivDrehenTitle {
    grid-column: 1 / -1;
    padding:3rem;
    justify-self: center;
    text-align: center;
    font-family: 'Inter-Thin';
    font-size: 3rem;
    font-style: normal;
    font-weight: 200;
    line-height: normal; }
  .KontaktImgPar2 {
    grid-column: col-start 1 / col-end 10;
    margin: 100px;
    display: grid;
    grid-template-areas: 
    "imag"
    "text";
    grid-template-columns: 1fr;
    grid-column-gap: 5rem;
    align-items: center;
    justify-items: center;
  }

  .KontaktTextListDaten {
    grid-area: text;
    display: grid;
    grid-template-rows: min-content min-content;
  }

  .KontaktImgPar2 figure{
    grid-area: imag;

  }
  .KontaktTextListDaten h2 {
    font-family: 'Inter-Light';
    font-size: 25px;
    font-weight: 300;
    line-height: 68.3px;
    text-align: center;
  }
  .KontaktTextListDaten p{
    text-align: center;
    font-size: 16px;
  }
  .KontaktImgPar {
    grid-column: col-start 1 / col-end 10;
    margin: 30px;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-template-columns: 1fr;
    grid-column-gap: 5rem;
    align-items: center;
  }
  .KontaktImgPar figure{
    grid-row: 1;
  }
  .KontaktImgPar img{ 
    width: 100%;
    height: auto;  
  }
  .KontaktImgPar2 img{ 
      width: 100%;
      height: auto;  }
  .KontaktTextList {
    grid-row: 2;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-row-gap: 3rem;
  }
  .KontaktTextList h2 {
    font-family: 'Inter-Light';
    font-size: 20px;
    font-weight: 300;
    line-height: 30.3px;
    text-align: center;
  }
  .KontaktTextList p {
    font-size:15px;
    font-weight: 100;
    line-height: 21.3px;
    text-align: center;
  }

  .KontaktTextList ul {
    font-size:15px;
    font-weight: 100;
    line-height: 21.3px;
    text-align: center;
    list-style-position: inside;
  }
  .KontaktTextList li {
    text-align: center;
  }
  .KontaktHead {
    margin-top: 10px;
    margin-bottom: 10px;
    grid-column: col-start 1 / col-end 10;
    font-family: 'Inter-Thin';
    font-style: normal;
    font-weight: 300;
    font-size:17px;
    line-height: 25px;
    text-align: center;
    color: #FFFFFF;
  }
  .KontaktHeadIconTel img {
    width: 3rem;
    height: auto;
  }

  .KontaktHeadIconTel figure {
    margin-right:1rem;
  }
  
  .praxisticker .wp-block-button__link{
    font-size: 15px;
  }
  
  .praxisticker{
    left:105%;
    top: 45%;
  }
  .praxisticker p {
    font-family: 'Inter-Light';
    font-size: 3vw;
    padding: 1rem;
  }
  .anwenderTextImg{
    grid-column: center-start / center-end;
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    }
    .anwenderTextImg figure{
      display: grid;
      grid-template-areas: ". imag .";
      grid-template-columns: 1fr 1fr 1fr;
      margin-bottom:10px;
    }
    .anwenderTextImg img{
      grid-area: imag;
      width: 300px;
    }
    .anwenderTextImg p {
      font-family: 'Inter-Thin';
      font-size: 16px;
      font-weight: 300;
      line-height: 20px;
      text-align: center;
    }
    .AnwendeOnlyText p {
      font-family: 'Inter-Thin';
      font-size: 16px;
      font-weight: 300;
      line-height: 20px;
      text-align: center;
    }
    .SchumacherTextImg {
      grid-column: center-start / center-end;
      display: grid;
      grid-template-rows: 1fr min-content;
      grid-template-columns: 1fr;
    }

    .SchumacherTextImg h2 {
      font-family: 'Inter-Light';
      font-size: 30px;
      font-weight: 300;
      line-height: 50.3px;
      text-align: center;
    }
    .SchumacherTextImg p {
      font-family: 'Inter-Light';
      font-size: 16px;
      font-weight: 300;
      line-height: 20px;
      text-align: center;
    }
    .SchumacherTextImg img {
      width: 350px;
      height: auto;
      gap: 0px;
      opacity: 0px;
    }
    .anwenderTitle h2 {
      font-family: 'Inter-Light';
      font-size: 2.6rem;
      font-weight: 100;
      line-height: 3rem;
      text-align: center;
    }
    table tr td {
      padding-top: 1.5rem;
      padding-bottom: 0rem;
    }
    .wp-block-table tr td {
      padding-top: 1.5rem;
      padding-bottom: 0rem;
    }
    .barsMaschine {
      background-color: black;
      grid-column: center-start / center-end;
      margin: 0;
      width: auto;
      text-align: center;
    }

    .maschineSpecsImg figure{
        display: grid;
        grid-template-areas: ". imag .";
        grid-template-columns: 1fr 1fr 1fr;
        margin-bottom:10px;
      }
      .maschineSpecsImg img{
        grid-area: imag;
        width: 300px;
      }
      .titleHeaderMasDetail img {
        width: 4rem;
        height: auto;
      }
      .buttonReadMore {
        grid-column: col-start 5 / col-start 5;
        width: 23rem;
        padding: 1rem;
        color: white;
        background-color: #2A2A2A;
        border: 0px solid transparent;
        justify-items: center;
      }
      .imageSeqOverviewMaschineVideo {
        background-color: black;
        grid-column: center-start / center-end;
        display: grid;
        /* grid-template-columns: 1fr; */
        align-items: left;
        justify-items: stretch;
        padding-bottom: 6.875rem;
        padding-top: 3.125rem; 
      }
      .KarriereBottomBild figure img{
        width: 200px;
      }
      .wp-block-buttons a {
        margin-left: 3rem;
        margin-right: 3rem;
        font-size: 15px;
      }

      .mediaTitleImg h2 {
        font-family: 'Inter-Thin';
        font-style: normal;
        font-weight: 300;
        font-size: 20px;
        line-height: 68px;
        text-align: left;
        color: #FFFFFF;
      }
      .mediaTitleImg p {
        font-family: 'Inter-Thin';
        font-style: normal;
        font-weight: 300;
        font-size: 18px;
        line-height: 24px;
        text-align: left;
        color: #FFFFFF;
      }
      .imageSeqOverviewMaschineVideoMed {
        display: grid;
        grid-gap: 0px;
        column-gap: calc(130px / 2);
        grid-template-columns: 10px;
        grid-template-rows: minmax(150px, 1fr);
        grid-auto-flow: column;
        grid-auto-columns: calc(25% - var(--gutter) * 2);
        overflow-x: scroll;
        scroll-snap-type: x proximity;
        padding-bottom: calc(.75 * var(--gutter));
        margin-bottom: calc(-.25 * var(--gutter));
        
      }
    
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

  .KontaktImgPar2 {
    grid-column: col-start 1 / col-end 10;
    margin: 100px;
    display: grid;
    grid-template-areas: 
    "imag"
    "text";
    grid-template-columns: 1fr;
    grid-column-gap: 5rem;
    align-items: center;
    justify-items: center;
  }

  .KontaktTextListDaten {
    grid-area: text;
    display: grid;
    grid-template-rows: min-content min-content;
  }

  .KontaktImgPar2 figure{
    grid-area: imag;

  }
  .KontaktTextListDaten h2 {
    font-family: 'Inter-Light';
    font-size: 25px;
    font-weight: 300;
    line-height: 68.3px;
    text-align: center;
  }
  .KontaktTextListDaten p{
    text-align: center;
    font-size: 16px;
  }
  .KontaktImgPar {
    grid-column: col-start 1 / col-end 10;
    margin: 40px;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-template-columns: 1fr;
    grid-column-gap: 5rem;
    align-items: center;
    grid-row-gap: 5rem;
  }
  .KontaktImgPar figure{
    grid-row: 1;
  }
  .KontaktImgPar img{ 
    width: 100%;
    height: auto;  
  }
  .KontaktImgPar2 img{ 
      width: 100%;
      height: auto;  }
  .KontaktTextList {
    grid-row: 2;
    display: grid;
    grid-template-rows: min-content min-content;
    grid-row-gap: 3rem;
  }
  .KontaktTextList h2 {
    font-family: 'Inter-Light';
    font-size: 20px;
    font-weight: 300;
    line-height: 30.3px;
    text-align: center;
  }
  .KontaktTextList p {
    font-size:15px;
    font-weight: 100;
    line-height: 21.3px;
    text-align: center;
  }

  .KontaktTextList ul {
    font-size:15px;
    font-weight: 100;
    line-height: 21.3px;
    text-align: center;
    list-style-position: inside;
  }
  .KontaktTextList li {
    text-align: center;
  }
  .KontaktHead {
    margin-top: 10px;
    margin-bottom: 10px;
    grid-column: col-start 1 / col-end 10;
    display:grid;
    font-family: 'Inter-Thin';
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #FFFFFF;
  }
  .praxisticker .wp-block-button__link{
    font-size: 15px;
  }
  .praxisticker {
    left: 90%;
  }
  .praxisticker p {
    font-family: 'Inter-Light';
    font-size: 2vw;
    padding: 1rem;
  }
  .anwenderTextImg{
    grid-column: center-start / center-end;
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    }
    .anwenderTextImg figure{
      display: grid;
      grid-template-areas: ". imag .";
      grid-template-columns: 1fr 1fr 1fr;
      margin-bottom:10px;
    }
    .anwenderTextImg img{
      grid-area: imag;
      width: 500px;
    }
    .anwenderTextImg p {
      font-family: 'Inter-Thin';
      font-size: 16px;
      font-weight: 300;
      line-height: 20px;
      text-align: center;
    }
    .AnwendeOnlyText p {
      font-family: 'Inter-Thin';
      font-size: 16px;
      font-weight: 300;
      line-height: 20px;
      text-align: left;
    }
    .SchumacherTextImg {
      grid-column: center-start / center-end;
      display: grid;
      grid-template-rows: 1fr min-content;
      grid-template-columns: 1fr;
    }

    .SchumacherTextImg h2 {
      font-family: 'Inter-Light';
      font-size: 30px;
      font-weight: 300;
      line-height: 50.3px;
      text-align: center;
    }
    .SchumacherTextImg p {
      font-family: 'Inter-Light';
      font-size: 16px;
      font-weight: 300;
      line-height: 20px;
      text-align: center;
    }
    .SchumacherTextImg figure{
      display: grid;
      grid-template-areas: ". imag .";
      grid-template-columns: 1fr 1fr 1fr;
      margin-bottom:10px;
    }
    .SchumacherTextImg img{
      grid-area: imag;
      width: 500px;
    }
    .maschineSpecsImg img{
      grid-area: imag;
      width: 700px;
    }
    .imageSeqOverviewMaschineVideo {
      background-color: black;
      grid-column: center-start / center-end;
      display: grid;
      /* grid-template-columns: 1fr; */
      align-items: left;
      justify-items: stretch;
      padding-bottom: 6.875rem;
      padding-top: 3.125rem; 
    }
    .Karrieresticker {
      grid-column: col-start 10 / center-end;
      padding-top: 1rem;
      padding-bottom: 1rem;
      display: flex;
      flex-direction: column;
      background-color: rgba(42, 42, 42, 0.566);
      text-align: center;
      position: fixed;
      left: 80%;
      top: 70%;
      margin-left: -30px;
    }
    .Karrieresticker .wp-block-button__link {
      background-color: #7A7A7A;
      color: white;
      font-size: 15px;
    }
    .KarriereBottomBild figure img{
      width: 400px;
    }
    .MaschineIcon img{
      width: 90%;
      height: auto;
      align-items: center;
    }
    .MaschineIcon figure{
      text-align: center;
    }
    .myDivDrehenTitle {
      grid-column: 1 / -1;
      padding:3rem;
      justify-self: center;
      text-align: center;
      font-family: 'Inter-Thin';
      font-size: 3rem;
      font-style: normal;
      font-weight: 200;
      line-height: normal; }
}

















.videos-wrapper {
  position: relative; /* Required for arrow keys to be absolutely positioned child divs inside menu-wrapper parent. */
  width: 500px;
  height: 100px;  /* Intentionally shorter than menu items, to hide horizontal scroll bar. */
  margin: 1em auto;
  border: 1px solid black;
  overflow-x: hidden;
  overflow-y: hidden;
  display: flex;
  align-items: center;
  padding: 0 20px;  /* Inner space on the left and right sides of wrapper must match flexbox gap space between menu items. */
  box-sizing: border-box;
}

/* ul {
  list-style: none; /* Hide unordered list bullet. */
} */

.videos {
  height: 120px;
  /* background: #f3f3f3; */
  box-sizing: border-box;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  position: relative; /* Required for animation. */
  display: flex;
  align-items: center;
  gap: 20px;  /* Flexbox space between menu items must match the left/right padding of menu wrapper. */
}

.videos .item {
  background: #f3f3f3;  /* Weird - Visible items inherit this from .menu but not hidden items# 6-8 when they slide in and can be seen. */
  width: 200px;
  height: 75px;
  color: black;
  outline: 1px dotted gray;
  box-sizing: border-box;
  border-radius: 5px;
  display: flex;            /* Needed to center number in middle of menu item, solution # 1 of 3. */
  align-items: center;      /* Needed to vertically center number in middle of menu item, solution # 2 of 3. */
  justify-content: center;  /* Needed to horizontally center number in middle of menu item, solution # 3 of 3. */
}

.arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  /* width: 3em; Excluding width means that arrow div will only be as wide as it needs to be to contain the < or > characters. */
}

.left-arrow {
  left: 0;
}

.right-arrow {
  right: 0;
}

.hidden {
  display: none;
}

.print {
  margin: auto;
  max-width: 500px;
}

.print span {
  display: inline-block;
  width: 100px;
}
#menu-item-2380 a{
  color: #FF0000;
}


/* FORM STYLE */

#wsf-1-field-8, #wsf-1-field-9,#wsf-1-field-10,#wsf-1-field-11, #wsf-1-field-14{
  background-color: #a8a8a8;
  color:black;
}


.KontaktHeadIconTel a[href^="tel:"] {
  color: white;
  text-decoration: none;
  align-self:center;
}

.KontaktHeadIconTel > a:nth-child(3){
  color: white;
  text-decoration: none;
  font-size: 25px;
  grid-column: 1 / -1;
  grid-row:5;
  align-self:center;
}
.KontaktHeadIconTel > a:nth-child(4){
  
  color: white;
  grid-column: 1 / -1;
  font-size: 25px;
  text-decoration: none;
  grid-row:6;
  align-self:center;
}

.MaschineDes {
  grid-row: 2;
  align-self: center;
  display: grid;
  grid-template-columns: 1fr min-content;
  align-items: end;
  grid-column-gap: 0.5rem;
  text-align: left;
  grid-column: col-start 1 / col-start 2;
  z-index: 4;
  margin-top: 40rem;
  margin-left:5rem;
}
.MaschineDes figure img {
  width: 5rem;
  height: auto;
}
.MaschineDes p {
  color: white;
  font-weight: bold;
  font-family: 'Inter-Light';
  font-size: 4rem;
  white-space: nowrap;
}

@media only screen and (max-width: 991.98px) {
  .MaschineDes {
    margin-top:20rem;
  }


}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .MaschineDes {
    margin-top:20rem;
  }
}






.nav-tabs{
  grid-column: 4 / -1;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin-bottom:100px;
  

}
.tab-content p, ul{
  font-family: 'Inter-Thin';
  font-size: 0.9vw;

}
.tab-content-m1000 p, ul{
  font-family: 'Inter-Thin';
  font-size: 0.9vw;

}
.red-tab {
  grid-column: 1 / -1;
  justify-self: stretch end;
  color:white;
  overflow: hidden;
  border-bottom: 1px solid var(--tab-gray);
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: flex-start!important;
  align-content: space-between;
  flex-direction: row;
  margin-bottom: 1px!important;
  gap: 0px!important;
  border-bottom: solid 0.02px #646464;
  margin-left:70px;
  margin-right: 70px;
}
.tab-title{
  color:white;
}
.red-tab div{
float: left;
border-bottom: 3px solid transparent;
cursor: pointer;
transition: 0.3s;
font-size: 17px;
color:white;
}
.wp-block-buttons a {
  margin-left: 3rem;
  margin-right: 3rem;
  margin-bottom: 0rem;
}
.red-tab a.wp-block-button__link {
  /* color: black!important; */
  color: white;
  background-color: transparent!important;
}
.red-tab div a {
  padding: 20px 40px!important;
}
.red-tab div:hover a, .red-tab div.active a {
  /* color: var(--tab-main)!important; */
  color:white;
}
.red-tab div.active, .red-tab div:hover {
  /* color: var(--tab-main)!important; */
  color:white;
  border-bottom: 3px solid var(--tab-main);
  z-index: 3;
}
/* .tab-content {
  justify-self:center;
  margin-left:30px;
  margin-right: 30px;
  grid-column: 1 / -1;
  display: none;
  padding: 35px 15px;
  border-top: none;
  box-shadow: 0 12px 25px -10px #00000040;
}

#tab-content-m1000 {
  justify-self:center;
  margin-left:30px;
  margin-right: 30px;
  grid-column: 1 / -1;
  display: none;
  padding: 35px 15px;
  border-top: none;
  box-shadow: 0 12px 25px -10px #00000040;
  display: grid;
  grid-template-columns: 2fr 1fr;
}
.tab-content-m1000-txt{
  grid-column: 1;
}
.tab-content-m1000-img{

  grid-column: 2;
}
..tab-content-m1000-img img{
  width: 80%;
} */
.active {
  display: block;
}
.video-box-overview-det{
    background-color: black;
    grid-column: col-start 2 / -1;
    grid-row: 2;
    width: 85%;
    height: 100%;
    justify-content: end;
    position: relative;
    justify-self: end;
}
#video-box-overview-det:before {
  min-height: 100%;
  content: '';
  position: absolute;
  height: 100%;
  width: 100%;
  background: linear-gradient(to right, #000000, transparent, transparent, transparent, transparent), linear-gradient(to top, #000000, #1d1d1d, transparent, transparent, transparent); }
/* black gradient 1 */





.kampany{
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 2fr;
}
.carousel-indicators > button{
  border-radius: 50%;
  padding:10px;
  margin: 4px 2px;
  height: 30px;
  width: 30px;
  text-align: center;
  line-height: 50%; 
  border: 1px black;
}

.carousel-indicators{
  top: 10px;
  justify-content:flex-start;
  margin:0;
  padding-left:15px;
  padding-right:15px;
}
#kampanyacontrol{
  grid-column: 1;
  grid-row:2;
}
.carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: left;
  padding-left: 0;
  margin-right: 15%;
  list-style: none;
}


/* .tabsundform{
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: 2fr 1fr;
} */



.tabs {
  grid-column: center-start / center-end;
  margin-top: 20px;
}

.tab-titles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  
}

.tab-title {
  background-color: black;
  padding: 10px 20px;
  cursor: pointer;
  margin-right: 5px;
  font-weight: bold;
  font-size: 17px;
}

.tab-title.active {
  color: #fff;
  border-bottom: 2px solid #a20000;
  font-weight: bold;
  font-size: 17px;
}

.tab-content .tab-panel {
  display: none;
  padding: 20px;
  background-color: black;
  border: 1px solid black;
}

.tab-content .tab-panel.active {
  display: block;
}
.ServiceTextList p{
  font-family: 'Inter-Light';
  font-size: 17px;
  font-weight: 300;
  line-height: 34.15px;
  text-align: left;

}
.contentimg{
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.textm1000{
  grid-column: 1;
}
.textm1000 h2{
  font-family: 'Inter-Light';
  padding-bottom: 10px;
  font-size: 20px;
}
.imgm100{
  grid-column: 2;
}
.tecdata{
  display: grid;
  grid-template-columns: 1fr 1fr;

}
.firstcolumn{
  grid-column: 1;
}
.firstcolumn .wp-block-table{
  border-bottom: 1px solid rgb(40, 40, 40);
  width: 80%;
}
.secocolumn .wp-block-table{
  border-bottom: 1px solid rgb(40, 40, 40);
  width: 80%;
}
.secocolumn{
  grid-column: 2;
}
.tecdata .wp-block-table{
  /* padding-bottom: 4rem; */
  margin-bottom: 4rem;
}
.tecdata .wp-block-table td {
  color: #FFF;
  border: none;
  font-family: 'Inter-Thin';
  font-size: 1.7rem;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}
.tecdata table tr td {
  padding-top: 0rem;
  padding-bottom: 1.8rem;
}




/* Basic styling for the tab container */
.vertical-tabs-container {
  grid-column: 1 /-1;
  display: flex;
}

/* Style for the vertical tab list */
.vertical-tabs {
  list-style-type: none;
  padding: 0;
  margin: 0;
  width: 200px;
  background-color: black;
}

.vertical-tabs li {
  padding: 10px;
  cursor: pointer;
  text-align: center;
  border-bottom: 1px solid #ddd;
}

.textm1000 ul{
  margin-left:3rem;
}
.vertical-tabs li:hover {
  background-color: #ddd;
}

/* Style for the active tab */
.vertical-tabs li.active {
  background-color: #0073aa;
  color: white;
}

/* Container for tab content */
.tabs-content1 {
  margin-left: 20px;
  padding: 20px;
  flex-grow: 1;
}

/* Style for tab content */
.tab-content1 {
  display: none;
}

 .tab-content1.active {
  display: block;
}


/* style form maschine det */
#wsf-1-section-5 > legend:nth-child(1){
  color: white;
}
#wsf-1-sections-5{
  border: 1px solid gray ;
  border-radius: 25px;
  padding: 20px;

}
#ws-form-1{
  grid-column: col-start 4 / col-end 6;
  padding: 30px;
  
}
#ws-form-1{
  padding: 30px;
  align-content: end;
  margin-left: auto;
  background-color: black;
  margin-right: 0;
}
#wsf-2-section-7 > legend:nth-child(1){
  color: white;
  font-family: 'Inter-Light';
  font-size: 20px;
}

input[type="email"].wsf-field, input[type="number"].wsf-field, input[type="tel"].wsf-field, input[type="text"].wsf-field, input[type="url"].wsf-field, select.wsf-field, textarea.wsf-field {
  background-color: gray;
  color:white;
}
.wsf-form .wsf-field-wrapper .wsf-field {
  background: gray;
  color: white;
  border: 1px solid transparent;
}
.wsf-form .wsf-field-wrapper .wsf-button {
  background: gray;
  color: #FFFFFF;
  color: white;
  padding: 0px 0px;
  font-size: 18px;
  font-family: 'Inter-Light';
  height: 4rem;
  border-radius: 8px;
  border: 1px solid transparent;
}

input[type="checkbox"]{
  background-color: blue;

}

.wsf-form .wsf-field-wrapper .wsf-inline:nth-of-type(0){
  background-color: blue;
}
.wsf-form .wsf-field-wrapper .wsf-field::placeholder {
  color:rgb(86, 86, 86);
}

/* #wsf-2-field-86 {
  background-color: #4a4a4a;
  color: white;
  padding: 0px 0px;
  font-weight: bold;
  font-size: 18px;
  font-family: 'Inter-Light';
  height: 4rem;
} */

.fieldform{
  height:30px;
}

#wsf-1-field-wrapper-41, #wsf-1-field-wrapper-58 , #wsf-1-field-wrapper-28, #wsf-1-field-wrapper-59, #wsf-1-field-wrapper-60, #wsf-1-field-wrapper-61, #wsf-1-field-wrapper-31, #wsf-1-field-wrapper-30, #wsf-1-field-wrapper-36, #wsf-1-field-wrapper-62, #wsf-1-field-wrapper-63, #wsf-1-field-wrapper-42, #wsf-1-field-wrapper-53, #wsf-1-field-wrapper-68, #wsf-1-field-wrapper-39{
  margin-bottom:15px;
  
}
#wsf-1-field-wrapper-65{
  margin-bottom:0px;
}


#wsf-1-field-41, #wsf-1-field-58 ,  #wsf-1-field-65, #wsf-1-field-28, #wsf-1-field-59, #wsf-1-field-60, #wsf-1-field-61, #wsf-1-field-31, #wsf-1-field-30, #wsf-1-field-36, #wsf-1-field-62, #wsf-1-field-63, #wsf-1-field-42, #wsf-1-field-53, #wsf-1-field-68, #wsf-1-field-39{
  background-color: rgb(240, 240, 240);

}

#wsf-1-field-28 { /* WebKit browsers */
  color:    red;
   opacity: 1 !important;
}
#wsf-1-field-39{
  background-color:  #4a4a4a;
  color: white;
  padding: 0px 0px;
  font-weight: bold;
  font-size:18px;
  font-family:'Inter-Light';
  height:4rem;
}

#wsf-1-section-5 > legend:nth-child(1){
  padding: 10px 10px;
  border-radius: 8px;
}
#wsf-1-field-wrapper-53{
  margin-bottom :10px;
  font-weight: bold;
}

.has-vivid-red-color > a:nth-child(1) > strong:nth-child(1){
  font-weight: 1000;
  color: white;
  font-family: 'Inter-Light';
}
.has-large-font-size > strong:nth-child(1) > a:nth-child(1){
  font-weight: 1000;
  font-family: 'Inter-Light';
}

.anwendeberichte_posts{
  grid-column: 3 / 11;
  list-style-type:none; 
}

.wp-block-latest-posts__post-title{
  display: none;
}

.txtForm{
  grid-column: center-start / center-end;
  display: grid;
  border: 1px solid gray;
  border-radius: 8px;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5rem;
  padding: 5rem 5rem 5rem;
  margin-bottom: 5rem;
}
.txtForm2 {
  grid-column: center-start / center-end;
  display: grid;
  /* border: 1px solid rgb(69, 69, 69); */
  border-radius: 8px;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5rem;
  padding: 5rem 5rem 5rem;
  margin-bottom: 5rem;
}
.txtForm > h2:nth-child(1){
  grid-column: 1 / -1;
  text-align: left;

}
.txtForm2 > h2:nth-child(1){
  grid-column: 1 / -1;
  text-align: left;

}
#ws-form-2{
  grid-column: 2;
}

.txtform{
  grid-column: 1;
  font-size: 18px;
}

.txtform input{
  background-color: #a8a8a8;
}

.formField{
  background-color: #a8a8a8;
}
#myBtnF{
  grid-column: col-start 10 / center-end;
  display: flex;
  flex-direction: column;
  background-color: rgba(123, 123, 123, 0.56);
  text-align: center;
  position: fixed;
  left: 100%;
  top: 70%;
  margin-left: -80px;
  border-radius: 20px;

}

#myBtnF .wp-block-button__link{
  background-color: transparent;
}

/* The Modal (background) */
.modalform {
  display: none; /* Hidden by default */
  background-color: red;
  position: fixed; /* Stay in place */
  z-index: 1000; /* Sit on top */
  right: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  -webkit-animation-name: fadeIn; /* Fade in the background */
  -webkit-animation-duration: 0.4s;
  animation-name: fadeIn;
  animation-duration: 0.4s
  
}


/* padding: 30px;
  width: 40%;
  align-content: end;
  margin-left: auto;
  margin-right: 0; */


/* Modal Content */
.modalform-content {
  padding: 20px;
  position: fixed;
  top: 0;
  width: 40%;
  overflow: auto; /* Enable scroll if needed */
  -webkit-animation-name: slideIn;
  -webkit-animation-duration: 0.4s;
  animation-name: slideIn;
  animation-duration: 0.4s;
  right: 0;
  top: 0;
    bottom:0;
    position:fixed;
    overflow-y:scroll;
    overflow-x:hidden;
}

/* Add Animation */
@-webkit-keyframes slideIn {
  from {right: -300px; opacity: 0} 
  to {right: 0; opacity: 1}
}

@keyframes slideIn {
  from {right: -300px; opacity: 0}
  to {right: 0; opacity: 1}
}

@-webkit-keyframes fadeIn {
  from {opacity: 0} 
  to {opacity: 1}
}

@keyframes fadeIn {
  from {opacity: 0} 
  to {opacity: 1}
}


/* The Close Button */
.closeModForm {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeModForm:hover,
.closeModForm:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
} 

.stickyNavMobile {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
  background-color: black;
  padding-right: 2rem;
}
.stickyTabtitles {

  width: 50%;
  position: fixed;
  top: 60px;
  right: 0;
  left: 0;
  z-index: 100030;
  background-color: black;
  padding-right: 2rem;
}

.nav-fixed {
  &--secondary {
    position: fixed;
    bottom: auto;
  }
}

.zindextabs{
  z-index:40000;
}

.Schumachercont{
  grid-column: col-start 2  / col-end 9;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr ;
  grid-template-rows: min-content min-content min-content;
  font-size: 15px;
  grid-column-gap: 50px;
  grid-row-gap: 20px;
}
.Schumachercont_img{
  grid-row: 1;
  grid-column: 2 / -1;
}
.Schumachercont_txt1{
  grid-row: 2 ;
  grid-column: 1 / -1;
  
}
.Schumachercont_txt2{
  grid-row: 3 / -1;
  grid-column: 1 / 3;
}
.Schumachercont_txt3{
  grid-row: 3;
  grid-column: 3;
}
.Ausbildungsschmiede_txt{
  grid-row: 2;
  grid-column: 1 / -1;
}
.Ausbildungsschmiede_txt ul{
  padding-left:3rem;
}

@media only screen and (max-width: 991.98px) {
  .Schumachercont{


    grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: 1fr ;
  grid-template-rows: min-content min-content min-content min-content;
  font-size: 15px;
  grid-column-gap: 50px;
  grid-row-gap: 20px;
  }
  .Schumachercont_img{
    grid-row: 2;
    grid-column: 1;
  }
  .Schumachercont_txt1{
    grid-row: 1 ;
    grid-column: 1;
    
  }
  .Schumachercont_txt2{
    grid-row: 3 ;
    grid-column: 1;
  }
  .Schumachercont_txt3{
    grid-row: 4;
    grid-column: 1;
  }



}



.zerocont{
  grid-column: col-start 2  / col-end 9;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr ;
  grid-template-rows: min-content min-content min-content;
  font-size: 15px;
  grid-column-gap: 50px;
  grid-row-gap: 20px;
}
.zero_txt1{
  grid-row: 1 ;
  grid-column: 1 / 2;
  
}
.zero_txt2{
  grid-row: 2 / -1;
  grid-column: 1 / 4;
}
.zero_txt3{
  grid-row: 2;
  grid-column: 4;
}
.zero_img{
  grid-row: 1;
  grid-column: 2 / -1;
  min-height: 100px;
}
@media only screen and (max-width: 991.98px) {
  .zerocont{
    grid-column: col-start 2  / col-end 9;
    display: grid;
    grid-template-columns: 1fr ;
    grid-template-rows: min-content min-content min-content min-content;
    font-size: 15px;
    grid-column-gap: 50px;
    grid-row-gap: 20px;
  }
  .zero_txt1{
    grid-row: 1 ;
    grid-column: 1;
  }
  .zero_txt2{
    grid-row: 3;
    grid-column: 1;
  }
  .zero_txt3{
    grid-row: 4;
    grid-column: 1;
  }
  .zero_img{
    grid-row: 2;
    grid-column: 1;
  }
}



/* 
.wpcp-carousel-section .swiper-wrapper {
  align-items: start;
}

.swiper-wrapper{
  max-height: 500px;
}
div.wpcp-carousel-wrapper.wpcp-wrapper-3747.wpcp-loaded .swiper-wrapper{
  max-height: 300px;
} */

.Newsletter {
  grid-column: center-start / center-end;
  display: grid;
  grid-template-columns: 1fr 1fr ;
  grid-template-rows: min-content min-content;
}
.Newsletter p{
  font-size: 15px;
}
.Newsletter ul{
  padding: 16px;
}
.newsletterForm{
  grid-column: 1 / 2;
  grid-row: 2;
  background-color: black;
    border: 1px solid gray;
    border-radius: 25px;
    margin-top: 5rem;
    padding: 2rem;
    height: auto;
    text-align: left;
    width: 70%;
}
.newsletterImg{
  grid-column: 2;
  grid-row: 1 / 2;
}

.newsPar{
  grid-column: 1;
  grid-row: 1;
}
#wsf-1-label-94-row-1{
  color: white;
}
#wsf-1-field-95{
  background-color: rgb(121, 3, 3);
  border-color: black;
}
/* FAQ PAGE STYILING */

.faqcont{
  grid-column: center-start / center-end;
}

.faqcont h2{
  font-size: 30px;
  margin-bottom: 20px;
}
.accordion .accordion-item {
  border-bottom: 1px solid #e5e5e5;
}

.accordion .accordion-item button[aria-expanded='true'] {
  border-bottom: 1px solid rgb(62, 62, 62);;
}

.accordion button {
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  padding: 1em 0;
  color: white;
  font-size: 1.5rem;
  font-weight: 400;
  border: none;
  background: none;
  outline: none;
}

.accordion button:hover,
.accordion button:focus {
  cursor: pointer;
  color: white;
}

.accordion button:hover::after,
.accordion button:focus::after {
  cursor: pointer;
  color: rgb(151, 0, 0);
  border: 1px solid rgb(62, 62, 62);
}

.accordion button .accordion-title {
  padding: 1em 1.5em 1em 0;
}

.accordion button .icon {
  display: inline-block;
  position: absolute;
  top: 18px;
  right: 0;
  width: 22px;
  height: 22px;
  border: 1px solid;
  border-radius: 22px;
}

.accordion button .icon::before {
  display: block;
  position: absolute;
  content: '';
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background: currentColor;
}
.accordion button .icon::after {
  display: block;
  position: absolute;
  content: '';
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background: currentColor;
}

.accordion button[aria-expanded='true'] {
  color: rgb(170, 0, 0);
}
.accordion button[aria-expanded='true'] .icon::after {
  width: 0;
}
.accordion button[aria-expanded='true'] + .accordion-content {
  opacity: 1;
  max-height: 9em;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content p {
  font-size: 1.2rem;
  font-weight: 300;
  margin: 2em 0;
}
/* 
#menu-item-4568 a{
  font-size:1.8rem;
} */

.AnwendeberichteTitle {
  font-family: 'Inter-Thin' ;
  text-align: center;
  font-size: 3rem;
  font-style: normal;
  font-weight: 300;
  line-height: 1.5rem;
  /* 80% */
  padding-bottom: 2rem;
  grid-column: center-start / center-end;
}

.listOrd{
  margin-left: 30px;
}

.KontaktButton{
  display: grid;
  justify-items: start;
  
}
.KontaktButton a{
  width: 100%;
}
.KontaktButton a{
  font-size:14px;
  font-family: 'Inter-Light';
  color:white;
  text-decoration: none;
}

.listInsidePoints{
  list-style-position: inside;
}
.formField{
  background-color: #a8a8a8;
}

.ProspektButtParent{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  text-decoration: none
}
.ProspektButt{
  grid-column: 2;
  background-color:red;
  color:white;
  text-align:center;
  width: max-content;
  margin-bottom: 0rem;
  font-size: 13px;
  font-family: 'Inter-Light';
  border-radius: 8px;
  text-decoration: none
}
.ProspektButt a{
  font-size: 15px;
  font-family: 'Inter-Light';
  padding:0px;
  border-radius: 8px;
  text-decoration: none;
  color:white;
}

@media only screen and (max-width: 991.98px) {
  .video-box video{
    object-fit: fill;
    width: 100%;
    height: 180px;
  }
  .imageSeq {

    padding-bottom: 1rem;
   
  }
  .description {
    color:white;
    padding-bottom: 3vw;
  }
  .description__par1 {
    
    font-size: 6px;
  }
  .description__par2 {
    font-size: 6px;
  }
  .DatenStruct h1, h2 {
    margin-top: 0px;
    margin-bottom: 0px;
    font-size: 16px;
    text-align: center;
  }
  .kundenzufriedenheitTitle {
    padding-top: 2rem;
  }
  .kundenzufriedenheit {
    margin: 0;
  }
  .textCont h1, h2, h3, h4 {
    grid-column: 1;
    font-size: 15px;
    color: white;
  }
  .tab-content-m1000 p, ul {
    font-family: 'Inter-Thin';
    font-size: 3vw;
  }
}







/* .referenzen {
  grid-column: center-start / center-end;
  overflow: hidden;
  padding-top: 10rem;
  background-color: black;
  grid-row: 8;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, min-content);
  grid-row-gap: 10rem; }

.referenzenTitle {
  grid-column: 1 / -1;
  grid-row: 1;
  color: #FFF;
  font-family: 'Inter-Thin';
  font-size: 3.5rem;
  font-style: normal;
  font-weight: 200;
  line-height: normal; }

.referenzenList {
  padding-top: 5rem;
  grid-column: 1 / -1;
  background-color: black;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 22rem; } */

.Referenzen{
  grid-column: 1 / -1;
  margin: 100px;
}
.marquee {
  
  margin: 20px;
  width: 100%;
  overflow: hidden;
  background: transparent;
  position: relative;
}
.marquee_title{
  color: #FFF;
  font-family: 'Inter-Thin';
  font-size: 3.7rem;
  font-style: normal;
  font-weight: 200;
  line-height: normal;
}
.marquee-content {
  margin-top: 20px;
  display: flex;
  width: max-content;
  animation: scroll-marquee 0s linear infinite;
  animation-duration: 190s;
  color: #bbb;
  font-family: 'Inter-Thin';
  font-size: 3.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.marquee-item {
  flex: 0 0 auto;
  padding: 10px 20px;
  margin-right: 30px;
  background: transparent;
  white-space: nowrap;
}

@keyframes scroll-marquee {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-100%);
  }
}

.haet-cleverreach-form{
  display: grid;
  grid-template-rows: 1fr 1fr;
}

.haet-cleverreach-field-wrap  {
  display: block;
  margin: 0;
  text-align: left;
}