/* Ensure the .icon-box behaves as a flex container */
.icon-box {
  display: flex;
  justify-content: center; /* Center content horizontally */
  align-items: center; /* Center content vertically */
  flex-direction: column; /* Stack image and text vertically */
  text-align: center; /* Ensure text under image is centered */
  padding: 10px;
}

.icon-box .icon {
  display: flex;
  justify-content: center; /* Horizontally center the image */
  align-items: center; /* Vertically center the image */
  margin-bottom: 10px; /* Add space between the image and the text */
}

.img-fluid {
  max-width: 100%; /* Ensures image scales responsively */
  height: auto; /* Maintain aspect ratio */
  object-fit: contain; /* Prevents the image from stretching */
}

/* Optionally, if you want all images to have the same size for uniformity */
.icon-box .icon img {
  max-width: 100px; /* increase or decrease this value to desired size */
  height: auto;
}