body {
	background: #F7F6F4;
	color: #111111;
	font-size: 14px;
	font-family: 'Inter', sans-serif;
    overflow-x: hidden !important;
    line-height: 1.2;
    font-weight: 400;
    width: 100% !important;

}

/* OGÓLNE */

.bg-body{
    background: #F7F6F4;
}

.p-mobile{
display: none;
position: relative;
}
.p-deskt{
display: block;
position: relative;
}

#swiatlo{
    width: 100vw;
    overflow: hidden !important;
}

.wrapper{
    width: calc(100% - 60px);
    margin: 0 30px;
    position: relative;
}

.bg-dark{
    background: #fff;
    
    padding: 50px 0;
}

.odstp{
    margin: 50px 0;
}

.flex-start{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
}



.flex-50{
    width: 48%;
}


.h1{
    font-size: 48px;
    margin: 0 0 40px 0;
    font-weight: 600;
    position: relative;
}


.h2{
    font-size: 38px;
    margin: 20px 0;
    font-weight: 600;
    position: relative;
}

.h3{
    font-size: 26px;
    margin: 1em 0;
    font-weight: 600;
    position: relative;
}


.h4{
    font-size: 18px;
    margin: 1em 0;
    font-weight: 600;
    position: relative;
}

.subtyt{
    text-transform: uppercase;
    text-decoration: underline;
}

.upc{
    text-transform: uppercase;
}



.fkolor{
    color: #fff;
}
.bkolor{
    color: #111111;
}


#Popup-Bg{
    position: fixed;
    top: 110px;
    width: 0;
    z-index: 10000000;
    width: 100vw;
    height: calc(100vh - 110px);
    /* backdrop-filter: blur(2px);
    background: #ffffffd8;  */
    background: #fff;
    display: none;
    overflow-y: auto;
}

#ClosePopup{
    position: fixed;
    z-index: 2;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #fff;
    border: solid 1px #eae9e6;
    top: 120px;
    right: 24px;
    cursor: pointer;
}


#ClosePopup:before { 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: 8px;
        top: 5px;
}



.more{
   margin: 30px 0 0 0;
display: block;
min-width: 80px;
padding: 0 20px;
width: fit-content;
max-width: 100%;
height: 40px;
line-height: 40px;
text-align: center;
cursor: pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
   -webkit-transition: all 400ms ease-in;
   -moz-transition: all 400ms ease-in;
   -ms-transition: all 400ms ease-in;
   -o-transition: all 400ms ease-in;
   transition: all 400ms ease-in; 

}
.more:hover{  
    text-decoration: none;
 }

.morew{
   background: #F7F6F4;
   color: #111111;
}
.morew:hover{
    background: #dfdfdf;
}
.moreb{
   background: #111111;
   color: #fff;
}
.moreb:hover{
background: #424242;
}

.morectr{
     margin: 30px auto 0 auto;
}

.morebr{
   border: solid 1px #fff;
   color: #fff;
}

.moreu{
    text-decoration: underline;
    font-weight: 400;
    margin-left: 10px;
}



.moreplus{
    display: block;
    -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-weight: 400;
font-size: 14px;
line-height: 21px;
height: 21px;
position: absolute;
right: 0;
top: 0;
width: 36px;
height: 36px;
line-height: 36px;
background: #eae9e6;
padding: 0 0 0 36px;
overflow: hidden;
        -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    transition: all 300ms ease-in; 
}

.moreplus:before { 
        content: "\e145"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 26px;
        left: 6px;
        top:0;
}

.moreplus:hover{
    width: fit-content;
    padding: 0 10px 0 36px;
            -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    transition: all 300ms ease-in; 
}


.moreplustop{
bottom: auto;
top: -40px;  
}

.moreplustoptab{
bottom: auto;
top: -12px;  
}

.seemore{
font-weight: 400 !important;
font-size: 12px !important;
color: #8B2F3C !important;
font-style: italic;
position: relative;
}

.seemore:before{
  content: "\e145"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-style: normal;
        font-size: 15px;
        right: -18px;
        top: 0;
}


  .przesl{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    z-index: 0;
}



.Info2{
    background: #db0000;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: 100;
    margin-top: 30px;
    
    }
    
    
    
    .Info2 a{
    color: #fff;
    display: block;
    padding: 40px 30px;
    }
    
    
    .Info2 a:hover{
    text-decoration: none;
    }
    .InfoOK{
        background: #fff;
        border: solid 1px #eae9e6;
        text-align: center;
        position: relative;
        z-index: 100;
        width: 100%;
        padding: 30px;
        margin: 40px 0;
        
        }

        .InfoOK b{
            font-weight: 700;
        }

        .InfoOK a{
            display: block;
            width: 100%;
            height: 100%;
             text-decoration: none;
        }

        .InfoOK a:hover{
            text-decoration: none;
        }

.Info{
    background: #db0000;
    color: #fff;
    font-size: 13px;
    text-align: left;
    position: relative;
    z-index: 100;
    width: 100%;
    padding: 10px 25px;
    margin: 30px 0;
    border-radius: 3px;
}

.InfoWyr{
    background: #6b8266;
    color: #fff;
    font-size: 13px;
    text-align: center;
    position: relative;
    padding: 10px 25px;
    margin: 10px 0 20px 0;
    border-radius: 3px;
}


/* END OGÓLNE */

/* TOP */


#Top{ 
    width: 100%;
   height: 110px;
   position: sticky;
   top: 0;
   z-index: 1000;
   background: #F7F6F4;
   border-bottom: 1px solid #eae9e6;
    -webkit-transition: all 400ms ease-in;
    -moz-transition: all 400ms ease-in;
    -ms-transition: all 400ms ease-in;
    -o-transition: all 400ms ease-in;
    transition: all 400ms ease-in; 
}


#topbelka{
    background: #eae9e6;
    height: 40px;
    width: 100%;
    line-height: 40px;
    text-align: left;
    font-size: 13px;
    overflow: hidden;
    position: relative;
}
#topbelka b, #topbelka strong{
    font-weight: 600;
}

#topbelka  a{
    display: inline-block;
    height: 30px;
    position: relative;
}
#topbelka  a:before { 
        content: "\e5e1"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 13px;
        right: -15px;
        top: 1px;
}

.marquee-wrapper {
            display: flex;
            white-space: nowrap;
            will-change: transform;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
        }

        /* Styl tekstu */
        .marquee-text {
            padding-right: 200px; /* odstęp między powtarzającymi się blokami */
            display: inline-block;
        }


#Top-icons{
    position: absolute;
    right: 0;
    top: 20px;
    height: 30px;
    z-index: 1;
}

#Top-icons > div, #Top-icons > a{
display: inline-block;
cursor: pointer;
position: relative;
width: 30px;
height: 30px;
line-height: 30px;
margin: 0 0 0 5px;
}
#Top-icons > div span{
font-size: 28px;
}



#Top-cart:before { 
        content: "\f1cc"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 28px;
        left: 1px;
        top: 1px;
}

#Top-fav:before{
       content: "\e87d"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 28px;
        left: 1px;
        top: 1px;
}

#Top-login a{
    display: block;
    width: 100%;
    height: 100%;
}

#Top-login:before{
       content: "\e7fd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 28px;
        left: 1px;
        top: 1px;
}
#Top-search:before{
       content: "\e8b6"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 28px;
        left: 1px;
        top: 1px;
}


#i-kosz, #i-fav{
    position: absolute;
    width: 16px;
    height: 16px;
    line-height: 16px;
text-align: center;
font-size: 9px;
    background: #293033;
color: #fff;
    top: -3px;
    right: -3px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}



#panel-mini{
    position: fixed;
    top: 0;
    right: -700px;
    width: 700px;
    background: #fff;
    z-index: 1002;
     height: 100vh;
     overflow-y: hidden; 
     overflow-x: hidden; 
}



#filtr-panel-mini{
        position: fixed;
        width: 100%;
        height: 100vh;
        background-color: rgba(0, 0, 0, 0.50);
        z-index: 1000;
        top: 0;
        left: 0;
        display: none;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}


.panel-mini-inc{
padding: 40px 50px 100px 50px;
height: 100%;
overflow-y: auto;
}

.panel-mini-inc .h3{
    margin: 0 0 40px 0;
    position: relative;
    width: fit-content;

}
.panel-mini-inc .h3 span{
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #111111;
    color: #fff;
    text-align: center;
    line-height: 20px;
    font-size: 13px;
    font-weight: 400;
    position: absolute;
    top: -5px;
    right: -20px;
}

    .closepanelm{
        position: absolute;
        top: 30px;
        right: 50px;
        width: 20px;
        height: 20px;
        cursor: pointer;
    }
    .closepanelm:before{ 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: 8px;
        top: 0;
}






a.pul{
display: block;
min-height: 90px;
padding-bottom: 15px;
margin-bottom: 15px;
position: relative;
border-bottom: 1px solid #eae9e6;
}


.pul .k-img{
    width: 90px;
    height: 90px;
    position: absolute;
    left: 0;
    top: 0;
}

.pul .k-img img{
    width: 100%;
    height: 100%;
  object-fit: cover;
}

.pul p{
    width: calc(100% - 110px);
    margin: 0 0 5px 110px;
    text-align: left;
    position: relative;

}
.pul p.brand{
    text-transform: uppercase;
    font-size: 10px;
}

.pul p.k-cena{
    position: absolute;
    bottom: 15px;
    width: calc(100% - 110px);
}
.pul p.k-cena span{
    display: block;
    top: 0;
    position: absolute;
    right: 0;
    font-weight: 700;
}

.u-del{
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: 5px;
    cursor: pointer; 
}


.u-del:before { 
        content: "\e872"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 20px;
        left: 0;
        top: 0;
}



#k-razem{
padding: 15px 0;
text-align: left;
font-size: 13px;
text-transform: uppercase;
position: relative;
}
#k-razem span{
    display: block;
    position: absolute;
    right: 0;
    top: 15px;
    text-transform: none;
    font-size: 14px;
    font-weight: 700;
}


#kosz-pk{
    display: block;
    text-transform: uppercase;
    text-align: center;
    background: transparent;
    border: solid 1px #293033;
    width: 48%;
    height: 50px;
     line-height: 50px;
    font-size: 15px;
    border-radius: 3px;
}

#dokasy-pk{
    display: block;
    text-transform: uppercase;
    text-align: center;
    background: #293033;
    color: #fff;
    width: 48%;
    height: 50px;
    line-height: 50px;
    font-size: 15px;
    border-radius: 3px;
    margin-bottom: 12px;
}


#panel-mini-bot{
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px 50px;
    width: 100%;
    background: #fff;
}



/* END TOP */



/* MENU */

#MenuNav{
    display: none;
   position: absolute;
   left: -25px;
   top: 15px;
    width: 40px;
    height: 40px;
    cursor: pointer;
}
#MenuNav:before { 
        content: "\e3c7"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: 4px;
        top: 1px;
}

#LogoTop{
   display: block;
   position: absolute;
   left: 0;
   width: 200px;
   height: 70px;
   background: url('../img/dc-logo.svg') no-repeat left; 
   background-size: contain;
}

#nav-przes{
    display: none;
    position: fixed;
    z-index: 9999;
    width: 100%;
    left: 0;
    height: 100vh;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
}


#MenuTop{
    display: block;
    position: relative;
    text-align: center;
    margin: 0 auto;
    padding: 28px 0;
    width: calc(100% - 460px);   
}

#MenuTop li{
    display: inline-block;
    position: relative;
    margin: 0 10px;
}

#MenuTop li a{
    cursor: pointer;
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
        -webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
transition: all 200ms ease-in; 
}
#MenuTop li a:hover{
    color: #959596;
        -webkit-transition: all 400ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
transition: all 200ms ease-in; 
}

#MenuTop ul:last-of-type{
    margin-top: 24px;
}


#MenuTop ul:last-of-type li a{
    font-weight: 400;
}




.MenuMore{
    display: none;
    position: absolute;
    right: -10px;
    top: 10px;
    width: 30px;
    height: 40px;
    z-index: 1;
    cursor: pointer;
}

.MenuMore:before { 
        content: "\e5e1"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        font-weight: 300;
        left: 5px;
        top: 7px;
}

#MenuLogo{
   display: none;
   position: relative;
   width: 100%;
   height: 80px;
   background:  url('../img/dc-logo.svg') no-repeat 40px; 
   background-size: 200px auto;
   cursor: pointer;
   margin-bottom: 30px;
}
#MenuLogo:before { 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        right: 32px;
        top: 21px;
}

#MenuClose{
     height: 40px;
     width: 40px;
     position: absolute;
     right: 24px;
     top: 30px;
     cursor: pointer;
}
#MenuClose:before { 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: 0;
        top: 0px;
}


#MenuTopL{
    position: relative;
}

#MenuTopRes{
    position: relative;
    width: 100%;
    right: 100vw;
    
}

#MenuTopRes-inc{
    padding: 0;
}

#MenuBackH{
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 30px; 
    position: relative;
    background: #111111;
    color: #fff;
    height: 160px;
    width: 100%;
    position: relative;
    background-size: cover;
}
#MenuBackH > div{
    width: 100%;
    height:100%;
    position: relative;
    padding: 40px;
    z-index: 1;
}

#MenuBackH-przes{
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.2);
}

#MenuBack{
    position:absolute;
    left: 40px;
    top: 30px;
    height: 40px;
    width: 40px;
    cursor: pointer;
}

#MenuBack:before { 
        content: "\f1e6"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 30px;
        left: -2px;
        top: 0;
}

#MenuBackH a{
display: inline-block;
position: absolute;
bottom: 30px;
}


#menu-wszystkie{
    display: block;
    text-align: right;
    margin-bottom: 20px;
    text-decoration: underline;

}


.SubMenuBox{
    border-top: solid 1px #eae9e6;
    margin-top: 30px;
    padding-top: 40px;
}






#SubMenuTop{
    padding: 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

#SubMenuTop > div{
    width: 16%;
}

#SubMenuTop > div.TmBig{
    width: 30%;
}

#SubMenuTop > div.TmBig2{
    width: 25%;
}


.top-menu-lev-0{
     font-weight: 600;
     font-size: 18px;
    margin: 0 0 26px 0;
}

.top-menu-lev-1{
    font-weight: 600;
    margin: 0 0 10px 0;
    text-decoration: underline;
    text-underline-offset: 5px;
}
.top-menu-lev-1-inc{
    padding: 15px 0;
}
.top-menu-lev-2{
    font-weight: 300;
    font-size: 13px;
   margin: 0 0 10px 0; 
}


#SubMenuTop  a > i{
font-weight: 400 !important;
font-size: 12px !important;
color: #8B2F3C !important;
font-style: italic;
margin-left: 4px;
}


