css_practice_1.result.html

<!DOCTYPE html>
<html>
	<head>
		<title>Boxes</title>
		<style type="text/css">
			body {
				font-size: 80%;
				font-family: "Courier New", Courier, monospace;
				letter-spacing: 0.15em;	
				background-color: #efefef;
			}
			#page {
				max-width: 940px;
				min-width: 720px;
				margin: 10px auto 10px auto;
				padding: 20px;
				border: 4px double #000;
				background-color: #ffffff;
			}
			#logo {
				width: 150px;
				margin: 10px auto 25px auto;
			}
			ul {
				width: 570px;
				padding: 15px;
				margin: 0px auto 0px auto;
				border-top: 2px solid #000;
				border-bottom: 1px solid #000;
				text-align: center;
			}
			li {
				display: inline;
				margin: 0px 3px;
			}
			p {
				text-align: center;
				width: 600px; 
				margin: 20px auto 20px auto; 
				font-weight: normal;
			}
			a {
				color: #000000;
				text-transform: uppercase;
				text-decoration: none;
				padding: 6px 18px 5px 18px;
			}
			a:hover, a.on {
				color: #cc3333;
				background-color: #ffffff;
			}
		</style>
	</head>
	<body>
		<div id="page">
			<div id="logo">
				<img src="images/logo.gif" alt="The Analog Specialists" />
			</div>
			<ul id="navigation">
				<li><a href="#" class="on">Home</a></li>
				<li><a href="#">For Sale</a></li>
				<li><a href="#">Repairs</a></li>
				<li><a href="#">About</a></li>
				<li><a href="#">Contact</a></li>
			</ul>
			<p>
				<img src="images/keys.jpg" alt="Fender Rhodes, Hohner Clavinet, and Wurlitzer EP200" />
			</p>
			<p>
				We specialize in the sale and repair of classic keyboards, in particular the Fender Rhodes, Wurlitzer EP200, and Hohner Clavinet.
			</p>
		</div>
	</body>
</html>