﻿body
{
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	
	background-color: #CDDAE4;
	font-family: Verdana , 'Times New Roman' , 'MS Serif';
	background-color: #CDDAE4;
	background-image: url('http://archive2009.codeofrob.com/content/images/SimpleTile.png');
	background-repeat: repeat;
}

#Logo
{

}

#LeftContent
{
	position: absolute;
	width: 150px;
	height: auto;
	left: 5px;
	top: 225px;
}

#RightContent
{
	position: absolute;
	width: 650px;
	height: auto;
	left: 170px;
	top: 225px;

}

#ContextContent
{
	position: absolute;
	width: 150px;
	height: auto;
	left: 840px;
	top: 225px;
	
}

#Banner, div.MenuHeader, div.SectionHeader, div.MenuBody, div.SectionBody, div.commentBoxStyle
{
	/* All Borders Are Controlled By This Div */
	border-color: #FFFFFF;
	border-style: solid;
	
	/* This Is All Default, Everything Must Override Manually */	
	border-width: 2px;
}

#Banner
{
	/* Just Float Up There With Yer Image */
	position: absolute;
	left: 170px;
	top: 20px;
	width: 650px;
	height: 175px;

	/* Gonna Go On The Assumption That All Pages Are A Single Folder Deep :S */
	background-image:url('http://archive2009.codeofrob.com/content/images/Banner.png');
	
}

div.MenuHeader, div.SectionHeader
{
	/* Shared Positioning And Height */
	width: 100%;
	min-height: 30px;
	float: left;	
	
	/* Default Border and Padding */
	
	/* Darker Than Content */
	background-color: #EEEEFF;
}

div.MenuBody, div.SectionBody
{	
	/* Shared Colour + Positioning */
	width: 100%;
	float: left;
	background-color: #CDDAE4;

	/* Get Rid Of The Top Border */
	border-top-style: none;
}

div.MenuBody
{
	/* Margins Don't Have Footers */
	margin-bottom: 25px;
	
	/* A Tiny Bit Of Padding To Space The Elements */
	padding-top: 5px;
	
	/* Bring The Font Down A Notch */	
	font-size: 12px;
}

/* The Menu Stylee */

div.MenuBody ul
{
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;	
	list-style-type: none;
}


div.MenuBody li
{
	padding-bottom: 1px;
	font-size: 12px;
}

div.MenuBody a
{
	font-variant: small-caps;
	text-decoration: none;
	color: #08085f;
}

div.MenuBody a:hover
{
	color: #08085f;
	background-color: #EEEEFF;
}

div.MenuBody a:Visited
{
	color: #770000;
}


div.MenuBody
{
	/* Flow Like The Wind! */
	height: auto;	
}

div.SectionBody
{	
	padding-top: 10px;
	min-height: 150px;
}

div.SectionFooter
{
	/* Allows Us To Be Content, Even In Firefox */
	clear: both;
	
	/* Footer Text Is Teh Small */
	font-size: 10px;	
	
	/* Push Down */
	margin: 0px 0px 20px 0px;
}


div.SectionFooter p
{
	/* Space A Bit From The Section We're Footering */
	margin: 3px 0px 0px 0px;
}

div.MenuHeader h1, div.MenuHeader h2, div.MenuHeader h3, div.MenuHeader h4, div.MenuHeader h5, div.MenuHeader h6
{
	/* Line Height Was Ridiculous In Firefox, So Explicitly Setting Here*/
	line-height: 20px;
	font-size: 18px;
	
	/* Padding So Borders Don't Interfere With Text, No Margin */
	padding: 1px 1px 1px 1px;
	margin: 0px 0px 0px 0px;
	
	/* Center The Menu Headers Up */
	text-align: center;	
	
	/* Not Playing With This */
	text-transform: uppercase;
	
	/* Staying Pale */
	color: #006699;
}

