.contenedor
{
	display: grid;
    grid-template-areas:
    	"a c"
    	"b b"
    	"e e"
    	"e e"
    	"d1 f"
    	"d2 f"
    	"d3 f"
    	"g g";
    width: 100%;
}

@media only screen and (min-width: 600px)
{
	.contenedor
	{
        display: grid;
        grid-template-areas:
        "a a c c"
        "b b b b"
        "f d1 d2 d3"
        "f e e e"
        "f e e e"
        "f e e e"
        "f g g g";
		width: 100%;
    }
}

@media screen and (min-width: 768px)
{
	.contenedor
	{
		display: grid;
		grid-template-areas:
		"a b b b b c"
		"d1 e e e f f"
		"d2 e e e f f"
		"d3 e e e f f"
		"g g g g f f";
		width: 100%;
	}
}

.item1
{
	grid-area: a;
	background-color: yellow;
	border: 1px solid gray;
	margin: 0.5em;
}

.item2
{
	grid-area: b;
	background-color: lightpink;
	border: 1px solid gray;
	margin: 0.5em;
}

.item3
{
	grid-area: c;
	background-color: #eeeeee;
	border: 1px solid gray;
	margin: 0.5em;
}

.itemimg1
{
	grid-area: d1;
	background-color: white;
	border: 1px solid gray;
	margin: 0.5em;
}

.itemimg2
{
	grid-area: d2;
	background-color: white;
	border: 1px solid gray;
	margin: 0.5em;
}
.itemimg3
{
	grid-area: d3;
	background-color: white;
	border: 1px solid gray;
	margin: 0.5em;
}
.item5
{
	grid-area: e;
	background-color: white;
	border: 1px solid gray;
	margin: 0.5em;
}

.item6
{
	grid-area: f;
	background-color: lightblue;
	border: 1px solid black;
	margin: 0.5em;
}

.item7
{
	grid-area: g;
	background-color: lightgreen;
	border: 1px solid black;
	margin: 0.5em;
}