body {
	margin:0;
	padding:0;
	height:100%;
}
a {
	text-decoration:none;
	color:blue;
	cursor:pointer;
}
.grid-container {
	display:grid;
	height:100vh;
	grid-template-areas:
	"header header header header header header"
	"menu main main main right right"
	"menu footer footer footer footer footer";
	grid-template-rows: 80px 1fr 60px;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	gap:10px;
	background-color: #dfdfdf;
	padding:10px;
}
.grid-container > div {
	text-align:center;
	border-radius:6px;
	border:1px solid black;
	background-color:white;
	padding:10px;
}
.item1 {grid-area:header; }
.item2 {grid-area:menu; }
.item3 {grid-area:main;}	
.item4 {grid-area:right;}
.item5 {grid-area:footer;}

/*MENY STYLE*/
.menu {
	background-color:#2c3e50;
	height:100%;
	padding:0;
	margin:0;
	border-radius:6px;
	
}

.menu ul{
	list-style:none;
	margin:0;
	padding:0;
}

.menu ul li a{
	display:block;
	color:white;
	padding:12px;
	text-decoration:none;
	text-align:left;
}


.menu ul li a:hover:
{
background-color:#34495e;

}

.menu ul li .dropdown-content {
	display:none;
	position:absolute;
	left:100%;
	top:0;
	background-color:#34495e;
	min-width:160px;
	border-radius:0 6px 6px 0;
	z-index:1;
}

.menu ul li. dropdown-content li a {
	color:#fff;
	padding:10px;
	border-bottom:1px solid #2c3e50;
}

.menu ul li.dropdown:hover .dropdown-content {
	display:block;
}