I presume the main content will sit here...

The actual markup:

<?xml version="1.0" encoding="utf-8"?>
<!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="en" lang="en">

<head>
	<title></title>
	<link rel="stylesheet" type="text/css" href="css/style.css" />

	<style>

		body		{background: #fff url(img/wallpaper.png) 0 0 repeat;
					}

		#content-wrap	{width: 60%;
				margin: 1em auto;
				padding: 1em 0;
				background-color: rgba(0,0,0,0.3);
				-moz-border-radius: 1em;
				-webkit-border-radius: 1em;
					}

		#content-wrap div
				{width: 90%;
				margin: 1em auto;
				background-color: #fff;
					}

		#content-wrap div p
				{margin: 1em 0;
					}

	</style>

</head>

<body>

	<div id="content-wrap">

		<div id="main-content">

			<p>I presume the main content will sit here...</p>

			<p>The actual markup:</p>

<pre>
	<style>

		body		{background: #fff url(img/wallpaper.png) 0 0 repeat;
					}

		#content-wrap	{width: 60%;
				margin: 1em auto;
				padding: 1em 0;
				background-color: rgba(0,0,0,0.3);
				-moz-border-radius: 1em;
				-webkit-border-radius: 1em;
					}

		#content-wrap div
				{width: 90%;
				margin: 1em auto;
				background-color: #fff;
					}

		#content-wrap div p
				{margin: 1em 0;
					}

	</style>
</pre>

		</div>

		<div id="footer">

			<p>This'd be the footer. And so on...</p>

		</div>

	</div>


</body>

</html>