@font-face 
{
    font-family: FreeSans;
    src: url(../fonts/FreeSans-small.woff2) format('woff2');
    font-display: optional;
}

@font-face 
{
    font-family: FreeSans;
    src: url(../fonts/FreeSansBoldOblique.woff2) format('woff2');
    font-weight: bold;
    font-style: oblique;
    font-display: optional;
}

@font-face 
{
    font-family: FreeSans;
    src: url(../fonts/FreeSansBold-small.woff2) format('woff2');
    font-weight: bold;
    font-display: swap;
}

@font-face 
{
    font-family: FreeSans;
    src: url(../fonts/FreeSansOblique.woff2) format('woff2');
    font-style: oblique;
    font-display: optional;
}

@font-face 
{
    font-family: FreeSerif;
    src: url(../fonts/FreeSerif-small.woff2) format('woff2');
    font-display: swap;
}

@font-face 
{
    font-family: FreeSerif;
    src: url(../fonts/FreeSerifItalic-small.woff2) format('woff2');
    font-style: italic;
    font-display: swap;
}

@font-face 
{
    font-family: FreeSerif;
    src: url(../fonts/FreeSerifBoldItalic-small.woff2) format('woff2');
    font-style: italic;
    font-weight: bold;
    font-display: swap;
}

@font-face 
{
    font-family: FreeSerif;
    src: url(../fonts/FreeSerifBold-small.woff2) format('woff2');
    font-weight: bold;
    font-display: swap;
}

@font-face 
{
    font-family: Mononoki;
    src: url(../fonts/mononoki-Regular.woff2) format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Crimson Pro';
    src: url('../fonts/CrimsonPro-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Crimson Pro';
    src: url('../fonts/CrimsonPro-BoldItalic.woff2') format('woff2');
    font-weight: 700;
    font-style: italic;
    font-display: optional;
}