Only apply certain CSS styles when class doesn't also exist on element

Question

Say I have two CSS classes:

.class1 {
   color: red;
}

.class2 {
  /* Has Stuff */
}

I only want to apply whatever styles class1 has IF class2 is not also on the element. So for example:

<div class="class1">Some div</div>

Should be in red.

However, if I do:

<div class="class1 class2">Some div</div>

Should NOT be red, even if class2 doesn't have anything related defined in it.

How can I do this?

Answer 1

.class1:not(.class2) {
   color: red;
}

This should work for you