body
{
	background-color: #BAB6E9;
	font-family: Arial;
}

/* COLOUR USAGE:
I have not edited the colours in some of the edit tables etc but have left this for you to play with. 
Here is a run down of the colours I have used.
#BAB6E9 - The light purple that surrounds the website
#150065 - The dark purple used in the header
#040150 - Dark Purple used in the border - almost identical to header colour
Shades of purples and dark blues will work well. Red is a good contrasting colour.
 */


/* top navigation bar */
.mainmenu {
	text-align: center;
	margin-bottom: 0px;
	margin-top: 7px;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	color: #FFFFFF;
}

/* sets the colour of "borders" borders are actually individual cells - */
.borders {
	background-color: #040150;
}

/* styles relating to tabs -  these have been added and new classes added*/
.tabunsel {
	color: white;
	}

.menuarea
	{
	background-image: url(images/spider-sites-bottom-header.jpg);
	background-position: right;
	background-repeat: no-repeat;
	background-color: #150065;
}
	
.unseltab {
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	color: #FFFFFF;
	text-decoration: none;
	color: white;
	background-image: url(images/website-bar-red.jpg);
	background-position: center;
	background-repeat: repeat;

}


.navtabs {
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	color: #FFFFFF;
	text-decoration: none;
	display: inline;
	height: 100%;
}

.seltab {
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	color: #FFFFFF;
	text-decoration: none;
	background-image: url(images/website-barblue.jpg);
	background-position: center;
	background-repeat: repeat;
}

.seltab a {
	color: white;
	text-decoration:none
}

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

.unseltab a {
	color: white;
	text-decoration:none
}

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

/* top navigation bar !!!NOT USING!!! */
.topnavbar {
	background-color: #000000;
	color: #FFFFFF;
}

/* content window THIS HAS BEEN EDITED TO MATCH DESIGN*/
.content {
	background-color: white;
}

/* left navigation window (now has been edited)*/
.leftnav {
	background-image: url(images/website-nav.jpg);
	height: 598px;
}

/* left button settings - button nested in background so text can be written over it - 
button has been split in three (by three cells) - the centre cell is for the text - 
the two surrounding cells (button 1 and 3) stop the text from going over the sides pre*/
.button1 {
	background: url(images/web-button_01.gif) no-repeat right;
	height: 55px;
	width: 55px;
	color: white;
	font-size: 12px;
	text-align: left;
	vertical-align: middle;
}

.button2 {
	background: url(images/web-button_02.gif) no-repeat left;
	height: 55px;
	width: 87px;
	color: white;
	font-size: 12px;
	text-align: left;
	vertical-align: middle;
}

/* left button setting appearence of link text */
.button2 a {
	color: #FFFFFF;
	text-decoration: none;
}

.button2 a:hover {
	text-decoration: underline;
}

.button3 {
	background: url(images/web-button_03.gif) no-repeat left;
	height: 55px;
	width: 38px;
	color: white;
	font-size: 12px;
	text-align: left;
	vertical-align: middle;
}

/* title window */
.title
{
	background-color: #000000;
	font-family: Arial;
}
	
.Menutitle {
	font-family: Arial;
	font-size: 14px;
	color: #FF0C08;
}

.content {
	font:Arial, Helvetica, sans-serif;
	padding:20px;
}


/* headers for content */
.content H1 {
	color: #040150;
	font:Arial;
	background:background-color:#0000FF;
	font-size:24px;
}


.content H2 {
	color: #8080FF;
	font:Arial;
	background:background-color:#0000FF;
	font-size:18px;
}

.content H3 {
	font:Arial;
	background:background-color:#0000FF;
	font-size:14px;
}

/*each of the standard tags in .content should have a style */

/* links in footers */
.footer {
	background-color: #040150;
	color: white;
	font: 10pt;
}
.footer a {
	color: #FFDE14;
}

/* styles for statistics - tree */
.tree .branch {
	font-family: Arial;
	font-size: 12px;
	width: 100%;
	color: #FFFFFF;
	background-color: #DE0000;
	border-color: #150065;
	border: solid;
	border-width: 1px;
}

.tree .branch a {
	font-weight: bold;
	text-decoration: none;
	color: #FFFFFF;
	border-top-style: none;
}


.tree .leaves {
	display: none;
	border-color: #000000;
	border: solid;
	border-width: 1px;
	background-color:#150065;;
	color: #FFEB0C;
}

.leaves a{
	color:#FFFFFF;
}

.leaves a:visited{
	color:#DE0000;
}

/* standard table */
.datatable th {
	color: #FFFFFF;
	background-color: #DE0000;
}

.datatable td {
	background-color:#150065 ;
	color: #FFFFFF;
}

/* edit window table */
.edittable th {
	color: #FFFFFF;
	background-color: #DE0000;
	font-size:12px;
}

.edittable td {
	background-color:#150065 ;
	color: #FFFFFF;
	font-size:12px;

}

.selected{
	background-color:#CC0000;
	color:white;
	display:inline;
	padding:3px;

}

.editheader {
	background-color:#150065;
	color:#FFFFFF;
	
}

.editheader a{
	color: #FFFFFF;
	font-size:20px;
	font-weight:bold;
	text-decoration:none;

}

.editheader a:hover {
	text-decoration:underline;
}
.webnavbottom {
	background-image:url(images/website-nav-bottom-bg.jpg)
}

.contentborderleft{
	background-image:url(images/content-border-left.jpg)
}

.contentborderright{
	background-image:url(images/content-border-right.jpg)
}

.formcaption {
	color:#150065;
}