/* ZONES MANAGEMENT - ON FRONT MENU ************************************** */

#frontMenuZone {
	width:700px;
	background-color: #003366;
	border: 2px solid #99CCFF;
	text-align: center;
	vertical-align: middle;
	padding: 0px;
	font-weight: normal;
	height:350px;
	background-image: url(../images/front-menu1.jpg);
	background-repeat: no-repeat;
	margin-top: 50px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
	}

#frontMenuZone ul {
	list-style-image: none;
	list-style-type: none;
	width: 600px;
	margin: 250px 0px 0px;
}

#frontMenuZone li {
	float: left;
	padding: 0px;
	margin: 5px 20px;
	list-style-image: none;
	list-style-type: none;
	width: 150px;
	
}

#frontMenuZone a, #frontMenuZone a:visited {
	float: left;
	display: block;
	background-color: #FFFFFF;
	text-decoration: none;
	font-size: 12px;
	padding: 4px 10px;
	width: 130px;
	border: 1px solid #000000;
}

#frontMenuZone a:hover {
	float: left;
	background-color: #000000;
	border: 1px solid #FFFFFF;

}
/* *************************************************************************** */

/* ZONES MANAGEMENT - IN THE PAGE ************ For styling, this could be <li><a></a></li> or just a drop down box 
/* depending on selectors in the KEYVARS */
#pageZoneBox {
	margin-left: 1em;
	padding: 0em;
	display: block;
	clear: both;
	float: none;
	margin-top: 0em;
	margin-right: 0em;
	margin-bottom: 0em;
}

#pageZoneBox h6 {
color:#FFFFFF;
}

#pageZoneBox ul {
	margin: 0em;
	padding: 0em;
	width: 100%;
	list-style-type:none;
	list-style-image: none;
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#pageZoneBox li {
	float:left;
	position:relative;
	display: inline;
	text-align: center;
	list-style-type:none;
	list-style-image: none;
	}

#pageZoneBox a, #pageZoneBox a:visited {
	background-color:#DDDDDD;
	color: #666666;
	padding-left: 1em;
	padding-right: 1em;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	margin-left:0.2em;
	float:left;
	display: block;
	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-bottom-style: none;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #666666;
	border-bottom-color: #666666;
	border-left-color: #666666;
}

#pageZoneBox a:hover {
	background-color:#999999;
	color: #CCCCCC;
	text-decoration: none;
	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-bottom-style: none;
	border-left-style: solid;
	border-top-color: #003366;
	border-right-color: #003366;
	border-bottom-color: #003366;
	border-left-color: #003366;
}


/* *************************************************************************** */


/* BRANDING */
#branding {
	position:absolute;
	top: 0px;
	left: 0px;
	background-color: #FFFFFF;
	width: 293px;
	height: 158px;
}
/* ****************************** END OF BRANDING ********************************** */






/* LOG IN BOXs */
#loginBox {
	width: 50%;
	padding: 2%;
	background-color: #FFFFFF;
	border-top: 1px solid #000000;
	border-right: 3px ridge #666666;
	border-bottom: 3px groove #666666;
	border-left: 1px solid #000000;
	line-height: normal;
	margin-left: 15%;
	}
	
	
/* *************************************************************************** */

/* UNIQUELY PASSWORD PROTECTED PAGES */
#uniqueProtected {
	background-color:#003366;
	height: 60%;
	color: #FFFFFF;
	margin: 5% 25% 20%;
	padding: 10%;
	width: 30%;
	border-top-width: 6px;
	border-right-width: 6px;
	border-bottom-width: 6px;
	border-left-width: 6px;
	border-right-style: solid;
	border-bottom-style: solid;
	border-top-color: #999999;
	border-right-color: #999999;
	border-bottom-color: #999999;
	border-left-color: #999999;
	}
/* *************************************************************************** */


/* BREADCRUMBS */
#breadcrumbs {
	text-align: left;
	margin: 5px 1%;
	padding: 0px 0px 0px 5px;
	width: 98%;
	border: 1px dotted #999999;
	font-size: xx-small;
	font-weight: bold;
	background-color: #EEEEEE;
	line-height: 10px;
}
/* *************************************************************************** */


/* MAIN CONTENT FOR INDEX PAGE */
#pageRight {
	width: 15em;
	float: right;
	text-align: left;
	margin: 5px 1% 5px 0px;
	padding: 2px;
	min-height: 500px;
	border: 1px dotted #999999;

}
/* *************************************************************************** */


/* MAIN CONTENT FOR INDEX PAGE (IF DIFFERENT) */
#mainPageContentIndex, #mainPageContent {
	position:absolute;
	top: 175px;
	left: 300px;
	width: 430px;
	min-height: 500px;
	background-color:#FFFFFF;
}
/* *************************************************************************** */


/* PAGE TEXT */
#pageText {
	padding: 5px;;
}

/* PAGE TEXT TWO */
#pageTextTwo {
	position:absolute;
	top: 175px;
	right: 0px;
	width: 247px;
}



