.color-7977 {
    background: linear-gradient(to right, #000000 0% 50%, #ffffff 50% 100%);
    border: .1rem solid #000000;
}

.color-7977 > .ci-check {
    color: #FFFFFF;
}


.color-7061 {
    background: linear-gradient(to right, #7c878e 0% 50%, #ffffff 50% 100%);
    border: .1rem solid #7c878e;
}

.color-7061 > .ci-check {
    color: #FFFFFF;
}


.color-979 {
    background: linear-gradient(to right, #E3E3E3 0% 50%, #FFFFFF 50% 100%);
    border: .1rem solid #D7DEE2;
}

.color-979 > .ci-check {
    color: #9AAEBB;
}


.color-1306 {
    background: linear-gradient(to right, #FFAB00 0% 50%, #FFFFFF 50% 100%);
    border: .1rem solid #FFAB00;
}

.color-1306 > .ci-check {
    color: #FFFFFF;
}


.color-3207 {
    background: linear-gradient(to right, #FDDBED 0% 50%, #FFFFFF 50% 100%);
    border: .1rem solid #D7DEE2;
}

.color-3207 > .ci-check {
    color: #9AAEBB;
}


.color-219 {
    background: linear-gradient(to right, #FF0000 0% 50%, #FFFFFF 50% 100%);
    border: .1rem solid #FF0000;
}

.color-219 > .ci-check {
    color: #FFFFFF;
}


.color-3844 {
    background: linear-gradient(to right, #00559F 0% 50%, #FFFFFF 50% 100%);
    border: .1rem solid #00559F;
}

.color-3844 > .ci-check {
    color: #FFFFFF;
}


.color-8976 {
    background: linear-gradient(to right, #AD96DC 0% 50%, #F5F4F8 50% 100%);
    border: .1rem solid #AD96DC;
}

.color-8976 > .ci-check {
    color: #FFFFFF;
}


.color-8977 {
    background: linear-gradient(to right, #F6EB61 0% 50%, #F5F4F8 50% 100%);
    border: .1rem solid #F6EB61;
}

.color-8977 > .ci-check {
    color: #FFFFFF;
}


.color-8618 {
    background: linear-gradient(to right, #292d39 0% 50%, #ECECFC 50% 100%);
    border: .1rem solid #292d39;
}

.color-8618 > .ci-check {
    color: #FFFFFF;
}