/* Estilos básicos para a galeria */

body, html {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.gallery {
    padding: 20px;
    margin: 50px;
  }
  
  .gallery-grid {
    display: grid;
    grid-gap: 15px;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* Define colunas flexíveis */
  }
  
  .gallery-item {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3; /* Define uma proporção de 4:3, por exemplo */
  }
  
  .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Isso garante que a imagem se ajuste ao tamanho do container sem distorção */
    display: block;
  }