@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap');

html,body{
    padding: 0;
    margin: 0;
    font-family: Source Sans Pro, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 19.6px */
}
.demo{
    position: absolute;
    transform: rotate(0deg);
    color: #bc0000;
    font-size: 3rem;
    font-weight: 700;
    border: 0.25rem solid #c30909;
    display: inline-block;
    padding: 0.25rem 1rem;
    text-transform: uppercase;
    border-radius: 1rem;
    font-family: 'Courier';
    -webkit-mask-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/8399/grunge.png);
    -webkit-mask-size: 944px 604px;
    mix-blend-mode: multiply;
    scale: 0.5;
    margin: 31px 16px;
    top: 19px;
}
.maincontent{
    width: 1376px;
}
.menu ul li a{
    text-decoration: none;
    color: #ffffff;
}
.banner{
    width: 100%;
    height: 740px;
    background: url("assets/bannermain.jpg") no-repeat;
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.name{
    text-align: center;
    color: var(--WHITE, #FFF);
    leading-trim: both;
    text-edge: cap;
    font-family: Source Sans Pro, sans-serif;
    font-size: 80px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}
.name2{
    color: var(--WHITE, #FFF);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-family: Source Sans Pro, sans-serif;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: uppercase;
}
.mainsearch{
    padding-left: 40px;
    margin: 40px auto 0;
}
.fullwidth{
    width: 100% !important;
}
.search{
    padding-left: 40px;
    width: 987px;
    display: flex;
    height: 81px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 100px;
    background: #FFF;
    box-shadow: 0px 12px 64px 0px rgba(0, 0, 0, 0.20);
    flex-direction: row;
    flex-wrap: nowrap;
}
.search input{
    padding-left: 20px;
    width: calc(100% - 40px);
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-family: Source Sans Pro, sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 100;
    line-height: normal;
}
.search input, .search select{

    height: 80px;
    background: transparent;
    border: none;
}
input:focus-visible{
    outline: none !important;
}
.search button{
    cursor: pointer;
    width: 181px;
    display: flex;
    padding: 23px;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    border: 4px solid var(--WHITE, #FFF);
    background: var(--GRADIENT, linear-gradient(90deg, rgba(100, 99, 190, 0.70) 0%, rgba(16, 189, 111, 0.70) 100%));
    color: var(--WHITE, #FFF);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-family: Source Sans Pro, sans-serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 100;
    line-height: normal;
}
.location{
    height: 20px;
    padding: 20px;
    width: 183px;
    display: flex;
    border-left: 2px solid #000;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}
.mainbutton:hover{
    color: #ffffff;
    border: 1px solid #045db5;
    background: #045db5;
    border-left: unset;
}
.mainbutton:hover i{
    color: #045db5;
}
.mainbutton{
    padding: 0 10px 0 0;
    border: 1px solid #0c84ff;
    background: #0c84ff;
    display: flex;
    gap: 10px;
    color: #ffffff;
    height: 30px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    min-width: 151px;
    border-left: unset;
}
.mainbutton i{
    background: #ffffff;
    flex: 0 0 30px;
    color: #0c84ff;
    height: 30px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 30px;
}
.mainbuttongreen{
    padding: 0 10px 0 0;
    border: 1px solid #013717;
    background: #02632a;
    display: flex;
    gap: 10px;
    color: #ffffff;
    height: 30px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    min-width: 151px;
}
.mainbuttongreen i{
    background: #ffffff;
    flex: 0 0 30px;
    color: #02632a;
    height: 28px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 30px;
}
.mainbuttongreen:hover{
    color: #ffffff;
    border: 1px solid #013717;
    background: #013717;
}
.mainbuttongreen:hover i{
    color: #013717;
}
.mainbuttongray{
    padding: 0 10px 0 0;
    border: 1px solid #585958;
    background: #585958;
    display: flex;
    gap: 10px;
    color: #ffffff;
    height: 30px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    min-width: 151px;
}
.mainbuttongray i{
    background: #ffffff;
    flex: 0 0 30px;
    color: #585958;
    height: 28px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 30px;
}

.mainbuttonred{
    padding: 0 10px 0 0;
    border: 1px solid #D50000;
    background: #D50000;
    display: flex;
    gap: 10px;
    color: #ffffff;
    height: 30px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    min-width: 151px;
}
.mainbuttonred i{
    background: #ffffff;
    flex: 0 0 30px;
    color: #D50000;
    height: 28px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 30px;
}
.userbox{
    background: #494e53;
    border-radius: 10px;
    padding: 10px;
    color: #fff;
}
.userbox .d-block{
    color: #fff;
    font-weight: 500;
}
.userbox .rola{
    font-weight: 100;
    color: #aca8a8;
}
.flex{
    display: flex;
    gap: 10px;
}
.footer{
    width: 100%;
    background: #2D2D2D;
    padding: 80px 0;
}
.footerarea{
    display: flex;
    gap: 10px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: space-between;
    align-items: flex-start;
}
.foot1{
    margin-top: 31px;
    opacity: 0.8;
    color: var(--WHITE, #FFF);
    leading-trim: both;
    text-edge: cap;
    font-family: Source Sans Pro, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
}
.foot1 strong{
    color: var(--WHITE, #FFF);
    leading-trim: both;
    text-edge: cap;
    font-family: Source Sans Pro, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%; /* 22.4px */
    text-transform: uppercase;
}
.center-div{
    margin: 0 auto;
}
.greenhead{
    color: var(--green, #10BD6F);
    leading-trim: both;
    text-edge: cap;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.footmenu ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
.footmenu ul li, .footmenu ul li a{
    text-decoration: none;
    margin-top: 36px;
    color: var(--WHITE, #FFF);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.kat-blok{
    display: flex;
    width: 155px;
    height: 163px;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
}
.inkat{
    text-align: center;
    max-width: 143px;
}
.kat-blok .inkat img{
    margin-top: 24px;
    width: 60.75px;
    height: 60px;
    flex-shrink: 0;
    aspect-ratio: 60.75/60.00;
}
.kat-blok .inkat p{
    color: var(--BLACK, #2D2D2D);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.kat-blok{
    border-radius: 8px;

    background: #FFF;
/* CIEN BRANZE */
    box-shadow: 0px 10px 34px 0px rgba(0, 0, 0, 0.10);
}
.inforow{
    width: 100%;
    border-bottom: 1px solid #2D2D2D;
    margin: 40px 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
}
#kategorie{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.doublespace{
    padding-top: 70px;
}
.firmarow{
    width: 100%;
    display: flex;
    border-bottom: 1px solid rgba(45, 45, 45, 0.40);
    max-width: 668px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: space-between;
    align-items: center;
    padding: 30px 0;
}
.firmatext{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    flex-shrink: 0;
}
.firmalogo{
display: flex;
}

.firmalogo img{
    max-height: 58px;
    max-width: 202px;
}
.f-txt1{
    width: 445px;
    height: 25px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
}
.f-txt1, .f-txt1 a{
    text-decoration: none !important;
    align-self: stretch;
    color: var(--BLACK, #2D2D2D) !important;
    leading-trim: both;
    text-edge: cap;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 25.2px */
}
.f-txt2{
    align-self: stretch;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 19.6px */
}
.f-txt3{
    width: 445px;
    height: 22px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    align-self: stretch;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 19.6px */
}
.margin40{
    margin-top: 54px !important;
}
.polecane-firmy{
    width: 100%;
    margin-top: 100px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0 40px
}
.polecane-firmy2{
    width: 100%;
    margin-top: 108px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0 40px
}
.polecane-left, .polecane-right{
    width: calc(50% - 20px);
}
.potencjal-banner{
    margin-top: 110px;
}
.potencjal-flex{
    max-width: 911px;
    margin-top: -90px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    gap: 20px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: space-between;
    align-items: center;
}
.potencjal-box{
    display: flex;
    width: 213px;
    padding: 30px 16px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    border-radius: 8px;
    border-bottom: 4px solid var(--GRADIENT, #6463BE);
    background: var(--WHITE, #FFF);

    /* CIEN BRANZE */
    box-shadow: 0px 10px 34px 0px rgba(0, 0, 0, 0.10);
}
.potencjal-box-1{
    display: flex;
    gap: 10px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
}
.potencjal-box-1 span{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.potencjal-box-1 span small{
    font-size: 34px !important;
}
.potencjal-box2{
    height: 12px;
    align-self: stretch;
    color: var(--BLACK, #2D2D2D);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.opisy{
    margin-top: 120px;
    display: flex;
    gap: 70px;
}
.opis1{
    width: 100%;
    max-width: 467px;
}
.opis2{
    width: 100%;
    max-width: 787px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 40px;
}
.opis1a{
    color: var(--BLACK, #2D2D2D);
    font-size: 34px;
    font-style: normal;
    font-weight: 600;
    line-height: 48px;
}
.opis1a span{
    color: var(--green, #10BD6F);
    font-size: 34px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.opis1b{
    margin-top: 9px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
}
.roundhref{
    text-decoration: none;
    display: inline-flex;
    height: 50px;
    padding: 0 30px;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 100px;
    border: 2px solid #000;
    color: var(--BLACK, #2D2D2D);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.opis-mrg{
    margin-top: 49px;
}
.opis2-box{
    height: 38px;
    width: 100%;
    max-width: 230px;
    display: flex;
    gap: 16px;
}
.opis2-box span{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap; 
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}


.smallsearch{
    margin-top: 82px;
    background: linear-gradient(90deg, rgba(100, 99, 190, 0.30) 0%, rgba(16, 189, 111, 0.30) 100%);
    box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.30) !important;
    backdrop-filter: blur(10px) !important;
    width: 100%;
    height: 121px;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    position: relative;
}
.zostanczonkiem {
    margin-top: 100px;
    width: 100%;
    height: 184px;
    flex-shrink: 0;
    background: linear-gradient(90deg, rgba(100, 99, 190, 0.30) 0%, rgba(16, 189, 111, 0.30) 100%);
    position: relative;
    z-index: 1;
}

.zostanczonkiem::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    width: 100%;
    background: linear-gradient(90deg, rgba(100, 99, 190, 0.70) 0%, rgba(16, 189, 111, 0.70) 100%);
    z-index: 2;
}
.zostanczonkiem-box{
    height: 184px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}
.zcb-1 span{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.zcb-1a span{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%; /* 25.2px */
}
.zcb-1a{
    margin-top: 30px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
}
.zcb-2 a{
    gap: 16px;
    text-decoration: none;
    color: var(--WHITE, #FFF);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    width: 538px;
    height: 81px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    background: var(--GRADIENT, linear-gradient(90deg, rgba(100, 99, 190, 0.70) 0%, rgba(16, 189, 111, 0.70) 100%));
    box-shadow: 0px 12px 64px 0px rgba(0, 0, 0, 0.20);
    flex-direction: row;
    flex-wrap: nowrap;

}
.barverticle{
    margin: 0 10px;
    width: 2px;
    height: 44px;
    border-left: 2px solid var(--WHITE, #FFF);
    opacity: 0.4;
}
.pff-head{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 13px;
    border-bottom: 1px solid hsl(0deg 0% 17.65% / 40%)
}
.pff-head-1{
    display: flex;
    gap: 14px;
}
.pff-head-1a{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
}
.pff-head-1a span{
    color: #9751A6;
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}
.pff-head-2 a{
    min-width: 187px;
    text-decoration: none;
    display: inline-flex;
    height: 50px;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 100px;
    border: 2px solid #000;
    color: var(--BLACK, #2D2D2D);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
}
.cyan{
    color: #2D7E9C !important;
}
.smallheight{
    height: 100px !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}
.newletter1{
    max-width: 185px;
    display: flex;
    height: 50px;
    padding: 0px 20px;
    align-items: center;
    gap: 20px;
    border-radius: 100px;
    border: 2px solid #000;
    gap: 20px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%; /* 36px */
    text-transform: uppercase;
}
.subme{
    color: rgba(50, 51, 47, 0.80);
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 36px */
}
.nw1{
    display: flex;
    gap: 20px;
    align-items: center;
}
.nw2{
    display: flex;
    width: 538px;
    height: 50px;
    padding: 0px 20px;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 200px;
    border: 2px solid var(--green, #10BD6F);
    background: var(--WHITE, #FFF);
}
.nw2 input{
    border: none;
    width: 100%;
}
.nw2 button{
    color: var(--BLACK, #2D2D2D);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    width: 165px;
    border-radius: 100px;
    background: var(--green, #10BD6F);
    display: inline-flex;
    height: 50px;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    margin-right: -20px;
    text-align: center;
    justify-content: center;
}
.flex-nw{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-around;
    align-items: center;
}
#mapa {
    width: 100%;
    height: 600px;
}

.leaflet-top.leaflet-right {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-right: 10px;
}

.custom-control-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
}

.custom-button {
    background-color: transparent;
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    cursor: pointer;
    border-radius: 4px;
    min-width: 120px;
    transition: background-color 0.3s;
}
.leaflet-top.leaflet-right {
    margin-top: 148px;
}


.leaflet-control-custom {
    background: white;
    padding: 4px;
    border-radius: 4px;
}
.icons-wiz{
    max-width: 640px;
    display: flex;
    gap: 8px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
}
.mapbuuton1{
    text-decoration: none;
    display: flex;
    padding: 12px 20px;
    align-items: center;
    gap: 10px;
    border-radius: 8px;
    background: rgba(45, 45, 45, 0.10);
    color: var(--BLACK, #2D2D2D) !important;
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 22.4px */
}
.wiz-a{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 28px */
}
.wiz-b{
    margin:19px 0;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
}
.leaflet-popup-content{
    width: 383px !important;
}
.leaflet-popup-content-wrapper {
    border-radius: 0px;
}
.ontopmap{
    left: 272px;
    margin-top: 84px;
    position: absolute;
    width: 432px;
    height: 432px;
    flex-shrink: 0;
    fill: rgba(255, 255, 255, 0.60);
    filter: drop-shadow(0px 10px 40px rgba(0, 0, 0, 0.28));
    backdrop-filter: blur(10px);
    z-index: 2000;
    border-radius: 8px;
    box-shadow: 2px 2px 14px #353535;
    overflow: hidden;
}
.ontopmap-1{
    width: 402px;
    height: 115px;
    padding-left: 30px;
    background: #ffffff;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
}
.ontopmap-1 img{
    max-height: 100px;
    max-width: 372px;
}
.ontopmap-2{
    padding: 25px 30px;
    display: flex;
    gap: 8px;
    width: 372px;
    height: 267px;
    background: lch(93.75% 0 139.09 / 0.51);
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
}
.ontopmap-2a{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%; /* 28.6px */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
  }
.ontopmap-2b{
    padding: 12px 14px;
    gap: 10px;
    display: flex;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 22.4px */
    border-radius: 8px;
    background: rgba(45, 45, 45, 0.10);
 }
.leftcontent{
    width: 904px;
}
.rightcontent{
    width: 432px;
}
.wiz-head{
    width: 100%;
    padding-top: 70px;
    padding-bottom: 14px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(45, 45, 45, 0.40);
}
.qrcodearea{
    margin-top: 40px;
    width: 374px;
    min-height: 382px;
    flex-shrink: 0;
    border-radius: 8px;
    border: 1px solid rgba(45, 45, 45, 0.40);
    background: var(--WHITE, #FFF);
    padding: 29px 45px;
}
.flexme{
    display: flex;
    gap: 40px;
}
.qr-1{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
}
.qr-2{
    margin-top: 20px;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
}
.qr-3{
    display: flex;
    text-align: center;
    margin: 36px auto;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.qr-4{
    cursor: pointer;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 22.4px */
    display: flex;
    width: calc(100% - 41px);
    height: 42px;
    padding: 0px 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    border-radius: 8px;
    background: rgba(45, 45, 45, 0.10);
}
.katrow{
    display: flex;
    gap: 10px;
}
.katrow .kat-blok{
    transform: scale(0.7);
}
.carousel-container {
    position: relative;
    overflow: hidden;
    padding: 10px 0;
}

.carousel {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-behavior: smooth;
    padding: 8px 0;
}

/* GALERIA */
#galeria .carousel-item {
    flex: 0 0 auto;
    width: 432px;
    height: 314px;
    border-radius: 8px;
    overflow: hidden;
    background: #f8f8f8;
    position: relative;
}

#galeria .carousel-item img {
    width: 432px;
    height: 314px;
    object-fit: cover;
    border-radius: 8px;
}

#galeria .carousel-caption {
    position: absolute;
    bottom: 8px;
    left: 12px;
    background: rgba(0,0,0,0.5);
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 13px;
}

/* PRODUKTY */
#produkty .carousel-item {
    flex: 0 0 auto;
    width: 314px;
    border-radius: 8px;
    text-align: center;
    overflow: hidden;
    padding: 8px;
}

#produkty .carousel-item img {
    width: 314px;
    height: 314px;
    object-fit: contain;
    border-radius: 8px;
    background: white;
}

#produkty .carousel-caption {
    margin-top: 8px;
    font-size: 14px;
    color: #333;
    text-align:left;
}

.carousel-btn {
    width: 42px;
    height: 42px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: white;
    border: none;
    padding: 8px 12px;
    font-size: 20px;
    cursor: pointer;
    z-index: 10;
    opacity: 0.8;
    border-radius: 8px;
    background: rgba(45, 45, 45, 0.60);
}

.carousel-btn:hover {
    opacity: 1;
}

.carousel-btn.prev {
    left: 0;
}

.carousel-btn.next {
    right: 0;
}
#produkty .carousel-caption strong{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%; /* 28px */
}
#produkty .carousel-caption small{
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 22.4px */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
}
.inputgroup{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
}

.autocomplete-box {
    position: absolute;
    background: #fff;
    /*border: 1px solid #ccc;*/
    z-index: 1000;
    max-height: 200px;
    overflow-y: auto;
    width: 100%;
    max-width: 640px;
    margin-top: 80px;
}

.autocomplete-box div {
    padding: 10px;
    cursor: pointer;
}

.autocomplete-box div:hover {
    background-color: #f0f0f0;
}
.katalog-1{
    overflow: hidden;
    width: 100%;
    max-width: 904px;
    height: auto;
    border-radius: 8px;
    border: 2px solid rgba(45, 45, 45, 0.20);
    background: var(--WHITE, #FFF);
    padding: 20px;
}
.katalog-head{
    display: flex;
}
.katalog-head-dane{
    width: 653px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    border-bottom: 1px solid #2D2D2D;
    padding-bottom: 18px;
}
.katalog-head-logo{
    display: flex;
}
.katalog-head-logo {
    width: 202px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.katalog-head-logo img {
    max-height: 100%;
    max-width: 100%;
    height: auto;
    width: auto;
}

.katalog-body{
    padding-top: 1px;
    max-width: 640px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
}
.katalog-foot{
    padding-top: 18px;
}
.katalog-list{
    display: flex;
    gap: 20px;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    margin-top: 20px;
}
.leftwiz{
    justify-content: flex-start !important;
}
.katalog-foot{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
}
.katalog-foot-cta a{
    color: var(--BLACK, #2D2D2D);
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    border-radius: 100px;
    border: 2px solid rgba(45, 45, 45, 0.20);
    text-decoration: none;
    display: flex;
    width: 203px;
    height: 42px;
    padding: 0 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.wyniki-info{
    display: flex;
    color: var(--BLACK, #2D2D2D);
    leading-trim: both;
    text-edge: cap;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
    gap: 18px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    margin-top: 20px;
}
#kategorie a{
    text-decoration: none;
}
.katalog-head-polecana{
    margin-bottom: 10px;
    gap: 10px;
    color: var(--WHITE, #FFF);
    leading-trim: both;
    text-edge: cap;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
    letter-spacing: 4.2px;
    display: flex;
    padding-left: 16px;
    width: calc(100% + 24px);
    height: 32px;
    margin-top: -20px;
    background: var(--GRADIENT, linear-gradient(90deg, rgba(100, 99, 190, 0.70) 0%, rgba(16, 189, 111, 0.70) 100%));
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    margin-left: -20px;
}
#ofirmie p{
    text-edge: cap;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 30.8px */
}
#ofirmie p strong{ 
    font-weight: 600;
 }