@media screen and (min-width: 1920px) {
  .wrapper { width: 1600px;}


}

@media screen and (max-width: 1920px) {
  .leistung {  position: relative; display: inline-block; width: calc(100% / 3 - 3px); }
  .leistung img { width: 100%; }
  .wrapper.content { width: 800px; }
}

@media screen and (max-width: 1366px) {
  .content-centered { margin-top: 0px;}
  .new-feature-controls { bottom: 0px; }

}



@media screen and (min-width: 1025px) {
  .leftCol { float: left; width: 50%; }
  .rightCol { float: right; width: 50%; }
  .row { display: flex; }
  .centerrow { justify-content: center; }
  .aboutus .leftCol, .aboutus .rightCol { flex: 1; }
  .mobilemenu, .mlogo, .mbreak { display: none; }
  .foto1 { position: absolute; right: 100px; width: 50%; top: 10%; }
  .foto2 {position: absolute; z-index: 2; left: -100px; bottom: 10%;  box-sizing: border-box; overflow: hidden; }
  .newsintro { width: 30%; float: left; }
  #willkommen h1 { font-size: 5rem; }
  .news { width: 70%;  float: right; padding: 50px;}
  .leistung_aufzaehlung h2 { display: inline; }
  .leistungen .row { gap: 25px;}
  /*.intro {     padding-left: 208px;}*/
  a:before, a:after, a > span:before, a > span:after {
    content: "";
    position: absolute;
    transition: transform 0.5s ease;
  }

  a:before {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: var(--red);
  transform: translateX(-100%);
  }

  a:hover:before { transform: translateX(0); }

  a:hover {
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  }
}

@media screen and (max-width: 1024px) {
  body { font-size: 16px; }
  section { padding: 40px 0px; }
  p { line-height: 28px; }
  .wrapper { width: 90%;}
  .wrapper.content {  width: 80%; }
  .sub .wrapper {  margin-top: 100px; }
   nav { display: none; }
   h2, #landing h2 { font-size: 2rem;}
   #landing h2 { margin-bottom: 30px;}
  .mobilemenu, .mbreak { display: block; }
  .sidenav { height: 100%; width: 0; position: fixed; z-index: 999; top: 0; left: 0; background-color: var(--red); overflow-x: hidden; transition: 0.5s; padding-top: 60px; text-align: center; }
  .sidenav ul { margin-left: 0px; padding-top: 30px;   }
  .sidenav a { text-decoration: none;  font-size: 25px; color: #fff; margin-bottom: 30px; line-height: 30px; }
  .sidenav .closebtn { position: absolute; top: 19px; right: 18px; font-size: 36px; margin-left: 50px; }
  .mlogo { position: fixed; z-index: 10; top: 10px; left: 10px; }
  .mlogo img { width: 230px;}
  #aboutus .wrapper {  display: flex; flex-direction: column; text-align: justify;}
  #aboutus .rightCol { order: 1;}
  #aboutus .leftCol { order: 2; margin-top: 50px;}
  .foto1 { height: 400px; float: right; margin-right: 100px; }
  .foto2 { margin-top: -50px; margin-left: 20px; float: left; }
  #willkommen h1 { font-size: 11vw; }
  #willkommen .mbreak, #aboutus .mbreak { display: inline; }
  .menubar { top: 0px; background: rgb(0,0,0); background: linear-gradient(180deg, rgba(0,0,0,0.8799894957983193) 0%, rgba(0,0,0,0) 76%); width: 100%; height: 110px; position: fixed; z-index: 9; }
  .newsintro, .news { width: 100%; }
  .news { margin-top: 50px; padding: 20px; }
  .leistung_aufzaehlung h2 { display: block; }
  footer { margin-bottom: 50px;}
  .adresse, .mailtel { width: 100%; text-align: center; }
  .kontakt { padding-top: 0px;}
  .kontakt .leftCol { height: 300px; overflow: hidden; margin-bottom: 30px; }
  .kontakt img { margin-top: -50%;}
  .adresse:before { margin-left: -118px;  content: '\f3c5';  font-family: 'FAsolid';  margin-right: 7px;  position: absolute; }
  .maschine { width: 100%;  margin: 0 auto;  }
  .historietbl:after { right: 20px; opacity: 0.1; bottom: 0px; }
   .mobilemenu ul li::before { padding-top: 2px;}
   .topbar { display: none; }
}

@media screen and (min-width: 769px) {
  .controls .control { width: 80px;  height: 80px;}
  .jobs .badge { opacity: 1; }
}

@media screen and (max-width: 768px) {
  .topbar { display: none; }
  .newsintro { width: 100%; }
  .kontaktform { padding: 20px; }
  .w50 {width: 100%; float: none; }
  .new-feature-slider .feature-slide, .block { position: initial; }
  .block-wrap:before { padding-top: 0px; }
  .content-centered { margin-top: 0px;  padding: 30px 30px 80px 30px;}
  .new-feature-controls { bottom: 0px; right: 0px; left: auto;  }
  .leistung { text-align: center; }
  .foto1 { height: 360px; }
  .controls .control { width: 55px;  height: 60px;}
  .jobs .badge { opacity: 0.5; }
  .new-feature-slider .feature-slide { display: none; }
  .new-feature-slider .feature-slide.active { display: block; }
  .historietbl td { vertical-align: top; }
  .articlepage h1 { font-size: 2.3rem;}
}

@media screen and (max-width: 650px) {
  #willkommen { padding-top: 100px; }
   h1 { font-size: 2.5rem;}
  .liste_check { width: calc(100% - 54px); margin-left: 54px; }
  .liste_check:before { width: 35px; height: 35px;top: 7px; left: -52px; padding: 6px; padding-top: 5px;}
  .foto1 { margin-right: 20px;}
  .leistung img { width: 100%; }
  .leistung { width: 100%; }
  .leistung img { width: 100%; }
   h2, #landing h2 { font-size: 1.6rem; }
   .foto2 { width: 75%; }
   .popup_contain { padding: 20px; }
   .crop { float: none; width: 100%; max-height: 200px; margin-bottom: 10px; }
   .popup_contain { max-width: 92%; }
   .maschine td { width: 100%; display: block; text-align: center; }
   .articlecontent h1 { font-size: 1.7rem;}
}