.main-bg {
  background-color: #eee7d9;
}

.show-categories {
  display: flex;
  flex-wrap: wrap;
  margin: 1% 5% 0 5%;
  background-color: #eee7d9;
}

.cat {
  width: 30%;
  height: 250px;
  margin: 1%;
  display: flex;
  justify-content: center; /* Center the image horizontally */
  align-items: center; /* Center the image vertically */
  overflow: hidden;
}

.cat a {
  width: 100%;
  height: 100%;
}

.cat a img {
  width: 100%;
  height: 100%;
  object-fit: contain; /* Ensure the image covers the entire container */
  transition: transform 0.5s;
}

.cat a img:hover {
  transform: scale(2.3);
}

@media screen and (max-width: 900px) {
  .cat {
    width: 48%;
    margin: 1%;
    padding: 0;
    box-sizing: border-box;
  }
}


@media screen and (max-width: 500px) {
  .show-categories {
    flex-direction: column;
  }
  .cat {
    width: 100%;
  }
}