@supports (-webkit-touch-callout: none) {
    .hintergrund{
        background-size: auto 100%;
        background-attachment: scroll;
        background-repeat:no-repeat;
        background-position:center center;
    }
}
@media only screen and (max-width: 1600px) {
      .nav_box{
        right:2%;
      }
      nav a{
        font-size: 15px;
      }
      .nav_logo_box{
        left:8%;
      }
      .flexelement_full_width{
        width: 80%;
        padding: 3% 3%;
      }
      .flexelement_full_width_center{
        width: 80%;
        padding: 3% 3%;
      }
      .header_titel{
        width:80%;
      }
      .footer-container {
        width: 80%;
        }
        .image-section {
          width: 80%;
          margin: 0 auto;
          padding: 2% 0;
        }
      }
@media only screen and (max-width: 1100px) {
  .flexelement_column{
      width: 100%;
      height: auto !important;
      text-align:left;
      padding:0;
      margin-top: 0;

    }
    .flexbox_with_columns {
      width:100%;
      height: auto !important;
      margin:0;
      padding:0;
      position:relative;
      display:flex;
      flex-direction:column;
      align-content:center;
      justify-content: center;
      align-items: flex-start;
      flex-wrap:wrap;
    }
    .picture{
      width: 100%;
    }
    .nav_mobile {
      display:block;
      position: relative;
      box-shadow: rgba(0, 0, 0, 0.19) 0px 0px 9px 0px;
      height:75px;
      background-color: #fff;
    }
    .nav_mobile_box{
      height: auto;
      z-index: 1;
      position: relative;
      background-color: #fff;
      opacity: 0.9;
    }
    .nav_mobile #nav_mobile {
      display: none;
      height: auto;
      top: 80px;
      z-index: 1;
      overflow: hidden;
    }
    .nav_mobile a {
      padding: 14px 0;
      text-align: center;
      text-decoration: none;
      font-size: 15px;
      display: block;
      color: #000;
    }
    .nav_mobile_logo_bild{
      height: 60px;
      padding:6px 0 0 12px;
    }
    .nav_mobile_icon{
      width:70px;
      height:70px;
      display: block;
      position: absolute;
      right: 0;
      top: 0;
      padding: 0 0;
    }
    .line {
       display: block;
       position: absolute;
       right:20px;
       height: 3px;
       width: 30px;
       background: #D95D30;
       border-radius: 2px;
       transition: 0.5s;
       transform-origin: center;
    }

    .line:nth-child(1) { top: 12px; }
    .line:nth-child(2) { top: 22px; }
    .line:nth-child(3) { top: 32px; }

    .nav_menue_icon {
     display: block;
     width: 75px;
     height: 50px;
     position: absolute;
     right: 0;
     top: 10px;
     padding: 0 0;
     border-radius: 4px;
     transition: border-radius .5s;
    }

    .nav_menue_icon.checked .line:nth-child(1){
       transform: translateY(10px) rotate(-45deg);
    }

    .nav_menue_icon.checked .line:nth-child(2){
       opacity:0;
    }

    .nav_menue_icon.checked .line:nth-child(3){
       transform: translateY(-10px) rotate(45deg);
    }
    nav{
      display: none;
    }

}


@media (max-width: 800px) {
  .footer-container {
    width: 80%;
    flex-direction: column;
    gap: 0;
    padding: 0% 0% 5% 0%;
  }
  .footer-right {
    width: auto;
    text-align: left;
  }
  .footer-left {
    width: auto;
  }
}

@media only screen and (max-width: 900px) {

  h2{
    font-size: 40px;
  }
  .button_akkordion{
    font-size: 17px;
  }
  #button_akkordion_klein{
    font-size: 15px;
  }
  .kachel{
    font-size: 15px;
    padding: 12px 18px;
  }
  .kachel-container {
      gap: 12px;
  }


}

  @media only screen and (max-width: 750px) {
  .flexelement_full_width{
      width: 85%;
      padding:5% 3%;
    }
    .flexelement_full_width_center{
        width: 85%;
        padding:5% 3%;
      }
      .header_titel{
        width: 85%;
      }
}
  @media only screen and (max-width: 550px) {

    h2{
      font-size: 30px;

    }
    h1{
      font-size: 25px;

    }

    .button {
    	padding: 10px 20px;
    	border: none;
    	background-color: #ffd35c;
      border-radius: 4px;
      font-family:'Quicksand','Roboto', sans serif;
      font-weight: bolder;
      color:#000;
      text-decoration: none;
      font-size: 12px;
      cursor: pointer;

    }
    .button:hover{
      cursor: pointer;
      text-decoration: none;
      color:#000;
    }
    #kontakt{
      height: 50% !important;
    }
    .image-grid {
      gap: 4%;
    }
    .image-tile {
      width: 100%;

    }
  }
  @media only screen and (max-width: 370px) {

    .button {
    	padding: 7px 7px;
    	border: none;
    	background-color: #ffd35c;
      border-radius: 4px;
      font-family:'Quicksand','Roboto', sans serif;
      font-weight: bolder;
      color:#000;
      text-decoration: none;
      font-size: 12px;
      cursor: pointer;

    }

  }