/*
colours
	003366 - dark blue
	336699 - ESS blue	
	ffcc66 - gold - table
	cc9933 - gold - bullet
	993300 - dark gold 'self' bullet
	996600 - brown
	f8d58b - orange
*/

/*these colours conform to the 25-year old obsolete standard for Web-safe colours, as required for CLF*/

/*------------------------------------------------------*
 | generic styles					|
 *------------------------------------------------------*/
body
	{
		color:		#000000; 
		background:	#ffffff; 
		font-family:	arial, helvetica, sans-serif;
		margin-top:	0;
		margin-left:	3px;	/* cheat on this a bit - it looks better than 0*/
	}

/*netscrape 4 doesn't recognize 'font-family' in 'body'*/
body,p,th,td,caption,ul,ol,li,dl,dt,dd,div,span,a,dir,blockquote,cite,h1,h2,h3,h4,h5,h6
	{	font-family: arial, helvetica, sans-serif; 
		font-size: 10pt;
	}

body,p,td,th,ol,ul,li,dl,dt,dd,div,span,a,dir,blockquote,cite { font-size: 10pt; }

/*h1 & h2 are the same as esst_pagetitle, esst_pagetitle2*/
h1 { font-size: 14pt; color: #003366;background: white}
h2 { font-size: 12pt;}
h3 { font-size: 11pt;}
h4 { font-size: 10pt;}
h5 { font-size: 9pt;}
h6 { font-size: 8pt;}


h1,h2,h3,h4,h5,h6,dir,ul,ol {	margin-bottom: 		0;}
ol,ul {				margin-top:		0; }

caption {	font-weight: bold; }
dt {		margin-top:  10px;
		font-weight: bold; }

img	{	border-width: 0px; }
a img	{	border-width: 1px; }


/*'hover' MUST appear after 'link' & 'visited' */
a:link
	{
		color:		#003366;	/*#336699;	/*intranet: 003366*/
		background:	transparent;
		font-weight:	bold;
	}

a:visited
	{
		color:		#336699;	/*#9999cc;	/*intranet: 336699*/
		background:	transparent;
		/*font-weight:	bold;*/
	}

a:hover
	{
		color:		 #336699;	/*intranet: 003366*/
		background:	transparent;
		text-decoration: none;
	}

a:active
	{
		color:		#993300;	/*intranet: 996600*/
		background:	transparent;
		/*font-weight:	bold;*/
	}


a.simplelink:link {	font-weight:	normal}
a.simplelink:hover
	{
		color:		#336699;
		background:	transparent;
		text-decoration:none;
	}



/*------------------------------------------------------*
 | top CLF nav bar					|
 | - 1=top black bar, 2=bottom blue bar			|
 | - 'w' - smaller text for long text links		|
 |							|
 | The 'td' styles govern the appearance of the cell	|
 | The 'a' styles govern the appearance of the link text|
 *------------------------------------------------------*/
td.clfbar1,td.clfbar1w
	{
		color:		white;
		background:     black;
		/*
		border-left:	black 1px solid;
		border-top:	black 1px solid;
		border-bottom:	black 1px solid;
		border-right:	black 1px solid;
		*/
		text-align:	left;
	}

td.clfbar2,td.clfbar2w
	{
		color:		white;
		background:     #336699;
		/*
		border-left:	#6699cc 1px solid;
		border-top:	#6699cc 1px solid;
		border-bottom:	black 1px solid;
		border-right:	black 1px solid;
		*/
		text-align:	left;

	}

a.clfbar1,a.clfbar2,a.clfbar1w,a.clfbar2w,
span.clfbar1,span.clfbar2,span.clfbar1w,span.clfbar2w
	{
		font-family:		arial,helvetica,sans-serif;
		font-weight:		bold;
		text-decoration: 	none;
	}

a.clfbar1,a.clfbar2,span.clfbar1,span.clfbar2
	{	font-size:		11px;	}	/* normal text size*/

a.clfbar1w,a.clfbar2w,span.clfbar1w,span.clfbvar2w
	{	font-size:		10px;	}	/* smaller font for longer text*/


a.clfbar1,a.clfbar2,a.clfbar1w,a.clfbar2w
	{	width:			100%; }

/* link text colour for top bar */
a.clfbar1, a.clfbar1:link, a.clfbar1:visited, a.clfbar1:hover, a.clfbar1:active, 
a.clfbar1w,a.clfbar1w:link,a.clfbar1w:visited,a.clfbar1w:hover,a.clfbar1w:active,
span.clfbar1,span.clfbar1w
	{
		color:		white;
		background:	black;
		text-decoration:none;
	}

/* link text colour for bottom bar */
a.clfbar2, a.clfbar2:link, a.clfbar2:visited, a.clfbar2:hover, a.clfbar2:active,
a.clfbar2w,a.clfbar2w:link,a.clfbar2w:visited,a.clfbar2w:hover,a.clfbar2w:active,
span.clfbar2,span.clfbar2w
	{
		color: 			white;
		background:		#336699;
		text-decoration: 	none;
	}

span.clfbar1,span.clfbar2,span.clfbar1w,span.clfbar2w
	{
		cursor:			default;
	}


span.clfbar1_inline,
a.clfbar1_inline,
a.clfbar1_inline:link,
a.clfbar1_inline:visited,
a.clfbar1_inline:active,
a.clfbar1_inline:hover
	{
		color:		white;
		background:     black;
		/*
		border-left:	black 1px solid;
		border-top:	black 1px solid;
		border-bottom:	black 1px solid;
		border-right:	black 1px solid;
		*/
		font-family:	arial,helvetica,sans-serif;
		font-weight:	bold;
		text-decoration:none;
		font-size:	12px;
	}

span.clfbar2_inline,
a.clfbar2_inline,
a.clfbar2_inline:link,
a.clfbar2_inline:visited,
a.clfbar2_inline:active,
a.clfbar2_inline:hover
	{
		color:			white;
		background:     	#336699;
		border-left:		#6699cc 1px solid;
		border-top:		#6699cc 1px solid;
		border-bottom:		black 1px solid;
		border-right:		black 1px solid;
		font-family:		arial,helvetica,sans-serif;
		font-weight:		bold;
		text-decoration: 	none;
		font-size:		12px;
	}



span.highlight_text,
span.highlight_text_yellow
	{
		color:		black;
		background:	#ffff00;
	}
span.highlight_text_cyan
	{
		color:		black;
		background:	#00ffff;
	}
span.highlight_text_magenta
	{
		color:		black;
		background:	#ff66ff;	/*ff00ff is too dark*/
	}
span.highlight_text_green
	{
		color:		black;
		background:	#00ff00;
	}



/*------------------------------------------------------*
 | left & right side					|
 *------------------------------------------------------*/
.esst_leftside_menutitle {
		color:		white;
		background:	#336699;	/*intranet: 003366*/
		font-weight:	bold;
		font-size:	14px;
		width:		100%;
	}

.esst_rightside_menutitle {
		color:		white;
		background:	#003366;
		font-weight:	bold;
		font-size:	14px;
		font-style:	italic;
	}


.esst_leftside_grouptitle,
a.esst_leftside_grouptitle,
a.esst_leftside_grouptitle:link,
a.esst_leftside_grouptitle:visited,
a.esst_leftside_grouptitle:active
	{
		color:			white;
		background:		#336699;	/*intranet 003366*/
		font-weight:		bold;
		font-size:		12px;
		width:			100%;
		text-decoration: 	none;
		/*
		border-width:		1px;
		border-color:		#336699;	intranet 003366
		border-style:		solid;
		*/
		padding:		0px;
	}

a.esst_leftside_grouptitle:hover
	{
		color:			#336699;	/*intranet 003366*/
		background:		white;
		font-weight:		bold;
		font-size:		12px;
		width:			100%;
		text-decoration: 	none;
		border-width:		1px;
		border-color:		#336699;	/*intranet 003366*/
		border-style:		solid;
		padding:		0px;
}


.esst_rightside_grouptitle,
a.esst_rightside_grouptitle,
a.esst_rightside_grouptitle:link,
a.esst_rightside_grouptitle:visited,
a.esst_rightside_grouptitle:active
	{
		color:			#996600;
		background:		transparent;
		font-weight:		bold;
		font-size:		12px;
		text-decoration: 	none;
		width:			100%;
	}

a.esst_rightside_grouptitle:hover
	{
		color:			white;
		background:		#996600;
		font-weight:		bold;
		font-size:		12px;
		width:			100%;
	}


a.esst_leftside_link,a.esst_rightside_link {
		color:			#003366;	/*#336699;	intranet 003366*/
		background:		white;
		font-weight:		bold;
		font-size:		12px;
		text-decoration:	none;
		}

a.esst_leftside_link:visited,a.esst_rightside_link:visited {
		color:			#336699;	/*#336699;	intranet 003366*/
		background:		white;
		font-weight:		bold;
		font-size:		12px;
		text-decoration:	none;
		}

a.esst_leftside_link:hover,a.esst_rightside_link:hover {
		color:			white;
		background:		#336699;	/*intranet 003366*/
		/*text-decoration:	none; */
	}

.esst_leftside_self,.esst_rightside_self {
		color:			#993300;	/*intranet black*/
		background:		white;
		font-weight:		bold;
		font-size:		12px;
	}

.esst_leftside_text,.esst_rightside_text {
		color:			black;
		background:		white;
		font-size:		12px;
	}

.esst_leftside_menutitle_button
	{
	}

.esst_leftside_grouptitle_button,a.esst_leftside_grouptitle_button
	{
	}

.esst_leftside_link_button,a.esst_leftside_link_button
	{
	}

.esst_leftside_self_button,a.esst_leftside_self_button
	{
	}

.esst_leftside_text_button,a.esst_leftside_text_button
	{
	}


hr,hr.center50,hr.centre50,hr.left50,hr.right50
	{
		color:		#993300;	/*intranet: 336699*/
		background:	white;
		height:		1px;
		text-align:	center;
	}

hr.left50
	{
		text-align: left;		/*this will align it left for IE*/
		margin: 0 auto 0 0;		/*this will align it left for Mozilla*/
	}

hr.right50
	{
		text-align: right;		/*this will align it right for IE*/
		margin: 0 0 0 auto;		/*this will align it right for Mozilla*/
	}

hr.center50,hr.centre50,hr.left50,hr.right50
	{
		width:		50%;
	}

hr.belowbreadcrumbs
	{
		color:		#ffcc00;	/*intranet: 993300*/
		background:	white;
		height:		1px;
	}

hr.esst_leftside_hr
	{
		color:		#993300;	/*intranet 003366 */
		background:	white;
		height:		1px;
	}

hr.esst_rightside_hr
	{
		color:		#cc9933;
		background:	transparent;
		height:		1px;
	}


hr.esst_leftside2_hr
	{
		color:		#336699;
		background:	white;
		height:		2px;
	}

/*????USED????*/
hr.esst_printversion_hr
	{
		color:		#336699;
		background:	white;
		height:		2px;
	}

hr.esst_footer_hr
	{
		color:		#336699;
		background:	white;
		height:		2px;
	}

hr.esst_rightside_hr_mylinks
	{
		color:		#cc9933;
		background:	transparent;
		height:		2px;
	}



a.esst_linktop, a.esst_linktop:link, a.esst_linktop:visited, a.esst_linktop:hover, a.esst_linktop:active
	{
		color:			white;
		background:     	#336699;
		font-family:		arial,helvetica,sans-serif;
		font-weight:		bold;
		text-decoration: 	none;
		font-size:		8pt;
	}


/*not used - had to do box with double table - see _esst.php 
	.esst_rightside_menubox
	{
		margin:			0px;
		padding:		0px;
		border-width:		5px;
		border-style:		solid;
		border-color:		#996600;
		background:		#f4f4ec;	- old colour
	}
*/


/*netscape ignores the colours but does the rest*/
.esst_leftside_selector,.esst_rightside_selector
	{
		color:		#336699;	/*intranet 003366*/
		background:	white;
		font-weight:	bold;
		font-family:	arial,helvetica,sans-serif;
		font-size:	10px;
	}

form.esst_form_nomargins
	{
		margin-top:		0;
		margin-bottom:		0;
	}


/*--------------------------------------*
 | page titles				|
 *--------------------------------------*/
.esst_pagetitle	{
		color:		#003366;
		background:	white;
		font-size:	14pt;
		font-family:	arial,helvetica,sans-serif;
		font-weight:	bold;
		text-align:	center;
	}

.esst_pagetitle2 {
		color:		black;
		background:	white;
		font-size:	12pt;
		font-family:	arial,helvetica,sans-serif;
		font-weight:	bold;
		text-align:	center;
	}

.esst_pagetitle2left {
		color:		black;
		background:	white;
		font-size:	12pt;
		font-family:	arial,helvetica,sans-serif;
		font-weight:	bold;
		text-align:	left;
	}


/*--------------------------------------*
 | boxes, panels, tables		|
 *--------------------------------------*/
/*leave the 'caption' element normal size - only small for td/th*/
.esst_small,table.esst_table_small td, table.esst_table_small th, option.textdividersmall
	{
		font-size:	8pt;
	}

.esst_smallest,table.esst_table_smallest td, table.esst_table_smallest th
	{
		font-size:	7pt;
	}


table.esst_table, table.esst_table_small, table.esst_table_smallest
	{
		color:		black;
		background:	white;		/*#fffffd preferred, but illegal*/
		border-width:	1px;
		border-color:	#ffcc66;	/*intranet cc9933*/
		padding:	2px;
	}

table.esst_table th, table.esst_table_small th, table.esst_table_smallest th, tr.esst_datatable_header
	{
		color:		#000066;
		background:	#f8d58b;	/*pale yellow - #ffffcc, fff0c0; preferred, but illegal*/
		border-left:	#ffcc99 1px solid;
		border-top:	#ffcc99 1px solid;
		border-bottom:	#cc9900 1px solid;
		border-right:	#cc9900 1px solid;
	}


table.esst_highlights {
		color:		black;
		background:	white;		/*#fff0c0; preferred, but illegal*/
		border:		1px solid #cc9900;
	}

table.esst_highlights th {
		color:		#000066;
		background:	#f8d58b;	/* pale yellow - #ffffcc; #fff0c0 preferred, but illegal*/
		font-weight:	bold;
		font-style:	italic;
		text-align:	left;
		border-left:	#ffcc99 1px solid;
		border-top:	#ffcc99 1px solid;
		border-bottom:	#cc9900 1px solid;
		border-right:	#cc9900 1px solid;
	}


table.images td {	border:			1px dotted #336699; }


/* ffffcc & ccffff are too bright*/
/*
1px matches PICFRAME_FRAMETHICKNESS in _esst.php
4px matches PICFRAME_PADDING in _esst.php
*/
table.esst_picframe	{
		color:		black;
		background:	#fffff8;		/*#ffffcc;	#fffff8 preferred, but illegal*/
		border:		1px solid #000099;
		padding:	4px;
	}


table.esst_sidebar {
		color:		black;
		background:	#fffff8;		/*#ffffcc;	#fffff8 preferred, but illegal*/
		border:		1px dashed #000099;
		padding:	4px;
	}

/*used by _showtabledata.php */
/*tr.esst_datatable_header - see above */
tr.esst_datatable_oddrow {	background: white;	color: black;}
tr.esst_datatable_evenrow{	background: #cccccc;	color: black;}
td.esst_datatable_sortcol{	background: #ffffcc;	color: black;}

tr.esst_oddrow {		background: white;	color: black;}
tr.esst_evenrow{		background: #cccccc;	color: black;}

option.textdivider, option.textdividersmall
	{
		color:		#000099;
		background:	#ffcc66;
		font-weight:	bold;
	}


/* planned, but never implemented
.esst_sidebarcontent{
		color:		black;
		background:	white;
		border-width:	1px;
		border-color:	#336699;
		border-style:	solid;
		width:		100%;
		padding:	2px;
}
*/

/*----------------------------------------------------------------------*
 | styles for form controls to ensure width is the same for both	|
 | browsers								|
 | (a) style 'width' (% or px) is ok in MSIE, but Netscape ignores it	|
 | (b) MSIE uses the requested font type, Netscape ignores it and always|
 |     uses fixed-pitch font						|
 *----------------------------------------------------------------------*/
input.esst_textinput,
input.esst_textinputright
	{
		font-family: 'Courier New', monospace;
	}
input.esst_textinputright
	{
		text-align: right;
	}

input.badparameter
	{
		color:		white;
		background:	red;
	}

 
/*----------------------------------------------------------------------*
 | special boxes (these are 98% width so the right side isn't clipped)	|
 *----------------------------------------------------------------------*/
.esst_tip
	{
		color:		black;
		background:	white;
		border-width:	1px;
		border-color:	#996600;	/*intranet: cc9933*/
		border-style:	dotted;
		width:		98%;
		margin:		0;
		text-align:	left;
		padding:	2px;
	}

.esst_alert
	{
		color:		black;
		background:	white;
		border-width:	1px;
		border-color:	red;
		border-style:	solid;
		width:		98%;
		text-align:	left;
		padding:	2px;
	}

.esst_alert2
	{
		color:		red;
		background:	white;
		margin-top:	10px;
		margin-bottom:	10px;
		border-width:	3px;
		border-color:	red;
		border-style:	double;
		font-weight:	bold;
		text-align:	left;
		width:		96%;
		padding:	2px;
	}

.esst_feature
	{
		color:		black;
		background:	white;
		border-width:	3px;
		border-color:	#336699;
		border-style:	double;
		text-align:	left;
		width:		96%;
		padding:	5px;
	}


.blueframe {
		color:		black;
		background:	white;
		border-width:	1px;
		border-color:	#336699;
		border-style:	solid;
		width:		99%;
	}

.esst_rightside_menuframe
	{
		color:		black;
		background:	#fffffd;
		border-width:	1px;
		border-color:	#003366;
		border-style:	solid;
		width:		99%;
	}

.esst_youwerehere
	{
		color:		red;
		background:	white;
		border-width:	1px;
		border-color:	red;
		border-style:	solid;
	/*	width:		100%;	truncates on right in MSIE */
		padding:	2px;
	}

.esst_youarehere
	{
		color:		#993300;
		background:	white;
		border-width:	1px;
		border-color:	#993300;
		border-style:	solid;
		padding:	2px;
	}

.esst_downloadsize
	{
		color:		black;
		background:	white;		/*#cccccc too dark, #eeeeee preferred but illegal*/
		border-bottom:	1px dotted red;
		/*font-weight:	bold; */
		cursor:		help;
		font-size:	8pt;
	}

acronym
	{
		color:		black;
		background:	white;	/*#cccccc too dark, #eeeeee preferred but illegal*/
		border-bottom:	1px dotted #336699;
		/*font-weight:	bold; */
		cursor:		help;
	}


/* horizontal bar for page sections - use emitsectiontitle()*/
div.esst_bar,tr.esst_bar,th.esst_bar,td.esst_bar
	{
		color:		white;
		background:	#336699;
		font-weight:	bold;
		font-style:	italic;
		border-left:	#6699cc 2px solid;
		border-top:	#6699cc 2px solid;
		border-bottom:	black 2px solid;
		border-right:	black 2px solid;
		padding-left:	5px;
		width:		100%;
	}

.esst_new, .esst_updated
	{
		color:		red;
		background:	transparent;
		font-family:	'comic sans ms',fantasy,sans-serif;
		font-weight:	bold;
		font-style:	italic;
		font-size:	8pt;
	}

/*emitrequiredfield()*/
.esst_requiredfield
	{
		color:		red;
		background:	transparent;
		font-weight:	bold;
		font-style:	italic;
	}

/*emitfootnote()*/
.esst_footnote
	{
		color:		red;
		background:	transparent;
		font-weight:	bold;
		font-style:	italic;
		vertical-align: super;
	}



/*----------------------------------------------------------------------*
 | generic styles							|
 *----------------------------------------------------------------------*/
.textcenter,.textcentre
		{	text-align:	center;	}
.textright	{	text-align:	right;	}
.dirindent	{	margin-left:	30px	}
.strong		{	font-weight:	bold;	}
.italic,.italics{	font-style:	italic;	}

.nowrap		{	white-space:	nowrap;	}

br.clear	{	clear: both;		}
 
.breadcrumb	{	font-size:	8pt;	}

.red,    .redbold	{	color:	#ff0000; background: transparent;}
.green,  .greenbold	{	color:	#00cc00; background: transparent;}	/*00ff00 is too light on white background*/
.blue,   .bluebold	{	color:	#0000ff; background: transparent;}
.cyan,   .cyanbold	{	color:	#00ffff; background: transparent;}
.magenta,.magentabold	{	color:	#ff00ff; background: transparent;}
.yellow, .yellowbold	{	color:	#ffff00; background: transparent;}
.purple, .purplebold	{	color:	#660066; background: transparent;}

.redbold,.greenbold,.bluebold,.cyanbold,.magentabold,.yellowbold,.purplebold
		{	font-weight:	bold;
		}

img.noborder	{	border:		none;	}
img.border	{	border:		1px solid black; }

.serif		{	font-family:	'Times New Roman', serif; }

ul.doublespace li, ol.doublespace li {
			margin-bottom:	2em; }
li.spaceabove {		margin-top:	2em; }


/*----------------------------------------------------------------------*
 | 3d buttons on splash page						|
 *----------------------------------------------------------------------*/
td.splashpage_button
	{
		color:		white;
		background:	#ff0000;
		border-top:     3px solid #ff6666;
		border-left:    3px solid #ff6666;
		border-right:   3px solid #990033;
		border-bottom:  3px solid #990033;
	}

td.splashpage_button a,
a.splashpage_button:link,
a.splashpage_button:visited,
a.splashpage_button:hover,
a.splashpage_button:active
	{
		color:		white;
		background:	#ff0000;
		width:		100%;
		font-weight:	bold;
		font-family:	arial,helvetica,sans-serif;
		text-decoration:none;
	}

.splashpage_subtitle
	{
		color:		#336699;	/*#000066, #663300; - for new image */
		background:	white;
		font-family:	arial,helvetica,sans-serif;
		font-weight:	bold;
		font-size:	11pt;
	}

a.splashpage_noticelink
	{
		font-size:	8pt;
	}