.matties .inner {
	max-width: 1110px !important;
}
.matties-container {
	display: grid;
	grid-template-columns: repeat(4,1fr);
	grid-template-rows: repeat(1,auto);
	grid-row-gap: 20px;
	grid-column-gap: 20px;
}
.matties h3 {
	padding-bottom: 35px;
}
.matties-container img {
	/*border:3px solid #EF4922;*/
	width: auto;
	height: auto;
	max-width: 200px;	
}
.mattie:before{
    content: ' ';
    display: block;
    width: 5px;
    padding-top: 100%
}
.mattie >*:first-child{
    grid-row: 1 / 1;
    grid-column: 1 / 1;
}
.mattie {
	padding-right: 5px;
	width: 100%;
	max-width: 250px;
	max-height: 250px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #131313;
	box-shadow: 0px 3px 6px #00000029;
}
.lg-outer {
	z-index: 9999999;
}


@media (min-width: 767px) and (max-width: 1170px) {
	.matties-container {
		grid-template-columns: repeat(3,1fr);
		grid-row-gap:20px; 
		grid-column-gap:20px;
	}
	.matties .inner {
    	max-width: 790px !important;
	}
}
@media (min-width: 501px) and (max-width: 767px) {
	.matties-container {
		grid-template-columns: repeat(2,1fr);
		grid-row-gap:20px; 
		grid-column-gap:20px;
	}	
	.matties .inner {
    	    max-width: 520px !important;
	}
}
@media (max-width: 500px){
	.matties-container {
		grid-template-columns: repeat(1,1fr);
		grid-row-gap:15px; 
		grid-column-gap:15px;
		max-width: 250px !important;
		margin:0 auto;
	}	
	.mattie {
		min-width: unset;
	}
	.matties h3 { 
		padding-bottom: 15px !important;
	}
	.inner.mw1200 {
		padding-left: 25px;
		padding-right: 25px;
	}
}
