body{ font-family: verdana, arial, sans-serif; padding: 0px; margin: 0px; font-size: .68em; background-color: #0A0030; }


/*defaults*/


html { min-height: 100%; }

a {
	outline: none;
}

#main #content #column2 a {
	color: #3366FF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #3366FF;
	padding-bottom: -5px;
}

#main #content #column2 a:hover {
	color: #000099;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #000099;
	padding-bottom: -5px;
}

a:hover { color: #999999; }

p { margin: 0px; padding: 0px 0px 16px 0px; line-height: 1.7em; color: #333333; }

ol { margin: 8px 0px 0px 24px; padding: 0px; }

ul {
	margin: 8px 0px 0px 5px;
	padding: 0px;
}


/*structural elements*/


#main, #links, #footer, #logo, #content #home { margin-left: auto;  margin-right: auto; }

#main{ width: 860px; color: #000033; background-color: #FFF; background-image: url(img/appearance/backgroundmain.gif); background-repeat: repeat-y; }
#home {
	width: 860px;
	color: #000033;
	background-color: #FFF;
	background-repeat: repeat-y;
	background-image: url(img/appearance/backgroundhome.gif);
}
  
#topborder {background-image: url(img/appearance/topborder.gif); height: 12px; }

#logo {
	width: 838px;
	height: 125px;
	text-align: left;
	background-color: #D8DBFF;
	margin-left: 12px;
	background-image: url(img/main_images/header.jpg);
	overflow: hidden;
	background-repeat: no-repeat;
}

#footer{
	height: 36px;
	font-size: 94%;
	padding-right: 0px;
	width: 860px;
	background-image: url(img/appearance/footer.gif);
	padding-top: 10px;
	background-repeat: no-repeat;
	background-color: #000033;
	display: block;
	clear: both;
}

#footer #f1 {float: right; padding-right: 20px;}

#footer #f2 {float: left; padding-left: 20px; text-transform: uppercase; }

#content {
	width: 840px;
	height: 500px;
	padding: 0px;
	overflow: hidden;
	clear: both;
} 

#column1 {
	width: 170px;
	float: right;
	padding: 0px 2px 15px 0px;
	height: auto;
	clear: both;
	display: block;
}

#column2 {
	text-align: justify;
	width: 620px;
	float: left;
	padding: 12px 3px 15px 19px;
	overflow: scroll;
	height: 450px;
}
#column2  clr {
	float: left;
}
#column2 div {
	padding: 0px;
	clear: both;
	float: left;
	width: 610px;
}
#homec2 {
	text-align: justify;
	width: 815px;
	float: left;
	padding: 10px 3px 15px 15px;
}

#logo {
	background-color: #D8DBFF;
}


/* Side nav */


#content, #column2 a, #column2 a:hover { background: transparent; color: #70695A; }
#column2  a   {
	padding: 0px;
	text-decoration: none;
	padding-bottom: 2px;
	color: #70695A;
}

#column2 a:hover { color: #0066FF; text-decoration: underline; }
#clr h1 {
	padding: 6px 0px 4px 0px;
	margin: 0px 0px 12px 0px;
	border-bottom: 1px solid;
	font-size: 150%;
	text-transform: uppercase;
	font-weight: normal;
}


/* headings */
h1{ font-family: arial, sans-serif; letter-spacing: .1em; }

h2 { margin: 0px; padding: 0px 0px 4px 0px; font-size: 100%; }

#logo h1 { margin: 0px; padding: 41px 0px 0px 19px; font-size: 150%; letter-spacing: .2em; color:#000000; }
#column2  li   {
	display: inline;
	padding-right: 20px;
	padding-left: 0px;
	margin: 0px;
	text-align: left;
}

#column2 h1 { padding: 6px 0px 4px 0px;  margin: 0px 0px 12px 0px; border-bottom: 1px solid; font-size: 150%; text-transform: uppercase; font-weight: normal;}

#column2 h2 {font-weight: bolder; text-transform: capitalize; font-size: 1.2em; font-variant: small-caps; padding-bottom: 7px; padding-top: 10px; }

#column2 p { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1em; font-weight: normal; padding: 5px; }
#column2 .thumb {
	border: 2px solid #000000;
	float: left;
	margin-bottom: 5px;
}
#column2 #lhsthumb {
	margin-right: 15px;
}
#homec2 .thumb {
	border: 2px solid #000000;
}
#main #home #content #clr {
	width: 600px;
	padding-top: 10px;
	padding-left: 20px;
}


/* image positioning - left, right and center */

.left { float: left; padding: 0px 8px 0px 0px; }

.right { float: right; padding: 0px 0px 0px 8px; }

.center { display: block; text-align: center; margin: 0 auto; }


.slhead{
	width: 182px;
	text-transform: uppercase;
	background-image: url(img/appearance/side.gif);
	float: left;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: 15px;
	margin: 0px;
}


/*sidebar*/

