@font-face {
  font-family: "Roboto";
  src: url("assets/fonts/roboto/Roboto-Medium.ttf") format("truetype");
  src: url("assets/fonts/roboto/Roboto-Regular.ttf") format("truetype");
}

* {
  font-family: "Roboto", 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}



html {
  height: 100%;
}
body {
  min-height: 100%;
  margin: 0;
  padding: 0;
  background-color: black;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}




span {
  color: rgb(216, 216, 216);
}

.clock-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  height: fit-content;
  width: fit-content;

  /* min-height: 100%;
  min-width: 100%; */
}

.time-container {
  text-align: center;
  font-size: 15rem;
}

.date-container {
  padding-top: 3rem;
  text-align: center;
  font-size: 7rem;
  
}

.offset-container {
  padding-top: 5rem;
  text-align: center;
  font-size: 3rem;
  
}

.date-container > span {
  color: rgb(195, 195, 195);
}