:root {
    --color-black: hsl(0 0% 7%);
    --color-white: hsl(0 0% 100%);

    --color-red: hsl(0 55% 50%);
    --color-blue: hsl(220 55% 50%);
    --color-green: hsl(140 55% 50%);
    --color-yellow: hsl(50 75% 50%);
    --color-orange: hsl(25 75% 50%);
    --color-purple: hsl(270 55% 50%);
    --color-gold: hsl(45 55% 60%);
    --color-grey: hsl(0 0% 50%);
}

.bg-red    { background: var(--color-red); color: var(--color-white); }
.bg-blue   { background: var(--color-blue); color: var(--color-white); }
.bg-green  { background: var(--color-green); color: var(--color-white); }
.bg-yellow { background: var(--color-yellow); color: var(--color-black); }
.bg-orange { background: var(--color-orange); color: var(--color-black); }
.bg-purple { background: var(--color-purple); color: var(--color-white); }
.bg-gold   { background: var(--color-gold); color: var(--color-black); }
.bg-grey   { background: var(--color-grey); color: var(--color-white); }
.bg-black  { background: var(--color-black); color: var(--color-white); }
