@font-face {
    font-family: 'jersey10';
    src: URL('fonts/jersey-10-latin-400-normal.ttf') format('truetype');
    src: URL('fonts/jersey-10-latin-400-normal.woff') format('woff');
    src: URL('fonts/jersey-10-latin-400-normal.woff2') format('woff2');
}

@font-face {
    font-family: 'Hack';
    src: URL('fonts/Hack.ttf') format('truetype');
}

@font-face {
    font-style: italic;
    font-family: 'Hack';
    src: URL('fonts/Hack-Italic.ttf') format('truetype');
}

@font-face {
    font-weight: bold;
    font-family: 'Hack';
    src: URL('fonts/Hack-Bold.ttf') format('truetype');
}

@font-face {
    font-weight: bold;
    font-style: italic;
    font-family: 'Hack';
    src: URL('fonts/Hack-BoldItalic.ttf') format('truetype');
}


:root {
    --color-dark: #001300;
    --color-neutral: #ebedf0;
    --color-primary: #75b44b;
    --color-additional-01: #15ada3;
    --color-additional-02: #9fa4e8;
    --color-additional-03: #c892d6;
    --color-additional-04: #ee5da2;
    --color-additional-05: #ea6f82;
    --color-additional-06: #f88a30;
    --color-additional-07: #ffbc40;

}

html {
    font-family: 'Hack';
}

h1{
    color: var(--color-dark);
    font-family: 'jersey10';
    font-size: 5rem;
}

.notice{
    border: var(--color-additional-04) dashed 3px;
    padding: 5px;
    margin: 5px;
}