View Source

Color

Color of criteria styling are the colors of global color scheme or overwriten by custom color scheme of space.

If you want to have more control over coloring criterias use following css snippet.

Adjust color of snippet for your case and copy modified css snippet to

Global Stylesheet under Administration → Look and Feel → Space Stylesheet
Space Stylesheet under Space Tools → Space Stylesheet

.content-rating.content-rating-toggle ul li .content-rating-icon {
    color: #205081 !important;
    border: 4px solid #999999 !important;
}

.content-rating.content-rating-toggle ul li:hover .content-rating-icon {
    color: #205081 !important;
    border: 4px solid #205081 !important;
}

.content-rating.content-rating-toggle ul li .content-rating-icon.content-rating-active {
    color: #fff !important;
    background-color: #205081 !important;
    border: 4px solid #205081 !important;
}

.content-rating.content-rating-toggle ul li:hover .content-rating-icon.content-rating-active {
    color: #fff !important;
    border: 4px solid #999999 !important;
    background-color: #205081 !important;
}

Align

.content-rating.content-rating-toggle {  
    text-align: left;  
}