@font-face {
  font-family: "Roboto";   /*Can be any text*/
  src: local("Roboto-Regular"),
    url("./fonts/Roboto-Regular.ttf") format("truetype");
  font-weight: 100 200 300 400;
  font-style: normal;
}

@font-face {
  font-family: "Roboto";   /*Can be any text*/
  src: local("Roboto-Medium"),
    url("./fonts/Roboto-Medium.ttf") format("truetype");
  font-weight: 500 600;
  font-style: medium;
}

@font-face {
  font-family: "Roboto";   /*Can be any text*/
  src: local("Roboto-Bold"),
    url("./fonts/Roboto-Bold.ttf") format("truetype");
  font-weight: 700 800;
  font-style: bold;
}


@font-face {
  font-family: "Roboto";   /*Can be any text*/
  src: local("Roboto-Black"),
    url("./fonts/Roboto-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: black;
}

*, *::before, *::after {
  box-sizing: inherit;
}

html {
  font-size: inherit;
  font-family: 'Roboto';
}

a {
  text-decoration: underline!important;
}