@font-face {
    font-family: 'Absolute-Beauty-Bold';
    src: url('fonts/Absolute_Beauty_Script_Bold.eot');
    /* IE9 Compat Modes */
    src: url('fonts/Absolute_Beauty_Script_Bold?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('fonts/Absolute_Beauty_Script_Bold.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('fonts/Absolute_Beauty_Script_Bold.woff') format('woff'),
        /* Pretty Modern Browsers */
        url('fonts/Absolute_Beauty_Script_Bold.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('fonts/Absolute_Beauty_Script_Bold.svg#svgFontName') format('svg');
    /* Legacy iOS */
    font-weight: 600;
}


html,
body {
    margin: 0;
    padding: 0;
    position: relative;
    height: 100%;

    --font-primary: 'Montserrat', sans-serif;
    --font-secondary: 'Roboto', sans-serif;
    --font-sherif: 'Playfair Display', serif;
    --font-handwritten: 'Absolute-Beauty-Bold';
    --color-warmblack: rgba(6, 0, 9, 0.9);
    --color-darkblue: #202766;
    --color-darkgray: gray;
    --color-green: #0e9d8b;
    --color-offwhite: #dedee4;
    --color-white: #fff;
    --side-contact-light: #fff;
}

@media (min-width: 10px) {
    body {
        --dyna-padding: 12px;
    }

    .order-6 {
        order: 6;
    }

    .order-7 {
        order: 7;
    }

    .order-8 {
        order: 8;
    }

    .order-9 {
        order: 9;
    }

    .order-10 {
        order: 10;
    }

    .order-11 {
        order: 11;
    }

    .order-12 {
        order: 12;
    }

    .order-13 {
        order: 13;
    }

    .order-14 {
        order: 14;
    }

    .order-15 {
        order: 15;
    }

    .order-16 {
        order: 16;
    }
}

@media (min-width: 576px) {
    body {
        --dyna-padding: calc((100vw - 540px)/2)
    }

    .order-sm-6 {
        order: 6;
    }

    .order-sm-7 {
        order: 7;
    }

    .order-sm-8 {
        order: 8;
    }

    .order-sm-9 {
        order: 9;
    }

    .order-sm-10 {
        order: 10;
    }

    .order-sm-11 {
        order: 11;
    }

    .order-sm-12 {
        order: 12;
    }

    .order-sm-13 {
        order: 13;
    }

    .order-sm-14 {
        order: 14;
    }

    .order-sm-15 {
        order: 15;
    }

    .order-sm-16 {
        order: 16;
    }
}


@media (min-width: 768px) {
    body {
        --dyna-padding: calc((100vw - 720px)/2)
    }

    .order-md-6 {
        order: 6;
    }

    .order-md-7 {
        order: 7;
    }

    .order-md-8 {
        order: 8;
    }

    .order-md-9 {
        order: 9;
    }

    .order-md-10 {
        order: 10;
    }

    .order-md-11 {
        order: 11;
    }

    .order-md-12 {
        order: 12;
    }

    .order-md-13 {
        order: 13;
    }

    .order-md-14 {
        order: 14;
    }

    .order-md-15 {
        order: 15;
    }

    .order-md-16 {
        order: 16;
    }

}


@media (min-width: 992px) {
    body {
        --dyna-padding: calc((100vw - 960px)/2)
    }

    .order-lg-6 {
        order: 6;
    }

    .order-lg-7 {
        order: 7;
    }

    .order-lg-8 {
        order: 8;
    }

    .order-lg-9 {
        order: 9;
    }

    .order-lg-10 {
        order: 10;
    }

    .order-lg-11 {
        order: 11;
    }

    .order-lg-12 {
        order: 12;
    }

    .order-lg-13 {
        order: 13;
    }

    .order-lg-14 {
        order: 14;
    }

    .order-lg-15 {
        order: 15;
    }

    .order-lg-16 {
        order: 16;
    }

    .content_wrapper.flex-lg-row-reverse {
        padding-right: 10px !important;
        padding-left: 0 !important;
    }

    .content_wrapper.flex-lg-row-reverse p {
        text-align: right;
    }
}

@media (min-width: 1200px) {
    body {
        --dyna-padding: calc((100vw - 1140px)/2)
    }

    .order-xl-6 {
        order: 6;
    }

    .order-xl-7 {
        order: 7;
    }

    .order-xl-8 {
        order: 8;
    }

    .order-xl-9 {
        order: 9;
    }

    .order-xl-10 {
        order: 10;
    }

    .order-xl-11 {
        order: 11;
    }

    .order-xl-12 {
        order: 12;
    }

    .order-xl-13 {
        order: 13;
    }

    .order-xl-14 {
        order: 14;
    }

    .order-xl-15 {
        order: 15;
    }

    .order-xl-16 {
        order: 16;
    }
}

@media (min-width: 1400px) {
    body {
        --dyna-padding: calc((100vw - 1320px)/2)
    }

    .order-xxl-6 {
        order: 6;
    }

    .order-xxl-7 {
        order: 7;
    }

    .order-xxl-8 {
        order: 8;
    }

    .order-xxl-9 {
        order: 9;
    }

    .order-xxl-10 {
        order: 10;
    }

    .order-xxl-11 {
        order: 11;
    }

    .order-xxl-12 {
        order: 12;
    }

    .order-xxl-13 {
        order: 13;
    }

    .order-xxl-14 {
        order: 14;
    }

    .order-xxl-15 {
        order: 15;
    }

    .order-xxl-16 {
        order: 16;
    }
}

.left-dyna-padding {
    padding-left: var(--dyna-padding) !important;
}

.right-dyna-padding {
    padding-right: var(--dyna-padding) !important;
}

@media (max-width: 1199px) {
    .right-dyna-padding-to-xl {
        padding-right: var(--dyna-padding) !important;
    }

    .left-dyna-padding-to-xl {
        padding-left: var(--dyna-padding) !important;
    }
}

@media (min-width: 1200px) {
    #segmenty_page .left-dyna-padding-to-xl {
        padding-left: 80px !important;
    }
}

.text-offwhite {
    color: var(--color-offwhite);
}

.text-white {
    color: var(--color-white);
}

.text-blue {
    color: var(--color-darkblue)
}

.text-handwritten {
    font-family: var(--font-handwritten);
    text-transform: lowercase;
    font-size: 200%;
}

.showme {
    border: 2px dotted red;
}

/* NAVBAR */
header {
    z-index: 995;
}

header .navbar {
    background-color: transparent;
    z-index: 996;
    padding-top: 35px;
    padding-bottom: 35px;
    position: fixed;
    width: 100%;
    transition: all ease 0.6s;
}

.nav-link {
    font-family: var(--font-primary);
    font-weight: 400;
    text-transform: uppercase;
    font-size: 0.8rem;
    font-weight: 600;
    color: #fff;
    display: inline-block;
    position: relative;
}

header .nabvar .nav-link.activated {
    font-weight: 600;
    color: var(--color-warmblack);
}

.nav-link:hover {
    color: #fff;
}

@media (min-width: 1200px) {

    ul.navbar-nav li,
    ul.navbar-nav:hover li:hover {
        will-change: opacity, filter;
        opacity: 1;
        filter: none;
        transition: opacity .2s ease-in-out;
    }

    ul.navbar-nav:hover li {
        opacity: 0.5;
        transition: all .2s ease-in-out;
    }
}

@media (max-width:767px) {
    nav {
        --nav-img-height: 20px;
        --nav-scale: 0.85;
    }
}

@media (min-width:768px) {
    nav {
        --nav-img-height: 20px;
        --nav-scale: 0.85;
    }
}

.navbar-brand img {
    height: var(--nav-img-height);
    transition: all ease 0.6s;
    vertical-align: baseline;
}

nav.navbar.animate {
    transition: all ease 0.6s;
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: rgba(0, 14, 31, 0.78);
}

@media (max-width: 1199px) {

    .black-back {
        background-color: rgba(0, 14, 31, 0.78) !important;
    }
}

.navbar.animate img {
    transition: all ease 0.6s;
    height: calc(var(--nav-img-height)*var(--nav-scale));
}

nav .navbar-toggler,
nav .navbar-toggler:focus,
nav .navbar-toggler:active,
nav .navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
    border: none;
}



/* -------- SIDE CONTACT -------- */

.side-contact {
    display: block;
    width: 200px;
    height: 47px;
    position: fixed;
    right: 0;
    z-index: 994;
    transition: width .5s ease-in-out;
}

#side-contact-insta {
    top: 152px;
}

#side-contact-phone {
    top: 200px;
}

#side-contact-fb {
    top: 248px;
}

#side-contact-mail {
    top: 296px;
}

.away {
    width: 47px;
    transition: width .5s ease-in-out;
}

@media (max-width: 991px) {
    #side-contact-phone {
        transform: scale(0.8) translate(5px, -50px);

    }

    #side-contact-fb {
        transform: scale(0.8) translate(5px, -62px);

    }

    #side-contact-mail {
        transform: scale(0.8) translate(5px, -74px);

    }

}

.side-contact a {
    width: 100%;
    background-color: rgba(0, 0, 0, 0.1);
    display: flex;
    height: 47px;
}

.side-contact.light a {
    width: 100%;
    border-bottom: 1px solid #fff;
    display: flex;
    height: 47px;
}

.side-contact.away a {
    border-bottom-color: transparent;
}


.side-contact a>span {
    width: 47px;
    min-width: 47px;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    justify-items: center;
    transition: background-color .3s ease-in-out;
}

.side-contact.away a>span {
    background: var(--color-warmblack);
    transition: background-color .3s ease-in-out;
}

.side-contact a span:last-of-type {
    width: 100%;
    max-width: 233px;
    height: 100%;
    background: transparent;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
    justify-content: left;
    justify-items: left;
    font-family: var(--font-primary);
    font-size: 14px;
    color: var(--side-contact-light);
    opacity: 1;
    transition: opacity .5s ease-in .3s;
}

.side-contact.light a span:last-of-type {
    color: #fff;
}


.side-contact.away a span:last-of-type {
    opacity: 0;
    transition: opacity .2s ease-out;
}

.side-contact a>span i {
    color: var(--side-contact-light);
    will-change: transform;
    transition: transform .4s ease-in-out;
}

.side-contact.light a>span i {
    color: #fff;
}

.side-contact:hover a>span i {
    color: #fff;
    transform: scale(1.4321323);
    transition: transform .4s ease-in-out;
}

.side-contact.away a>span i {
    color: #fff;
}

.side-contact.away:hover a>span i {
    color: var(--side-contact-light);
    ;
}

.side-contact a {
    font-family: var(--font-primary);
    font-size: 14px;
    color: var(--side-contact-light);
    text-decoration: none;
}


header .dark:not(.animate, .black-back) {
    background-color: rgba(0, 14, 31, 0.75);
}


#side-contact-wrapper.reverse div:not(.away) * {
    color: var(--color-warmblack);
    border-color: var(--color-warmblack);
}


