/* Flex container */
.flex-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px; /* Adjust the gap between items as needed */
}

/* Flex items - default to full width to stack on smaller screens */
.flex-container > div {
  flex: 0 0 100%;
  box-sizing: border-box; /* To include padding and border in the element's total width and height */
}

/* Responsive columns */
@media (min-width: 768px) { /* Adjust the breakpoint as needed */
  .flex-container > div {
    flex: 0 0 15%;
    max-width: 20%;
  }
}