:root {

    --ddexists-base-gap: 25px;
    --ddexists-base-padding: 25px;
    --ddexists-base-transition: all 0.5s;

    --ddexists-content-padding: 25px 25px 25px 25px;

    --ddexists-max-width: 1300px;
    --ddexists-content-max-width: 940px;
    --ddexists-content-max-width-with-padding: 990px; /* max-width + 2 * base-padding */


    --ddexists-size__site-main: 100%;
    --ddexists-size__site-sidebar: 25%;

    --ddexists-color__background-body: #fff;
    --ddexists-color__background-content: #fff;

    --ddexists-color__background-screen: #f1f1f1;
    --ddexists-color__background-hr: #ccc;
    --ddexists-color__background-button: #e6e6e6;
    --ddexists-color__background-pre: #eee;
    --ddexists-color__background-ins: #fff9c0;

    --ddexists-color__text-screen: #21759b;

    --ddexists-color-font: black;
    --ddexists-font-weight: 500;

    --ddexists-color__text-input: var(--ddexists-color-font);
    --ddexists-color__text-input-focus: var(--ddexists-color-font);

    --ddexists-color__link: var(--ddexists-color-accent-blue);
    --ddexists-color__link-visited: var(--ddexists-color-accent-blue);
    --ddexists-color__link-hover: var(--ddexists-color-accent-red);

    --ddexists-color__text-main: var(--ddexists-color-font);

    --ddexists-color__border-button: #ccc #ccc #bbb;
    --ddexists-color__border-button-hover: #ccc #bbb #aaa;
    --ddexists-color__border-button-focus: #aaa #bbb #bbb;
    --ddexists-color__border-input: #ccc;
    --ddexists-color__border-abbr: #666;


    --ddexists-button-border-radius: 8px;

    /**  Fonts and Font Sizes */
    --ddexists-font-family: "Barlow", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
    --ddexists-font-family-headlines: "Arvo", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;

    --ddexists-font__code: "Lucida Console", monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
    --ddexists-font__pre: "Lucida Console", "Courier 10 Pitch", courier, monospace;

    /** Must be changed in sass/base/_typography.scss too */
    --ddexists-font__size-body: 22px;
    --ddexists-font__line-height-body: 1.75;
    --ddexists-font__line-height-pre: 1.5;

    /** Body **/
    --ddexists-body-background-image: url("assets/images/band/band-2020-11-17.webp");
    /** --ddexists-body-background-image-mobile: url("assets/images/band/band-2020-11-17-600px.webp"); **/
    --ddexists-body-background-image-mobile: url("assets/images/band/band-2020-11-17.webp");
    --ddexists-body-background-position-y: 200px;
    --ddexists-body-background-size: 1200px;

    /** Header **/
    --ddexists-header-color__background: var(--ddexists-color-base-light-25);
    --ddexists-main-menu-font-size: 0.725rem;
    --ddexists-main-menu-line-height: 34px;
    --ddexists-main-menu-border-width: 2px;

    /** Footer **/
    --ddexists-footer-color__background: var(--ddexists-color-accent-blue);
    --ddexists-footer-color__font: white;
    --ddexists-footer-copyright-color__background: var(--ddexists-color-accent-blue);
    --ddexists-footer-copyright-color__font: white;

    /** WooCommerce */
    --ddexists-woocommerce__color-success: var(--ddexists-color-accent-green);
    --ddexists-woocommerce__color-error: var(--ddexists-color-accent-red);
    --ddexists-woocommerce__color-info: var(--ddexists-color-accent-blue);

    /** Boxes  */
    --ddexists-box-shadow: 7px 7px 10px #00000042;

    /** Breakpoints **/
    --ddexists-breakpoint-mobile: 37.5em;

    /** Basecss Variables  */

    --line-height-1: 1;
    --line-height-2: 1.125;
    --line-height-3: 1.25;
    --line-height-4: 1.5;
    --caps-letter-spacing: .2em;
    --bold-font-weight: bold;
    --space-1: 25px;
    --space-2: 50px;
    --space-3: 75px;
    --space-4: 100px;

    /** Animate CSS **/
    /** see https://animate.style/ **/
}

@media (max-width: 37.5em) {
    :root {
        --ddexists-body-background-size: cover;
        --ddexists-extra-small-font-size: var(--ddexists-small-font-size) !important;
        --ddexists-extra-small-line-height: var(--ddexists-small-line-height) !important;
        --ddexists-super-large-font-size: var(--ddexists-large-font-size);
    !important;
        --ddexists-super-large-line-height: var(--ddexists-large-line-height) !important;
    }
}