@font-face {
    font-family: 'light';
    src: url('light.eot');
    src: url('light.eot?#iefix') format('embedded-opentype'),
         url('light.ttf') format('truetype'),
         url('light.svg#light') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'regular';
    src: url('regular.eot');
    src: url('regular.eot?#iefix') format('embedded-opentype'),
         url('regular.ttf') format('truetype'),
         url('regular.svg#regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'medium';
    src: url('medium.eot');
    src: url('medium.eot?#iefix') format('embedded-opentype'),
         url('medium.ttf') format('truetype'),
         url('medium.svg#medium') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'bold';
    src: url('bold.eot');
    src: url('bold.eot?#iefix') format('embedded-opentype'),
         url('bold.ttf') format('truetype'),
         url('bold.svg#bold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'black';
    src: url('black.eot');
    src: url('black.eot?#iefix') format('embedded-opentype'),
         url('black.ttf') format('truetype'),
         url('black.svg#black') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}