@media (min-width: 769px) {
    .cat-design-center .wrapp-category {
        position: relative;
        overflow: hidden;
        border-radius: 5px;
    }

    .cat-design-center .wrapp-category:before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 2;
        background-color: #000;
        opacity: .1;
        transition: opacity 0.5s cubic-bezier(0, 0, 0.44, 1.18)
    }

    .cat-design-center:hover .wrapp-category:before {
        opacity: .4
    }

    .cat-design-center .hover-mask {
        position: absolute;
        top: 50%;
        right: 0;
        left: 0;
        z-index: 3;
        padding: 15px;
        transition: transform .3s ease
    }

    .cat-design-center .wd-entities-title {
        color: #fff
    }

    .cat-design-center .more-products {
        margin-top: 5px;
        line-height: 20px;
        opacity: 0;
        transition: transform .3s ease, opacity .3s ease;
        transform: translateY(15px) translateZ(0)
    }

    .cat-design-center .more-products a {
        color: rgba(255, 255, 255, 0.9)
    }

    .cat-design-center:not(.without-product-count) .hover-mask {
        transform: translateY(calc(-50% + 20px)) translateZ(0)
    }

    .cat-design-center:not(.without-product-count):hover .hover-mask {
        transform: translateY(-50%) translateZ(0)
    }

    .cat-design-center:not(.without-product-count):hover .more-products {
        opacity: 1;
        transform: none
    }

    .cat-design-center.without-product-count .hover-mask {
        transform: translateY(-50%) translateZ(0)
    }
}