/*
----------------------------------------------------------------------
global settings miscellanea
---------------------------------------------------------------------- 
*/

* {
margin: 0;
padding: 0;
/*took border:0 off because it modifies FireFox buttons, and instead used an anchor rule below*/
}

html, body {
margin: 0;
padding: 0;
}

body {
	text-align: left;/*for editor, usually would be center*/
	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
	color: #222;
	font-size: 85%;
	line-height: 2em;
	background: #FFFFFF;/*compulsory for editor background colour*/
	height: 100%;
	}

h1, h2, h3, h4, h5, h6, p, li, a {
	margin: 0 0 .8em 0;
}

/*to overcome an IE bug which by default doubles any spacing. Visually the result of the following rule (entered as half the space) is required to visually double the space to what we need*/
* html h1, 
* html h2, 
* html h3, 
* html h4, 
* html h5, 
* html h6, 
* html p, 
* html li, 
* html a 
{
	margin: 0 0 0.7em 0;
}

p, ul, ol, li  {
font-size:1em;/*keeps the font size EQUAL to whatever is set in the body tag, ie. if it is set smaller than 1em here it will compound the sizing, eg. .9 of .9 would compund smaller still*/
line-height: 1.5em;
}

/* prevent shrinking nested text , remains 1:1 with WHATEVER the body em is set to, eg. if the body font-size is .9em, so will all of these be. See immediately preceeding rule's comment*/
ol ol, ul ol, ol ul, ul ul, ol p, ul p /*, ul li, li a*/  {
font-size:1em;}

ul, ol {
list-style-position: outside;
margin: 1em 2em 1.5em 20px;
}

ul li, ol li{
margin: 0;
}


a:link {
	color: #000066;
	text-decoration: underline;

}

a:visited {
	color: #000066;
}

a:hover,
a:active {
	color: red;
}


.invisible {
	display: none;
}

.Align-Right {
	float: right;
}

.Align-Left {
	float: left;
}

* html form {
height: 1%;
}

fieldset {
padding: 10px 15px;
margin: 10px 0;
}

* html fieldset {
padding: 10px 0px;
position: relative;
margin: 20px 0;
}

* html legend {
position: absolute;
top: -15px;
margin-top: 40px;
}



input[type=submit]{
padding: 3px 10px;
}

input[type=radio]{
margin: 0px 3px;
}

a * {/*remove borders only from anchors, otherwise loses form submit button borders in FireFox*/
border:0;
}



/*
----------------------------------------------------------------------
layout/positioning - major elements
---------------------------------------------------------------------- 
*/
h1, h2, h3, h4 {
color: #000066;
}

#perimeter {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	min-height:100%;
	background: #FFF url(../images/bgd_stripes.gif) 0 0;/*set to be overall background colour*/
	text-align: center;/*usually would put this on the body, but affected the editor*/
	padding: 0;
}

* html #perimeter {/*IE WIN hack to force background colour higher than the viewport*/
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom:0px;
	height: 110%;
}

#outerContainer {
	text-align: left;
	margin: 0 auto;
	padding: 0 0 0 0;
	height: 100%;
	position: relative;
	background:#BBCCEE;/*simulates the borders*/
	
			
/*'Tantek box model hack' adjustment for the incorrect box-model implementation in IE5.xWin*/
	width: 746px; /*parse to IE5.xWin, the physical screen-pixel-width-requirement */
	voice-family: "\"}\"";voice-family:inherit;/*to stop IE5.xWin reading the next line*/
	width: 746px; /*parse to standards-compliant browsers: physical screen-pixel-width-requirement minus the sum of any left and right borders and padding*/
}



* html #outerContainer {
	height: auto;/*required for IE Win so the background doesn't stretch down to the extent of the perimeter div*/
}
	
#innerContainer {
	background: #FFFFFF;
	border-bottom: none;
	margin: 0 auto;
		height:100%;
		
			
