.main-menu-container {
  width: 100%;
  height: auto;
  display: flex;
  aspect-ratio: 1;
  align-items: center;
}

.items {
  width: 100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  justify-content: center;
}

.menu-item {
  text-decoration: none;
  position: relative;
  max-width: 100px;
  background-color: #333;
  flex: 1 1 33.33%; /* Each cell takes up one-third of the row */
  aspect-ratio: 1;
  box-sizing: border-box;
  margin: 2px; /* Spacing between cells */
  display: flex;
  justify-content: center;
  padding: 1rem;
}

.menu-item span {
  position: absolute;
  top: 80%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}

@media (501px <= width <= 1000px) {
  .main-menu-container {
    aspect-ratio: unset;
    min-height: 25rem;
  }
}

@media (1001px <= width <= 4000px) {
  .main-menu-container {
    aspect-ratio: unset;
    height: 9rem;
  }
}