.grid-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-gap: 2rem;
  align-items: center;
  padding-bottom: 50px;
  padding-top: 30px;
}
.grid-gallery div {
    padding: 1rem;
    display: grid;
    place-items: center;
  
}
.grid-gallery div::before {
    
      content: "";
      display: block;
      padding-bottom: 50%;
      grid-area: 1 / 1 / 2 / 2;
    }
.grid-gallery div img {
      max-width: 100%;
      // height: 100%;
      // object-fit: contain;
      grid-area: 1 / 1 / 2 / 2;
      max-height: 100px;
    }

@media(min-width: 1px) and (max-width: 780px){
 .grid-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  grid-gap: 2rem;
  align-items: center;
  padding-bottom: 50px;
  padding-top: 30px;
}
}