This issue is happening with my site as well. When I enter into the CSS editor it gets applied but when I exit and actually view the site live, it doesn't. If you want to debug this issue you can check out the website at www.andreastolpe.com. Let me know if you need anything else.
Here's a snippet of the custom CSS, attempting to target elements via specific classes, data attributes, and !important overrides:
// global page styles
// navigation dropdown
.header-nav .header-nav-item--folder .header-nav-folder-content {
min-width: 100px;
line-height: 28px;
}
.tweak-transparent-header:not(.header--menu-open) .header-announcement-bar-wrapper.black .header-nav-item--active .header-nav-folder-item a {
background-color: rgba(0,0,0,0.6) !important;
}
.header-nav-folder-content {
background-color: rgba(0,0,0,0.6) !important;
color: #fff !important;
}
.tweak-transparent-header:not(.header--menu-open) .header-announcement-bar-wrapper.black div.header-nav-folder-content {
background-color: rgba(0,0,0,0.6) !important;
color: #fff !important;
}