:root {
    /*================================================

    for positioning elments hor/vert:
    zero value is center, positive value moves element right/up, negative value left/down

    ================================================*/ 

    /* header */

    --header-bg: #292525;
    --header-vertical-padding-mobile:10px;
    --header-vertical-padding-desktop:10px;

    /* logo */

    --logo-size-mobile:100px;
    --logo-size-desktop:110px;
    --logo-position-mobile:15px;
    --logo-position-desktop:15px;
        
    /* floating images left/right */

    --left-image-display: none; /* none=invisible, block=visible */
    --left-image-size-desktop: 445px;
    --left-image-size-mobile: 50%;
    --left-image-vertical-position-desktop: 0px;
    --left-image-horizontal-position-desktop: 70%;
    --left-image-vertical-position-mobile: 0px;
    --left-image-horizontal-position-mobile: 0px;
    --left-image-above-wheel : 100; /* 100 yes, 0 no */
    
    --right-image-display: block; /* none=invisible, block=visible */
    --right-image-size-desktop: 445px;
    --right-image-size-mobile: 90%;
    --right-image-vertical-position-desktop: 10px;
    --right-image-horizontal-position-desktop: 55%;
    --right-image-vertical-position-mobile: 0px;
    --right-image-horizontal-position-mobile: -50px;
    --right-image-above-wheel : 100; /* 100 yes, 0 no */

    /* stopper in %*/
    --stopper-size: 20%;
    --stopper-pos: -5%;

    /* wheel 'spin' button */
    --spin-glow-color: #c5b1fa;

    /* wheel */
    --wheel-size: 500px;
    --wheel-pos-vert-dsk: 25vh;
    --wheel-pos-vert-mob: 22vh;
    --wheel-bottom-space-dsk: 5vh;
    --wheel-bottom-space-mob: 26vh;
    --wheel-pos-hor: 0px;
    --wheel-border-size: 0;
    --wheel-border-color: #000;
    --wheel-text-position: 10%;

    /* popups */
    /* to have solid color background set popup-background-image to none */
    --popup-background-image: none;
    --popup-background-color: #f9d92c;
    --popup-button-background: #efd752;
    --popup-default-text-color: #09f1aa;
    --popup-inner-bg-color:#e0318f;

    --top-image-decoration-size-mobile:30%;
    --top-image-decoration-size-desktop:30%;
    --top-image-decoration-horizontal-position-mobile:-22%;
    --top-image-decoration-horizontal-position-desktop:-20%;

    --tos-link-color: #ccc;

    /* footer */
    --footer-border: #464040;

    /* footer bg */
    --footer-bg: #7f315e;
}