/* -------- SIDE CONTACT END -------- */

section#hero {
    height: 100vh;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-items: center;
    justify-content: center;
    position: relative;
    flex-wrap: wrap;
}

#hero svg path {
    fill: var(--color-green);
}

#hero svg {
    margin: 0 15px 0 0;
    height: 60px;
    aspect-ratio: 1;
}

.color_overlay {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 0;
    left: 0;

}

#hero .hero_title h1 {
    margin: 0 !important;
}

#hero .hero_title {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767px) {

    #hero svg {
        margin: 0 8px 0 0;
        height: 45px;
        aspect-ratio: 1;
    }

    #hero .hero_title {
        flex-direction: row;
        text-align: center;
    }

    #hero .hero_title h1 {
        font-size: 1.6rem;
    }

    #hero .hero_title img {
        margin: 0 0 20px 0;
        height: 50px;
    }

    #hero .hero_title .text-handwritten {
        font-size: 5rem;
        padding: 5px 0 0 10px;
    }
}


@media (min-width: 768px) and (max-width:1399px) {
    #hero .hero_title {
        flex-direction: row;
    }

    #hero .hero_title h1 {
        font-size: 1.9rem;
    }

    #hero .hero_title img {
        margin: 0 15px 0 0;
        height: 50px;
    }

    #hero .hero_title .text-handwritten {
        font-size: 6rem;
        padding: 5px 0 0 10px;
    }
}


@media (min-width: 1400px) {
    #hero .hero_title {
        flex-direction: row;
    }

    #hero .hero_title h1 {
        font-size: 2.5rem;
    }

    #hero .hero_title img {
        margin: 0 15px 0 0;
        height: 60px;
    }

    #hero .hero_title .text-handwritten {
        font-size: 6rem;
        padding: 5px 0 0 10px;
    }
}


#hero .hero_title .text-handwritten {
    color: #fff;
}

#hero .hero_title h1 {
    width: fit-content;
}

section#driven_by_nature,
section#work_with_passion {
    background-color: #f5f5f5;
}

section#driven_by_nature .box_hero,
section#work_with_passion .box_hero {
    background: #f5f5f5;
    display: flex;
    flex-wrap: nowrap;

}

section#driven_by_nature .box_hero_2 {
    background-image: url(img/driven-by-nature.jpg);
    background-color: #f5f5f5;
    background-repeat: no-repeat;
}

section#work_with_passion .box_hero_2 {
    background-image: url(img/work-with-passion.jpg);
    background-color: #f5f5f5;
    background-repeat: no-repeat;
}

@media (max-width: 1199px) {

    #driven_by_nature,
    #work_with_passion {
        padding-bottom: 5vw;
        padding-top: 5vw;
    }

    #driven_by_nature .vertical_wrapper,
    #work_with_passion .vertical_wrapper {
        padding-left: 12px;
    }

    section#driven_by_nature .box_hero_2,
    #work_with_passion .box_hero_2 {
        height: unset;
        width: 100%;
        background-size: contain;
        aspect-ratio: 2;
        background-position: 24px center;
    }

    section#driven_by_nature .box_hero,
    #work_with_passion .box_hero {
        height: unset;
    }
}

@media (min-width: 1200px) {

    #driven_by_nature,
    #work_with_passion {
        padding-bottom: 5vw;
        padding-top: 5vw;
    }

    section#driven_by_nature .box_hero_2,
    #work_with_passion .box_hero_2 {
        background-size: cover;
    }
}

main {
    overflow-x: hidden;
}

#hero .bg-video {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-items: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    overflow: hidden;
}

#hero .bg-video video {
    height: 100%;
    width: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
    object-position: center;

}




h1 {
    font-family: var(--font-primary);
    font-size: 3rem;
    height: fit-content;
    width: 100%;
    color: var(--color-darkblue);
    font-weight: 600;
}

h1.smaller {
    font-size: 2.2rem;
}

h2 {
    font-family: var(--font-sherif);
    color: var(--color-darkblue);
    font-size: 2.2rem;
    line-height: 130%;
    width: 100%;
    height: fit-content;
}

h2.smaller {
    font-size: 1.8rem;
}

h3 {
    font-family: var(--font-primary);
    color: var(--color-darkgray);
    font-size: 0.9rem;
    line-height: 130%;
    width: 100%;
    height: fit-content;
}

@media (max-width: 767px) {
    h1 {
        font-size: 2rem;
    }
}

.vertical_wrapper {
    padding: 0 30px 0 30px;
    display: flex;
    align-content: center;
    display: none !important;
}

.kontakt_grupa:not(:last-of-type) {
    margin-bottom: 2rem;
}

#kontakt_page .vertical_wrapper {
    display: flex !important;
}

@media (max-width: 767px) {
    .vertical_wrapper {
        display: none;
    }


    h1 {
        font-size: 2.5rem;
    }

    h2 {
        font-size: 2.0rem
    }

}



.subtitle {
    font-family: var(--font-primary);
    font-weight: 600;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.4rem;
}

.horizontal_wrapper {
    flex-grow: 1;
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
}

.vertical-text {
    writing-mode: vertical-lr;
    transform: scale(-1, -1);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.separator {
    width: 100px;
    height: 2px;
    margin: 20px 0 20px 0;
    background-color: var(--color-green);
    display: block;
}



#kim_jestesmy {
    width: 100%;
    min-height: 500px;
    margin: 0;
    padding-top: 50px;
    padding-bottom: 50px;
    position: relative;
    overflow-x: hidden;
}

#kim_jestesmy .button {
    background-color: transparent;
    border: 1px solid #fff;
    color: #fff;
    z-index: 3;
}

#kim_jestesmy .button:hover {
    background-color: #fff;
    border: 1px solid #fff;
    color: var(--color-darkblue);
}


#kim_jestesmy::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(img/banner-02.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}

@media only screen and (max-width: 991px) {
    #kim_jestesmy::after {
        /* Flip the background image */
        transform: scaleX(-1);
        background-position: center left;
    }

    #kim_jestesmy .vertical_wrapper {
        display: none;
    }

}

#kim_jestesmy>div:before {
    background-image: url('img/watermark.svg');
    background-repeat: no-repeat;
    background-size: 700px;
    background-position: center right;
    content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100vw;
    overflow-x: hidden;
    height: 100%;
    opacity: 0.1;
}

#sektory_dzialalnosci {
    width: 100%;
    height: 500px;
    margin: 0;
    padding: 0;
    background-image: url(img/banner-03.jpg);
    background-size: cover;
    background-position: center 70px;
    background-repeat: no-repeat;
}

#sektory_dzialalnosci>div>div {
    position: relative;
}

#sektory_dzialalnosci .swiper-slide {
    background-color: transparent;
    background-position: center 50px;
    transition: all .3s ease-in-out;
    position: relative;
}

#sektory_dzialalnosci .swiper-slide:hover {
    opacity: 1;
    transition: all .3s ease-in-out;
    background-color: rgba(14, 157, 139, 0.7);
    background-image: url(img/ryba.png);
    background-position: center 20px;
    background-size: 50%;
    background-repeat: no-repeat;
    display: block;
}

#sektory_dzialalnosci .swiper-slide li {
    transition: color .3s ease-in-out;
}

#sektory_dzialalnosci .swiper-slide:hover li.title {
    transition: color .3s ease-in-out;
    color: #fff;
}

#sektory_dzialalnosci .swiper-slide li:not(.title) {
    transition: color .3s ease-in-out;
    color: #fff;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: 500;
    text-align: center;
    text-transform: none;
    padding: 10px 10px 20px 10px;
}


ul.nagreenboksie {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
}



#sektory_dzialalnosci ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

ul.nagreenboksie::before {
    content: '';
    position: absolute;
    width: 100%;
    height: fit-content;
    left: 0;
    top: 0;
    padding: 5px 0 0 0;
    text-align: center;
    font-weight: 600;
    font-family: var(--font-sherif);
    font-size: 5rem;
    opacity: 0.1;
}

.nagreenboksie ul li {
    color: pink;
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(1) ul.nagreenboksie::before {
    content: '01'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(2) ul.nagreenboksie::before {
    content: '02'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(3) ul.nagreenboksie::before {
    content: '03'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(4) ul.nagreenboksie::before {
    content: '04'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(5) ul.nagreenboksie::before {
    content: '05'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(6) ul.nagreenboksie::before {
    content: '06'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(7) ul.nagreenboksie::before {
    content: '07'
}

#sektory_dzialalnosci div.swiper-slide:nth-of-type(8) ul.nagreenboksie::before {
    content: '08'
}


ul.nagreenboksie li.title {
    margin-top: 85px;
    width: 100%;
    font-family: var(--font-primary);
    color: var(--color-darkblue);
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
}

ul.nagreenboksie li.title ul {
    margin-top: 45px !important;
    color: #fff;
    opacity: 0;
    transition: opacity .3s ease-in-out;
}

ul.nagreenboksie li ul li {
    padding: 5px 0 5px 0;
}


#sektory_dzialalnosci .swiper-slide:hover li ul {
    opacity: 1;
    transition: opacity .3s ease-in-out;
}



#nasze_wartosci {
    padding-bottom: 60px;
}

#dla_wody {
    position: relative;
    height: 850px;
    z-index: 1;
}

.dla_wody-video {
    width: 100%;
    height: 850px;
    display: flex;
    align-items: center;
    justify-items: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background-image: url(img/dla_wody-video_placeholder.jpg);
    background-position: center;
    background-size: cover;
    overflow: hidden;
}

.dla_wody-video video {
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#czysta_energia .box-01 {
    background-image: url(img/box-01.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1/1.417;
    z-index: 2;
}

#czysta_energia .box-02 {
    background-image: url(img/box-02.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1/1.417;
    z-index: 2;
}

#czysta_energia .box-03 {
    background-image: url(img/box-03.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1/1.417;
    z-index: 2;
}

#czysta_energia {
    margin-top: -100px;
    background-color: #dee2e8;
    z-index: -1;
}

#nasza_ambicja {
    width: 100%;
    height: 800px;
    background-color: #dee2e8;
    background-image: url(img/banner-04.jpg);
    background-position: center top;
    background-size: cover;
    padding: 100px 0 100px 0;
}

.button {
    font-family: var(--font-primary);
    font-weight: 600;
    padding: 10px 20px;
    border: 1px solid var(--color-darkblue);
    border-radius: 1px;
    font-size: 0.7rem;
    transition: all .3s ease-in-out;
    background: transparent;
    color: var(--color-darkblue);
    text-decoration: none;
    text-transform: uppercase;
    margin-top: 15px;
}

.button:hover {
    background-color: var(--color-darkblue);
    color: #fff;
    transition: all .3s ease-in-out;
}

.button.zsz-download {
    font-size: 0.9rem;
}

.button.zsz-download:before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    padding-right: 5px;
    content: '\f56d'
}


#segmenty_dzialalnosci {
    padding-top: 50px;
    padding-bottom: 50px;
    margin-top: -200px;
    position: relative;
}

