Custom CSS - Not Sticking...

Hi all. Over the next week or so I'll be working on customizing our brand new community, so brace yourselves for entirely too many questions. But hey, that's what communities are for!

I've spent the past few hours trying to figure out what I'm missing when it comes to overriding standard styles with custom styles, and I'm baffled. I've had a few lines of code stick in my CSS file and many that just won't.

My current struggle: Trying to override the header-fragments.

I'm trying to change this...

.header-fragments #header-28 .navigation-list[data-direction='horizontal'] a.subnav-open,
	.header-fragments #header-28 .navigation-list[data-direction='horizontal'] a:hover {
		border-radius: 0;
		background-color: #263238;
		color: #FFFFFF !important;
	}

... to this.

.header-fragments #header-28 .navigation-list[data-direction='horizontal'] a.subnav-open,
	.header-fragments #header-28 .navigation-list[data-direction='horizontal'] a:hover {
		border-radius: 0;
		background-color: #F26521;
		color: #FFFFFF !important;
}

It's exactly the same except I'm changing from a dark gray to a bright orange (company standard). It's in my custom CSS file since modifying the standards is ill advised, but the site just keeps going back to the defaults.

What am I doing wrong?

Thanks!

Parents Reply Children