@charset "utf-8";

/* DESIGN NOTES

Style Author: Nik Peran, http://nettoolkits.com
Layout: 900px Fixed width 2 column with LHS sidebar
Navigation: Top menu bar with CSS buttons

_________________________________________________________________*/


body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-align: center;
	background-color: #000000;
}

/* Zero out browser presets */
body, p, h1, h2, h3, h4, h5, h6 ol, ul, dl, blockquote, address {
	margin: 0px;
	padding: 0px;
}
img {
	border-style: none;
}




/* Start LINKS ------------------------------------------ */	

a:link, a:visited {
	color: #e31212;
	text-decoration: none;
}
a:hover, a:active {
	text-decoration: underline;
	color: #e31212;
}
#menuBarBottom a:link, #menuBarBottom a:visited {
	color: #554637;
}
#menuBarBottom a:hover, #menuBarBottom a:active {
	color: #F6F0E2;
}

.darkLink:link, .darkLink:visited {
	color: #333;
}
.darkLink:hover, .darkLink:active {
	color: #333;
	text-decoration: none;	
}


/* HEADING Styles -----------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	color: #5F4F3F;
	font-family: "Trebuchet MS", Arial, sans-serif;
	padding-bottom: 8px;
}

h1 {
	font-size: 1.8em;
	padding-bottom: 15px;
}
h2 {
	font-size: 1.5em;
}
h3 {
	font-size: 1.25em;
}
h4 {
	font-size: 1.1em;
}
h5 {
	font-size: 1em;
}
h6 {
	font-size: 1em;
}


/* Start LIST Styles ---------------------------------------*/

.bulletsNone {
	list-style-type: none;
	line-height: 135%;
}
.bulletsImg {
	list-style-image: url(../images/bullet.gif);
	line-height: 150%;
}

#wideColumn ul, #wideColumn ol {
	padding-left: 40px;
}


/* Start POSITIONING Styles ----------------------------------*/

.clearFloat {
	clear: both;
}
.clearLeft {
	clear: left;
}
.clearRight {
	clear: right;
}

.floatLeft {
	float: left;
}
.floatRight {
	float: right;
}
#logo {
	position: absolute;
	left: 10px;
	top: 10px;
	z-index: 1;
}




/* Define PAGE LAYOUT divisions -------------------------------*/

#container {
	padding: 0px;
	margin: 0 auto;
	width: 900px;
	position: relative;
	text-align: left;
	background-color: #987E65;
	color: #222;
	background-image: url(../images/bg-body.jpg);
	background-repeat: repeat-y;
}
#header {
	background-image: url(../images/banner.jpg);
	height: 230px;
	background-repeat: no-repeat;
	text-align: left;
	margin: 0;
	background-color: #B7ADA3;
}
#menuBarTop {
	height: 40px;
	font-size: 1.2em;
	color: #152F50;
	vertical-align: middle;
	width: 900px;
	overflow: hidden;
}
#menuBarBottom {
	height: 24px;
	text-align: center;
	font-size: 1.2em;
	color: #554637;
	clear: both;
}
#footer {
	background-image: url(../images/bg-footer.jpg);
	background-repeat: no-repeat;
	color: #666F74;
	font-size: 1.15em;
	height: 28px;
	text-align: center;
	padding-top: 22px;
}



/* Define MENU BAR STYLES ---------------------------------------*/

#menuBarTop li {
	float: left;
	text-align: center;
	list-style-type: none;
}

#plainLink, #photoLink, #cartoonLink, #bannerLink, #gameLink, #webLink {
	line-height: 40px;
	background-image: url(../images/bg-link.jpg);
	display: block;
	height: 39px;
	width: 180px;
	color: #444;
	font-weight: bold;
	font-size: 1.2em;
	font-variant: small-caps;
}
#menuBarTop a:hover {
	line-height: 40px;
	background-image: url(../images/bg-link.jpg);
	display: block;
	height: 39px;
	width: 180px;
	color: #EDE8D4;
	font-weight: bold;
	font-size: 1.2em;
	font-variant: small-caps;
	text-decoration: none;
	background-position: center;
}
#menuBarTop a:active {
	line-height: 40px;
	background-image: url(../images/bg-link.jpg);
	display: block;
	height: 39px;
	width: 180px;
	color: #EDE8D4;
	font-weight: bold;
	font-size: 1.2em;
	font-variant: small-caps;
	text-decoration: none;
	background-position: bottom;
}

#plain   #plainLink, 
#photo   #photoLink,
#cartoon   #cartoonLink,
#banner   #bannerLink,
#game   #gameLink,
#web   #webLink {
	line-height: 40px;
	background-image: url(../images/bg-link.jpg);
	display: block;
	height: 39px;
	width: 180px;
	color: #EDE8D4;
	font-weight: bold;
	font-size: 1.2em;
	font-variant: small-caps;
	text-decoration: none;
	background-position: center;
}


/* Set out content COLUMNS -----------------------------*/

#wideColumn {
	float: right;
	width: 460px;
	font-size: 1.25em;
	padding-left: 10px;
	margin-right: 50px;
}
#narrowColumn {
	font-size: 1.2em;
	margin-right: 530px;
	margin-left: 30px;
	padding-left: 15px;
}

#singleColumn {
	font-size: 1.2em;
	padding: 0 55px;
}
#scrollOuter {
	width: 820px;
	background-image: url(../images/scroll-body.jpg);
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-repeat: repeat-y;
}
#scrollBottom {
	background-image: url(../images/scroll-bottom.png);
	height: 95px;
	background-repeat: no-repeat;
}
#scrollTop {
	background-image: url(../images/scroll-top.jpg);
	background-repeat: no-repeat;
	padding: 95px 0 15px 0;
}


/* Defne minor CONTENT boxes ---------------------------*/

.borderBox {
	border: 1px solid #DDD;
	margin-bottom: 10px;
}
#scrollOuter p {
	padding-bottom: 8px;
	line-height: 135%;
}


.textBox1 {
	padding: 5px;
	border: 1px solid #DDD;
	line-height: 135%;
}
.textBox2
 {
	padding: 5px;
	line-height: 125%;
}
.textBox3 {
	padding: 5px;
	background-color: #F5F1F5;
	color: #10243A;
	line-height: 125%;
}


/* CUSTOM COLORS and TEXT STYLES -----------------------------------*/

.colorLink, abbr, acronym {
	color: #037AB4;
}
.colorHeading {
	color: #554637;
}
.error {
	color: #990000;
}
.colorGreen {
	color: #9CBB22;
}
.imgBorder {
	border: solid 2px white;
}

.highlightYellow {
	background-color: #FF6;
	padding: 1px 3px;
}
.lineDotted {
	padding-bottom: 10px;
	border-top: dashed 1px #DDD;
}

.lineSolid {
	padding-bottom: 10px;
	border-top: solid 1px #DDD;
}
.textLarger {
	font-size: 110%;
}
.textSmaller {
	font-size: 95%;
}
#narrowColumn li {
	line-height: 20px;
}
#narrowColumn ul {
	padding-left: 20px;
}
#narrowColumn ul ul li {
	list-style-type: disc;
}
#narrowColumn ul ul ul li {
	list-style-type: circle;
}