:root {
    /***************************************
     * Colors (managed in atomic config, enable here to override)
     ****************************************/
    /*--vii-color-bg:#fff; !* content background *!*/
    /*--vii-color-text:#1c1c1c; !* body text *!*/
    /*--vii-color-heading:var(--vii-color-primary);*/
    --vii-color-gray-1:rgba(255, 255, 255, .6);
    --vii-color-light-gold:rgba(164, 136, 74, .6);
    --vii-color-light-gold-2:rgba(164, 136, 74, .2);
    --vii-color-linear-gold:linear-gradient(to right, #b99f5b 0%, #faebc0 50%, #9e8142 100%);
    --vii-color-light-yellow:#efe3c7;


    /***************************************
    * Miscellaneous
    ****************************************/
    /* these variables will be updated by updateCSSVariables() */
    --vii-scroll-bar-width:8px;
    --vii-address-bar-height:0px;
    --vii-100vw:calc(100vw - var(--vii-scroll-bar-width));
    --vii-100vh:calc(100vh - var(--vii-address-bar-height));

    /* admin bar */
    --admin-bar-height:0px;
    --height-tradding-view:0px;

    /* Transition */
    --vii-transition:all .3s ease;
    --vii-transition-slow:all .6s ease;


    /***************************************
     * border
     ****************************************/
    --border-light-gold:1px solid var(--vii-color-light-gold);


    /***************************************
     * box shadow
     ****************************************/
    --vii-box-shadow-1:0 11px 25px rgba(0, 0, 0, 0.1),
    0 45px 45px rgba(0, 0, 0, 0.09),
    0 101px 61px rgba(0, 0, 0, 0.05),
    0 180px 72px rgba(0, 0, 0, 0.01),
    0 282px 79px rgba(0, 0, 0, 0);
    --vii-box-shadow-2:0 18px 28px rgba(0, 0, 0, 0.12),
    0 55px 55px rgba(0, 0, 0, 0.10),
    0 120px 80px rgba(0, 0, 0, 0.06),
    0 200px 90px rgba(0, 0, 0, 0.02),
    0 320px 100px rgba(0, 0, 0, 0.01);
    --vii-box-shadow-3:0 4px 12px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.06);
    --vii-box-shadow-4:0px -4px 5px rgba(0, 0, 0, 0.06), 0px 3px 7px rgba(0, 0, 0, 0.18);

}

@media only screen and (min-width:1700px) {
    :root {
        --vii-container:80vw !important;
        --vii-container-medium:55vw;
        --vii-container-small:44vw;
        --vii-gap-side:calc((var(--vii-100vw) - 80vw) / 2);
        --vii-gap-vc-column:0.8vw;

        --vii-spacing-default:clamp(var(--vii-spacing-64), 4vw, 5vw);

        --vii-size-h1:2.5vw;
        --vii-size-h2:2.25vw;
        --vii-size-h3:2vw;
        --vii-size-h4:1.5vw;
        --vii-size-h5:1.35vw;
        --vii-size-h6:1.2vw;
        --vii-size-body:0.85vw;
        --vii-size-14:0.75vw;
        --vii-size-large:1.1vw;
        --vii-size-18:1.1vw;
    }
}

