﻿
.productGroup-page{clear:both; padding-top:0px; width:100%; float:left; position:relative; }

.row-group{width:100%; float:left; position:relative; margin-bottom:80px; z-index:3;}
.row-group .body-group{width:100%; float:left; position:relative;}
.pxl-divider-separator{width:100%; float:left; height:1px; --clr-border: #0D401C26; background-image: repeating-linear-gradient(90deg, var(--clr-border), var(--clr-border) 7px, transparent 7px, transparent 11px); background-repeat: no-repeat;}
.row-group:first-of-type .pxl-divider-separator{display:none;}
.row-group:last-of-type{margin-bottom:0;}

@media (max-width:767px) {
    body{padding-bottom:60px}
   
   .row-group{width:100%; margin-top:0; padding-top:40px; margin-bottom:0; }
   .row-group:first-of-type{margin-top:0px; border-top:0; padding-top:0;}
   .row-group:last-of-type{padding-bottom:20px;}
}

@media (min-width:1600px) {
    
}


.title-groubSub{width:100%; float:left; position:relative; margin-bottom:15px; padding-left:65px;}
.title-groubSub h3{display:block; font-weight:600; margin:0; color:#000; font-size:27px; font-family: "Signika", sans-serif; float:left; padding-top:45px; margin-bottom:20px; }
.title-groubSub h3:before{content:'01'; position:absolute; top:-1px; left:0; font-weight:900; font-family:Roboto; font-size:18px; height:85px; padding-top:50px; color:#fff; background:var(--color1); width:46px; text-align:center; border-radius: 0 0 25px 25px; display:block;}
.title-groubSub .wrap-more{float:right; position:absolute; top:43px; right:0px; background:var(--colorBg); line-height: 40px; border-radius:20px; height:40px; padding: 0 25px 0 20px; }
.title-groubSub .wrap-more .col-total{float:left; position:relative; padding-right:20px; margin-right:20px;}
.title-groubSub .wrap-more .col-total:before{content:''; width:1px; height:16px; top:15px; background:rgba(0,0,0,.15); position:absolute; right:0; display:block;}
.title-groubSub .wrap-more .col-total b{float:left; position:relative; color:var(--color1); font-weight:900; padding-right:5px;}
.title-groubSub .wrap-more .navMore{position:relative; display:block; float:left; color:#000;  transition:.3s; font-weight:500; }
.title-groubSub .wrap-more .navMore:hover{color:var(--color1)}
.row-group:nth-of-type(2) .title-groubSub h3:before{content:'02'} .row-group:nth-of-type(3) .title-groubSub h3:before{content:'03'} .row-group:nth-of-type(4) .title-groubSub h3:before{content:'04'} .row-group:nth-of-type(5) .title-groubSub h3:before{content:'05'} .row-group:nth-of-type(6) .title-groubSub h3:before{content:'06'} .row-group:nth-of-type(7) .title-groubSub h3:before{content:'07'} .row-group:nth-of-type(8) .title-groubSub h3:before{content:'08'} .row-group:nth-of-type(9) .title-groubSub h3:before{content:'09'} .row-group:nth-of-type(10) .title-groubSub h3:before{content:'10'}


@media (max-width:767px) {
   .row-group .title-group{position:relative; bottom:inherit; margin:0;}
   .row-group .title-group .col-left span{font-weight:bold; font-size:13px; opacity:.75; text-transform:uppercase; letter-spacing:1px; }
   .row-group .title-group .col-left label{text-transform:inherit; color:var(--color1); letter-spacing:inherit}
   .row-group .title-group .nav-all{position:absolute; top:0; right:0; padding: 0 15px;}
   .row-group .title-group .nav-all:after{display:none;}

   .title-groubSub{min-height:85px; margin-bottom:35px; }
   .title-groubSub h3{ padding-top:20px; font-size:24px;}
   .title-groubSub .wrap-more{float:initial; display:block; margin: 0 auto; width:calc(100% - 65px); clear:both; height:40px; line-height:40px; border-radius:20px; background:none; right:0; padding:0; top:50px;}
   .title-groubSub .wrap-more .col-total{width:auto; text-align:left; padding:0 0; display:flex; justify-content:center; float:left; margin:0; }
   .title-groubSub .wrap-more .col-total b{float:initial;}
   .title-groubSub .wrap-more .col-total:before{display:none;}
   .title-groubSub .wrap-more .navMore{right:initial; top:initial; float:right; text-align:center}
   .title-groubSub label{font-size:17px; text-transform:uppercase}
}

@media (min-width:768px) and (max-width:991px) {
   .productGroup-page{padding-bottom:0px;}
   .row-group:first-of-type{margin-top:0;}
}

@media (min-width:992px) and (max-width:1199px) {

}

@media (min-width:1200px) and (max-width:1439px) {

}

/* List products */
ul.list-product li .product-item .nav-catalog{display:none;}
ul.list-product li .product-item .name{margin-top:20px;}

@media (max-width:767px) {
}
@media (min-width:768px) and (max-width:991px) {
}

@media (min-width:992px) and (max-width:1199px) {
}

@media (min-width:1200px) and (max-width:1439px){
}
@media (min-width:1440px){
   
}

/* barTop on Mobile */

.barTop{width:100%; position: fixed; top: 65px; height: 50px;left: 0;background: #fff;z-index: 20; box-shadow: 0 2px 3px rgba(0, 0, 0, .05),0 1px rgba(0,0,0,.04);}
.barTop .titlebar{line-height: 50px; float: left; font-size: 16px; text-transform: uppercase; font-weight: 900; padding-left:10px; color:var(--color2);}
.barTop .dropFilter{position:absolute; float:right; top:7px; right:10px; width:190px; }
.barTop .dropFilter .nav-drop{line-height:34px; background:var(--color-bg); display:block; border-radius:6px; padding: 0 25px 0 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#000; font-size:15px; width:100%!important; font-size:15px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.05); position:relative;}
.barTop .dropFilter .nav-drop:after{font-family: "Font Awesome 5"; font-weight: 900; font-size:12px; content: "\f0d7"; position:absolute; top:0; right:10px;}
.barTop .dropFilter ul{margin:0; padding:0 5px 5px 5px; list-style:none; position:fixed!important; top:115px!important; left:initial!important; right:0!important; display:block; transform:initial!important; border:0; width:100%; border-radius:0 0 10px 10px; transition:.3s; opacity:0; visibility:hidden;}
.barTop .dropFilter ul li{width:calc(50% - 10px); float:left; margin: 5px;}
.barTop .dropFilter ul li a{text-decoration:none;color:#000; font-size:15px; line-height:40px; padding: 0 15px; background:var(--color-bg); display:block; width:100%; border-radius:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.barTop .dropFilter.show ul{opacity:1; visibility:initial}