#MenuTopRes  a > i{
font-weight: 400 !important;
font-size: 12px !important;
color: #8B2F3C !important;
font-style: italic;
margin-left: 4px;
text-transform: capitalize;
}


.top-menu-img{
position: relative;
}
.top-menu-img img{
width: 100%;
height: auto;
}
.top-menu-img > div{
width: 100%;
color: #fff;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
padding: 20px;

}




.MenuPolec{
    margin-bottom: 30px;
}


/* END MENU */

/* WYSZUKIWARKA */
#Szukaj{
padding: 30px 0 10px 0;
}

#Szukaj form input[type="text"]{
border: 0;
border-bottom: solid 2px #111111;
border-radius: 0;
font-size: 32px;
padding-right: 50px;
padding-left: 0;
background: #F7F6F4;
}
#Szukaj form input[type="text"]:focus
{border: 0;border-bottom: solid 2px #111111;}

#no-result{
margin: 0 0 50px 0;
}

#szukaj-prod{
    width: calc(75% - 10px);
    
   
}

#szukaj-kat-brand{
    width: calc(25% - 10px);
     height: calc(100vh - 112px);
     position: sticky;
     top: 0;
    background: #eae9e6;
    padding: 30px;
}

#szukaj-kat-brand a{
    display: block;
    margin: 7px 0;
}


#szukaj-kat-brand a.more{
    margin:  50px auto 0 auto; 
    width: calc(100% - 40px);
}


/* END WYSZUKIWARKA */


/* SLIDER HOME */


.posit-1{
    text-align: center;
}

.posit-1 .more{
     margin: 30px auto 0 auto !important;
}

.posit-2{
    text-align: right;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.posit-2 .more{
     margin: 30px 0 0 auto !important;
}

.posit-3{
    text-align: center;
        display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.posit-3 .more{
     margin: 30px auto 0 auto !important;
}

.posit-4{
    text-align: left;
        display: flex;
    flex-direction: column;
    justify-content: center;
}

.posit-4 .more{
     margin: 30px auto 0 0 !important;
}

.posit-5{
    text-align: center;
        display: flex;
    flex-direction: column;
    justify-content: center;
}

.posit-5 .more{
     margin: 30px auto 0 auto !important;
}


#my-swipper {
    height: calc(100vh - 150px);
    width: 100%;
    position: relative;
    overflow-x: hidden;
}

#my-swipper .swiper-slide{
    display: block;
    width: 100%; 
    height: 100%; 
}

.swiper-pagination-bullet{
    width: 10px;
    height: 10px;
    background: transparent;
    opacity: 1;
    border: solid 1px #fff;
        }
        .swiper-pagination-bullet-active{
background: #fff;
        }

#swipper-pp .swiper-pagination-bullet{
    border: solid 1px #111;
}

#swipper-pp .swiper-pagination-bullet-active{
    background: #111;
}



#my-swipper .swiper-slide a{
    display: block;
    height: 100%;
    width: 100%; 
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
}

.cap-wrap{
    max-width: 900px;
    margin: 0 auto;
}

.posit-2 .cap-wrap{
margin: 0 0 0 auto;
}

.posit-4 .cap-wrap{
margin: 0 auto 0 0;
}

.swpipper-a{
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}


.slide-inc{
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}

.slider-img{
    width: 100%;
    height: 100%;
    position: absolute; 
    right: 0;
    top: 0;
}

.slider-img a{
    display: block;
    width: 100%;
    height: 100%;

}


.slider-img  img{
    width: 100%;
    height: 100%;
     object-fit: cover;
}
    .slider-img  video{
        width: 100%;
        height: 100%;
         object-fit: cover;
    
        }
    
        .s-mobile, .slider-img a.s-mobile{
            display: none;
            position: relative;
            width: 100%;
    height: 100%;
        }
        .d-mobile, .slider-img a.d-mobile{
            display: block;
            position: relative;
            width: 100%;
    height: 100%;
        } 

.swipper-caption{
    width: 100%;
    padding: 40px 40px 100px 40px;
    height: 100%;
position: absolute;
z-index: 10;
}

.swipper-caption .wrapper-pad{
    height: 100%;
}



.swipper-caption .h1{
    margin: 0;
    font-size: 68px;
    line-height: 1;
    font-weight: 600;
}

.swipper-txt{
font-weight: 400;
font-size: 16px;
}

.swipper-ng{
font-size: 16px;
line-height: 1;
position: relative;
}

#swipper-p{
bottom: 10px;
left: 0;
right: 0;
text-align: center;
margin: 0 auto;
}



/* END SLIDER HOME */



/* ELEMENTY HOME */

.Main-Grupa{
 width: 100%;
height: auto;
margin: 40px 0;
background-repeat:  no-repeat;
background-position: center;
background-size: cover;
}

#marki-out{
    overflow-x: hidden;
    padding: 5px 0;
}


#prod-tab-n{
    margin-bottom: 20px;
    overflow-x: hidden;
    padding: 5px 0;
}

#prod-tab-n  a{
    display: block;
    width: fit-content;
    height: 50px;
    line-height: 50px;
    font-weight: 600;
    font-size: 16px;
    padding: 0 22px;
    margin: 0 20px 0 0;
    cursor: pointer;
    border: solid 1px #111111;
    position: relative;
    -webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}


#prod-tab-n  a.clco{
    background: #111111;
    color: #fff;
}

.prod-tab-inc{
    display: none;
    position: relative;

}


.swiper-scrollbar{
    height: 1px;
    background: #eae9e6;
    left: 0 !important;
}
.swiper-scrollbar-drag{
    background: #111111;
    height: 3px;
    top: 1px;
    border-radius: 2px;
}



.produkty-sw{
    padding: 35px 0;
    position: relative;
    overflow-x: hidden;
}


.Banery .h3{
    margin: 35px 0 5px 0;
}


.Banery a{
    display: block;
    position: relative;
    width: calc(50% - 7px);
    text-align: center;
    margin-bottom: 20px;
}




.BanerySm .h3{
    margin: 35px 0 5px 0;
}


.BanerySm a{
    display: block;
    position: relative;
    width: calc(33.33333% - 7px);
    text-align: center;
    margin-bottom: 20px;
}



.bs-img img, .bs-img video{
    width: 100%;
    height: auto;
    overflow: hidden;
}

.bs-txt{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    padding: 40px 40px 50px 40px;
}


.bs2-txt{
width: 100%;
height: 100% !important;
max-width: 600px;
padding: 50px;
margin: 0 auto;
left: 0;
top: 0;
}


.bs2-txt .h1 span{
    display: block;
    font-size: 16px;
}



  #Magazyn-Home{
    height: 1000px;
    width: 100%;
    position: relative;
  }

   #MagazynH1{
    padding-top: 60px;
   }

  #Magazyn-Home .wrapper{
    height: 100%;
  }









.marka{
width: 250px;
height: 120px;
text-align: center;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #eae9e6;
border-radius: 3px;
background: #fff;
}



.marka > div{
    width: 100%;
     text-align: center;
}

.marka > div > img{
    max-height: 100px;
    max-width: 90%;
    width: auto;
    height: auto;
}

#swiper-scrollbar-marka{
    bottom: -20px;
}





.tekstramka{
    display: block;
    width: calc(33.333333% - 7px);
    text-align: left;
    margin: 50px 0 50px 0;
    padding: 24px 30px 70px 30px;
    position: relative;

}


.tekstramka h3{
    font-weight: 600;
    font-size: 26px;
    margin: 0 0 25px 0;
}

.tekstramka h4{
    font-weight: 600;
    font-size: 16px;
    margin: 0 0 15px 0;
    text-transform: uppercase;
}


.tekstramka p{
    font-size: 14px;
    line-height: 1.5;
    text-transform: uppercase;
}

.tekstramka a{
    position: absolute;
    bottom: 24px;
    left: 30px;
    display: block;
    font-weight: 600;
font-size: 15px;
text-decoration: underline;
}




.baner-sw{
    width: 690px;
    height: auto;
    text-align: left;
    display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}


.baner-sw b, .baner-sw strong{
font-weight: 600;
}
.baner-sw i, .baner-sw em{
    font-style: italic;
    }
    .baner-sw p{
        margin: 10px 0;
        }

.baner-sw-img{
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
}



.baner-sw-img img, .baner-sw-img video{
    width: 100%;
    height: auto;
}

.baner-sw h4{
margin: 35px 0 20px 0;
}



.BanerD{
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.BanerD img, .BanerD video{
    width: 100%;
    height: 100%;
    object-fit: cover;  
}

.BanerD-inc{
    text-align: center;
    max-width: 1000px;
    padding: 50px;
    margin: 0 auto;
}

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



.BanerWyr{
background: #eae9e6;
display: -moz-box;
display: -webkit-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-flex;
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
}




  

.BanerWyr-txt{
    width: 40%;
    padding: 40px;
    display: flex;
flex-direction: column;
justify-content: center;

}



.BanerWyr-txt h3 span{
    display: block;
    font-size: 24px;
}



.BanerWyr-img{
    width: 60%;
    position: relative;
    -moz-box-flex: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex; 
}

.BanerWyr-img img, .BanerWyr-img video{
    width: 100.4%;
    height: 100%;
}







.Baner-Prx{
width: 100%;
height: 800px;
overflow: hidden;
position: relative;
margin-bottom: 40px;
}

.Baner-Prx .wrapper{
    height: 100%;
}


#insta{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}


#insta a{
    display: block;
    width: calc(25% - 7px);
    position: relative;
    overflow: hidden;
}

#insta a img{
    width: 100%;
    height: 100%;
  object-fit: cover;
}

#insta div{
    width: 100%;
    height: calc(100% - 4px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    color: #fff;
    padding: 10px 20px;
    z-index: 1;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    -webkit-transition: all 400ms ease-in;
    -moz-transition: all 400ms ease-in;
    -ms-transition: all 400ms ease-in;
    -o-transition: all 400ms ease-in;
    transition: all 400ms ease-in; 
    
}


#insta div:hover{
    opacity: 1;
    -webkit-transition: all 400ms ease-in;
    -moz-transition: all 400ms ease-in;
    -ms-transition: all 400ms ease-in;
    -o-transition: all 400ms ease-in;
    transition: all 400ms ease-in; 
}





 #m-newsletter{   
        background: #eae9e6;
        position: relative;
    }

    #m-newsletter-img{
        width: 48%;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
    }
    #m-newsletter-img img{
         width: 100%;
    height: 100%;
    object-fit: cover;  
    }


    #m-newsletter-inc{
        padding: 60px 0;
    }

    #m-newsletter-inc span{
        display: block;
    }

    #m-newsletter-inc h3{
margin: 0 0 15px 0;
    }

    #m-newsletter-inc b{
        font-weight: 500;
    }

    #m-newsletter-inc h4{
        font-size: 20px;
        }

       
#newsletter-form-up{
    margin: 20px auto 20px auto;
}


    #newsletter-form{
        position: relative;
        margin: 50px 0 0 0;
    }

    #nl-submit{
        color: #111111;
        width: 50px;
        height: 50px;
        position: absolute;
        right: 0;
        top: 0;
        cursor: pointer;
    }

#nl-submit:before { 
        content: "\f8ce"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 36px;
        left: 5px;
        top: 5px;
}


#nsfrm{
    position: relative;
}

    #newsletter-form  input[type="text"] {
        color:#111111;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 50px;
        background: transparent;
         padding: 0 60px 0 5px;
            margin: 0;
            border: 0;
         border-bottom: solid 2px #111111;
         border-radius: 0;
         font-weight: 400;
font-size: 26px;
line-height: 50px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        
        #newsletter-form ::placeholder { 
            color: #696969;
            opacity: 1; 
          }
          
          #newsletter-form  :-ms-input-placeholder {
            color: #696969;
          }
          
          #newsletter-form ::-ms-input-placeholder {
            color: #696969;
          }

          #newsletter-form label{
              text-align: left;
          }



#nsl-odst{
    height: 80px;
}

.jzgoda{
    font-size: 13px !important;
line-height: 1.4 !important;

}


.main-tresc{
    max-width: 1240px;
    margin: 0 auto;
}


.strona-tresc{
    margin-bottom: 90px;
}





.strona-bnr{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start; 
     
}

.strona-bnr > div{
    display: block;
    font-size: 15px;
    text-align: center;
    width: calc(50% - 20px);
    margin-bottom: 50px;  
    
}



.strona-bnr  h4{
    font-size: 26px;
    font-weight: 500;
    margin: 0 0 10px 0;
    line-height: 1.1;
    text-align: center;
}

.simg {

overflow: hidden;
margin-bottom: 30px;

}

.simg img, .simg video{
    width: 100%;
    height: auto;


}



.strona-bnr .button{
    margin: 24px auto 0 auto;
}












/* END ELEMENTY HOME */



/* TRESCI */
 .tresci .embed-container { position: relative; margin-top: 32px; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } 
    .tresci .embed-container iframe, .embed-container object, 
    .tresci .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

    
    
    .tresci b, .tresci strong{
    font-weight: 600;
    }
    
    
    
    
    .tresci a:not(.more){
        color: #354f70;
    }
    
    .tresci a:hover:not(.more){
        text-decoration: underline;
    }
    





    .tresci h1{
     font-size: 48px;
    margin: 40px 0;
    font-weight: 600; 

    }


    
    
    .tresci h2{
        margin: 30px 0;
         font-size: 38px;  
        font-weight: 600; 
    }


    
    .tresci h3{
        margin: 20px 0;
         font-size: 26px;
        font-weight: 600; 
    }

    .tresci  h4{
    font-size: 18px;
    margin: 16px 0;
    font-weight: 600;

}



      .tresci p{
    margin: 1em 0;
    }
    
    .tresci .h2{
    margin-top: 0 !important;
    }
    
    .tresci i, .tresci em{
    font-style: italic
      }
    
      .tresci u{
    text-decoration: underline;
        }
    
    .tresci blockquote{
    color: #959694;
    text-align: center;
     margin: 30px 0;
     font-size: 36px;
     line-height: 1.2em;
     font-weight: bold;
    }



    
    .doc-dark .tresci blockquote{
      color: #fff;
     }
    
    .tresci ul{
      margin: 32px 0 32px 24px;

      }
      
      .tresci ol{
        margin: 32px 0 32px 24px;
        padding-left: 8px;
        list-style-type: decimal-leading-zero;
        }
     
        .tresci ul:not(.pliki) > li{
          margin: 10px 0;
         padding: 3px 0 3px 15px;
         list-style: disc outside !important;

          }
      
    
          .tresci ul  ul  li,  .tresci ul  ol li,  .tresci ol  ol  li,  .tresci ol ul  li{
            margin: 10px 0 0 0 !important;
           padding: 5px 0 0 40px !important;
               background: none !important;
            }
      
      
      
            .tresci ol li{
              margin: 10px 0;
              padding-left: 8px;
              }
      
      




