mark {   background: none; }

/* Custom colorpalette add */
:root {
    --color-black: #000000;
    --color-charcoal: #abb8c3;
    --color-white: #ffffff;
    --color-pink: #f78da7;
    --color-red: #cf2e2e;
    --color-orange: #ff6900;
    --color-yellow: #fcb900;
    --color-light-green: #7bdcb5;
    --color-green: #00d084;
    --color-light-blue: #8ed1fc;
    --color-blue: #0693e3;
    --color-purple: #9b51e0;
}
/* text */
.has-black-color {
    color: var(--color-black);
}
.has-charcoal-color {
    color: var(--color-charcoal);
}
.has-white-color {
    color: var(--color-white);
}
.has-pink-color {
    color: var(--color-pink);
}
.has-red-color {
    color: var(--color-red);
}
.has-orange-color {
    color: var(--color-orange);
}
.has-yellow-color {
    color: var(--color-yellow);
}
.has-light-green-color {
    color: var(--color-light-green);
}
.has-green-color {
    color: var(--color-green);
}
.has-light-blue-color {
    color: var(--color-light-blue);
}
.has-blue-color {
    color: var(--color-blue);
}
.has-purple-color {
    color: var(--color-purple);
}
/* background */
.has-black-background-color {
    background: var(--color-black);
}
.has-charcoal-background-color {
    background: var(--color-charcoal);
}
.has-white-background-color {
    background: var(--color-white);
}
.has-pink-background-color {
    background: var(--color-pink);
}
.has-red-background-color {
    background: var(--color-red);
}
.has-orange-background-color {
    background: var(--color-orange);
}
.has-yellow-background-color {
    background: var(--color-yellow);
}
.has-light-green-background-color {
    background: var(--color-light-green);
}
.has-green-background-color {
    background: var(--color-green);
}
.has-light-blue-background-color {
    background: var(--color-light-blue);
}
.has-blue-background-color {
    background: var(--color-blue);
}
.has-purple-background-color {
    background: var(--color-purple);
}