/* PAGE LINKS */
#pageLinks {
	position:absolute;
	top: 510px;
	right: 0px;
	margin: 0px;
	padding: 0px;
	width: 220px;
}

#pageLinks ul {
padding: 0px;
margin: 0px;
}

#pageLinks li {
	list-style-image: none;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 7px;
	list-style-type: none;
	width: 200px;
	height: 25px;
	text-align: center;
}
#pageLinks a, #pageLinks a:visited {
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	width: 180px;
	height: 15px;
	line-height: 15px;
	display:block;
	font-weight: bold;
	font-size: 120%;
	color: #294970;
	background-image: url(../images/pagelinksBG.jpg);
	background-repeat: no-repeat;
	border:#999999 solid 1px;
	}

#pageLinks a:hover {
	color: #294970;
	text-decoration: none;	
}
/* ****************************** END OF PAGE LINKS ********************************** */






/* OWNERSHIP */
#ownerFooter {
	margin: 10px 0px 0px;
	padding: 5px;
	height: auto;
	width: 188px;
	background-image: url(../images/BoxBG.jpg);
	background-repeat: repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: normal;
	color: #666666;
	border: 1px solid #666666;
	background-color: #FFFFFF;
}
/* ****************************** END OF OWNERSHIP********************************** */


/* BABEL FISH */
#babelFish {
	position: absolute;
	left: 30px;
	top: 200px;
	margin: 0px;
	padding: 5px;
	width: 130px;
	background-image: url(../images/BoxBG.jpg);
	background-repeat: repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: normal;
	color: #666666;
	border: 1px solid #666666;
	background-color: #FFFFFF;
}
/* ****************************** END OF BABEL FISH ********************************** */



/* MARQUEE BANNER */
#marqueeBanner {
	padding: 3px;
	width: 460px;
	height: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	font-weight: normal;
	color: #003366;
	border: 1px solid #FFFFFF;
	clear: both;
	float:left;
	margin-top: 33px;
	margin-right: 9px;
	margin-bottom: 0px;
	margin-left: 220px;
	background-color: #CCCCFF;
}

#marqueeBanner ul {
	padding:0px;
	margin:0px
}

#marqueeBanner li {
	overflow: auto;
	/* overflow-style: marquee;
	white-space: nowrap;
	marquee-loop: infinite;
	marquee-style: scroll;
	marquee-direction: reverse;
	marquee-speed: slow; /* [normal][fast] */
	list-style-image: none;
	list-style-type: none;
	height: 2.5em;
}
/* ****************************** END OF MARQUEE BANNER ********************************** */





/* PAGE IMAGES */
#pageImages {
	position:absolute;
	top: 165px;
	left: 0px;
	width: 229px;
}

.pageImagesEach {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
/* ****************************** END OF PAGE IMAGES ********************************** */





/* GRAPHIC BANNER */
#graphicBanner {
	position: absolute;
	right: 0px;
	top: 0px;
	background-color: #CCCCCC;
	width: 706px;
	height: 134px;
}
/* ****************************** END OF BRANDING ********************************** */



/* ****************************** FULL STYLE IS BELOW ******************************** */
/* *************************** THIS IS JUST THE HOLDING DIV*************************** */




/* STYLE MANAGEMENT */
#styleManagement {
	position: absolute;
	left: 800px;
	top: 80px;
	background-color: #FFFFFF;
	width: 95px;
	min-height: 38px;
	padding: 3px;
	margin: 2px;
	border: 1px solid #000000;
	overflow: auto;
}
/* ************************** END OF STYLE MANAGEMENT ***************************** */




/* TEXT SIZE MANAGEMENT */
#textSizeManagement {
	position: absolute;
	left: 905px;
	top: 80px;
	background-color: #FFFFFF;
	width: 87px;
	min-height: 38px;
	padding: 3px;
	margin: 2px;
	border: 1px solid #000000;
	overflow: auto;
}

#textSizeManagement .formButton, #textSizeManagement .resetButton {
	font-size: 90%;
	color: #000000;
	padding: 0px;
	background-color: #E8E8E8;
	border: 1px solid #333333;
	float: left;
	display: inline;
	min-width:18px;
	margin: 1px;
}

#textSizeManagement .resetButton {
	font-size: 90%;
	min-width: 38px;
}
/* ************************** END OF TEXT SIZE MANAGEMENT ***************************** */



/* SEARCH */
#search {
	font-size:85%;
	float: right;
	width: 20em;
	background-color: #003366;
	color: #FFFFFF;
	height: 3.8em;
	margin-top: 5.3em;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0em;
	padding-right: 0.5em;
	padding-bottom: 0em;
	padding-left: 0.5em;
}


.searchTerm {
	color:#003366;
	width: 17em;
	height: 1.8em;
	line-height: 1.8em;
	font-size:90%;
	
}