div.SectionHeader h1, div.SectionHeader h2, div.SectionHeader h3, div.SectionHeader h4, div.SectionHeader h5, div.SectionHeader h6
{
	/* Line Height Was Ridiculous In Firefox, So Explicitly Setting Here*/
	line-height: 20px;
	font-size: 18px;
	float: left;
	
	/* Padding So Borders Don't Interfere With Text, No Margin */
	padding: 1px 1px 1px 1px;
	margin: 0px 0px 0px 0px;	
	
	/* Not Playing With This */
	text-transform: none;
	
	/* Staying Pale */
	color: #006699;
}

div.SectionHeader a
{
	text-decoration: none;	
	/* Staying Pale */
	color: #006699;	
}

div.SectionHeader a:Visited
{
	color: #770000;
}

div.SectionBody ul
{
	list-style-type: circle;
}

div.SectionBody h1, div.SectionBody h2, div.SectionBody h3, div.SectionBody h4, div.SectionBody h5, div.SectionBody h6
{
	color: #08085f;
	padding: 1px 1px 1px 1px;
	margin: 0px 0px 5px 0px;
	font-variant: small-caps;	
}

div.SectionBody p, div.SectionBody li, div.commentBoxStyle
{
	/* Bluuuuue */
	font-size: 12px;
	color: #08085f;
}

div.SectionBody p, div.commentBoxStyle
{
	/* Space The Paragraphs A Bit */
	margin: 0px 10px 10px 10px;
}

div.commentBoxStyle
{
	padding: 2px 2px 2px 2px;
}

div.commentDateStyle
{
	font-weight: bold;
	margin-bottom: 5px;
}

div.commentBoxFooterStyle
{
	font-variant: small-caps;
	font-weight: bold;
}

table
{
	/* NOTE: This is for Dasblog Macro Benefit */
	margin-left: 0px;
	margin-right: auto;
	padding: 0px 0px 0px 0px;
	text-align: left;
	font-size: 12px;
}

table a
{
	/* Because dasBlog still didn't get the message
	I mean REALLY, WHO THE HELL MAKES A THEMEABLE BLOGGING SYSTEM AND THEM WRITES INLINE STYLES ON TABLES?!?!?! */
	text-align: left;
	text-transform: uppercase;
}

div.SectionBody li
{
	/* Space The List Items A Little Less */
	margin: 0px 10px 5px 10px;
}

div.CodeBody
{
	background-color: #EEEEEE;
	width: 630px; /*NOTE: This is 10px less than the main body width */
	height: auto;
	margin: 3px 5px 3px 5px;
	padding: 0px 0px 0px 0px;	
}

img.ThumbnailImage
{
	/* A Faint Bit Of Padding, And A White Border*/
	padding: 0px;
	margin: 0px 4px 4px 4px;
	border: solid 1px #FFFFFF;
	float: left;
}

div.ImageContainerIEHack
{
	/* Woo, Just Developed My Own Hack For IE Not Doing margin: auto properly */
	/* NOTE: This also has the effect of centering the image and text inside the div too, so that's ok */
	 text-align: center;

}

/* This is the centered div which holds the image to the center */
div.ImageContainer
{
	margin: 20px auto 20px auto;
	padding: 0px 0px 0px 0px;
	width: auto;
	clear: left;
}

div.FootNote
{
	float: left;
	width: auto;
	margin: 15px 0px 0px 0px;
}

div.FootNote p
{
	color: #08085f;
	font-size: 10px;
	margin: 0px 0px 0px 0px;
}

div.ImageContainer p
{
	/* Just center up and be small and black. */
	color: #000000;
	font-size: 10px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}

div.ImageContainer img
{
	/* This should conveniently be centered and look pretty. */
	margin: 0px auto 0px auto;
	border: solid 1px #0000FF;
	

	/*NOTE: IE does not support this property, but I have Javascript in place to resize */
	/*This is for those that are ultra careful and turn off javascript */
	/*Let's just assume for a second here that those are the same kind of people that would be using a standards compliant browser :) */
	/*Me? Well I use IE7 and leave javascript turned on - like 90% of the people out there. */
	max-width: 400px;
}