/*'Tantek box model hack' adjustment for the incorrect box-model implementation in IE5.xWin*/
	width: 740px; /*parse to IE5.xWin, the physical screen-pixel-width-requirement */
	voice-family: "\"}\"";voice-family:inherit;/*to stop IE5.xWin reading the next line*/
	width: 740px; /*parse to standards-compliant browsers: physical screen-pixel-width-requirement minus the sum of any left and right borders and padding*/
}


* html #innerContainer {
	height: auto;/*required for IE Win so the background doesn't stretch down to the extent of the outerContainer div*/
}

#upperNavigation {
	background: transparent;
	overflow: hidden;
	padding-top: 9px;
	margin-bottom: 5px;
	height: 20px;
	
			
/*'Tantek box model hack' adjustment for the incorrect box-model implementation in IE5.xWin*/
	width: 740px; /*parse to IE5.xWin, the physical screen-pixel-width-requirement */
	voice-family: "\"}\"";voice-family:inherit;/*to stop IE5.xWin reading the next line*/
	width: 740px; /*parse to standards-compliant browsers: physical screen-pixel-width-requirement minus the sum of any left and right borders and padding*/
}


#mastheadLead {
	padding: 5px 5px 5px 5px;/*added bottom after doing adv, IE wanted it but Mac doubles up*/
	text-align: center;
	background: white;
	height: auto;
	width: auto;
	color: #000066;
} 

#mastheadLead img {
	margin-top: 20px;
} 

#mastheadTail {
	display: none;/*added this after doing adv*/
}

#content {
	padding: 0 0 10px 0; /*added this after doing adv*/
	width: auto;
}

#mainContent{
	float:left;
	margin: 0;
	padding: 15px 20px 10px 20px;
	display: inline; 
	background: #FFF url(../images/gradation_blue.jpg) 0 0 repeat-x;
	/*border: 1px solid #CACACA;*/
	z-index: 90;

			
/*'Tantek box model hack' adjustment for the incorrect box-model implementation in IE5.xWin*/
	width: 535px; /*parse to IE5.xWin, the physical screen-pixel-width-requirement */
	voice-family: "\"}\"";voice-family:inherit;/*to stop IE5.xWin reading the next line*/
	width: 503px; /*parse to standards-compliant browsers: physical screen-pixel-width-requirement minus the sum of any left and right borders and padding*/
}



#leftContent  {
}

#leftContent, #rightContent  {
	float:left;
	display: inline; 
}

.rightMiniFeature {
			width: 130px !important;/*true content width*/
			width: 152px;/*true content width PLUS value of padding PLUS borders*/
			width/**/:/**/130px;/*true content width*/

	margin: 0 0 5px 5px;
	padding: 5px 10px;
	background-color: #FFF; /*very nice effect when removing bgd and borders as well*/
	border: 1px solid #ccc;
}

.leftMiniFeature {
			width: 130px !important;/*true content width*/
			width: 152px;/*true content width PLUS value of padding PLUS borders*/
			width/**/:/**/130px;/*true content width*/	
margin: 0 0 5px 5px;
	padding: 5px 10px;
	background-color: #FFF; /*very nice effect when removing bgd and borders as well*/
	border: 1px solid #ccc;
}





#pageFoot {
	margin: 0 auto;
	background: transparent;
	height:25px;
	width:auto;
	text-align:left;
	padding:10px 10px 2px 10px;
}

#pageFoot a {

}

#footer {
	color: #000066;
	text-align:left;
	margin: 5px auto 0;
	width:auto;
	font-size:10px;
	padding:10px 0 0 20px;
	background: #BBCCEE;
	height: 50px;
}











.leftMiniFeature li+li {
	padding-top: 10px;
	border-top: 1px solid #ccc;
}


#mainMenu li+li {
	padding-top: 0px;
	border-top: none;
}

.leftMiniFeature p {
	margin-bottom: 0px
}

.rightMiniFeature li+li {
	padding-top: 10px;
	border-top: 1px solid #ccc;
}