.searchButton {
	position: relative;
	left: -2px;
	top: -1px;
	right: 0px;
	bottom: 0px;
	font-size: xx-small;
	color: #FFFFFF;
	background-color: #003366;
	margin: 0px;
	padding: 0px;
	height: 2em;
	border: 1px solid #FFFFFF;
}

.searchResultBox {
	margin: -1px 2px 2px;
	padding: 10px 3px 2px 14px;
	display: block;
	background-color: #EFEFEF;
	font-weight: normal;
	border-top: 1px solid #EFEFEF;
	border-right: 2px solid #CCCCCC;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #000000;
}

a.searchResultLink:link, a.searchResultLink:visited, a.searchResultLink:hover {
	text-decoration: none;
	color: #003366;
	font-weight: bold;
}
a.searchResultLink:hover {
	text-decoration: underline;
}




/* ****************************** END OF SEARCH ********************************** */




/* AD BANNER */
#addBanners {
	position:absolute;
	top: 500px;
	left: 0px;
	width: 292px;
	text-align: center;
}

.addBannersEach {
	margin: 0px;
	margin-top:15px;
	width: 150px;
	border: 1px solid #999999;
}
/* ****************************** END OF AD BANNERS ******************************* */




/* FLASH BANNER */
#flashBanner {
	position: absolute;
	right: 0px;
	top: 0px;
	background-color: #AAAAAA;
	width: 480px;
	height: 60px;
	border: 1px solid #CCCCCC;
}
/* ****************************** END OF AD BANNERS ******************************* */


















/* *************************************************************************** */
.buttonContainerBox {
	margin: 0px;
	padding: 2px;
	height: auto;
	float: left;
	display: inline;
	width: 75px;
}

a.miniButton:link, a.miniButton:visited, a.miniButton:hover {
	background-color: #CCCCCC;
	display: block;
	font-size: xx-small;
	text-decoration: none;
	color: #000000;
	border: 1px solid #999999;
	text-align: center;
	padding: 0px;
	height: auto;
	margin-top: -1px;
	margin-right: -1px;
	margin-bottom: 0px;
	margin-left: -1px;
	width: 100%;
}
a.miniButton:hover {
	background-color: #EEEEEE;
}
/* *************************************************************************** */























/* **************************************************************************** */
/* **************************************************************************** */
/*								MODULE SPECIFIC									*/
/* **************************************************************************** */
/* **************************************************************************** */




/* RECRUITMENT ****************************************************************** */
a.jobCatButton:link, a.jobCatButton:visited, a.jobCatButton:hover {
	font-size: xx-small;
	text-decoration: none;
	color: #000000;
	text-align: center;
	padding: 0px;
	height: auto;
	margin-top: -1px;
	margin-right: -1px;
	margin-bottom: 0px;
	margin-left: -1px;
	border-top: none;
	border-right: none;
	border-bottom: none;
	border-left: none;
	display: block;	
}
a.jobCatButton:hover {
	background-color: #EEEEEE;
	color: #666666;
}


a.fullDetailsButton:link, a.fullDetailsButton:visited, a.fullDetailsButton:hover {
	font-size: xx-small;
	text-decoration: none;
	color: #FFFFFF;
	text-align: center;
	padding: 2px;
	height: auto;
	display: block;
	margin: 3px 7px;
	width: auto;
	background-color: #006600;
	border: 1px solid #006600;
}
a.fullDetailsButton:hover {
	background-color: #EEEEEE;
	border: 1px solid #006600;
	color: #006600;
}



/* RECRUITMENT //////////////////////////////////////////////////////////////// */

/* This is the box that contains the 'End Date' 'Salary' 'Job Ref' Sorting boxes */
.recruitmentSortBox {
	width: 60px;
	display: inline;
	float: left;
}

/* When listing the job, this is one of the boxes to hold the overview job info*/
.recruitmentBoxB {
	margin: 3px 10px;
	width:auto;
	padding: 5px;
	height: auto;
	float: none;
	border: 1px dashed #BBBBBB;
	clear: both;
	background-color: #EEEEEE;
}

/* When listing the job, this is one of the boxes to hold the overview job info - it is the same as ".recruitmentBox" but usually a different colour. */
.recruitmentBoxBB {
	margin: 3px 10px;
	width:auto;
	padding: 5px;
	height: auto;
	float: none;
	border: 1px dashed #BBBBBB;
	clear: both;
	background-color: #CCCCFF;
}

/* This is the box containing the shortDescription of the overview text for when the jobs are listed */
.recOverviewText {
	margin: 1%;
	width:60%;
	padding: 0%;
	height: auto;
	float: left;
	font-size: 85%;
	}

/* This is the box containing the "Click here for Full Details button and the job expiry and job ref text */
.recOverviewRef {
	margin: 1%;
	width: 32%;
	padding: 1%;
	height: auto;
	float: right;
	background-color: #DDDDDD;
	border: 1px solid #333333;
}
/* */
.recMainJob {
	margin: 0px 10px;
	width: auto;
	padding: 15px;
	height: auto;
	float: none;
	border: 1px dotted #666666;
	background-color: #EEEEEE;
	font-size: smaller;
	}

