#timetable {
  overflow-x: scroll;
  overflow-y: visible;
  height: 50vh;
  margin: 5vh 4vw 2vh 4vw;
}

#timetable_container {
  display: flex;
  height: 45vh;
}

.days,
.cols {
  width: 25vw;
  border: solid 0.1vh;
  text-align: center;
  display: block;
}

.dark .days,
.dark .cols {
  border-color: #f4f4f4;
}


.days div,
.cols input {
  height: 5vh;
  display: block;
  width: 24.5vw;
  margin: 1vw auto;
  text-align: center;
  border-style: none;
  border-bottom-style: solid;
  border-color: #000;
}

.dark .days div,
.dark .cols input {
  border-color: #f4f4f4;
}

.days div {
  font-weight: 700;
  border-width: 0.6vh;
}

.timeContainer {
  height: 5vh;
  border-width: 0.6vh;
}

.timeContainer input {
  margin: 0.5vh auto;
  height: 2vh;
}

.TableControl {
  display: grid;
  grid-template-columns: 25vw 25vw 25vw;
  height: 12vh;
  width: 80vw;
  padding: 4vw;
  margin: 0px 15vw 0px 2vw;
  gap: 6vw;
}

.TableControl>span{
  height: 6vh;
  width: 25vw;
  background: var(--sec);
  border-radius: 3vw;
  color: var(--lite);
  padding: 3vw;
  margin: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  font-size: 3vh;
  overflow: hidden;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.2);
  display: grid;
  grid-template-columns: 5fr 2fr;
  gap:2.4vw;
}
.TableControl img{
  height: 6.5vw;
  width: 6.5vw;
}

.deleteT {
  width: 4.9vh;
  height: 5.2vh;
  border-radius: 3vh;
  background: red;
  margin-left: 2vh;
}