@media only screen and (min-width: 1640px) and (max-width: 1879px) {

    /* --- ustawienia ogółne --- */
    .container,
    .container2 {
        width: 1540px;
    }

    /* --- slider z banerami na stronie głównej --- */
    #slider_container .slider_box {
        padding: 70px;
        width: 45vw;
    }

    .slider_box .line1 {
        font: 400 58px/66px 'Red Hat Display', sans-serif;
    }

    /* --- strona główna - sekcja 1 --- */
    #section1 .home_oferta {
        width: 45vw;
        padding: 70px;
    }

    #section1 .home_news {
        padding: 70px 60px 0;
    }

    #section1 .box_news .news {
        width: 47%;
    }

    .news .news_foto {
        width: 100%;
        height: auto;
    }

    /* --- strona główna - kalkulator --- */
    #home_kalkulator {
        padding: 90px 50px 70px;
    }

    .zb_krokow .krok_1 .line1_left {
        width: 35%;
    }

    .zb_krokow .line1_right {
        width: 60%;
    }

    /* --- strona głowna - realizacje --- */
    .box_realizacja {
        width: 48%;
        height: auto;
    }

    /* --- footer --- */
    .footer_left, .footer_right {
        width: 48%;
    }

    .footer_left {
        padding: 75px 50px 35px;
    }

    .footer_right {
        padding: 100px 70px 70px;
    }

    /* --- galeria na podstronie --- */
    #galeria a {
        width: 370px;
        height: 309px;
        margin: 0 20px 20px 0;
    }

    /* --- lista blog --- */
    .zb_blog .news .news_foto {
        margin: 0 50px 0 0;
        width: 47%;
    }

    /* --- kategorie --- */
    .box_kategoria {
        margin: 0 77px 80px 0;
    }

    /* --- podstrona realizacje --- */
    .zb_realizacji_podstrona .box_realizacja {
        width: 480px;
        height: 360px;
        margin: 0 50px 60px 0;
    }

}

@media only screen and (min-width: 1496px) and (max-width: 1639px) {

    /* --- ustawienia ogółne --- */
    .container,
    .container2 {
        width: 1400px;
    }

    /* --- header --- */
    header {
        padding: 5px 40px 25px;
    }

    header.home {
        padding-top: 25px;
    }

    header .logo {
        width: 350px;
    }

    header nav li {
        margin: 0 0 0 30px;
    }

    header nav a {
        padding: 20px 0;
    }

    /* --- slider z banerami na stronie głównej --- */
    #slider_container .slider_box {
        padding: 50px;
        width: 45vw;
        left: 40px;
    }

    .slider_box .line1 {
        font: 400 50px/58px 'Red Hat Display', sans-serif;
    }

    .header_social {
        top: 120px;
        right: 40px;
    }

    #slider_container .slick-dots {
        top: 46%;
        right: 41px;
    }

    /* --- header kontakt --- */
    .header_kontakt {
        right: 55px;
        bottom: 225px;
    }

    /* ---- link kalkulator --- */
    .link_kalkulator {
        bottom: 45px;
        right: 55px;
    }

    /* --- strona główna - sekcja 1 --- */
    #section1 {
        padding: 0 0 0 40px;
    }

    #section1 .naglowek,
    #home_realizacje .tytul .tekst {
        margin: 0 0 80px;
    }

    #section1 .home_oferta .naglowek {
        margin: 0 0 40px;
    }

    #section1 .home_oferta {
        width: 45vw;
        padding: 50px;
    }

    .link_oferta {
        margin: 0 0 40px 40px;
    }

    .link_oferta .kolumna1 {
        width: 180px;
        height: 180px;
        margin: 0 50px 0 0;
    }

    .link_oferta .kolumna1 svg {
        width: 90px;
    }

    .link_oferta .kwadrat {
        width: 130px;
        height: 130px;
    }

    .link_oferta .kolumna2 .line1 {
        font: 400 36px/40px 'Red Hat Display', sans-serif;
    }

    .link_oferta .kolumna2 .line1 span {
        font: 700 42px/46px 'Red Hat Display', sans-serif;
    }

    #section1 .home_news {
        padding: 50px 50px 0;
    }

    #section1 .box_news {
        margin: 0 0 50px;
    }

    #section1 .box_news .news {
        width: 47%;
    }

    .news .news_foto {
        width: 100%;
        height: auto;
        margin: 0 0 30px;
    }

    .news .news_tytul {
        margin: 0 0 20px;
    }

    .news .news_zajawka {
        margin: 0 0 20px;
    }

    /* --- strona główna - kalkulator --- */
    #home_kalkulator {
        padding: 70px 40px 60px;
    }

    .zb_krokow .ico_calc {
        width: 125px;
        margin: 0 55px 0 0;
    }

    .zb_krokow .krok_1 .line1_left {
        width: 38%;
    }

    .zb_krokow .krok_1 .separator {
        margin: 40px 0;
    }

    .zb_krokow .line1_right {
        width: 60%;
    }

    .zb_krokow .line1_right .range-slider {
        width: 600px;
    }

    .zb_krokow .krok_2_left {
        width: 38%;
    }

    /* ---- strona główna - dlaczego my --- */
    #home_dlaczego {
        margin: 0 40px;
        padding: 50px;
    }

    #home_dlaczego .right {
        flex: 0 0 auto;
        margin: 0 0 0 120px;
    }

    /* --- strona głowna - realizacje --- */
    #home_realizacje {
        margin: 0 40px;
        padding: 60px 0 70px;
    }

    #home_realizacje .tytul .tekst {
        margin: 0;
    }

    #home_realizacje .tytul {
        padding: 0 50px;
        margin: 0 0 40px;
    }

    .box_realizacja {
        width: 48%;
        height: auto;
    }

    /* --- footer --- */
    footer {
        margin: 0 40px;
    }

    .footer_left, .footer_right {
        width: 48%;
    }

    .footer_left {
        padding: 50px 30px 30px;
    }

    .footer_left .logo2 {
        width: 350px;
        margin: 0 0 50px;
    }

    .footer_right {
        padding: 58px 50px 50px;
    }

    .footer_copyright {
        margin: 30px 0;
    }

    /* --- galeria na podstronie --- */
    #galeria a {
        width: 335px;
        height: 280px;
        margin: 0 20px 20px 0;
    }

    /* --- lista blog --- */
    .zb_blog .news .news_foto {
        margin: 0 50px 0 0;
        width: 47%;
    }

    /* --- kategorie --- */
    .box_kategoria {
        margin: 0 70px 70px 0;
    }

    /* --- podstrona realizacje --- */
    .zb_realizacji_podstrona .box_realizacja {
        width: 440px;
        height: 330px;
        margin: 0 40px 50px 0;
    }

}

