/* @font-face {
    font-family: 'font1';
    src: url('../fonts/univers.otf') format('opentype');
} */

@font-face {
    font-family: 'eurostile-2';
    src: url('../fonts/eurostile-2/eurostile.TTF') format('truetype');
}

@font-face {
    font-family: 'eurostile-2-normal';
    src: url('../fonts/eurostile-2/EuroStyle-Normal.ttf') format('truetype');
}

@font-face {
    font-family: 'eurostile-2-bold';
    src: url('../fonts/eurostile-2/fonts.com-Eurostile_Bold.otf') format('opentype');
}


@font-face {
    font-family: 'roboto-regular';
    src: url('../fonts/roboto/Roboto-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'roboto-medium';
    src: url('../fonts/roboto/Roboto-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'roboto-bold';
    src: url('../fonts/roboto/Roboto-Bold.ttf') format('truetype');
}

:root {
    --color-primary: #0D59A3;
    --color-secondary: #E3001B;

    --color-dark: #333333;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-grey: #F2F2F2;

    /* --color-red: #E3001B;
    --color-blue: #0D59A3; */

    --font-primary: "eurostile-2", sans-serif;
    --font-primary-normal: "eurostile-2-normal", sans-serif;
    --font-primary-bold: "eurostile-2-bold", sans-serif;
    --font-secondary: "roboto-regular", sans-serif;
    --font-secondary-medium: "roboto-medium", sans-serif;
    --font-secondary-bold: "roboto-bold", sans-serif;
    --font-tertiary: "Montserrat", sans-serif;

    --font-light: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    --font-black: 900;

    --font-size-xxxs: clamp(8px, 1vw, 10px);
    --font-size-xxs: clamp(10px, 1vw, 12px);
    --font-size-xs: clamp(12px, 1vw, 14px);
    --font-size-s: clamp(14px, 1.1vw, 16px);
    --font-size-n: clamp(14px, 1.12vw, 18px);
    --font-size-m: clamp(18px, 2vw, 22px);
    --font-size-xm: clamp(24px, 2.25vw, 25px);
    --font-size-l: clamp(25px, 2.7vw, 30px);
    --font-size-ml: clamp(27px, 2.9vw, 34px);
    --font-size-xl: clamp(26px, 3.2vw, 42px);
    --font-size-xxl: clamp(30px, 3.7vw, 58px);

    --line-height-xxs: clamp(12px, 1vw, 14px);
    --line-height-xs: clamp(16px, 1.1vw, 19px);
    --line-height-s: clamp(18px, 1.5vw, 24px);
    --line-height-n: clamp(18px, 1.5vw, 25px);
    --line-height-m: clamp(22px, 1.95vw, 26px);
    --line-height-xm: clamp(28px, 2.5vw, 30px);
    --line-height-l: clamp(32px, 2.9vw, 40px);
    --line-height-xl: clamp(30px, 3.3vw, 46px);
    --line-height-xxl: clamp(36px, 4vw, 70px);

    --space-xxsmall: clamp(2px, 1vw, 4px);
    --space-xsmall: clamp(4px, 1.5vw, 10px);
    --space-small: clamp(10px, 3vw, 40px);
    --space-normal: clamp(12px, 6vw, 100px);
    --space-medium: clamp(14px, 10vw, 210px);
    --space-large: clamp(120px, 15vw, 250px);
    --space-xlarge: clamp(140px, 18vw, 280px);

    --header-height : clamp(90px, 10vw, 110px);
    --header-smallheight : clamp(50px, 6vw, 64px);
}