html {
  /* Explicitly set background color */
  background-color: transparent;

  /* Disable scrollbars by clipping page overflow */
  overflow: hidden;

  /* Set default box-sizing to border-box for easier sizing of elements */
  box-sizing: border-box;

  /* Set default font family */
  font-family: Yle, Verdana, Arial, sans-serif;

  /* Set responsive root font size to 43.2px at 1080p */
  font-size: 4vh;

  -webkit-font-smoothing: antialiased;
}

*, *:before, *:after {
  /* Make box-sizing property easy to change by components if required */
  box-sizing: inherit;
}

@font-face {
  font-family: 'Yle-Black';
  src: url("../fonts/Yle-Black.ttf");
}

@font-face {
  font-family: 'Yle-Medium';
  src: url("../fonts/YleCondensed-Medium-Saami-uusi.otf");
}

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

@font-face {
  font-family: 'Yle-Bold';
  src: url("../fonts/Yle-Bold-Saami-uusi.otf");
}