Navigation menu (black background)

<!DOCTYPE html>
<html>
<head>
<style>
body,ul,li{padding:0;margin:0;}
ul{height:120px;background-color:black;list-style-type:none;}
a{color:white;height:30px;display:block;margin-top:;font-size:23px;}
li{float:left;text-align:center;height:30px;}
li:nth-child(1),li:nth-child(2){width:50%;}
li:nth-child(3),li:nth-child(6){width:100%}
li:nth-child(4),li:nth-child(5){width:50%;}
#head,ul,#main,#foot{width:230px;margin:0 auto;}
#head{height:35px;font-size:22px;text-align:center;color:blue;}
#main{height:150px;font-size:20px;}
#foot{height:50px;font-size:18px;background:aqua;color:black;}
</style>
</head>
<body>
<div id="head">Header Is Here</div>
<ul>
<li><a href="home">Home</a></li>
<li><a href="blog">Blog</a></li>
<li><a href="works">My Works</a></li>
<li><a href="about">About</a></li>
<li><a href="contact">Contact</a></li>
<li><a href="nav">Navigate</a></a></li>
</ul>
<div id="main">Main Content Is Here</div>
<div id="foot">Footer Is Here</div>
</body>
</html>