.section-title {
    text-align: center;
    letter-spacing: 0.3rem;
    font-size: 1.6rem;
    text-transform: uppercase;
    font-weight: 700;
}

.segmenty_dzialalnosci {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    position: relative;
}

.segmenty_dzialalnosci h1 {
    text-transform: uppercase;
    font-size: calc(0.4rem + 0.7vw);
    font-weight: 700;
    text-align: center;
    margin-top: 15px;
    z-index: 2;
    transition: color .3s ease-in-out;
}

@media (max-width: 991px) {
    .segmenty_dzialalnosci h1 {
        font-size: calc(0.4rem + 1.5vw);
    }
}

.segmenty_dzialalnosci h1 a {
    font-size: inherit;
    color: inherit;
    text-decoration: none;
}

.segmenty_dzialalnosci:hover h1 {
    color: #fff;
    transition: color .3s ease-in-out;
}

.segmenty_dzialalnosci .ryba {
    transform: scale(0.8);
    transition: all .3s ease-in-out;
    will-change: auto;
    z-index: 2;
}

.segmenty_dzialalnosci .cien {
    width: 100%;
    transform: scale(0.9);
    opacity: 0.7;
    transition: all .3s ease-in-out;
    will-change: auto;
    position: relative;
    z-index: 2;
}

.segmenty_dzialalnosci:hover .cien {
    transform: scale(1.1);
    opacity: 1;
    transition: all .3s ease-in-out;
}

.segmenty_dzialalnosci:hover .ryba {
    transform: scale(1);
    transition: all .3s ease-in-out;
}

.segmenty_dzialalnosci span {
    position: absolute;
    width: 70%;
    height: 100%;
    top: 0;
    left: 15%;
    background-color: #0e9d8b;
    z-index: 1;
    opacity: 0;
    transition: opacity .3s ease-in-out;
}

.segmenty_dzialalnosci:hover span {
    opacity: 1;
    transition: opacity .3s ease-in-out;
}

.segmenty_dzialalnosci span a {
    display: block;
    width: 100%;
    height: 100%;
}

.segmenty_dzialalnosci img {
    pointer-events: none;
}

#segmenty_page .jestesmy_eco {
    display: flex;
    position: relative;
    flex-wrap: wrap;
}

#segmenty_page .jestesmy_eco div {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    aspect-ratio: 1;
    display: block;
    background-image: url(img/jestesmy_eco.png);
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: center;
}

@media (max-width: 767px) {
    #segmenty_page .jestesmy_eco div {
        max-height: 130px;
        background-size: contain;
    }
}

#segmenty_page .flottweg {
    padding: 25px 0 0 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    font-family: var(--font-primary);
    font-size: 15px;
}

#segmenty_page .flottweg img {
    margin: 0 10px 0 0;

}

#segmenty_page .flottweg span {
    line-height: 100%;

}


[class^="box"] {
    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;
    aspect-ratio: 1/1;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    padding: 0;
    transition: all .3s ease-in-out .2s;
}

#segmenty_dzialalnosci .box-04 {
    background-image: url(img/box-04.jpg);
}

#segmenty_dzialalnosci .box-05 {
    background-image: url(img/box-05.jpg);
}

#segmenty_dzialalnosci .box-06 {
    background-image: url(img/box-06.jpg);
}

[class^="box"] .overlay {
    background-color: rgba(255, 255, 255, 0.7);
    height: 60px;
    display: block;
    width: 100%;
    padding: 20px;
    transition: all .3s ease-in-out;
    overflow: hidden;
}



[class^="box"] .overlay a.button {
    display: inline-block;
    margin-top: 0;
    border-color: #fff;
    color: #fff;
    background-color: transparent;
    opacity: 0;
    transition: all .3s ease-in-out;
}

[class^="box"] .overlay span {
    opacity: 0;
    transition: all .3s ease-in-out;
}

[class^="box"]:hover .overlay a.button,
[class^="box"]:hover .overlay span {
    opacity: 1;
    transition: all .3s ease-in-out;
}

[class^="box"] .overlay a.button:hover {
    border-color: #fff;
    color: var(--color-darkblue);
    background-color: #fff;
}


[class^="box"]:hover .overlay {
    height: 160px;
    transition: all .3s ease-in-out;
    background-color: rgba(14, 157, 139, 0.7)
}

[class^="box"]:hover .overlay h1 {
    color: #fff;
    transition: all .3s ease-in-out;
}

[class^="box"]:hover {
    background-size: 110%;
    transition: all .3s ease-in-out;
}



[class^="box"] .overlay h1 {
    font-size: calc(1rem + 0.2vw);
    font-weight: 700;
    margin-bottom: 0;
    transition: all .3s ease-in-out;
}

/*     HISTORIA      */

#historia {
    background-image: url(img/banner-05.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center bottom;
    position: relative;
    min-height: 1100px;
    padding-top: 0px;
    padding-bottom: 100px;
}

@media (max-width: 575px) {
    #historia {
        padding-bottom: 250px;
    }
}

#historia.o-nas {
    padding-top: 150px;
}

p.historia_opis {
    font-family: var(--font-primary);
    color: var(--color-darkblue);
    font-size: 1rem;
    text-transform: uppercase;
    line-height: 120%;
    text-align: center;
    padding: 15px 0 5px 0;
}

p.historia_tresc {
    font-family: var(--font-primary);
    color: var(--color-darkblue);
    font-size: 1.1rem;
    text-transform: none;
    font-weight: 600;
    line-height: 130%;
    text-align: center;
    padding: 50px 0 10px 0;
}

#historia::before {
    position: absolute;
    z-index: 1;
    width: 100%;
    line-height: 80%;
    display: block;
    top: 100px;
    content: 'historia';
    text-transform: uppercase;
    font-family: var(--font-primary);
    font-size: clamp(60px, 16vw, 200px);
    color: rgba(255, 255, 255, 0.3);
    text-align: center;
    font-weight: 700;
    padding: 0;
}

/*     HISTORIA SWIPER     */

.swiper_historia .swiper-slide span h1 {
    font-family: var(--font-primary);
    font-size: 6rem;
    color: #fff;
    font-weight: 900;
    display: block;
}



.swiper_historia .swiper-slide:last-of-type span h1 {
    font-family: var(--font-primary);
    font-size: 6rem;
    color: #212529;
    z-index: 997;
    font-weight: 900;
    display: block;
}

.swiper_historia .swiper-slide span p {
    font-family: var(--font-sherif);
    text-align: center;
    font-size: 1rem;
    color: var(--color-darkblue);
    font-weight: 500;
    display: block;
}

.swiper_historia .swiper-slide span em {
    font-family: var(--font-primary);
    text-align: center;
    font-size: 2rem;
    color: var(--color-darkblue);
    font-weight: 600;
    display: block;
    font-style: normal;
    line-height: 100%;
    padding-bottom: 20px;
}

.swiper_historia .swiper-slide span {
    width: 100%;
    height: fit-content;
    background-position: top 12px center;
    background-repeat: no-repeat;
    display: block;
    padding: 70% 8% 0 8% !important;
    background-size: 104%;
}

.swiper_historia .swiper-slide span {
    background-image: url(img/swiper-line-inner.svg);
}

.swiper_historia .swiper-slide:first-of-type span {
    background-image: url(img/swiper-line-start.svg);
}

.swiper_historia .swiper-slide:last-of-type span {
    background-image: url(img/swiper-line-end.svg);
}



/*     NEWSLETTER     */

#newsletter {
    padding-top: 70px;
    padding-bottom: 70px;
}

#newsletter .button-container {
    margin-top: 20px;
    margin-bottom: 0;
}

#newsletter .mc4wp-form-fields {
    width: 100%;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}

.newsletter__ppa {
    margin-top: 20px;
    width: 100%;
    display: flex;
    align-content: center;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    text-align: center;
    font-family: var(--font-primary);
    color: var(--color-darkgray);
    font-size: 0.7rem;
    line-height: 130%;
    text-wrap: balance;
}

.newsletter__ppa label {
    display: flex !important;
    align-content: center;
    font-weight: 400;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    text-align: center;
    font-family: var(--font-primary);
    color: var(--color-darkgray);
    font-size: 0.7rem;
    line-height: 130%;
    text-wrap: balance;
    border: 1px solid transparent;
    box-sizing: border-box;
}

#newsletter * {
    transition: none !important;
}

#newsletter #ns1,
#newsletter #ns1:hover {
    transition: all .3s ease-in-out !important;
}

.newsletter__ppa input {
    margin-right: 5px;
}

.newsletter__ppa a,
.newsletter__ppa a:active,
.newsletter__ppa a:focus,
.newsletter__ppa a:hover,
.newsletter__ppa a:focus-visible,
.newsletter__ppa a:focus-within {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border: none !important;
    line-height: 130% !important;
    font-weight: 400 !important;
}

.newsletter__ppa input,
.newsletter__ppa input:active,
.newsletter__ppa input:focus,
.newsletter__ppa input:hover,
.newsletter__ppa input:focus-visible,
.newsletter__ppa input:focus-within {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border: none !important;
}

.newsletter__ppa a {
    text-decoration: none;
    color: #5b81bb;
    padding-left: 2px;

}

.newsletter__ppa a:hover {
    text-decoration: none;
    color: #376cbb;
}

form {
    padding: 0 !important;
}

.mc4wp-form-fields>* {
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
}

form:not(.cart)>* {
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
}

#newsletter .mc4wp-response {
    width: 100%;
    margin: 30px 0 0 0;
    padding: 0;
    text-align: center;
    font-family: var(--font-primary);
    color: var(--color-warmbrown);
    font-size: 12px;
    font-weight: 400;
    line-height: 100%;
    ;
}

#newsletter input[type=text],
#newsletter input[type=email],
#newsletter input[type=text]:focus-visible,
#newsletter input[type=email]:focus-visible {
    width: 100%;
    max-width: 100%;
    outline: none;
    border: none;
    border-bottom: 1px solid var(--color-darkblue);
    font-size: 14px;
    background-color: transparent;
    padding: 12px 0;
    color: var(--color-darkgray);
    margin-top: 20px;
}

#newsletter input[type=submit] {
    font-family: var(--font-primary);
    background: transparent;
    color: var(--color-darkblue);
    font-size: 12px;
    letter-spacing: 0.5px;
    font-weight: 600;
    border: 1px solid var(--color-darkblue);
    border-radius: 0;
    padding: 10px 50px;
    text-transform: uppercase;
    text-decoration: none;
    transition: all .3s ease-in-out;
    text-align: center;
}


#newsletter input[type=submit]:hover {
    background-color: var(--color-darkblue);
    color: #fff;
    transition: all .3s ease-in-out;

}

#newsletter form {
    display: flex;
    flex-wrap: wrap;
}

/*   KARIERA   */

#kariera {
    padding-top: 30px;
    padding-bottom: 70px;
}

