<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl" lang="nl">
        <head>
                <title>Layout1</title>
                
                <link rel="stylesheet" type="text/css" href="opmaak.css" />
        </head>
        
        <body>
		
		         <div id="header">
				     <h1>Layout1!</h1>
				     <h2>Gewoon even kijken of het werkt!</h2>
				 </div>
				 
				 <ul id="menu">
				    <li class="activate"><a href="#">Home</a></li>
					<li><a href="#">Over</a></li>
					<li><a href="#">Blog</a></li>
					<li><a href="#">Crew</a></li>
					<li><a href="#">Contact</a></li>
				</ul>
				    
        
		</body>
        
</html>

html
       {
	  background-color: #999999;
	}
body
        {
		width: 698px;
		border-left: 1px solid #888888;
		border-right: 1px solid #888888;
		margin: 0px auto;
	}
div#header
        {
		background-image: url('images/header.gif');
		background-repeat: repeat-x;
		width: 698px;
		height: 82px;
	}
h1
        {
		font-family: Verdana;
		font-size: 26px;
		color: #ffffff;
		font-weight: normal;
		margin: 0;
		padding: 22px 0px 0px 19px;
		float: left;
	}
h2
        {
		font-family: "Times New Roman";
		font-size: 11px;
		color: #ffffff;
		font-weight: normal;
		margin: 0;
		padding: 26px 0px 0px 12px;
		float: left;
	}
ul#menu
        {
		margin: 0px;
		padding-left: 10px;
		list-style: none;
		height: 25px;
		width: 688px;
		background-color: #080808;
		background/image: url('images/menuback.gif');
	}
ul#menu li
       {
	   float: left;
	   height: 25px;
	}
ul#menu li a
        {
		display: block;
		overflow: hidden;
		height: 25px;
		padding: 5p 8px 0px 8px;
		font-family: Verdana;
		color: #ffffff;
		font-size: 11px;
		text-decoration: none;
		font-weight: bold;
	}
ul#menu li a:hover, ul#menu li.active a, ul#menu a:hover
        {
		 padding: 5px 8px 0px 8px;
		 background-color: #ffffff;
		 color: #000000;
		 height: 20px;
	}