@font-face {
    font-family: 'CeraPro-Black';
    src: url('CeraPro-Black.woff2') format('woff2'),
        url('CeraPro-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CeraPro-Bold';
    src: url('CeraPro-Bold.woff2') format('woff2'),
        url('CeraPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CeraPro-Light';
    src: url('CeraPro-Light.woff2') format('woff2'),
        url('CeraPro-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CeraPro-Medium';
    src: url('CeraPro-Medium.woff2') format('woff2'),
        url('CeraPro-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

.f-bold{ font-family: 'CeraPro-Bold'; }
.f-black{ font-family: 'CeraPro-Black'; }
.f-medium{ font-family: 'CeraPro-Medium'; }
.f-light{ font-family: 'CeraPro-Light'; }