.energy {
  color: white;
  box-sizing: border-box;
  font-family: "Roobert", sans-serif;
  height: 100%;
  overflow-y: scroll;
}

.choiceHoverEffect {
  transition: transform 0.3s ease;
  transform-origin: center;
}

.choiceHoverEffect:hover {
  transform: scale(1.04); /* Adjust scale value as needed */
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
}

.choiceSelected {
  transform: scale(1.15) !important;
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.7);
  border: 3px solid rgba(255, 255, 255, 0.7);
}

.overlay {
  position: fixed; /* Use fixed to cover the entire screen */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black */
  display: flex;
  justify-content: center; /* Center the child horizontally */
  align-items: center; /* Center the child vertically */
  z-index: 1000; /* Ensure it's above other content */
}

.startMessage {
  padding: 20px;
  background-color: white;
  border-radius: 5px;
  cursor: pointer; /* Change cursor on hover */
  font-size: 24px; /* Larger text size */
  color: black; /* Text color */
}

.blurred {
  filter: blur(5px); /* Apply a blur effect */
}