Why doesnt calc() work with CSS (with spaces)?

Not entirely sure what is going on, if I manually enter “width:calc(100% – 40px);” into the style of a HTML element through the google dev console, it works. I want to incorporate this into CSS but it wont seem to work despite having spaces around “-” or “+”, calc() just doesn’t seem to work when entering into CSS, the line is just ignored. The elements dont have any styling applied through HTML, only CSS, I created all the elements manually.

CSS:

@media screen and (max-width: 443px) and (min-width: 380px){
.main_details {
width:calc(100% – 40px);
}
}