.clock {
  position: relative;
  width: 200px;
  height: 200px;
  border: 2px solid #000;
  border-radius: 50%;
  background-color: #f0f0f0; /* Background color for the clock */
}

.hour-hand, .minute-hand, .second-hand {
  position: absolute;
  background-color: black; /* Default color for clock hands */
}

.hour-hand {
  width: 4px;
  height: 50px;
  top: 50px;
  left: 98px;
  transform-origin: 50% 100%;
  background-color: #FF5733; /* Hour hand color */
}

.minute-hand {
  width: 2px;
  height: 70px;
  top: 30px;
  left: 99px;
  transform-origin: 50% 100%;
  background-color: #4466FF; /* Minute hand color */
}

.second-hand {
  width: 1px;
  height: 80px;
  top: 20px;
  left: 100px;
  transform-origin: 50% 100%;
  background-color: #FF3333; /* Second hand color */
}