:root {
    --bg-site: #f9f9f9;
    --bg-primary: #214bef;
    --bg-primary-overlay: rgb(228 228 228);
    --bg-secondary: #000000;
    --bg-secondary-overlay: #70819b5e;
    --bg-surface: rgb(255 255 255);
    --text-site: rgba(0,0,0,1);
    --text-light: rgba(0, 0, 0, 0.6);
    --text-primary: rgb(255 255 255);
    --text-heading: rgba(0, 0, 0, 0.9);
    --text-secondary: rgb(255 255 255);
    --text-link: #0D47A1;
    --text-link-hover: #2196F3;
    --border-primary: rgb(203 203 203);
    --border-radius: 4px;
    --bg-footer: #0D47A1;
    --bg-header: #ffffff;
    --bg-header-fixed: #ffffff;
    /* --text-heading-family:
    "open sans", sans-serif; */
    /* --text-body-family:
    'Roboto', sans-serif !important; */
    --grid-gap: 32px;
    --card-padding: 18px 14px;
    --elevation-1: 1px 1px 1px -1px rgb(0 0 0 / 4%), 0 1px 1px 0 rgb(0 0 0 / 8%), 1px 1px 26px 0 rgb(0 0 0 / 10%), 0px 0px 0px 1px rgb(0 0 0 / 5%);
    --elevation-2: 2px 2px 8px -1px rgb(0 0 0 / 12%), 0px 1px 13px 0 rgb(0 0 0 / 12%), 1px 1px 30px 0 rgb(0 0 0 / 14%);
}
@media (max-width: 1024px) {
    :root {
        --grid-gap: 16px;
        --bg-site: #fff;
    }
}