@import url("sifr-screen.css");

body, p, table, tr, td, ul, ol, li, dl, dd, dt, div, span, a, h1, h2, h3, h4, h5, h6, fieldset {
	margin: 0; padding: 0;
}

body {
	background: #074303 url(../_img/bg.gif);
	font-family: verdana, san-serif;
	font-size: .8em;
	color: #BFA783;
}
a {
	color: #00CCCC;
}
	a span {
		display: block;
		position: absolute;
		left: -9001px;
	}
h1 {
	font-size: 2em;
	margin-bottom: .5em;
	padding: 0 !important;
}
h2 {
	font-size: 1.4em;
	margin-bottom: .5em;
	padding: 0 !important;
}
h3 {
	font-size: 1.1em;
	font-weight: bold;
	padding: 0 !important;
}

div.clear {
	height: 1px;
	clear: both;
	overflow: hidden;
}

div.col1 {
	width: 49%;
	float: left;
}
div.col2 {
	width: 49%;
	float: right;
}

div.wrapper {
	width: 780px;
	position: relative;
	margin-left: 230px;
	}
	div#crew_picture {
		width: 250px;
		height: 537px;
		background: url(../_img/the-elves-of-iax.png) no-repeat;
		position: absolute;
		top: 250px;
		}
div.header {}
	div.header p {
		display: inline;
	}
	div#banner {
		display: block;
		width: 560px;
		height: 160px;
		background: url(../_img/banner.gif) no-repeat;
		margin: 20px 0;
	}
		div#banner span {
			display: block;
			position: absolute;
			left: -9001px;
		}
	div#order a {
		overflow: hidden;
	}
	a#ie_order {
		background: url(../_img/order.png) no-repeat;
		display: block;
		width: 250px;
		height: 172px;
		position: absolute;
		left: 535px;
		top: 0;
	}
div.nav {
	width: 500px;
	height: 30px;
	position: absolute;
	left: 50px;
	top: 140px;
}
	div.nav ul {
		list-style: none;
		width: 486px;
		height: 30px;
		background-image: url(../_img/nav.png);
	}
		div.nav ul li {
			float: left;
			display: block;
			height: 30px;
		}
			div.nav ul li a {
				display: block;
				height: 30px;
				background-image: url(../_img/nav.png);
				background-repeat: no-repeat;
				background-position: 0 -60px;
			}
			div.nav ul li.news a { width: 54px; margin-right: 10px;}
			div.nav ul li.comics a { width: 74px; margin-right: 10px;}
			div.nav ul li.literature a { width: 104px; margin-right: 10px;}
			div.nav ul li.media a { width: 64px; margin-right: 10px;}
			div.nav ul li.artwork a { width: 76px; margin-right: 10px;}
			div.nav ul li.order a { width: 63px; }

			div.nav ul li.news a:hover { background-position: 0 -30px; }
			div.nav ul li.comics a:hover { background-position: -64px -30px; }
			div.nav ul li.literature a:hover { background-position: -148px -30px; }
			div.nav ul li.media a:hover { background-position: -262px -30px; }
			div.nav ul li.artwork a:hover { background-position: -336px -30px; }
			div.nav ul li.order a:hover { background-position: -422px -30px; }

/* ============ CENTRAL ============ */

