/**************************************************************************************************************************
 *		
 *		ATVEA style sheet 
 *
 *		This stylesheet makes extensive use of various tricks to cujole the various versions of IE to work with 
 *		HTML that other browsers don't find too offensive.  Tables are used to format menus but use CSS for rollover 
 *		effects.  This CSS has been tested with IE 4, 5, 5.5, and 6,  also Netscape and Opera 7.
 *		
 *		Extensive use of the 'Tantek Hack' has been made to attempt to get downlevel versions of IE to render
 *		in as similar way as possible to level 6 browsers.  This trick enables a property to be set twice; once
 *		for IE5.5 and below,  and a second setting for level 6 browsers.  If the hack is used it is vital to include
 *		the (null) reset class immediately after the style otherwise IE5 or 4 will start randomly ignoring styles.
 *
 *		One other point is to stress that when pseudo selectors are used,  ensure that they're defined in LVHA order.
 *		Also,  certain rollovers are defined using pseudo selectors as they have greater specificity.
 *
 *		Credits: 
 *			Created by Glenn Gilbert - Stylesheets@Cobra-cms.com
 *			Tantek Celic for his super hack to keep IE5 & 5.5 happy
 *
 **************************************************************************************************************************/

 
body { margin:0; background: #fff url("Skins/ATVEA/pics/background_level2.gif") repeat-x; color:#000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.76em;	/* IE 5 & 5.5 will use this value */
	/* 	"Tantek hack". 	*/
	voice-family: "\"}\""; voice-family: inherit; 
	font-size: 0.82em;	/* Other (proper) browsers will use this value */
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }

