body{
	font-family: Ubuntu;
	max-width: 1400px;
	margin: 0 auto;
	text-align: center;
}
.grid-container {
	margin-top: 20px;
	display: grid;
	grid-template-columns: auto auto auto;
	background-color: #2196F3;
	padding: 10px;
}
.grid-item {
	background-color: rgba(255, 255, 255, 0.8);
	border: 1px solid rgba(0, 0, 0, 0.8);
	padding: 20px;
	font-size: 12px;
	text-align: center;
}
.item1 { grid-area: header; }
.item2 { grid-area: menu; }
.item3 { grid-area: main; }
.item4 { grid-area: right; }
.item5 { grid-area: footer; }
.container {
 display: grid;
 grid-template-areas:
 'header header header header header header'
 'menu main main main main right'
 '...... footer footer footer footer .......';
 grid-gap: 10px;
 padding: 10px;
 margin: 0px auto;
 width: 100%;
 box-sizing: border-box;
 }
 .container > div {
 border: 1px solid #000000;
 border-radius: 10px;
 text-align: center;
 padding: 20px 10px;
 font: 16px Arial;
 }