body {
  background: radial-gradient(ellipse at center, #ffffff 0%,#d3d3d3 100%);
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  flex-direction: column;
}

#readouts {
  display: flex;
  justify-content: space-around;
  width: 100%;
  text-align: center;
}

@media screen and (max-width: 600px) {
  #readouts {
    flex-direction: column;
  }
  
  #readout-speed, #readout-watt {
    font-size: 6rem;
    line-height: 6rem;
  }

  button {
    padding: 0.5rem 1rem;
    font-size: 1rem;
  }
}

button:focus {
  outline: none;
}

#start {
  background-color: hsl(114, 96%, 92%);
}

#start.selected {
  background-color: hsl(0, 96%, 92%);
  color: #000;
}

body.dark {
  background: radial-gradient(ellipse at center, #1b1b1b 0%, #000000 100%);
  color: #01a003;
}

body.dark button {
  background-color: #2a2a2a;
  border: 1px solid #01a003;
  color: #01a003;
}

body.dark #start {
  background-color: hsl(114, 100%, 18%);
}

body.dark #start.selected {
  background-color: hsl(0, 100%, 18%);
  color: #fff;
  border-color: hsl(15, 100%, 18%);
}

.unit { 
   font-size: 6rem;  /* Pas dit naar wens aan */ 
 }