/* */
.recMainHeader {
	margin: 0px;
	padding: 10px;
	height: auto;
	background-color: #006600;
	color: #FFFFFF;
	font-size: large;
	border: 1px solid #FFFFFF;
	display: block;
	}

/* */
.recMainText {
	margin: 3px;
	width:65%;
	padding: 3px;
	height: auto;
	float: left;
	display: inline;
	display: inline;
	border-top: 1px none #666666;
	border-right: 1px dotted #666666;
	border-bottom: 1px none #666666;
	border-left: 1px none #666666;
	}

/* */
.recMainInfo {
	margin: 3px;
	width:28%;
	padding: 3px;
	height: auto;
	float: left;
	display: inline;
	display: inline;
	}
	
/* END OF RECRUITMENT ************************************************************ */



/* CLIENTS/PARTNERS ****************************************************************** */
.clientsBox {
	height: auto;
	float: left;
	display: inline;
	margin-top: 25px;
	margin-right: 10px;
	margin-bottom: 25px;
	margin-left: 25px;
	width: 40%;
	}

.clientsImageBox {
	height: auto;
	float: left;
	display: inline;
	width: 40%;
	margin: 0px 10px 10px 0px;
	}
	
.clientsTextBox {
	height: auto;
	float: left;
	display: inline;
	margin: 10px;
	width: 40%;
	}
/* END OF CLIENTS/PARTNERS ************************************************************ */


/* NEWS  ****************************************************************** */

/* This is the box containing the thumbnail on the main overveiw view */
.newsOverviewPicBox {
	margin: 3px 1px 0px 10px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	width: 100px;
	border: 1px solid #000000;
	}
/* This is the box containing the small headline and shortText on the main overveiw view */
.newsOverviewBox {
	margin: 3px 10px 0px 20px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	width: 500px;
	}

/* This is the box containing the headline in the actual news story */
.newsStoryHeadline {
	margin: 5px 5px 0px 15px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	width: 100%;
	}
	
/* This is the box containing the Actual News Text in the news story */
.newsStoryText {
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	width: 350px;
	margin-top: 20px;
	margin-right: 40px;
	margin-bottom: 20px;
	margin-left: 15px;
	}

/* This is the holding box containing the resized images in the actual news story */
.newsStoryHPicBox {
	margin: 5px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	}
	
/* This is the box containing the resized image in the actual news story */
.newsStoryPicBox {
	margin: 5px 5px 30px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	width: 250px;
	border: 1px solid #DDDDDD;
	}

/* This is the box containing the links to the documents in the actual news story */
.newsStoryDocBox {
	margin-left: 15px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	width: 650px;
	border: 1px solid #DDDDDD;
	}

a.newsTop:link, a.newsTop:visited, a.newsTop:hover {
	font-size: xx-small;
	text-decoration: none;
	color: #990000;
	text-align: right;
	float: right;
}
a.newsTop:hover {
	color: #000000;
}
/* END OF NEWS ************************************************************ */



/* DOCUMENTS  ****************************************************************** */
.docIconBox {
	margin: 3px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	}
	
.docOverviewBox {
	margin: 3px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	}
/* END OF DOCUMENTS ************************************************************ */



/* LINKS ****************************************************************** */

.linksBox {
	height: auto;
	float: left;
	display: inline;
	margin-top: 25px;
	margin-right: 1%;
	margin-bottom: 25px;
	margin-left: 1%;
	width: 46%;
	border: 1px solid #666666;
	background-image: url(../images/BoxBG.jpg);
	background-repeat: repeat-x;
	}
	
.linksIconBox {
	float: left;
	width: 50px;
	margin: 5px 0px 0px 5px;
}


.linksHeaderBox {
	margin: 15px 4px 0px 10px;
	float: left;
	font-size: 120%;
}
/* END OF LINKS ************************************************************ */




/* FORUM ****************************************************************** */
.forumFrame {
	margin: 0px;
	padding: 0px;
	float: none;
	height: 850px;
	width: 100%;
	border: 0px none #000000;
}
/* END OF FORUM ************************************************************ */





/* IMAGE GALLERY ****************************************************************** */



/* IMAGE GALLERY - This is the Icon in the overview when the categories are listed **************** */
.GalleryIconBox {
	margin: 3px;
	padding: 0px;
	height: auto;
	float: left;
	display: inline;
	}

/* IMAGE GALLERY - This is the Text in the overview when the categories are listed **************** */
.GalleryOverviewBox {
	margin: 3px;
	padding: 0px;
	height: auto;
	float: right;
	width: 400px;
	}

/* IMAGE GALLERY - This is the Box that holds the individual thumbnail */
.galleryBox {
	margin: 10px;
	padding: 0px;
	float: left;
	display: inline;
	width: 50px;
	border: 1px solid #EEEEEE;
	text-align: left;
}

