@charset "utf-8";
/* CSS Document */

	body {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.5;
	color: #fff;
	width: 970px;
	padding: 20px;
	background-image: url(../sfo5.jpg);
	float: left;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left: 0px;
	}
	h1,h2 { 
		color: #77AFC7 !important;
		margin-bottom: 0;
		line-height: 1.2em;
	}
	p {
		margin-top: 0;
	}
	a {
		color: #aaa;
	}
	a:hover {
		color: #FFF !important;
		text-decoration: none;
	}
	code { 
		background-color: #100;
		padding: 0.2em 0.5em;
		display: inline-block;
	}
	#wrapper { 
		overflow: hidden;
	}
	.overlay {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #000;
	opacity: 0.65;
	-moz-opacity: 0.65;
	filter:alpha(opacity=35);
	}
	.container {
		position: relative;
		float: left;
	}
	.content {
		position: relative; /* Fixes the z-index */
		float: left;
	}
	.navigation {
		position: relative; /* Fixes the z-index */
		float: left;
	}	
	#column-1 {
	width: 200px;
	}
	#column-2 {
	width: 750px;
	float: left;
	display: inline;
	margin-left: 20px;
	}
	#column-1 .content {
	padding: 20px;
	width: 200px;
	}
	#column-2 .content {
	padding: 10px;
	width: 730px;
	}
	#column-2 .navigation {
	padding: 10px;
	width: 730px;
	}	
	
	/* Let's compensate for IE6's inability to interpret top: 0; and bottom: 0; */
	* html #column-1 .overlay { height: expression(document.getElementById("column-1").offsetHeight); }
	* html #column-2 .overlay { height: expression(document.getElementById("column-2").offsetHeight); }