body {
  height: 100vh;
  width: 100%;
  align-items: center;
  background-color: black;
}

.f-b {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-box-vertical {
  flex-direction: column;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

.stopWatch-heading {
  color: red;
}

.inner-box {
  height: 30em;
  width: 41vmax;
  align-items: center;
}

.digital-clock-box {
  height: 7vmax;
  width: 25vmax;
  font-size: 3vmax;
  font-family: "Times New Roman", Times, serif;
  background-color: black;
  color: red;
  border: 2px dashed red;
  background: transparent;
}

/*  Analog Clock */
.analog-clock-box {
  height: 25vmax;
  width: 25vmax;
  border-radius: 50%;
  background-image: url("https://ih0.redbubble.net/image.2314591194.4225/raf,360x360,075,t,fafafa:ca443f4786.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
}

#hour,
#minutes,
#seconds {
  position: absolute;
  background: yellow;
  border-radius: 1vw;
  transform-origin: bottom;
}

#hour {
  width: 1.5%;
  height: 20%;
  top: 29.3%;
  left: 48.9%;
  opacity: 0.7;
}

#minutes {
  width: 1%;
  height: 26%;
  top: 24%;
  left: 49%;
  opacity: 0.8;
}

#seconds {
  width: 0.7%;
  height: 33%;
  top: 17%;
  left: 49.1%;
  background-color: red;
  opacity: 0.8;
}

@media (max-width: 600px) {
  .inner-box {
    height: 18em;
  }
}
