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;}
/*MENU 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;
}

.memu ul li.dropdown:hover .dropdown_content {
	display: block ;
	
}