/*  This is the box that holds all the thumbnails */
.thumbPicBox {
	margin: 5px;
	padding: 5px;
	width: 400px;
	border: 1px solid #00FF00;
	float:left;
}

/*  This is the BIG PIC on the page where the icons and the ibig pic are displayed. */
.mainPicBox {
	margin: 5px;
	padding: 0px;
	float: right;
	display: inline;
	width: 300px;
	text-align: left;
	border: 1px solid #DDDDDD;
	background-color: #EEEEEE;
}




/*  This is the class for the form box which has the ALT text in that is controlled by the JavaScript */
.pictureALT {
	border: 1px solid #EEEEEE;
	width: 290px;
	background-color: #EEEEEE;
	margin: 0px;
	padding: 3px;
	height: 75px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}
/* END OF IMAGE GALLERY ************************************************************ */





/* PERSONNEL ****************************************************************** */
.personnelBoxes {
	margin: 5px;
	padding: 5px;
	float: left;
	display: inline;
	width: 120px;
	/* border: 1px solid #33FF33; */
	text-align: center;
}

.personnelBoxes a, .personnelBoxes a:visited {
	text-decoration:none;
	color:#000000;
	font-weight: bold;
	font-size: 80%;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;	
	}

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

.personnelImageSmall {
	margin: 0px;
	padding: 0px;
	width: 100px;
	border: 1px solid #000000;
}

.personnelImageMain {
	margin: 0px;
	padding: 0px;
	float: right;
	display: inline;
	width: 125px;
	text-align: center;
}

.personnelDetailsMain {
	margin: 5px;
	padding: 0px;
	float: left;
	display: inline;
	width: 285px;
	text-align: left;
}
/* END OF PERSONNEL ************************************************************ */




/* CONTENT SLIDE ****************************************************************** */

.contentSlideHeader {
	margin-top: 10px;
	margin-bottom: 5px;
	}


.contentSlideHeader a, .contentSlideHeader a:hover, .contentSlideHeader a:visited  {
	font-size: 135%;
	color: #003366;
	text-decoration: none;
	}

.contentSlideText {
	display:none;
}

/* END OF CONTENT SLIDE ************************************************************ */







/* VIDEOS  ****************************************************************** */
#videoMenu {
	margin: 5px;
	padding: 5px;
	height: auto;
	float: left;
	font-size: 75%;
	display: inline;
	background-color: #DDDDDD;
	width: 250px;
	text-align: left;
	overflow: auto;
	min-height:300px;
}

#videoMenu a, #videoMenu a:visited, #videoMenu a:hover {
font-size: 120%;
}

#videoMenu ul {
	margin: 0px;
	padding: 0px;
}

#videoMenu li {
	list-style-type: none;
	list-style-image: none;
	margin: 0px;
	padding: 0px;
}

#videoContent {
	margin: 5px;
	padding: 5px;
	height: auto;
	float: left;
	display: inline;
	border: 1px dotted #CCCCCC;
	background-color: #F5F5F5;
	min-height:300px;
	line-height: 140%;
	font-size: 75%;	
}


/* END OF VIDEOS ************************************************************ */





/* HELP ****************************************************************** */

#helpBoxMenu {
	margin: 1%;
	padding: 1%;
	height: auto;
	float: left;
	background-color: #DDDDDD;
	width: 28%;
	text-align: left;
	overflow: auto;
	min-height:300px;
}
#helpBoxMenu ul {
	padding:0px;
	margin:0px;
	list-style-type:none;
}

#helpBoxMenu a, #helpBoxMenu a:visited, #helpBoxMenu a:hover {
font-size: 75%;
}

#helpBoxContent {
	width: 63%;
	margin: 1%;
	padding: 1%;
	height: auto;
	float: right;
	border: 1px dotted #CCCCCC;
	background-color: #F5F5F5;
	min-height:300px;
	line-height: 140%;
	font-size: 85%;	
}
/* HELP ****************************************************************** */



/* BESPOKE CONTENT INCLUDE *********************************************** */
#bespokeContentInclude {
	background-color: #FFCCFF;
	left: 400px;
	top: 400px;
	position: absolute;
	height: 400px;
	width: 300px;
}


/* BESPOKE CONTENT INCLUDE - END ***************************************** */






/* MEMBERS SIGN UP ******************************************************* */
#membersOverviewBox {

}


#membersLoginLink, #membersActivate, #membersForgotPW, #membersRegisterLink {
	margin: 5px;
	padding: 6px;
	float: left;
	width: 190px;
	border: 1px solid #666666;
	min-height: 160px;
	display: inline;
	background-image: url(../images/BoxBG.jpg);
	background-repeat: repeat-x;
}



#memberModules {
	float: left;
	margin-top:10px;
	width: 450px;
	padding: 10px;
	display: inline;
	border: 1px solid #DDDDDD;
	min-height: 300px;
}

