body {
	padding: 0px;
	margin: 0px;
}

input, select, textarea {font-family:Arial, helvetica, sans-serif;}

/*******************************************************************************************************************************************************/
/************** NOTES **********************************************************************************************************************************/
/*******************************************************************************************************************************************************/

/* Many styles are prefixed with span.website, this is done because some user controls */
/* are used in both the front and back end. The styles in these UCs are confirgured so that they are */
/* correct for the back end (which is reused by all sites). These styles are then added */
/* to the website stylesheet but prefixed with 'span.website'. This works because all UCs on the website */
/* are inserted into a span with the 'website' class AND the stylesheets load in teh correct order. */

/*******************************************************************************************************************************************************/
/************** general styles *************************************************************************************************************************/
/*******************************************************************************************************************************************************/

.notBold {font-weight: normal;}
.noMargin {margin-bottom: 0px;}

.darkBlue {color: #00558F;}
.midBlue {color: #2F81C4;}
.texyGrey {color: #636467;}
.orangeBrown {color: #D67A27;}
.orangeBrownFaded {color: #E19C5E;}
.warning, span.website .cmsred {color: red;} /* Need to add CMS red for modals when in website mode */

div.movieClipSnippet {padding-bottom: 13px;}

/*******************************************************************************************************************************************************/
/************** ADDITIONAL STYLES **********************************************************************************************************************/
/*******************************************************************************************************************************************************/

span.website ul.cmsUnorderedList {}
span.website p.cmsPara {}
span.website p.cmsh2 {
	color: #00558F;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 10px;
}

ul ul{ /* Makes site manager look better */
	margin-bottom: 0px;
}

p.links a:link {color: #636467; text-decoration: underline}
p.links a:visited {color: #636467; text-decoration: underline}
p.links a:active {color: #636467; text-decoration: none}
p.links a:hover {color: #636467; text-decoration: none}

.altlink a:link {color: #636467; text-decoration: underline}
.altlink a:visited {color: #636467; text-decoration: underline}
.altlink a:active {color: #636467; text-decoration: none}
.altlink a:hover {color: #636467; text-decoration: none}

hr.links {width: 50px; margin-bottom: 13px}

p.headerRight {
	margin-top: 4px;
	color: #636467;
}

p.headerRight a:link {COLOR: #636467; text-decoration: underline}
p.headerRight a:visited {COLOR: #636467; text-decoration: underline}
p.headerRight a:active {COLOR: #636467; text-decoration: none}
p.headerRight a:hover {COLOR: #636467; text-decoration: none}

div.blueBarRight {
	color: #ffffff;
	font-weight: bold;
	line-height: 23px;
}

div.blueBarRight a:link {COLOR: #ffffff; text-decoration: underline}
div.blueBarRight a:visited {COLOR: #ffffff; text-decoration: underline}
div.blueBarRight a:active {COLOR: #ffffff; text-decoration: none}
div.blueBarRight a:hover {COLOR: #ffffff; text-decoration: none}

p.footer {}

div.rightImage {
	margin-bottom: 11px; /* Bit less than 13px to make it look better */
}

span.website table.cmsModuleView { /* Used on events view screen, etc */
	border-top: 1px solid #636467;
	margin-bottom:13px;
	width: 100%;
	clear: both;
}

span.website table.cmsModuleView td {
    padding: 3px 3px 3px 3px;
    border-bottom: 1px solid #636467;
}


/*******************************************************************************************************************************************************/
/************** MAIN LAYOUT DIV STYLES *****************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.container {
	width: 100%;
	height: 100%;
	background: url(../images/spacers_etc/page_background.gif) repeat-x left top;
}

div.containerInside {
	width: 920px;
	margin-left: auto; 		/*** USED TO CENTRE CONTENT ***/
	margin-right: auto; 	/*** USED TO CENTRE CONTENT ***/
}

div.header,
div.blueBar,
div.blueBarInside1,
div.blueBarInside2,
div.navigation,
div.contentContainer,
div.footer {  
	width: 920px;
	margin: 0px;
	clear: both;
}

div.headerLeft {  
	float: left;
	padding: 0px;
}

div.headerRight01, div.headerRight02 {
	float: right;
	width: 600px;
	height: 120px;
	text-align: right;
}

div.headerRight01 {background: url(../images/header/header_bg_01.jpg) no-repeat right bottom;}
div.headerRight02 {background: url(../images/header/header_bg_02.jpg) no-repeat right bottom;}

div.blueBar {
	background-color: #2F81C4;
	border-bottom: 2px solid #ffffff;
}

/* need 2 "inside" header divs to ensure that background of "div.header" shows through in ff */
div.blueBarInside1, div.blueBarInside2 {float: left;}
div.blueBarInside1 {background: inherit;}

div.blueBarLeft {
	float: left;
	background-color: inherit;
}

div.blueBarRight {
	float: right;
	padding-right: 10px;
	background-color: inherit;
}

div.navigtion1 {
	float: left;
	background-color: #00558F;
	padding: 0px 10px 0px 10px;
}

div.navigtion2 {float: left;}

div.contentContainerInside {
	padding: 20px 10px 0px 10px;
}

div.footer div {
	padding: 20px 10px 10px 10px;
	clear: both;
}

/*******************************************************************************************************************************************************/
/************** Column DIV styles **********************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.leftNavigationColumn,
div.contentColumn,
div.contentCentre,
div.contentLeft,
div.contentRight {
	padding: 0px;
	margin: 0px;
	overflow: hidden;
}

div.contentColumn,
div.contentRightColumn {
	background: url(../images/spacers_etc/vertical_blue_line_background.gif) repeat-y left top;
	
}

div.leftNavigationColumn {
	float: left;
	width: 180px; /* 205px minus 10px on left and 15px on right */
}

div.contentColumn {
	float: right;
	width: 705px; /* 240px plus 240px plus 235px minus 10px on right */
}

div.contentColumnInside {padding-left: 15px;}

div.contentCentreColumn {
	float: left;
	width: 450px; /* 240px  plus 240px minus 15px on right and left */
}

div.contentLeftColumn {
	float: left;
	width: 210px; /* 240px minus 15px on right and left */
}

div.contentRightColumn {
	float: right;
	width: 225px; /* column width minus right border (15px or 10px) */
}

div.contentRightColumnInside {
	padding-left: 15px;
}

/*******************************************************************************************************************************************************/
/************** Level 1 navigation styles **************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.navigtion1 {
	color: #ffffff;
	font-weight: bold;
	line-height: 23px;
}

.sectionactive a:link {COLOR: #E19C5E; text-decoration: none}
.sectionactive a:visited {COLOR: #E19C5E; text-decoration: none}
.sectionactive a:active {COLOR: #E19C5E; text-decoration: underline}
.sectionactive a:hover {COLOR: #E19C5E; text-decoration: underline}

.sectionNOTactive a:link {color:#ffffff; text-decoration: none;}
.sectionNOTactive a:visited {color:#ffffff; text-decoration: none;}
.sectionNOTactive a:active {color:#ffffff; text-decoration: underline;} 
.sectionNOTactive a:hover {color:#ffffff; text-decoration: underline;}

/*******************************************************************************************************************************************************/
/************** LEFT navigation LEVEL TWO **************************************************************************************************************/
/*******************************************************************************************************************************************************/

/**************/
/* Note that these styles are also used for QuickLinks and news on homepage */
/**************/

div.leftNavigationContainer {
	width: 100%;
	margin-bottom: 13px;
	padding: 0px;
	border-top: 1px solid #636467;
}

div.leftNavigationContainerCell {
	width: 100%;
	padding: 4px 0px 5px 0px;
	margin: 0px;
	font-weight: bold;
	border-bottom: 1px solid #636467;
}

ul.subnavigationONWithL3, ul.subnavigationONNoL3,
ul.subnavigationOFFWithL3, ul.subnavigationOFFNoL3 {
   margin-left: 1.4em;
   margin-right: 10px;
   margin-bottom: 0px;
   margin-top: 0px;
   font-weight: bold;
}

ul.subnavigationONWithL3 {list-style-image: url(../images/spacers_etc/level2_bullet_ON.gif);}
ul.subnavigationOFFWithL3 {list-style-image: url(../images/spacers_etc/level2_bullet_OFF.gif);}
ul.subnavigationONNoL3, ul.subnavigationOFFNoL3 {list-style-image: url(../images/spacers_etc/level2_bullet_LINE.gif);}

ul.subnavigationONWithL3 a:link, ul.subnavigationONNoL3 a:link {COLOR: #D67A27; text-decoration: none}
ul.subnavigationONWithL3 a:visited, ul.subnavigationONNoL3 a:visited {COLOR: #D67A27; text-decoration: none}
ul.subnavigationONWithL3 a:active, ul.subnavigationONNoL3 a:active {COLOR: #D67A27; text-decoration: underline}
ul.subnavigationONWithL3 a:hover, ul.subnavigationONNoL3 a:hover {COLOR: #D67A27; text-decoration: underline}

ul.subnavigationOFFWithL3 a:link, ul.subnavigationOFFNoL3 a:link {COLOR: #636467; text-decoration: none}
ul.subnavigationOFFWithL3 a:visited, ul.subnavigationOFFNoL3 a:visited {COLOR: #636467; text-decoration: none}
ul.subnavigationOFFWithL3 a:active, ul.subnavigationOFFNoL3 a:active {COLOR: #636467; text-decoration: underline}
ul.subnavigationOFFWithL3 a:hover, ul.subnavigationOFFNoL3 a:hover {COLOR: #636467; text-decoration: underline}

/*******************************************************************************************************************************************************/
/************** LEFT navigation LEVEL THREE ************************************************************************************************************/
/*******************************************************************************************************************************************************/

ul.L3navigation {
   margin-top: 3px;
   margin-left: 2.9em;
   margin-right: 10px;
   margin-bottom: 0px;
   color: #636467;
   list-style-type: square;
}

/* Colour in colour stylesheets */
li.L3navigationON a:link {COLOR: #D67A27; text-decoration: none}
li.L3navigationON a:visited {COLOR: #D67A27; text-decoration: none}
li.L3navigationON a:active {COLOR: #D67A27; text-decoration: underline}
li.L3navigationON a:hover {COLOR: #D67A27; text-decoration: underline}

li.L3navigationOFF a:link {COLOR: #636467; text-decoration: none}
li.L3navigationOFF a:visited {COLOR: #636467; text-decoration: none}
li.L3navigationOFF a:active {COLOR: #636467; text-decoration: underline}
li.L3navigationOFF a:hover {COLOR: #636467; text-decoration: underline}

/*******************************************************************************************************************************************************/
/************** Home page login panel ******************************************************************************************************************/
/*******************************************************************************************************************************************************/

/**************/
/* Note that these styles are also used elsewhere */
/**************/

div.loginPanel {
	background: #2F81C4 url(../images/login/background.gif) repeat-x left bottom;
	width: 210px;
	margin-bottom: 5px;
}

div.redPanel {
	background: #ed1c24 url(../images/red_panel/background.gif) repeat-x left bottom;
	width: 210px;
	margin-bottom: 5px;
}

div.loginPanelInside, div.redPanelInside {
	padding: 0px 10px 5px 10px;
}

div.loginPanelInside p, div.redPanel p {margin-bottom: 3px; color: #ffffff;}
div.loginPanelInside h3, div.redPanel h3 {margin-bottom: 6px; color: #ffffff;}

td.loginPanelLeftCell,
td.loginPanelRightCell {
	font-weight: bold;
	color: #ffffff;
}

td.loginPanelLeftCell {padding: 1px 5px 1px 0px;}
td.loginPanelRightCell {padding: 1px 0px 1px 5px;}

/*******************************************************************************************************************************************************/
/*********** TOOLTIPS **********************************************************************************************************************************/
/*******************************************************************************************************************************************************/

.tooltip_link {
    cursor: pointer;
    text-decoration: underline;
}

div.tooltipBody, div.tooltipBody_NoWidth {
    border: #7f7f7f 1px solid;
    background-color: #e3e3e3;
    padding: 10px;
    color: #000000;
} 

div.tooltipBody {width: 240px;}

/*******************************************************************************************************************************************************/
/*********** PAGING ************************************************************************************************************************************/
/*******************************************************************************************************************************************************/

div.pagerContainer {
	margin-bottom: 13px;
	border-bottom: 1px solid #636467;
	width: 100%;
}

div.pagerLinks {
	border-left: 1px solid #636467;
	border-top: 1px solid #636467;
	border-right: 1px solid #636467;
	margin-left: 15px;
	margin-right: 100px;
	padding: 3px 10px 3px 10px;
}

/*******************************************************************************************************************************************************/
/************** form styles ****************************************************************************************************************************/
/*******************************************************************************************************************************************************/

form {margin-bottom: 0px;} /* NEEDED AS PAGE HAS A FORM TAG AROUND IT */

p.formspacing,
ul.formspacing {
	margin-bottom: 8px;
	clear: both;
}

div.questionsTwoColumn {
	width: 450px;
	margin-bottom: 8px;
	clear: both;
}

div.questionsLeft {float: left;}
div.questionsRight {float: right;}

div.questionsLeft,
div.questionsRight {
	margin-bottom: 8px;
	width: 220px;
}

span.gifButtonAlign, span.website .gifButtonAlign { /* used to correctly align gif buttons used next to form fields */
	vertical-align: -3px;
}

input {background: #ffffff; color: #636467; border:1px solid #636467;}
input:focus {background: #f1f1f1;}

input.fullWidth, span.website input.cmshalfwidthform {width: 446px;}
input.singleColumn, span.website input.cmsrightcolumnwidthform {width: 206px;}
input.halfWidth {width: 216px;}
input.login {width: 110px;}

input.singleColumnWithButton,
span.website input.cmsrightcolumnwidthformStandardButton,
select.singleColumnWithButton,
span.website select.cmsrightcolumnwidthformStandardButton {
	width: 144px;		/* 206px - 55px (button width) - 7px (space) */
}

input.button, span.website input.cmsinputbuttonmain {
   background: #D67A27;
   color: #ffffff;
   font-weight: bold;
}
input.button:focus,
input.cmsinputbuttonmain:focus {background: #E19C5E; color: #636467;}

span.website input.cmsmodalformhalfwidth,
span.website textarea.cmsmodalformhalfwidth,
span.website select.cmsmodalformhalfwidth {
	width: 241px; /* smaller than column to allow for border and padding */
}

select {background: #ffffff; color: #636467; border:1px solid #636467;}
select.fullWidth, span.website select.cmshalfwidthform {width: 446px;}
select.singleColumn, span.website select.cmsrightcolumnwidthform {width: 206px;}
select.halfWidth {width: 216px;}

textarea {background: #ffffff; color: #636467; border:1px solid #636467;}
textarea:focus {background: #f1f1f1;}
textarea.fullWidth, span.website textarea.cmshalfwidthform {width:446px;}
textarea.singleColumn, span.website textarea.cmsrightcolumnwidthform {width: 206px;}

span.noborder input {border: 0px; background-color:Transparent; }

/*******************************************************************************************************************************************************/
/*********** MODAL POP-UP ******************************************************************************************************************************/
/*******************************************************************************************************************************************************/

/* Makes the modals look a bit smaller/better */
 div.modalContent p.cmsPara, div.modalContent p.cmsred {
	margin-bottom: 8px;
}

/* Used for warning messages in modal */
span.website div.modalContent .cmsh2 {
	color: #ED1A2D;
	margin-bottom: 8px;
}

span.website .modalBackground {
    background-color: Black;
    filter: alpha(opacity=35);
    opacity: 0.35;
}

span.website div.layerModalStandard {
	width: 535px;
	background: url(../BSSPD/modal_images/modalBg535.gif) repeat-y top;
	background-color: #ffffff;
	margin: 0px;
}

span.website div.modalContent {
    padding: 12px 15px 0px 15px;
    margin: 0px;
}

span.website div.modalContent table {
    margin-top: 1px;
}

span.website td.modalTableHeaderCell {
	padding: 6px 15px 0px 15px;
	font-family:Arial, helvetica, sans-serif; font-size: 11px;
}

span.website p.modaltitle {
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	margin: 0px;
}

span.website .modalTableHeaderStandard {
	height: 35px;
	background: url(../BSSPD/modal_images/modalBarTopBg535.gif) no-repeat;
}

/* Cancel button, etc */

span.website td.modalTableHeaderLink {
	background: url(../BSSPD/modal_images/modalBarTopRightLinkBg.gif) repeat-x left;
	border: 0px;
	margin: 0px;
	padding: 0px;
	font-size: 11px;
	font-weight: bold;
	color: red;
}

span.website td.modalTableHeaderLink a:link {COLOR: #ffffff; text-decoration: none; font-family:Arial, helvetica, sans-serif; font-size: 11px;}
span.website td.modalTableHeaderLink a:visited {COLOR: #ffffff; text-decoration: none; font-family:Arial, helvetica, sans-serif; font-size: 11px;}
span.website td.modalTableHeaderLink a:active {COLOR: #ffffff; text-decoration: underline; font-family:Arial, helvetica, sans-serif; font-size: 11px;}
span.website td.modalTableHeaderLink a:hover {COLOR: #ffffff; text-decoration: underline; font-family:Arial, helvetica, sans-serif; font-size: 11px;}

span.website p.modalBottomPanel {
	margin-top: 8px;
	margin-bottom: 5px;
}

span.website .modalHeadingWarning {
	color: #EA2227;
	font-size: 14px;
	font-weight: bold;
}

/* Needed for forum modals */
span.website input.cmsmodalformhalfwidth,
span.website textarea.cmsmodalformhalfwidth,
span.website select.cmsmodalformhalfwidth {
	width: 241px; /* smaller than column to allow for border and padding */
}

/*******************************************************************************************************************************************************/
/*********** FORUM *************************************************************************************************************************************/
/*******************************************************************************************************************************************************/

/**********************************
The following styles are also needed but should laready be in use by the site...
/**********************************
.warning
All modal styles
*/

table.forumTable {margin-bottom: 13px;}

.forumHeader { background-color: #00558F; color: white; font-weight:bold;height:25px; vertical-align:middle; }
.forumHeader a:link { background-color: #00558F; color: white; font-weight:bold;height:25px; vertical-align:middle; }
.forumHeader a:visited { background-color: #00558F; color: white; font-weight:bold;height:25px; vertical-align:middle; }
.forumHeader a:active { background-color: #00558F; color: white; font-weight:bold;height:25px; vertical-align:middle; }
.forumHeader a:hover { background-color: #00558F; color: white; font-weight:bold;height:25px; vertical-align:middle; }

span.forumSmallText { font-size: 10px; }

td.forumRow {
	background-color: #ffffff;
	height:35px;
	vertical-align:middle;
	border-bottom: 1px solid #2d1283
}

td.forumRowHighlight, td.forumRowHighlightPost {
	background-color: #e3e3e3;
	height:35px;
	vertical-align:middle;
}

td.forumRowHighlight,		/* Used for Grid only */
td.forumRow {
	border-bottom: 1px solid #aaaaaa;
}

td.forumRowBodyCell {
	padding: 10px 2px 0px 2px;
}

div.forumTableHeaderTabs {
    border-left: 1px solid #888888;
    border-right: 1px solid #888888;
    border-top: 1px solid #888888;
    padding: 0px 10px 0px 10px;
    margin: 0px 20px 0px 20px;
    font-size: 11px;
    line-height: 25px;					/* Used instead of top/bottom padding to ensure works with radio buttons in tabs */
}

input.forumSearch {width: 117px;}		/* 180px (column) - 4px (reduction) - 55px (button) - 4px space */

input.forumButton { 					/* Same as "button" above */
   background: #acdc26;
   color: #000000;
   font-weight: bold;
}

input.forumButton:focus {background: #ffffff; color: #58595B;}

input.forumInput {width: 446px;} 		/* Same as "fullwidth" above */
select.forumInput {width: 446px;}
textarea.forumInput {width: 446px;}

input.forumLogin {width: 501px;} 

span.searchButtonAlign { 				/* used to correctly align gif buttons used next to form fields */
	vertical-align: -3px;
}

span.headerRadioButtonAlign {
	vertical-align: -3px;
}

span.postTitle {						/* Used to make post title bold and same as link color */
	font-weight: bold;
	color: #00558F;
}

table.forumImagesContainer {
	background-color: #D9D9D9;
	margin-bottom: 13px;
}

div.forumImage {
	float: left;
	padding: 0px 5px 5px 0px;
}