body, html { margin: 0; padding: 0; height: 100%; }

body {
	background: #522;
	font-family: Georgia, "Times New Roman", serif;
	text-align: center;
}

h2, h3 {
	margin: 0;
	padding: 0.2em 0 0.2em 0;
}

h4 {
	font-variant: small-caps;
	margin: 0;
	padding: 0.8em 0 0.2em 0;
}

ul {
	margin: 0.2em 0em;
	padding: 0 0 0 2.5em;
}

#container {
	background: #963 url(/images/dusk.jpg) repeat-x scroll 0 0;
	height: 100%;
	margin: 0 20px;
	padding: 0;
	text-align: center;
}
/* Dimensions of associated classes: ??? */
/* home: */
/* height = brand.~height + brand.padding + main-framework.~height + headings.margin-top + meat-shadow.top */

.container-home {
	min-height: 598px;
	min-width: 686px;
}

.container-reel {
	min-height: 760px;
	min-width: 880px;
}

.container-resume {
	min-height: 700px;
	min-width: 905px;
}

.container-contact {
	min-height: 600px;
	min-width: 680px;
}

#brand {
	color: #522;
	font-variant: small-caps;
	margin: 0 auto;
	padding: 20px 20px 0 0;
	text-align: right;
}
/* Dimensions of associated classes should equal dimensions of corresponding "meat-framework" classes. */

.brand-home {
	width: 606px;
}

.brand-reel {
	width: 775px;
}

.brand-resume {
	width: 800px;
}

.brand-contact {
	width: 600px;
}

#main-framework {
	margin: 0 auto;
	padding: 0;
}
/* Dimensions of associated classes should equal dimensions of corresponding "meat-framework" classes. */

.main-framework-home {
	width: 606px;
}

.main-framework-reel {
	width: 775px;
}

.main-framework-resume {
	width: 800px;
}

.main-framework-contact {
	width: 600px;
}

#headings {
	border-width: 0 0 1px 0;
	border-color: #000;
	border-style: solid;
	font-size: 0.8em;
	font-variant: small-caps;
	padding: 0;
}
/* Dimensions of associated classes should equal dimensions of corresponding "meat-framework" classes. */

.headings-home {
	margin: 50px 0 0 0;
	width: 606px;
}

.headings-reel {
	margin: 0;
	width: 775px;
}

.headings-resume {
	margin: 0;
	width: 800px;
}

.headings-contact {
	margin: 50px 0 0 0;
	width: 600px;
}

.heading {
	background-color: #522;
	border-width: 1px;
	border-color: #000;
	border-style: solid;
	float: left;
	margin: 0 5px -1px 0;
	padding: 5px 0;
	width: 100px;
}

.heading-hover {
	background-color: #210;
	border-width: 1px;
	border-color: #000;
	border-style: solid;
	float: left;
	margin: 0 5px -1px 0;
	padding: 5px 0;
	width: 100px;
}

.heading-active {
	background-color: #996;
	border-color: #000 #000 #996 #000;
}

.heading a,
.heading-hover a {
	color: #fff;
	text-decoration: none;
}

.clear-simple {
	clear: both;
}

#meat-framework {
	margin: 0;
	padding: 0;
	position: relative;
}
/* Dimensions of associated classes:
	framework h/w = content h/w + content padding + border-widths
	e.g.,
	418 = 397 + 20 + (0 + 1)
	713 = 711 +  0 + (1 + 1)
*/

.meat-framework-home {
	height: 424px;
	width: 606px;
}

.meat-framework-reel {
	height: 586px;
	width: 775px;
}

.meat-framework-resume {
	height: 536px;
	width: 800px;
}

.meat-framework-contact {
	height: 286px;
	width: 600px;
}

#meat-content {
	background-color: #996;
	border-width: 0 1px 1px 1px;
	border-color: #000;
	border-style: solid;
	color: #310;
	left: 0px;
	position: absolute;
	text-align: left;
	top: 0px;
}
/* Dimensions of associated classes below should equal dimensions of desired content. NB: Scrollbars do not affect this consideration. */

#meat-content a {
	color: #310;
	text-decoration: none;
}

.meat-content-home {
	height: 403px;
	padding: 20px 0px 0px 0px;
	width: 604px;
}

.meat-content-reel {
	height: 560px;
	padding: 20px 5px 5px 5px;
	width: 763px;
}

.meat-content-resume {
	height: 500px;
	overflow-y: scroll;
	padding: 20px 15px 15px 20px;
	width: 763px;
}

.meat-content-contact {
	height: 350px;
	overflow-y: auto;
	padding: 20px 15px 15px 20px;
	width: 563px;
}

.meat-content-resume p.bottom-pgph {
	padding-bottom: 20px;
}

#meat-shadow {
	background-color: #630;
	left: 8px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 8px;
}
/* Dimensions of associated classes should equal dimensions of corresponding "meat-framework" classes. */

.meat-shadow-home {
	height: 424px;
	width: 606px;
}

.meat-shadow-reel {
	height: 586px;
	width: 775px;
}

.meat-shadow-resume {
	height: 536px;
	width: 800px;
}

.meat-shadow-contact {
	height: 386px;
	width: 600px;
}

.video {
	text-align: center;
	width: auto;
}

/* Debugging styles */
div {
	border: 0px #000 solid;
}

#main-framework {
	border: 0px #000 solid;
	}