#memberModulesNav {
	float: right;
	display: inline;
	background-image: url(../images/BoxBG.jpg);
	background-repeat: repeat-x;
	margin: 0px;
	margin-top:10px;
	padding: 5px;
	width: 150px;
	border: 1px solid #DDDDDD;
	min-height: 300px;
}





/* MEMBERS SIGN UP - END ************************************************* */









/* Members Module - Info ******************************************************* */

.manageMemberInfoTabOn {
	margin: 0px;
	padding: 5px;
	float: left;
	height: 20px;
	width: 170px;
	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-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #333333;
	border-right-color: #333333;
	border-bottom-color: #999999;
	border-left-color: #333333;
	background-color: #999999;
	color: #000000;
	display: block;
	font-size: xx-small;
	text-align: center;
}

.manageMemberInfoTabOn a, .manageMemberInfoTabOn a:visited {
	color: #000000;
}

.manageMemberInfoTabOn a:hover {
	color: #000000;
}

.manageMemberInfoTabOff {
	margin: 0px;
	padding: 5px;
	float: left;
	height: 20px;
	width: 170px;
	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-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #999999;
	border-right-color: #999999;
	border-bottom-color: #333333;
	border-left-color: #999999;
	background-color: #EEEEEE;
	display: block;
	font-size: xx-small;
	text-align: center;
}

.manageMemberInfoTabOff a, .manageMemberInfoTabOff a:visited {
	color: #AAAAAA;
}

.manageMemberInfoTabOff a:hover {
	color: #000000;
}


.manageMemberInfoMainBox {
	border-top-width: 4px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-right-color: #333333;
	border-bottom-color: #333333;
	border-left-color: #333333;
	border-top-color: #999999;
	width: 534px;
	font-size: xx-small;
	padding: 5px;
}



.manageMemberInfoclear {
	line-height: 0px;
	clear: both;
	float: none;
	height: 0px;
	width: 0px;
	padding: 0px;
	margin-top: -5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}


/* Members Module - Info - END************************************************** */

/* Members membersDisplay1.inc ************************************************** */
.membersColumnBox {
	margin: 1%;
	width:43%;
	padding: 2%;
	height: auto;
	float: left;
	display: inline;
	font-size: 85%;	
}
/* Members membersDisplay1.inc - END************************************************** */






/* NAVIGATION */
#navigation {
	position: absolute;
	right: 0px;
	top: 140px;
	background-color: #E7E7E9;
	padding: 0em;
	z-index: 2;
	width: 706px;
	height: 20px;
}
/* ****************************** END OF NAVIGATION ********************************** */



/* ================================================================ 
/* ================================================================ 
	SITE MENU - I.E. THE NAVIGATION OF THE CONSUMER SITE
/* ================================================================ 
/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.menucontainer{
	background-color: #ACC8F6;
	
}

.menu {
	position:relative;
	font-size:90%;
	margin: 0em;
	padding: 0em;
}

/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
	padding:0em;
	margin:0em;
	list-style-type:none;
	float:center;
	position:center;
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
	float:left;
	position:relative;
	display: inline;
	text-align: center;
	margin: 0px;
	padding: 0px;
	height: 2em;
	width: auto;
	}

/* style the links for the top level */
.menu a, .menu a:visited {
	display:block;
	text-decoration:none;
	color:#666666;
	height:20px;
	line-height:20px;
	border-top: 1px none #003366;
	border-right: 1px solid #FFFFFF;
	border-bottom: 1px none #FFFFFF;
	border-left: 1px none #003366;
	padding-right: 1em;
	padding-left: 1em;
}
/* another hack for IE5.5 */
* html .menu a, * html .menu a:visited, * html .menu li {
display:inline;
float: left;
height:20px;
overflow:hidden;
}
* html .menu ul, * html .menu {
height:20px;
overflow:hidden;
}


/********************************************************************************************************/
/*												2ND LEVEL												*/
/********************************************************************************************************/
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
	visibility:hidden;
	position:absolute;
	top:20px;
	left:0;
	width:17.1em;
	z-index: 6;
	text-align: left;
	border: 1px solid #003366;
 	background-color: #CCCCFF;
}


/* another hack for IE5.5 */
* html .menu ul ul {
top:18px;
t\op:18px;
border: 1px solid #003366;
}

/* position the third level flyout menu for a left flyout */
.menu ul ul.left {
left:-77px;
z-index: 10;
}

/***************************************************************************/
/* This filters down the levels too
/***************************************************************************/
/* style the second level links */


/* style the second level background a tags*/
.menu ul ul a, .menu ul ul a:visited, .menu ul ul a.drop, .menu ul ul a.drop:visited {
	background:none;
	min-height:2em;
	color:#003366;
	padding:0px 0px 0px 1em;
	width:16em;
	text-align: left;
	display: block;
	margin: 0em;
	z-index: 6;
	line-height:2em;
	background-color: #CCCCFF;
	border-top: 1px none #FFFFFF;
	border-right: 1px none #FFFFFF;
	border-bottom: 1px solid #003366;
	border-left: 1px none #FFFFFF;
	
}

