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.
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;
You can try adding another class to the navbar element, and styling it in your css file instead of using .navbar-brand.
when you create your custom css use id instead of class becuse id has more priority then class so bootstrap use class and you use id then your custom css has more priority then bootstrap class
