@media only screen and (max-width: 1600px) {
    .tlo_transparentne, .stopka_knt {
        padding: 5vw 15vw;
    }
    .tlo_oferta{
        background-size: cover;
    }
    ul.menuGlowne{
        padding: 0px;
    }

    .wp-image-34{
        max-height: 30vh;
    }
}

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

    ul.menuGlowne li {
        margin-right: 30px !important;
    }
}


@media only screen and (max-width: 1100px) {
    #glowny_naglowek_knt{
        background-color: var(--kolor-glowny);
    }
    #menuStrGlowna{
        display: block;
    }
    #logoGlowne{
        width: 170px;
    }



    .arrow-icon {
        display: block;
    }

    /** Menu mobilne **/
        #menu_mobil {
            display: block;
            position: absolute;
            height: 65px;
            width: 50px;
            z-index: 99;
            right: 20px;
            top: 15px;
        }
        .box_m {
          border-radius: 2px;
          position: relative;
          top: 30px;
          margin: 0 auto;
        }

        .box_m {
          cursor: pointer;
        }

        .box_m span {
          display: block;
          width: 100%;
          box-shadow: 0 2px 10px 0 rgba(0,0,0,0.3);
          border-radius: 3px;
          height: 2px;
          background: #fff;
          transition: all .3s;
          position: relative;
        }

        span + span {
          margin-top: 10px;
        }

        .active span:nth-child(1) {
          animation: ease .7s top forwards;
          height: 3px;
        }

        .not-active span:nth-child(1) {
          animation: ease .7s top-2 forwards;
          background-color:  #fff;
        }

        .active span:nth-child(2) {
          animation: ease .7s scaled forwards;
          height: 3px;
        }

        .not-active span:nth-child(2) {
          animation: ease .7s scaled-2 forwards;
        }

        .active span:nth-child(3) {
          animation: ease .7s bottom forwards;
          height: 3px;
        }

        .not-active span:nth-child(3) {
          animation: ease .7s bottom-2 forwards;
        }

        @keyframes top {
          0% {
            top: 0;
            transform: rotate(0);
          }
          50% {
            top: 17px;
            transform: rotate(0);
          }
          100% {
            top: 17px;
            transform: rotate(45deg);
          }
        }

        @keyframes top-2 {
          0% {
            top: 8px;
            transform: rotate(45deg);
          }
          50% {
            top: 8px;
            transform: rotate(0deg);
          }
          100% {
            top: 0;
            transform: rotate(0deg);
          }
        }

        @keyframes bottom {
          0% {
            bottom: 0;
            transform: rotate(0);
          }
          50% {
            bottom: 8px;
            transform: rotate(0);
          }
          100% {
            bottom: 8px;
            transform: rotate(135deg);
          }
        }

        @keyframes bottom-2 {
          0% {
            bottom: 8px;
            transform: rotate(135deg);
          }
          50% {
            bottom: 8px;
            transform: rotate(0);
          }
          100% {
            bottom: 0;
            transform: rotate(0);
          }
        }

        @keyframes scaled {
          50% {
            transform: scale(0);
          }
          100% {
            transform: scale(0);
          }
        }

        @keyframes scaled-2 {
          0% {
            transform: scale(0);
          }
          50% {
            transform: scale(0);
          }
          100% {
            transform: scale(1);
          }
        }


        .arrow-icon {
            display: block;
            position: relative;
            cursor: pointer;
            border-radius: 2px;
            float: right;
            width: 50px;
            margin-top: -30px;
            height: 20px;
        }

        .left-bar {
            position: absolute;
            background-color: transparent;
            top: 0;
            left:-2px;
            width: 20px;
            height: 2px;
            display: block;
            transform: rotate(35deg);
            float: right;
            border-radius: 2px;
            margin-top: 10px;
        }

        .left-bar:after {
            content:"";
            background-color: #fff;
            width: 20px;
            height: 2px;
            display: block;
            float: right;
            border-radius: 6px 10px 10px 6px;
            transition: all 0.5s cubic-bezier(.25,1.7,.35,.8);
            z-index: -1;
        }


        .right-bar {
            position: absolute;
            background-color: transparent;
            top: 0px;
            left:13px;
            width: 20px;
            height: 2px;
            display: block;
            transform: rotate(-35deg);
            float: right;
            border-radius: 2px;
        }  

        .right-bar:after {
            content:"";
            background-color: #fff;
            width: 20px;
            height: 2px;
            display: block;
            float: right;
            border-radius: 10px 6px 6px 10px;
            transition: all 0.5s cubic-bezier(.25,1.7,.35,.8);
            z-index: -1;
        }



        .open .left-bar:after {
            transform-origin: center center;
            transform: rotate(-70deg);
        }
        .open .right-bar:after {
            transform-origin: center center;
            transform: rotate(70deg);
        }
    /** Menu mobilne **/

    ul.menuGlowne {
        padding: 0px;
        margin: 0px;
        width: 100%;
    }

    ul.menuGlowne li{
        width: 100%;
        padding: 5px 20px;
    }
    .logo_knt {
        background-color: transparent;
        display: block;
        padding: 10px 20px;
    }
    .tlo_baner .nakladkaBaner {
        padding: 30px 10vw;
        padding-top: 100px;
    }
    .linki_kontaktowe {
        width: 100%;
        display: block;
        text-align: center;
        margin-top: 20px;
    }
    .nakladkaBaner .wp-block-image img {
        max-width: 80%;
        margin: 0 auto;
    }
  /*  .odstep {
        height: 100px;
    }
    .tlo_baner {
        min-height: calc(100vh - 100px);
    }
*/
    ul.menuGlowne li {
        margin-right: 0px !important;
        text-align: center;
    }
    /*ul.menuGlowne li {
        max-width: 300px;
        margin-left: calc((100% - 300px)/2);
        margin-right: calc((100% - 300px)/2);
    }*/
    ul.menuGlowne li:first-child{
        padding-top: 10px;
    }
    ul.menuGlowne li:last-child{
        padding-bottom: 40px;
    }


    #do_gory {
        right: -15px;
        width: 100px;
    }
    #glowny_naglowek_knt.floating, #glowny_naglowek_knt.floatingStr {
        position: absolute;
    }
}


@media only screen and (max-width: 900px) {
    .tlo_transparentne, .stopka_knt {
        padding: 5vw 5vw;
    }
    .tlo_baner .nakladkaBaner .wp-block-image {
        margin-bottom: 5vh;
        text-align: center;
    }
    .tlo_kontakt h2{
        text-align: center;
    }
    .trescKontakt {
        display: block;
        text-align: center;
    }

    .tlo_transparentne h2, .block-editor-writing-flow h2 {
        font-size: 40px;
    }
    .tlo_transparentne h3, .block-editor-writing-flow h3 {
        font-size: 22px;
    }
    .tlo_oferta .nakladkaBaner {
        padding-right: 10vw;
    }
}

@media only screen and (max-width: 600px) {
    .tlo_transparentne h2, .block-editor-writing-flow h2 {
        font-size: 32px;
    }
}