 .collection_material {
    background-color: #fff;
}
 .collection_material .collection_materials .flex{
    gap: 60px;
    padding: 0 3.9em;
     display: flex;
     max-width: 1920px;
     margin: auto;
     align-items: flex-start;
}
.single.single-product .collection_material .collection_materials .flex{
    padding-bottom: 3.9em;
}
 .collection_materials .left_section,
 .collection_material .collection_materials .right_image{
    width: 50%;

}
 .collection_material .collection_materials .right_image {
    position: relative;
    /*padding-top: 110%;*/
}
 .collection_material .collection_materials .right_image:after {
    display: block;
     content: "";
     padding-top: 93%;
}

 .collection_material .collection_materials .right_image img{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;

}
  .collection_material .collection_materials .flex{
    padding: 0 3.9em;
    /*height: 150vh;*/

}
 .collection_material .collection_materials #materials_finishes.active{
    overflow: auto;
    padding-right: 0!important;
}
 .collection_material .collection_materials #materials_finishes{
    /*padding-right: 15px!important;*/
    overflow: auto;
    /*height: calc(100vh - 150px);*/
    max-height: 523px;
    min-height:unset!important;

}
 .collection_material .collection_materials .material_inner:first-child{
    padding-top: 40px;
}
 .collection_material .collection_materials .material_inner{
    max-width: 1550px;
    margin: auto;
    padding-bottom: 30px;
}
  .collection_material .collection_materials .material_inner .material_inner_title{
    color: #424242;
    font-family: "Basis Grotesque Pro";
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 16px;
    margin-bottom: 20px;

}
  .collection_material .collection_materials .material_inner .images-container{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
 .collection_material .collection_materials .material_inner .images-container .attr-img-cont {
    width: calc(20% - 18px);
    cursor: url("/wp-content/themes/hello-theme-child-master/assets/img/Plus-Icon.svg") 23 23, auto;

}
 .collection_material .collection_materials .material_inner .images-container .attr-img-cont img {
    border: 1px solid transparent;
    transition: all 0.3s;
}
 .collection_material .collection_materials .material_inner .images-container .attr-img-cont:hover img {
    border-color: #424242;
}
 .collection_material .collection_materials .material_inner .images-container .attr-img-cont .attributes_image_container{
    margin-bottom: 10px;
    position: relative;
    overflow: hidden;
}
 .collection_material .collection_materials .material_inner .images-container .attr-img-cont .attributes_image_container:after{
    content: "";
    display: block;
    padding-top: 70%;
}
  .collection_material .collection_materials .material_inner .images-container .attr-img-cont img{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    object-fit: cover;
}
  .collection_material .collection_materials .material_inner .images-container .attr-img-cont .tooltip{
    color: #424242;
    font-family: "Basis Grotesque Pro";
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 20px
}
 .collection_material .collection_materials #materials_finishes{
    margin: 0;
    position: relative;
    /*min-height: 660px;*/
    background: transparent;
    padding: 0;
}
 .collection_material .collection_materials .slider_inner  .flex {
    justify-content: flex-start;
    margin-top: 25px;
    align-items: center;
    display: flex;
    margin-bottom: 24px;
    gap: 0!important;
    padding: 0!important;
}
 .collection_material .collection_materials .slider_inner .type_name {
    color: #424242;
    font-family: "Basis Grotesque Pro";
    font-size: 32px;
    font-weight: bold;
    letter-spacing: 0;
    margin-right: 40px;
    line-height: 32px;
}
  .collection_material .collection_materials .slider_inner  .material_code,
 .collection_material .collection_materials .slider_inner .material_name {
    color: #424242;
    font-family: "Basis Grotesque Pro";
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 20px;
}
 .collection_material .collection_materials .slider_inner .close {
    border-radius: 50%;
    /* border: 1px solid #828282; */
    position: absolute;
    right: 10%;
    top: 25px;
    width: 40px;
    height: 40px;
    /* transform: rotate(45deg); */
    cursor: pointer;
    background: url('/wp-content/themes/hello-theme-child-master/assets/img/Close-form-popup.svg') center / contain no-repeat;
    border: none;
}
 .collection_material .collection_materials .slider_inner .pagingInfo {
    font: normal bold normal 15px / 15px "Basis Grotesque Pro";
    color: #424242;
    top: calc(50% - 53px);
    position: absolute;
    right: calc(10% + 48px);
    transform: translateY(-50%);
    opacity: 1;
    transition: all 0.3s;
}
 .collection_material .collection_materials  .slider-count {
    font-family: "Basis Grotesque";
    font-size: 12px;
    letter-spacing: 0.03px;
    line-height: 15px;
    color: #FFFFFF;
    white-space: nowrap;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.3s;
    z-index: 9999;
}

 .collection_material .collection_materials  .attributes_image_container.active .slider-count {
    opacity: 1;
    transition: opacity 0.3s;
}

   .collection_material  .cus_accardion_content .view-all{
     /*display: none;*/
     display: block;
     border-radius: 28px;
     max-width: 310px;
     margin: 160px auto 100px;
     border: 1px solid rgba(66, 66, 66, 1);
     box-shadow: 0px 0px 8px 1px rgba(0, 0, 0, 0.1);
     padding: 17px 24px;
     background-color: rgba(255, 255, 255, 1);
     font-family: "Basis Grotesque Pro";
     line-height: 18px;
     color: rgba(66, 66, 66, 1);
     font-size: 16px;
     font-weight: 400;
     letter-spacing: 0.04px;
     text-align: center;
       text-decoration: none;
 }
  .collection_material  .cus_accardion_content .view-all:hover {
     color: #fff;
     background-color: #424242;

 }

 @media (max-width: 1100px) {

     .collection_material .collection_materials .flex{

         padding: 0 2em;
     }
 }

 @media (max-width: 991px) {

       .collection_material .collection_materials .flex   {
         flex-direction: column;
         padding: 0;
         gap: 25px;
     }
      .collection_material .collection_materials .flex .material_inner:first-child{
         padding-top:  0;
     }
     .collection_material .collection_materials .right_image:after {
         position: relative;
         content: "";
         display: block;
         /*padding-top: 110%;*/
     }
     .single.single-product .collection_material .cus_accardion_content .view-all,
     .archive.tax-product_brand .cus_accardion_content .view-all{
         margin: 40px auto;
     }
      .collection_material .collection_materials .left_section,
       .collection_material .collection_materials .right_image {
         width: 100%;
     }
       .collection_material .collection_materials .left_section{
         padding: 0 20px;
     }
       .collection_material .collection_materials .right_image{
         order: -1;
     }
      .collection_material .collection_materials .slider_inner .type_name  {
         font-size: 18px;
         margin-right: 40px;
         line-height: 18px;
     }

       .collection_material .collection_materials #materials_finishes {
         min-height: auto!important;
         height: auto;
     }
       .collection_material .collection_materials .material_inner .item{
         overflow: auto;
     }
     .collection_material .collection_materials .material_inner .images-container {
         flex-wrap: nowrap;
         gap: 4px;
         width: auto;
         max-width: none;
     }
    .collection_material .collection_materials .material_inner .images-container .attr-img-cont  {
         width: 160px;
         min-width: 160px;
     }
 }