#gridContainer{width:100%;max-width:1460px;height:auto;margin:60px auto 10px auto;display:grid;grid-row-gap:25px;grid-template-rows:34px auto auto auto;grid-template-columns:[col-start] auto [col-2] 10% [col-3] 40% [col-4] 40% [col-end] auto;grid-template-areas:"SPACET SPACET SPACET SPACET SPACET" "SPACEL HEADER HEADER HEADER SPACER" "SPACEL DOTTED MAINCO MAINCO SPACER" "FOOTER FOOTER FOOTER FOOTER FOOTER"}

@media (min-width:576px) AND (max-width:768px){#gridContainer{width:100%;max-width:1460px;height:auto;margin:60px auto 10px auto;display:grid;grid-row-gap:25px;grid-template-rows:34px auto auto auto;grid-template-columns:[col-start] 1% [col-2] 6% [col-3] 46% [col-4] 46% [col-end] auto;grid-template-areas:"SPACET SPACET SPACET SPACET SPACET" "SPACEL HEADER HEADER HEADER SPACER" "SPACEL DOTTED MAINCO MAINCO SPACER" "FOOTER FOOTER FOOTER FOOTER FOOTER"}}

@media screen and (max-width:575px){#gridContainer{
	width:100%;height:auto;margin:0;display:grid;grid-row-gap:25px;
	grid-template-rows:40px auto auto auto;
	grid-template-columns:[col-start] auto [col-2] 100%;grid-template-areas:"SPACET SPACET" "HEADER HEADER" "MAINCO MAINCO" "FOOTER FOOTER"}
	
	.SPACEL,.SPACER{display:none}}.SPACET{grid-area:SPACET}.SPACEL{grid-area:SPACEL}.SPACER{grid-area:SPACER}.HEADER{grid-area:HEADER}.MAINCO{grid-area:MAINCO}.FOOTER{grid-area:FOOTER}.DOTTED{grid-area:DOTTED}

@media screen and (max-width:575px){.HEADER{grid-area:HEADER;padding:0 0 0 8px}.DOTTED{grid-area:DOTTED;padding:0 0 0 8px}.MAINCO{grid-area:MAINCO;padding:0 10px 0 10px}}