#kariera .box-07 {
    background-image: url(img/box-07.jpg);
}

#kariera .box-08 {
    background-image: url(img/box-08.jpg);
}

#kariera .box-09 {
    background-image: url(img/box-09.jpg);
}



#film_paula {
    background-image: url(img/banner-06.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 700px;
    background-position: center;
}

#film_paula svg path {
    fill: var(--color-green);
}

#film_paula svg {
    height: 50px;
    width: 50px;
}

#film_paula a {
    opacity: 0.9;
    display: flex;
    align-items: center;
    justify-content: start;
    justify-items: start;
    flex-wrap: nowrap;
    text-decoration: none;
    transition: all .3s ease-in-out;
    transform: scale(1);
    will-change: auto;
    padding: 50px 0 0 0;
}

#film_paula a:hover {
    opacity: 1;
    mix-blend-mode: luminosity;
    transition: all .17s ease-in-out;
    transform: scale(1.2);
    will-change: auto;
}

#film_paula a span {
    font-family: var(--font-primary);
    color: #fff;
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.05rem;
    padding-left: 20px;
}

#film_paula i {
    color: #fff;
    font-size: 4rem;
}



/*    COUNTDOWN     */
#countdown {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 100px;
}

#countdown .subtitle {
    font-weight: 500;
}

#countdown .subtitle strong {
    font-weight: 700;
}

.counter_wrapper {
    width: 20%;
    max-width: 150px;
    display: block;
    padding: 10px;
}

.counter_wrapper div {
    width: 100%;
    aspect-ratio: 1;
    border: 1px solid var(--color-green);
    border-radius: 20%;
    display: flex;
    align-items: center;
    justify-content: center;
    justify-items: center;
}

.counter_wrapper:last-of-type div {
    background-color: var(--color-green);
}

.counter_wrapper:last-of-type span {
    color: #fff;
}


@media (max-width: 767px) {

    .counter_wrapper div {
        padding: 10px 0 0 0;
    }

    .counter_wrapper span {
        font-family: var(--font-sherif);
        color: var(--color-darkblue);
        font-style: normal;
        font-size: 2rem;
        line-height: 0%;
        padding: 0 0 15px 0;
    }

    .counter_wrapper label {
        width: 100%;
        color: var(--color-darkblue);
        font-size: 0.55rem;
        font-weight: 600;
        font-family: var(--font-primary);
        text-align: center;
        text-transform: uppercase;
        padding-top: 10px;
    }
}

@media (min-width: 768px) {

    .counter_wrapper div {
        padding: 10px 0 0 0;
    }

    .counter_wrapper span {
        font-family: var(--font-sherif);
        color: var(--color-darkblue);
        font-style: normal;
        font-size: 3rem;
        line-height: 0%;
        padding: 0 0 15px 0;
    }

    .counter_wrapper label {
        width: 100%;
        color: var(--color-darkblue);
        font-size: 1rem;
        font-family: var(--font-primary);
        text-align: center;
        text-transform: uppercase;
        padding-top: 10px;
    }
}

#countdown em {
    font-family: var(--font-sherif);
    font-size: 200%;
    font-style: normal;
}

#countdown .button {
    background-color: var(--color-green);
    border-color: var(--color-green);
    color: #fff;
    transition: all .3s ease-in-out;
}

#countdown .button:hover {
    background-color: transparent;
    color: var(--color-green);
    transition: all .3s ease-in-out;
}

/*    FOOTER     */
#footer {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: var(--color-green);
}

/* FOOTER FORM */

#footer form {
    display: flex;
    flex-wrap: wrap;
    --footer-gap: 20px;
    gap: var(--footer-gap);
}



#footer .input-wrapper {
    border: 1px solid #dedede;
    position: relative;
    border-radius: 2px;
    margin: 0;
}

#footer .input-wrapper:nth-of-type(1),
#footer .input-wrapper:nth-of-type(2) {
    flex: 1 1 calc(50% - (var(--footer-gap) / 2));
}

@media(width < 768px) {

    #footer #footer .input-wrapper:nth-of-type(1),
    #footer #footer .input-wrapper:nth-of-type(2) {
        flex: 1 0 100%;
    }
}

@media(width > 991px) and (width < 1200px) {

    #footer .input-wrapper:nth-of-type(1),
    #footer .input-wrapper:nth-of-type(2) {
        flex: 1 0 100%;
    }
}


#footer .textarea-wrapper {
    border: 1px solid #dedede;
    position: relative;
    border-radius: 2px;
    margin: 0;
    width: 100%;
}

#footer .input-wrapper input:not([type="submit"]) {
    outline: none;
    box-shadow: none;
    height: 35px;
    background-color: transparent;
    border: 0;
    padding-left: 0;
    padding-right: 0;
    font-size: 14px;
    color: #dedede;
}

#footer .textarea-wrapper textarea {
    outline: none;
    box-shadow: none;
    height: 110px;
    background-color: transparent;
    border: 0;
    padding: 10px 0;
    font-size: 14px;
    color: #dedede;
}

#footer .sssf-response-output {
    display: flex;
    align-items: center;
    color: #fff;
}



.form__ppa {
    display: inline;
    font-weight: 400;
    text-align: left;
    font-family: var(--font-secondary);
    color: #dedede;
    ;
    font-size: 11.5px;
    line-height: 150%;
    padding: 0 !important;
}

.form__ppa label {
    display: inline;
    font-weight: 400;
    text-align: left;
    font-family: var(--font-secondary);
    color: #dedede;

    font-size: 11.5px;
    line-height: 130%;
    text-wrap: balance;
    box-sizing: border-box;
}

.form__ppa input {
    margin-right: 5px;
}

.form__ppa a,
.form__ppa a:active,
.form__ppa a:focus,
.form__ppa a:hover,
.form__ppa a:focus-visible,
.form__ppa a:focus-within {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border: none !important;
    line-height: 130% !important;
    font-weight: 400 !important;
}

.form__ppa input,
.form__ppa input:active,
.form__ppa input:focus,
.form__ppa input:hover,
.form__ppa input:focus-visible,
.form__ppa input:focus-within {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border: none !important;
}

.form__ppa a {
    text-decoration: none;
    color: #fff;

}

.form__ppa a:hover {
    text-decoration: underline;
    color: #fff;
}


#footer .textarea-wrapper textarea:active,
#footer .textarea-wrapper textarea:focus {
    background-color: transparent;
}


#footer .form-control::-webkit-input-placeholder {
    color: #000;
    opacity: 0;
}

#footer .form-control:-moz-placeholder {
    /* FF 4-18 */
    color: #000;
    opacity: 0;
}

#footer .form-control::-moz-placeholder {
    /* FF 19+ */
    color: #000;
    opacity: 0;
}

#footer .form-control:-ms-input-placeholder {
    /* IE 10+ */
    color: #000;
    opacity: 0;
}

#footer .form-control::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #000;
    opacity: 0;
}

#footer .form-control::placeholder {
    /* modern browser */
    color: #000;
    opacity: 0;
}


#footer .input-wrapper input:active,
#footer .input-wrapper input:focus,
#footer .textarea-wrapper textarea:active,
#footer .textarea-wrapper textarea:focus {
    outline: none;
    box-shadow: none;
}

#footer .input-wrapper label,
#footer .textarea-wrapper label {
    position: absolute;
    font-family: var(--font-secondary);
    font-size: 11.5px;
    top: -8px;
    left: 10px;
    padding: 0 5px;
    color: #dedede;
    background-color: var(--color-green);
}

#footer .submit-wrapper {
    border: 0;
    display: flex;
    align-items: center;
    align-content: center;
    padding: 0;
}

#footer .submit-wrapper input[type="submit"] {
    font-family: var(--font-primary);
    border: 1px solid #dedede;
    background-color: #dedede;
    color: var(--color-warmblack);
    font-size: 15px;
    text-transform: uppercase;
    transition: all .2s ease-in-out;
    padding: 7px 20px;
    border-radius: 2px;
    letter-spacing: 1px;
}

#footer .submit-wrapper input[type="submit"]:hover {
    border: 1px solid #fff;
    background-color: transparent;
    color: #fff;
    font-size: 15px;
    transition: all .2s ease-in-out;
}









#footer .logo-wrapper {
    width: 100%;
    margin-bottom: 30px;
}

#footer .logo-wrapper img {
    width: 70%;
}

#footer .text-wrapper {
    width: 100%;
    color: #fff;
    width: 100%;
    font-size: 15px;
}

@media (max-width: 768px) {
    #footer .text-wrapper {
        font-size: 13px;
    }
}

#footer .text-wrapper p {
    font-family: var(--font-primary);
    line-height: 200%;
}


#footer .text-wrapper strong {
    font-family: var(--font-primary);
    font-size: 17px;
    margin-bottom: 20px;
}

#footer a.contact-btn {
    color: #fff;
    background-color: transparent;
    font-family: var(--font-primary);
    font-size: 13px;
    text-decoration: none;
    padding: 5px 15px 5px 15px;
    border: 1px solid #fff;
    display: inline-block;
    border-radius: 3px;
    margin: 0;
    transition: all 0.2s ease-in-out;
}

#footer a.contact-btn:not(:last-of-type) {
    margin-bottom: 10px;
    margin-right: 10px;
}


#footer a.contact-btn::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    padding-right: 5px;
}

#footer a.contact-btn:hover {
    color: #000;
    background: #fff;
    transition: all 0.2s ease-in-out;
}


.contact-btn.telefon::before {
    content: '\f095';
}

.contact-btn.mail::before {
    content: '\f0e0';
}

.footer-menu {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 5px 0 0 0;
    max-width: 160px;
    align-content: flex-start;
}

.footer-menu li {
    font-family: var(--font-primary);
    margin: 0;
    padding: 0;
    font-weight: 300;
    width: 100%;
}

.footer-menu a {
    text-decoration: none;
    color: #e1e1e1;
    font-size: 13px;
    transition: opacity .2s ease-in-out;
    width: 100%;
}



.footer-menu li:first-of-type {
    color: #e1e1e1;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;

}


.footer-menu:hover a:not(:hover) {
    opacity: 0.7;
    transition: opacity .2s ease-in-out;
}


#footer .form-select {
    width: 100%;
    height: 30px;
    border-radius: 1px;
    line-height: 10px;
    border: 1px solid #fff;
    background-color: #fff;
    color: var(--color-green) !important;
    font-family: var(--font-primary);
    font-size: 13px;
    letter-spacing: 0.5px;
    font-weight: 600;
    text-transform: uppercase;
}

#footer .form-select:focus {
    outline: none;
    box-shadow: none;
    border-radius: 0;
}

#footer .col-12:first-of-type {
    display: flex;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    #footer .form-select {
        margin: 50px 0;
    }

}

@media (max-width: 991px) {
    #footer .col-12:first-of-type {
        align-content: space-between;
    }
}

