* {margin:0; padding:0;}
body {
	font-family:helvetica, arial, sans-serif;
	background:#F5DEB3;
	}
#wrapper {
	min-width:760px; max-width:1100px; margin:0 auto; border:1px solid; overflow:hidden;
	}
header {
	background:#000;
	}
header h1 {
	color:#fff;
	font-family:'Droid Sans';
	font-weight:400;
	font-size:4em;
	letter-spacing:-.05em;
	padding:0 0 5px 10px; 
	}
nav {
	display:table-cell;
	width:150px;
	background:F5DEB3;
	padding:10px;
	}
nav li {
	list-style-type:none;
	}
nav a {
	font-family:'Open Sans Condensed';
	font-weight:700;
	font-size:.85em;
	color:#616161;
	}
article {
	display:table-cell;
	background:#fff;
	padding:10px 20px;
	}
article h1 {
	font-family:'Droid Sans';
	font-weight:700;
	font-size:1.5em;
	letter-spacing:-.05em;
	color:#616161;
	}
article h2 {
	font-family:'Droid Sans';
	font-weight:700;
	font-size:1.25em;
	letter-spacing:-.05em;
	color:#616161;
	text-decoration:overline;
	margin:10px 0 0 0;
	}
article p {
	font-family:'Open Sans Condensed';
	font-weight:300;
	font-size:1em;
	color:#000;
	}
aside {
	display:table-cell;
	width:210px;
	background:#F5DEB3;
	padding:10px;
	}
aside h3 {
	font-family:'Open Sans Condensed';
	font-weight:700;
	letter-spacing:-.075em;
	color:#000;
	}
aside p {
	font-family:'Open Sans Condensed';
	font-weight:700;
	font-size:.85em;
	line-height:1.2em;
	color:#000;
	}
footer {
	clear:both;
	background:#000;
	text-align:center;
	}
footer p {
	font-family:'Open Sans';
	font-weight:700;
	font-size:.65em;
	color:#fff;
	}
footer a {
	font-family:'Open Sans';
	font-size:1em;
	color:#ffed53;
	text-decoration:none;
	}
	
	figure {
	margin:20px 20px;			/* space between boxes */
	position:relative; /* positioning context for popups */
	}
img {display:block;}/* remove baseline spacing from under image */
figcaption {
	display:none; /* hides popups */
	position:absolute; /* relative to images */
	left:18%; top:14px; /* positions popup on right side of image */
	width:130px; /* width of popup */
	padding:10px; /* space around popup content */
	background:#f2eaea;
	border:3px solid red; border-radius:6px;
	}
figure:hover figcaption {display:block; z-index:2;} /* displays popup when image is hovered */
figcaption h3 { /* popup content */
	font-size:14px;
	color:#666;
	margin-bottom:6px;
	}
figcaption a { /* popup content */
	display:block;
	text-decoration:none;
	font-size:12px;
	color:#000;
	}
figcaption:after { /* red triangle box*/
	content:""; /* some content required - using empty text string */
	position:absolute; /* relative to popup */
	border:12px solid;
	border-color:transparent red transparent transparent; 
	right:100%; top:17px;
	height:0px; width:0px; /* collapses box to create triangle */ 
	}