Untitled

<html>
<head>
<style>
div.fejlec{
    width: 100%;
    height: 70px;
    background-color:#999999;
    position: absolute;
    top:0px;
    left:0px;
    z-index:-1;
}
div.menu{
width:100%;
height:40px;
background-color:#888888;
position:absolute;
top:70px;
left:0px;
list-style-type: none;
overflow:hidden;
z-index:3;
}
li{float:left;}
li a{
display: block;
color: white;
text-align: center;
padding-top: 14px;
padding-left: 16px;
text-decoration: none;
}
li a:hover {
    background-color: #111;
    height:40px;
}
div.oldal{
 width: 200px;
    height: 100%;
    background-color:#777777;
    position: absolute;
    top:70px;
    left:0px;
    z-index:0;
}
div.oldal2{
width:200px;
height:100%;
background-color:#777777;
position:absolute;
top:70px;
right:0px;
z-index:0;
}
div.kozep{
width:100%;
height:100%;
position:absolute;
z-index:-1;
top:70px;
background-color:#666666;
}
div.kozep h1{
position:absolute;
font-size:50px;
text-align:center;
left:50%;
}
</style>
</head>
<body>
<div class=fejlec>
</div>
<div class=menu>
<li><a href= "#Nav1">Nav1</a></li>
<li><a href= "#Nav2">Nav2</a></li>
<li><a href= "#Nav3">Nav3</a></li>
<li><a href= "#Nav4">Nav4</a></li>
</div>
<div class=oldal>
</div>
<div class=kozep>
<h1>Teszt</h1>
</div>
<div class=oldal2>
</div>
</body>
</html>