﻿/* CSS Document */
/*
This site was built by Brandwidth Marketing, however the original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk
Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.
*/
#topnav {font-family:arial;margin : auto; padding:0; position:relative; background:#fff; height:16px; background-color: #cc0a11; }

/* The nav styling */
/* Removes the bullets, margins and padding from the lists */
.nav, .nav ul {list-style-type:none; padding:0; margin:0; font-size:1em;}

/* Set up the size of the list items and float left to place inline */
.nav li.top {display:block; float:left; padding-right:5px; padding-top:2px; position:relative; background-color:#cc0a11;}

/* Style and position the table so it takes no part in the nav function. The font size is necessary for IE5.5 */
.nav table {border-collapse:collapse; width:0; height:0; position:absolute; top:-3px; left:0; }



/* Default link styling */
.nav li.top a {margin:0; padding:2px 8px; display:block; font-size:1.2em; float:left; text-decoration:none; color:#FFF; font-weight:bold }
.nav li.top a:hover {color:#000; /*background-color: #8fc84d;*/}



/* Style the list OR link hover. Depends on which browser is used */
.nav a:hover {visibility:visible; cursor:pointer; color:#000; background-color: #8fc84d;}
.nav li:hover { z-index:200;}

/* keep the 'next' level invisible by placing it off screen. */
.nav ul, 
.nav ul ul, 
.nav :hover ul :hover ul ul,
.nav :hover ul :hover ul :hover ul ul,
.nav :hover ul :hover ul :hover ul :hover ul ul {top:-999em; left:-999em; width:0; height:0; position:absolute;}

/* Style the drop down dropdown level links */
.nav :hover ul.dropdown {padding:0.5em 0 0 0; left:0px; top:18px; white-space:nowrap; *width:160px;min-width:160px; height:auto;}
.nav :hover ul.dropdown li {display:block; float:left;}




/*Main 1'st level Pop out size and colour*/
.nav :hover ul.dropdown li a {margin:0; padding:4px 8px 4px 8px; display:block; float:left;  font-size:8pt; color:#fff; text-decoration:none; background:#cc0a11; border:none; *width:175px;min-width:175px;} 
.nav :hover ul.dropdown li a:hover {background-color:#8fc84d; color:#000;}

.nav :hover ul.dropdown li.arrow a {background:#cc0a11; color:#fff}
.nav :hover ul.dropdown li.arrow a:hover {background:#8fc84d; color:#000;}

.separator{ border:0 none; clear:none}
li .arrow .separator{}

/*Put borders to final elements*/
.nav :hover ul.dropdown li a.final{}
.nav :hover ul.dropdown li a.final2{}
.nav :hover ul.dropdown li a.start2{ }

/*second level menu item popout */
.nav :hover ul.dropdown li.arrow ul li a {margin:0; padding:4px 8px 4px 8px; display:block; float:left; *width:160px;min-width:160px; font-size:8pt; color:#fff; text-decoration:none; background:#cc0a11; border:none;} 
.nav :hover ul.dropdown li.arrow ul li a:hover {background-color:#8fc84d; color:#000;}
.nav li ul.dropdown li.arrow:hover{background:#8fc84d; color:#000;}


/* show the red arrow for the parent when hover the childs */
.nav :hover ul li.arrow:hover a.popout {background:#8fc84d; color:#000;}

/* keep the parent selected when any child is selected*/
.nav :hover ul li:hover a.popout {background:#8fc84d; color:#000;}
.nav :hover ul li.arrow:hover ul li:hover a {background:#8fc84d; color:#000;}

/* Position the popoutouts */
/* second level pop out */
.nav :hover ul :hover ul {margin:0; padding:0; left:150px; top:5px; background:#fff; white-space:nowrap; width:1px; z-index:200; height:auto;}
/* third level pop out */
.nav :hover ul :hover ul :hover ul
{margin:0; padding:0; left:12.2em; top:0; background:#fff; white-space:nowrap; width:1em; z-index:300; height:auto;}

/*_____________ Adter xsl update additional styles ___________________ */
/*Style for selected items*/
.nav li.top ul li span.selected a{background:#8fc84d; color:#000;}
.nav :hover ul li.arrow span.selected a{background:#8fc84d; color:#000;}


/*Style for rollover*/
/*Depth 1 level menu*/
.nav :hover ul li a{background:#8fc84d; color:#000;}
.nav :hover ul li span.selected a{background:#8fc84d; color:#000;}
.nav :hover ul li:hover a{background:#8fc84d; color:#000;}
.nav :hover ul li:hover span.selected a{background:#8fc84d; color:#000;}


/*Depth 1 who has submenu */
.nav :hover ul li.arrow:hover a{background:#8fc84d; color:#000;}
.nav :hover ul li.arrow:hover span.selected:hover a{background:#8fc84d; color:#000;}
.nav :hover ul li.arrow:hover span a{background:#8fc84d; color:#000;}
.nav :hover ul li.arrow:hover ul li a{}


/*Depth 2 level menu*/
.nav :hover ul li.arrow:hover ul li span.selected a{background:#f5f9f4; color:#d4003a;}
.nav :hover ul li.arrow:hover ul li span.selected a:hover{ background:#ededed;}
.nav :hover ul li.arrow:hover ul li span.selected a{background:#f5f9f4; color:#d4003a;}
.nav :hover ul li.arrow:hover ul li:hover span.selected a{background:#ededed; color:#d4003a;}

.nav li.top a.selectedfinal {padding-right:0; border:none; color:#D4003A;}
.nav li.top a.selected {color:#D4003A;}

.nav :hover ul li.arrow span.selected ul li span.selected a{background:#f5f9f4; color:#d4003a; }
.nav :hover ul li.arrow span.selected a{color:#333; }