.menu ul ul a.drop, .menu ul ul a.drop:visited {
	background-image: url(../images/blankArrow.gif);
	background-repeat: no-repeat;
	background-position: right center;
	}


/********************************************************************************************************/
/*											2ND LEVEL	- END											*/
/********************************************************************************************************/






/********************************************************************************************************/
/*											THIRD LEVEL													*/
/********************************************************************************************************/
/* position the third level flyout menu */
.menu ul ul ul{
	left:17em;
	background:#DDDDDD;
	top:-1px;
	width:17em;
	border: 1px solid #003366;
	z-index: 10;
}
/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {
left:-15em;
z-index: 10;
}

/* style the third level */
.menu ul ul ul a, .menu ul ul ul a:visited {
	height: 2.5em;
	display:block;
	line-height:2.5em;
	text-decoration:none;
	color:#333333;
	text-align: left;
	z-index: 10;
	background-color: #DDDDDD;
	}



/* Tier One - Style for when the navigation button when the user is on that page */
.menu .Over, .menu .dropOver {
	background-color:#FFEEC2;
}

/* Tier Two - Style for when the navigation button when the user is on that page */
.menu ul ul a.Over, .menu ul ul a.dropOver {
	background-color:#FFEEC2;
}












/***************************************************************************/
/****************************	IMPORTANT IMPORTANT	  **********************/
/***************************************************************************/						
/* THERE MUST BE A BACKGROUND COLOUR VALUE FOR THESE TO WORK IN Internet Explorer 6 /
/*
/* Make sure you match these colours with the a:hover styles above
/*
/***************************************************************************/
/* style the top level hover */
.menu a:hover {
	color:#000000;
	text-decoration:none;
	background:#FFEEC2; /* You have to have this even if it is the same colour as the normal status */
}



.menu :hover > a {
	color:#000000;
	background:#FFEEC2; /* This must be the same as .menu a:hover { */
	text-decoration:none;
}

.menu ul ul :hover > a {
	color:#FFFFFF;
	background-color: #CCCCFF;
	text-decoration:none;
	z-index: 6;
	border: none;
}
/***************************************************************************/


/***************************************************************************/
/***************************************************************************/
/* style the second level hover */
.menu ul ul a.drop:hover{
	text-decoration:none;
	color:#FFFFFF;
	background-color: #CCCCFF;
	border-top: 1px none #FFFFFF;
	border-right: 1px none #FFFFFF;
	border-bottom: 1px solid #003366;
	border-left: 1px none #FFFFFF;
	z-index: 6;
	background-image: url(../images/blankArrow.gif);
	background-repeat: no-repeat;
	background-position: right center;
}

.menu ul ul a:hover{
	text-decoration:none;
	color:#FFFFFF;
	background-color: #CCCCFF;
	border-top: 1px none #FFFFFF;
	border-right: 1px none #FFFFFF;
	border-bottom: 1px solid #003366;
	border-left: 1px none #FFFFFF;
	z-index: 6;
	
}

.menu ul ul :hover > a.drop {
	text-decoration:none;
	color:#000000;
	background:#FFEEC2;
	z-index: 10;
	border-top: 1px none #FFFFFF;
	border-right: 1px none #FFFFFF;
	border-bottom: 1px solid #003366;
	border-left: 1px none #FFFFFF;
}
/***************************************************************************/


/***************************************************************************/
/***************************************************************************/
/* style the third level hover */
.menu ul ul ul a:hover {
text-decoration:none;
color:#000000;
background:#FFEEC2;
}
/***************************************************************************/







/***************************************************************************/
/*  					DON'T EDIT THESE ONES BELOW 					   */
/***************************************************************************/

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul, .menu ul a:hover ul{
visibility:visible; /* THIS IS USUALLY SET TO VISIBLE - BUT IS SET TO HIDDEN AS THAT STOPS THE 2nd NAV TIER DISPLAYIN AT THE TOP */
}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{
visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{
visibility:visible;
}


/* style the table so that it takes no part in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0;}	
/***************************************************************************/
/***************************************************************************/













/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */


#sectionNav {
	width: 292px;
	position:absolute;
	top: 350px;
	left: 0px;
	padding: 0px;
	z-index: 0;
	font-size:85%;
	text-align:right;
}

/* another hack for IE5.5 */
* html #sectionNav {
	height: 377px;	
	z-index: 0;
}



#sectionNav h2 {
	display:none;
}


/* remove all the bullets, borders and padding from the default list styling */
#sectionNav ul {
	padding:0px;
	margin:0px;
	list-style-type:none;
	text-align:right;
}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
#sectionNav li {
	position:relative;
	text-align: right;
	margin: 0px;
	padding: 0px;
	}

/* style the links for the top level */
#sectionNav a, #sectionNav a:visited {
	height: 2em;
	width:287px;
	color:#666666;
	text-align: right;
	display: block;
	line-height:2em;
	padding-right:5px;
}

