How do i fix the clock in the top right corner, at the moment it is floating so moves up and down for some reason and is rather inset. This gives an unpleasant aesthetic so id rather the clock was fixed in place. I have attached the current CSS below. Any help is greatly appreciated

#GPHOTO_CURRENT {
        background-size:cover;
}
.clock {
  padding: 10px;
        background-color: rgba(0, 0, 0, 0.2);
}
.weather {
  padding: 10px;
        background-color: rgba(0, 0, 0, 0.2);
}
.calendar {
  padding: 10px;
        background-color: rgba(0, 0, 0, 0.2);
}

.clock {
  top:1px;
  left: 1px;
  bottom: inherit;
  right: inherit;
}
#GPHOTO_INFO {
  top: 400px;
  left: 10px;
  bottom: inherit;
  right: inherit;
}