.timetable {
  border:5px solid black;
  border-collapse: collapse;
  border-radius: 10px;
}

.timetable th {
  background-color: #c2e0c6; 
  border: 1px solid black;
  text-align: center;
  padding: 3px;
  border-radius: 8px 8px 0 0;
}

.timetable th:first-child {
  border-left: none; 
}

.timetable th:last-child {
  border-right: none; 
}

.timetable td {
  border: 1px solid red;
  text-align: center;
  padding: 10px;
  width: 40px;
  height: 40px;
  border-radius:50%; 
  background-color: white;
  transition: background-color 0.3s ease;
   overflow: hidden;
}

.timetable td:hover {
  background-color: coral;
}

.date-row th {
  background-color: #c2e0c6;
  border: 2px solid black;
  border-radius: 8px;
  text-align: center;
  padding: 5px;
}

.timetable th:hover,
.timetable td:hover {
  cursor: pointer; 
}