div.central {
	width: 780px;
	color: #240B03;
	margin-left: 230px;
}
	div.central a {
		color: #B33B00;
	}
	div.central dl {
		margin: 0 20px 10px;
	}
		div.central dl dt {
			font-weight: bold;
		}
		div.central dl dd {
			padding-left: 20px;
		}

	div.central div.content {
		float: left;
		width: 550px;
		margin-left: 5px;
	}
	div.central div.content div.top {
		background: url(../_img/left_top.gif) no-repeat;
		height: 10px;
		width: 550px;
		overflow: hidden;
	}
	div.central div.content div.middle {
		background: url(../_img/left_bg.gif);
		padding: 7px 1px 1px;
		min-height: 400px;
	}
	div.central div.content div.bottom {
		background: url(../_img/left_bottom.png) no-repeat;
		height: 15px;
		width: 550px;
		position: relative;
		top: -4px;
	}
		div.central div.content p,
		div.central div.content table,
		div.central div.content form {
			margin: 0 20px 10px;
		}
		div.central div.content h1,
		div.central div.content h2 {
			margin: 0 20px;
		}
		div.central div.content h3 {
			margin: 0 20px 5px;
		}
		div.central div.content div.hr {
			margin: 0 auto 10px;
			width: 501px;
			height: 20px;
			clear: both;
			background: url(../_img/hr_left.gif) no-repeat;
		}
		
		div.central div.content p.fine {
			font-size: 10px;
			}
		div.central div.content p.error {
			border: 1px solid #CC0000;
			background-color: #EEDDDD;
			color: #CC0000;
			padding: 3px;
			font-weight: bold;
		}
		div.central div.content label {
			display: block;
			width: 180px;
			float: left;
			clear: left;
		}
		div.central div.content input {
		}
		div.central div.content ul.form li {
			padding: 3px;
			margin-bottom: 3px;
			width: 370px;
		}
		div.central div.content ul.form li.required {
			border: 1px solid #CC0000;
			background-color: #EEDDDD;
		}
			div.central div.content ul.form li.required label {
				font-weight: bold;
				color: #CC0000;
			}
		
		div.central div.content ul {
			margin: 0 20px 10px;
			list-style: none;			
		}
		div.central div.content div.comic_listing {
		}
			div.central div.content div.comic_listing a img {
				color: #754000;
				border: 2px solid #754000;
			}

			div.central div.content div.comic_listing div.link {
				width: 85px;
				float: left;
				margin: 0 0 20px 20px;
				display: inline;
			}
			div.central div.content div.comic_listing div.link a {
			}
			div.central div.content div.comic_listing div.info {
				width: 420px;
				float: left;
				margin: 0;
				display: inline;
			}
			
	div.central div.content div.view_comic {
		width: 550px;
		margin: 10px auto;
		text-align: center;
	}
		div.central div.content div.view_comic img {
			border:2px solid #754000;
			margin: 0;			
		}
		div.central div.content div.view_comic h3 {
			margin: 0 40px 10px 40px;
		}
		div.central div.content div.view_comic p {
			margin: 0 40px 10px 40px;
			position: relative; 
			left: -3px;
		}
		div.central div.content div.view_comic p.image {
			margin: 0 auto 10px auto;
		}
/* ============ SIDEBAR ============ */
	div.central div.sidebar {
		float: right;
		width: 225px;
	}
	div.central div.sidebar div.top {
		background: url(../_img/right_top.gif) no-repeat;
		height: 10px;
		width: 225px;
		overflow: hidden;
	}	
	div.central div.sidebar div.middle {
		background: url(../_img/right_bg.gif);
		width: 225px;
		overflow: hidden;
		padding: 7px 1px 1px;
	}	
	div.central div.sidebar div.bottom {
		background: url(../_img/right_bottom.png) no-repeat;
		height: 15px;
		width: 225px;
		position: relative;
		top: -4px;
	}	
		div.central div.sidebar p,
		div.central div.sidebar table,
		div.central div.sidebar form,
		div.central div.sidebar dl  {
			margin: 0 20px 10px;
		}
		div.central div.sidebar h2,
		div.central div.sidebar h3  {
			margin: 0 20px;
		}
		div.central div.sidebar img.callout  {
			border: 1px solid #240B03;
		}
		div.central div.hr2,
		div.central div.sidebar div.hr {
			margin: 0 auto 10px;
			width: 188px;
			height: 21px;
			clear: both;
			background: url(../_img/hr_right.gif) no-repeat;
		}
		div.central div.sidebar ul, 
		div.central div.sidebar ol {
			margin: 0 20px 10px;
		}
			div.central div.sidebar ul li,
			div.central div.sidebar ol li {
				margin-left: 20px;
			}
		div.central div.sidebar div.comic_listing {
		} 
			div.central div.sidebar div.comic_listing a img {
				border: 2px solid #754000;
			}
			div.central div.sidebar div.comic_listing p {
				display: inline;
				width: 90px;
				float: left; 
				margin-right: 0;
				margin-left: 14px;
				overflow: hidden;
			}
				div.central div.sidebar div.comic_listing p a {
					display: block;
					text-align: center;
				}
div.footer {
	font-size: .8em;
	margin: 20px 0 0  230px;
	width: 548px;
	text-align: center;
	clear: both;
}


/* specific instances */
table.order {
	border-collapse: collapse;
	width: 300px;
}
	table.order th {
		text-align: left;
		padding: 2px 8px;
		border-bottom: 1px solid #240B03;
		border-right: 1px solid #240B03;
		background-color: #7D4B03;
	}
	table.order td {
		text-align: left;
		padding: 2px 8px;
		border-bottom: 1px solid #240B03;
		border-right: 1px solid #240B03;
	}
	table.order td.last,
	table.order th.last {
		border-right: none;
	}
	table.order tr.last td {
		border-right: none;
		border-bottom: none;
	}
img.cards {
	vertical-align: top;
	}
img.lit_illo {
	position: absolute;
	left: 755px;
	margin-top: -20px;
   	}