@font-face {
    font-family: 'Inter-ExtraBold';
    src: url('/static/fonts/Inter-ExtraBold.woff2') format('woff2');
}

@font-face {
    font-family: 'Inter-Medium';
    src: url('/static/fonts/Inter-Medium.woff2') format('woff2');
}

@font-face {
    font-family: 'Inter-Regular';
    src: url('/static/fonts/Inter-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'InknutAntiqua-ExtraBold';
    src: url('/static/fonts/InknutAntiqua-ExtraBold.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url('/static/fonts/Roboto-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto-Bold';
    src: url('/static/fonts/Roboto-Bold.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto-Light';
    src: url('/static/fonts/Roboto-Light.woff2') format('woff2');
}

@font-face {
    font-family: 'Sansation-Italic';
    src: url('/static/fonts/Sansation-Italic.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto-SemiBold';
    src: url('/static/fonts/Roboto-SemiBold.woff2') format('woff2');
}

@font-face {
    font-family: 'RobotoSerif-Regular';
    src: url('/static/fonts/RobotoSerif-Regular.woff2') format('woff2');
}


/* Fonts Styling */

.roboto-serif-16 {
    font-family: "RobotoSerif-Regular", sans-serif;
    font-optical-sizing: auto;
    font-size: 16px;
    line-height: 21.6px;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
    "wdth" 100;
}

.roboto-regular {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-size: 16px;
    line-height: 21.6px;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
    "wdth" 100;
}

.roboto-small-bold {
    font-family: "Roboto-SemiBold", sans-serif;
    font-optical-sizing: auto;
    font-size: 16px;
    line-height: 21.6px;
    font-weight: 600;
    font-style: normal;
    font-variation-settings:
    "wdth" 100;
}

.inter-medium {
    font-family: 'Inter-ExtraBold';
    font-size: 20px;
    line-height: 27px;
}

.inter-medium-2 {
    font-family: 'Inter-ExtraBold';
    font-size: 28px;
    line-height: 37.8px;
}

.inter-medium-large {
    font-family: 'Inter-Medium';
    font-size: 48px;
    line-height: 64.8px;
}

.roboto-light {
    font-family: 'Roboto-Light';
    size: 18px;
    line-height: 24.3px;
}

.roboto-regular {
    font-family: 'Roboto-Regular', sans-serif;
    font-optical-sizing: auto;
    font-size: 16px;
    line-height: 21.6px;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
    "wdth" 100;
}

.roboto-medium {
    font-family: 'Roboto-Regular';
    size: 16px;
    line-height: 21.6px;
}

.roboto-medium-bold {
    font-family: 'Roboto-Bold';
    size: 16px;
    line-height: 21.6px;
}

.roboto-settings {
    font-family: 'Roboto-Regular';
    size: 18px;
    line-height: 24.3px;
}

.inter-1 {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 21.6px;
}

.white-font {
    color: whitesmoke;
}

.grey-font {
    color: #999999;
}

.error-font {
    color: red;
}

.underline {
    text-decoration: underline;
}