.rightMiniFeature p {
	margin-bottom: 0px
}

#upperNavigation ul, li  {
	margin: 0;
}

#upperNavigation li {
	display: inline;
}

#upperNavigation a {
	display: inline;
	padding: 5px 4px 3px;
	border-bottom: none;
}

#footer ul, li  {
	margin: 0;
}

#footer li {
	display: inline;
}

#footer p {
	display: inline;
	margin-right: 10px;
}

#footer a {
	display: inline;
	margin-right: 10px;
}

#lowerNavigation ul {
	margin-left: -1px; /*moved across to avoid edge highlight visual error*/
}


#lowerNavigation li {
	display: inline;
}

#lowerNavigation a {
	font-size: 12px;
	font-weight: bold;
	display: inline;
	background: #555;
	line-height: 30px;
	padding: 7px 10px 8px;
	border-bottom: 0;
	margin: 0;
	border-left: 1px solid #777;
	border-right: 1px solid #444;
	color: white;
	height: 30px;
}







/*
----------------------------------------------------------------------
element treatments -specific
---------------------------------------------------------------------- 
*/

/*#upperNavigation li, #lowerNavigation li, #news li,  #mainMenu ul, i, #toggleSubMenu li, #rightContent li, #footer li {
	list-style-type: none;
	overflow: hidden;
}*/

#contactDetails {
float: right;
width: 30%;
background: #FFF;
padding: 10px;
margin-left: 30px;
border: 6px solid #CCDDFF;/*#D6D6FF*/
}






/*
----------------------------------------------------------------------
floatClearing 
---------------------------------------------------------------------- 
*/



.floatClear,#floatClear  {
	clear: both;
	line-height : 0em;
	font-size: 0em !important;
	background-color: transparent;
}



/*
----------------------------------------------------------------------
custom classes
---------------------------------------------------------------------- 
*/

.invisible {
	display:none;
}


#search, #breadcrumbs {
	display: none;
}





/*
----------------------------------------------------------------------
typography 
---------------------------------------------------------------------- 
*/

#pageFoot {
	font-size:11px;
	color: black;
}

#leftContent p,
#leftContent li,
#leftContent a,
#rightContent p {
	font-size: 11px;
}

#leftContent h4+p, h5+p, h6+p,
#rightContent h4+p, h5+p, h6+p
{
	margin-top: -1em;
} 

#upperNavigation {
	text-align: right;
	font-size: 10px;
	color: white;
}

#footer p, #footer ul {
	float: left;
}

#leftContent h3 {
	background: #ccc;
	text-transform: uppercase;
	letter-spacing: .35em;/*added this after doing adv, changed from .5*/
	font-weight: normal;
	margin: 0 -11px 0 -11px;/*changed top from -6 to 0, bottom from 10 to 0 after doing adv*/
	padding: 3px 5px 0 10px;
	font-size: 9px;
	line-height: 19px;/*added this new line after doing adv*/
}

#leftContent p {
	line-height: 1.2em;
	font-size: 11px;
}


#news h4.date {
	margin-bottom: 0;
	color: #777;
	font-weight: normal;
	font-size: 10px;
}


#news p {
	margin-bottom: 0;
}

#backToTop {
	float: right;
}

/*
----------------------------------------------------------------------
generated content
---------------------------------------------------------------------- 
*/





/*
----------------------------------------------------------------------
hovers
---------------------------------------------------------------------- 
*/


#lowerNavigation a:hover {
	background: #333;
	color: white;
}

#upperNavigation a:hover{
	color: white;
	background: ;
}


#backToTop a:hover {

}

/*
----------------------------------------------------------------------
experimental
---------------------------------------------------------------------- 
*/

.leftMiniFeature{
	padding-bottom: 10px;
}

.leftMiniFeature H3+div, .leftMiniFeature H3+span {
	margin-top: -10px;
}

#subMenuCat2 {
	display: none;
}

/* #mainMenu ul ul.subnav {display: none;} */

