/* Heading Related */
.Heading
{
    left: 5%;
    /* Right 49px lined up with the darkened background image */
    /*right : 49px;*/
    right : 0px;
    position: absolute;
    top: 0%;
    height: 10%;
    vertical-align: middle;
    background-color: black;
    text-align: center;
    z-index: 10;
    /*width: 90%;*/
}

/* The filler supports cross browser compatability */
/* IE seems to need a width specified, if one isn;t then it only expands the content area to the required
visible space. FF on the other hand will work out the width if all of the edges are defined. */
/*.HeadingFiller
{
    width : 100%;
    height : 66px;
    vertical-align : middle;
}*/


.HeadingBackgroundImage
{
    position :inherit;
    top : 16px;
    left : 0%;
    right : 0%;
    bottom : 20%;
    z-index: 11;
}

/* Background Releated */
/*
.BackImage
{
    z-index: 1;
    right: 0px;
    position: absolute;
    bottom: 0px;
    overflow: hidden;
}
.BottomRight
{
    z-index: 2;
    right: 0px;
    position: absolute;
    bottom: 0px;
    overflow: hidden; 
}
.BottomLeft
{
    z-index: 2;
    right: 49px;
    position: absolute;
    bottom: 0px;
    overflow: hidden; 
}
*/

/* Body Related */
.MainBody
{
	z-index: 10;
	left: 12%; /*width: 85%;*/;
	position: absolute;
	top: 10%; /*height: 80%;*/;
	bottom: 41px;
	
	overflow: scroll;
	color: black;
	font-family: Arial;
	
	width : 88%;
    height : 90%;

	
}
.BodyFiller
{
	position: absolute;
	right: 49px;
	left: 0px;
	
	font-size: 100%;
}

.LeftSideLinks
{
    z-index: 5;
    left : 0px;
    position: absolute;
    top : 20%;
    width : 10%;
    height : 50%;
}

.LeftColourBar
{
	z-index: 1;
	left : 5%;
	position: absolute;
	top : 15%;
	width : 2%;
	height : 85%;
	background-color: black;
}

.LeftColourBar1
{
	z-index: 1;
	left : 3%;
	position: absolute;
	top : 0%;
	width : 2%;
	height : 85%;
	background-color: black;
}


.LeftColourBarLight
{
	z-index: 0;
	left : 0%;
	position: absolute;
	top : 0%;
	width : 18%;
	height : 100%;
	background-color: #F1F5F8;
}
.LeftColourBarDarker
{
	z-index: 0;
	left : 0%;
	position: absolute;
	top : 0%;
	width : 5%;
	height : 100%;
	background-color: #E2E6E9;
}




.BackgroundOverLay
{
    z-index: 3;
    left: 0px;
    width: 100%;
    position: absolute;
    top: 0px;
    height: 100%;
}


.button
{
	background-image: url('smallToggelRight.jpg'); 
	background-attachment: fixed; 
	border: medium #000000 double; 
	background: url('smallToggelRight.jpg') no-repeat fixed center; 
	background-position: center; 
	height: 35px; 
	text-align: center; 
	font-weight: bold; 
	font-family: 'Courier New', Courier, monospace;
}

.link
{
	text-decoration: none;
	color: #000099;
	font-weight: bold;
}
.link:hover
{
	background-color: #000000;
	color: #FFFFFF;
	font-size: 110%;
	letter-spacing: 0.2em;
	line-height: 110%;

}


.buttonBackground
{
	background-image: url('smallToggelRight.jpg'); 
}


a {
	text-decoration: none;
	color: #FF0000;
	font-weight: bold;
}
a:hover {
	background-color: #000000;
	color: #FFFFFF;
}


.adUnit {
	background-color: #000000;
	width: 100%;
	text-align: center;
}



.firefoxAd {
	position: absolute;
	z-index: 0;
	top: 1%;
	left: 4%;
	vertical-align: middle;
	text-align: center;
}

.GoogleSearch {
	position: absolute;
	z-index: 11;
	top: 1%;
	right: 1%;
	vertical-align: middle;
	text-align: center;
}


font {
	font-family: Arial, Helvetica, sans-serif;
}

h1 {
	text-align: left;
	width: 100%;
	left: 0%;
	position: relative;
	font-family: "Courier New", Courier, monospace;
	font-size: large;
	font-weight: normal;
	background-color: #333333;
	color: #FFFFFF;
}