set a css grid to auto to make it stack on mobile

HTML

<div class="grid">
  <div class="grid-item">grid item 1</div>
  <div class="grid-item">grid item 2</div>
  <div class="grid-item">grid item 3</div>
</div>

CSS

.grid {
                display: grid;
                grid-template-columns: 15% 65% 20%;
                grid-template-rows: 100%;  
                grid-gap: 10px;  
}
.grid-item {
  width:100%;
  min-height:200px;
  background:pink;
  padding:20px;
  border-radius:10px;
  color:#444;
}

@media(max-width:1024px) {
	.grid {
      	display:block;
      	grid-template-columns: auto;
      	grid-template-columns: auto;
  	}
  	.grid-item {
    	grid-column: auto;
   	 	grid-row: auto;
      	margin-bottom:10px;
	}
}