Using :not(x) in with "a" in my custom.css

[Meddysong]

In my theme I'd like to change my a links to a new colour. To accomplish this I have

.ipsApp_front a{
    color: #388563;
    text-decoration: none;
}

in my custom.css.

Of course, this has the effect of applying it everywhere, including elements which I would want to keep in their normal state, such as this:

"No problem", I think to myself. "I'll use the :not(x) property in my custom.css so that it won't apply to these elements." Other parts of my custom.css use the :not(x) property, so I figured it should work. But whatever variation of

.ipsApp_front a:not(.ipsMenu_item > a, .ipsMenu_item > span){
    color: #388563;
    text-decoration: none;
}

it's not working. In fact, what's happening is the entire declaration stops working and I end up back with my default link colour.

So what am I doing wrong?

[Colonel_mortis]

You can't use compound selectors in the not selector (I think they are coming in CSS level 4 though), and it can only be used to test properties of a, not of its parents. You might have to override the menu styling by adding a new (higher precedence) rule to override it back to black for the menu.

[Meddysong]

1 minute ago, Colonel_mortis said:

You can't use compound selectors in the not selector (I think they are coming in CSS level 4 though), and it can only be used to test properties of a, not of its parents. You might have to override the menu styling by adding a new (higher precedence) rule to override it back to black for the menu.

That's a fairly straightforward solution and I'll have plenty of these overrides to do. Thanks for the insight!