/* END TRESCI */



/*------------------------------------- SCIEZKA  ----------------------------------------*/

#Sciezka{
    padding: 20px 0 40px 0;
font-size: 12px;
line-height: 16px;
font-weight: 400;

}


#Sciezka li{
    display: inline-block;
    padding: 0 5px;
    margin: 0 5px;
    position: relative;
}

#Sciezka li a{
    color: #747474;

}




#Sciezka li:before{ 
        content: "\e941"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 15px;
        left: -12px;
        top: 0;
}


#Sciezka li:first-of-type{
    padding: 0 5px 0 0;
    margin: 0 5px 0 0;
}

#Sciezka li:first-of-type:before{
    content: "";
    display: none;
}

#Sciezka li a:hover{
   color: #111111;
}


#backto{
    display: block;
    width: fit-content;
    background: #F2F2F2;
    padding: 0 12px 0 30px;
    position: relative;
    height: 26px;
    line-height: 26px;
    font-size: 11px;
    display: none;
    border-radius: 3px;
}

#backto:before{ 
        content: "\ef7d"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 15px;
        left: 8px;
        top: 0;
}


/* END ŚCIEŻKA */



/* OPIS KATEGORII I PODKATEGORIE */
#Kat-Opis{
    margin: 0 0 20px 0;
}

#Kat-Opis > div.tresci{
    max-width: 900px;
}

#Kat-Opis h1{
    font-size: 36px;
    margin: 0 0 20px 0;
    line-height: 1.3;
    font-weight: 600;
}


#WsystkieProdukty{
display: block;
font-size: 12px;
font-weight: 400;
color: #7f7f7f;
margin-left: 10px;

}
#WsystkieProdukty span{
    display: inline !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

#linkreturn{
    display: inline-block;
    width: 20px;
    height: 32px;
    top: 2px;
    position: relative;
    margin: 0 10px 0 0;

}
#linkreturn:before { 
        content: "\ef7d"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-weight: 400;
        font-size: 22px;
        left: 0;
        top: 2px;
}

#Kat-Opis h1 span{
    display: block;
font-size: 15px;
font-weight: 600;
}


#swipper-subkat{
    margin: 20px 0 20px 0;
    position: relative;
    padding-bottom: 24px;
}


.subkateg{
    width: 140px;
    height: auto;
    text-align: center;
    display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 12px;
}

.subkateg-img{
    width: 100%;
    aspect-ratio: 1 / 1;
    margin-bottom: 7px;
    background: #eae9e6;
    text-align: center;
    color: #fff;
    font-size: 120px;
    font-weight: 700;
    overflow: hidden;


}

.subkateg-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;

}


#Cat-Footer{
    margin-top: 70px;
}

#LinkTag{
    margin: 30px 0;
    text-align: center;
}

#LinkTag a{
    display: inline-block;
    width: fit-content;
    height: 40px;
    line-height: 40px;
    padding: 0 30px;
    margin: 5px;
    border: solid 1px #1F2B3A;
    color: #1F2B3A;
    border-radius: 3px;

}

#LinkTag a:hover{
        background: #1F2B3A;
    color: #fff;
}


/* END OPIS KATEGORII I PODKATEGORIE */


/* FILTRY */

#FiltrBox{
width: 100%;
height: 84px;
margin: 0 0 0 0;
padding: 20px 0;
position: relative;
margin: 0;

}

#FiltrBox-view{
    display: block;
    width: 3000px;
}


#wszystkiefiltry > div{
    padding-right: 30px;
min-width: 120px;
}

#wszystkiefiltry  span{
    display: none;
}

#wszystkiefiltry:before{ 
        content: "\e429"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 20px;
        right: 10px;
        top: 0;
}



#FiltrBoxWybr{
    margin: 5px 0 20px 0;
}



#FiltrBoxWybr .wybrfiltr, #wyczysfiltry, .kategfiltr{
    display: inline-block; 
    height: 30px;
    line-height: 30px;
    font-weight: 700;
    font-size: 12px;
padding: 0 15px 0 28px;
       cursor: pointer;
    margin: 0 10px 10px 0;
position: relative;
border-radius: 3px;
border: 1px solid #5e5e5e;
position: relative;
}

#FiltrBoxWybr .wybrfiltr:before, #wyczysfiltry:before, .kategfiltr:before{ 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 15px;
        left: 8px;
        top: 0;
}








#FiltrBoxWybr .wybrfiltr:hover, .kategfiltr:hover{
    background-color: #F2F2F2;
}

#wyczysfiltry{
    background: #F2F2F2;
}

#wyczysfiltry:hover{
    background: #e0e0e0;
}








#sortfiltr{
    margin: 0 0 54px 0;
    text-align: right;
    position: relative;
}

#sortowanie{
    display: inline-block; 
    height: 40px;
    line-height: 40px;
    font-weight: 500;
    font-size: 12px;
padding: 0 15px;
       cursor: pointer;
    margin: 0;
position: relative;
border-radius: 3px;
border: 1px solid #D9D9D9;
position: relative;
   
}


#sortowanie-res{
    display: none;
}

#filtry-do-r{
    position: absolute;
    right: 0;
display: inline-block;
text-align: right;
}



#filtry-res-show{
    display: none;
 
    
    }


    .f-sort-down{
        display: inline-block;
        margin: 0 0 0 5px;
        width: 10px;
        height: 10px;
        position: relative;
    }


 .f-sort-down:before{ 
        content: "\e313"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        left: 2px;
        top: -14px;
}






    .f-sort-up{
        display: inline-block;
        margin: 0 0 0 5px;
        width: 10px;
        height: 10px;
    }
     .f-sort-up:before{ 
        content: "\e316"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        left: 2px;
        top: -14px;
}
    
    
    #filtrbox{
        display: block;
        position: absolute;
        top: -103px;
        width: 100%;
        left: 0;
    }



    #filtrbox-h{
        text-align: center;
        font-size: 15px;
        margin: 20px 0;
        font-weight: normal;
        text-transform: uppercase;
        display: none;
     
    }

    
#filtrbox-inc{
    margin: 0;

}
    
    .filtrng-resp{
    display: inline-block; 
    height: 40px;
    line-height: 40px;
    font-weight: 500;
    font-size: 12px;
    padding: 0 15px;
    cursor: pointer;
    margin: 0 10px 40px 0;
    position: relative;
    border-radius: 3px;
    border: 1px solid #D9D9D9;
    position: relative;
    }

    .filtr-nomob{
        display: inline-block; 
    }

    .filtrng-resp-no{
        display: inline-block; 
        height: 40px;
        line-height: 40px;
        font-weight: 500;
        font-size: 12px;
padding: 0 15px;
        margin: 0 15px 40px 0;
position: relative;
border-radius: 3px;
border: 1px solid #aaaaaa;
position: relative;
background: #f3f2f2;
color: #bababa;
    }

    .filtrng-resp > u, .filtrng-resp-no > u{
        margin-left: 20px;
        text-decoration: none;
        color: #bdbdbd;
        font-size: 10px;
    }

#FiltrBoxRespo .filtrng-resp > u, #FiltrBoxRespo .filtrng-resp-no > u{
    margin: 0;
    text-decoration: none;
    position: absolute; 
    right: 25px;
    color: #bdbdbd;
    font-size: 10px;
}
   
   
    
    .m-wid{
        min-width: 200px;
    }
    
    
    .filtrzaz{
        background: #111111;
        color: #fff;
    }
 
    
    .filtrng-resp > div > i{
        position: absolute;
        right: 16px;
        top: 16px
    }
    


    #SortowanieR{
        display: none !important;
    }

    #SortowanieD{
        display: inline-block;
    }

    #FiltrBoxRespoInc > h3 > span{
        display: none;
    }
  
    
    
    .filtrbox-inc{
        display: none;
        padding: 10px;
        position: absolute;
        background: #fff;
        width: calc(100% + 2px);
        left: -1px;
        top: 32px;
        z-index: 100;
        border-right: solid 1px #ddd;
        border-left: solid 1px #ddd;
        border-bottom: solid 1px #ddd;
        max-height: 360px;
        overflow-x: auto;
        scrollbar-width: thin;
    scrollbar-color:  #535353 #F5F5F5;
    border-radius: 0px 0px 3px 3px;
    }


    .m-wid .filtrbox-inc{
    min-width: 190px;

    }
    


    .filtrbox-inc::-webkit-scrollbar-track
    {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 3px;
        background-color: #F5F5F5;
    }
    
    .filtrbox-inc::-webkit-scrollbar
    {
        width: 6px;
        background-color: #F5F5F5;
    }
    
    .filtrbox-inc::-webkit-scrollbar-thumb
    {
        border-radius: 3px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
        background-color: #555;
    }
    




.filtr-bot{
background: #fff;
position: sticky;
left: 0;
bottom: 0;
padding: 5px 0 10px 0;
    width: 100%;
}


.filtrkat{
    display: block;
    width: 100%;
    line-height: 1.5;
    font-size: 13px;
    padding: 2px 0;
    position: relative;
    cursor: pointer;
    letter-spacing: normal;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.filtrkat_k{
    text-transform: uppercase;
    font-weight: bold;
}

.filtrkat_s{
    padding: 2px 0 2px 10px;
}

.flto{
    font-weight: 700;
    color: #f88461;
}
    
    
    .filtrwrt{
        display: block;
        width: 100%;
        line-height: 1.5;
        font-size: 12px;
        padding: 2px 0 2px 27px;
        position: relative;
        cursor: pointer;
        letter-spacing: normal;
    }


    
    
    .filtrwrt > span{
        display: block;
        width: 14px;
        height: 14px;
        border: solid 1px #293033;
        position: absolute;
        left: 2px;
        top: 3px;
        -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
  
    }

        .filtrwrt > span > i{
        display: block;
        width: 13px;
        height: 13px;
        background: #293033;
        color: #fff;
        position: absolute;
        left: 0px;
        top: 0px;
                -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
  
    }
    .filtrwrt > span > i:before{ 
        content: "\e5ca"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
color: #fff;
        font-size: 13px;
        left: 0px;
        top: -3px;
}


    .filtrwrt-no{
        display: block;
        width: 100%;
        line-height: 1.5;
        font-size: 12px;
        padding: 2px 0 2px 27px;
        position: relative;
        letter-spacing: normal;
        color: #bababa;
    }

    .filtrwrt-no > span{
        display: block;
        width: 12px;
        height: 12px;
        border: solid 1px #aaaaaa;
        position: absolute;
        left: 2px;
        top: 3px;
        line-height: 12px;
        background: #f3f2f2;
    }

    .filtrwrt > u, .filtrwrt-no > u{
        display: block;
        position: absolute;
        right: 7px;
        top: 0;
        text-decoration: none;
        color: #bdbdbd;
        font-size: 10px;

    }



    .sortwrt{
        display: block;
        width: 100%;
        line-height: 1.5;
        font-size: 12px;
        padding: 2px 0 2px 27px;
        position: relative;
        cursor: pointer;
        letter-spacing: normal;
    }


    
    
    .sortwrt > span{
        display: block;
        width: 12px;
        height: 12px;
        border: solid 1px #293033;
        position: absolute;
        left: 2px;
        top: 3px;
        line-height: 12px;
        font-size: 9px;
        text-align: center;
        color: #293033;
        border-radius: 50%;
  
    }
    
    
    .range-s{
        margin: 10px auto;
        text-align: center;
    }
    

    
    
    .filtr-info{
        padding: 7px 15px;
        border: solid 1px #e0e0e0;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        display: inline-block;
        position: relative;
        margin: 5px;
        }
        
        .filtr-info i{
        margin-left: 10px;
        cursor: pointer;
        }
        
        #filtr-info{
        position: relative;
        padding: 20px 0 10px 0;
        text-align: center;
        }
        
    
    
    
    .wyczysc-filtr,  .wyczysc-cena{
          width: 110px;
        height: 30px;
        text-align: center;
         border: solid 1px #293033;
        line-height: 28px;
        font-size: 12px;
        font-weight: 400;
        position: absolute;
        top: 15px;
        right: 0;
        cursor: pointer;
        text-transform: uppercase;
        border-radius: 3px;
    }
    
    
    .wyczysc-wszystkie{
        display: inline-block;
        padding: 10px 2px;
        text-align: center;
        line-height: 20px;
        font-size: 15px;
        margin: 0 10px;
        cursor: pointer;
        color: #bdad95;
        font-weight: 600;
        border-bottom: solid 1px #bdad95;
    
    }
    
    
    .panel-zamknij{
    width: 100px;
    height: 30px;
    text-align: center;
    color: #fff;
    background: #111111;
    line-height: 30px;
    text-transform: uppercase;
    font-size: 12px;
    margin: 10px 10px 0 0;
    cursor: pointer;
    letter-spacing: normal;
    border-radius: 3px;
    }
    
    
    #sortdiv{
        position: relative;
        width: 100%;
        margin: 20px 0 0 0;
        padding: 20px;
        border-bottom: solid 1px #111111;
        letter-spacing: normal;
    }
    
    #sortng{
        
        font-size: 14px;
        font-weight: 600;
        color: #111111;
        padding: 0;
        letter-spacing: normal;
        cursor: pointer;
    }

    #sortng span{
        display: block;
        font-weight: 400;
        letter-spacing: normal;
    }
    
    #sortng i{
        margin-left: 4px;
    }
    
    #sortopcje{
        position: absolute;
        right: 0;
    top: 40px;
        width: 180px;
        padding: 10px;
        z-index: 100;
        background: #fff;
        border: solid 1px #ddd;
       display: none;
      border-radius: 3px;

    }
    
    #sortopcje span{
    display: block;
 text-align: left;
    padding: 3px 0;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.3;
    
    }

    #sortopcje span.slc{
       font-weight: 800;
       text-decoration: underline;
        
        }


    
    #sortopcje span:hover{
        text-decoration: underline;
        }


        #FiltrBoxRespo{
            position: fixed;
            background: #fff;
            padding: 0;
            width: 700px;
            z-index: 1001;
            top: 0;
            right: -700px;
            height: 100vh;
            overflow-y: hidden; 
            overflow-x: hidden; 
            border-right: 1px solid #D5D5D5;
            padding: 50px;
            }

            #FiltrBoxRespoInc{
                position: relative;
                width: 100%;
                height: calc(100% - 40px);
                overflow-y: auto; 
                overflow-x: hidden; 
            }

           
