Bootstrap get priority over my CSS - with correct implementation order

Question

I've linked bootstrap's css file first.
I've linked my css file second.

Why does bootstrap gets priority over my css??
I've played with the file order, there is no "important" setting on the bs rules.
I haven't found any related issue... please help. thanks.

Answer 1

In this situation, bootstrap's code is more specific (has 2 classes, while yours has only one specified).

Take a look at this MDN page for more information

You can override bootstrap by being more specific or using '!important' in your css rule (be aware that usually !important is not to be preferred, higher specificity is more flexible and easy to further override or change)

color: #C77358 !important;