body.themeDefault {
    /* --theme-background-color: rgb(85, 171, 163); */
    /* --theme-background-color: radial-gradient(circle, rgba(163,255,166,1) 0%, rgba(148,187,233,1) 100%); */
    --theme-background-color: linear-gradient(320deg, rgb(91, 213, 219) 0%, rgb(166, 240, 250) 100%);
    --theme-font-color: rgb(255, 255, 255);
    --theme-font-hover-color: rgba(255, 255, 255, 0.8);
    --theme-title-background: rgb(49, 49, 49);

    --theme-bottom-bar: rgb(216, 215, 145);
    --theme-color-area: rgb(255, 255, 255);
    --theme-board-row-color: rgba(255, 255, 255, 1);
    --theme-ball-hole-color: rgba(0, 0, 0, 0.4);
    --theme-board-color: bisque;

    --theme-ball-right: green;
    --theme-ball-wrong: red;
    --theme-ball-else: rgb(255, 208, 0);

    --theme-alert-color: rgba(255, 255, 255, 0.95);

    /* --theme-button: rgb(85, 171, 163); */
    /* --theme-button: linear-gradient(40deg, rgb(91, 213, 219) 0%, rgb(155, 242, 253) 100%); */
    --theme-button: rgb(91, 213, 219);
    --theme-button-hover: rgb(113, 217, 223);

    --theme-title-ring-1: rgb(14, 87, 224);
    --theme-title-ring-2: rgb(62, 171, 207);
    --theme-title-ring-3: cyan;
    --theme-title-ring-4: teal;
}

body.alt {
    --theme-background-color: rgb(85, 171, 163);
    --theme-font-color: #000000;
    --theme-font-hover-color: rgb(16, 44, 41);
    --theme-title-background: rgb(49, 49, 49);

    --theme-bottom-bar: bisque;
    --theme-board-row-color: rgba(255, 255, 255, 0.6);
    --theme-ball-hole-color: rgba(0, 0, 0, 0.4);
    --theme-board-color: bisque;
}

body.exp {
    --theme-background-color: rgb(85, 171, 163);
    --theme-font-color: #000;
    --theme-font-hover-color: rgb(234, 129, 68);
    --theme-title-background: rgb(234, 129, 68);
}