Divs смещается вниз без причины? ⇐ CSS

[Anonymous]

Я пытался скопировать расписание из моей школы, но мои элементы div смещаются вниз, и я не могу найти причину. Кажется, это не имеет ничего общего с текстом или отсутствием места, поскольку для него установлен встроенный поток.
Ссылка на перо: https://codepen.io/BestCactus /pen/rNgMWGK

Код: Выделить всё

:root {
--background-color: #242424;
--card-color: #666665;
}

body {
font-family: "Radio Canada Big", sans-serif;
background-color: var(--background-color);
}

#card {
background-color: var(--card-color);
width: 80%;
height: 600px;
margin-left: auto;
margin-right: auto;
border-radius: 20px;
box-shadow: 10px 10px 12px 7px rgba(0, 0, 0, 0.2);
}
#card * {
color: white;
}

#table {
height: 88%;
display: flex;
align-items: flex-start;
justify-content: left;
grid-column-gap: 50px;
flex-flow: row;
}

.divOfWeek {
height: 100%;
display: inline-flex;
align-items: flex-start;
justify-content: space-between;
flex-flow: column;
margin-left: 5%;
}

#mainHeading {
text-align: center;
padding-top: 10px;
}

#headingDiv {
height: 12%;
justify-content: center;
}

.subject {
width: 80px;
height: 80px;
border-radius: 15px;
background-color: var(--background-color);
text-align: center;
}

.articleTable {
background-color: aqua;
display: inline-flex;
flex-flow: row;
justify-content: space-between;
grid-column-gap: 20px;
grid-row-gap: 20px;
vertical-align: top; 

Подробнее здесь: [url]https://stackoverflow.com/questions/78530715/divs-shifting-down-for-no-reason[/url]