CSS Lesson #31: Cookie Policy CSS for Dark Background

The majority of pages on the internet are with a light, mostly white background and black letters. A small percentage however does not. 

Below we have a CSS example when dealing with a background with color: #1A1423 (Black). Here an example with CSS applied.

You can of course use this with any background, but please change the colors!

				
					
#cmplz-document, #cmplz-document p, #cmplz-document span, #cmplz-document li {
    // General Font Color
    color: white;
}
#cmplz-document a {
    // General Link Color
    color: #85d5ff;
}

#cmplz-document a:visited {
    // Link visited
    color: #deb7ff;
}

#cmplz-cookies-overview .cmplz-dropdown, #cmplz-document .cmplz-dropdown, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown {
    background-color: unset;
}

#cmplz-cookies-overview .cmplz-dropdown summary, #cmplz-document .cmplz-dropdown summary, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary {
    // Background Color
    color: #1A1423;
}

#cmplz-cookies-overview .cmplz-dropdown summary p, #cmplz-document .cmplz-dropdown summary p, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary p {
    // Background Color
    color: #1A1423;
    font-weight: 500;
}

#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div,
#cmplz-document .cmplz-dropdown .cookies-per-purpose div, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cookies-per-purpose div,
#cmplz-cookies-overview .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose, #cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose
{
    background-color: unset!important;
}

cmplz-cookies-overview .cmplz-dropdown summary, #cmplz-document .cmplz-dropdown summary, .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary,
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header
{
    background-color: #909090;
     // Category Titles
    font-size: 18px;
    font-weight: 400;
    // Background Color
    color: #1A1423;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active {
    // Background Color
    color: #1A1423;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-description {
    padding: 10px;
    // Background Color
    background: #1A1423;
}

.cmplz-category-title {
    color: #1A1423!important;
    font-weight: 500;
}
				
			

Join 1M+ users and install The Privacy Suite for WordPress locally, automated or fully customized, and access our awesome support if you need any help!

Complianz has received its Google CMP Certification to conform to requirements for publishers using Google advertising products.