id="color-themes" speed="1" ease="power1.out" percent-from-top="50" min-width="0">[element-theme="1"] { --color--background: var(--light--background); --color--color-100: var(--light--color-100); --color--color-200: var(--light--color-200); --color--text: var(--light--text); --color--button-background: var(--light--button-background); --color--button-text: var(--light--button-text); --color--button-hover-bg: var(--light--button-hover-bg); --color--nav-text: var(--light--nav-text); --color--text-menu: var(--light--text-menu); } [element-theme="2"] { --color--background: var(--green--background); --color--color-100: var(--green--color-100); --color--color-200: var(--green--color-200); --color--text: var(--green--text); --color--button-background: var(--green--button-background); --color--button-text: var(--green--button-text); --color--button-hover-bg: var(--green--button-hover-bg); --color--nav-text: var(--green--nav-text); --color--text-menu: var(--green--text-menu); } [element-theme="3"] { --color--background: var(--dark--background); --color--color-100: var(--dark--color-100); --color--color-200: var(--dark--color-200); --color--text: var(--dark--text); --color--button-background: var(--dark--button-background); --color--button-text: var(--dark--button-text); --color--button-hover-bg: var(--dark--button-hover-bg); --color--nav-text: var(--dark--nav-text); --color--text-menu: var(--dark--text-menu); } [element-theme="4"] { --color--background: var(--blog--background); --color--color-100: var(--blog--color-100); --color--color-200: var(--blog--color-200); --color--text: var(--blog--text); --color--button-background: var(--blog--button-background); --color--button-text: var(--blog--button-text); --color--button-hover-bg: var(--blog--button-hover-bg); --color--nav-text: var(--blog--nav-text); --color--text-menu: var(--blog--text-menu); }