CSS3 validation... Weird.

[llorephie]

Okay, we have this CSS3 code:

@font-face {
    font-family: "FiraSans-Regular";
    font-stretch: normal;
    src: url('/main/fonts/FiraSans-Regular.woff2');
}
@font-face {
    font-family: "FiraSans-Light";
    font-stretch: semi-condensed;
    src: url('/main/fonts/FiraSans-Light.woff2');
}
@font-face {
    font-family: "FiraSans-Thin";
    font-stretch: condensed;
    src: url('/main/fonts/FiraSans-Thin.woff2');
}
@font-face {
    font-family: "FiraMono-Regular";
    font-stretch: normal;
    src: url('/main/fonts/FiraMono-Regular.woff2');
}
body {
    font-family: FiraSans-Regular, sans-serif;
}
.welcome-overlay {
    background-image: url("/main/img/overlay.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: darken;
    transform: matrix(1, 0, 0, 1, 0, 0);
    filter: blur(0px);
    padding-top: 24%;
    padding-bottom: 24%;
    text-align: center;
}

We have this validation result in Atom:

And what we see on w3c validator?

Yep, code is correct. WTF? :)