@media only screen and (min-width: 1280px) and (max-width: 1495px) {

    /* --- ustawienia ogółne --- */
    #content_podstrony {
        padding: 20px 0 0;
    }

    .container,
    .container2 {
        width: 1200px;
    }

    label {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        padding: 0 0 10px;
    }

    /* --- cms --- */
    .cms h1 {
        font: 700 50px/60px 'Red Hat Display', sans-serif;
        margin: 0 0 40px;
    }

    .cms h2 {
        font: 700 40px/50px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .cms h3 {
        font: 700 34px/42px 'Red Hat Display', sans-serif;
    }

    .cms h4 {
        font: 700 28px/36px 'Red Hat Display', sans-serif;
    }

    .cms p,
    .cms li {
        font: 400 17px/30px 'Red Hat Display', sans-serif;
    }

    .cms p {
        margin: 0 0 25px;
    }

    .cms > img,
    .cms p img {
        margin: 40px 0;
    }

    .cms ul {
        margin: 0 0 30px 15px;
    }

    .cms ol {
        margin: 0 0 30px 0;
    }

    .cms ul > li::before {
        top: 14px;
    }

    .cms hr, hr {
        margin: 40px 0;
    }


    .cms table {
        margin: 0 0 40px 0;
    }

    .cms > table td, .cms > table th {
        padding: 20px 25px;
    }

    /* --- buttony --- */
    .btn {
        font: 700 16px/18px 'Red Hat Display', sans-serif;
        padding: 18px 80px 18px 35px;
    }

    /* --- breadcrumps --- */
    #breadcrumps {
        margin: 0 0 30px;
    }

    #breadcrumps .home {
        width: 13px;
        height: 12px;
        margin: 2px 10px 0 0;
    }

    #breadcrumps .home .ico_home {
        width: 13px;
        height: auto;
    }

    #breadcrumps div a,
    #breadcrumps div .separator {
        margin: 0 5px 0 0;
    }

    #breadcrumps div a,
    #breadcrumps div .active,
    #breadcrumps div .separator {
        font: 400 12px/16px 'Red Hat Display', sans-serif;
    }

    /* --- pliki do pobrania --- */
    #pliki a .kolko {
        width: 30px;
        height: 30px;
        margin: -3px 15px 0 0;
    }

    #pliki a .ico_download {
        width: 15px;
    }

    /* --- paginacja --- */
    #paginacja {
        margin: 0 0 50px;
    }

    /* --- header --- */
    header {
        padding: 5px 40px 25px;
    }

    header.home {
        padding-top: 25px;
    }

    header .header_logo {
        margin: 20px 0 0;
    }

    header .logo {
        width: 350px;
    }

    header nav li {
        margin: 0 0 0 30px;
    }

    header nav a {
        padding: 20px 0;
        font: 700 15px/19px 'Red Hat Display', sans-serif;
    }

    /* --- banerek na podstronach --- */
    #wrapper_podstrona {
        height: 200px;
    }

    #wrapper_podstrona .header_kontakt {
        right: 590px;
        bottom: 20px;
    }

    #wrapper_podstrona .link_telefon {
        margin: 0 0 15px;
    }

    #wrapper_podstrona .link_kalkulator {
        padding: 15px 35px 10px 15px;
    }

    #wrapper_podstrona .link_kalkulator .line1 {
        margin: 0 0 5px;
    }

    #wrapper_podstrona .link_kalkulator .line2 {
        margin: -20px -55px 0 0;
    }

    /* --- slider z banerami na stronie głównej --- */
    #slider_container .slider_box {
        padding: 40px;
        width: 45vw;
        left: 40px;
    }

    .slider_box .line1 {
        font: 400 42px/50px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .slider_box .line2 {
        font: 400 20px/30px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .header_social {
        top: 110px;
        right: 40px;
    }

    #slider_container .slick-dots {
        top: 48%;
        right: 41px;
    }

    /* --- header kontakt --- */
    .header_kontakt {
        right: 55px;
        bottom: 190px;
    }

    .header_kontakt .link_telefon {
        font: 700 19px/20px 'Red Hat Display', sans-serif;
    }

    .header_kontakt .link_mail {
        font: 700 17px/20px 'Red Hat Display', sans-serif;
    }

    /* ---- link kalkulator --- */
    .link_kalkulator {
        bottom: 30px;
        right: 55px;
        padding: 20px 35px 10px 15px;
    }

    .link_kalkulator::before {
        top: -15px;
        left: -15px;
        width: 100px;
        height: 100px;
    }

    .link_kalkulator:hover::before {
        height: calc(100% + 30px);
    }

    .link_kalkulator .ico_calc {
        width: 45px;
        margin: 0 40px 0 0;
    }

    .link_kalkulator .line1 {
        margin: 0;
    }

    .link_kalkulator .line1 .text {
        font: 400 20px/22px 'Red Hat Display', sans-serif;
    }

    .link_kalkulator .line2 {
        margin: 0 -55px 0 0;
    }

    .link_kalkulator .line2 .kolko {
        width: 43px;
        height: 43px;
    }

    .link_kalkulator:hover .line2 .kolko {
        top: 26px;
    }

    /* --- strona główna - sekcja 1 --- */
    #section1 {
        padding: 0 0 0 40px;
    }

    #section1 .naglowek,
    #home_realizacje .tytul .tekst {
        margin: 0 0 80px;
    }

    #section1 .home_oferta .naglowek {
        margin: 0 0 40px;
    }

    #section1 .home_oferta {
        width: 45vw;
        padding: 50px 40px;
    }

    .link_oferta {
        margin: 0 0 40px 0;
    }

    .link_oferta .kolumna1 {
        width: 180px;
        height: 180px;
        margin: 0 50px 0 0;
    }

    .link_oferta .kolumna1 svg {
        width: 90px;
    }

    .link_oferta .kwadrat {
        width: 130px;
        height: 130px;
    }

    .link_oferta .kolumna2 .line1 {
        font: 400 36px/40px 'Red Hat Display', sans-serif;
    }

    .link_oferta .kolumna2 .line1 span {
        font: 700 42px/46px 'Red Hat Display', sans-serif;
    }

    #section1 .home_news {
        padding: 50px 40px 0;
    }

    #section1 .box_news {
        margin: 0 0 50px;
    }

    #section1 .box_news .news {
        width: 47%;
    }

    .news .news_foto {
        width: 100%;
        height: auto;
        margin: 0 0 30px;
    }

    .news .news_tytul {
        margin: 0 0 20px;
        font: 700 18px/25px 'Red Hat Display', sans-serif;
        max-height: 75px;
    }

    .news .news_zajawka {
        margin: 0 0 25px;
        font: 400 16px/23px 'Red Hat Display', sans-serif;
        max-height: 92px;
    }

    /* --- strona główna - kalkulator --- */
    #home_kalkulator {
        padding: 60px 40px 50px;
    }

    .zb_krokow .ico_calc {
        width: 95px;
        margin: 0 30px 0 0;
    }

    .zb_krokow .krok_1 .line1_left {
        width: 36%;
    }

    .zb_krokow .krok_1 .tekst_duzy,
    .zb_krokow .krok_2 .naglowek div,
    .zb_krokow .krok_3 .tekst_duzy {
        font: 700 32px/36px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .tekst_maly {
        font: 400 24px/32px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .podpis {
        font: 400 17px/22px 'Red Hat Display', sans-serif;
        margin: 0 40px 0 0;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji .arrow_poziom {
        width: 26px;
        transform: rotate(180deg);
        margin: 0 0 0 40px;
    }

    .zb_krokow .krok_1 .separator {
        margin: 30px 0;
    }

    .zb_krokow .line1_right {
        width: 62%;
    }

    .zb_krokow .line1_right .range-slider {
        width: 520px;
        padding: 0 40px 0 0;
    }

    .zb_krokow .irs {
        font: 700 26px/26px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .irs--big .irs-single {
        top: 10px;
    }

    .zb_krokow .line1_right .suwak1 {
        margin: 0 0 20px;
    }

    .zb_krokow .suwak1 .irs--big .irs-single {
        padding: 0 26px 0 0;
    }

    .zb_krokow .suwak2 .irs--big .irs-single {
        padding: 0 65px 0 0;
    }

    .zb_krokow .krok_1 .line2 {
        padding: 0;
    }

    .zb_krokow .krok_1 .line2 .oszczednosci,
    .zb_krokow .krok_1 .line2 .koszt_instalacji,
    .zb_krokow .krok_1 .line2 .okres_zwrotu {
        width: 260px;
    }

    .zb_krokow .krok_1 .line2 .kropka {
        margin: 60px 0 0;
    }

    .zb_krokow .krok_1 .line2 .tytul {
        font: 700 22px/24px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .zb_krokow .krok_1 .line2 .wartosc {
        font: 700 48px/50px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .zb_krokow .krok_1 .line2 .tekst {
        font: 400 14px/18px 'Red Hat Display', sans-serif;
        height: 36px;
    }

    .zb_krokow .krok_1 .line2 .last_div {
        margin: 0 0 0 30px;
    }

    .zb_krokow .krok_1 .ktory_krok {
        margin: 0 0 65px;
    }

    .zb_krokow .krok_2_left {
        width: 38%;
    }

    .zb_krokow .krok_2 .line_1 > div {
        width: 30%;
    }

    .zb_krokow .krok_2 .line_1 input {
        height: 46px;
    }

    .podstrona_kalkulator .zb_krokow .krok_2,
    .podstrona_kalkulator .zb_krokow .krok_3 {
        margin: 0 0 100px;
    }

    /* ---- strona główna - dlaczego my --- */
    #home_dlaczego {
        margin: 0 40px;
        padding: 50px 40px;
    }

    #home_dlaczego .left .tytul {
        font: 700 34px/40px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    #home_dlaczego .right {
        margin: 0 0 0 100px;
    }

    #home_dlaczego .ikony > div,
    #home_dlaczego .ikony > a {
        width: 130px;
    }

    #home_dlaczego .ikony > div {
        margin: 0 40px 0 0;
    }

    /* --- strona głowna - realizacje --- */
    #home_realizacje {
        margin: 0 40px;
        padding: 60px 0 70px;
    }

    #home_realizacje .tytul .tekst {
        margin: 0;
    }

    #home_realizacje .tytul {
        padding: 0 50px;
        margin: 0 0 40px;
    }

    .box_realizacja {
        width: 48%;
        height: auto;
    }

    /* --- footer --- */
    footer {
        margin: 0 40px;
    }

    .footer_left, .footer_right {
        width: 48%;
    }

    .footer_left {
        padding: 40px 0 20px;
    }

    .footer_left .logo2 {
        width: 350px;
        margin: 0 0 40px;
    }

    .link_kontakt.kontakt_adres,
    .link_kontakt.kontakt_telefon {
        margin: 0 0 25px;
    }

    .link_kontakt svg {
        width: 32px;
        margin: 0 15px 0 0;
    }

    .footer_right {
        padding: 47px 40px 50px;
    }

    .footer_copyright {
        margin: 25px 0;
    }

    /* --- galeria na podstronie --- */
    #galeria {
        margin: 0 0 40px;
    }

    #galeria a,
    #galeria a:nth-of-type(4n) {
        width: 386px;
        height: 322px;
        margin: 0 20px 20px 0;
    }

    #galeria a:nth-of-type(3n) {
        margin-right: 0;
    }

    /* --- lista blog --- */
    .zb_blog .news {
        width: 48%;
        margin: 0 0 100px;
    }

    .zb_blog .news:nth-last-of-type(-n + 2) {
        margin: 0 0 90px;
    }

    .zb_blog .news::before {
        bottom: -50px;
    }

    .zb_blog .news .news_foto {
        margin: 0 35px 0 0;
        width: 47%;
    }

    .zb_blog .news .news_tytul {
        margin: 0 0 15px;
    }

    .zb_blog .news .news_zajawka {
        margin: 0;
    }

    /* --- kategorie --- */
    .box_kategoria {
        margin: 0 50px 50px 0;
        height: 180px;
    }

    .box_kategoria .tytul {
        top: 25px;
        padding: 0 30px;
        font: 700 20px/28px 'Red Hat Display', sans-serif;
        max-height: 84px;
    }

    /* --- podstrona realizacje --- */
    .zb_realizacji_podstrona {
        justify-content: space-between;
    }

    .zb_realizacji_podstrona .box_realizacja {
        width: 48%;
        height: auto;
        margin: 0 0 40px 0;
    }

    .realizacja .opis_realizacji .ico_calc {
        width: 70px;
        margin: 7px 25px 0 0;
    }

    .realizacja .link_kalkulator2 .line1 {
        font: 700 22px/34px 'Red Hat Display', sans-serif;
    }

    .realizacja .foto_realizacja .dane_realizacja {
        top: 50px;
        padding: 20px 35px;
    }

    .nawigacja_realizacji {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 50px;
    }

    /* --- podstrona kontakt --- */
    .kontakt_cms .kontakt_left {
        margin: 0 50px 0 0;
    }

    .kontakt_cms .kontakt_left > a {
        margin: 0 0 30px;
    }

    .kontakt_mapa {
        width: calc(64% - 50px);
    }

    /* --- formularz kontaktowy --- */
    #formularz_kontaktowy {
        padding: 40px 0 0;
    }

    #formularz_kontaktowy h3 {
        margin: 0 0 40px;
    }

    #formularz_kontaktowy .form_text {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        padding: 0 0 15px;
        height: 35px;
    }

    input, textarea, select {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    #formularz_kontaktowy input,
    #formularz_kontaktowy select {
        height: 46px;
    }

    #formularz_kontaktowy .token div input {
        width: 150px;
    }

    #formularz_kontaktowy form > div {
        margin: 0 0 30px;
    }

    #formularz_kontaktowy .token div img {
        width: auto;
        height: 46px;
    }

    #formularz_kontaktowy textarea {
        height: 160px;
    }

    /* --- podstrona oferta --- */
    .zb_oferta {
        margin: 0 0 70px;
    }

    .zb_oferta .link_oferta .kolumna1 {
        width: 90px;
        height: 174px;
        margin: 0 30px 0 0;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 {
        font: 400 36px/40px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 span {
        font: 700 44px/44px 'Red Hat Display', sans-serif;
    }

}

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

    /* --- ustawienia ogółne --- */
    #content_podstrony {
        padding: 20px 0 0;
    }

    .container,
    .container2 {
        width: 960px;
    }

    label {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        padding: 0 0 10px;
    }

    /* --- cms --- */
    .cms h1 {
        font: 700 50px/60px 'Red Hat Display', sans-serif;
        margin: 0 0 40px;
    }

    .cms h2 {
        font: 700 40px/50px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .cms h3 {
        font: 700 34px/42px 'Red Hat Display', sans-serif;
    }

    .cms h4 {
        font: 700 28px/36px 'Red Hat Display', sans-serif;
    }

    .cms p,
    .cms li {
        font: 400 17px/30px 'Red Hat Display', sans-serif;
    }

    .cms p {
        margin: 0 0 25px;
    }

    .cms > img,
    .cms p img {
        margin: 40px 0;
    }

    .cms ul {
        margin: 0 0 30px 15px;
    }

    .cms ol {
        margin: 0 0 30px 0;
    }

    .cms ul > li::before {
        top: 14px;
    }

    .cms hr, hr {
        margin: 40px 0;
    }


    .cms table {
        margin: 0 0 40px 0;
    }

    .cms > table td, .cms > table th {
        padding: 20px 25px;
    }

    /* --- buttony --- */
    .btn {
        font: 700 16px/18px 'Red Hat Display', sans-serif;
        padding: 18px 80px 18px 35px;
    }

    .btn2 .kolko {
        margin: 0 25px 0 0;
        width: 34px;
        height: 34px;
    }

    .btn2 svg {
        width: 20px;
    }

    .btn_wroc .kolko {
        margin: 0 0 0 25px;
    }

    .btn_wroc:hover .kolko {
        margin: 0 20px 0 5px;
    }

    /* --- breadcrumps --- */
    #breadcrumps {
        margin: 0 0 30px;
    }

    #breadcrumps .home {
        width: 13px;
        height: 12px;
        margin: 2px 10px 0 0;
    }

    #breadcrumps .home .ico_home {
        width: 13px;
        height: auto;
    }

    #breadcrumps div a,
    #breadcrumps div .separator {
        margin: 0 5px 0 0;
    }

    #breadcrumps div a,
    #breadcrumps div .active,
    #breadcrumps div .separator {
        font: 400 12px/16px 'Red Hat Display', sans-serif;
    }

    /* --- pliki do pobrania --- */
    #pliki a .kolko {
        width: 30px;
        height: 30px;
        margin: -3px 15px 0 0;
    }

    #pliki a .ico_download {
        width: 15px;
    }

    /* --- paginacja --- */
    #paginacja {
        margin: 0 0 50px;
    }

    /* --- header --- */
    header {
        padding: 5px 30px 25px;
    }

    header.home {
        padding-top: 25px;
    }

    header .header_logo {
        margin: 20px 0 0;
    }

    header .logo {
        width: 280px;
    }

    header nav li {
        margin: 0 0 0 20px;
    }

    header nav a {
        padding: 15px 0;
        font: 700 14px/19px 'Red Hat Display', sans-serif;
    }

    /* --- banerek na podstronach --- */
    #wrapper_podstrona {
        height: 170px;
    }

    #wrapper_podstrona .header_kontakt {
        right: 530px;
        bottom: 20px;
        flex-direction: row;
    }

    #wrapper_podstrona .link_telefon {
        margin: 0 25px 0 0;
    }

    #wrapper_podstrona .link_kalkulator {
        padding: 15px 35px 10px 15px;
    }

    #wrapper_podstrona .link_kalkulator .line1 {
        margin: 0 0 5px;
    }

    #wrapper_podstrona .link_kalkulator .line2 {
        margin: -20px -52px 0 0;
    }

    #wrapper_podstrona .link_kalkulator .line2 .text {
        font: 700 13px/15px 'Red Hat Display', sans-serif;
        margin: 0 10px 0 0;
    }

    /* --- slider z banerami na stronie głównej --- */
    #slider_container .slider_box {
        padding: 35px 30px;
        width: 45vw;
        left: 30px;
    }

    .slider_box .line1 {
        font: 400 40px/48px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .slider_box .line2 {
        font: 400 20px/30px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .todown {
        right: 25px;
        bottom: 25px;
    }

    .todown .arrow_pion {
        margin: 0 0 0 15px;
    }

    .header_social {
        top: 110px;
        right: 30px;
    }

    #slider_container .slick-dots {
        top: 48%;
        right: 32px;
    }


    /* --- header kontakt --- */
    .header_kontakt {
        right: 55px;
        bottom: 190px;
    }

    .header_kontakt a svg {
        width: 21px;
        margin: 0 7px 0 0;
    }

    .header_kontakt .link_telefon {
        font: 700 19px/20px 'Red Hat Display', sans-serif;
    }

    .header_kontakt .link_mail {
        font: 700 17px/20px 'Red Hat Display', sans-serif;
    }

    /* ---- link kalkulator --- */
    .link_kalkulator {
        bottom: 30px;
        right: 45px;
        padding: 15px 20px 10px 15px;
    }

    .link_kalkulator::before {
        top: -12px;
        left: -12px;
        width: 85px;
        height: 85px;
    }

    .link_kalkulator:hover::before {
        height: calc(100% + 24px);
    }

    .link_kalkulator .ico_calc {
        width: 35px;
        margin: 0 35px 0 0;
    }

    .link_kalkulator .line1 {
        margin: 0;
    }

    .link_kalkulator .line1 .text {
        font: 400 18px/20px 'Red Hat Display', sans-serif;
    }

    .link_kalkulator .line2 {
        margin: 0 -37px 0 0;
    }

    .link_kalkulator .line2 .kolko {
        width: 38px;
        height: 38px;
    }

    .link_kalkulator:hover .line2 .kolko {
        top: 24px;
    }

    .link_kalkulator .line2 .arrow_pion {
        width: 17px;
    }

    /* --- strona główna - sekcja 1 --- */
    #section1 {
        padding: 0 0 0 30px;
    }

    #section1 .naglowek,
    #home_realizacje .tytul .tekst {
        margin: 0 0 70px;
        font: 700 26px/28px 'Red Hat Display', sans-serif;
    }

    #section1 .home_oferta .naglowek {
        margin: 0 0 40px;
    }

    #section1 .home_oferta {
        width: 45vw;
        padding: 40px 30px;
    }

    .link_oferta {
        margin: 0 0 40px 0;
    }

    .link_oferta .kolumna1 {
        width: 130px;
        height: 130px;
        margin: 0 30px 0 0;
    }

    .link_oferta .kolumna1 svg {
        width: 75px;
    }

    .link_oferta:hover .kolumna1 svg {
        left: 55px;
    }

    .link_oferta .kwadrat {
        width: 90px;
        height: 90px;
    }

    .link_oferta:hover .kwadrat {
        background-color: #0074b8;
        right: 40px;
    }

    .link_oferta .kolumna2 .line1 {
        font: 400 30px/32px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .link_oferta .kolumna2 .line1 span {
        font: 700 36px/38px 'Red Hat Display', sans-serif;
    }

    .link_oferta:hover .btn2 .kolko {
        margin: 0 10px 0 15px;
    }

    #section1 .home_news {
        padding: 40px 30px 0;
    }

    #section1 .box_news {
        margin: 0 0 40px;
    }

    #section1 .box_news .news {
        width: 47%;
    }

    .news .news_foto {
        width: 100%;
        height: auto;
        margin: 0 0 20px;
    }

    .news .news_tytul {
        margin: 0 0 15px;
        font: 700 18px/24px 'Red Hat Display', sans-serif;
        max-height: 72px;
    }

    .news .news_zajawka {
        margin: 0 0 20px;
        font: 400 16px/22px 'Red Hat Display', sans-serif;
        max-height: 88px;
    }

    /* --- strona główna - kalkulator --- */
    #home_kalkulator {
        padding: 50px 30px 40px;
    }

    .zb_krokow .ico_calc {
        width: 76px;
        margin: 0 20px 0 0;
    }

    .zb_krokow .krok_1 .line1_left {
        width: 35%;
    }

    .zb_krokow .krok_1 .naglowek {
        margin: 0 0 30px;
    }

    .zb_krokow .krok_1 .tekst_duzy,
    .zb_krokow .krok_2 .naglowek div,
    .zb_krokow .krok_3 .tekst_duzy,
    .zb_krokow .krok_1 .wielkosc_instalcji .wartosc {
        font: 700 25px/30px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .tekst_maly {
        font: 400 20px/24px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .podpis {
        font: 400 16px/20px 'Red Hat Display', sans-serif;
        margin: 0 25px 0 0;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji .arrow_poziom {
        width: 25px;
        margin: 0 0 0 25px;
    }

    .zb_krokow .krok_1 .separator {
        margin: 25px 0;
    }

    .zb_krokow .line1_right {
        width: 63%;
    }

    .zb_krokow .line1_right .range-slider {
        width: 420px;
        padding: 0 30px 0 0;
    }

    .zb_krokow .irs--big .irs-handle {
        top: 50px;
        width: 25px;
        height: 25px;
    }

    .zb_krokow .irs {
        font: 700 22px/22px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .irs--big .irs-single {
        top: 20px;
    }

    .zb_krokow .line1_right .suwak1 {
        margin: 0;
    }

    .zb_krokow .irs--big {
        height: 90px;
    }

    .zb_krokow .suwak1 .irs--big .irs-single {
        padding: 0 20px 0 0;
    }

    .zb_krokow .suwak2 .irs--big .irs-single {
        padding: 0 50px 0 0;
    }

    .zb_krokow .irs--big .irs-min, .zb_krokow .irs--big .irs-max {
        top: 76px;
        font: 700 18px/18px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .line2 {
        padding: 0;
        flex-wrap: wrap;
    }

    .zb_krokow .krok_1 .line2 .oszczednosci,
    .zb_krokow .krok_1 .line2 .koszt_instalacji,
    .zb_krokow .krok_1 .line2 .okres_zwrotu {
        width: 30%;
    }

    .zb_krokow .krok_1 .line2 .kropka {
        margin: 60px 0 0;
    }

    .zb_krokow .krok_1 .line2 .tytul {
        font: 700 18px/20px 'Red Hat Display', sans-serif;
        margin: 0 0 10px;
    }

    .zb_krokow .krok_1 .line2 .wartosc {
        font: 700 38px/40px 'Red Hat Display', sans-serif;
        margin: 0 0 10px;
    }

    .zb_krokow .krok_1 .line2 .tekst {
        font: 400 14px/18px 'Red Hat Display', sans-serif;
        height: auto;
    }

    .zb_krokow .krok_1 .line2 .last_div {
        margin: 25px 0 0 0;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .zb_krokow .krok_1 .ktory_krok {
        margin: 0;
    }

    .zb_krokow .krok_2_left {
        width: 35%;
    }

    #form_calc {
        width: 60%;
    }

    .zb_krokow .krok_2 .line_1,
    .zb_krokow .krok_2 .line_2 {
        margin: 0 0 35px;
    }

    .zb_krokow .krok_2 .line_1 > div {
        width: 30%;
    }

    .zb_krokow .krok_2 .line_1 input {
        height: 46px;
    }

    .podstrona_kalkulator .zb_krokow .krok_2,
    .podstrona_kalkulator .zb_krokow .krok_3 {
        margin: 0 0 100px;
    }

    .zb_krokow .krok_3 .tekst_duzy {
        margin: 0 0 20px;
    }

    .zb_krokow .krok_3 .tekst_maly {
        font: 400 17px/22px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_3 .podzienkowanie .arrow_poziom {
        width: 24px;
        margin: 0 0 0 30px;
    }

    /* ---- strona główna - dlaczego my --- */
    #home_dlaczego {
        margin: 0 30px;
        padding: 40px 30px;
    }

    #home_dlaczego .left {
        width: 45%;
    }

    #home_dlaczego .left .tytul {
        font: 700 28px/32px 'Red Hat Display', sans-serif;
        margin: 0 0 30px;
    }

    #home_dlaczego .left .text {
        font: 400 16px/24px 'Red Hat Display', sans-serif;
        margin: 0 0 25px;
    }

    #home_dlaczego .right {
        margin: 0 0 0 50px;
    }

    #home_dlaczego .ikony > div,
    #home_dlaczego .ikony > a {
        width: 100px;
    }

    #home_dlaczego .ikony > div {
        margin: 0 30px 0 0;
    }

    #home_dlaczego .ikony .ico {
        width: 60px;
        margin: 0 0 25px;
    }

    #home_dlaczego .ikony .tekst {
        color: #ffffff;
        font: 700 17px/20px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
        transition: all 0.3s;
    }

    /* --- strona głowna - realizacje --- */
    #home_realizacje {
        margin: 0 30px;
        padding: 50px 0;
    }

    #home_realizacje .tytul .tekst {
        margin: 0;
    }

    #home_realizacje .tytul {
        padding: 0;
        margin: 0 0 25px;
    }

    .box_realizacja {
        width: 48%;
        height: auto;
    }

    .box_realizacja .dane_realizacja {
        top: 35px;
        width: 330px;
        height: 84px;
        padding: 15px 20px;
    }

    .box_realizacja .dane_realizacja .miasto,
    .realizacja .foto_realizacja .miasto {
        font: 700 16px/22px 'Red Hat Display', sans-serif;
        margin: 0 0 5px;
    }

    .box_realizacja .dane_realizacja .moc_instalcji,
    .realizacja .foto_realizacja .moc_instalcji {
        font: 400 16px/20px 'Red Hat Display', sans-serif;
    }

    .box_realizacja .dane_realizacja .wartosc,
    .realizacja .foto_realizacja .wartosc {
        font: 700 22px/22px 'Red Hat Display', sans-serif;
    }

    .box_realizacja .btn2 {
        margin: 0 0 0 25px;
    }

    /* --- footer --- */
    footer {
        margin: 0 40px;
    }

    .footer_left, .footer_right {
        width: 48%;
    }

    .footer_left {
        padding: 35px 0 15px;
    }

    .footer_left .logo2 {
        width: 350px;
        margin: 0 0 30px;
    }

    .link_kontakt.kontakt_adres,
    .link_kontakt.kontakt_telefon,
    .link_kontakt.kontakt_mail {
        margin: 0 0 20px;
    }

    .link_kontakt svg {
        width: 30px;
        margin: 0 12px 0 0;
    }

    .link_kontakt .tekst1 {
        font: 400 16px/24px 'Red Hat Display', sans-serif;
    }

    .link_kontakt .tekst2 {
        font: 700 17px/24px 'Red Hat Display', sans-serif;
    }

    .link_kontakt .tekst3 {
        font: 700 25px/25px 'Red Hat Display', sans-serif;
    }

    .footer_left > div {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer_right {
        padding: 47px 30px 50px;
    }

    .footer_right .header_social a,
    .footer_right .header_social a svg {
        width: 36px;
        height: 36px;
    }

    .footer_copyright {
        margin: 15px 0;
    }

    /* --- galeria na podstronie --- */
    #galeria {
        margin: 0 0 40px;
    }

    #galeria a,
    #galeria a:nth-of-type(4n) {
        width: 310px;
        height: 259px;
        margin: 0 15px 15px 0;
    }

    #galeria a:nth-of-type(3n) {
        margin-right: 0;
    }

    /* --- lista blog --- */
    .zb_blog .news {
        width: 48%;
        margin: 0 0 50px;
        align-items: flex-start;
    }

    .zb_blog .news:nth-last-of-type(-n + 2) {
        margin: 0 0 50px;
    }

    .zb_blog .news::before {
        display: none;
    }

    .zb_blog .news .news_foto {
        margin: 0 25px 0 0;
        width: 44%;
    }

    .zb_blog .news .news_tresc {
        padding: 0 0 30px;
    }

    .zb_blog .news .news_tytul {
        margin: 0 0 15px;
    }

    .zb_blog .news .news_zajawka {
        margin: 0;
    }

    /* --- kategorie --- */
    .box_kategoria {
        margin: 0 47px 50px 0;
        height: 180px;
    }

    .box_kategoria .tytul {
        top: 25px;
        padding: 0 30px;
        font: 700 20px/28px 'Red Hat Display', sans-serif;
        max-height: 84px;
    }

    /* --- podstrona realizacje --- */
    .zb_realizacji_podstrona {
        justify-content: space-between;
    }

    .zb_realizacji_podstrona .box_realizacja {
        width: 48%;
        height: auto;
        margin: 0 0 40px 0;
    }

    .realizacja .opis_realizacji {
        width: 45%;
    }

    .realizacja .foto_realizacja {
        position: relative;
        width: 52%;
        height: auto;
    }

    .realizacja .opis_realizacji .ico_calc {
        width: 50px;
        margin: 4px 15px 0 0;
    }

    .realizacja .link_kalkulator2 .line1 {
        font: 700 20px/25px 'Red Hat Display', sans-serif;
    }

    .realizacja .link_kalkulator2 .line2 {
        font: 400 17px/22px 'Red Hat Display', sans-serif;
    }

    .realizacja .foto_realizacja .dane_realizacja {
        top: 40px;
        padding: 15px 25px;
    }

    .nawigacja_realizacji {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 50px;
    }

    /* --- podstrona kontakt --- */
    .kontakt_cms .kontakt_left {
        margin: 0 40px 0 0;
        width: 38%;
    }

    .kontakt_cms .kontakt_left > a {
        margin: 0 0 20px;
    }

    .kontakt_cms .ico_fb,
    .kontakt_cms .ico_insta {
        width: 30px;
        margin: 0 15px 0 0;
    }

    .kontakt_mapa {
        width: calc(62% - 40px);
    }

    /* --- formularz kontaktowy --- */
    #formularz_kontaktowy {
        padding: 40px 0 0;
    }

    #formularz_kontaktowy h3 {
        margin: 0 0 40px;
    }

    #formularz_kontaktowy .form_text {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        padding: 0 0 15px;
        height: 35px;
    }

    input, textarea, select {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    #formularz_kontaktowy input,
    #formularz_kontaktowy select {
        height: 46px;
    }

    #formularz_kontaktowy .token div input {
        width: 120px;
    }

    #formularz_kontaktowy form > div {
        margin: 0 0 30px;
        width: 23%;
    }

    #formularz_kontaktowy .token div img {
        width: auto;
        height: 46px;
    }

    #formularz_kontaktowy textarea {
        height: 160px;
    }

    #formularz_kontaktowy .btn {
        padding: 20px 40px 20px 20px;
    }

    /* --- podstrona oferta --- */
    .zb_oferta {
        margin: 0 0 70px;
    }

    .zb_oferta .link_oferta .kolumna1 {
        width: 75px;
        height: 147px;
        margin: 0 25px 0 0;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 {
        font: 400 32px/36px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 span {
        font: 700 38px/38px 'Red Hat Display', sans-serif;
    }

}

@media only screen and (min-width: 600px) and (max-width: 1023px) {

    /* --- ustawienia ogółne --- */
    #content_podstrony {
        padding: 15px 0 0;
    }

    .container,
    .container2 {
        width: 100%;
        padding: 0 30px;
    }

    label {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        padding: 0 0 10px;
    }

    /* --- cms --- */
    .cms h1 {
        font: 700 36px/42px 'Red Hat Display', sans-serif;
        margin: 0 0 30px;
    }

    .cms h2 {
        font: 700 30px/36px 'Red Hat Display', sans-serif;
        margin: 0 0 30px;
    }

    .cms h3 {
        font: 700 24px/30px 'Red Hat Display', sans-serif;
    }

    .cms h4 {
        font: 700 20px/26px 'Red Hat Display', sans-serif;
    }

    .cms h5,
    .cms h6 {
        font: 700 16px/22px 'Red Hat Display', sans-serif;
        margin: 0 0 20px;
    }

    .cms p,
    .cms li {
        font: 400 16px/28px 'Red Hat Display', sans-serif;
    }

    .cms p {
        margin: 0 0 20px;
    }

    .cms > img,
    .cms p img {
        margin: 35px 0;
    }

    .cms ul {
        margin: 0 0 25px 15px;
    }

    .cms ol {
        margin: 0 0 25px 0;
    }

    .cms ol ul,
    .cms ol ol,
    .cms ul ul,
    .cms ul ol {
        margin: 5px 0 0 0;
    }

    .cms li {
        margin-bottom: 5px;
        padding-left: 15px;
    }

    .cms ul > li::before {
        top: 12px;
    }

    .cms ol > li {
        margin-left: 23px;
        padding-left: 5px;
    }

    .cms hr, hr {
        margin: 30px 0;
    }

    .cms table {
        margin: 0 0 30px 0;
    }

    .cms > table td, .cms > table th {
        padding: 15px 20px;
        border: 2px solid #ffffff;
    }

    .cms > table tbody {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    .cms > table thead th {
        border-bottom: 2px solid #fbb800;
        font: 700 17px/22px 'Red Hat Display', sans-serif;
    }

    /* --- buttony --- */
    .btn {
        font: 700 14px/15px 'Red Hat Display', sans-serif;
        padding: 13px 65px 13px 20px;
    }

    .btn .arrow_poziom {
        width: 20px;
    }

    .btn2 .kolko {
        margin: 0 25px 0 0;
        width: 34px;
        height: 34px;
    }

    .btn2 svg {
        width: 20px;
    }

    .btn_wroc .kolko {
        margin: 0 0 0 25px;
    }

    .btn_wroc:hover .kolko {
        margin: 0 20px 0 5px;
    }

    /* --- breadcrumps --- */
    #breadcrumps {
        margin: 0 0 20px;
    }

    #breadcrumps .home {
        width: 13px;
        height: 12px;
        margin: 2px 10px 0 0;
    }

    #breadcrumps .home .ico_home {
        width: 13px;
        height: auto;
    }

    #breadcrumps div a,
    #breadcrumps div .separator {
        margin: 0 5px 0 0;
    }

    #breadcrumps div a,
    #breadcrumps div .active,
    #breadcrumps div .separator {
        font: 400 12px/16px 'Red Hat Display', sans-serif;
    }

    /* --- pliki do pobrania --- */
    #pliki a {
        font: 700 16px/24px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    #pliki a .kolko {
        width: 30px;
        height: 30px;
        margin: -3px 15px 0 0;
    }

    #pliki a .ico_download {
        width: 15px;
    }

    /* --- paginacja --- */
    #paginacja {
        margin: 0 0 40px;
    }

    /* --- header --- */
    header {
        padding: 0 10px 0 30px;
        align-items: center;
    }

    header.fixed {
        position: fixed;
        background-color: rgba(13, 124, 185, 1);
    }

    header.home {
        padding-top: 0;
    }

    header .header_logo {
        margin: 0;
    }

    header .logo {
        width: 280px;
    }

    header nav {
        display: none;
    }

    /* --- hamburger --- */
    #hamburger {
        display: block;
    }

    #overlay {
        display: block;
    }

    /* --- banerek na podstronach --- */
    #wrapper_podstrona {
        height: 160px;
    }

    #wrapper_podstrona .header_kontakt {
        right: auto;
        left: 30px;
        bottom: 15px;
    }

    #wrapper_podstrona .header_kontakt.calc_kontakt {
        right: 30px;
        flex-direction: row;
    }

    #wrapper_podstrona .link_telefon {
        margin: 0 0 15px;
    }

    #wrapper_podstrona .link_kalkulator {
        padding: 10px 15px 5px 10px;
        bottom: -2px;
        right: 30px;
    }

    #wrapper_podstrona .link_kalkulator::before {
        top: -8px;
        left: -8px;
        width: 58px;
        height: 58px;
    }

    #wrapper_podstrona .link_kalkulator:hover::before {
        height: calc(100% + 16px);
    }

    #wrapper_podstrona .link_kalkulator .line1 {
        margin: 0 0 5px;
    }

    #wrapper_podstrona .link_kalkulator .ico_calc {
        width: 26px;
        margin: 0 22px 0 0;
    }

    #wrapper_podstrona .link_kalkulator .line1 .text {
        font: 400 13px/15px 'Red Hat Display', sans-serif;
    }

    #wrapper_podstrona .link_kalkulator .line2 {
        margin: -8px -29px 0 0;
    }

    #wrapper_podstrona .link_kalkulator .line2 .text {
        font: 700 12px/14px 'Red Hat Display', sans-serif;
        margin: 0 10px 0 0;
    }

    /* --- slider z banerami na stronie głównej --- */
    #slider_container .slider_box {
        padding: 30px;
        width: 65vw;
        left: 30px;
        bottom: 180px;
    }

    .slider_box .line1 {
        font: 400 32px/36px 'Red Hat Display', sans-serif;
        margin: 0 0 25px;
    }

    .slider_box .line2 {
        font: 400 20px/30px 'Red Hat Display', sans-serif;
        margin: 0 0 35px;
    }

    .todown {
        display: none;
    }

    .todown.mobile {
        display: block;
    }

    .todown .arrow_pion {
        margin: 0 0 0 5px;
    }

    .header_social {
        top: 110px;
        right: 30px;
    }

    #slider_container .slick-dots {
        top: 48%;
        right: 32px;
    }

    /* --- header kontakt --- */
    .header_kontakt {
        right: 50px;
        bottom: 130px;
    }

    .header_kontakt a svg {
        width: 20px;
        margin: 0 7px 0 0;
    }

    .header_kontakt .link_telefon {
        font: 700 17px/19px 'Red Hat Display', sans-serif;
    }

    .header_kontakt .link_mail {
        font: 700 16px/19px 'Red Hat Display', sans-serif;
    }

    #wrapper_podstrona .header_kontakt .link_mail {
        font: 700 15px/18px 'Red Hat Display', sans-serif;
    }

    #wrapper_podstrona .header_kontakt a svg {
        width: 19px;
        margin: 0 5px 0 0;
    }

    /* ---- link kalkulator --- */
    .link_kalkulator {
        bottom: 20px;
        right: 45px;
        padding: 10px 15px 10px 10px;
    }

    .link_kalkulator::before {
        top: -10px;
        left: -10px;
        width: 70px;
        height: 70px;
    }

    .link_kalkulator:hover::before {
        height: calc(100% + 20px);
    }

    .link_kalkulator::after {
        border: 2px solid #FFFFFF;
    }

    .link_kalkulator .ico_calc {
        width: 30px;
        margin: 0 30px 0 0;
    }

    .link_kalkulator .line1 {
        margin: 0;
    }

    .link_kalkulator .line1 .text {
        font: 400 16px/18px 'Red Hat Display', sans-serif;
    }

    .link_kalkulator .line2 {
        margin: 0 -29px 0 0;
    }

    .link_kalkulator .line2 .text {
        font: 700 13px/14px 'Red Hat Display', sans-serif;
        margin: 0 10px 0 0;
    }

    .link_kalkulator .line2 .kolko {
        width: 30px;
        height: 30px;
    }

    .link_kalkulator:hover .line2 .kolko {
        top: 22px;
    }

    .link_kalkulator .line2 .arrow_pion {
        width: 15px;
    }

    /* --- strona główna - sekcja 1 --- */
    #section1 {
        padding: 0 30px;
        flex-wrap: wrap;
    }

    #section1 .naglowek,
    #home_realizacje .tytul .tekst {
        margin: 0 0 30px;
        font: 700 26px/28px 'Red Hat Display', sans-serif;
    }

    #section1 .home_oferta .naglowek {
        margin: 0 0 40px;
    }

    #section1 .home_oferta {
        width: calc(100vw - 60px);
        padding: 40px 30px;
    }

    .link_oferta {
        margin: 0 0 40px 0;
        display: flex;
        justify-content: center;
    }

    .link_oferta .kolumna1 {
        width: 130px;
        height: 130px;
        margin: 0 30px 0 0;
    }

    .link_oferta .kolumna1 svg {
        width: 75px;
    }

    .link_oferta:hover .kolumna1 svg {
        left: 55px;
    }

    .link_oferta .kwadrat {
        width: 90px;
        height: 90px;
    }

    .link_oferta:hover .kwadrat {
        background-color: #0074b8;
        right: 40px;
    }

    .link_oferta .kolumna2 .line1 {
        font: 400 30px/32px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .link_oferta .kolumna2 .line1 span {
        font: 700 36px/38px 'Red Hat Display', sans-serif;
    }

    .link_oferta:hover .btn2 .kolko {
        margin: 0 10px 0 15px;
    }

    #section1 .home_news {
        padding: 40px 0 0;
    }

    #section1 .box_news {
        margin: 0 0 30px;
    }

    #section1 .box_news .news {
        width: 47%;
    }

    .news .news_foto {
        width: 100%;
        height: auto;
        margin: 0 0 20px;
    }

    .news .news_tytul {
        margin: 0 0 15px;
        font: 700 18px/24px 'Red Hat Display', sans-serif;
        max-height: 72px;
    }

    .news .news_zajawka {
        margin: 0 0 20px;
        font: 400 16px/22px 'Red Hat Display', sans-serif;
        max-height: 88px;
    }

    #section1 .btn2 {

    }

    /* --- strona główna - kalkulator --- */
    #home_kalkulator {
        padding: 25px 30px 35px;
        border-top: 2px solid #f1f1f1;
        margin: 20px 0 0;
    }

    #home_kalkulator.podstrona_kalkulator {
        padding: 0;
        border: none;
        margin: 0 0 20px;
    }

    .zb_krokow .ico_calc {
        width: 76px;
        margin: 0 20px 0 0;
    }

    .zb_krokow .krok_1 .line1 {
        flex-wrap: wrap;
    }

    .zb_krokow .krok_1 .line1_left {
        width: 100%;
    }

    .zb_krokow .krok_1 .naglowek {
        margin: 0 0 15px;
    }

    .zb_krokow .krok_1 .tekst_duzy,
    .zb_krokow .krok_2 .naglowek div,
    .zb_krokow .krok_3 .tekst_duzy,
    .zb_krokow .krok_1 .wielkosc_instalcji .wartosc {
        font: 700 25px/30px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .tekst_maly {
        font: 400 20px/24px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .podpis {
        font: 400 16px/20px 'Red Hat Display', sans-serif;
        margin: 0 25px 0 0;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji {
        justify-content: center;
        margin: 0 0 20px;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji br {
        display: none;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji .arrow_poziom {
        width: 25px;
        margin: 0 0 0 25px;
    }

    .zb_krokow .krok_1 .separator {
        margin: 20px 0;
    }

    .zb_krokow .krok_1 .suwak .podpis {
        width: 195px;
    }

    .zb_krokow .line1_right {
        width: 100%;
    }

    .zb_krokow .line1_right .range-slider {
        width: 420px;
        padding: 0 30px 0 0;
    }

    .zb_krokow .irs--big .irs-line,
    .zb_krokow .irs--big .irs-bar {
        top: 35px;
    }

    .zb_krokow .irs--big .irs-handle {
        top: 26px;
        width: 25px;
        height: 25px;
    }

    .zb_krokow .irs {
        font: 700 22px/22px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .irs--big .irs-single {
        top: 2px;
    }

    .zb_krokow .line1_right .suwak1 {
        margin: 0 0 10px;
    }

    .zb_krokow .irs--big {
        height: 70px;
    }

    .zb_krokow .suwak1 .irs--big .irs-single {
        padding: 0 20px 0 0;
    }

    .zb_krokow .suwak2 .irs--big .irs-single {
        padding: 0 50px 0 0;
    }

    .zb_krokow .irs--big .irs-min, .zb_krokow .irs--big .irs-max {
        top: 55px;
        font: 700 18px/18px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .line2 {
        padding: 0;
        flex-wrap: wrap;
    }

    .zb_krokow .krok_1 .line2 .oszczednosci,
    .zb_krokow .krok_1 .line2 .koszt_instalacji,
    .zb_krokow .krok_1 .line2 .okres_zwrotu {
        width: 32%;
    }

    .zb_krokow .krok_1 .line2 .kropka {
        margin: 37px 0 0;
        height: 8px;
        width: 8px;
    }

    .zb_krokow .krok_1 .line2 .tytul {
        font: 700 16px/18px 'Red Hat Display', sans-serif;
        margin: 0 0 5px;
        height: 18px;
    }

    .zb_krokow .krok_1 .line2 .wartosc {
        font: 700 32px/34px 'Red Hat Display', sans-serif;
        margin: 0 0 5px;
    }

    .zb_krokow .krok_1 .line2 .tekst {
        font: 400 13px/15px 'Red Hat Display', sans-serif;
        height: 60px;
    }

    .zb_krokow .krok_1 .line2 .last_div {
        margin: 25px 0 0 0;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .zb_krokow .krok_1 .ktory_krok {
        margin: 0;
    }

    .zb_krokow .krok_2 {
        flex-wrap: wrap;
    }

    .zb_krokow .krok_2_left {
        width: 100%;
        margin: 0 0 20px;
    }

    .zb_krokow .krok_2_left .btn_wroc {
        display: none;
    }

    #form_calc {
        width: 100%;
    }

    #form_calc .btn_wroc {
        display: inline-flex;
        margin: 15px 0 0;
    }

    .zb_krokow .krok_2 .line_1,
    .zb_krokow .krok_2 .line_2 {
        margin: 0 0 25px;
    }

    .zb_krokow .krok_2 .line_1 > div {
        width: 30%;
    }

    .zb_krokow .krok_2 .line_1 input {
        height: 46px;
    }

    .podstrona_kalkulator .zb_krokow .krok_2,
    .podstrona_kalkulator .zb_krokow .krok_3 {
        margin: 0 0 100px;
    }

    .zb_krokow .krok_3 .naglowek {
        margin: 0 0 40px;
    }

    .zb_krokow .krok_3 .tekst_duzy {
        margin: 0 0 15px;
    }

    .zb_krokow .krok_3 .tekst_maly {
        font: 400 17px/22px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_3 .podzienkowanie .arrow_poziom {
        width: 24px;
        margin: 0 0 -5px 20px;
    }

    /* ---- strona główna - dlaczego my --- */
    #home_dlaczego {
        margin: 0 30px;
        padding: 40px 30px;
        flex-wrap: wrap;
    }

    #home_dlaczego .left {
        width: 100%;
    }

    #home_dlaczego .left .tytul {
        font: 700 28px/32px 'Red Hat Display', sans-serif;
        margin: 0 0 10px;
    }

    #home_dlaczego .left .text {
        font: 400 16px/24px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    #home_dlaczego .right {
        margin: 40px 0 0 0;
        width: 100%;
    }

    #home_dlaczego .ikony {
        justify-content: space-between;
    }

    #home_dlaczego .ikony > div,
    #home_dlaczego .ikony > a {
        width: 23%;
    }

    #home_dlaczego .ikony > div {
        margin: 0;
    }

    #home_dlaczego .ikony .ico {
        width: 55px;
        margin: 0 0 15px;
    }

    #home_dlaczego .ikony .tekst {
        color: #ffffff;
        font: 700 15px/18px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
        transition: all 0.3s;
    }

    #home_dlaczego .btn3 .arrow_poziom {
        width: 16px;
        margin: 0 18px 0 0;
    }

    #home_dlaczego .ikony > a:hover .btn3 svg {
        margin: 0 8px 0 10px;
    }

    /* --- strona głowna - realizacje --- */
    #home_realizacje {
        margin: 0 30px;
        padding: 50px 0 35px;
    }

    #home_realizacje .tytul .tekst {
        margin: 0;
    }

    #home_realizacje .tytul {
        padding: 0;
        margin: 0 0 25px;
    }

    #home_realizacje .tytul .btn2 {
        display: none;
    }

    #home_realizacje > .btn2.mobile {
        display: flex;
        justify-content: center;
        margin: 25px 0 0;
    }

    .realizacja {
        justify-content: center;
        flex-wrap: wrap-reverse;
    }

    .box_realizacja {
        width: 48%;
        height: auto;
    }

    .box_realizacja .dane_realizacja {
        top: 25px;
        width: 235px;
        height: auto;
        padding: 10px;
    }

    .box_realizacja .dane_realizacja .miasto, .realizacja .foto_realizacja .miasto {
        font: 700 15px/18px 'Red Hat Display', sans-serif;
        margin: 0;
    }

    .box_realizacja .dane_realizacja .moc_instalcji,
    .realizacja .foto_realizacja .moc_instalcji {
        font: 400 15px/18px 'Red Hat Display', sans-serif;
        flex-wrap: wrap;
        justify-content: flex-end;
        text-align: right;
    }

    .box_realizacja .dane_realizacja .wartosc,
    .realizacja .foto_realizacja .wartosc {
        font: 700 18px/18px 'Red Hat Display', sans-serif;
        width: 100%;
    }

    .box_realizacja .btn2 {
        margin: 0 0 0 25px;
    }

    /* --- footer --- */
    footer {
        margin: 0 30px;
    }

    .footer_left, .footer_right {
        width: 100%;
    }

    .footer_left {
        padding: 30px 0;
    }

    .footer_left .logo2 {
        width: 350px;
        margin: 0 0 30px;
    }

    .link_kontakt.kontakt_adres,
    .link_kontakt.kontakt_telefon,
    .link_kontakt.kontakt_mail {
        margin: 0 0 20px;
    }

    .link_kontakt svg {
        width: 30px;
        margin: 0 12px 0 0;
    }

    .link_kontakt .tekst1 {
        font: 400 16px/24px 'Red Hat Display', sans-serif;
    }

    .link_kontakt .tekst2 {
        font: 700 17px/24px 'Red Hat Display', sans-serif;
    }

    .link_kontakt .tekst3 {
        font: 700 25px/25px 'Red Hat Display', sans-serif;
    }

    .footer_left > div {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer_right {
        padding: 35px 30px 30px;
    }

    .footer_right .link_kalkulator {
        margin: 0 0 30px;
    }

    .footer_right .header_social a,
    .footer_right .header_social a svg {
        width: 36px;
        height: 36px;
    }

    .footer_copyright {
        margin: 15px 0;
    }

    /* --- galeria na podstronie --- */
    #galeria {
        margin: 0 0 40px;
    }

    #galeria a,
    #galeria a:nth-of-type(4n) {
        width: 31%;
        height: auto;
        margin: 0 15px 15px 0;
    }

    #galeria a:nth-of-type(3n) {
        margin-right: 0;
    }

    #galeria a .ico_lupa {
        width: 50px;
    }

    /* --- lista blog --- */
    .zb_blog .news {
        width: 47%;
        margin: 0 0 40px;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .zb_blog .news:nth-last-of-type(-n + 2) {
        margin: 0 0 40px;
    }

    .zb_blog .news::before {
        display: none;
    }

    .zb_blog .news .news_foto {
        margin: 0 0 15px;
        width: 100%;
    }

    .zb_blog .news .news_tresc {
        padding: 0 0 30px;
    }

    .zb_blog .news .news_tytul {
        margin: 0 0 15px;
    }

    .zb_blog .news .news_zajawka {
        margin: 0;
    }

    /* --- kategorie --- */
    #kategorie {
        justify-content: space-between;
    }

    .box_kategoria {
        margin: 0 0 40px 0;
        height: 170px;
        width: 47%;
    }

    .box_kategoria .tytul {
        top: 20px;
        padding: 0 15px;
        font: 700 18px/24px 'Red Hat Display', sans-serif;
        max-height: 72px;
    }

    /* --- podstrona realizacje --- */
    .zb_realizacji_podstrona {
        justify-content: space-between;
        padding: 0 30px;
    }

    .zb_realizacji_podstrona .box_realizacja {
        width: 48%;
        height: auto;
        margin: 0 0 30px 0;
    }

    .zb_realizacji_podstrona .box_realizacja .dane_realizacja {
        top: 25px;
    }

    .realizacja .opis_realizacji {
        width: 100%;
    }

    .realizacja .foto_realizacja {
        position: relative;
        width: 100%;
        height: auto;
        max-width: 850px;
        margin: 0 0 20px;
    }

    .realizacja .opis_realizacji .ico_calc {
        width: 50px;
        margin: 4px 15px 0 0;
    }

    .realizacja .link_kalkulator2 .line1 {
        font: 700 20px/25px 'Red Hat Display', sans-serif;
    }

    .realizacja .link_kalkulator2 .line2 {
        font: 400 17px/22px 'Red Hat Display', sans-serif;
    }

    .realizacja .foto_realizacja .dane_realizacja {
        top: 30px;
        padding: 10px 20px;
        width: 200px;
    }

    .nawigacja_realizacji {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 35px;
    }

    .nawigacja_realizacji > a {
        font: 700 14px/20px 'Red Hat Display', sans-serif;
    }

    .nawigacja_realizacji .kolko {
        width: 30px;
        height: 30px;
    }

    .nawigacja_realizacji .prev .kolko {
        margin: 0 5px 0 0;
    }

    .nawigacja_realizacji .prev:hover .kolko {
        margin: 0 20px 0 -15px;
    }

    .nawigacja_realizacji .next .kolko {
        margin: 0 0 0 5px;
    }

    .nawigacja_realizacji .next:hover .kolko {
        margin: 0 -15px 0 20px;
    }

    .nawigacja_realizacji .kolko .arrow_poziom {
        width: 20px;
    }

    /* --- podstrona kontakt --- */
    .kontakt_cms .kontakt_left {
        margin: 0 0 10px;
        width: 100%;
        border: none;
    }

    .kontakt_cms .kontakt_left > a {
        margin: 0 0 20px;
    }

    .kontakt_cms .ico_fb,
    .kontakt_cms .ico_insta {
        width: 30px;
        margin: 0 15px 0 0;
    }

    .kontakt_mapa {
        width: 100%;
        height: 200px;
    }

    /* --- formularz kontaktowy --- */
    #formularz_kontaktowy {
        padding: 30px 0 0;
    }

    #formularz_kontaktowy h3 {
        margin: 0 0 30px;
    }

    #formularz_kontaktowy .container {
        padding: 0;
    }

    #formularz_kontaktowy .form_text {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        padding: 0 0 15px;
        height: 35px;
    }

    input, textarea, select {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    #formularz_kontaktowy input,
    #formularz_kontaktowy select {
        height: 46px;
    }

    #formularz_kontaktowy .formularz_kolumna1 {
        width: 100%;
        margin: 0 0 20px;
    }

    #formularz_kontaktowy .formularz_kolumna2 {
        width: 100%;
        display: flex;
        justify-content: space-between;
        margin: 0 0 10px;
    }

    #formularz_kontaktowy .token {
        margin: 0;
    }

    #formularz_kontaktowy .token div input {
        width: 120px;
    }

    #formularz_kontaktowy form > div {
        margin: 0 0 30px;
        width: 23%;
    }

    #formularz_kontaktowy .token div img {
        width: auto;
        height: 46px;
    }

    #formularz_kontaktowy textarea {
        height: 160px;
    }

    #formularz_kontaktowy .btn {
        padding: 15px 70px 15px 20px;
    }

    /* --- podstrona oferta --- */
    .zb_oferta {
        margin: 0 0 10px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .zb_oferta .link_oferta {
        margin: 0 0 30px;
        width: 100%;
    }

    .zb_oferta .link_oferta .kolumna1 {
        width: 75px;
        height: 147px;
        margin: 0 25px 0 0;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 {
        font: 400 32px/36px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 span {
        font: 700 38px/38px 'Red Hat Display', sans-serif;
    }


}

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

    /* --- ustawienia ogółne --- */
    #content_podstrony {
        padding: 15px 0 0;
    }

    .container,
    .container2 {
        width: 100%;
        padding: 0 20px;
    }

    label {
        font: 400 15px/18px 'Red Hat Display', sans-serif;
        padding: 0 0 8px;
    }

    /* --- cms --- */
    .cms h1 {
        font: 700 30px/34px 'Red Hat Display', sans-serif;
        margin: 0 0 30px;
    }

    .cms h2 {
        font: 700 25px/29px 'Red Hat Display', sans-serif;
        margin: 0 0 25px;
    }

    .cms h3 {
        font: 700 20px/24px 'Red Hat Display', sans-serif;
        margin: 0 0 25px;
    }

    .cms h4,
    .cms h5,
    .cms h6 {
        font: 700 16px/22px 'Red Hat Display', sans-serif;
        margin: 0 0 20px;
    }

    .cms p,
    .cms li {
        font: 400 15px/26px 'Red Hat Display', sans-serif;
    }

    .cms p {
        margin: 0 0 20px;
    }

    .cms > img,
    .cms p img {
        margin: 30px 0 !important;
        float: none !important;
    }

    .cms ul {
        margin: 0 0 25px 15px;
    }

    .cms ol {
        margin: 0 0 25px 0;
    }

    .cms ol ul,
    .cms ol ol,
    .cms ul ul,
    .cms ul ol {
        margin: 5px 0 0 0;
    }

    .cms li {
        margin-bottom: 5px;
        padding-left: 15px;
    }

    .cms ul > li::before {
        top: 11px;
    }

    .cms ol > li {
        margin-left: 23px;
        padding-left: 5px;
    }

    .cms hr, hr {
        margin: 25px 0;
    }

    .cms table {
        margin: 0 0 30px 0;
    }

    .cms > table td, .cms > table th {
        padding: 15px;
        border: 2px solid #ffffff;
    }

    .cms > table tbody {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    .cms > table thead th {
        border-bottom: 2px solid #fbb800;
        font: 700 16px/21px 'Red Hat Display', sans-serif;
    }

    /* --- buttony --- */
    .btn {
        font: 700 13px/14px 'Red Hat Display', sans-serif;
        padding: 13px 60px 13px 20px;
    }

    .btn .arrow_poziom {
        width: 18px;
        right: 28px;
    }

    .btn2 .kolko {
        margin: 0 20px 0 0;
        width: 30px;
        height: 30px;
    }

    .btn2:hover .kolko {
        margin: 0 5px 0 15px;
    }

    .btn2 svg {
        width: 18px;
    }

    .btn2 span {
        font: 700 15px/16px 'Red Hat Display', sans-serif;
    }

    .btn_wroc .kolko {
        margin: 0 0 0 20px;
    }

    .btn_wroc:hover .kolko {
        margin: 0 15px 0 5px;
    }

    .btn_news {
        margin: 10px 0 0;
    }

    /* --- breadcrumps --- */
    #breadcrumps {
        margin: 0 0 15px;
    }

    #breadcrumps .home {
        width: 12px;
        height: 11px;
        margin: 1px 8px 0 0;
    }

    #breadcrumps .home .ico_home {
        width: 12px;
        height: auto;
    }

    #breadcrumps div a,
    #breadcrumps div .separator {
        margin: 0 5px 0 0;
    }

    #breadcrumps div a,
    #breadcrumps div .active,
    #breadcrumps div .separator {
        font: 400 12px/15px 'Red Hat Display', sans-serif;
    }

    /* --- pliki do pobrania --- */
    #pliki a {
        font: 700 16px/24px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    #pliki a .kolko {
        width: 30px;
        height: 30px;
        margin: -3px 15px 0 0;
    }

    #pliki a .ico_download {
        width: 15px;
    }

    /* --- paginacja --- */
    #paginacja {
        margin: 0 0 30px;
        font: 400 15px/18px 'Red Hat Display', sans-serif;
    }

    #paginacja select {
        margin: 0 12px;
        font: 400 15px/15px 'Red Hat Display', sans-serif;
        height: 44px;
    }

    #paginacja .kolko {
        width: 30px;
        height: 30px;
    }

    #paginacja .kolko .arrow_poziom {
        width: 18px;
    }

    /* --- header --- */
    header {
        padding: 0 5px 0 20px;
        align-items: center;
    }

    header.fixed {
        position: fixed;
        background-color: rgba(13, 124, 185, 1);
    }

    header.home {
        padding-top: 0;
    }

    header .header_logo {
        margin: 0;
    }

    header .logo {
        width: 200px;
    }

    header nav {
        display: none;
    }

    /* --- hamburger --- */
    #hamburger {
        display: block;
    }

    .ham {
        width: 60px;
    }

    #overlay {
        display: block;
    }

    /* --- banerek na podstronach --- */
    #wrapper_podstrona {
        height: 145px;
        background: url(../grafika/slide1.jpg) center top / cover;
    }

    #wrapper_podstrona .header_kontakt {
        right: 20px;
        bottom: 10px;
    }

    #wrapper_podstrona .header_kontakt a svg {
        width: 21px;
        margin: 0;
    }

    #wrapper_podstrona .header_kontakt.calc_kontakt {
        right: 30px;
        flex-direction: row;
    }

    #wrapper_podstrona .link_telefon {
        margin: 0 0 15px;
    }

    #wrapper_podstrona .link_kalkulator {
        padding: 6px;
        bottom: -2px;
        right: auto;
        left: 20px;
    }

    #wrapper_podstrona .link_kalkulator::before {
        top: -5px;
        left: -5px;
        width: 42px;
        height: 44px;
    }

    #wrapper_podstrona .link_kalkulator:hover::before {
        height: calc(100% + 10px);
    }

    #wrapper_podstrona .link_kalkulator .line1 {
        margin: 0 0 5px;
    }

    #wrapper_podstrona .link_kalkulator .ico_calc {
        width: 24px;
        margin: 0 15px 0 0;
    }

    #wrapper_podstrona .link_kalkulator .line1 .text {
        font: 400 12px/14px 'Red Hat Display', sans-serif;
    }

    #wrapper_podstrona .link_kalkulator .line2 {
        margin: -8px -20px 0 0;
    }

    #wrapper_podstrona .link_kalkulator .line2 .text {
        font: 700 12px/14px 'Red Hat Display', sans-serif;
        margin: 0 10px 0 0;
    }

    /* --- slider z banerami na stronie głównej --- */
    #slider_container .slider_box {
        padding: 20px;
        width: 70vw;
        left: 20px;
        bottom: 150px;
    }

    .slider_box .line1 {
        font: 400 20px/25px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .slider_box .line2 {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    .todown {
        display: none;
    }

    .header_social {
        top: 80px;
        right: 20px;
        flex-direction: column;
    }

    .header_social a {
        width: 30px;
        height: 30px;
    }

    .header_social a:first-of-type {
        margin: 0 0 10px 0;
    }

    .header_social a svg {
        width: 30px;
    }

    #slider_container .slick-dots {
        top: 46%;
        right: 20px;
    }

    .slick-dots li {
        margin: 0 0 10px;
    }

    /* --- header kontakt --- */
    .header_kontakt {
        right: 20px;
        bottom: 130px;
        flex-direction: column;
    }

    .header_kontakt a svg {
        width: 25px;
        margin: 0;
    }

    .header_kontakt .link_telefon {
        margin: 0 0 15px;
    }

    .header_kontakt span {
        display: none;
    }

    /* ---- link kalkulator --- */
    .link_kalkulator {
        bottom: 20px;
        right: auto;
        padding: 8px;
        left: 18px;
    }

    .link_kalkulator::before {
        top: -8px;
        left: -8px;
        width: 58px;
        height: 58px;
    }

    .link_kalkulator:hover::before {
        height: calc(100% + 16px);
    }

    .link_kalkulator::after {
        border: 2px solid #FFFFFF;
    }

    .link_kalkulator .ico_calc {
        width: 26px;
        margin: 0 25px 0 0;
    }

    .link_kalkulator .line1 {
        margin: 0;
    }

    .link_kalkulator .line1 .text {
        font: 400 13px/16px 'Red Hat Display', sans-serif;
    }


    .link_kalkulator .line2 {
        margin: 0 -22px 0 0;
    }

    .link_kalkulator .line2 .text {
        font: 700 13px/14px 'Red Hat Display', sans-serif;
        margin: 0 10px 0 0;
    }

    .link_kalkulator .line2 .kolko {
        width: 30px;
        height: 30px;
    }

    .link_kalkulator:hover .line2 .kolko {
        top: 20px;
    }

    .link_kalkulator .line2 .arrow_pion {
        width: 14px;
    }

    /* --- strona główna - sekcja 1 --- */
    #section1 {
        padding: 20px 20px 0;
        flex-wrap: wrap;
    }

    #section1 .home_oferta {
        width: calc(100vw - 40px);
        padding: 30px 20px;
    }

    #section1 .naglowek,
    #home_realizacje .tytul .tekst {
        margin: 0 0 25px;
        font: 700 20px/24px 'Red Hat Display', sans-serif;
    }

    #section1 .home_oferta .naglowek {
        margin: 0 0 30px;
    }

    .link_oferta {
        margin: 0 0 30px 0;
        display: flex;
        justify-content: center;
    }

    .link_oferta .kolumna1 {
        width: 100px;
        height: 100px;
        margin: 0 20px 0 0;
    }

    .link_oferta .kolumna1 svg {
        width: 60px;
    }

    .link_oferta:hover .kolumna1 svg {
        left: 40px;
    }

    .link_oferta .kwadrat {
        width: 60px;
        height: 60px;
    }

    .link_oferta:hover .kwadrat {
        background-color: #0074b8;
        right: 40px;
    }

    .link_oferta .kolumna2 .line1 {
        font: 400 24px/28px 'Red Hat Display', sans-serif;
        margin: 0 0 10px;
    }

    .link_oferta .kolumna2 .line1 span {
        font: 700 26px/30px 'Red Hat Display', sans-serif;
    }

    .link_oferta:hover .btn2 .kolko {
        margin: 0 5px 0 15px;
    }

    #section1 .home_news {
        padding: 40px 0 0;
    }

    #section1 .box_news {
        margin: 0 0 30px;
        justify-content: center;
    }

    #section1 .box_news .news {
        width: 100%;
    }

    #section1 .box_news .news:first-of-type {
        margin: 0 0 30px;
    }

    .news .news_foto {
        width: 100%;
        height: auto;
        margin: 0 0 10px;
    }

    .news .news_foto img {
        height: auto;
    }

    .news .news_tytul {
        margin: 0 0 10px;
        font: 700 18px/24px 'Red Hat Display', sans-serif;
        max-height: 72px;
    }

    .news .news_zajawka {
        margin: 0 0 10px;
        font: 400 15px/22px 'Red Hat Display', sans-serif;
        max-height: 88px;
    }


    /* --- strona główna - kalkulator --- */
    #home_kalkulator {
        padding: 25px 20px 40px;
        border-top: 2px solid #f1f1f1;
        margin: 20px 0 0;
    }

    #home_kalkulator.podstrona_kalkulator {
        padding: 0;
        border: none;
        margin: 0 0 20px;
    }

    .zb_krokow .ico_calc {
        width: 55px;
        margin: 0 15px 0 0;
    }

    .zb_krokow .krok_1 .line1 {
        flex-wrap: wrap;
    }

    .zb_krokow .krok_1 .line1_left {
        width: 100%;
    }

    .zb_krokow .krok_1 .naglowek {
        margin: 0 0 15px;
    }

    .zb_krokow .krok_1 .tekst_duzy,
    .zb_krokow .krok_2 .naglowek div,
    .zb_krokow .krok_3 .tekst_duzy,
    .zb_krokow .krok_1 .wielkosc_instalcji .wartosc {
        font: 700 20px/25px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .tekst_maly {
        font: 400 18px/20px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_1 .podpis {
        font: 400 15px/19px 'Red Hat Display', sans-serif;
        margin: 0 15px 0 0;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji {
        justify-content: center;
        margin: 0 0 20px;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji br {
        display: none;
    }

    .zb_krokow .krok_1 .wielkosc_instalcji .arrow_poziom {
        display: none;
    }

    .zb_krokow .krok_1 .separator {
        margin: 20px 0;
    }

    .zb_krokow .line1_right .suwak {
        flex-wrap: wrap;
        justify-content: center;
    }

    .zb_krokow .line1_right .suwak1 {
        margin: 0 0 15px;
    }

    .zb_krokow .krok_1 .suwak .podpis {
        width: 100%;
        margin: 0 0 8px;
        text-align: center;
    }

    .zb_krokow .line1_right .suwak .podpis br {
        display: none;
    }

    .zb_krokow .line1_right {
        width: 100%;
    }

    .zb_krokow .line1_right .range-slider {
        width: 100%;
        padding: 0 30px 0 20px;
    }

    .zb_krokow .irs--big .irs-line,
    .zb_krokow .irs--big .irs-bar {
        top: 35px;
        height: 5px;
    }

    .zb_krokow .irs--big .irs-handle {
        top: 26px;
        width: 21px;
        height: 21px;
    }

    .zb_krokow .irs {
        font: 700 20px/20px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .irs--big .irs-single {
        top: 2px;
    }

    .zb_krokow .irs--big {
        height: 70px;
    }

    .zb_krokow .suwak1 .irs--big .irs-single {
        padding: 0 20px 0 0;
    }

    .zb_krokow .suwak2 .irs--big .irs-single {
        padding: 0 45px 0 0;
    }

    .zb_krokow .irs--big .irs-min, .zb_krokow .irs--big .irs-max {
        top: 55px;
        font: 700 16px/16px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .suwak1 .irs--big .irs-min,
    .zb_krokow .suwak1 .irs--big .irs-max {
        padding: 0 16px 0 0;
    }

    .zb_krokow .suwak2 .irs--big .irs-min,
    .zb_krokow .suwak2 .irs--big .irs-max {
        padding: 0 37px 0 0;
    }

    .zb_krokow .krok_1 .line2 {
        padding: 0;
        flex-wrap: wrap;
        justify-content: center;
    }

    .zb_krokow .krok_1 .line2 .oszczednosci,
    .zb_krokow .krok_1 .line2 .koszt_instalacji,
    .zb_krokow .krok_1 .line2 .okres_zwrotu {
        width: 100%;
    }

    .zb_krokow .krok_1 .line2 .kropka {
        display: none;
    }

    .zb_krokow .krok_1 .line2 .tytul {
        font: 700 16px/18px 'Red Hat Display', sans-serif;
        margin: 0 0 5px;
        height: 18px;
    }

    .zb_krokow .krok_1 .line2 .wartosc {
        font: 700 32px/34px 'Red Hat Display', sans-serif;
        margin: 0 0 5px;
    }

    .zb_krokow .krok_1 .line2 .tekst {
        font: 400 13px/15px 'Red Hat Display', sans-serif;
        height: auto;
        margin: 0 0 30px;
    }

    .zb_krokow .krok_1 .line2 .arrow_pion {
        display: none;
    }

    .zb_krokow .krok_1 .line2 .last_div {
        margin: 10px 0 0 0;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .zb_krokow .krok_1 .ktory_krok,
    .zb_krokow .krok_2 .ktory_krok {
        margin: 0 0 15px;
    }

    .zb_krokow .krok_2 {
        flex-wrap: wrap;
    }

    .zb_krokow .krok_2_left {
        width: 100%;
        margin: 0 0 20px;
    }

    .zb_krokow .krok_2_left .btn_wroc {
        display: none;
    }

    #form_calc {
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    #form_calc .btn_wroc {
        display: inline-flex;
        margin: 15px 0 0;
        order: 4;
    }

    .zb_krokow .krok_2 .line_1 {
        order: 1;
        margin: 0;
    }

    .zb_krokow .krok_2 .line_3 {
        order: 2;
        margin: 0 0 15px;
    }

    .zb_krokow .krok_2 .line_2 {
        flex-direction: column-reverse;
        order: 3;
        margin: 0 0 15px;
    }

    .zb_krokow .krok_2 .line_1 > div {
        width: 100%;
        margin: 0 0 20px;
    }

    .zb_krokow .krok_2 .line_1 input {
        height: 44px;
    }

    .podstrona_kalkulator .zb_krokow .krok_2,
    .podstrona_kalkulator .zb_krokow .krok_3 {
        margin: 0 0 20px;
    }

    .zb_krokow .krok_3 .naglowek {
        margin: 0 0 30px;
    }

    .zb_krokow .krok_3 .tekst_duzy {
        margin: 0 0 15px;
    }

    .zb_krokow .krok_3 .tekst_maly {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    .zb_krokow .krok_3 .podzienkowanie .arrow_poziom {
        display: none;
    }

    /* ---- strona główna - dlaczego my --- */
    #home_dlaczego {
        margin: 0 20px;
        padding: 30px 20px;
        flex-wrap: wrap;
    }

    #home_dlaczego .left {
        width: 100%;
    }

    #home_dlaczego .left .tytul {
        font: 700 26px/30px 'Red Hat Display', sans-serif;
        margin: 0 0 10px;
    }

    #home_dlaczego .left .text {
        font: 400 15px/22px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
    }

    #home_dlaczego .right {
        margin: 45px 0 0 0;
        width: 100%;
    }

    #home_dlaczego .ikony {
        justify-content: space-between;
        flex-wrap: wrap;
    }

    #home_dlaczego .ikony > div,
    #home_dlaczego .ikony > a {
        width: 46%;
    }

    #home_dlaczego .ikony > div:nth-of-type(-n + 2) {
        margin: 0 0 10px;
    }

    #home_dlaczego .ikony > div {
        margin: 0;
    }

    #home_dlaczego .ikony .ico {
        width: 55px;
        margin: 0 0 15px;
    }

    #home_dlaczego .ikony .tekst {
        color: #ffffff;
        font: 700 15px/18px 'Red Hat Display', sans-serif;
        margin: 0 0 15px;
        transition: all 0.3s;
    }

    #home_dlaczego .btn3 .arrow_poziom {
        width: 16px;
        margin: 0 18px 0 0;
    }

    #home_dlaczego .ikony > a:hover .btn3 svg {
        margin: 0 8px 0 10px;
    }

    /* --- strona głowna - realizacje --- */
    #home_realizacje {
        margin: 0 20px;
        padding: 40px 0 30px;
    }

    #home_realizacje .tytul .tekst {
        margin: 0;
    }

    #home_realizacje .tytul {
        padding: 0;
        margin: 0 0 20px;
    }

    #home_realizacje .tytul .btn2 {
        display: none;
    }

    #home_realizacje .zb_realizacji {
        flex-wrap: wrap;
    }

    #home_realizacje > .btn2.mobile {
        display: flex;
        justify-content: center;
        margin: 25px 0 0;
    }

    #home_realizacje .box_realizacja:first-of-type {
        margin: 0 0 20px;
    }

    .realizacja {
        justify-content: center;
        flex-wrap: wrap-reverse;
    }

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

    .box_realizacja .dane_realizacja {
        top: 25px;
        width: 235px;
        height: auto;
        padding: 10px;
    }

    .box_realizacja .dane_realizacja .miasto, .realizacja .foto_realizacja .miasto {
        font: 700 15px/18px 'Red Hat Display', sans-serif;
        margin: 0;
    }

    .box_realizacja .dane_realizacja .moc_instalcji,
    .realizacja .foto_realizacja .moc_instalcji {
        font: 400 15px/18px 'Red Hat Display', sans-serif;
        flex-wrap: wrap;
        justify-content: flex-end;
        text-align: right;
    }

    .box_realizacja .dane_realizacja .wartosc,
    .realizacja .foto_realizacja .wartosc {
        font: 700 18px/18px 'Red Hat Display', sans-serif;
        width: 100%;
    }

    .box_realizacja .btn2 {
        margin: 0 0 0 25px;
    }

    /* --- footer --- */
    footer {
        margin: 0 20px;
        padding: 25px 0 0;
    }

    .footer_left, .footer_right {
        width: 100%;
    }

    .footer_left {
        padding: 30px 0;
        border-top: 4px solid #f1f1f1;
    }

    .footer_left .logo2 {
        width: 200px;
        margin: 0 0 20px;
    }

    .link_kontakt.kontakt_adres,
    .link_kontakt.kontakt_telefon,
    .link_kontakt.kontakt_mail {
        margin: 0 0 15px;
    }

    .link_kontakt svg {
        width: 25px;
        margin: 0 10px 0 0;
    }

    .link_kontakt .tekst1 {
        font: 400 16px/22px 'Red Hat Display', sans-serif;
    }

    .link_kontakt .tekst2 {
        font: 700 15px/22px 'Red Hat Display', sans-serif;
    }

    .link_kontakt .tekst3 {
        font: 700 22px/22px 'Red Hat Display', sans-serif;
    }

    .footer_left > div {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer_right {
        padding: 30px 20px;
    }

    .footer_right .link_kalkulator {
        margin: 0 0 30px;
    }

    .footer_right .link_kalkulator::before {
        height: 66px;
    }

    .footer_right .link_kalkulator:hover::before {
        height: calc(100% + 16px);
    }

    .footer_right .header_social {
        flex-direction: row;
    }

    .footer_right .header_social a,
    .footer_right .header_social a svg {
        width: 30px;
        height: 30px;
    }

    .footer_copyright {
        margin: 10px 0;
    }

    /* --- galeria na podstronie --- */
    #galeria {
        margin: 0 0 10px;
    }

    #galeria .container2 {
        justify-content: space-between;
    }

    #galeria a,
    #galeria a:nth-of-type(4n) {
        width: 48%;
        height: auto;
        margin: 0 0 15px;
    }

    #galeria a:nth-of-type(3n) {
        margin-right: 0;
    }

    #galeria a .ico_lupa {
        width: 40px;
    }

    /* --- lista blog --- */
    .zb_blog .news {
        width: 100%;
        margin: 0 0 35px;
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .zb_blog .news:nth-last-of-type(-n + 2) {
        margin: 0 0 40px;
    }

    .zb_blog .news::before {
        display: none;
    }

    .zb_blog .news .news_foto {
        margin: 0 0 15px;
        width: 100%;
    }

    .zb_blog .news .news_tresc {
        padding: 0 0 30px;
    }

    .zb_blog .news .news_tytul {
        margin: 0 0 15px;
    }

    .zb_blog .news .news_zajawka {
        margin: 0;
    }

    /* --- kategorie --- */

    .box_kategoria {
        margin: 0 0 40px;
        height: auto;
        width: 100%;
        max-width: 360px;
    }

    .box_kategoria:nth-last-of-type(-n+3) {
         margin-bottom: 40px;
    }

    .box_kategoria .tytul {
        display: block;
        position: relative;
        top: 0;
        padding: 15px 15px 50px;
        font: 700 16px/22px 'Red Hat Display', sans-serif;
        max-height: none;
    }

    .box_kategoria .kolko {
        width: 30px;
        height: 30px;
    }

    .box_kategoria:hover .kolko {
        bottom: 25px;
    }

    .box_kategoria .arrow_pion {
        width: 14px;
    }

    /* --- podstrona realizacje --- */
    .zb_realizacji_podstrona {
        justify-content: center;
        padding: 0 20px;
    }

    .zb_realizacji_podstrona .box_realizacja {
        width: 100%;
        height: auto;
        margin: 0 0 30px 0;
    }

    .zb_realizacji_podstrona .box_realizacja .dane_realizacja {
        top: 25px;
    }

    .realizacja .opis_realizacji {
        width: 100%;
    }

    .realizacja .foto_realizacja {
        position: relative;
        width: 100%;
        height: auto;
        max-width: 850px;
        margin: 0 0 20px;
    }

    .realizacja .opis_realizacji .ico_calc {
        width: 46px;
        margin: 4px 15px 0 0;
    }

    .realizacja .link_kalkulator2 .line1 {
        font: 700 18px/22px 'Red Hat Display', sans-serif;
    }

    .realizacja .link_kalkulator2 .line2 {
        font: 400 16px/20px 'Red Hat Display', sans-serif;
    }

    .realizacja .foto_realizacja .dane_realizacja {
        top: 30px;
        padding: 10px 20px;
        width: 200px;
    }

    .nawigacja_realizacji {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 0 35px;
    }

    .nawigacja_realizacji > a {
        font: 700 13px/16px 'Red Hat Display', sans-serif;
    }

    .nawigacja_realizacji .kolko {
        width: 30px;
        height: 30px;
    }

    .nawigacja_realizacji .prev .kolko {
        margin: 0 5px 0 0;
    }

    .nawigacja_realizacji .prev:hover .kolko {
        margin: 0 20px 0 -15px;
    }

    .nawigacja_realizacji .next .kolko {
        margin: 0 0 0 5px;
    }

    .nawigacja_realizacji .next:hover .kolko {
        margin: 0 -15px 0 20px;
    }

    .nawigacja_realizacji .kolko .arrow_poziom {
        width: 20px;
    }

    /* --- podstrona kontakt --- */
    .kontakt_cms .kontakt_left {
        margin: 0 0 10px;
        width: 100%;
        border: none;
    }

    .kontakt_cms .kontakt_left > a {
        margin: 0 0 15px;
    }

    .kontakt_cms .ico_fb,
    .kontakt_cms .ico_insta {
        width: 28px;
        margin: 0 10px 0 0;
    }

    .kontakt_cms .kontakt_fb,
    .kontakt_cms .kontakt_insta {
        font: 700 15px/20px 'Red Hat Display', sans-serif;
    }

    .kontakt_mapa {
        width: 100%;
        height: 200px;
    }

    /* --- formularz kontaktowy --- */
    #formularz_kontaktowy {
        padding: 30px 0 0;
    }

    #formularz_kontaktowy h3 {
        margin: 0 0 30px;
    }

    #formularz_kontaktowy .container {
        padding: 0;
    }

    #formularz_kontaktowy .form_text {
        font: 400 15px/18px 'Red Hat Display', sans-serif;
        padding: 0 0 10px;
        height: 28px;
    }

    input, textarea, select {
        font: 400 15px/20px 'Red Hat Display', sans-serif;
    }

    #formularz_kontaktowy input,
    #formularz_kontaktowy select {
        height: 44px;
    }

    #formularz_kontaktowy .formularz_kolumna1 {
        width: 100%;
        margin: 0 0 20px;
    }

    #formularz_kontaktowy .formularz_kolumna2 {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        margin: 0 0 15px;
        flex-direction: column;
        align-items: center;
    }

    #formularz_kontaktowy .token {
        margin: 0 0 15px;
    }

    #formularz_kontaktowy .token div input {
        width: 80px;
    }

    #formularz_kontaktowy form > div {
        margin: 0 0 20px;
        width: 100%;
    }

    #formularz_kontaktowy .token div img {
        width: auto;
        height: 44px;
    }

    #formularz_kontaktowy textarea {
        height: 150px;
    }

    #formularz_kontaktowy .zgoda input {
        width: 18px;
        height: 18px;
        margin: 3px 10px 0 0;
    }

    #formularz_kontaktowy .zgoda label {
        padding: 0;
    }

    #formularz_kontaktowy .form_text_small {
        font: 400 13px/17px 'Red Hat Display', sans-serif;
    }

    #formularz_kontaktowy .button .form_text {
        height: 35px;
    }

    #formularz_kontaktowy .btn {
        padding: 15px 70px 15px 20px;
    }

    /* --- podstrona oferta --- */
    .zb_oferta {
        margin: 0 0 10px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .zb_oferta .link_oferta {
        margin: 0 0 30px;
        width: 100%;
        display: inline-flex;
    }

    .zb_oferta .link_oferta .kolumna1 {
        width: 60px;
        height: 120px;
        margin: 0 25px 0 0;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 {
        font: 400 26px/30px 'Red Hat Display', sans-serif;
        margin: 0 0 10px;
    }

    .zb_oferta .link_oferta .kolumna2 .line1 span {
        font: 700 30px/34px 'Red Hat Display', sans-serif;
    }


}