:root {
    font-size: 16px;

    /**10px*/
    --font-size-2xs: 0.625rem;
    /**12px*/
    --font-size-xs: 0.75rem;
    /**14px*/
    --font-size-sm: 0.875rem;
    /** 16px*/
    --font-size-root: 1rem;
    /** 18px*/
    --font-size-lg: 1.125rem;
    /** 20px*/
    --font-size-xl: 1.25rem;
    /** 24px*/
    --font-size-2xl: 1.5rem;
    /** 32px*/
    --font-size-3xl: 2rem;

    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
}

:host {
    --threegis-font-family: 'ThreegisFont';

    font-family: var(--threegis-font-family) !important;
    --paper-font-common-base_-_font-family: var(--threegis-font-family) !important;
    --paper-font-caption_-_font-family: var(--threegis-font-family) !important;
}


@font-face {
    font-family: 'ThreegisFont';
    src: url('./../fonts/Inter-VariableFont_opsz,wght.woff2') format('woff2');
}

/* Typography */

/* MuiButton-base is used in a lot of other components, define it first and overwrite it when needed */
paper-button,
.MuiButton-base {
    font-size: var(--font-size-root);
    font-weight: var(--font-weight-medium);
}

paper-tab,
.MuiTab-root {
    font-size: var(--font-size-root);
    font-weight: var(--font-weight-medium);
}

.wj-flexgrid {
    font-size: var(--font-size-sm);
}