.sidelogo {
	width: 180px;
	float: left;
	height: 100px;
	background-image: url(img/main_images/logo_side.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	margin-bottom: 5px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-top-color: #333333;
	border-right-color: #333333;
	border-bottom-color: #333333;
	border-left-color: #333333;
}
.slhead h1 {
	text-transform: uppercase;
	background-image: url(img/appearance/side.gif);
	padding: 0px;
	margin: 0px;
	float: left;
	text-align: left;
	text-indent: 5px;
}

.slhead h1 {
	font-weight: normal;
	font-size: 110%;
	color: #FFFFFF;
}

.sidelinks {
	padding: 0px;
}

.sidelinks  li {
	margin: 0px auto;
	float: left;
	list-style: none;
	color: #666666;
	background-color: #C9CDFF;
} 

.sidelinks ul{
	margin: 0px auto;
} 
.sidelinks li a:hover {
	color: #666666;
	float: left;
	height: 16px;
	text-decoration: none;
	width: 162px;
	padding-right: 10px;
	padding-left: 10px;
	background-color: #F4F5FF;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #F4F5FF;
	border-left-color: #F4F5FF;
	padding-top: 2px;
	margin-bottom: 1px;
}

.sidelinks li a {
	color: #333333;
	float: left;
	height: 16px;
	text-decoration: none;
	width: 162px;
	padding-right: 10px;
	padding-left: 10px;
	background-color: #E8EAFE;
	border-top-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-left-style: solid;
	border-top-color: #F4F5FF;
	border-left-color: #F4F5FF;
	padding-top: 2px;
	margin-bottom: 1px;
} 
#colour_column2 {
	text-align: justify;
	width: 630px;
	float: left;
	height: 460px;
	padding-top: 12px;
	padding-right: 3px;
	padding-bottom: 15px;
	padding-left: 19px;
	display: block;
	overflow: scroll;
}
#colour_column2 table {
	border: 0px none #FFFFFF;
	width: 600px;
	text-align: center;
	height: 390px;
}
#colour_column2 img {
	border: 1px solid #000000;
}
#colour_column2 p {
	font-size: 16px;
	text-decoration: none;
}
#main #content #colour_column2 a {
	color: #70695A;
	text-transform: capitalize;
	font-variant: small-caps;
	text-decoration: none;
}
#main #content #colour_column2 a:hover {
	color: #0066FF;
}
#column2 table {
	float: left;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
#index {
	background-color: #FFFFFF;
	background-image: url(img/appearance/backgroundhome.gif);
}
#index  .thumb {
	border: 2px solid #000000;
}
#homec2 {
	text-align: justify;
	width: 620px;
	float: left;
	padding: 12px 3px 15px 19px;
}
#homec2 li {
	display: inline;
	padding-right: 30px;
	padding-left: 0px;
	margin: 0px;
	text-align: left;
}
#homec2 h1 {
	padding: 6px 0px 4px 0px;
	margin: 0px 0px 12px 0px;
	border-bottom: 1px solid;
	font-size: 150%;
	text-transform: uppercase;
	font-weight: normal;
}
#homec2 h2 {
	font-weight: bolder;
	text-transform: capitalize;
	font-size: 1.2em;
	font-variant: small-caps;
	padding-bottom: 7px;
	padding-top: 10px;
}
#homec2 p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: normal;
	padding: 5px;
}

/*menu*/
/* Add a margin - for this demo only - and a relative position with a high z-index to make it appear over any element below */

.mainnav/* Get rid of the margin, padding and bullets in the unordered lists */
 {
	padding:0;
	margin:0 auto;
	list-style-type: none;
	display:block;
	background-image: url(img/appearance/nav_img/pro_drop4_back.gif);
	background-repeat: repeat-x;
	background-color: #FFFFFF;
}
.mainnav ul {padding:0; margin:0; list-style-type: none; display:block;}

/* Hide the sub levels */
.mainnav li ul {display:none;}

/* Set up the link size, color and borders */
.mainnav li a, .mainnav li a:visited {
	display:block;
	font-size:11px;
	height:25px;
	line-height:24px;
	text-decoration:none;
	text-indent:5px;
	text-align:left;
}

/* Set up the sub level borders */
.mainnav li ul li a, #mainnav li ul li a:visited {border-width:0 1px 1px 1px;}

.mainnav li a.enclose, #mainnav li a.enclose:visited {border-width:1px;}

/* Set up the list items */

.mainnav li {
	float:left;
	width: auto;
}
.mainnav .top ul li ul li {
	float:left;
	width: 115px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
}

.mainnav ul li {
	float:left;
	width: 103px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
}

.sublast {
	float:left;
	width: 103px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
	border-bottom-style: solid;
}

.preload1 {background: url(img/appearance/nav_img/pro_drop4_2a.gif);}

.preload1 {background: url(img/appearance/nav_img/pro_drop4_2b.gif);}

.mainnav {
	list-style:none;
	height:37px;
	position:relative;
	z-index:500;
	font-family:arial, verdana, sans-serif;
	background-image: url(img/appearance/nav_img/pro_drop4_back.gif);
	background-repeat: repeat-x;
	background-position: top;
	padding-top: 0;
	padding-right: 100px;
	padding-bottom: 2px;
	padding-left: 20px;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 50;
}
#menu {
	background-color: #FFFFFF;
	display: block;
	margin-left: 12px;
	margin-right: 12px;
}


