@media (min-width: 576px) {
  .clock {
    height: 400px;
    width: 400px;
  }
  body {
    font-size: 10px;
    font-weight: 700;
    font-size: 12px;
  }
  .hour_out {
    font-size: 20px;
  }
  .second_out {
    padding-top: 15px;
  }
  .minute_out {
    padding-top: 75px;
  }
  .minute_main {
    transform: rotate(82deg) translate(0px, -38px);
  }
  .hour_main {
    transform: rotate(87deg) translate(0px, -64px);
  }
  .hour_out {
    padding-top: 130px;
    font-size: 20px;
  }
  .view {
    border: 2px solid rgb(232, 232, 232);

    height: 28px;
    width: 85px;
  }

  #date {
    font-size: 30px;
  }

  h2 {
    font-size: 35px;
  }
  #day {
    font-size: 25px;
  }
}
@media (min-width: 768px) {
  .view {
    height: 28px;
    width: 85px;
  }
}