.dsPart ul li {
    list-style-type: none;
    margin-bottom: 5px;
    margin-left: 0;
}
.colorSample {
    height: 35px;
/*    background: black;*/
    float: left;
    margin-left: 10px;
    border-radius: 100%;
}
.colorSample:nth-child(2){
    margin-left: 0;
/*    background: #1a1a1a;*/
}
.colorSample:nth-child(3){
/*    background: #4d4d4d;*/
}
.colorSample:nth-child(4){
/*    background: #999;*/
}

.productsContainer{
    padding-bottom: 60px;
}
.productsRow {
    max-width: calc(1366px - 260px);
    margin: 1.61054vw auto 0;
    display: table;
    width: 100%;
    padding: 0;
}
.productBox {
    margin-bottom: 30px;
    float: left;
    width: 23.509%;
    margin-left: 1.61054vw;
    overflow: hidden;
    min-width: 255px;
}
.productBox:first-child{
    margin-left: 0;
}
.productBox a{
    position: relative;
    display: block;
    height: 160px;
    width: 100%;
    cursor: pointer;
/*    min-width: 260px;*/
}
.productBox a > *{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
}
.productName {
    height: 15px;
    display: inline-block;
    text-align: center;
    opacity: 0;
    transition: opacity 0.4s;
}
.productBox a > img{
    transition: opacity 0.4s;
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}
.productBox a:hover img{
    opacity: 0.3;
}
.productBox a:hover .productName{
    opacity: 1;
    cursor: pointer;
}
@media screen and (min-width:1349px){
    .productBox{
        margin-left: 11px;
    }
}
@media screen and (max-width:1110px){
    .productBox{
        min-width: auto;
    }
}
@media screen and (max-width:1024px){
    .productsRow{
        width: calc(100% - 60px);
    }
}
@media screen and (max-width:670px){
    .productBox{
        width: calc(50% - 1vw);
            min-width: 120px;
    }
    .productBox:nth-child(2n-1){
        margin-left: 0;
    }
    
}
@media screen and (max-width:380px) {
    .productsRow {
        width: calc(100% - 20px);
    }
    .productBox{
        min-width:unset;
    }
}