:root {
  /* CSS vars go here */
  --blue: #2d347c;
  --green: #315e3a;
  --orange: #e87254;
  --yellow: #e4a70e;
  --purple: #87588d;
  --light-red: #fb7777;
  --light-blue: #0c8bac;
  --beige: #d2c4a8;
  --red: #ac160c;
  --darkRed: #92140c;
  --brown: #996361;
}

html,
body {
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 8px;
}

@media (min-width: 320px) and (max-width: 520px) {
  html {
    font-size: 7px;
  }
}

body {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
}

label {
  display: block;
}
.clock {
  transform: translate(0, 50%);
}

@font-face {
  font-family: 'NB International Pro Mono';
  src: url('https://static.axios.com/fonts/axios-site/nb_international_pro_mono.eot');
  src: url('https://static.axios.com/fonts/axios-site/nb_international_pro_mono.eot?#iefix')
      format('embedded-opentype'),
    url('https://static.axios.com/fonts/axios-site/nb_international_pro_mono.woff')
      format('woff'),
    url('https://static.axios.com/fonts/axios-site/nb_international_pro_mono.ttf')
      format('truetype');
  font-weight: normal;
  font-style: normal;
}