/* CSS Document */
.grcontainer {
	display: grid;
	gap: 3px;
	grid-template-columns: 1fr;
	grid-template-rows: ;
	grid-template-areas:
		"areaA"
		"areaB"
		"areaR"
		"areaQ"
        "areaS"
		"areaT"
		"areaE"
		"areaF"
		"areaG"
		"areaH"
		"areaI"
		"areaK"
		"areaL"
		"areaM"
		"areaN"
		"areaO"
		"areaP";
    }
    .item1{
	height:auto;
	grid-area: areaA;
    }
    .item2{
	height:auto;
	grid-area: areaB;
    }
	.item3{
	height:auto;
	grid-area: areaC;
    }
	.item4{
	height:auto;
	grid-area: areaD;
    }
	.item5{
	height:auto;
	grid-area: areaE;
    }
	.item6{
	height:auto;
	grid-area: areaF;
    }
	.item7{
	height:auto;
	grid-area: areaG;
    }
	.item8{
	height:auto;
	grid-area: areaH;
    }
	.item9{
	height:auto;
	grid-area: areaI;
    }
	.item11{
	height:auto;
	grid-area: areaK;
    }
	.item12{
	height:auto;
	grid-area: areaL;
    }
	.item13{
	height:auto;
	grid-area: areaM;
    }
	.item14{
	height:auto;
	grid-area: areaN;
    }
	.item15{
	height:auto;
	grid-area: areaO;
    }
	.item16{
	height:auto;
	grid-area: areaP;
    }
	.item17{
	height:auto;
	grid-area: areaQ;
    }
	.item18{
	height:auto;
	grid-area: areaR;
    }
	.item19{
	height:auto;
	grid-area: areaS;
    }
	.item20{
	height:auto;
	grid-area: areaT;
    }
	
@media(min-width: 800px){
	.grsuppressor{
	width: 92%;
	margin-right: auto;
	margin-left: auto;
	}
.grcontainer{
		  
    grid-template-columns: 1fr 1fr;
	grid-template-rows: ;
	grid-template-areas:
		"areaA areaA"
		"areaA areaA"
		"areaB areaB"
		"areaB areaB"
		"areaR areaR"
		"areaR areaR"
		"areaQ areaQ"
		"areaQ areaQ"
        "areaS areaS"
		"areaT areaT"
		"areaH areaF"
        "areaH areaF"
        "areaG areaI"
        "areaG areaK"
        "areaM areaL"
		"areaP areaN"
        "areaP areaO"
        "areaE areaO";
  }
}

@media(min-width: 1100px){
.grsuppressor{
	
	width: 80%;
	max-width: 1600px;
	margin-right: auto;
	margin-left: auto;
	}
.grcontainer{
		  
    grid-template-columns: 32% 32% 32%;
	//grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-template-areas:
		"areaA areaA areaB"
		"areaA areaA areaB"
		"areaR areaR areaR"
		"areaR areaR areaR"
		"areaQ areaQ areaQ"
		"areaQ areaQ areaQ"
        "areaS areaT areaT"
		"areaS areaT areaT"
        "areaE areaE areaF"
        "areaE areaE areaF"
        "areaG areaH areaI"
        "areaG areaH areaK"
        "areaL areaM areaN"
		"areaO areaO areaP"
		"areaO areaO areaP";
  }
}