@font-face {
  font-family: SF;
  src: url('./fonts/SF-Regular.ttf') format('truetype');
}
@font-face {
  font-family: SF;
  src: url('./fonts/SF-Regular.ttf') format('truetype');
  font-weight: normal;
}
@font-face {
  font-family: SF;
  src: url('./fonts/SF-Medium.ttf') format('truetype');
  font-weight: 500;
}
@font-face {
  font-family: SF;
  src: url('./fonts/SF-Bold.ttf') format('truetype');
  font-weight: bold;
}
@font-face {
  font-family: SF;
  src: url('./fonts/SF-Light.ttf') format('truetype');
  font-weight: lighter;
}
@font-face {
  font-family: 'Rubik';
  src: url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600&display=swap');
  font-weight: normal;
}
@font-face {
  font-family: 'Manrope';
  src: url('https://fonts.googleapis.com/css2?family=Manrope:wght@400&display=swap');
  font-weight: normal;
}

html, body {
  font-family: SF, Arial, Helvetica, sans-serif !important;
}

.rubik {
  font-family: 'Rubik', sans-serif !important;
  font-style: normal !important;
}

.manrope {
  font-family: 'Manrope', sans-serif !important;
  font-style: normal !important;
}