#FiltrBoxRespo   .filtrng-resp{
        display: block;
        padding: 12px 16px;
        border: 0;
        border-radius: 0;
        border-bottom: 1px solid #D5D5D5;
        font-weight: 400;
        font-size: 13px;
        line-height: 20px;
        cursor: pointer;
        height: auto;
        margin: 0;
position: relative;

    }

#FiltrBoxRespo .filtrng-h, #FiltrBoxRespo .filtrng-hch{
text-transform: uppercase;
}

.filtrng-h i{
    display: block;
    position: absolute;
    right: 20px;
    top: 12px;
    height: 20px;
    width: 20px;
}

.filtrng-h i:before{ 
        content: "\e313"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 20px;
        left: 0;
        top: 1px;
}

.filtrng-h i.odown:before{ 
        content: "\e316"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 20px;
        left: 0;
        top: 1px;
}



#SortowanieD .filtrng-h i{
    right: 10px;
    top: 0;
}

    #filtrzastosuj{
        width: 80%;
        margin: 30px auto 0  auto;
        background: #111111;
        color: #fff;
        text-align: center;
        height: 40px;
        line-height: 40px;
        text-transform: uppercase;
        cursor: pointer;
        border-radius: 3px;
    }
    


    #FiltrBoxRespo .filtrng-resp-no{
        display: block;
        padding: 12px 16px;
        border: 0;
        border-radius: 0;
        border-bottom: 1px solid #D5D5D5;
        font-weight: 400;
        font-size: 13px;
        line-height: 20px;
        text-transform: uppercase;
        cursor: pointer;
        height: auto;
        margin: 0;
position: relative;
background: #f8f8f8;
color: #bababa;
    }

    #FiltrBoxRespo h3{
        padding: 20px 15px;
        font-weight: 700;
        font-size: 16px;
        margin: 0 0 26px 0;

    }



    #FiltrBoxRespo .filtrbox-inc{
        width: auto;
        display: none;
        padding: 5px 0 0 0;
        position: relative;
        background: transparent;
        left: auto;
        top: auto;
        border: none;
        max-height: none;
        overflow: visible;
    }

    #FiltrBoxRespo .m-wid .filtrbox-inc{
        min-width: auto;
    }


    #filtr-mask{
        position: fixed;
        width: 100%;
        height: 100vh;
                background-color: rgba(0, 0, 0, 0.50);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
        z-index: 1000;
        top: 0;
        left: 0;
        display: none;
    }




    #closefiltry{
        position: absolute;
        top: 20px;
        right: 15px;
        width: 20px;
        height: 20px;
        cursor: pointer;
    }
    #closefiltry:before{ 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: 8px;
        top: 0;
}



        #Loading{
            position: fixed;
            width: 100%;
            height: 100vh;
            background-color: rgba(255, 255, 255, 0.7);
            z-index: 1000000000;
            display: none;
            background-image: url('../img/ajax-loader.gif');
            background-repeat: no-repeat;
            background-position: center;
            left: 0;
            top: 0;
        
        }

#zatwierdzfiltry{
    margin: 20px;
    width: 300px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #111111;
    color: #fff;
    cursor: pointer;
}



        .cena-flt {
            padding: 7px;
            margin: 5px 5px;
            width: 70px;
        }

        #html5{
            width: 90%;
            margin: 0 auto;
            margin-top: 10px;
            height: 10px;
        }


        
        #html5 .noUi-connect {
            background: #293033;
            border: none;
        }
        
        #html5 .noUi-handle {
            height: 18px;
            width: 18px;
            top: -5px;
            right: -9px; /* half the width */
            border: solid 1px #989898;
        }

        /* Hide markers on slider handles */
        #html5 .noUi-handle::before,
        #html5 .noUi-handle::after {
    display: none;
}
        
#html5 .noUi-handle {
    box-shadow: none;
}















/* END FILTRY */




/* --------------------- NAWIGACJ ---------------------*/


#Navig{
    padding: 40px 10px;
    text-align: center;
    clear: both;
    }
    
    
    #Navig a{
    margin: 0;
    font-size: 13px;
    display: inline-block;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    position: relative;
    margin: 0 2px;
    }

  
    #Navig a.str, #Navig a.pn{
width: 50px;
position: relative;
top: 7px;
    }
    #Navig a.str{
        margin-right: 5px;
    }

    #Navig a.str:hover, #Navig a.pn:hover{
        background: transparent;
        text-decoration: underline;
    }
        
    #stprev:before{ 
        content: "\f1e6"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 26px;
        left: 8px;
        top: 0;
}

    #stnext:before{ 
        content: "\f1df"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 26px;
        left: 8px;
        top: 0;
}



    
    #Navig a:hover{
     background:  #f4f4f3;
    }
    

    
    #Navig .Nav{
    background: #293033;    
color: #fff;
display: inline-block;
width: 24px;
height: 24px;
text-align: center;
line-height: 24px;
-webkit-border-radius: 3px;
border-radius: 3px;
position: relative;
    }



/* EDN NAWIGACJA */



/*  KARTA PRODUKTU */


 #DaneProduktu{
        width: calc(60% - 120px);
        margin-left: 120px;
    }

    #OpisProduktu{
         width: 40%; 

     }


         #OpisProduktu > div{
         max-width: 650px;
         margin: 0 auto; 
         padding: 0 50px;   
     }



#ProduktFoto{
    width: 60%;
    position: sticky;   
         top: 110px;
}

#ProduktFoto-inc{
    width: calc(100% - 120px);
    margin-left: 120px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
position: relative;
    
}



.pf-1{
    width: 100%;
}

.pf-1 img{
      width: 100%;
    height: auto; 
}

.pf-2{
    width: calc(50% - 2px); 
    margin: 0;

    
}
.pf-3{
    width: calc(33.333333% - 2px);
    margin: 0;

}

.pf-z{
    display: none;
}


.pf-1 a, .pf-2 a, .pf-3 a{
    display: block;
    width: 100%;
    height: 100%;
    
}


.pf-1 img, .pf-2 img, .pf-3 img{
    width:100%;
    height: auto;
}


.prod-th{
    position: absolute;
   height: 100%;
    left: 0;
    top: 0;    
}

#swipper-pgal{
 overflow: hidden;
    height: 100%;
    width: 100px;
}

.prod-th-img{
    display: block;
    width: 94px;
height: 94px;
position: relative;
cursor: pointer;
margin: 4px;
}
.prod-th-img  img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.prod-th .clc{
/*    border: dotted  1px #111; */
    outline: solid 1px #111 ;
    outline-offset: 2px;
}


#swiper-scrollbar-pgal{
    bottom: -5px;
}








    #ProduktInfo{
         width: 40%; 

     }


         #ProduktInfo-inc{
         max-width: 650px;
         margin: 0 auto; 
         padding: 0 50px;   
     }

.labs{
    display: inline-block;
    text-transform: uppercase;
    height: 20px;
    line-height: 20px;
    padding: 0 12px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    margin: 0 5px 5px 0;
    font-size: 9px;
color: #111111;
background: #D5D5D5;
vertical-align: middle;
     text-align: center;
}


.tylkounas-p{                 
    background: #354f70;
    color: #fff;
}

.lab-24{                 
    background: #354f70;
    color: #fff;
}
                
.lab-promo{
    background: #8B2F3C;
    color: #fff;
}

    .abrand{
                    display: block;
                    margin: 0 0 12px 0;
                    font-size: 14px;
                    text-decoration: underline;
                    height: 26px;
                    line-height: 28px;
                    border: solid 1px #eae9e6;
                    background: #fff;
                    padding: 7px 12px;
                    width: fit-content;
                    text-align: center;
                    border-radius: 3px;
                }

    .abrand img{
        max-height: 100%;
        width: auto;
    }


#ProduktInfo .h2{
    margin: 0 0 10px 0;
    font-size: 32px;
}

.PanelB{
    position: fixed;
    top: 0;
    right: -700px;
    width: 700px;
    background: #fff;
    z-index: 100000;
    padding: 50px;
     height: 100vh;
     overflow-y: scroll; 
     overflow-x: hidden; 
}

    .closepanelb{
        position: absolute;
        top: 20px;
        right: 20px;
        width: 20px;
        height: 20px;
        cursor: pointer;
    }
    .closepanelb:before{ 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: 8px;
        top: 0;
}

#filtr-panel{
        position: fixed;
        width: 100%;
        height: 100vh;
                background-color: rgba(0, 0, 0, 0.50);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
        z-index: 1000;
        top: 0;
        left: 0;
        display: none;
}



#paypo{
    text-align: center;
    font-size: 10px;
    text-transform: uppercase;
    margin: 0 0 20px 0;
    padding: 10px 0 30px 0;
    background: url('../img/ico-paypo.svg') no-repeat center 27px;
    background-size: 60px auto;
    border: solid 1px #eae9e6;
    cursor: pointer;
    font-weight: 700;

}


.tab-inc{
    padding: 5px;
    border-bottom: solid 1px #eae9e6;
}

.tab-inc.bgd{
    border-bottom: solid 1px #e1e1e1;
}

.tab-inc > .h5{
font-size: 13px;
font-weight: 500;
padding: 5px 5px;
margin: 0;
cursor: pointer;
position: relative;
}

.tab-inc > .h4{
font-size: 15px;
font-weight: 500;
padding: 10px 5px;
margin: 0;
cursor: pointer;
position: relative;
}



.more-tab h5:before { 
        content: "\f46a"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 3px;
        top: 0px;
}


.close-tab h5:before { 
        content: "\e313"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 3px;
        top: 0px;
}
.open-tab h5:before { 
        content: "\e316"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 3px;
        top: 0px;
}


h5.io{
    padding-left: 30px !important;
}

#io-free::after { 
        content: "\e25c"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}

#io-dostawa::after { 
        content: "\f39a"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}

#io-zwrot::after { 
        content: "\e166"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}

#io-probki::after { 
        content: "\e421"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}

#io-wysylka::after { 
        content: "\e84c"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}

#io-ilosc::after { 
        content: "\f1cc"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}

#io-opis::after { 
        content: "\e88e"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 18px;
        left: 0;
        top: 0;
}



.tab-c{
    padding: 20px 5px;
    font-size: 13px;
}

.tab-inc-wariant .tab-c{
  padding: 0 !important;  
}

.open-tab .tab-c{
display: block;
}
.close-tab .tab-c{
display: none;
}


#wysylkainfo{
    margin: 20px 0 30px 0;
    padding-left: 30px;
    position: relative;
    color: #00768b;
    font-size: 13px;
}



#wysylkainfo:before { 
        content: "\e84c"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        left: 0;
        top: -4px;
}

#wysylkainfo.gnow{
color: #006330;
}


.proddost{
    position: relative;
    margin: 0;
    padding: 10px 80px 10px 7px;
    border-bottom: solid 1px #eae9e6; 
}

.proddost span{
    display:block;
    position: absolute;
    top: 10px;
    right: 7px;
    font-weight: 700;
}

#butpromo{
    background: #8B2F3C;
   color: #fff;
   width: fit-content;
border-radius: 3px;
font-size: 12px;
padding: 5px 20px;
}






  #BlokCena{
    margin: 20px 0;
    position: relative;
  }
                  



 #CenaProduktu{
     font-weight: 500;
      font-size: 30px;
   }
   
    #CenaProduktu i{
        font-style: normal !important;
    }

       #CenaProduktu u{
        text-decoration: none !important;
        color: #8B2F3C;
    }
                  
                  #CenaProduktu #cenaod{
                    display: block;
                    font-size: 12px;
                    line-height: 14px;
                    margin-bottom: 4px;
                    text-transform: uppercase;
                    letter-spacing: normal;
                   }
                  
                  
                  
                  #CenaPromo{
                   display: none;
                   padding: 12px 0 0 0;
                   line-height: 38px;
                  }

                  #promo-day{
                    background: #8B2F3C;
                    border-radius: 3px;
                    color: #fff;
                    font-size: 14px;
                    line-height: 35px;
                    height: 35px;
                    font-size: 14px;
                    text-align: center;
                    text-transform: uppercase;
                    margin-bottom: 16px;
                  }
                  #promo-day b{
                    text-decoration: underline;
                  }
                  
                  #cp-cena{
                  font-size: 13px;
                  font-weight: 400;
                  }
                  #cp-cena span{
                    text-decoration: line-through;
                  }


                  
                  #cp-cena span#cp-upust{
                    text-decoration: none;
                    color: #8B2F3C;
                    font-weight: 700;
                    margin-left: 7px;
                  }
                  
         

                  .cena30{
                    font-size: 12px;
                    margin: 0;
                    color: #BFBFBF; 
                    position: relative;
                    font-weight: 400;
                  }

                  
      #BlokKoszyk{
                  position: relative;
                  margin: 20px 0 40px 0;
                  display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
                  }
                           

 .qtyimp{
       position: relative;
                  height: 50px;
                  width:  96px;
                 
                  }
                  
                  .qtyimp input[type="text"]{
                  padding: 0;
                  position: absolute;
                  top: 0;
                  left:28px;
                  width: 40px !important;
                  height: 50px;
                  color: #293033;
                  background: transparent;
                  font-weight: 700;
                  line-height: 32px;
                    font-size: 14px;
                    text-align: center;
                    border-radius: 0;
                    border: solid 1px #f7f7f7;
                  }
                  .qtyimp input[type="text"]:focus{
                    border: 0;
                    border: solid 1px #f7f7f7;
                   background: transparent;   
                  }
                  
                  .qtyplus{
                  width: 28px;
                  height: 50px;
                  background: #f7f7f7;
                  text-align: center;
                  position: absolute;
                  right:0;
                  top: 0;
                  cursor: pointer;
                  }
                  
               
                  .qtyminus{
                    width: 28px;
                  height: 50px;
                  background: #f7f7f7;
                  text-align: center;
                  position: absolute;
                  left:0;
                  top: 0;
                  cursor: pointer;
    
                  }

                  .qtyplus:before { 
        content: "\e145"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 24px;
        left: 1px;
        top: 10px;
}
.qtyminus:before { 
        content: "\e15b"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 24px;
        left: 1px;
        top: 10px;
}

 .opct{
                    opacity: 0.3;
                    cursor: default !important;
                   }


                   #DoKoszyka{
                       width: calc(100% - 110px);
                       height: 50px;
                       text-align: center;
                       line-height: 50px;
                       background: #111111;
                       color: #fff;
                       font-size: 16px;
                       cursor: pointer;
                   }




#ProdKolekcje{
  position: relative;
   margin: 20px 0;
   display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: flex-start;  
}

.p-kolekcje{
    width: 70px;
    margin: 0 5px 5px 0;
    border: solid 1px #eae9e6;
    padding: 3px;
    border-radius: 3px;
    
}

