@media screen {
	/* style sheet for screen goes here */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;}
	/* remember to define focus styles! */
	:focus {
		outline: 0;}
	body {
		line-height: 1;
		color: black;
		background: white;
		text-align: center;
		font-family: 'Meta Serif Bold', 'Lucida Bright', Cambria, Georgia, serif;}
	ol, ul {
		list-style: none;}
	/* tables still need 'cellspacing="0"' in the markup */
	table {
		border-collapse: collapse;
		border-spacing: 0;}
	caption, th, td {
		text-align: left;
		font-weight: normal;}
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: "";}
	blockquote, q {
		quotes: "" "";}
	html, body {
		min-height: 100%;}
/* Box Types  */
	.box {
		position: absolute;
		width: 150px;
		height: 50px;
		z-index: 1;}
	.c {
		background-image: url("images/c.png");
		background-repeat: repeat;
		position: absolute;
		height: 200px;
		width: 200px;}
	.k {
		background-image: url("images/k.png");
		background-repeat: repeat;
		position: absolute;
		height: 200px;
		width: 200px;}
	.m {
		background-image: url("images/m.png");
		background-repeat: repeat;
		position: absolute;
		height: 200px;
		width: 200px;}
	.y {
		background-image: url("images/y.png");
		background-repeat: repeat;
		position: absolute;
		height: 200px;
		width: 200px; }
/*Standard Page Elements */
	#header {
		position: relative;
		left: 0;
		width: 100%;
		height: 6.5em;
		float: right;
		clear: both;
		z-index: 12;
		margin: 0 0 2.5em 0;
		background: transparent url("images/m.png");
		background: rgba(116, 38, 16, 0.4) none;
		-moz-border-radius-bottomleft: 15px;
		-webkit-border-bottom-left-radius: 15px;
		-moz-border-radius-bottomright: 15px;
		-webkit-border-bottom-right-radius: 15px;
		border-radius-bottomleft: 15px;
		border-radius-bottomright: 15px;
		-webkit-box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		-moz-box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);}
	#header #name {
		position: relative;
		text-align: right;
		float: right;
		right: 0;
		width: 3em;
		line-height: .75em;
		font-family: Courier New, monospace;
		text-transform: lowercase;
		font-size: 2em;
		font-weight: bold;
		color: rgb(116,38,16);
		color: rgba(116,38,16,1);
		padding: 0 .25em .1em 0;
		margin: 5px 0.5em 0 0;}
	#header #subtitle {
		position: relative;
		left: 0;
		float: left;
		text-align: left;
		line-height: .75em;
		font-family: Courier New, monospace;
		text-transform: lowercase;
		font-size: 4em;
		font-weight: bold;
		color: rgb(136,91,82);
		color: rgba(75,15,6,.5);
		padding: .5em 0 .1em .25em;
		margin: 15px 0 0 0;}
	#nav {
		display: block;
		position: absolute;
		width: 30%;
		min-width: 400px;
		height: 2em;
		left: 25%;
		top: 7em;
		text-align: center;
		line-height: 2em;
		font-family: Courier New, monospace;
		text-transform: lowercase;
		font-size: 1em;
		font-weight: bold;
		padding: 0 1em 0 1em;
		background: transparent url("images/w.png");
		background: rgba(15, 15, 15, 0.15) none;
		-moz-border-radius-topleft: 10px;
		-webkit-border-top-left-radius: 10px;
		-moz-border-radius-topright: 10px;
		-webkit-border-top-right-radius: 10px;
		border-radius-topleft: 10px;
		border-radius-topright: 10px;
		border-bottom: 1px solid lightgray;
		z-index: 10;}
	#nav li {
		display: inline;
		padding: 0.5em 0.1em 0.75em 0.1em;}
	#nav li:first-letter {}
	#nav li:hover {
		background: transparent url("images/m.png");
		background-color: rgba(116, 38, 16, 0.4);}
	#nav a{
		text-decoration: none;}
	#wrapper{
		width: 90%;
		min-width: 800px;
		margin: 0 auto 0 auto;
		z-index: 10;
		padding: 0;
		min-height: 75%;}
	#content {
		position: relative;
		width: 100%;
		height: 100%;
		text-align: left;
		z-index: 15;}
	#features {
		float: left;
		width: 17%;
		min-height: 25em;
		padding: 0 0 1em 0;
		background: transparent url("images/w.png");
		background: rgba(15, 15, 15, 0.15) none;
		text-align: left;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		z-index: 14;
		-webkit-box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		-moz-box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		border-right:  1px solid darkgray;
		border-bottom: 1px solid darkgray;
		overflow: visible;}
	#features ul {}
	#features li:first-child {
		margin-top: 1em;}
	#features li{
		padding: .5em .5em .5em .5em;}
	#features li:hover{
		background-color: yellow;}
	#main {
		float: left;
		width: 79.5%;
		min-height: 25em;
		margin: 0 0 0 3%;
		padding: 0 0 1em 0;
		clear: right;
		text-align: left;
		background: transparent url("images/w.png");
		background: rgba(15, 15, 15, 0.15) none;
		color: rgb(15,15,15);
		color: rgba(15,15,15,.75);
		z-index: 12;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		-webkit-box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		-moz-box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		box-shadow: 2px 2px 4px rgba(0,0, 0, 0.3);
		border-right:  1px solid darkgray;
		border-bottom: 1px solid darkgray;
		overflow: visible;}
	#main h1, #main p{
		padding: .5em .5em .25em .5em;}
	#footer{
		float: left;
		clear: both;
		width: 100%;
		height: 50%;
		min-height: 368px;
		margin-top: -230px;
		color: gray;
		font-family: Courier New, monospace;
		font-variant: small-caps;
		font-size: .5em;
		z-index: 0;
		text-align: right;
		background-position: left bottom;
		background-repeat: no-repeat;
		background-image: url("images/bottomflare-crop.png");}
	#footer:first-letter {
		text-transform: uppercase;}
	#footer p {
		margin: 315px 5% 0 0;}
