:root {
    --e-global-color-primary: #111111;
    --e-global-color-secondary: #96D73B;
    --e-global-color-text: #474D57;
    --e-global-color-accent: #CAF291;
    --e-global-color-light: #FFFFFF;
    --e-global-color-stroke: #E4E7E9;
    --color-text: var(--e-global-color-text);
    --color-border: var(--e-global-color-stroke);
    --color-border-hard: #d9d9d9;
    --color-white: var(--e-global-color-light);
    --color-neutral-transparent: #9f9f9f4d;
    --color-overlay: #1a1a1a66;
    --e-global-typography-primary-font-family: -apple-system, "Outfit", "Segoe UI", "Helvetica Neue", sans-serif;
    --e-global-typography-primary-font-weight: 500;
    --e-global-typography-secondary-font-family: -apple-system, "Outfit", "Segoe UI", "Helvetica Neue", sans-serif;
    --e-global-typography-secondary-font-weight: 500;
    --e-global-typography-text-font-family: -apple-system, "Outfit", "Segoe UI", "Helvetica Neue", sans-serif;
    --e-global-typography-text-font-weight: 400;
    --e-global-typography-accent-font-family: -apple-system, "Outfit", "Segoe UI", "Helvetica Neue", sans-serif;
    --e-global-typography-accent-font-weight: 500;
    --line-height-default: 1.6;
    /* --line-height-paragraph: 1.75; */
    --letter-spacing-default: -2px;
    --letter-spacing-small: 0.04em;
    --font-size-default: 18px;
    /* --font-size-paragraphs: 16px; */
    --font-size-main-menu: 16px;
    --global-border-radius: 12px;
    --button-border-radius: 25px;
    --box-shadow: 0 40px 60px 0 rgb(0 0 0 / 5%);
    --global-transition: var(--animation-default);
    --image-transition: var(--animation-default);
    --container-max-width: 1240px;
    --listIndent: 2.5em;
    --listItemSpacing: 0.3em;
    --content-spacing: 1.5em;
    --small-content-spacing: 0.75rem;
    --headings-content-spacing: calc(0.3em + 10px);
    --column-spacing: 20px;
    --vertical-spacing: 100px;
    --titlebar-spacing: 100px;
    --mobile-spacing: 50px;
    --sidebar-width: 25%;
    --sidebar-widgets-spacing: 50px;
    --grid-columns-gap: 30px;
    --component-height: 55px;
    --button-padding: 25px;
    --header-height: 70px;
    --block-width: 850px;
    --logo-height: 32px;
    --crumble-post-title: 32px;
    --icon-font-size: 35px;
    --icon-large-font-size: 45px;
    --admin-bar: 0px;
    --transparent-navigation-position: sticky;
    --animation-default-fast: 0.4s cubic-bezier(0.625, 0.05, 0, 1);
    --animation-default: 0.2s cubic-bezier(0.625, 0.05, 0, 1);
    --animation-default-medium: 0.7s cubic-bezier(0.625, 0.05, 0, 1);
    --animation-default-slow: 1.2s cubic-bezier(0.625, 0.05, 0, 1);
}

@media (max-width:766.98px) {
     :root {
        --small-content-spacing: 0.5rem;
        --sidebar-widgets-spacing: 30px;
        --component-height: 50px
    }
}

@media (min-width:767px) and (max-width:1023.98px) {
     :root {
        --block-width: 100%
    }
}