table {
border: 1px solid #ccc;
border-right: none;
border-bottom: none;
background: #fff;
font-size: 1em;
margin: 10px 0 20px 0;
width: auto;
}

table#council {
font-size: .7em;
}


td {
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
padding: 5px;
}

* html table#council td {
padding: 2px 5px;
}

* html td {
padding-right: 2px;
}



#mainContent p, #mainContent ul, #mainContent li {
	font-size:1em !important;
	line-height: 1.6em;
	}
	
#mainContent ul li {
	margin: 10px 20px;
	}
	
	
/*
----------------------------------------------------------------------
contact form
---------------------------------------------------------------------- 
*/

#contactForm fieldset  {
	width: auto;
	}
	
* html #contactForm fieldset  {
	width: 55%;
	border: 3px double #ccc;
	}


fieldset#contactFormFieldset legend,
fieldset#updateLoginFieldset legend{
	display: none;
	}

#contactForm label   {
	font-weight: bold;
	color: #000066;
	text-align: left;
	display: block;
	float: left;
	}

#contactForm label.fieldLabel	{
	display: inline;
	float: none;
	}
	
#contactForm input.formInputField   {
	border: solid 1px #000066;
	background-color: #FFFFFF;
	color: #000000;
	margin: 0;
	padding: 2px;
	width: auto;
	}

#contactForm form input.basicSubmitButton {	
margin: 0;
padding: 5px 10px;
background: #BBCCEE;
border: 2px solid #000066;
}


fieldset#contactFormFieldset {
margin-top: 15px;
padding:0;
	margin:0;
	border: 0;
	width: auto;
}

/* html form#contactForm fieldset#contactFormFieldset {
margin-top: 15px;
padding:0;
	margin:0;
	border: 0;
		width: 65%;
}*/

* html fieldset#contactFormFieldset {
		width: 55%;
}

/*in normal state*/
#valid-firstName,
#valid-lastName,
#valid-subject,
#valid-email,
#valid-message {
background: #BBCCEE;
padding: 5px;
margin-bottom: -10px;
}

#input-valid-firstName,
#input-valid-lastName,
#input-valid-subject,
#input-valid-email,
#input-valid-message
{
	width: 265px;
	border: 1px solid #6666AA;
	background-color: #FFFFFF;
	color: #000000;
	margin: 0;
	padding: 2px;
	}
	
	
#input-valid-firstName p,
#input-valid-lastName p,
#input-valid-subject p,
#input-valid-email p,
#input-valid-message p
{
	
	color: #000000;
	}




/*
----------------------------------------------------------------------
paragaraphs
---------------------------------------------------------------------- 
*/


p.Paragraph-Warning {
border-top: 1px solid #FF0000;
border-bottom: 1px solid #FF0000;
padding: 2px 5px 0px 5px;
color: #000;
background: #FFCFCC;
margin: 10px 0;
}

p.Paragraph-Highlight {
border-top: 1px solid #608EE1;
border-bottom: 1px solid #608EE1;
padding: 2px 5px 0px 5px;
color: #000;
background: #F2F3FF;
margin: 10px 0;
}

p.PullQuoteLeft,
p.PullQuoteLeftWide,
p.BoxedLeftHalf {
float: left;
clear: left;
border: 1px solid #CACACA;
width: 20%;
padding: 10px;
background: #FAFAFF;
margin: 0 20px 10px 0;
}

p.PullQuoteLeftWide {
width: 33%;
}

p.BoxedLeftHalf {
width: 48.5%;
}



p.PullQuoteRight,
p.PullQuoteRightWide,
p.BoxedRightHalf  {
float: right;
clear: right;
border: 1px solid #CACACA;
width: 25%;
padding: 10px;
background: #FAFAFF;
margin: 0 0 10px 20px;
}

p.PullQuoteRightWide {
width: 33%;
}

p.BoxedRightHalf {
width: 48.5%;
}