.go-top {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    width: 2rem;
    height: 2rem;
    background-color: var(--color-darkblue);
    z-index: 2;
    -webkit-transition: .3s ease;
    transition: .3s ease;
    border: 0;
    opacity: 0;
}

.go-top.active {
    opacity: 1;
    -webkit-transition: .3s ease;
    transition: .3s ease;
}

.go-top i {
    color: #fff;
}

strong.location {
    position: relative;
}


#footer .text-wrapper a.gmaps-link {
    text-decoration: none;
    color: #fff;
}

strong.location::before {
    content: "\f3c5";
    font-size: 1.5rem;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    padding-right: 5px;
    transition: opacity .2s ease-in-out;
}

#footer .text-wrapper a:hover strong.location::before {
    opacity: 70%;
    transition: opacity .2s ease-in-out;
}


footer p {
    padding: 0 0 0 23px;
}

#kontakt_mapa .mapa_wrapper_wide {
    background-color: #f4f4f4;
    width: 100%;
}

.wpgmp_map_parent {
    display: block !important;
    margin-bottom: 0 !important;
}

#kontakt_mapa .mapa_wrapper {
    background-color: #f4f4f4;
    width: 100%;
    padding-left: var(--dyna-padding);
    padding-right: var(--dyna-padding);
}

#kontakt_mapa .mapa_wide {
    width: 100%;
    background-color: #f4f4f4;
}

#kontakt_mapa .mapa {
    width: 100%;
    aspect-ratio: 2;
    background-color: #f4f4f4;
    background-image: url(img/kontakt_mapa.png);
    background-size: contain;
}

.gm-style-iw.gm-style-iw-c,
.gm-style-iw,
.gm-style-iw-c {
    width: fit-content !important;
    min-width: fit-content !important
}

.wpgmp_map_parent .wpgmp_map .wpgmp_map_container .gm-style-iw {
    max-width: fit-content !important;
}

#kontakt_mapa div[role="button"] img {
    width: 20px !important;
}

.kontakt_siedziba {
    background-color: #185569;
    background-image: url(img/ogon_ryby.jpg);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 70%;
    padding-top: 50px;
    padding-bottom: 50px;
}

.kontakt_siedziba p {
    color: #fff;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

#kontakt_page .darkoverlay {
    position: relative;
}

#kontakt_page .darkoverlay::before {
    position: absolute;
    width: 100%;
    content: '';
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 2;
    pointer-events: none;
}

#kontakt_page i[class^="fa-"]:not(.button i) {
    border: 2px solid var(--color-green);
    border-radius: 50%;
    padding: 15px;
    margin-right: 10px;
    display: block;
    aspect-ratio: 1;
    width: fit-content
}

#kontakt_page span:not(.separator, .subtitle) {
    display: block;
}

#kontakt_page p.kontakt_nazwa {
    font-size: 1.3rem;
    font-weight: 600;
    font-family: var(--font-primary);
    text-transform: uppercase;
    line-height: 120%;
}

#kontakt_page .kontakt_oddzialy p.kontakt_nazwa {
    font-size: 1.1rem;
    font-weight: 600;
    font-family: var(--font-primary);
    text-transform: uppercase;
    line-height: 120%;
}

#kontakt_page p:not(.kontakt_nazwa) {
    font-size: 1rem;
    font-weight: 400;
    font-family: var(--font-secondary);
    line-height: 150%;
}

#kontakt_page .kontakt_oddzialy p:not(.kontakt_nazwa) {
    font-size: 0.9rem;
    font-weight: 400;
    font-family: var(--font-secondary);
    line-height: 150%;
}

#kontakt_page .kontakt_oddzialy p a {
    text-decoration: none;
    color: inherit;
}

#kontakt_page .kontakt_oddzialy p a:hover {
    text-decoration: underline;
}

#kontakt_page .kontakt_oddzialy p {
    margin-bottom: 0.6rem;
}

#kontakt_page .kontakt_oddzialy i[class^="fa-"]:not(.button i) {
    border: 2px solid var(--color-green);
    border-radius: 50%;
    padding: 10px;
    margin-right: 10px;
    display: block;
    aspect-ratio: 1;
    width: fit-content
}


.kontakt_siedziba a.button {
    text-align: center;
    color: #fff;
    border-color: #fff;
    background-color: transparent;
    transition: all .3s ease-in-out;
}

.kontakt_siedziba a.button:hover {
    color: var(--color-darkblue);
    border-color: #fff;
    background-color: #fff;
    transition: all .3s ease-in-out;
}

.kontakt_oddzialy {
    background-color: #fff;
    padding-top: 50px;
    padding-bottom: 50px;
}

.kontakt_oddzialy p {
    color: var(--color-darkblue);
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.kontakt_gallery img {
    width: 100%;
    aspect-ratio: 1;
}

@media(max-width:767px) {
    #kontakt_page .vertical_wrapper {
        display: none !important;
    }

    #kontakt_page .kontakt_oddzialy {
        padding-left: var(--dyna-padding);
        padding-right: var(--dyna-padding);
    }
}

.deleted-map {
    aspect-ratio: 2;
    background-image: url(img/box-ludzie-04.jpg);
    background-position: center;
    background-size: cover;
}

.clickable_contact {
    color: inherit;
    text-decoration: none;
    font-weight: inherit;
    font-size: inherit;
}

.clickable_contact:hover {
    text-decoration: underline;
}


#onas_hero {
    height: clamp(750px, 50dvh, 1100px);
    background-image: url(img/hero-onas.jpg);
    background-position: center;
    background-size: cover;
}

#onas_page {
    margin-top: -70px;
    background: url(img/dee1e8.png) bottom repeat-x;
}

#onas_page .box-onas-01 {
    background-image: url(img/box-onas-01.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1;
    z-index: 2;
}

#onas_page .box-onas-02 {
    background-image: url(img/box-onas-02.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1;
    z-index: 2;
}

#onas_page .box-onas-03 {
    background-image: url(img/box-onas-03.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1;
    z-index: 2;
}

#onas_page .box-onas-04 {
    background-image: url(img/box-onas-04.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1;
    z-index: 2;
}

#onas_page .box-onas-05 {
    background-image: url(img/box-onas-05.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1;
    z-index: 2;
}

#onas_page .box-onas-06 {
    background-image: url(img/box-onas-06.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1;
    z-index: 2;
}

[class^="box-onas"] .overlay {
    background-color: rgba(255, 255, 255, 0);
    height: 30%;
    display: block;
    width: 100%;
    padding: 30px;
    transition: all .3s ease-in-out;
    overflow: hidden;
}


[class^="box-onas"]:hover .overlay {
    height: 100%;
    transition: all .3s ease-in-out;
    background-color: rgba(0, 14, 31, 0.7)
}

[class^="box-onas"]:hover .overlay h1 {
    color: #fff;
    transition: all .3s ease-in-out;
}

[class^="box-onas"]:hover {
    background-size: 110%;
    transition: all .3s ease-in-out;
}

[class^="box-onas"] .overlay h1 {
    font-size: calc(0.6rem + 0.2vw);
    color: #fff;
    font-weight: 700;
    margin-bottom: 0;
    transition: all .3s ease-in-out;
}

@media (max-width: 575px) {
    [class^="box-onas"] .overlay h1 {
        font-size: 20px;
    }
}

[class^="box-onas"] .overlay p {
    font-weight: 500;
    margin-bottom: 0;
    transition: all .3s ease-in-out;
    opacity: 0;
}

[class^="box-onas"] {
    container-type: size;
}

@container (min-width: 100px) {
    .dyna-font-size {
        font-size: 0.6rem;
        line-height: 105%;
        color: #fff;
    }
}

@container (min-width: 269px) {
    .dyna-font-size {
        font-size: 0.65rem;
        line-height: 120%;
        color: #fff;

    }
}

@container (min-width: 284px) {
    .dyna-font-size {
        font-size: 0.65rem;
        line-height: normal;
        color: #fff;

    }
}

@container (min-width: 329px) {
    .dyna-font-size {
        font-size: 0.8rem;
        line-height: normal;
        color: #fff;
    }
}

@container (min-width: 359px) {
    .dyna-font-size {
        font-size: 0.85rem;
        line-height: normal;
        color: #fff;
    }
}



[class^="box-onas"]:hover .overlay p {
    opacity: 1;
}

#onas_boxy [class*="box-"] {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1/1.417;
    z-index: 2;
}

#onas_boxy .box-07 {
    background-image: url(img/box-onas-07.jpg);
}

#onas_boxy .box-08 {
    background-image: url(img/box-onas-08.jpg);
}

#onas_boxy .box-09 {
    background-image: url(img/box-onas-09.jpg);
}

#onas_boxy .box-10 {
    background-image: url(img/box-02.jpg);
}

#onas_boxy {
    margin-top: -100px;
    background-color: #fff;
    z-index: -1;
}


#odpowiedzialnosc_hero {
    height: clamp(750px, 50dvh, 1100px);
    background-image: url(img/hero-odpowiedzialnosc.jpg);
    background-position: center;
    background-size: cover;
}

#odpowiedzialnosc_page {
    padding-top: 100px;
    padding-bottom: 100px;
}

#odpowiedzialnosc_content p {
    color: #212529;
    font-family: var(--font-secondary);
    font-size: 1rem;
    line-height: 150%;
}

#odpowiedzialnosc_content h2 {
    font-size: 1.5rem;
    color: var(--color-darkblue);
    font-family: var(--font-primary);
    text-transform: uppercase;
    line-height: 120%;
    font-weight: 600;
}

.punkt_wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
}

.punkt_wrapper:not(:last-of-type) {
    margin-bottom: 60px;
}

.punkt_wrapper .content_container {
    padding: 45px 0 0 70px;
    position: relative;
}

.punkt_wrapper img {
    width: 120px;
    aspect-ratio: 1;
}

@media (max-width: 767px) {
    .punkt_wrapper .content_container {
        padding: 45px 20px 0 45px;
    }

    .punkt_wrapper img {
        width: 90px;
        margin-top: 15px;
    }
}

.punkt_wrapper .content_container::before {
    content: '01';
    position: absolute;
    width: fit-content;
    height: fit-content;
    left: 20px;
    top: -35px;
    padding: 0;
    text-align: left;
    font-weight: 800;
    font-family: var(--font-primary);
    font-size: 7rem;
    opacity: 0.1;
}

.punkt_wrapper:nth-of-type(1) .content_container::before {
    content: '01';
}

.punkt_wrapper:nth-of-type(2) .content_container::before {
    content: '02';
}

.punkt_wrapper:nth-of-type(3) .content_container::before {
    content: '03';
}

.punkt_wrapper:nth-of-type(4) .content_container::before {
    content: '04';
}

.punkt_wrapper:nth-of-type(5) .content_container::before {
    content: '05';
}

.punkt_wrapper:nth-of-type(6) .content_container::before {
    content: '06';
}

.punkt_wrapper:nth-of-type(7) .content_container::before {
    content: '07';
}

.punkt_wrapper:nth-of-type(8) .content_container::before {
    content: '08';
}