.p-kolekcje.on{
   border: solid 1px #111111; 
}

.p-kolekcje > div {
width: 62px;
height: 62px;
position: relative;
margin-bottom: 4px;
border-radius: 3px;
}

.p-kolekcje > div img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 3px;
}


.p-kolekcje h6{
width: 100%;
  font-size: 9px;
  font-weight: 400;
  display: -webkit-box;
   -webkit-line-clamp: 2;
           line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}



.tab-inc-wariant{
    padding: 5px;
    border: solid 1px #eae9e6;
    margin: 5px 0;
    position: relative;
}


.tab-inc-wariant:before { 
        content: "\f46a"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 7px;
        top: 20px;
}



.tab-inc-wariant > .h4w{
font-size: 13px;
font-weight: 400;
margin: 0;
padding: 5px;
cursor: pointer;
position: relative;
   display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;  
}

.wariant-th{
    width: 50px;
    height: 50px;
    position: relative;

}

.wariant-th img{
  width: 100%;
  height: 100%;
  object-fit: cover;

}

.wariant-txt{
    height: 50px;
    line-height: 50px;
    width: calc(100% - 70px);
}



.close-tab .h4w:before { 
        content: "\e313"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 3px;
        top: 12px;
}
.open-tab .h4w:before { 
        content: "\e316"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 3px;
        top: 12px;
}


.inc-wariant{
    cursor: pointer;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;  
    border-bottom: solid 1px  #eae9e6;
    border-left: solid 1px #fff;
    border-right: solid 1px #fff;
    border-top: solid 1px #fff;
    padding: 5px 5px;
    z-index: 0;
}

.wariant-clc{
border: solid 1px #111111;
}

.wariant-img{
    width: 50px;
    height: 50px;
    overflow: hidden;
}

.wariant-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wariant-nazwa{
    width: calc(100% - 70px);
    line-height: 50px;
}






#ZapytajoProdukt{
    border: solid 1px #eae9e6;
    padding: 20px 10px 20px 40px;
    margin: 20px 0;
    font-size: 13px;
    position: relative;
}

#ZapytajoProdukt span{
    display: block;
    text-transform: uppercase;
    text-decoration: underline;
    font-size: 12px;
}

#ZapytajoProdukt b{
    display: block;
    margin: 15px 0 7px 0;
    font-weight: 700;
}

#ZapytajoProdukt a{
    display: block;
    margin:  7px 0;
}

#ZapytajoProdukt:before { 
        content: "\e94c"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        left: 5px;
        top: 15px;
}

#ZapytajForm{
    text-decoration: underline;
    cursor: pointer;
    position: relative;
    width: fit-content;
}


#ZapytajForm:before { 
        content: "\e8e4"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: -26px;
        top: -4px;
}




.zobacz-d{
    cursor: pointer;
    z-index: 20000;
    position: absolute;
    top: 17px;
    right: 15px;
    width: 30px;
    height: 30px;
}

.zobacz-d:before { 
        content: "\e8b6"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 4px;
        top: 1px;
}






#prodwymiary{
    position: relative;
    max-width: 500px;
    margin: 0;
    width: 100%;
    aspect-ratio: 12 / 11;
}
#prodwymiary div#imgp{
    position: absolute;
width: calc(100% - 120px);
aspect-ratio: 1 / 1;
left: 120px;
bottom: 74px;
background-color: #fff;

}

#prodwymiary div#imgp img{
    width: 100%; 
	height: 100%; 
	object-fit: contain;
}

#prodwymiary #wymiary{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

#prodwymiary #wymiary-up{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}


#prodwymiary #wymiary-up > div{
    width: 1px;
    height: 260px;
    background: #c8c8c8;
    position: absolute;
    left: 60px;
    bottom: 40px;
}



#prodwymiary #wymiary-down{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}


#prodwymiary #wymiary-down > div{
    width: 260px;
    height: 1px;
    background: #c8c8c8;
    position: absolute;
    bottom: 40px;
    left: 60px;
}



#prodwymiary #wymiary-deep{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}


#prodwymiary #wymiary-deep > div{
    width: 60px;
    height: 1px;
    background: #c8c8c8;
    position: absolute;
    bottom: 55px;
    left: 56px;
    rotate: -30deg;
}

#prodwymiary #wymiary span{
    font-size: 10px;
    position: absolute;
    width: 60px;
    text-align: center;
}

#prodwymiary #wymiary span b{
    display: block;
    font-weight: 700;
}

#p-wys{
left: 0;
bottom: 160px;
}

#p-gleb{
    left: 0;
    bottom: 14px;
    }


#p-szer{
    left: 150px;
    bottom: 14px;
}






    #p-wymiary-dane{
        font-size: 12px;
        line-height: 14px;
    }
    #p-wymiary-dane b{
        display: block;
        padding: 8px;
        font-weight: 700;
        background: #F2F2F2;
        -webkit-border-radius: 3px;
border-radius: 3px;
    }
    
    
    
        ul.p-dane{
            margin: 16px 0 0 0;
            padding: 0;
            list-style: none;
            }
            
            ul.p-dane li{
            padding: 0;
            margin: 10px 0;
            position: relative;
            font-weight: 400;
             }

            
             ul.p-dane li span{
            font-weight: 700;
            padding-right: 5px;
            }


    ul.d-dane{
       margin: 0;
            padding: 0;
            list-style: none; 
    }

    ul.d-dane li{
            padding: 0 0 0 10px;
            margin: 10px 0;
            font-weight: 400;
            position: relative;
      }

      ul.d-dane li:before { 
        content: ""; 
        display: block;
        width: 1px;
        height: 100%;
        background: #111111;
        position: absolute;
        left: 0;
        top: 0;
}

    
    
    .projekt-img{
    width: 100%;
    max-width: 400px;
    text-align: center;
}

.projekt-img img{
    max-width: 100%;
    height: auto;
    margin: 0 auto 10px auto;
}

    
    














/*  END KARTA PRODUKTU */


/* STOPKA */


#stopka{
    margin-top: 50px;
    padding: 40px 0;
background: #eae9e6;
font-size: 13px;
}

#stopka-more{
    display: inline-block; 
    width: fit-content;
    padding-right: 25px;
    margin-left: 10px;
    text-decoration: underline;
    cursor: pointer;
background:  url('../img/plus-lg.svg') no-repeat right;
}


#stopka-more.on{
    margin-left: 0;
    background:  url('../img/minus.svg') no-repeat right !important;
}

#stopka-firma{
    background: url('../img/dc-logo.svg') no-repeat left 5px;
    background-size: 200px auto;
    min-height: 80px;
    padding-left: 220px;
    text-transform: none;
    font-size: 13px;
    line-height: 1.4;
    width: 100%;
                max-width: 1240px;
                clear: both;
                 margin: 0 auto;
}

#stopka-firma > p{
   display: inline !important;  
}

#stopka-firma-inc{
    display: none;
}


#stopka-firma b{
    font-weight: 600;
}
#stopka-firma i{
   font-style: italic;
}
#stopka-firma u{
    text-decoration: underline;
 }

 #stopka-firma-inc p{
    margin: 15px 0;
 }

 #stopka li{
    margin: 10px 0;
}

 #stopka-menu{
    border-top: solid 1px #e0e0df;
    margin-top: 20px;
    padding: 40px 0;
}


.stopka-inc{
    width: 24%;
    position: relative;
    font-size: 13px;
    line-height: 1.4;
}

#stopka h4{
    font-weight: 700;
    font-size: 14px;
    line-height: 1.4;
    text-transform: uppercase;
    margin: 0 0 24px 0;
}

#stopka h5{
margin: 30px 0 44px 0;
}

#ikon-desk{
    padding: 0 0 40px 0;
    position: relative;
}


.soc-ico{
    display: inline-block;
    width: 26px;
    height: 26px;
    margin-right: 7px;
    line-height: 26px;
    text-align: center;
}

.soc-ico img{
    width: 100%;
    height: auto;
}

.dpgraf{
display: inline-block;
border: solid 1px #e0e0df;
border-radius: 3px;
width: 50px;
height: 26px;
text-align: center;
position: relative;
margin: 0 4px 7px 0;
}

.dpgraf > div{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;

}

.dpgraf  img{
    display: block;
    margin: auto;
    width: 70%;
    height: 70%;
  object-fit: contain;
}



#stopka-tekst{
    margin-top: 30px;
}

#stopka-copy{
   margin-top: 10px; 
   font-size: 12px;
}


#stopka-bot{
border-top: solid 1px #e0e0df;
padding: 20px 60px 0 0;
position: relative;
}

#stopka-bot li{
    display: inline-block;
    margin: 0 14px 5px 0;
    padding: 0;
}



#stopka-lang{
    position: absolute;
    right: 0;
    top: 8px;

}


#stopka-lang a{
    display: block;
    background-size: 20px auto;
    background-repeat: no-repeat;
    background-position: left;
    line-height: 40px;
    width: 46px;
    height: 40px;
    text-align: right;
    margin-left: 30px;
    position: relative;
}

#stopka-lang a::after{
    content: "›";
    position: absolute;
    right: -14px;
    top: -1px;
    font-weight: normal;
    font-size: 16px;
    color: #293033;
}






/* END STOPKA */








/* POPUP */


#popup-mask{
	position: fixed;
	width: 100%;
	height: 100vh;
	        background-color: rgba(0, 0, 0, 0.50);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
	z-index: 1000000000;
	top: 0;
	left: 0;
	display: none;
	}
	
	#popup-mask > div{
	width: 100%;
	text-align: center;
	height: 100vh;
	display: flex;
	  flex-direction: column;
	  justify-content: center;
	  z-index: 0;
	}

	#popup-content{
		max-width: 80%;
		background: #fff;
		margin: 0 auto;
		padding: 10px;
		text-align: left;
		position: relative;
		max-height: 90vh;
		overflow-y: auto;
        overflow-x: hidden;
		display: none;
		z-index: 1;
        border: 1px solid #E1DEDA;
box-shadow: 0px 0px 14px 4px rgba(0, 0, 0, 0.15);
        }
        

     #popup-content-on{
                position: fixed;
                max-width: 70%;
                background: #fff;
                margin: 0 auto;
                padding: 24px;
                text-align: left;
                max-height: 90vh;
                overflow-y: auto;
                display: none;
                z-index: 1;
                z-index: 1000000000;
                top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-box-shadow: 0 0 10px 0 #B5B5B5;
box-shadow: 0 0 10px 0 #B5B5B5;
                }


                #popup-exit-on {
                    width: 20px;
                    height: 20px;
                            cursor: pointer;
                            display: block;
                            position: absolute;
                            top: 24px;
                            right: 24px;
                             line-height: 20px;
            }

            #popup-exit-on:before { 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 30px;
        left: -1px;
        top: -4px;
}


#opis-s{
    padding: 18px 0 24px 0;
}

#frm-s{
    padding: 18px 0 0 0;
}


#opis-s b{
    display: block;
    font-weight: 600;
}



#popup-exit {
    width: 29px;
height: 29px;
			cursor: pointer;
			display: block;
			position: absolute;
			top: 16px;
			right: 16px;
			z-index: 1000;
		}

       

#popup-exit:before { 
        content: "\e5cd"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 32px;
        left: -1px;
        top: -4px;
}










.wariant-img-d-out{
    width: 100%;
    height: 260px;
    position: relative;
    
}


.wariant-img-d{
   position: absolute;
   top: -25px;
   left: -25px;
   width: calc(100% + 50px);
   height: 260px;
   overflow: hidden;
}
  
  .wariant-img-d a > img{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .wariant-pic-out{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    margin: 7px 0;
  }
  
  .wariant-pic{
    width: 48%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
  }
  
  .wariant-pic-img{
    width: 40px;
  }
  .wariant-pic-img > img{
    max-width: 30px;
    height: auto;
  }
  
  .wariant-pic-txt{
    width: calc(100% - 40px);
    padding: 8px 0 8px 5px;
    line-height: 14px;
    font-size: 12px;
  
  }
















/* END POPUP */


/* FORMULARZ */

.ukr{
    display: none;
}

          form label{
            display: block;
            font-size: 12px;
            line-height: 14px;
            color: #35363A;
            margin: 0 0 5px 0;
            position: relative;
         } 

         form label span{
            display: block;
            position: absolute;
            right: 0;
            bottom: 0;
            font-size: 8px;
line-height: 115%;
color: #BFB3B2;
         }
        
        
         form input[type="text"],
         form input[type="password"],
         form select, 
         form textarea,
         input[type="text"].inputbuton 
         {
            font-family: 'Inter', sans-serif;
            font-style: 400;
            font-weight: normal;
            font-size: 14px;
            line-height: 15px;
         color: #35363A;
         padding: 15px 20px;
         margin: 0 0 16px 0;
         width: 100%;
         background: #fff;
         border: 1px solid #eae9e6;
         border-radius: 3px;
             -webkit-box-sizing: border-box;
             -moz-box-sizing: border-box;
             box-sizing: border-box;
   
         }


     
         input[type="text"].inputbuton 
         {
            font-style: 400;
            font-weight: normal;
            font-size: 15px;
            line-height: 18px;
         color:#293033;
         border: solid 1px #F1EEED;
         background: #F1EEED;
         padding: 4px 8px;
         margin: 13px 0 0 0;
         width: 100%;
             -webkit-box-sizing: border-box;
             -moz-box-sizing: border-box;
             box-sizing: border-box;
   
         }

         #dodaj-kod{
            width: 86px;
            height: 26px;
            text-align: center;
           margin: 13px 0 0 0;
            cursor: pointer;
            border: 1px solid #AFA59C;
            font-size: 13px;
line-height: 24px;
text-transform: uppercase;

color: #AFA59C;
         }
        
        
           
         form input[type="text"]:focus,
         form input[type="password"]:focus,
         form select:focus,
         form textarea:focus
         {
             outline: none;
            border: 1px solid #111;

         }
        
        
         form input[type="submit"]{
            display: block;
            margin: 0 auto 16px auto;
            background: #111111;
            color: #fff;
            border: 0;
            height: 60px;
            padding: 0 30px;
            line-height: 60px;
            text-align: center;
            font-weight: 400;
            text-transform: uppercase;
            width: fit-content !important;
            cursor: pointer;
            font-size: 15px;
            border-radius: 3px;
            font-family: 'Inter', sans-serif;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        form input[type="submit"]:hover{
            background: #111111; 
            color: #fff;
        }

        ::-webkit-input-placeholder { /* Edge */
            color: #7b7b7b;
          }
          
          :-ms-input-placeholder { /* Internet Explorer 10-11 */
            color:#7b7b7b;
          }
          
          ::placeholder {
            color:#7b7b7b;
          }
        
         
        
        .container {
            display: block;
            position: relative;
            padding-left: 30px;
                    font-size: 15px;
            cursor: pointer;
            line-height: 20px;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            text-transform: none !important;
          }
          
        
          .container input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
            height: 15px;
            width: 15px;
            left: 0;
            top: 0;
          }
          
          
          .checkmark {
            position: absolute;
            top: 0;
            left: 0;
            height: 15px;
            width: 15px;
            border: solid 1px #111111;
            background: transparent;
    
          }


   
        
          .container:hover input ~ .checkmark {
            border: solid 1px #111111;
            
            background: transparent;
          }
          
        
          .container input:checked ~ .checkmark {
            background-color: transparent;
          }
          
        
          .checkmark:after {
            content: "";
            position: absolute;
            display: none;
          }
          
        
          .container input:checked ~ .checkmark:after {
            display: block;
          }
          
        
          .container .checkmark:after {
                width: 13px;
                height: 13px;
                background: #111111;
                left: 1px;
                top: 1px;
          }




