Color for @media does not appear in CSS

Hello again, i did many CSS changes until now, but now i need some professional help, because i stuck here. I am trying to change the background color on mobile popup, i did add it to CSS but when i clear cache/Browser it shows the original white color.

Menu: https://ibb.co/d28gsqj
Default white background: https://ibb.co/m8tFvtr
How it should be: https://ibb.co/NYddfL7

I puted this code in the CSS from Product Builder but it seems not working, background-color: #000;

@media (max-width: 768px)
.vi-wpb-wrapper .woocommerce-product-builder-sidebar, .vi-wpb-wrapper .woopb-entry-content .woopb-steps {
    padding: 3%;
    width: 100%;
    position: fixed;
    top: calc(50% - 18px);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    background-color: #000;
    z-index: 9999999;
    max-height: calc(100vh - 36px);
    overflow: auto;
    display: none;
    margin: 0;
}

Do you have any idea how it will work? Thank you for any help