.punkt_wrapper:nth-of-type(9) .content_container::before {
    content: '09';
}

.punkt_wrapper:nth-of-type(10) .content_container::before {
    content: '10';
}

.punkt_wrapper:nth-of-type(11) .content_container::before {
    content: '11';
}

.punkt_wrapper:nth-of-type(12) .content_container::before {
    content: '12';
}

.punkt_wrapper:nth-of-type(13) .content_container::before {
    content: '13';
}

.punkt_wrapper:nth-of-type(14) .content_container::before {
    content: '14';
}

.punkt_wrapper:nth-of-type(15) .content_container::before {
    content: '15';
}

.punkt_wrapper:nth-of-type(16) .content_container::before {
    content: '16';
}

.punkt_wrapper:nth-of-type(17) .content_container::before {
    content: '17';
}

.punkt_wrapper:nth-of-type(18) .content_container::before {
    content: '18';
}

.punkt_wrapper h1 {
    font-size: 1.5rem;
    color: var(--color-darkblue);
    text-transform: uppercase;
    line-height: 120%;
}

#odpowiedzialnosc_certyfikaty {
    padding-top: 0;
    padding-bottom: 50px;
}

#odpowiedzialnosc_certyfikaty p {
    font-family: var(--font-primary);
    font-size: 1rem;
    color: var(--color-darkgray);
    text-align: center;
    padding-top: 30px;
}

#odpowiedzialnosc_certyfikaty p a {
    text-decoration: underline;
    color: inherit;
}

#odpowiedzialnosc_certyfikaty p a:hover {
    text-decoration: none;
    color: inherit;
}

.banner-odpowiedzialnosc-01 {
    background-image: url(img/banner-odpowiedzialnosc-01.jpg);
    background-size: cover;
    padding-top: 150px;
    padding-bottom: 150px;
}

.banner-odpowiedzialnosc-02 {
    background-image: url(img/banner-odpowiedzialnosc-02.jpg);
    background-size: cover;
}

.wpls-logo-showcase .slick-arrow {
    background: transparent !important;
}

.wpls-logo-showcase .slick-arrow:hover {
    background: transparent !important;
}

.wpls-logo-showcase .slick-arrow svg {
    fill: var(--color-darkgray) !important;
}

#ludzie_hero {
    height: clamp(750px, 50dvh, 1100px);
    background-image: url(img/hero-ludzie.jpg);
    background-position: center;
    background-size: cover;
    padding-bottom: 50px;
}

#ludzie_page {
    padding-top: 0;
    padding-bottom: 0;
}

#ludzie_page .box-01 {
    background-image: url(img/box-ludzie-01.jpg);
    background-size: cover;
    background-position: center;
    padding-top: 150px;
    padding-bottom: 150px;
}

#ludzie_page .box-02 {
    background-image: url(img/box-ludzie-02.jpg);
    background-size: cover;
    background-position: center;
    padding-top: 150px;
    padding-bottom: 150px;
}

#ludzie_page .box-03 {
    background-image: url(img/box-ludzie-03.jpg);
    background-size: cover;
    background-position: center;
    padding-top: 150px;
    padding-bottom: 150px;
}

@media (max-width: 1200px) {
    #ludzie_page .box-03 {
        background-image: url(img/box-ludzie-04.jpg);
    }

    #ludzie_page .box-03 .text-offwhite {
        color: var(--color-darkblue)
    }
}

#ludzie_page .box-04 {
    background-image: url(img/box-ludzie-04.jpg);
    background-size: cover;
    background-position: center;
    padding-top: 150px;
    padding-bottom: 150px;
}

#ludzie_liderzy .box-05 {
    background-color: #fff;
    padding-top: 150px;
    padding-bottom: 150px;
}

#ludzie_liderzy .box-06 {
    background-image: url(img/box-ludzie-06.jpg);
    background-size: cover;
    background-position: center;
    padding-top: 150px;
    padding-bottom: 150px;
}

#ludzie_liderzy .flota {
    background-image: url(img/box-ludzie-07.jpg);
    background-size: cover;
    background-position: center right;
}

#ludzie_liderzy .box-07 {
    background-color: rgba(14, 52, 76, 0.85);
    padding-top: 150px;
    padding-bottom: 150px;
}


#cv {
    background-image: url(img/banner-cv.jpg);
    background-size: cover;
    background-position: center;
    padding-top: 150px;
    padding-bottom: 150px;
}

#cv h1 {
    font-size: 1.5rem;
    text-align: center;
    color: #fff;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding-bottom: 15px;

}

#cv p {
    font-size: 1.1rem;
    text-align: center;
    color: #fff;
    font-family: var(--font-sherif);
    width: 100%;
}

#cv .button {
    font-size: 1rem;
    display: block;
    padding: 10px 60px 10px 60px;
    color: #fff;
    transition: all .2s ease-in-out;
}

#cv .button:first-of-type {
    border: 1px solid var(--color-green);
    background-color: var(--color-green);
}

#cv .button:first-of-type:hover {
    border: 1px solid var(--color-green);
    background-color: transparent;
    transition: all .2s ease-in-out;
    color: var(--color-green);
}

#cv .button:last-of-type {
    border: 1px solid var(--color-offwhite);
    background-color: var(--color-offwhite);
    color: var(--color-darkblue);
}

#cv .button:last-of-type:hover {
    border: 1px solid var(--color-offwhite);
    background-color: transparent;
    color: #fff;
    transition: all .2s ease-in-out;
}

#cv .button_wrapper {
    width: fit-content;
    padding-top: 20px;
    display: flex;
    flex-wrap: nowrap;
}

@media (max-width: 767px) {
    #cv .button_wrapper {
        flex-wrap: wrap;
        justify-content: center;
    }

    #cv .button_wrapper .button {
        width: 100%;
        text-align: center;
    }
}

#cv .button_wrapper .button {
    margin-right: 5px;
    margin-left: 5px;
}

.cv {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

#oferty_pracy {
    padding-top: 100px;
    padding-bottom: 100px;
}

#oferty_pracy h1 {
    font-size: 1.5rem;
    text-align: center;
    color: var(--color-darkblue);
    letter-spacing: 1px;
    text-transform: uppercase;
    padding-bottom: 15px;

}

.sjb-page .list-data .v1 {
    margin: 5px 0 5px 0;
}

.sjb-page .list-data .v1 .job-info h4 a {
    font-weight: 500;
    font-family: var(--font-primary);
}

#ludzie_liderzy .digits h1 {
    font-size: 1rem;
    text-align: center;
    color: var(--color-darkblue);
    letter-spacing: 3px;
    text-transform: uppercase;
    padding-bottom: 35px;

}

#ludzie_liderzy .digits label {
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--color-darkblue);
    width: 100%;
    text-align: center;
    text-transform: none;
    line-height: 120%;
}

.digits {
    padding-top: 50px;
    padding-bottom: 50px;
}

.digits_wrapper {
    width: 100%;
    text-align: center;
}

#ludzie_liderzy .digits_wrapper span {
    font-family: var(--font-primary);
    font-size: 3rem;
    font-weight: 700;
    text-align: center;
}

#ludzie_liderzy .row div:nth-of-type(2n) .digits_wrapper span {
    color: var(--color-green);
}

#ludzie_liderzy .row div:nth-of-type(2) .digits_wrapper span::before {
    content: '00';
    color: #ebecec;
}

#ludzie_liderzy .row div:nth-of-type(3) .digits_wrapper span::before {
    content: '0';
    color: #ebecec;
}

#ludzie_liderzy .row div:nth-of-type(4) .digits_wrapper span::after {
    content: '%';
    color: #ebecec;
}

#ludzie_liderzy .row div:nth-of-type(5) .digits_wrapper span::before {
    content: '00';
    color: #ebecec;
}

#ludzie_liderzy .row div:nth-of-type(6) .digits_wrapper span::before {
    content: '00';
    color: #ebecec;
}

#ludzie_liderzy .row div:nth-of-type(7) .digits_wrapper span::after {
    content: 'MW';
    color: #ebecec;
}

#ludzie_liderzy .row div:nth-of-type(8) .digits_wrapper span::after {
    content: '%';
    color: #ebecec;
}

@media (max-width: 575.98px) {
    .digits_container {
        width: 80%;
        margin: 0 10% 50px 10%;
    }

    .digits_wrapper label {
        padding: 0 20%;
    }

    .digits {
        padding-left: var(--dyna-padding);
        padding-right: var(--dyna-padding);
    }
}

@media (min-width: 576px) {
    .digits_container {
        width: 40%;
        margin: 0 5% 50px 5%;
    }

    .digits_wrapper label {
        padding: 0 8%;
    }

    .digits {
        padding-left: var(--dyna-padding);
        padding-right: var(--dyna-padding);
    }
}

@media (min-width: 768px) {
    .digits_container {
        width: 40%;
        margin: 0 5% 50px 5%;
    }

    .digits_wrapper label {
        padding: 0 8%;
    }

    .digits {
        padding-left: var(--dyna-padding);
        padding-right: var(--dyna-padding);
    }
}

@media (min-width: 992px) {
    .digits_container {
        width: 40%;
        margin: 0 5% 50px 5%;
    }

    .digits_wrapper label {
        padding: 0 20%;
    }

    .digits {
        padding-left: var(--dyna-padding);
        padding-right: var(--dyna-padding);
    }
}

@media (min-width: 1200px) {
    .digits_container {
        width: 20%;
        margin: 0 2.5% 50px 2.5%;
    }

    .digits_wrapper label {
        padding: 0 8%;
    }

    .digits {
        padding-left: 0%;
        padding-right: 0%;
    }
}

@media (min-width: 1400px) {
    .digits_container {
        width: 12%;
        margin: 0.25%;
    }

    .digits_wrapper label {
        padding: 0 2%;
    }

    .digits {
        padding-left: 0%;
        padding-right: 0%;
    }
}

.flota .flota_wrapper {
    display: flex;
    flex-wrap: wrap;
}

.flota .flota_wrapper .flota_container {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: space-between;
}

.flota label {
    text-align: right;
    color: var(--color-offwhite);
    font-size: 1rem;
    text-transform: uppercase;
    font-weight: 600;
    padding-left: 10px;
}

.flota .separator {
    width: unset;
    flex-grow: 1;
    margin-left: 10px;
}

.flota_value {
    font-family: var(--font-primary);
    font-size: 2rem;
    font-weight: 700;
    text-align: left;
    color: var(--color-offwhite);
    min-width: 65px;
}

.flota_container:nth-of-type(n+3) .flota_value::before {
    content: '0';
    opacity: 0.5;
    color: var(--color-offwhite);
}

#segmenty_hero {
    height: clamp(750px, 50dvh, 1100px);
    background-image: url(img/hero-segmenty.jpg);
    background-position: center right;
    background-size: cover;
    padding-bottom: 50px;
}


#segmenty_page .box-01 {
    background-image: url(img/box-segmenty-01.jpg);
}

