div.ccm-rating.accessible .rating-wrapper {
    display: inline-block;
    margin: 0;
    padding: 2px 0 0;
}

div.ccm-rating.accessible .rating-wrapper:focus-within {
    outline: 2px solid #000;
    outline-offset: 4px;
}

div.ccm-rating.accessible .rating-wrapper label {
    display: inline-block;
    margin: 0 6px 0 0;
    padding-bottom: 6px;
    font-size: 1.5rem; /* 24px */
    line-height: 1;
    color: #fae100;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    -webkit-text-stroke: 2px #000;
    @supports not (-webkit-text-stroke: 2px #000) {
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    }
}

div.ccm-rating.accessible .rating-wrapper label:last-of-type {
    margin-right: 0;
}

div.ccm-rating.accessible .rating-wrapper legend.visually-hidden {
    float: none;
}

div.ccm-rating.accessible .rating-wrapper label::before {
    content: '\f005';
    display: inline-block;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: inherit;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
    line-height: 1;
    color: inherit;
}

div.ccm-rating.accessible .rating-wrapper input:checked ~ label {
    color: #425563;
    -webkit-text-stroke: 0;
    @supports not (-webkit-text-stroke: 0) {
        text-shadow: none;
    }
}

div.ccm-rating.accessible .rating-wrapper input:checked + label {
    color: #fae100;
    border-bottom-color: #000;
    -webkit-text-stroke: 2px #000;
    @supports not (-webkit-text-stroke: 2px #000) {
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    }
}

div.ccm-rating.accessible .rating-wrapper input:focus + label {
    border-bottom-style: dotted;
}

div.ccm-rating.accessible .rating-wrapper:hover input + label {
    color: #000;
    -webkit-text-stroke: 0;
    @supports not (-webkit-text-stroke: 0) {
        text-shadow: none;
    }
}

div.ccm-rating.accessible .rating-wrapper input:hover ~ label,
div.ccm-rating.accessible .rating-wrapper input:focus ~ label,
div.ccm-rating.accessible .rating-wrapper input[value="0"] + label {
    color: #425563;
    -webkit-text-stroke: 0;
    @supports not (-webkit-text-stroke: 0) {
        text-shadow: none;
    }
}

div.ccm-rating.accessible .rating-wrapper input:hover + label,
div.ccm-rating.accessible .rating-wrapper input:focus + label {
    color: #000;
    -webkit-text-stroke: 0;
    @supports not (-webkit-text-stroke: 0) {
        text-shadow: none;
    }
}

div.ccm-rating.accessible .rating-wrapper input[value="0"]:checked + label {
    color: #d4281c;
    -webkit-text-stroke: 0;
    @supports not (-webkit-text-stroke: 0) {
        text-shadow: none;
    }
}

div.ccm-rating.accessible .rating-wrapper input:checked ~ label::before {
    font-weight: 400;
}

div.ccm-rating.accessible .rating-wrapper input:checked + label::before {
    font-weight: 900;
}

div.ccm-rating.accessible .rating-wrapper:hover input + label::before {
    font-weight: 900;
}

div.ccm-rating.accessible .rating-wrapper input:hover + label ~ label::before,
div.ccm-rating.accessible .rating-wrapper input:focus + label ~ label::before {
    font-weight: 400;
}

div.ccm-rating.accessible .rating-wrapper input[value="0"] + label::before {
    content: '\f00d';
    font-weight: 900;
    position: relative;
    top: 2px;
}