h1 { font:bold large Arial, Helvetica, sans-serif; /* use arial, not verdana */
	color:#393; border-bottom:dashed 1px #393; margin-bottom:20px;
}
h2 { font-size:0.82em; font-weight:bold; color:#000; }
p, ul, ol {	color:#000; }

a:link 		{ color: #393; text-decoration: none; }
a:visited 	{ color: #396; text-decoration: none; }
a:hover 	{ color: #f00; text-decoration: underline; }
a:active	{ color: #f00; text-decoration: none; }

.bodyText { font-size:0.82em; color:#000; }

/*****************************************************************************************************
 *	Definitions for the logon/search area - uses fixed font sizes
 *****************************************************************************************************/
.tableSearch { background-color:#ccc; padding:0px; }
.tableLogin { background-color:#e6e6e6; padding:0px; }
.FormField { width:80px; font:normal 11px Arial, Helvetica, sans-serif; background-color:#fff; border:1px solid #999; }
.formButton { width:30px; margin:0; padding:0; font-size:10px; font:normal 11px Arial, Helvetica, sans-serif; 
				color:#333; background-color:#cdc; border:solid 1px #060; border-top-color:#cfc; border-left-color:#cfc; }
#LogoffButton { color:#333; /* stupid specificity trick to change the colour of a link */ }


/*****************************************************************************************************
 *	Footer definitions
 *****************************************************************************************************/
.footerText { color:#666; font-size:0.78em; }

.footerLink:link {		text-decoration:none; color:#666; font-weight:normal; }
.footerLink:visited {	text-decoration:none; color:#666; font-weight:normal; }
.footerLink:hover {		text-decoration:underline; color:#00f; font-weight:normal; }
.footerLink:active {	text-decoration:none; color:#cf9; font-weight:normal; }

.footerSelectedLink {	text-decoration:none; color:#666; font-weight:bold; }



/**************************************************************************************************************************
 *		
 *		Menu Styles
 *
 **************************************************************************************************************************/

/**************************************************************************************************************************
 *		Main menu styles - horizontal top-level menu
 *	Note that this menu uses fixed font sizes (enables site authors to accurately control the width of the menu)
 *	Bloody IE5.5 renders padding on anchors in tables,  but also falls for Tantek's hack.  So for its pleasure only... 	
 **************************************************************************************************************************/
/*		Main menu TD class applied to all TD spacer cells	*/
#TopNav .mainMenuSeparator { width:1px; background-color: #65BE2E; padding:4px 0; }

/*		Main menu TD class applied to all TD cells - selected and non-selected	*/
#TopNav .mainMenuTD { background:#65be2e url("pics/main_menu_back.gif") repeat-x; border:0; margin:0; 
	padding:3px 10px 1px 10px;
	/* 	"Tantek hack". 	*/
	voice-family: "\"}\""; voice-family: inherit;  
	padding:3px 0 1px 0;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }
#TopNav .mainMenuTDSelected { background-color:#65BE2E; border:0; margin:0; vertical-align:middle;
	padding:3px 10px 1px 10px;
	/* 	"Tantek hack". 	*/
	voice-family: "\"}\""; voice-family: inherit; 
	padding:3px 0 1px 0;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }

/*		anchor link tag for main menu when item is not selected (NOT in crumbtrail)		*/
#TopNav .mainMenuAnchor { font-size:11px; font-weight:bold; color:#000;	background-color:transparent; text-align:center; text-decoration:none; }
#TopNav .mainMenuAnchor:link { border:0;
	/**/
	padding:3px 1px 2px 1px;
	voice-family: "\"}\""; voice-family: inherit; 	/* IE5.5 ignores everything from here */
	padding:3px 10px 2px 10px;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }
#TopNav .mainMenuAnchor:visited { border: 0;
	/* 	Bloody IE5.5 renders padding on anchors,  but also falls for Tantek's hack.  So for its pleasure only... 	*/
	padding:3px 1px 2px 1px;
	voice-family: "\"}\""; voice-family: inherit; 	/* IE5.5 ignores everything from here */
	padding:3px 10px 2px 10px;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }
#TopNav .mainMenuAnchor:hover { border: 1px solid #cf9;
	/* 	Bloody IE5.5 renders padding on anchors,  but also falls for Tantek's hack.  So for its pleasure only... 	*/
	padding:2px 0 1px 0;
	voice-family: "\"}\""; voice-family: inherit; 	/* IE5.5 ignores everything from here */
	padding:2px 9px 1px 9px;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }
#TopNav .mainMenuAnchor:active { border:0;
	/* 	Bloody IE5.5 renders padding on anchors,  but also falls for Tantek's hack.  So for its pleasure only... 	*/
	padding:4px 1px 3px 1px;
	voice-family: "\"}\""; voice-family: inherit; 	/* IE5.5 ignores everything from here */
	padding:4px 10px 3px 10px;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }

#TopNav .mainSelectedMenuAnchor { font-size: 11px; font-weight:bold; color:#cf9; background-color:#65BE2E; text-align:center; text-decoration:none; border:0;
	/* 	Bloody IE5.5 renders padding on anchors,  but also falls for Tantek's hack.  So for its pleasure only... 	*/
	padding:3px 0;
	voice-family: "\"}\""; voice-family: inherit; 	/* IE5.5 ignores everything from here */
	padding:3px 10px;
}
.Tantek_Hack_Reset { /*	A null class to force supid early browsers to wake up from the hypnotic Tantek hack.	*/ }



/**************************************************************************************************************************
 *
 *	Left-hand navigation menu - 'standard format';  contained in the ContentArea to float left.
 *	Displayed as a vertical menu of lists in lists.
 *
 *	Design Notes: 
 *		The design calls for bullets on menu items and no bullet on titles.  The challenge is we can't use list-style-image 
 *		as there's no way of controlling positioning of the list image & width that is consistent across browsers (IE bugs
 *		as ever!).  Therefore we have to set the list style to none, and set things manually using padding and set a 
 *		background image on anchor items.  Positioning,  of course,  will kick over those nausiating IE 5 and 5.5 browser's 
 *		broken box model. Grr.
 *		This technique requires the list-styles to be turned off,  and then set the background to show the bullet image.
 *		As there's no bullet for titles, the bullet image is set on the anchor rather than the list item.  The indents
 *		are handled manually; setting the box width, padding, and bullet image x-offset. Need to use block displays
 *		to enable padding and the L1 title underline to work.
 *
 **************************************************************************************************************************/
div#LeftNav { background:#fff; margin:0; padding:0; width:140px; }

/*	L1	*/
div#LeftNav ul { margin:0; padding:0; border:0; }
div#LeftNav ul li { display:inline; list-style:none outside; list-style-image:none; font-weight:bold; color:#393;/* catch-all colour */ }
div#LeftNav ul li#LeftNavFirstItem { padding:0; /* don't display the top padding on the first menu item */ }	
div#LeftNav ul li.Title { display:block; width:140px; padding:1em 0 0 0; list-style-image:none; border-bottom:1px dotted #393; color:#333; font-weight:bold; font-variant:small-caps; }
div#LeftNav ul li a { display:block; width:125px; padding-left:15px; background:#fff url("pics/LeftNavBullets.gif") 0 0.4em no-repeat; text-decoration:none; }
div#LeftNav ul li a:link { color:#393; }
div#LeftNav ul li a:visited { color:#6a6; }
div#LeftNav ul li a:hover { text-decoration:underline; }
div#LeftNav ul li a:active { color:#f66; background-color:#fdd;}

/* L2	*/
div#LeftNav ul ul { margin:0; padding:0; border:0; }
div#LeftNav ul ul li { display:inline; list-style:none outside; list-style-image:none; background-color:#f9f; color:#393; }
div#LeftNav ul ul li.Title { display:block; width:110px; padding:0 0 0 15px; list-style:none outside; list-style-image:none; color:#000; font-weight:bold; font-variant:small-caps; }
div#LeftNav ul ul li a { display:block; width:110px; padding-left:30px; background:#fff url("pics/LeftNavBullets.gif") 15px 0.4em no-repeat; color:#393; text-decoration:none; font-weight: normal; }
div#LeftNav ul ul li a:link { color:#393; }
div#LeftNav ul ul li a:visited { color:#6a6; }
div#LeftNav ul ul li a:hover { text-decoration:underline; }
div#LeftNav ul ul li a:active { color:#f66; background-color:#fdd; }

/*	L3	*/
div#LeftNav ul ul ul { margin:0; padding:0; border:0; }
div#LeftNav ul ul ul li { display:inline; list-style:none outside; list-style-image:none; background-color:#f9f; color:#393; }
div#LeftNav ul ul ul li.Title { display:block; border:0; padding:0 0 0 15px; list-style:none outside; list-style-image:none; color:#000; font-weight:normal; font-variant:small-caps; }
div#LeftNav ul ul ul li a { display:block; width:95px; padding-left:45px; background:#fff url("pics/LeftNavBullets.gif") 30px 0.4em no-repeat; color:#393; text-decoration:none; font-weight: normal; }
div#LeftNav ul ul ul li a:link { color:#393; }
div#LeftNav ul ul ul li a:visited { color:#6a6; }
div#LeftNav ul ul ul li a:hover { text-decoration:underline; }
div#LeftNav ul ul ul li a:active { color:#f66; background-color:#fdd; }

/*	Left-nav rollover background colour	- to override, include in the a:hover in each menu level */
div#LeftNav a:hover { background-color:#dfd; }
/*	Left-nav crumbtrail colours	*/
div#LeftNav a.LeftNavCrumbTrail { background-color:#cfc; text-decoration: none; }
div#LeftNav a.LeftNavCrumbTrail:hover { background-color:#cfc; text-decoration: underline; }