p.Paragraph-Boxed {
background: #FAFAFF;
border: 1px solid #CACACA;
padding: 20px;
}

p.Paragraph-Boxed img {
margin-right: 10px;
}



p.BoxedRightHalf {
float: right;
clear: right;
border: 1px solid #CACACA;
width: 48.5%;
padding: 10px;
background: #FAFAFF;
margin: 0 0 10px 20px;
}


p.Paragraph-Rules {
border-top: 4px solid #BBCCEE;
border-bottom: 4px solid #BBCCEE;
padding: 10px 0;
margin: 20px 0;
}

p.indented {
margin: 20px 0px 20 60px;
}


.pagenotpublished a.pageNames
{
text-decoration: line-through;
}

form#contactForm p.alert {
color: red;
padding: 2px 0 8px 20px;
background: url(../images/alert.gif) 0 2px no-repeat;
overflow: visible;
line-height: 1.2em;
margin-top: 5px;
}


p#apply {
border: 2px solid #339933;
background: #CCFF99;
}

p#membersArea {
border: 2px solid #FF0000;
background: #FFCFCC;
}






/*
----------------------------------------------------------------------
layout/positioning - minor elements
----------------------------------------------------------------------  
*/



/*menu flyout*/

#mainMenu  {
	float: left;
	margin: 0;
	padding: 0;
	font-size:.8em;
	/*background: #F2F3FF;*/
	margin: 0 15px;
	}
	
	* html #mainMenu {
		margin: 0 7px;}

#mainMenu ul { /*affects sublists only*/
	float: left;
	padding: 0;
	width: 150px;
	border: 1px solid #608EE1;
	border-bottom: none;
	margin: 0;
	background: #F2F3FF;
	list-style-type: none; 
	}
	
* html #mainMenu ul { /*affects sublists only*/
	width: 130px;
	}

#mainMenu li { /* all list items */
	float : left;
	margin:0;
	padding: 0;
	border-bottom: 1px solid #608EE1;
	z-index: 98;
	width: 150px;
	}
	
* html #mainMenu li { /* all list items */
	width: 130px;
	}
	
	
#mainMenu li a {
	width: auto;
	color: #333399;
	font-weight : normal;
	text-decoration : none;
	background-color : transparent;
	padding : 2px 0px 4px 10px;
	margin: 0;
	line-height: 20px;
	display: block; 
	border-left: 20px solid #CCDDFF;
	}
	
#mainMenu li.flyoutTrigger a {
	background: url(../images/subpages_small_arrow.gif) 95% 50% no-repeat;
	}
	
#mainMenu li.flyoutTrigger a:hover {
	background: #FFF url(../images/subpages_small_arrow.gif) 95% 50% no-repeat;
	}
	
#mainMenu li.flyoutTrigger li:hover {
	background: #FFF;
	}
	
	#mainMenu li.flyoutTrigger li a {
	border-left: 20px solid #CCDDFF;
	}
	
* html #mainMenu li a {
white-space: normal;
	width: 100%;/*to display full-width-clickable*/
}

#mainMenu li ul { /* submenu 1 level lists */
	position : absolute;
	left: -999em;/*needed for opera*/
	margin-left : 115px;
	margin-top : -23px;/*position the flyouts vertically*/
	z-index: 99;
	width: 200px;
	}
	
#mainMenu li ul li { /* all list items */
	float : left;
	margin:0;
	padding: 0px 0px 0px 0px;
	border-bottom: 1px solid #608EE1;
	z-index: 100;
	width: 200px;
	}
	
#mainMenu li ul ul { /* submenu 2 level lists */
	left: -999em;
	/*margin-left : 135px;
	margin-top : -25px;*/
	z-index: 100;
	width: 200px;
	}
	
	
#mainMenu li ul li a {
white-space: normal;
	width: auto;
	}
	
* html #mainMenu li a {
	width: 100%;/*to display full-width-clickable*/
}

	
#mainMenu li a:hover,
#mainMenu li.flyoutTrigger li a:hover{
	color : #333399;
	text-decoration: none;
	background: #FFF;
	border-left: 20px solid #000066;
	}
	