/* END FORMULARZ */


/* PRODUKTY LISTA */



.Produkt{
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #fff;
border: solid 1px #eae9e6;
}


 .ProduktSw{
    width: 370px;
    text-align: left;
 }

.Produkt4{
width: calc(20% - 10px);
margin: 0 0 40px 0;
}

.Produktempty{
 width: calc(25% - 10px);   
}

.Produkt3{
width: calc(33.3333333% - 10px);
margin: 0 0 40px 0;
}

.pimg{
width: 100%;
/* aspect-ratio: 5 / 6; */
aspect-ratio: 1 / 1;
position: relative;
/* border: solid 1px #f0efeb */
}

.pimg img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}


.pimg-wyp{
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
    z-index:1;
    background: #111111;
}

.pimg-wyp img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.nakladka{
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
    opacity: 0;
    z-index:1;
    -webkit-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -ms-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    transition: all 200ms ease-in; 
}

.pimg:hover .nakladka{
    opacity: 1;
    -webkit-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -ms-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    transition: all 200ms ease-in; 
 }

.nakladka > img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

 .prod-lab-strefa{
    width: calc(100% - 20px);
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 10;
 }


 .prod-lab{
display: inline-block;
 -webkit-border-radius: 3px;
border-radius: 3px;
height: 20px;
line-height: 20px;
background: #354f70;
color: #fff;
text-align: center;
padding: 0 7px;
margin-right:7px;
text-transform: uppercase;
font-weight: 500;
font-size: 8px;
 }


.ico-new{
    background: #EBEBEB;
    color: #111111;
}

.ico-tylkounas{
    background: #354f70;
    color: #fff;
}


.Produkt .upust{
  background: #8B2F3C;
}

.Produkt .ulubione-p{
    position: absolute;
    top: 0;
    right: 0;
   }



.Produkt .ulubione-p{
    text-align: center;
    width: 22px;
    height: 22px;
}

.Produkt .ulubione-p:before { 
        content: "\e87d"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        left: 0;
        top: -2px;
}



.p-mobile .ulubione-p, .p-deskt .ulubione-p{
    position: absolute;
    top: 0;
    right: 0;
   }


.p-mobile .ulubione-p, .p-deskt .ulubione-p{
    text-align: center;
    width: 30px;
    height: 30px;
}

.p-mobile .ulubione-p:before, .p-deskt .ulubione-p:before { 
        content: "\e87d"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 30px;
        left: 0;
        top: -2px;
}









.addu { 
color: #8B2F3C;
}







.brand{
font-weight: 300;
font-size: 13px;
margin: 10px 0;
}

.Produkt h4{
width: 100%;
  font-size: 14px;
  font-weight: 600;
  display: -webkit-box;
   -webkit-line-clamp: 2;
           line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}




.Produkt-kolory{
    position: absolute;
    display: inline-block;
    z-index: 10;
    overflow: hidden;
    max-height: 15px;
    line-height: 15px;
    height: 15px;
    top: 0;
    right: 0;
    text-align: right;

    }
    
    
    .Produkt-kolory > div{
    width: 15px;
    height: 15px;
    overflow: hidden;
    display: inline-block;
    margin: 0 6px 0 0;
    border: 1px solid #D5D5D5;
    -webkit-border-radius: 3px;
border-radius: 3px;
line-height: 15px;
position: relative;
    }

    .Produkt-kolory > div.plusd{
        width: fit-content;
        border: 0;
        font-size: 12px;
    }
    
    
    .Produkt-kolory > div img{
    height: 100%;
    width: auto;
    }

.Produkt-info{
    position: relative;
    padding: 0 0 30px 0;
    padding: 0 10px 30px 10px;
}


 .Produkt .Cena{
margin: 10px 0;
color: #111111;
font-weight: 600;
}



.Produkt .Cena  b{
    font-weight: 400;
    color: #8B2F3C;
}

 .Produkt .Cena span{
    color: #8B2F3C;
 }

 .Produkt .Cena i{
    margin: 0 10px;
    font-style: normal;
    font-weight: 400;
    color: #4f4f4f;
    text-decoration-line: line-through;
 }




.Produkt .wysylka{
margin: 0;
font-weight: 400;
font-size: 11px;
line-height: 14px;
position: relative;
padding-left: 26px;
color: #00768b;
}

.Produkt .wysylka:before { 
        content: "\e84c"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        left: 0;
        top: 0;
}

.Produkt .gnow{
color: #07b95d;
}




/* END PRODUKTY LISTA */



/* POPUPY - INFO */


                  #InfoK{
                    position: fixed;
                    right: calc(50% - 400px);
                    width: 800px;
                    top: 40%;
                    margin-top: 10px;
                    padding: 50px 15px;
                    background: #111111;
                    color: #fff;
                    font-size: 14px;
                    text-align: center;
                    z-index: 100;
                    text-transform: none;
                    display: none;
                    border-radius: 3px;
            }










    #logowanie{
        width: 100%;
        height: 510px;
        display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    }

    #logo_moma_sm{
        height: 25px;
        width: 100%;
        background: url('../img/dc-logo.svg') no-repeat center;
        background-size: auto 100%;
        margin-bottom: 30px;
    }

    #logowanie-txt{
        width: 375px;
        height: 510px;
        padding: 0 60px;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }


    #logowanie-img{
        width: 355px;
        height: 510px;
        border-radius: 3px;
        background: url('../img/logowanie.jpg') no-repeat center;
    }

 


    .login-btn{
        border-radius: 3px;
        border: solid 1px #D5D5D5;
        color: #858585;
        font-size: 12px;
        font-weight: 400;
        text-align: left;
        padding: 8px 0 8px 82px;
        margin: 0 0 11px 0;
        display: block;
        position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
    }

    #ico-google{
        display: block;
        width: 20px;
        height: 20px;
        background: url('../img/icon-google.svg') no-repeat center;
        position: absolute;
        left: 55px;
        top: 5px;
    }
    #ico-fb{
        display: block;
        width: 20px;
        height: 20px;
        background: url('../img/icon-fb.svg') no-repeat center;
        position: absolute;
        left: 55px;
        top: 5px;
    }


        form input[type="text"].log-input, 
        form input[type="password"].log-input 
         
        {
           font-size: 12px;
           font-weight: 400;
           line-height: 1.2;
        color:#111111;
        padding: 10px;
        margin: 0 0 10px 0;
        border: 0;
        border-bottom: 1px solid #D5D5D5;
        border-radius: 0;

  
        }



        form input[type="text"].log-input:focus,
        form input[type="password"].log-input:focus 
        {

        background: transparent;

        }
       


        #logowanie-box{
            display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    font-size: 12px;
    height: 20px;
    line-height: 20px;
margin-bottom: 25px;
color: #858585;
        }

        #logowanie-box input{
            position: relative;
           top: 2px;
        }

        #logowanie-box b{
            font-weight: 500;
            color: #111111;
        }



.logowanie-txt-b{
    
font-size: 12px;
font-weight: 400;
line-height: 1.2;
}

.logowanie-txt-b a{
    color: #4285F4;
}



        #LgtFrm{
            margin-top: 20px;
        }


  












/* END POPUPY - INFO */



/* REJESTRACJA, DOKUMENTY, UŻYTKOWNIK */


 .flex-out{
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            justify-content: space-between;
        }
        
        
        .flex-out-sr{
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            justify-content: flex-start;
        }
        

        .frm-sm{
            width: 28%;
        }
        
        .frm-lg{
            width: 68%;
        }
        
        .frm-sr{
            width: 48%;
        }

        .info{
            margin: 0 0 4px 0;
            font-size: 12px;
            color: #9b9999;
            position: relative;
            top: -4px;
        }
        
        
        
.krok{

    font-size: 28px;
    font-style: normal;
    font-weight: 500;
line-height: 1.2;
margin: 60px 0 30px 0;  
border-bottom: 1px solid #D5D5D5;
padding: 0 0 15px 0;
position: relative;
}




.scr-box{
    width: 100%;
    height: 200px;
    overflow-y: auto; 
    margin: 20px 0 30px 0;
    padding: 0 10px;
    background: #fcfcfc;
    font-size: 13px;
}
  
        
        .rodo-info{
            margin-top: 45px;
            font-size: 13px;
        }
        
        .rodo-info h2{
            border-top: solid 3px #263033;
            text-transform: uppercase;
            font-weight: 700;
            font-size: 18px;
           margin: 30px 0 15px 0;
           position: relative;
           padding-top: 5px;
           color: #676767;
        }   




  .btn-lght{
            display: inline-block;
            text-transform: uppercase;
            color: #111111;
            font-size: 11px;
            padding: 7px 20px;
            margin: 15px 0 25px 0;
            border: solid 1px #111111;
            -webkit-border-radius: 3px;
        border-radius: 3px;
        background: #fff;
        cursor: pointer;
        }
        
        .btn-lght:hover{
            color: #fff;
            background: #111111;
        }



        

#user-kategorie{
    margin: 10px 0 30px 0;
}


.user-a{
    display: block;
    height: 50px;
    width: 230px;
    padding: 0;
    margin-right: 10px;
    display: block;
font-weight: 400;
line-height: 50px;
border: solid 1px #111111;
border-radius: 3px;
}

.user-o{
    background: #111111;
    color: #fff;
}



#user-info{
    padding: 15px 20px;
font-weight: 400;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
border-radius: 3px;
border: #D5D5D5;
background: #F2F2F2;
}

#user-znak-out{
    height: 100%;
    width: fit-content;
}

#user-znak{
    border-radius: 3px;
    background: #fff;
    width: 90px;
    height: 90px;
    text-align: center;
    line-height: 90px;
   font-size: 21px;
    font-weight: 700;
    margin-right: 50px;
}

#user-inc{
    display: flex;
flex-wrap: wrap;
justify-content: space-between;
    width: calc(100% - 140px);
}

.user-inc{
    margin-right: 100px;
    width: fit-content;
}

.user-inc span{
    display: block;
    margin: 15px 0 15px 0;
font-size: 13px;
font-weight: 700;
color: #858585;
}


.tablist-ng{
    border-radius: 3px 3px 0px 0px;
    background: #F2F2F2;
    padding: 30px 20px;
    font-size: 26px;
font-weight: 700;
margin: 30px 0 0 0;
border: solid 1px #D5D5D5;
border-bottom: 0;
line-height: 1.3;
}

.tablist{
    border-radius: 0px 0px 3px 3px;
    border: solid 1px #D5D5D5;
    border-top: 0;
    padding: 30px 20px;
}


#order-s{
    border-radius: 3px;
    border: solid 1px #D5D5D5;
    margin: 30px 0;
    overflow: hidden;
    
}

.orderth{
    background: #F2F2F2;
    padding: 30px 20px;
    font-size: 26px;
font-weight: 700;
line-height: 1.3;
}

.orderinc{
    padding: 30px 20px;
}

.orderinc b, .orderinc strong{
    font-weight: 700;
}

.orderinc strong{
    display: block;
    margin-bottom: 10px;
}


.orderflx{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
}

.orderflx > div{
    width: fit-content;
    margin-right: 60px;
}














/* END REJESTRACJA, DOKUMENTY, UŻYTKOWNIK */



/* KOSZYK */

#koszyk-show{
    max-width: 1450px;
    margin: 0 auto;
    position: relative;
}


#ods-b{
padding-top: 38px;
}

.basketng{
    border-bottom: solid 1px #D5D5D5;
    padding: 0 0 17px 0;
    font-size: 16px;
font-weight: 600;
    display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-start;
}

.basketng1{
    width: calc(100% - 310px);
}
.basketng2{
width: 100px;
}
.basketng3{
    width: 210px;
    text-align: center;
    }

.flex-basket{
    position: relative;
display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 25px 0 60px 0;
}  

.flex-polecamy{
    position: relative;
display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 10px;
    background: #F5F5F5;
    margin: 25px 0;
    border-radius: 3px;
}  

.flex-basket-img{
width: 87px;
}
.flex-basket-img img{
    width: 87px;
    height: auto;
}

.flex-basket-opis{
    width: calc(100% - 400px);
    padding: 0 20px;
    font-size: 13px;
    font-weight: 400;
}

.flex-basket-opis h5{
font-weight: 600;
font-size: 16px;
line-height: 1.3;

}

.flex-basket-ilosc{
    width: 100px;
}

.flex-polecamy-opis{
    width: calc(100% - 470px);
    height: 87px;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.flex-polecamy-opis h5{
    font-weight: 600;
    font-size: 16px;
    line-height: 1.3;
    
}

.flex-polecamy-cena{
    width: 160px;
    height: 87px;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 26px;
font-weight: 500;
color: #8B2F3C;

}

.flex-polecamy-kosz{
    width: 170px;
    height: 87px;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
 
}
   #polecamy-add, #polecamy-addm{
    border-radius: 3px;
background: #111111;
width: 150px;
height: 36px;
line-height: 36px;
text-align: center;
color: #fff;
text-transform: uppercase;
cursor: pointer;
   } 



.flex-basket-cena{
    width: 160px;
    text-align: right;
    font-size: 15px;
    font-weight: 500;
}

.flex-basket-del{
    width: 50px;
    text-align: right; 
}


.update-k{
    position: relative;
  margin: 24px 0 0 0;
    width: 96px;
    height: 32px;
    line-height: 32px;
}

.plus-k{
    position: absolute;
    right: 0;
    top: 0;
    width: 32px;
    height: 32px;
    cursor: pointer;
    border-radius: 0px 3px 3px 0px;
    background: #F5F5F5 url('../img/ico-plus.svg') no-repeat center;
}

