@font-face {
    font-family: poppins-400;
    src: url('../fonts/poppins/Poppins-Regular.ttf');
    font-display: swap;
}

@font-face {
    font-family: poppins-500;
    src: url('../fonts/poppins/Poppins-Medium.ttf');
    font-display: swap;
}

@font-face {
    font-family: poppins-600;
    src: url('../fonts/poppins/Poppins-SemiBold.ttf');
    font-display: swap;
}

@font-face {
    font-family: poppins-700;
    src: url('../fonts/poppins/Poppins-Bold.ttf');
    font-display: swap;
}

@font-face {
    font-family: poppins-800;
    src: url('../fonts/poppins/Poppins-ExtraBold.ttf');
    font-display: swap;
}

@font-face {
    font-family: firaSans-400;
    src: url('../fonts/firaSans/FiraSans-Regular.ttf');
    font-display: swap;
}

@font-face {
    font-family: firaSans-500;
    src: url('../fonts/firaSans/FiraSans-Medium.ttf');
    font-display: swap;
}

@font-face {
    font-family: firaSans-600;
    src: url('../fonts/firaSans/FiraSans-SemiBold.ttf');
    font-display: swap;
}

@font-face {
    font-family: firaSans-700;
    src: url('../fonts/firaSans/FiraSans-Bold.ttf');
    font-display: swap;
}

@font-face {
    font-family: firaSans-800;
    src: url('../fonts/firaSans/FiraSans-ExtraBold.ttf');
    font-display: swap;
}

:root{
    --font-size: 0px;
    --font-coeficient: 0.3vw;
}

.bold-400{
    font-family: poppins-400;
}

.bold-500{
    font-family: poppins-500;
}

.bold-600{
    font-family: poppins-600;
}

.bold-700{
    font-family: poppins-700;
}

.bold-800{
    font-family: poppins-800;
}

.firaSans-bold-400{
    font-family: firaSans-400 !important;
}

.firaSans-bold-500{
    font-family: firaSans-500 !important;
}

.firaSans-bold-600{
    font-family: firaSans-600 !important;
}

.firaSans-bold-700{
    font-family: firaSans-700 !important;
}

.firaSans-bold-800{
    font-family: firaSans-800 !important;
}

.font-size-12{
    font-size: calc( var(--font-size) + 6px + var(--font-coeficient) );
}

.font-size-14{
    font-size: calc( var(--font-size) + 8px + var(--font-coeficient) );
}

.font-size-16{
    font-size: calc( var(--font-size) + 10px + var(--font-coeficient) );
}

.font-size-18{
    font-size: calc( var(--font-size) + 12px + var(--font-coeficient) );
}

.font-size-24{
    font-size: calc( var(--font-size) + 18px + var(--font-coeficient) );
}

.font-size-25{
    font-size: calc( var(--font-size) + 19px + var(--font-coeficient) );
}

.font-size-28{
    font-size: calc( var(--font-size) + 22px + var(--font-coeficient) );
}

.font-size-32{
    font-size: calc( var(--font-size) + 26px + var(--font-coeficient) );
}

.font-size-36{
    font-size: calc( var(--font-size) + 30px + var(--font-coeficient) );
}

.font-size-37{
    font-size: calc( var(--font-size) + 31px + var(--font-coeficient) );
}

.font-size-40{
    font-size: calc( var(--font-size) + 34px + var(--font-coeficient) );
}

.font-size-64{
    font-size: calc( var(--font-size) + 58px + var(--font-coeficient) );
}

.font-size-72{
    font-size: calc( var(--font-size) + 66px + var(--font-coeficient) );
}

.line-height-72 {
    line-height: calc( var(--font-size) + 66px + var(--font-coeficient) );
}