@charset "UTF-8";
body  {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #fff;
	background:#000 url(siteimages/bg.gif) center repeat-y;	
}
#outerContent { 
	background:#000 url(siteimages/bg.gif) center repeat-y;
	width:1020px;
	margin: 0px auto 3px;  /* the auto margins (in conjunction with a width) center the page */
}


#innerContent { 
	width: 952px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	border:3px solid #ccc;
	background:white;
	margin: 2px auto 0px; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding:12px 16px;
	color:#333;
}


#header { 
	background: #000 url(siteimages/header.gif) no-repeat; 
	padding:10px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	height:70px;
} 
#header h1 a {
	background:url(siteimages/logo.gif) no-repeat;
	height:54px;
	float:left;
	width:505px;
	margin: 9px 0px 0 30px; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
#header h1 span { position:absolute; left:-5555px; }




/* ------ controls and placement of subMenu ------ */
#subMenu {float:right; width:380px;position:relative; background:;}
#subMenu ul {list-style:none; padding:0; margin:0 0 0 10px;}
#subMenu li {float:right; padding:0 0.5em;}
#subMenu li a {color:#fff; font-weight:normal;}
#subMenu li a:hover, #footerMenu li a:active, #footerMenu li a#current {color:#FFC222; font-weight:normal;}


/* ------ controls and placement of mainMenu ------ */
#mainMenu {
	float:left; width:718px;
	background:#000 url(siteimages/menu.gif) left bottom repeat-x;
	border-top:1px solid #ccc; 
	height:34px;
	clear:both;
}
#mainMenu ul {list-style:none; padding:0; margin:0 0 0 0.8em; }
#mainMenu li {float:left; padding:0;  margin:0; line-height:30px; position:relative;}
#mainMenu li.link:after {content: " | "; }
#mainMenu li a {color:#fff; font-weight:normal; text-transform:uppercase; padding:0 0.8em 0 1em; font-size:1.1em;}
#mainMenu li a:hover, #mainMenu li a:active, #mainMenu li a.current {color:#FFC222; text-decoration:none;}


/* ------ controls and placement of mainMenu dropMenu ------ */

/*dropdowns*/
#mainMenu li ul.dropMenu {
display: none;
position: absolute;
width:130px;
top: 30px;
left: 0;
background: #ccc;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
}
#mainMenu li ul.dropMenu li {
padding:0px;
width:130px;
margin-top:0;
}
#mainMenu li > #mainMenu ul {
top: auto;
left: auto;
}
#mainMenu li:hover ul.dropMenu, #mainMenu li.over ul.dropMenu {
display: block;
}
#mainMenu ul.dropMenu li a {
float: left;
width:130px;
margin:0px 0px 0px 0px;
padding:1px 0px 0px 0px;
font-size:12px;
line-height:24px;
text-decoration:none;
text-transform:;
}
#mainMenu ul.dropMenu li a span{
background:#000 url(siteimages/dropmenu.gif) bottom repeat-x;
float: left;
width:120px;
margin:0px 0px 0px 0px;
padding:0 5px 0 5px;
font-size:12px;
line-height:24px;
text-decoration:none;
text-transform:capitalize;
}

/* ====== colours for drop downs ===== */
#mainMenu ul.dropMenu li a {color:#fff;}
#mainMenu ul.dropMenu li a {background-color:white;}

#mainMenu ul.dropMenu li a:link span, #mainMenu ul.dropMenu li a:visited span{color:white;}
#mainMenu ul.dropMenu li a:hover span{color:white; background: #EEAA11 url(siteimages/dropmenu.gif)  repeat-x;}
/* ====== drop down menu end ===== */




/* ------ controls and placement of leadImage ------ */