#mainMenu li.flyoutTrigger li a, 
#mainMenu li.flyoutTrigger li a:hover{
	background: none;
	}

	
#mainMenu li:hover, #mainMenu li.sfhover  {
	background-color: #D1DEF6;
	}

#mainMenu li:hover ul ul, #mainMenu li:hover ul ul ul, #mainMenu li.sfhover ul ul, #mainMenu li.sfhover ul ul ul {
	left: -999em;
	}
	
#mainMenu li:hover ul, #mainMenu li li:hover ul, #mainMenu li li li:hover ul, #mainMenu li.sfhover ul, #mainMenu li li.sfhover ul, #mainMenu li li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
	margin-left: 148px;/*positioning the flyouts horizontally*/
	}
	
* html #mainMenu li:hover ul, * html #mainMenu li li:hover ul, * html #mainMenu li li li:hover ul, * html #mainMenu li.sfhover ul, * html #mainMenu li li.sfhover ul, * html #mainMenu li li li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
	margin-left: 158px;/*positioning the flyouts horizontally*/
	}

#mainMenu li.submenu {
	background: #F2F3FF;
	}
	
#mainMenu li.submenu a {
	background: url(../images/bullet_dark.gif) 0 0;
	}

#mainMenu li.submenu:hover, #mainMenu li.submenu.sfhover  {
	background-color: #D1DEF6;
	}












#membershipForm fieldset {
background: #FFFFFF;
padding: 20px 20px 20px;
margin: 30px 0;
border: 1px solid #5555AA;
width: auto;
font-size: .9em;
border: 3px double #ccc;
}

* html #membershipForm fieldset {
padding: 30px 20px 20px;
}

#membershipForm legend {
background: #5555AA;
padding: 2px 5px;
color: white;
font-weight: bold;
margin: 0;
}

* html #membershipForm legend {
margin-left: -6px;
}


#membershipForm legend.member {
background: #5555AA;
}

#membershipForm legend.staff {
background: #5555AA;/*D4892B*/
}

#membershipForm label {
font-size: 1em;
margin: 0;
padding: 0;
}

#membershipForm p {
margin: .4em 0;
padding: 0;
}

#membershipForm input.text_width_100 {
width: 200px;
}

#membershipForm input.text_width_150,
#membershipForm textarea.text_width_150{
width: 300px;
}

#membershipForm input.text_width_200,
#membershipForm textarea.text_width_200{
width: 400px;
}

#membershipForm input.text_width_50 {
width: 50px;
}

#membershipForm div.pullQuote {
float: right;
width: 150px;
background: #ffc;
}

#membershipForm div.pullQuote p {
font-size: 1em;
margin: 10px;
}

#membershipForm .spaced {
margin-bottom: 20px;
}

#membershipForm .mandatory {
background-color: #FFCC66;
}

#membershipForm input.spaced {
margin-bottom: 15px;
}

/*#membershipForm input, #membershipForm select, #membershipForm textarea {
margin-bottom: 10px;
}*/


.imgFramed {
border: 1px solid #CCC;
margin: 10px;
}





/*news scroller */

#news
{
	width:100%;
	background:#fff;
	border-bottom: 4px solid #ccc;
}

#news a
{

}

#news ul
{
	margin:0em 1em 1em 0em;
	padding:1em 1em 1em 0;
}

#news li{
	line-height:2em;
}
/* the news box when JavaScript is available */
#news.JSenabled
{
	height:220px;
	overflow:hidden;
	position:relative;
}
/* The nested UL when JavaScript is available */
#news.JSenabled ul
{
	position:absolute;
	top:220px;
	left:0;
	margin:0 .5em 0 0em;
	padding:0;
	list-style-type: none;
}

#news.JSenabled p#DOMnewsStopper
{
	display: none;
}

hr {
margin: 2px 0 10px 0;
}