/* fonts */
	#wrapper h1 {
		font-size: 2em;
		text-align: left;
		font-variant: small-caps;
		font-weight: bold;}
	#wrapper h2 {
		font-size: 1.5em;
		line-height: 1.5em;
		text-align: left;}
	#wrapper h3 {
		padding-top: 1em;
		font-size: 1em;
		line-height: 1em;
		font-weight: bold;
		text-align: center;}
	#wrapper p{
		line-height: 1.25em;}
	strong {
		font-weight: bold;}
	em {
		font-style: italic;}
/* floaters*/
	.floatright {
		float: right;
		clear: both;}
	.floatleft {
		float: right;
		clear: both;}
/*others*/
	a img, genericimage {
		border: none;
		text-decoration: none;}
	#main ul {
		list-style-type: circle;
		list-style-position: inside;
		margin: 0 0 0 1em;
		padding: 0;}
	#main li {
		line-height: 1.25em;}
	#main li:before {
		content: "";}
	#storytable {
		margin: 10px 5px 0px 5px;}
	#storytable thead, thead th{
		font-weight: bold;
		font-size: 1.25em;
		margin-bottom: 1.5em;}
	#storytable {
		text-align: left;
		font-size: 1em;
		line-height: 1em;
		border-collapse: collapse;}
	#storytable .title {
		min-width: 35%;
		padding-right: 10px;}
	#storytable .summary {
		}
	#storytable .summary p {
		padding: 0;}
	#storytable .listrow:hover{
		background: transparent url("images/w.png");
		background: rgba(15, 15, 15, 0.15) none;}
	#storytable tr, #storytable td{
		min-height: 3em;
		vertical-align: top;
		border-bottom: 1px solid gray;
		padding-bottom: 1em;
		padding-top: 0.25em;}
	#storytable .tags, #storytable .origin {
		text-align: center;
		width: 15%;
		font-size: .75em;}
	.section {
		padding: 0 0 30px 0;
		border-bottom: 2px dashed lightgray;}
	#infoblock {
		padding: 35px 0 0 0;
		text-align: right;
		font-size: 0.5em;
		color: darkgray;}
	#story {}
	#parentinfo {
		padding: 1em 0 0 1em;
		float: left;}
	#childinfo {
		padding: 1em 1em 0 0;
		float: right;}
}