div.leadImage {float:left; width:712px; background:#ccc; text-align:center; padding:0 3px 3px; }
div.leadImage img {width:710px; height:240px; }


/* ------ controls and placement of breadCrumb ------ */
#breadCrumbNav {float:left; width:700px; background:;}
ul.breadCrumb {padding-left:0;}
ul.breadCrumb li {list-style:none; display:inline;
background:transparent url('siteimages/arw.gif') no-repeat -0.2em 0.2em; padding-left:10px; }
ul.breadCrumb li:first-child {background:none; padding-left:0; }
#breadCrumbNav a {color:#EEAA11; text-decoration:underline;}
#breadCrumbNav a:hover {color:#EEAA11; /* should be changed */}


#mainContent {float:left; width:700px; background:;}


/* ------ controls and placement of sideContent ------ */
#sideContent {position:relative; top:-30px; float:right; width:234px; background:;}


.sideWidth {float:left; width:234px;}
.middleWidth {float:right; width:450px;}


/* ------ controls for of cornerPanel - boxes with rounded corners ------ */
div.cornerPanel {
margin-bottom:6px; color:#666;}
div.cornerPanel div.innerContent {
background:#F7F7F7;border:0 3px 0 3px; border-left-style:solid; border-right-style:solid; margin:0; padding:0px 6px;}

div.cornerPanel div.innerContent > * {position:relative; top:0px;}
div.cornerPanel div.innerContent *:first-child {padding-top:0; margin-top:0;}
div.cornerPanel div.innerContent *:last-child  {padding-bottom:0; margin-bottom:0;}

/*div.cornerPanel div.top > *,*/ div.cornerPanel div.top h4, div.cornerPanel div.top ul.tabMenu, div.cornerPanel div.top p { 
background-image: url(siteimages/top0.gif); background-repeat:no-repeat; height:46px; line-height:32px; margin:0; margin-right:12px; padding:0 0 0 8px ; white-space: nowrap;}
div.cornerPanel div.top { 
background-image: url(siteimages/top0.gif); background-repeat:no-repeat; height:46px; line-height:32px;}
div.cornerPanel div.bottom div { 
background-image: url(siteimages/top0.gif); background-repeat:no-repeat; height:20px; margin-right:12px; padding:0 ; display:block;}
div.cornerPanel div.bottom { 
background-image: url(siteimages/top0.gif); background-repeat:no-repeat; height:20px;}

/* ------ default for cornerPanel - as colour0 = grey ------ */
/*div.cornerPanel div.top > *,*/ div.cornerPanel div.top h4, div.cornerPanel div.top ul.tabMenu, div.cornerPanel div.top p {color:#666; background-position:left 0px ;}
div.cornerPanel div.top {color:#666; background-position: right 0px ;}
div.cornerPanel div.innerContent { border-color:#ccc; }
div.cornerPanel div.bottom div { background-position: left -46px;}
div.cornerPanel div.bottom { background-position: right -46px;}




div.highlight { background:; }
/*div.highlight div.top > *,*/ div.highlight div.top h4 { background-position:left -264px; height:34px; line-height:36px;}
div.highlight div.top { background-position: right -264px ; height:34px; line-height:36px;}
div.highlight div.innerContent { border-color:#cc9933; background:#f9edcd; }
div.highlight div.bottom div { background-position: left -310px; height:12px;}
div.highlight div.bottom { background-position: right -310px; height:12px;}

/*div.highlight div:first-child div.top > *, div.highlight div.first-child div.top > *,*/ div.highlight div:first-child div.top h4, div.highlight div.first-child div.top h4 {background-position:left -198px ;}
div.highlight div:first-child div.top,  div.highlight div.firstchild div.top { background-position: right -198px ;}

div.highlight div:last-child div.bottom div, div.highlight div.last-child div.bottom div { background-position: left -244px; height:20px;}
div.highlight div:last-child div.bottom, div.highlight div.last-child div.bottom { background-position: right -244px; height:20px;}


div.colour1 { background:; }
/*div.colour1 div.top > *,*/ div.colour1 div.top h4 {color:#fff; background-position: left -66px ;}
div.colour1 div.top {color:#fff; background-position: right -66px;}
div.colour1 div.innerContent { border-color:#009933; }
div.colour1 div.bottom div { background-position: left -112px;}
div.colour1 div.bottom { background-position: right -112px;}

div.colour2 { background:; }
/*div.colour2 div.top > *,*/ div.colour2 div.top h4 {color:#fff; background-position:left -132px;}
div.colour2 div.top {color:#fff; background-position:right -132px;}
div.colour2 div.innerContent { border-color:#33cccc; }
div.colour2 div.bottom div { background-position: left -178px;}
div.colour2 div.bottom { background-position: right -178px;}



label {font-weight:bold;}
select.week, select.month { margin:0.4em 0 0.6em 0; }
select.full {width:100%; margin:0.4em 0 0.6em 0; display:block;}



div.cornerPanel div.top ul.tabMenu {list-style:none; padding:0 0 0 10px;}
ul.tabMenu li {float:left;}
ul.tabMenu li a span {line-height:26px; display:block; margin:3px 10px 0 0; padding:2px 0 0 10px;
background-image: url(siteimages/tab.gif); background-repeat:no-repeat; background-position:left 0px ; text-transform:uppercase; color:#fff;}
ul.tabMenu li a { line-height:26px; display:block; padding:0 0 0 0px ; margin:0; 
background-image: url(siteimages/tab.gif); background-repeat:no-repeat; background-position: right 0px ; text-decoration:none;}

ul.tabMenu li.low a span {background-position:left -86px; color:#fff; text-transform:capitalize;}
ul.tabMenu li.low a {background-position:right -86px;}

ul.tabMenu li a:hover span, ul.tabMenu li a.current span {background-position:left -43px; color:#333;}
ul.tabMenu li a.current span {margin:3px 10px 0 0; padding:3px 0 0 10px;}
ul.tabMenu li a:hover,  ul.tabMenu li a.current {background-position:right -43px;}


/* ------ controls and placement of innerFooter ------ */
#innerFooter { clear:both; border-top:3px solid #eee; color:#eee; text-align:center; background:; }
#innerFooter ul {margin:0; padding:0;}
#innerFooter ul li {list-style:none; display:inline; padding:0 8px; }
#innerFooter a {color:#ccc;}
#innerFooter a:hover {color:#999;}

/* ------ controls and placement of outerFooter ------ */
#outerFooter { clear:both; background:;}
#outerFooter { clear:both; color:#aaa; text-align:center; background:; }
#outerFooter ul li {list-style:none; display:inline; margin:0 8px; }
#outerFooter a {color:#aaa;}
#outerFooter a:hover {color:#ccc;}


/* ------- Accordions -------- */

div.vertical_container {border:1px solid #CC9933; margin:10px 0;}
div.vertical_nested_container  {border:1px solid #999; margin:0; }

div.vertical_container table, 
div.vertical_nested_container table {background:#eee; margin:10px 0; width:100%;}

/* normal version header */
.accordion_toggle, 
.vertical_accordion_toggle {
	display: block;
	height: 24px;
	background: url(siteimages/toggle.gif) no-repeat 2px 4px #f9edcd;
	padding: 0 6px 0 22px;
	line-height: 24px;
	color: #EEAA11;
	font-weight: normal;
	text-decoration: none;
	outline: none;
	border-bottom: 1px solid #CC9933;
	cursor: pointer;
	margin: 0;
	font-size:1.1em;
}
.vertical_accordion_toggle {
	background: url(siteimages/toggle.gif) no-repeat 2px -146px #CACACA;
	color: #fff;
	border-bottom: 1px solid #999;}

/* highlight or active version header */
.accordion_toggle_active, .accordion_toggle:hover, 
.vertical_accordion_toggle_active, .vertical_accordion_toggle:hover {
	display: block;
	height: 24px;
	padding: 0 6px 0 22px;
	line-height: 24px;
	font-weight: normal;
	text-decoration: none;
	outline: none;
	margin: 0;
	font-size:1.1em;
	color: #ffffff;
	border-bottom: 1px solid #CC9933;
}
.accordion_toggle:hover {background: url(siteimages/toggle.gif) no-repeat 2px -26px #FFC222; }
.accordion_toggle_active, .accordion_toggle_active:hover {background: url(siteimages/toggle.gif) no-repeat 2px -56px #FFC222;}

.vertical_accordion_toggle_active, .vertical_accordion_toggle:hover  {
	background: url(siteimages/toggle.gif) no-repeat 2px -206px #999; 
	color: #fff;
	border-bottom: 1px solid #999; 
}
.vertical_accordion_toggle:hover {background: url(siteimages/toggle.gif) no-repeat 2px -176px #999; }
.vertical_accordion_toggle_active, .vertical_accordion_toggle_active:hover {background: url(siteimages/toggle.gif) no-repeat 2px -206px #999; }

.accordion_toggle h3, .vertical_accordion_toggle h3 {font-size:1.1em; color: #EEAA11; }
.vertical_accordion_toggle h3 { color: #fff; }
.accordion_toggle_active h3, .vertical_accordion_toggle_active h3 {font-size:1.1em; color:#fff;}
.vertical_accordion_toggle_active h3 {color:#999;}

.accordion_content, .vertical_accordion_content {
	padding: 0 6px;
	background: #fff url(siteimages/accordion_back.jpg) repeat-x ;
	color: #666;
	overflow: hidden;
	border-bottom: 1px solid #CC9933;
}
.vertical_accordion_content {
	background: #F7F7F7;
	color: #666;
	border-bottom: 1px solid #999;
}

.accordion_content img {margin:5px 2px 5px 5px; }
.vertical_accordion_content img {margin:5px 0px 5px 4px;}
	
.accordion_content h5, .vertical_accordion_content h5 {
	padding: 0.2em 0em 0em 0em;
	margin:0 0 0 0;
	font-weight: bold;
	color: #EEAA11;
}

.accordion_content ul,
div.cornerPanel div.innerContent .accordion_content ul:first-child, div.cornerPanel div.innerContent .accordion_content ul:last-child {padding:6px 0; margin:0; list-style:none;}
.accordion_content ul li { list-style:none; padding:3px 0; }
.accordion_content ul li input { vertical-align:middle; }

		
#loading { display:none; float:left; }

.col1of2 {width:40%; float:left;}
.col2of2 {width:58%; float:right;}

.clearboth, .clearfloats {height:0; line-height:0; clear:both; display:block;}

.rightcol {width:230px; float:right;}
.leftcol {width:230px; float:left;}
.fullcol { clear:both;}

/* -------- buttons ---------- */
p.button {text-align:right;}

/* for teal buttons (not used) */
a.button { font-size:1.3em; background: url(siteimages/toggle.gif) no-repeat 100% -89px; font-weight:bold; text-transform:uppercase; padding-right:20px; color:#33cccc; text-align:right;}

/* buttons on light grey backgrounds */
a.button { font-size:1.3em; background: url(siteimages/toggle.gif) no-repeat 100% -239px; font-weight:bold; text-transform:uppercase; padding-right:20px; color:#EEAA11; text-align:right;}
a.button:hover {text-decoration:none; color:#333; background: url(siteimages/toggle.gif) no-repeat 100% -269px; }

/* buttons on light light orange backgrounds */
.highlight a.button { font-size:1.3em; background: url(siteimages/toggle.gif) no-repeat 100% 1px; font-weight:bold; text-transform:uppercase; padding-right:20px; color:#EEAA11; text-align:right;}
.highlight a.button:hover {text-decoration:none; color:#333; background: url(siteimages/toggle.gif) no-repeat 100% -119px; }


a.more {background: url(siteimages/icon_more10x10.gif) no-repeat 0px 0.4em; padding-left:12px; color:#EEAA11;}
a.less {background: url(siteimages/icon_less10x10.gif) no-repeat 0px 0.4em; padding-left:12px; color:#EEAA11;}

div.tabcontent {width:95%;float:left;display:block;}
div.nodisplay { display:none; float:left; }