﻿/*
	Set all tags to have no margin/padding
	can be overridden for tags that needs it
*/
*
{
	margin: 0px;
	padding: 0px;
}


/*
	Set the background image for the page
*/
body 
{
	line-height: 170%;
	background-image: url(images/bgn.gif);
	font: 82%/normal "Microsoft Sans Serif", "MS Sans Serif", "Tahoma", sans-serif;
}


/*
	The Outer container, should be centered
*/
#OuterContainer
{
	width: 770px;
	background-color: Black;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/*
	The Inner container, should also be centered, 
	but the text should be left aligned
*/
#InnerContainer
{
	width: 764px;
	background-color: White;
	margin: 0 auto;	
	text-align: left;
	background-image: url(images/bgline.gif);
	background-repeat: repeat-y;
}


/*
	Add the header image, that also contains the background for the menu
*/
#Header
{
	background-color: Black;
	height: 125px;
	background: url(images/header-half.jpg);
	background-repeat: no-repeat;
	background-position: center;
}


/*
	Wraps the Content + right column 
*/
#ContentWrapper
{
	float: left;
	width: 100%;
}


/*
	The Content column
*/
#ContentColumn
{
	margin-right: 150px;
	padding: 5px;	
}


/*
	The right column
*/
#RightColumn
{
	float: left;
	width: 150px;
	margin-left: -150px;
}


/*
	The main content, add some padding so we dont align 
	the text right at the border
*/
#MainContent
{
	padding: 5px;
}


/*
	The content to the right side, also add som padding
*/
#RightContent
{
	padding: 5px;	
}


/*
	Clear the float in the footer
*/
#Footer
{
	clear: left;
	width: 100%;
	background: black;
	padding: 4px 0;
	color: White;
	font: 82%/normal "Microsoft Sans Serif", "MS Sans Serif", "Tahoma", sans-serif;
}


/*
	The menu items, using a list for them, so they 
	need to be split up in into one line, reallt messy
	but it works crossbrowser atleast
*/
#Menu
{
	width: 500px;
	position: absolute;
	top: 95px;
	margin: 0 0 0 20px;
	font-size: 13px;
}

#Menu ul 
{
	list-style: none;
	height: 30px;	
}

#Menu li
{
	display: inline;
	line-height: 24px;	
}

#Menu a
{
	border-bottom: 0;
	padding: 0 0 0 4px;
	float: left;
	display: block;
	color: #FFFFFF;
	text-align: center;
	text-decoration: none;	
}

#Menu a span
{
	cursor: pointer;
	padding: 0 12px 0 8px;
	float: left;
	display: block;
	color: #FFFFFF;
	text-align: center;
	text-decoration: none;	
}

#Menu li.selected a
{
	margin: 0;
	background: url(images/nav-curve-active-bl.gif) no-repeat bottom left #465D65;
	text-decoration: none;	
}

#Menu li.selected a span 
{
	margin: 0;
	background: url(images/nav-curve-active-br.gif) no-repeat bottom right #465D65;
	text-decoration: none;
}

#Menu a:hover, #Menu a:active {
	background: url(images/nav-curve-bl.gif) no-repeat bottom left #EFAD79;
}

#Menu a:hover span, #Menu a:active span {
	background: url(images/nav-curve-br.gif) no-repeat bottom right #EFAD79;
}

/*
	We dont want the blue border around images
*/
img
{
	border: 0px;
	border-style: none;	
}


/*
	Set the footer link styles
*/
#Footer a, #Footer a:active, #Footer a:link, #Footer a:visited 
{
	text-decoration: none;
	color: White;	
}

#Footer a:hover
{
	text-decoration: underline;
	color: #F48700;
}



