.grid{
	display: grid;
	grid-auto-rows: auto;
	grid-auto-columns: auto;
}

.gtc-1{grid-template-columns: repeat(1, 1fr);}
.gtc-2{grid-template-columns: repeat(2, 1fr);}
.gtc-3{grid-template-columns: repeat(3, 1fr);}
.gtc-4{grid-template-columns: repeat(4, 1fr);}

.cx-1{grid-column: 1;}
.cx-2{grid-column: 2;}
.cx-3{grid-column: 3;}
.cx-4{grid-column: 4;}

.cy-1{grid-row: 1;}
.cy-2{grid-row: 2;}
.cy-3{grid-row: 3;}
.cy-4{grid-row: 4;}

.cw-1{grid-column-end: span 1;}
.cw-2{grid-column-end: span 2;}
.cw-3{grid-column-end: span 3;}
.cw-4{grid-column-end: span 4;}

.ch-1{grid-row-end: span 1;}
.ch-2{grid-row-end: span 2;}
.ch-3{grid-row-end: span 3;}
.ch-4{grid-row-end: span 4;}

.gap-1{grid-gap: 0.5rem}
.gap-2{grid-gap: 0.75rem}
.gap-3{grid-gap: 1.0rem}
.gap-4{grid-gap: 1.5rem}

.p-1{padding: 0.5rem}
.p-2{padding: 0.75rem}
.p-3{padding: 1.0rem}
.p-4{padding: 1.5rem}
.p-5{padding: 2.25rem}
.p-6{padding: 3.0rem}

.pt-1{padding-top: 0.5rem}
.pt-2{padding-top: 0.75rem}
.pt-3{padding-top: 1.0rem}
.pt-4{padding-top: 1.5rem}
.pt-5{padding-top: 2.25rem}
.pt-6{padding-top: 3.0rem}

.pb-1{padding-bottom: 0.5rem}
.pb-2{padding-bottom: 0.75rem}
.pb-3{padding-bottom: 1.0rem}
.pb-4{padding-bottom: 1.5rem}
.pb-5{padding-bottom: 2.25rem}
.pb-6{padding-bottom: 3.0rem}


@media only screen and (max-width: 600px) {
	.gtc-sm-1{grid-template-columns: repeat(1, 1fr);}
	.gtc-sm-2{grid-template-columns: repeat(2, 1fr);}
	.gtc-sm-3{grid-template-columns: repeat(3, 1fr);}
	.gtc-sm-4{grid-template-columns: repeat(4, 1fr);}

	.cx-sm-1{grid-column: 1;}
	.cx-sm-2{grid-column: 2;}
	.cx-sm-3{grid-column: 3;}
	.cx-sm-4{grid-column: 4;}

	.cy-sm-1{grid-row: 1;}
	.cy-sm-2{grid-row: 2;}
	.cy-sm-3{grid-row: 3;}
	.cy-sm-4{grid-row: 4;}

	.cw-sm-1{grid-column-end: span 1;}
	.cw-sm-2{grid-column-end: span 2;}
	.cw-sm-3{grid-column-end: span 3;}
	.cw-sm-4{grid-column-end: span 4;}

	.ch-sm-1{grid-row-end: span 1;}
	.ch-sm-2{grid-row-end: span 2;}
	.ch-sm-3{grid-row-end: span 3;}
	.ch-sm-4{grid-row-end: span 4;}
}
@media only screen and (min-width: 601px) and (max-width: 991px) {
	.gtc-md-1{grid-template-columns: repeat(1, 1fr);}
	.gtc-md-2{grid-template-columns: repeat(2, 1fr);}
	.gtc-md-3{grid-template-columns: repeat(3, 1fr);}
	.gtc-md-4{grid-template-columns: repeat(4, 1fr);}

	.cx-md-1{grid-column: 1;}
	.cx-md-2{grid-column: 2;}
	.cx-md-3{grid-column: 3;}
	.cx-md-4{grid-column: 4;}

	.cy-md-1{grid-row: 1;}
	.cy-md-2{grid-row: 2;}
	.cy-md-3{grid-row: 3;}
	.cy-md-4{grid-row: 4;}

	.cw-md-1{grid-column-end: span 1;}
	.cw-md-2{grid-column-end: span 2;}
	.cw-md-3{grid-column-end: span 3;}
	.cw-md-4{grid-column-end: span 4;}

	.ch-md-1{grid-row-end: span 1;}
	.ch-md-2{grid-row-end: span 2;}
	.ch-md-3{grid-row-end: span 3;}
	.ch-md-4{grid-row-end: span 4;}
}

.overflow-x-auto{overflow-x: auto;}
.overflow-y-auto{overflow-y: auto;}