body {
  font-family: sans-serif;
  font-size: 3vh;
  background-color: rebeccapurple;
  display: flex;
  flex-direction: column;
  min-height: 90vh;
  justify-content: center;
}

.main {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#options {
  display: flex;
  flex-direction: row;
}

.option {
  margin: 1vh;
  height: 20vh;
  width: 20vh;
  border-radius: 50%;
  border: 0;
}

#target {
  height: 20vh;
  font-size: 20vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#score {
  font-size: 20vh;
  color: white;
}

button {
  height: 10vh;
  width: 30vh;
  border-radius: 1vh;
  outline: none;
  border: none;
  font-size: 5vh;
}

.dummy {
  margin: 1vh;
  height: 20vh;
  width: 20vh;
  border-radius: 50%;
  border: 0;
}

button:focus {
  border: 1vh solid black;
}

#best {
  display: flex;
  flex-direction: row;
  text-align: left;
  color: white;
  font-size: 4vh;
  margin-top: 3vh;
}

#timeFrame {
  height: 4vh;
  width: 60vw;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: left;
  margin: 2vh;
  padding: 0 1vh;
}

.timer {
  height: 3vh;
  width: 0%;
  background-color: rebeccapurple;
}