.qty-k{
    width: 32px;
    height: 32px;
    border: solid 1px #111111;
    position: absolute;
    left: 32px;
    top: 0;
    text-align: center;
    line-height: 30px;
    font-size: 17px;
font-weight: 700;
}

.minus-k{
    position: absolute;
    left: 0;
    top: 0;
    width: 32px;
    height: 32px;
    cursor: pointer;
    border-radius: 3px 0px 0px 3px;
    background: #F5F5F5 url('../img/ico-minus.svg') no-repeat center;
}
  

.usun-k{
    width: 16px;
    height: 16px;
    background: url('../img/ico-del.svg') no-repeat center;
    margin: 32px 0 0 auto;
    cursor: pointer;
    z-index: 100;
}

.flex-basket-cena .k-cena{
    margin-top: 23px;
    height: 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.flex-basket-cena .k-cena .p-upust{
color: #D5D5D5;
font-size: 12px;
text-decoration: line-through;
font-weight: 500;
}
.flex-basket-cena .k-cena .p-rabat{
    color: #8B2F3C;
    font-size: 12px;
    font-weight: 400;
    padding-left: 5px;
    }
    


#koszyk-left{
width: 63%;
}

#koszyk-right{
    width: 30%;
    border-radius: 3px;
border: 1px solid #111111;
padding: 40px 30px 30px 30px;
position: -webkit-sticky;
        position: sticky;
        top: 0;
}

.koszng{
    font-size: 28px;
font-weight: 500;
margin: 40px 0 35px 0;
line-height: 1.2;
}

#koszyk-right .koszng{
    margin: 0 0 35px 0;
}




.ks-opis{
width: calc(100% - 110px);
padding-bottom: 20px;
font-weight: 600;
font-size: 16px;
}

.ks-opis > span{
    display: block;
    width:fit-content;
    font-size: 12px;
    background-size: 12px auto;
    background-repeat: no-repeat;
    background-position: right;
    padding-right: 20px;
}

.ks-cena{
    width: 110px;
    text-align: right;
    padding: 0 0 20px 10px; 
    font-size: 16px;
    font-weight: 500;
}


#k-suma{
    border-top: 1px solid #111111;
    padding: 30px 0; 
      
}
#k-suma .ks-opis{
    width: fit-content;
}

#total-zamowienie{
    width: fit-content; 

   color:  #8B2F3C; 
   font-size: 26px;
font-weight: 500;
}

.ks-rabat{
   color:  #8B2F3C;
}

.magazyn-n{
    background: #8B2F3C;
    color: #fff;
    padding: 16px;
    text-align: center;
    font-size: 13px;
    margin-bottom: 12px;
}

#do-kasy{
    width: 100%;
    display: block;
    text-align: center;
    height: 72px;
    background: #111111;
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    line-height: 72px;
    margin-bottom: 15px;
    border-radius: 3px;
}

#kontynuuj-zakupy{
    width: 100%;
    display: block;
    text-align: center;
    height: 36px;
    border: solid 1px #111111;
    color: #111111;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 36px;
    border-radius: 3px;
}

    
    
    table.Basket{
    empty-cells: show;
    width: 100%;
    border-collapse: collapse;

    }

    table.Basket img{
        display: inline-block;
      
    }
    
    
    table.Basket td{
    padding: 10px 7px;
    border: solid 1px #d6d6d6;
    vertical-align: middle;
    line-height: 1.3;
    }
    
    
    table.Basket thead{
    font-weight: bold;
    text-align: center;
    }
    
    
    
    table.Basket tr.a{
    background: #f1f1f1;
    }
    
    table.Basket h3{
    margin: 0 0 5px 0;
    }
    table.Basket a{
    color: #293033;
    }
    
    
    
    
    table.Basket .bigc{
    font-size: 20px;
    
    }
    
.only-mob{
    display: none;
}


form input[type="submit"].sbm2 {
	background:transparent;
	display: inline-block;
		border-left: solid 1px #af8655;
        border-right: solid 1px #af8655;
        border-top: 0;
        border-bottom: 0;
		color: #af8655;
		font-size: 12px;
		padding: 2px 0;
        width: 60px;
        height: 22px;
        line-height: 22px;
		margin: 0 0 0 10px;
     cursor: pointer;
     text-transform: none;
     font-weight: 400;
     letter-spacing: 0;
	
	}



.mobile-s{
    display: none;
}

table.zamowienie{
	empty-cells: show;
	width: 100%;
	border-collapse: collapse;
	margin: 0;
	}

    table.zamowienie thead{
        font-weight: 700;
        }

	table.zamowienie a{
		color: inherit;
	}

	table.zamowienie tr.lth td{
		color: #d6d6d6 !important;
	}

    table.zamowienie tr.lth b, table.zamowienie tr.lth strong, table.zamowienie tr.lth .zcena{
        color: #d6d6d6 !important;
    }
	
	
	table.zamowienie td{
	padding: 20px;
	border-bottom: solid 1px #D5D5D5;
	font-size: 13px;
    color: #858585;
	}
    table.zamowienie strong, table.zamowienie b{
        font-size: 18px;
        color: #111111;
font-weight: 700;
    }

    table.zams td{
        color: #111111;
    }



    table.zams a{
        text-decoration: underline;
    }
    





.zcena{
	font-size: 18px;
        color: #111111;
        font-weight: 700;
}

.ctr{
	text-align: center;
}
.rgt{
	text-align: right;
}

#dozaplaty{
margin: 30px 0 30px auto;
width: fit-content;
height: 42px;
line-height: 42px;
padding: 0 100px;
background: #111111;
color: #fff;
font-size: 18px;
font-weight: 500;
border-radius: 3px;
}


table.zamowienie tr.odst td{
	border: 0;
	padding: 5px;
}


.status{
    width: fit-content;
    height: 35px;
    line-height: 35px;
    border-radius: 3px;
    background: #F2F2F2;
    color: #111111;
    font-size: 13px;
font-weight: 500;
padding: 0 20px;
margin: 0 0 0 auto;
}

.status-1{
    color: #43B2A3;
    background: #E6F6F3;
}
.status-2{
    color: #de8c00;
    background: #ffeed1;
}
.status-3, .status-4{
    color: #fff;
    background: #111111;
}
.status-5{
    color: #c40000;
    background: #ffe5e5;
 
}


.Sinfo2{
	background: #e2ded9;
	padding: 24px;
	margin: 0 0 24px 0;
    font-size: 13px;
}




/* END KOSZYK */





.flex-2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start; 
}

.flex-s{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start; 
}

.flex-rev{
    flex-direction: row-reverse;
}

.flex-inc{
width: 46%;
position: relative;
}

.flex-inc3{
    width: 31%;
    position: relative;  
}

.flex-inc3a{
    width: 33.3333%;
    position: relative;  
}

.flex-inc .tresci{
    max-width: 400px;
}

.flex-inc > img{
    max-width: 100%;
    height: auto;
}

.flex-inc .h1{
    margin-top: 0;
}





.flex-img{
    width: 100%;
    text-align: right;
    margin: 50px 0 0 0;
}

.flex-img img{
    max-width: 100%;
    height: auto;
}



  #termin-r{
                margin: 0 0 25px 0;
                }
                
                #termin-r b{
                color: #1b6e87;
                }
                
                .termin-r{
                
                font-size: 12px;
                font-style: italic;
                margin: 0;

                }

                .termin-r b{
                    font-weight: 700;
                }

                .termin-r span{
                    color: #bdbdbd;
                }

                .termin-r p{
                    margin: 7px 0;
                }

/* DOKUMENTY */

.clear{
    clear: both;
    }

.h-blok{
    display: -moz-box;
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    justify-content: space-between ;
    flex-wrap: wrap;
    margin-bottom: 90px;
  }
  
  .h-blok-rev{
    display: -moz-box;
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    justify-content: space-between ;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    margin-bottom: 90px;
  }
  
  .h-image{
      width: 50%;
  }

  .h-image img, .h-image video{
    width: 100%; 
    height: auto;
  }
  
  .h-text-right{
    padding: 0 0 40px 50px;
    width: 50%;
  }
  
  
  .h-text-left{
    padding: 0 50px 40px 0;
    width: 50%;
  
  }

  .h-text-left .h1, .h-text-right .h1{
margin-top: 0;
  }



  .doc-flex{
    width: 100%;
     display: -moz-box;
        display: -webkit-flexbox;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: -moz-flex;
        display: flex;
        justify-content: space-between ;
        flex-wrap: wrap;
    }
    .doc-lewy{
        width: 45%;
        padding: 32px 0;
        }
        
        .doc-prawy{
			width: 45%;
			padding: 32px 0;
			}
			
	
			.doc-caly{
                width: 100%;
                clear: both;
                padding: 32px 0;
                }

 

    
			.wrapper-inc{
                width: 100%;
                max-width: 916px;
                clear: both;
                 margin: 0 auto;
                }

	.tab-sec{
				border-bottom: solid 1px #D5D5D5;
				padding: 15px 0;
				}


	.tab-h{
				background-position: left;
				background-repeat: no-repeat;
				font-size: 14px;
						padding: 5px 0 5px 0;
			cursor: pointer;
				position: relative;
				text-transform: uppercase;
				}
				
				
				
				
				.tab-h i{
				 font-style: normal !important;
				  }
				
				
				.tab-cont{
				padding: 20px 0;
				display: none;
				}
				
				.angl{
                position: absolute;
                width: 30px;
                height: 30px;
				right: 0;
                top: 0;
                }
                
                .onangl{
                    position: absolute;
                    width: 30px;
                    height: 30px;
                    right: 0;
                    top: 0;
                    }


                    .angl:before { 
        content: "\e313"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 0;
        top: 0;
}

   .onangl:before { 
        content: "\e316"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 0;
        top: 0;
}



	.flex-box3{
			width: 31%;
			padding: 40px 0;
			}
		

		
.box-f-image{
	width: 100%;
	height: auto;
	margin-bottom: 20px;
  }
  
  .box-f-image img{
	width: 100%; 
	height: 100%; 
	object-fit: cover;

  }

		
  .box-d-image img{
    width: 100%;
    height: auto;
    margin-bottom: 20px;

                }





           
                  
            
            
            
            
                
                      




   

                .pliki-out{
                    margin: 32px 0;
                  }
                  
          
          
          ul.pliki {
            list-style: none;
            padding: 0;
            margin: 0;
            
          }
          


            
          .pliki li{
              padding: 2px 0 2px 34px;
                        margin: 20px 0;
                        background: url('../img/download.svg') no-repeat left;
             }

            .pliki li a{
                display: block;
        
             }
            
           .pliki li span{
            display: block;
            color: #a6a6a6;
            font-size: 13px;
            
            }
          
          
       
    



                .galeria-out {
                    display: flex;
                    flex-wrap: wrap;
                    align-items: flex-start;
                    justify-content: space-between;
                    margin-bottom: 90px;
                  }

                  .galeria-2{
                      width: calc(50% - 2px);
                      margin: 2px 0;
                  }

                  .galeria-3, .galeria-2l{
                    width: calc(33% - 2px);
                    margin: 2px 0;
                }

                .galeria-2r{
                    width: calc(67% - 2px);
                    margin: 2px 0;
                }

                  
             
                  .g-img-art{
                  width: 100%;
                  height: 100%;
                  position: relative;
                  background-position: center;
                  background-repeat:no-repeat;
                      background-size:cover;
                  }
                  
                  .g-img-art img{
                    width: 100%; 
                    height: 100%; 
                    object-fit: cover;
                    vertical-align: middle;
                  }
                  
                  
                


                  .g-img{
                    width: 100%;
                    height: 100%;
                    background-position: center;
                    background-repeat: no-repeat;
                    background-size:cover;
                    position: relative;
                    }
                    
                    
                    .g-img span, .g-img-art span, .g-img-prod span{
                    width: 100%;
                    height: 100%;
                    left: 0;
                    top: 0;
                    padding: 0 10px;
                    text-align: center;
                    position: absolute;
                    color: #fff;
                    background-color: rgba(0, 0, 0, 0.7);
                    opacity: 0;
                    filter: alpha(opacity=0);
                    font-size: 14px;
                    display: flex;
                    z-index: 3;
                    transition: opacity 0.6s, visibility 0.6s;
                      flex-direction: column;
                      justify-content: center;
                    
                      -webkit-box-sizing: border-box;
                    -moz-box-sizing: border-box;
                    box-sizing: border-box;
                    }
                    
                    .g-img span i, .g-img-art span i, .g-img-prod span i{
                    color: #fff;
                    font-size: 40px;
                    
                    }
                    
                    
                    
                    .g-img span:hover, .g-img-artx span:hover, .g-img-prod span:hover{
                        opacity: 1.0;
                        filter: alpha(opacity=100);
                         transition: opacity 0.6s, visibility 0.6s;
                    }
                    
                    
                    
                    
                    
                    
                    .g-img .flm, .g-img-art .flm, .g-img-prod .flm{
                      width: 100%;
                      height: 100%;
                      left: 0;
                      top: 0;
                      padding: 0 10px;
                      text-align: center;
                      position: absolute;
                      color: #fff;
                      font-size: 64px;
                      z-index: 2;
                    
                      opacity: 0.8;
                      filter: alpha(opacity=80);
                      display: flex;
                        flex-direction: column;
                        justify-content: center;
                      }
                      
                    
                      .flm i{
                        font-style: normal !important;
                      }
                      
                      
                    




.rowinc{
    height: 32px;
}




#BanerCaly{
    width: 100%;
    height: auto;

}

#BanerCaly img{
    width: 100%;
    height: auto;

}


#Baner-Strefa, .Baner-Strefa{
    margin: 50px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start; 
    width: 100%;
}

.BanerySm, .Banery{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start; 
    width: 100%;
}


.Baner-Strefa h4,  .Banery h4{
    font-size: 26px;
    font-weight: 500;
    margin: 30px 0 5px 0;
    line-height: 1.2;
}

#Baner-Strefa .h3, .BanerySm .h3{
    margin: 35px 0 5px 0;
    font-weight: 500;
    font-size: 26px;
    line-height: 31px;
}


#Baner-Strefa a, .BanerySm a{
    display: block;
    position: relative;
    width: 32.5%;
    font-weight: 400;
    font-size: 15px;
    line-height: 18px;
    text-align: center;
    margin-bottom: 60px;
}

#Baner-Strefa .more, #Baner-Strefa .morenc,  .BanerySm .more,  .BanerySm .morenc{
    margin: 25px auto 0 auto; 
}



.Baner-Strefa a, .Banery a{
    display: block;
    position: relative;
    width: 49%;
    margin: 45px 0;
    text-align: center;
    font-size: 15px;
    font-weight: 400;
}

.Baner-Strefa span.button, .Banery span.button{
    margin: 35px auto 0 auto;
}




