@font-face {
    font-family: "rubik_semibold";
    src: url("/fonts/Rubik-SemiBold.ttf");
}

@font-face {
    font-family: "rubik_medium";
    src: url("/fonts/Rubik-Medium.ttf");
}

@font-face {
    font-family: "rubik_regular";
    src: url("/fonts/Rubik-Regular.ttf");
}

.title-extra-large{
    font-family: 'rubik_semibold';
    font-size: 24px;
}

.title-large{
    font-family: 'rubik_semibold';
    font-size: 20px;
}

.title-medium{
    font-family: 'rubik_semibold';
    font-size: 16px;
}

.title-small{
    font-family: 'rubik_semibold';
    font-size: 12px;
}

.subtitle-extra-large{
    font-family: 'rubik_semibold';
    font-size: 20px;
}

.subtitle-large{
    font-family: 'rubik_semibold';
    font-size: 16px;
}

.subtitle-medium{
    font-family: 'rubik_semibold';
    font-size: 14px;
}

.subtitle-small{
    font-family: 'rubik_semibold';
    font-size: 12px;
}

.body-large{
    font-family: 'rubik_regular';
    font-size: 16px;
}

.body-medium{
    font-family: 'rubik_regular';
    font-size: 14px;
}

.body-small{
    font-family: 'rubik_regular';
    font-size: 12px;
}

.body-mini{
    font-family: 'rubik_regular';
    font-size: 10px;
}