#segmenty_page .box-04 {
    background-image: url(img/box-segmenty-04.jpg);
}

#segmenty_page .box-05 {
    background-image: url(img/box-segmenty-05.jpg);
}

#segmenty_page .box-08 {
    background-image: url(img/box-segmenty-08.jpg);
}

#segmenty_page .box-09 {
    background-image: url(img/box-segmenty-09.jpg);
}

#segmenty_page .box-12 {
    background-image: url(img/box-segmenty-12.jpg);
}

#segmenty_page .box-13 {
    background-image: url(img/box-segmenty-13.jpg);
}

#segmenty_page .box-16 {
    background-image: url(img/box-segmenty-16.jpg);
}

#segmenty_page .box-01,
#segmenty_page .box-04,
#segmenty_page .box-05,
#segmenty_page .box-08,
#segmenty_page .box-09,
#segmenty_page .box-12,
#segmenty_page .box-13,
#segmenty_page .box-16 {
    background-position: center;
    background-size: cover;
}

#segmenty_page [class*="box"] {
    min-height: 600px;
    position: relative;
    padding-top: 70px;
    padding-bottom: 70px;
}

#segmenty_page [class*="box"] .link-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

#segmenty_page [class*="box"] .link-bottom a {
    background-color: #030e2e;
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 0.8rem;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--color-offwhite);
    padding: 15px 40px 13px;
}

#segmenty_page [class*="box"] .link-bottom strong {
    font-weight: 700;
}

#segmenty_page [class*="box"] .link-bottom a:hover {
    background-color: var(--color-green);
    color: #fff;
    transition: all .3s ease-in-out;
}


#segmenty_page .horizontal_wrapper h1 {
    font-size: 2rem;
    font-weight: 800;
}

#segmenty_page .horizontal_wrapper h3 {
    font-size: 0.9rem;
    line-height: 140%;
}

#segmenty_page .subtitle {
    font-size: 0.8rem
}

#segmenty_page span.liczba {
    color: var(--color-green);
    font-size: 2rem;
    font-weight: 800;
    font-family: var(--font-primary);
    width: 100%;
    text-align: left;
}

#segmenty_page span.liczba em {
    color: var(--color-darkblue);
    font-size: 0.9rem;
    font-weight: 600;
    font-family: var(--font-primary);
    padding-left: 5px;
    font-style: normal;
}

#segmenty_page label {
    color: var(--color-darkblue);
    font-size: 0.9rem;
    font-weight: 600;
    font-family: var(--font-primary);
    text-transform: uppercase;
}


#segmenty_page .certyfikat {
    position: relative;
    transition: all .2s ease-in-out;
}

#segmenty_page .certyfikat img {
    height: 70px;
}

.transport_wrapper>div:last-of-type {
    width: 100%;
    padding: 10px 0 10px 0;
    display: flex;
    justify-content: center;
}

#segmenty_page .certyfikat::after {
    content: '\f56d';
    color: #000;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    pointer-events: none;
    transition: opacity .2s ease-in-out;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    font-size: 35px;
}

#segmenty_page .certyfikat:hover::after {
    opacity: 1;
}

[id*="_hero"] ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 400px;
}

[id*="_hero"] li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    padding-bottom: 5px;
    padding-top: 6px;
    font-family: var(--font-primary);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    transition: padding-left .3s ease-in-out;
}

[id*="_hero"] li a {
    font-family: var(--font-primary);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    transition: padding-left .3s ease-in-out;
    line-height: 0;
    position: relative
}

[id*="_hero"] ul:hover li a:hover {
    padding-left: 15px;
    transition: padding-left .3s ease-in-out;
}

[id*="_hero"] ul li a::before {
    content: '\f0da';
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    position: absolute;
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: all .3s ease-in-out;
}

[id*="_hero"] ul li a:hover::before {
    content: '\f0da';
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    left: 0;
    opacity: 1;
    transition: all .3s ease-in-out
}


#zielona_energia .energia_wrapper {
    display: flex;
    flex-wrap: wrap;
}

#zielona_energia .energia_wrapper .energia_container {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: space-between;
}

#zielona_energia label {
    text-align: right;
    color: var(--color-darkblue);
    font-size: 1rem;
    text-transform: none;
    font-weight: 600;
    padding-left: 10px;
}

#zielona_energia .separator {
    margin-left: 10px;
    width: unset;
    flex-grow: 1;
}

.energia_value {
    font-family: var(--font-primary);
    font-size: 1.7rem;
    font-weight: 700;
    text-align: left;
    color: var(--color-green);
}

.energia_container:nth-of-type(1) .energia_value::after,
.energia_container:nth-of-type(2) .energia_value::after {
    content: 'MW';
    padding-left: 5px;
    opacity: 0.5;
    color: var(--color-green);
}

.energia_container:nth-of-type(3) .energia_value::before {
    content: '00';
    opacity: 0.5;
    color: var(--color-green);
}

.energia_container:last-of-type .energia_value::after {
    content: '%';
    opacity: 0.5;
    color: var(--color-green);
}

#flota .transport_wrapper {
    display: flex;
    flex-wrap: wrap;
}

#flota .transport_wrapper .transport_container {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: space-between;
}

#flota label {
    text-align: right;
    color: var(--color-darkblue);
    font-size: 1rem;
    text-transform: none;
    font-weight: 600;
    padding-left: 10px;
}

#flota .separator {
    margin-left: 10px;
    width: unset;
    flex-grow: 1;
}

.transport_value {
    font-family: var(--font-primary);
    font-size: 1.7rem;
    font-weight: 700;
    text-align: left;
    color: var(--color-green);
}



.transport_container:nth-of-type(3) .transport_value::before,
.transport_container:nth-of-type(4) .transport_value::before {
    content: '0';
    opacity: 0.5;
    color: var(--color-green);
}

.transport_container:nth-of-type(5) .transport_value::before {
    content: '00';
    opacity: 0.5;
    color: var(--color-green);
}

.transport_container:nth-of-type(6) .transport_value::after {
    content: '%';
    opacity: 0.5;
    color: var(--color-green);
}

.transport_container:nth-of-type(7) .transport_value::after {
    content: '/7';
    opacity: 0.5;
    color: var(--color-green);
}

#onas_circle {
    counter-reset: segment 0;
    padding-top: 50px;
    padding-bottom: 50px;
}

#onas_circle h1 br {
    display: none;
}

#onas_circle .segment {
    display: flex;
    flex-direction: row;
    margin-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--color-green)
}

#onas_circle .ico_wrapper {
    display: flex;
    padding: 15px 0 15px;
    align-items: flex-start;
}

#onas_circle .ico_wrapper img {
    width: 80px;
    aspect-ratio: 1;
}

#onas_circle .content_wrapper {
    display: flex;
    flex-grow: 1;
    position: relative;
    flex-direction: row;
    align-items: center;
    padding: 0 0 0 10px;
    overflow: hidden;
}

#onas_circle .content_wrapper::before {
    counter-increment: segment;
    content: "0" counter(segment);
    display: block;
    position: absolute;
    line-height: 63px;
    font-weight: 800;
    font-family: var(--font-primary);
    font-size: 6rem;
    opacity: 0.05;
}

#onas_circle .content_wrapper h1 {
    width: fit-content;
    font-size: 1rem;
    color: var(--color-darkblue);
    font-weight: 800;
    text-transform: uppercase;
    transition: all .3s ease-in-out;
}

@media (min-width: 992px) {
    #onas_circle .row {
        background-image: url(img/bg_onas.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }
}

#onas_circle .content_wrapper:hover h1 {
    transform: translateY(-60px);
    opacity: 0;
    transition: all .3s ease-in-out;
}

#onas_circle .content_wrapper p {
    transform: translateY(60px);
    opacity: 0;
    font-size: 0.8rem;
    transition: all .3s ease-in-out;
    font-family: var(--font-primary);
    font-weight: 500;
    position: absolute;
    margin: 0;
}

@media (max-width: 767px) {
    #onas_circle .content_wrapper p {
        line-height: 110%;
    }
}

#onas_circle .content_wrapper:hover p {
    transform: translateY(0);
    opacity: 1;
    transition: all .3s ease-in-out;
}

#produkty_hero {
    height: clamp(750px, 50dvh, 1100px);
    background-image: url(img/hero-produkty.jpg);
    background-position: center;
    background-size: cover;
}

section[id^="produkty-"] .produkty-background {
    padding-top: 50px;
    padding-bottom: 50px;
    display: flex;
    align-items: center;
    background-repeat: no-repeat;
    background-position: center left;
}

#produkty-losos .produkty-background {
    background-color: #cd3f17;
    background-image: url(img/bg_produkty-losos.jpg);
}

#produkty-ryby_pelagiczne .produkty-background {
    background-color: #1f4160;
    background-image: url(img/bg_produkty-ryby_pelagiczne.jpg);
}

#produkty-ryby_biale .produkty-background {
    background-color: #008675;
    background-image: url(img/bg_produkty-ryby_biale.jpg);
}

#produkty-maczka_i_olej .produkty-background {
    background-color: #6b8187;
    background-image: url(img/bg_produkty-bialko.jpg);
}

.produkty_header {
    display: flex;
    flex-direction: column;
    justify-items: center;
}

.produkty-header h1 {
    font-size: 2.5rem;
    color: #fff;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    padding: 9;
}

.produkty-header span {
    text-align: left;
    font-family: var(--font-primary);
    font-size: 1rem;
    color: var(--color-offwhite);
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    padding-top: 15px;
    display: inline-block;
}

.produkty-header span::after {
    content: ':';
}

.produkty-header p {
    text-align: left;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    color: var(--color-offwhite);
    text-transform: none;
    font-weight: 500;
    margin: 0;
    opacity: 0.8;
}

.swiper-produkty {
    padding-top: 50px;
    padding-bottom: 50px;
}

.swiper-produkty .swiper-wrapper {
    padding-top: 100px;
    padding-bottom: 100px;
    min-height: 340px;
}

.swiper-produkty .produkty-menu {
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 20px;
    padding-bottom: 20px
}

.swiper-produkty .produkty-menu-item {
    display: block;
    width: 200px;
    text-align: center;
    padding-top: 40px;
    font-size: 1rem;
    font-weight: 600;
    font-family: var(--font-primary);
    text-transform: uppercase;
    color: var(--color-darkblue);
    cursor: pointer;
    position: relative;
}

.swiper-produkty .produkty-menu-item::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 300px;
    z-index: -1;

}