.pielegnacja-img{
    width: 100%;

}




.bsa-txt{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    padding: 24px 0;
    text-align: center;
}


.bsa-txt .more{
    margin: 42px auto 0 auto; 
}


.Baner-Strefa1{
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-bottom: 60px;
    text-align: center;
    }


.Baner-Strefa1 a:not(.more){
display: block;
width: 100%;
}

.Baner-Strefa1 a.more{
    margin-left: auto;
    margin-right: auto;
}
    










.Baner-Strefa2{
width: 100%;
height: 660px;
overflow: hidden;
position: relative;
margin-bottom: 90px;
}

.Baner-Strefa2 .wrapper{
    height: 100%;
}






.Baner-Strefa2 .wrapper{
    height: 100%;
}


.bs-img1{
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    height: 100%;

}

.bs-img1 img{
    height: 100%;
}

.bs-img2{
    position: absolute;
    height: 90%;
    right: 0;
    bottom: -20px;

}

.bs-img2 img{
    height: 100%;
}





.bsa2-txt{
position: relative;
z-index: 2;
   width: 540px;
   height: 100%;
margin: 0 auto 0 35%;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
 
}

.bsa2-txt h4{
    font-weight: 500;
    margin: 0;
font-size: 172px;
line-height: 140px;

}

.bsa2-txt span{
    display: block;
    position: absolute;
    bottom: 107px;
     right: 35px;
     font-size: 36px;
line-height: 34px;
font-weight: 400;
}




.strona-produkty{
    margin-bottom: 90px;
}

.strona-produkty .h2{
    margin: 0 0 40px 0;
}





              .mleft{
                width: 160px;
                padding: 0 10px 0 0;
                margin: 0;
                position: -webkit-sticky;
position: sticky;
top: 110px;
height: 100vh;
overflow-y: auto;
                }




                .mleft li{
                    font-size: 12px;
                    margin: 5px 0;
                    
                }



/* width */
.mleft::-webkit-scrollbar {
    width: 6px;
  }
  
  /* Track */
  .mleft::-webkit-scrollbar-track {
    background: #f6f5f5; 
  }
   
  /* Handle */
  .mleft::-webkit-scrollbar-thumb {
    background: #dddddd; 
  }
  
  /* Handle on hover */
  .mleft::-webkit-scrollbar-thumb:hover {
    background: #9c9c9c; 
  }

#RightMain{
    width: calc(100% - 200px);
}



.marka-b{
    width: 19%;
    height: 94px;
    margin: 0 0 20px 0; 
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #D5D5D5;
    border-radius: 3px;
    background: #fff;
}

.marka-b img{
    max-height: 50px;
    max-width: 80%;
    width: auto;
    height: auto;
}













#popupob{
    text-align: left;
    position: relative;
padding: 40px 30px;
}



    #popupob h3{
        font-size: 18px;
        margin: 0 0 40px 0;
    }



    .popupob-w{
        width: 100%;
        height: 40px;
        line-height: 40px;
        margin: 10px 0;
        cursor: pointer;
        

    }

    .popupob-o{
        position: relative
    }


    .popupob-o:after{
        content: "";
        display: block;
        position: absolute;
        width: 10px;
        height: 30px;
        background: #111111;
        left: -40px;
        top: 0;

    }

    .popupob-w > div{

        display: inline-block;
        height: 16px;
        width: 40px;


    }

    .popupob-w > div > img{
        height: 16px;
        width: auto;
    }




#popupnl-mask{
	position: fixed;
	width: 100%;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 1000000000;
	top: 0;
	left: 0;
display: none;

	}

    #popupnl-mask2{
        position: fixed;
        width: 980px;
        height: 340px;
        z-index: 1000000000;
        left: 0;
        right: 0;
        margin: 0 auto;
        bottom: 50px;
    display: none;
    
        }
	
	#popupnl-mask > div{
        width: 100%;
        text-align: center;
        height: 100vh;
        display: flex;
          flex-direction: column;
          justify-content: center;
          z-index: 0;
        }


        #popupnl-content{
            width: 900px;
            margin: 0 auto;
            padding: 0;
            text-align: center;
            position: relative;
            max-height: 90vh;
            min-height: 560px;
            overflow-y: auto;
            z-index: 1;
            -webkit-border-radius: 3px;
border-radius: 3px;
display: flex;
flex-direction: column;
justify-content: center;
background-repeat: no-repeat;
background-size: cover;
            }


            #popupnl-content2{
                width: 100%;
                height: 100%;
                overflow-y: auto;
                z-index: 1;
                -webkit-border-radius: 3px;
                border-radius: 3px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
                }



            #popupnl-content-inc{
                width: 400px;
                height: 80%;
                margin: 0 auto;
                padding: 40px 40px;
                background: #fff;
                -webkit-border-radius: 3px;
                border-radius: 3px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                position: relative;
            }

            #popupnl-content-inc2{
                width: 50%;
                height: 100%;
                margin: 0;
                padding: 40px 40px;
                background: #fff;
                -webkit-border-radius: 3px 0 0 3px;
                border-radius: 3px 0 0 3px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                position: relative;
            }

            #logo-nl{
              
                width: 65px;
                height: 25px;
                 background: url('../img/dc-logo.svg') no-repeat center;
              background-size: contain;
                margin: 0 auto 26px auto;
    
            }

            #popupnl-form-up{
                margin: 15px 0 15px 0;
            }

            #popupnl-form{
                position: relative;
                margin: 0 0 20px 0;
            }

            #popupnl-content-inc2 #popupnl-form{
                margin: 20px 0 10px 0;
            }

            #popupnl-form form input[type="text"]{
                 
                border: solid 1px #CECECE;
                background: #F6F6F6;
                -webkit-border-radius: 3px;
                border-radius: 3px;
                font-size: 13px;
                padding: 8px 10px;
                width: 100%;
                    -webkit-box-sizing: border-box;
                    -moz-box-sizing: border-box;
                    box-sizing: border-box;
          
               
            }

        

            #popupnl-submit{
                position: absolute;
                width: 73px;
                height: 32px;
                -webkit-border-radius: 3px;
                border-radius: 3px;
                background: #111111;
                line-height: 32px;
                color: #fff;
                text-align: center;
                right: 0;
                top: 0px;
                font-size: 11px;
                text-transform: uppercase;

            }


            #popupnl-mask , #popupnl-mask2 h3{
                font-size: 22px;
                margin: 0;
                line-height: 1.2;
                font-weight: 500;

            }
            #popupnl-mask h4, #popupnl-mask2 h4{
                font-size: 11px;
                margin: 0.4em 0 0.8em 0;
                line-height: 1.2;
                text-transform: uppercase;
                font-weight: 500;

            }



            #popupnl-mask .tresci, #popupnl-mask2 .tresci{
                font-size: 11px;
        

            }
            #popupnl-mask .tresci p, #popupnl-mask2 .tresci p{
                margin: 0;
                line-height: 1.3em;
            }





            #popupnl-exit {
                width: 28px;
                height: 28px;
                        cursor: pointer;
                        display: block;
                        background: #111111 url('../img/zamknij2.svg') no-repeat center;
                        position: absolute;
                        bottom: 20px;
                        right: 0;
                        left: 0;
                        margin: 0 auto;
                         line-height: 28px;
                        -webkit-border-radius: 50%;
border-radius: 50%;
                        
                    
                    }

                    #popupnl-exit2{
                        width: 28px;
                        height: 28px;
                                cursor: pointer;
                                display: block;
                                background: #111111 url('../img/zamknij2.svg') no-repeat center;
                                position: absolute;
                                top: 10px;
                                right: 10px;

                                 line-height: 28px;
                                -webkit-border-radius: 50%;
        border-radius: 50%; 
                    }




/* BLOG */


.blog-top-img{
    width: 48%;
    height: auto;
    position: relative;
    margin: 0 0 15px 0;
}



.blog-top-img > img{
width: 100%;
height: auto;
}

.blog-top-txt{
    width: 48%;
}



#blog-main{
    width: 100%;
    position: relative;
    height: calc(100vh - 300px);
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0 0 30px 0;
}

#blog-main .wrapper{
    height: 100%;
}


#blog-main #Sciezka, #blog-main #Sciezka a{
    color: #fff !important;
}



#blog-main #backto{
    background: transparent;
    border: solid 1px #fff;
}


.mag-kat{
    display: block;
    width: fit-content;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
    height: 20px;
    padding: 0 9px;
    border: solid 1px #111111;
    border-radius: 3px;
    margin: 0;
}


  #blog-home-txt{
    position: absolute;
    bottom: 100px;
    max-width: 1000px;
    color: #fff !important;
}

#blog-home-txt .h1{
margin: 14px 0 20px 0;
}

#blog-home-txt .mag-kat{
border: solid 1px #fff;
}






.blog-h-left{
    width: 46.1%;
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
}

#bloghleft{
    position: -webkit-sticky;
position: sticky;
 top: 120px;
}



.blog-h-right{
    width: 51%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start; 
}

#blog-w-more{
    width: 100%;
}

.blog-wpis{
    display: block;
    width: 100%;
    font-size: 14px;
}

.blog-wpis-s{
    display: block;
    width: 47.2%;
    font-size: 14px;
    margin-bottom: 44px;
}

.blog-wpis h4, .blog-wpis-s h4{
    font-size: 27px;
    margin: 15px 0;
    font-weight: 600;
}



.blog-img{
    width: 100%;
    height: auto;
    position: relative;
    margin: 0 0 15px 0;
}



.blog-img > img{
width: 100%;
height: auto;
}

.blog-more{
    display: block;
    margin: 15px 0 0 0;
    font-size: 12px;
    position: relative;
    text-transform: uppercase;
    width: fit-content;
    padding: 0 24px 0 0;
    text-decoration: underline;
}

.blog-more:before { 
        content: "\e145"; 
        font-family: "Material Symbols Outlined"; 
        position: absolute;
        font-size: 22px;
        right: 0;
        top:-6px;
}


.blog-s-wpis{
    margin: 0 0 100px 0;
}

.blog-s-txt{
width: 48%;

}

.blog-s-img{
    width: 48%;

    }

    .blog-s-img img{
        width: 100%;
        height: auto;

    }


















#blog-ng{
    width: 41%;
padding: 0 0 80px 0;
}




#blog-ng-img{
    width: 49%;
}




#blog-ng-img img{
    width: 100%;
    height: auto;
}


#blog-mapa{
    width: 49%;
    height: 600px;

}

.blog-kat{
    display: block;
    text-transform: uppercase;
    font-size: 15px;
line-height: 18px;
    margin: 0;
}


.blog-caly{
    width: 100%;
    max-width: 1154px;
    clear: both;
    padding: 40px 0 0;
    margin: 0 auto;
    }

    #blog-foto-l{
    width: 32%;
    }
    #blog-foto-r{
        width: 66%;
        }
.blog-foto{
    width: 100%;
    max-width: 728px;
    clear: both;
    padding: 40px 0;
    margin: 0 auto; 
    text-align: center; 
}

.blog-foto img{
    max-width: 100%;
    height: auto;
}

#blog-fotos{
    padding-bottom: 80px;
}

#produkty-blog{
    background: #fff;
    padding-top: 56px;
}


.blog-od{
    height: 40px;
}



#blog-wiecej{
    width: 170px;
margin: 40px  auto 0 auto;
}


#blog-s-top{
    text-align: center;
    margin: 40px 0 100px 0;
}

.blog-data{
    color: #354f70;
font-size: 12px;
text-decoration: underline;
font-weight: 400;
margin: 0 0 20px 0;
}

#blog-s-top .mag-kat{
    margin: 0 auto;
}


#blog-s-top h1{
    font-size: 24px;
font-weight: 400;
color: #6ABC94;
text-align: center;
margin: 40px 0;
}

#blog-s-top h4{
    color: #6ABC94;
    text-align: center;
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.2;
}


#blog-tresc{
    margin: 0 auto 100px auto;
    max-width: 950px;
}






.blog-s-produkty{
    margin-bottom: 100px;
}







#blog-kategorie{
    margin: 60px 0 48px 0;
}

#blog-kategorie span{
    display: none;
}





/* END BLOG */


/* SALONY */

.salon-inc{
    width: 49%;
    padding-bottom: 80px;
}

.salon-img{
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.salon-img img{
    width: 100%;
    height: auto;
    }



    .salon-inc p{
     margin: 16px 0;
    }

    .salon-inc p base{
        font-weight: 600;
    }



    .salon-inc p a{
        color: #8B2F3C;
    }










/* END SALONY */


/* KATALOGI */



.katalog{
    width: 19%;
    text-align: center;
    margin: 0 0 40px 0;
    padding-bottom: 20px;
}




.katalog div{
    margin-bottom: 20px;
    border-radius: 10px;
    aspect-ratio: 3 / 4;
    position: relative;
}



.katalog div img{
    width: 100%; 
	height: 100%; 
	object-fit: cover;
}


/* END KATALOGI */


/* PROJEKTANCI */


.design{
    width: 22.5%;
    text-align: center;
    text-transform: uppercase;
    margin: 0 0 46px 0;
    padding-bottom: 20px;
    font-size: 15px;
font-weight: 500;
line-height: 1.2;
}




.design-img{
    margin-bottom: 20px;
    border-radius: 3px;
    aspect-ratio: 2 / 3;
    position: relative;
}



.design-img img{
    border-radius: 3px;
    width: 100%; 
	height: 100%; 
	object-fit: cover;

}

.design-txt{
    text-transform: none;
    text-align: left;
    font-weight: 400;
    margin-top: 10px;
    display: none;
}

.design-more{
    margin: 20px auto 0 auto;
    background: #111;
    color: #fff;
    text-align: center;
    padding: 7px 25px;
    width: fit-content;
    border-radius: 3px;
    font-size: 12px;
    cursor: pointer;
}



/* END PROJEKTANCI */


/* MAPA STRONY */
#MapaStrony h3{
font-size: 20px;
font-weight: 700;

}


#MapaStrony > div > ul{
margin: 30px 0 ;
}

#MapaStrony > div > ul > li > ul{
margin: 20px 0;
}

#MapaStrony > div > ul > li > ul > li ul{
margin: 10px 0 10px 20px;
}






#MapaStrony > div > ul  li{
margin: 5px 0;
}

#MapaStrony > div > ul > li > a{
    font-weight: 700;
text-decoration: underline;
text-underline-offset: 5px;
}


#MapaStrony > div > ul > li > ul > li{
font-weight: 700;
text-decoration: none !important
}

#MapaStrony ul > li > ul > li > ul > li{
font-weight: 400;
text-decoration: none !important;
}

/* END MAPA STRONY */