.basic-grid {
     display: grid;
	 gap: 1rem;
	 
	 /* 1 too skinny, too much code */
	 grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	 
	 /* 2 cleaner code */ 
	 grid-template-columns: repaeat(12, 1fr);
	 
	 /* 3 better sizing, but overflows */
	 grid-template-columns: repeat(12, minmax(240px, 1frb ))) ;
	 
	 /* 4 final */
	 grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	 
	 
	 
}

.card{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: #ff99ff;