@media (max-width: 991px) {

    .swiper-produkty {
        padding-top: 0;
    }

    .swiper-produkty .produkty-menu {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-content: left;
        justify-items: left;
        padding-top: 0;
        padding-bottom: 20px
    }

    .swiper-produkty .produkty-menu-item {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        text-align: center;
        padding-top: 8px;
        padding-bottom: 8px;
        position: relative;
        justify-items: center;
        justify-content: center;
        color: #fff;
    }

    #produkty-losos .swiper-produkty .produkty-menu-item::before {
        content: '';
        background-image: none !important;
        background-color: #cd3f17;
    }

    #produkty-losos .swiper-produkty .produkty-menu-item {
        border-top: 1px solid rgba(205, 63, 23, 0.7);
    }

    #produkty-ryby_pelagiczne .swiper-produkty .produkty-menu-item::before {
        content: '';
        background-image: none !important;
        background-color: #1f4160;
    }

    #produkty-ryby_pelagiczne .swiper-produkty .produkty-menu-item {
        border-top: 1px solid rgba(30, 65, 95, 0.7);
    }

    #produkty-ryby_biale .swiper-produkty .produkty-menu-item::before {
        content: '';
        background-image: none !important;
        border-top: 1px solid rgba(0, 134, 117, 0.7);
        background-color: #008675;
    }

    #produkty-ryby_biale .swiper-produkty .produkty-menu-item {
        border-top: 1px solid rgba(0, 134, 117, 0.7);
    }

    #produkty-maczka_i_olej .swiper-produkty .produkty-menu-item::before {
        content: '';
        border-top: 1px solid rgba(107, 129, 135, 0.7);
        background-image: none !important;
        background-color: #6b8187;
    }

    #produkty-maczka_i_olej .swiper-produkty .produkty-menu-item {
        border-top: 1px solid rgba(107, 129, 135, 0.7);
    }
}

.swiper-produkty .produkty-menu-item a {
    opacity: 0.5;
}

.swiper-produkty .produkty-menu-item.slideToActive a {
    opacity: 1;
}


.swiper-produkty .produkty-menu-item::before {
    background-image: url(img/swiper-line-inner1.svg);
}

.swiper-produkty .produkty-menu-item:first-of-type::before {
    background-image: url(img/swiper-line-start1.svg);
}

.swiper-produkty .produkty-menu-item:last-of-type::before {
    background-image: url(img/swiper-line-end1.svg);
}

.produkty-header #ico_swieze path {
    fill: #fff;
}

.produkty-header #ico_mrozone path {
    fill: #fff;
}

.produkty-header svg {
    height: 20px;
    transform: translateY(-1px);
}


.produkty-header div {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-top: 15px;
}

.produkty-header div i {
    color: var(--color-offwhite);
    font-size: 30px;
    padding-top: 5px;
}

.produkty-header div p {
    color: var(--color-offwhite);
    padding: 0 0 0 10px;
}


.swiper-produkty .swiper-slide {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.produkty-item {
    text-align: center;
    min-width: 250px;
    padding-bottom: 50px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.produkty-item h1 {
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    padding-top: 20px;
}

.produkty-item .image_wrapper {
    width: 100%;
    display: block;
    height: 100%;
}

.produkty-item .image_wrapper img {
    max-width: 100%;
}


.icons #ico_swieze path {
    fill: var(--color-green);
}

.icons #ico_mrozone path {
    fill: #0063c9;
}

.icons svg {
    height: 20px;
    transform: translateY(-1px);
}

.icons {
    text-align: center;
    font-family: var(--font-primary);
    font-size: 0.8rem;
    color: var(--color-darkblue);
    text-transform: none;
    font-weight: 500;
    margin: 0;
    min-height: 60px;
}

.wpls-fix-box {
    position: relative;
    transition: all .2s ease-in-out;
}


.wpls-fix-box::after {
    content: '\f56d';
    color: #000;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    text-decoration: none;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    pointer-events: none;
    transition: opacity .2s ease-in-out;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    font-size: 50px;
}

.wpls-fix-box:hover::after {
    opacity: 1;
}

/* Pliki do pobrania */

#do_pobrania {
    padding-top: 200px;
    background-image: url('img/watermark_szary.svg');
    background-repeat: no-repeat;
    background-size: clamp(700px, 60vw, 1100px);
    background-attachment: fixed;
    background-position: bottom right;

}

#do_pobrania h1 {
    font-family: var(--font-primary);
    font-size: 3rem;
    text-transform: uppercase;
    width: 100%;
    color: var(--color-darkblue);
    font-weight: 600;
}

#do_pobrania h2 {
    font-size: 1.8rem;
    text-align: left;
    color: var(--color-darkblue);
    padding-top: 50px;
    padding-bottom: 15px;

}

@media (max-width:575px) {
    .row.dokumenty-table {
        padding-left: 15px;
        padding-right: 7px;
    }
}

@media (max-width: 991px) {
    .download .opis {
        padding-left: 10px;
    }


}

.container.download {
    padding-bottom: 80px;
}

.download .ikona {
    display: flex;
    align-items: center;
    justify-items: center;
    justify-content: center;
    padding: 10px 0 10px 0;
    min-height: 20px;
}

.download .opis {
    display: flex;
    align-items: center;
    justify-content: left;
    justify-items: left;
    min-height: 20px;
}

.download .opis a {
    font-family: var(--font-primary);
    font-size: 1.1rem;
    color: var(--color-darkblue);
    text-decoration: none;
}

.download .opis a:hover {
    text-decoration: underline;
}

.download .rozmiar {
    display: flex;
    align-items: center;
    justify-content: right;
    justify-items: right;
    min-height: 20px;
}

.download .typ {
    display: flex;
    align-items: center;
    justify-content: right;
    justify-items: right;
    min-height: 20px;
}

.download .ikona img {
    height: 45px;
}

.nasze_wartosci {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    height: fit-content;
}

.nasze_wartosci em {
    font-style: normal !important;
}

@media (max-width: 767px) {
    .nasze_wartosci em {
        font-style: normal;
        display: none;
    }
}


.nasze_wartosci li {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: space-between;
    padding: 15px 0 15px 0;
}

.nasze_wartosci li span:last-of-type {
    text-align: right;
    color: var(--color-darkblue);
    font-size: 1rem;
    text-transform: none;
    font-weight: 600;
    padding-left: 10px;
}

.nasze_wartosci li .separator {
    margin-left: 10px;
    width: unset;
    flex-grow: 1;
    height: 2.18px !important;
}

.nasze_wartosci li span:first-of-type {
    font-family: var(--font-primary);
    font-weight: 700;
    text-align: left;
    color: var(--color-darkblue);
    text-transform: uppercase;
    position: relative;
    padding-left: 10px;
}

.nasze_wartosci {
    counter-reset: segment 0;
}

.nasze_wartosci li span:first-of-type::before {
    counter-increment: segment;
    content: "0" counter(segment);
    display: block;
    position: absolute;
    top: -20px;
    left: -10px;
    line-height: 63px;
    font-weight: 800;
    font-family: var(--font-primary);
    font-size: 5rem;
    opacity: 0.07;
}

.modal-video-container {
    display: none;
    align-items: center;
    justify-content: center;
    justify-items: center;
    padding: 0;
    margin: 0;
    position: fixed;
    z-index: 998;
    left: 0;
    top: 0;
    width: 100%;
    height: 100dvh;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.8);
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, visibility 0s linear 0.3s;
}

.modal-video-content {
    position: relative;
    display: flex;
    flex-direction: column;
    pointer-events: auto;
    background-clip: padding-box;
    outline: 0;
    transform: scale(0.75);
    transition: transform 0.3s ease-in-out;
}

.modal-video-container.show {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, visibility 0s linear 0s;
}

.modal-video-container.show .modal-video-content {
    transform: scale(1);
}

.modal-video-cross {
    position: absolute;
    right: 2%;
    top: 2%;
    font-size: 2rem;
    color: #fff;
    z-index: 999;
}

@media (max-width: 767px) {
    .modal-video-content {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .modal-video-content {
        width: 80%;
    }
}

.draggable-cursor {
    cursor:
        url(img/draggable-cursor.png) 24 24,
        grab;
}



/*     W E G L O T     */
/*
.country-selector.weglot-dropdown,
.country-selector.weglot-dropdown ul,
.country-selector.weglot-dropdown .wgcurrent {
    background-color: transparent;
    border: none;
}

.country-selector.weglot-dropdown span,
.country-selector.weglot-dropdown .wgcurrent span {
    padding-right: 10px;
}

.country-selector.weglot-dropdown .wgcurrent:after {
    display: none;
}
*/

.country-selector.weglot-dropdown,
.country-selector.weglot-dropdown ul,
.country-selector.weglot-dropdown .wgcurrent {
    background-color: transparent;
    border: none;
}

.country-selector.weglot-dropdown span,
.country-selector.weglot-dropdown .wgcurrent span {
    padding-right: 10px;
}

.country-selector.weglot-dropdown .wgcurrent:after {
    display: none;
}

aside label {
    display: none !important;
}

.weglot-flags>a:before,
.weglot-flags>span.wglanguage-name:before {
    margin-right: -10px !important;
    margin-top: -5px !important;
}


.country-selector {
    z-index: inherit !important;
}

.weglot-flags>a:before,
.weglot-flags>span.wglanguage-name:before {
    background-size: auto 18px !important;
    height: 18px !important;
}

#navbar_top .country-selector ul li.weglot-flags a[class*="weglot-language-"]::before {
    width: 24px !important
}

.weglot-flags.flag-0.en>a:before,
.weglot-flags.flag-0.de>a:before,
.weglot-flags.flag-0.pl>a:before {
    width: 24px !important;
    height: 18px !important;
}


@media (max-width: 991px) and (min-width: 0) {

    .country-selector.weglot-dropdown span::before,
    .country-selector.weglot-dropdown .wgcurrent span::before {
        display: none;
    }
}

@media (max-width: 1199px) {
    .country-selector a {
        padding-left: 0 !important;
        padding-right: 20px;
    }

    .country-selector {
        margin-top: 15px !important
    }
}


/* see more products */
.see-more-products {
    width: 100px;
    height: 100px;
    display: flex;
    background: rgba(0, 14, 31, 0.85);
    flex-direction: column;
    align-items: center;
    justify-self: center;
    justify-content: center;
    position: fixed;
    top: 40%;
    transform: translateX(-100%);
    transition: transform .3s ease-in-out;
    z-index: 200;
}

@media (max-width: 768px) {
    .see-more-products {
        display: none;
    }
}

.see-more-products>* {
    width: 100%;
    text-align: center;
    color: var(--color-offwhite);
}

.see-more-products span {
    text-transform: uppercase;
    font-family: var(--font-primary);
    font-size: 11px;
    padding-bottom: 3px;
}

.see-more-products i {
    font-size: 25px;
}

.see-more-products .fa-chevron-down {
    animation: bump .5s infinite ease-in-out alternate;
}

@keyframes bump {
    100% {
        transform: translate3d(0, 10px, 0);
    }
}

#tekstowy {
    padding-top: 200px;
    background-image: url('img/watermark_szary.svg');
    background-repeat: no-repeat;
    background-size: clamp(700px, 60vw, 1100px);
    background-attachment: fixed;
    background-position: bottom right;
}

#tekstowy .wp-block-heading {
    padding: 30px 0;
}

#tekstowy a {
    color: inherit;
}