/* hack for IE */
* html #sectionNav a, #sectionNav a:visited {
/* height:21px; */

}


/********************************************************************************************************/
/*												2ND LEVEL												*/
/********************************************************************************************************/
/* hide the sub levels and give them a positon absolute so that they take up no room */
#sectionNav ul ul {
	visibility:hidden;
	position:absolute;
	top:0px;
	left:-203px;
	width:200px;
	text-align: left;
	border: 1px solid #003366;
	z-index: 5;
}


/* another hack for IE5.5 */
* html #sectionNav ul ul {
top:0px;
t\op:0px;
}


/* style the second level background a tags*/
#sectionNav ul ul a.drop, #sectionNav ul ul a.drop:visited {
	display:block;
	background:#F6F6F6;
	text-decoration:none;
	color:#000000;
	height:auto;
	line-height:18px;
	padding:0px;
	width:183px;
	text-align: left;
	margin: 0px;
	border: 1px solid #FFFFFF;
}


/***************************************************************************/
/* This filters down the levels too
/***************************************************************************/
/* style the second level links */
#sectionNav ul ul a, #sectionNav ul ul a:visited {
	text-decoration:none;
	color:#FFFFFF;
	text-align: left;
	background-color: #000066;
	background-image: none;
	min-height:18px;
	padding:2px 0px 2px 5px;
	width:193px;
	display: block;
	margin: 0px;
	line-height:130%;
}
* html #sectionNav ul ul a{
width:193px;
w\idth:193px;
}

#sectionNav ul ul a:hover{
	text-decoration:none;
	color:#000000;
	background:#FFEEC2;
	border-top: 1px solid #FFFFFF;
	border-right: 1px solid #FFFFFF;
	border-bottom: 1px none #FFFFFF;
	border-left: 1px solid #FFFFFF;
}

/********************************************************************************************************/
/*											2ND LEVEL	- END											*/
/********************************************************************************************************/






/********************************************************************************************************/
/*											THIRD LEVEL													*/
/********************************************************************************************************/
/* position the third level flyout menu */
#sectionNav ul ul ul{
	left:177px;
	background:#999999;
	top:0;
	width:177px;
	border: 1px solid #003366;
	z-index: 10;
}
/* position the third level flyout menu for a left flyout */
#sectionNav ul ul ul.left {
left:-150px;
}

/* style the third level */
#sectionNav ul ul ul a, #sectionNav ul ul ul a:visited {
	display:block;
	text-decoration:none;
	color:#FFFFFF;
	text-align: left;
	background-color: #000066;
	background-image: none;
	}



/* SECTION NAV - When the user is on the page make the section nav style different */
#sectionNav ul a.Over, #sectionNav ul a.dropOver {
	background-color:#D9ECFF;
}

/***************************************************************************/
/****************************	IMPORTANT IMPORTANT	  **********************/
/***************************************************************************/						
/* THERE MUST BE A BACKGROUND COLOUR VALUE FOR THESE TO WORK IN Internet Explorer 6 /
/*
/* Make sure you match these colours with the a:hover styles above
/*
/***************************************************************************/
/* style the top level hover */
#sectionNav a:hover {
	color:#000000;
	text-decoration:none; /* You have to have this even if it is the same colour as the normal status */
	background-color: #D9ECFF;
}



#sectionNav :hover > a {
	color:#000000;
	background-color: #D9ECFF; /* This must be the same as #sectionNav a:hover { */
	text-decoration:none;
}

#sectionNav ul ul :hover > a {
	color:#000000;
	background:#FFEEC2;
	text-decoration:none;
	border-bottom: 1px none #003366;
	border-top: 1px solid #003366;
	border-right: 1px solid #0099CC;
	border-bottom: 1px solid #003366;
	border-left: 1px solid #003366;
}
/***************************************************************************/


/***************************************************************************/
/***************************************************************************/
/* style the second level hover */
#sectionNav ul ul a.drop:hover{
text-decoration:none;
color:#000000;
background:#FFEEC2;
}

#sectionNav ul ul :hover > a.drop {
text-decoration:none;
	color:#000000;
	background:#FFEEC2;
}
/***************************************************************************/


/***************************************************************************/
/***************************************************************************/
/* style the third level hover */
#sectionNav ul ul ul a:hover {
text-decoration:none;
color:#000000;
background:#FFEEC2;
}
/***************************************************************************/







/***************************************************************************/
/*  					DON'T EDIT THESE ONES BELOW 					   */
/***************************************************************************/

/* make the second level visible when hover on first level list OR link */
#sectionNav ul li:hover ul, #sectionNav ul a:hover ul{
visibility:visible;
}
/* keep the third level hidden when you hover on first level list OR link */
#sectionNav ul :hover ul ul{
visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
#sectionNav ul :hover ul :hover ul{
	visibility:visible;
}


/* style the table so that it takes no part in the layout - required for IE to work */
#sectionNav table {position:absolute; top:0; left:0;}	
/***************************************************************************/
/***************************************************************************/