:root {
    /*  ============================================ Colors ============================================ */
    --color-bg-page: #0B0F0E;

    /* Header */
    --color-bg-header: #0F1413;
    --color-border-header: #1E2A27;

    /* Footer */
    --color-bg-footer: #0F1413;
    --color-border-footer: #1E2A27;
    --color-text-footer: #7A8F88;

    /* Navigation */
    --color-bg-nav: #0A0D0C;
    --color-bg-nav-mobile: #0A0D0C;
    --color-bg-nav-link: #0A0D0C;
    --color-icon-menu: #B7FF3C;
    --color-text-nav: #E8FEE7;
    --color-text-nav-hover: #B7FF3C;
    --color-text-nav-mobile: #E8FEE7;
    --color-text-nav-mobile-hover: #B7FF3C;

    /* Text */
    --color-text: #E8FEE7;

    /* Title */
    --color-title-h1-h2: linear-gradient(90deg, #00FF85, #B7FF3C);
    --color-text-shadow-title-bonus: #000000;

    /* Buttons and Banner*/
    --color-bg-btn-header: linear-gradient(90deg, #00FF85, #00C853);
    --color-bg-btn-primary: linear-gradient(90deg, #00FF85, #00C853);
    --color-border-btn-header: #00C853;
    --color-border-btn-primary: #00C853;
    --color-text-bonus: #E8FEE7;
    --color-text-bonus-subtitle: #A5D6A7;
    --color-text-btn-primary: #001A12;
    --color-text-btn-header: #001A12;
    --color-bg-banner: #0B0F0E;
    /* for classic large banners */ 
    --banner-position-desktop: top right; 
    --banner-position-mobile: top right; 
    /* can be also used for hero (template1) */ 
    --banner-height-desktop: auto; 
    --banner-height-mobile: auto;

    /* Other */
    --color-border-card: 1px solid #1E2A27;
    --color-bg-card: #121A18;
    --color-border-table: #1E2A27;
    --color-bg-table-row: rgba(255, 255, 255, 0.03);
    --color-bg-section: #0F1413;
    --color-border-section: #1E2A27;

    /* Optional */
    --height-header: 70px;
    --color-outline-focus: #00FF85;
    --color-tap-highlight: #00FF85;
    --color-scrollbar-thumb: rgba(0, 255, 133, 0.6);

    /* lang menu */
    --color-bg-lang-btn: transparent;
    --color-bg-lang-menu: #121A18;
    --color-bg-lang-option-hover: #1E2A27;

    /* Radius tokens  */
    --radius-btn: 999px;
    --radius-nav: 12px;
    --radius-game-card: 14px;
    --radius-banner-mobile: 14px;
    --radius-banner-desktop: 18px;
    --radius-bonus-banner: 18px;
    --radius-table-cell: 10px;
    --radius-section: 16px;
    --radius-author-image: 50%;
    --radius-lang-menu: 10px;
/* Typography tokens */
    --font-size-base: 1rem;
    --font-size-h1: 35px;
    --font-size-h2: 25px;
    --font-size-h3: 22px;
    --font-size-h4: 20px;
    --font-size-h1-mobile: 30px;
    --font-size-h2-mobile: 25px;
    --font-size-h3-mobile: 20px;
    --font-size-h4-mobile: 18px;
    --font-size-bonus: 35px;
    --font-size-bonus-mobile: 25px;
    --font-size-bonus-subtitle: 25px;
    --font-size-menu-item: 16px;
    --font-size-lang: 14px;
    --font-size-footer: 13px;
    --font-size-card-title: 14px;
    --font-size-card-btn: 14px;
    --font-size-btn-primary: 1.5rem;
    --font-size-table: 14px;
    --font-size-subtitle: 18px;


    /* Font weight tokens */
    --fw-body: 400;
    --fw-h1: 900;
    --fw-h2: 900;
    --fw-h3: 700;
    --fw-h4: 700;
    --fw-btn: 700;
    --fw-menu-item: 700;
    --fw-strong: 700;
    --fw-link-footer: 700;
    --fw-bonus: 900;
    --fw-bonus-subtitle: 700;
    --fw-table: 500;
    --fw-card-title: 500;


    /* Text transform tokens */
    --text-transform-uppercase: none;
    --text-transform-none: none;
    --text-transform-button-primary: none;
    --text-transform-button-header: none;
    --text-transform-bonus-subtitle: none;
    --text-transform-bonus: none;
    --text-transform-menu: none;
}



.text img:not([class]) {
    margin: 5px 20px 5px 0;
}