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

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

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-blackitalic.eot');
    src: url('metropolis-blackitalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-blackitalic.woff2') format('woff2'),
        url('metropolis-blackitalic.woff') format('woff'),
        url('metropolis-blackitalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis Semi';
    src: url('metropolis-semibolditalic.eot');
    src: url('metropolis-semibolditalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-semibolditalic.woff2') format('woff2'),
        url('metropolis-semibolditalic.woff') format('woff'),
        url('metropolis-semibolditalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Metropolis Extra';
    src: url('metropolis-extrabloditalic.eot');
    src: url('metropolis-extrabloditalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-extrabloditalic.woff2') format('woff2'),
        url('metropolis-extrabloditalic.woff') format('woff'),
        url('metropolis-extrabloditalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-thin.eot');
    src: url('metropolis-thin.eot?#iefix') format('embedded-opentype'),
        url('metropolis-thin.woff2') format('woff2'),
        url('metropolis-thin.woff') format('woff'),
        url('metropolis-thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis Extra';
    src: url('metropolis-extralight.eot');
    src: url('metropolis-extralight.eot?#iefix') format('embedded-opentype'),
        url('metropolis-extralight.woff2') format('woff2'),
        url('metropolis-extralight.woff') format('woff'),
        url('metropolis-extralight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis Semi';
    src: url('metropolis-semibold.eot');
    src: url('metropolis-semibold.eot?#iefix') format('embedded-opentype'),
        url('metropolis-semibold.woff2') format('woff2'),
        url('metropolis-semibold.woff') format('woff'),
        url('metropolis-semibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

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

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-thinitalic.eot');
    src: url('metropolis-thinitalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-thinitalic.woff2') format('woff2'),
        url('metropolis-thinitalic.woff') format('woff'),
        url('metropolis-thinitalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-mediumitalic.eot');
    src: url('metropolis-mediumitalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-mediumitalic.woff2') format('woff2'),
        url('metropolis-mediumitalic.woff') format('woff'),
        url('metropolis-mediumitalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-lightitalic.eot');
    src: url('metropolis-lightitalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-lightitalic.woff2') format('woff2'),
        url('metropolis-lightitalic.woff') format('woff'),
        url('metropolis-lightitalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-bolditalic.eot');
    src: url('metropolis-bolditalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-bolditalic.woff2') format('woff2'),
        url('metropolis-bolditalic.woff') format('woff'),
        url('metropolis-bolditalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Metropolis Extra';
    src: url('metropolis-extralightitalic.eot');
    src: url('metropolis-extralightitalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-extralightitalic.woff2') format('woff2'),
        url('metropolis-extralightitalic.woff') format('woff'),
        url('metropolis-extralightitalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Metropolis';
    src: url('metropolis-regularitalic.eot');
    src: url('metropolis-regularitalic.eot?#iefix') format('embedded-opentype'),
        url('metropolis-regularitalic.woff2') format('woff2'),
        url('metropolis-regularitalic.woff') format('woff'),
        url('metropolis-regularitalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}