@charset "utf-8";
/* CSS Document */
.image-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* Default: 4 images per row */
  gap: 10px; /* Space between images */
  margin: 0 auto;				  
}
.caption  { margin: -10px 0 0 0; padding: 0 10px; background-color: #333; color: white !important; text-align: center; font-weight: 100 !important;}

.image-grid img, image-grid div.image-item {
  width: 100%;
  height: auto; /* Maintain aspect ratio */
	
}

@media (max-width: 1200px) {
  .image-grid {
    grid-template-columns: repeat(3, 1fr); /* 3 images per row */	  
  }
}

@media (max-width: 768px) {
  .image-grid {
    grid-template-columns: repeat(2, 1fr); /* 2 images per row */
  }
}

@media (max-width: 480px) {
  .image-grid {
    grid-template-columns: 1fr; /* 1 image per row */
	max-width: 250px;	  
  }
}