html, body{
    margin: 0;
    padding: 0;
    font-family: Brockmann;
}
@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-Regular.otf') format('opentype');
    font-weight: 400; /* Normal */
    font-style: normal;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-RegularItalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-Medium.otf') format('opentype');
    font-weight: 500; /* Medium */
    font-style: normal;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-SemiBold.otf') format('opentype');
    font-weight: 600; /* Semi-Bold */
    font-style: normal;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-SemiBoldItalic.otf') format('opentype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-Bold.otf') format('opentype');
    font-weight: 700; /* Bold */
    font-style: normal;
}

@font-face {
    font-family: 'Brockmann';
    src: url('../fonts/Brockmann-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}