.grid{
    outline: 1px solid red;
    display: grid;
    gap: 1em;
    grid-template-columns: 1fr;
  
    /* grid-template-rows: auto;  */
    /* align-items: stretch; */
}
.card{
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: min-content;  /* max.content */
}
.item{
    padding: 0.5em; 
      outline: 1px solid blue;
background-color: lightblue;
display:grid;
place-items: center;
/* align-items: center ;
justify-items: center; */
}

img{
    display: block; 
    width: 100%;
    min-width: 100%;
   
}
@media (min-width: 768px){
    .grid{
         grid-template-columns: repeat(5,1fr);
    }
    .item{
        padding: 2em;
    }
}
  
