/* clock */

.clock {
  width: 200px;
  height: 200px;
  background-color: green;
  background-image: url("rolex02.gif");
  border-radius: 50%;
  border: 0px solid #000;
  background-size: cover;
  position: relative;
}

/* clock style ends */

/* round center */

.clock::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
}

/* round center style ends */

/* common style for every hand */

.hand {
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform: translateX(-50%) rotate(90deg);
  transform-origin: bottom;
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
}

/* common style ends */

/* hour hand */

.hour {
  width: 6px;
  height: 28%;
  background-color: #000;
}

/* hour hand style ends */
/* minute hand style */

.minute {
  width: 5px;
  height: 38%;
  background-color: #000;
}

/* minute hand style ends */
/* second hand style */

.second {
  width: 2px;
  height: 40%;
  background-color: #ff0000;
}

/* second hand style ends */