#ctable {
  position:relative;
  top:-20px;
}

.clock {
  width: 310px;
  height: 310px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: url(../clock.png);
  background-size: cover;
  border: 4px;
  box-shadow: 0em 20px 20px rgba(0, 0, 0, 0.3),
              inset 0em 20px 20px rgba(0, 0, 0, 0.3);
  border-radius: 50%;
  border: 5px solid black;
}

.clock:after {
  content: '';
  position: absolute;
  width: 15px;
  height: 15px;
  background: rgb(200, 200, 200);
  border-radius: 50%;
}

#axis {
  width: 31px;
  height: 31px;
  background: url(../axis.png);
  background-size: cover;
  position: relative;
  top:-128px;
}

.clock .hourHand {
  width: 180px;
  height: 180px;
} 

.clock .minuteHand {
  width: 220px;
  height: 220px;
}

.clock .secondHand {
  width: 270px;
  height: 270px; 
}

.hourHand, .minuteHand, .secondHand {
  display: flex;
  justify-content: center;
  /* align-items: center; */
  position: absolute;
}

.hourHand:after {
  content: '';
  position: absolute;
  width: 5.5px;
  height: 90px;
  background: #727272;
  border-radius: 2.75px;
}

.minuteHand:after {
  cursor: pointer;
  content: '';
  position: absolute;
  width: 3.5px;
  height: 110px;
  background: #727272;
  border-radius: 1.75px;
}

.secondHand:after {
  content: '';
  position: absolute;
  width: 1.5px;
  height: 135px;
  background: #ff7272;; 
  border-radius: 0.75px;
}