.mainnav li.top {
	display:table-cell;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	background-image: url(img/appearance/nav_img/pro_drop4_back.gif);
	background-color: #FFFFFF;
}

.mainnav li a.top_link {
	display:table-cell;
	float:left;
	height:36px;
	line-height:27px;
	color:#595959;
	text-decoration:none;
	font-size:11px;
	font-weight:bold;
	padding:0 0 0 3px;
	cursor:pointer;
	background-image: url(img/appearance/nav_img/pro_drop4_0a.gif);
	background-repeat: no-repeat;
	width: auto;
}

.mainnav li a.top_link span {
	float:left;
	display:table-cell;
	padding:0 20px 0 10px;
	height:36px;
	background:url(img/appearance/nav_img/pro_drop4_0b.gif) right top;
}

.mainnav li a.top_link:hover {color:#000; background: url(img/appearance/nav_img/pro_drop4_2a.gif) no-repeat; line-height:25px;}

.mainnav li:hover > a.top_link {
	color:#333333;
	background: url(img/appearance/nav_img/pro_drop4_2a.gif) no-repeat;
	line-height:25px;
}

.mainnav li:hover > a.top_link span {background:url(img/appearance/nav_img/pro_drop4_2b.gif) no-repeat right top;}


/* For Non-IE browsers and IE7 */
.mainnav li:hover {position:relative;}
/* Make the hovered list color persist */

.mainnav li:hover > a {
	color:#FFFFFF;
	background-color: #000033;
}


.mainnav ul li > a {
	color:#CCCCCC;
}


.mainnav ul li:visited > a {
	color:#FFFFFF;
}


/* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */
.mainnav li:hover > ul {
	display:block;
	position:absolute;
	top:-9px;
	left:75px;
	padding:10px 30px 30px 30px;
	width:120px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}
/* Position the first sub level beneath the top level liinks */
.mainnav > li:hover > ul {
	left:-27px;
	top:26px;
}

/* get rid of the table */
.mainnav table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:100; font-size:1em;}

/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html .mainnav li a:hover {
	position:relative;
	color:#5D5D5D;
	background-color: #99CCFF;
}

/* For accessibility of the top level menu when tabbing */
.mainnav li a:active, #mainnav li a:focus {
	color:#5D5D5D;
	background-color: #99CCFF;
	text-decoration: none;
}
#mainnav li.sub {
	background-color: #6699FF;
	background-repeat: no-repeat;
	background-position: right center;
}


/* This lot is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear */

/* change the drop down levels from display:none; to visibility:hidden; */
* html .mainnav li ul {
	visibility:hidden;
	display:block;
	position:absolute;
	top:-11px;
	left:80px;
	padding:10px 30px 30px 30px;
	background:transparent;
}
.mainnav /* keep the third level+ hidden when you hover on first level link */
 li  a:hover  ul  ul{
visibility:hidden;
}


/* make the second level visible when hover on first level link and position it */
.mainnav li a:hover ul {
visibility:visible; left:-30px; top:14px; lef\t:-31px; to\p:15px;
}

/* make the third level visible when you hover over second level link and position it and all further levels */
.mainnav li a:hover ul a:hover ul a{ 
visibility:visible; top:-11px; left:80px;
}

.mainnav table {border-collapse:collapse; width:0px; height:0; position:absolute; top:0px; left:0; }

.mainnav a:hover {visibility:visible; position:relative; z-index:200;}

.mainnav li:hover {
	position:relative;
	z-index:100;
}
/* If you can see the pattern in the above IE5.5 and IE6 style then you can add as many sub levels as you like */

/*menu*/




.mainnav li {
	color:#5D5D5D;
	background-color: #6E92E0;
}
.mainnav .subnav li {
	float:left;
	width: 100px;
}
#colour_column2 h1 {
	padding: 6px 0px 4px 0px;
	margin: 0px 0px 12px 0px;
	border-bottom: 1px solid;
	font-size: 150%;
	text-transform: uppercase;
	font-weight: normal;
}
#main #footer #f1 a {
	color: #001350;
	text-decoration: none;
}
#main #footer #f1 a:hover {
	color: #0066FF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #0066FF;
}
#main #content #colour_column2 a {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #7E786A;
}
#main #content #colour_column2 a:hover {
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #0033FF;
	text-decoration: none;
}
#main #content #column2 .clicklink a {
	color: #0066FF;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #0066FF;
	font-size: 12px;
	text-decoration: none;
}
#main #content #column2 .clicklink a:hover {
	color: #333333;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333333;
	font-size: 12px;
	text-decoration: none;
}
#main #content #column2 .pagelink a {
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #0099FF;
	font-size: 13px;
}
#main #content #column2 .pagelink a:hover {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #0099FF;
	font-size: 13px;
	text-decoration: none;
}