body, html
{
	margin: 0px;
	padding: 0px;
	background: #2b57ac;
	min-width: 800px;
}

/* The header
---------------------------------------------------------------------------- */

#header
{
	display: block;
	position: absolute;

	min-width: 800px;
	height: 277px;
	width: 100%;

	margin: 0 auto;
	padding: 0px;
}

#header img#image
{
	width: 100%;
	position: absolute;
	border: 0px;
}

#header img#title
{
	behavior: url("../../behavior/pngbehavior.htc");
	z-index: 1;
	border: 0px;
	float: right;
	position: relative;
	display: block;
}

/* The menubar
---------------------------------------------------------------------------- */

#menubar
{
	position: absolute;
	top: 277px;
	left: 0px;

	display: block;
	height: 38px;
	width: 100%;
	min-width: 1000px;

	background: url("./images/button_bg_inactive.png") repeat-x;	
}

#menubar div.wrapper
{
	height: 38px;
	width: 1000px;
}

#menubar img
{
	float: left;
}

#menubar span#active
{
	display: block;
	float: left;
	
	height: 15px;
	width: 199px;
	background: url("./images/button_bg_active.png");	

	font: normal 15px/15px Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 0 auto;
	color: white;
	
	padding: 10px 0px 13px 0px;	
	text-decoration: none;
}

#menubar a
{
	display: block;
	float: left;

	height: 15px;
	width: 199px;
	background: url("./images/button_bg_normal.png");	

	font: normal 15px/15px Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 0 auto;
	color: #194663;
	
	padding: 10px 0px 13px 0px;	
	text-decoration: none;
}

#menubar a:hover
{
	display: block;
	float: left;

	height: 15px;
	width: 199px;
	background: url("./images/button_bg_hover.png");	

	font: normal 15px/15px Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 0 auto;
	color: #020f26;
	
	padding: 10px 0px 13px 0px;	
	text-decoration: none;
}

/* The menubar dropshadow
---------------------------------------------------------------------------- */

#drop
{
	position: absolute;
	top: 315px;
	left: 0px;

	display: block;
	height: 15px;
	min-width: 800px;
	width: 100%;
}

#drop img#shadow
{
	behavior: url("../../behavior/pngbehavior.htc");
	width: 100%;
	height: 15px;

	position: absolute;
	top: 0px;
	left:0px;
}

#drop img.active
{
	behavior: url("../../behavior/pngbehavior.htc");
	width: 199px;
	height: 15px;
}


img#link1
{
	position: absolute;
	top: 0px;
	left:0px;
}

img#link2
{
	position: absolute;
	top: 0px;
	left: 200px;
}

img#link3
{
	position: absolute;
	top: 0px;
	left: 400px;
}


img#link4
{
	position: absolute;
	top: 0px;
	left: 600px;
}

img#link5
{
	position: absolute;
	top: 0px;
	left: 800px;
}


/* CALENDAR
---------------------------------------------------------------------------- */

#googleCalendar
{
	width: 95%;
	position: absolute;
	
	margin: 30px auto;
	text-align: center;
	padding: 310px 2.5% 30px 2.5%;
	
	z-index: -1;
}

/* FORMATTING - The content
---------------------------------------------------------------------------- */

span.look, a span.look
{
	color: black;
	font-weight: normal;
	text-decoration: none;
}

span.look span.opp, a span.look span.opp
{
	color: #580002;
	font-weight: bold;
}

#content
{
	margin: 310px 50px;
	padding: 50px;

	position: absolute;
	
	color: white;
	font: normal 12pt/15pt Verdana, Arial, Helvetica, sans-serif;
}

#content img.png
{
	behavior: url("../../behavior/pngbehavior.htc");
}

#content p.full
{
	clear: both;
}

.post
{
	/* used for each new posting, except maybe the bottom one */
	margin: 0px 0px 50px 0px;
	padding: 0px 0px 50px 0px;
	
	border: 1px solid #1A3265;
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
}


h1
{
	font: normal 18pt/20pt Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: white;
}

h1.space
{
	margin: 60px 0px 0px 0px;
}

a
{
	color: #4E87FE;
	text-decoration: none;
}

a:hover
{
	color: white;
	text-decoration: underline;
}

a:visited
{
	color: #A9C1FD;
	text-decoration: none;
}

a:visited:hover
{
	color: #CDDAFC;
	text-decoration: underline;
}

h1 span.date
{
	display: block;
	position: relative;

	font: normal 10pt/12pt Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #122346;
}

ul.clean
{
	padding: 0px 0px 30px 0px;
}

ul.clean li
{
	list-style: none;
	padding: 0px 20px 10px 0px;
	float: left;
}

ul.credit
{
	padding: 0px 0px 30px 0px;
}

ul.credit li
{
	margin: 0px 20px 30px 30px;
}

ul.credit li p
{
	margin: 0px 20px 0px 0px;
	font: normal 9pt/10pt Verdana, Arial, Helvetica, sans-serif;	
}


/* Sections - used for Home to explain Web development cycle
---------------------------------------------------------------------------- */

.section
{
	clear: both;
}

.section .figure
{
	float: left;
	width: 240px;
}

.section .figure img
{
	behavior: url("../../behavior/pngbehavior.htc");
}

.section h1
{
	padding: 30px 0px 0px 0px;
}

/* Contact: Nintendo DS Game Code styles */

div#johanhwb
{
	width: 80%;
	margin: 20px 20px 20px 30px;
	padding: 20px 20px 35px 20px;
	position: absolute;
	top: 319px;
	left: 0;
}

div#friendCodes
{
	width: 460px;
	float: right;
	background: #3A69C9;
	margin: 20px 20px 20px 30px;
	padding: 20px 20px 35px 20px;
	border: solid #75C2FE 1px;
}

h1.gameTitle
{
	padding: 0px;
	margin: 0px 0px 3px 0px;
	font: normal 12pt/14pt Verdana, Arial, Helvetica, sans-serif;	
}

.details
{
	padding: 0px;
	margin: 0px;
	font: normal 9pt/11pt monospace, Verdana, Arial, Helvetica, sans-serif;	
}