﻿/* links */
ul.horizontal a, ul.horizontal a:visited {
	display:block;
	cursor:pointer;
	cursor:hand;
	background:#ffc;
	border:1px solid Black;
	padding:5px 7px;
	font:normal normal 1em Trebuchet MS, verdana, sans-serif;
	background-color: #AA0A09;          /* Menu Color */
	color: #fff;
	text-decoration:none;
	letter-spacing:1px;
	}
	
/* rollover pseudo-classes, and scriptable persistence class */
ul.horizontal a:hover, ul.horizontal a:focus, ul.horizontal a.rollover, ul.horizontal a.rollover:visited {
	background-color: #90939a;              /* Mouse over color */
	color: Black;
	}



/* tame the lists */
ul.horizontal, ul.horizontal li {
	margin:0;
	padding:0;
	list-style-type:none;
	font-size:100%; /* fix for win/ie's "non-linear text scaling" bug */
	}


/* navbar list */
ul.horizontal {
	width:50%;
	cursor:default;
	z-index:2000;
	}


/* navbar list-items */

ul.horizontal li {
	float:left;
	position:relative;
	cursor:pointer;
	cursor:hand;
	text-align:left;
	top:0px;
	margin:0 0 0 -px;   /* shift list-items to collapse borders horizontally */
	}
	
/* we have to use a different positioning trick for ie, so: 
   - set the two values below to reflect the navbar items' left position,  
   - then reduce the margin-left value by 1px (approx 0.05em)  
     to re-apply the list-item border-collapse */
* html ul.horizontal li {
	margin:0 -10.55em 0 10.5em;
	}

/* we also need to use the same trick for safari < 1.2, so 
   - apply the same values again 
   we're also increasing the border-collapse and compensation slightly
   to cover for a float-related rounding-error in mozilla and safari 
   this is using a substring-matching attribute selector 
   which is also visible to safari 1.2, konqueror, mozilla and osx/msn  
   but that's okay, because it still works 
   we can't do that for everybody, because it breaks in opera */
ul[class^="horizontal"] li {
	/* margin:0 -10.55em 0 10.45em; */
	 margin-left:1px;
	left:1px;
	top:5px;
	}

/* menu lists */
ul.horizontal ul {
	z-index:2020;
	padding:0;
	cursor:default;
	position:absolute;
	font-family: Century, Verdana;	
	
	/* menu width */
	width:175px;
	
	/* menu offset, which already includes 1px compensation for list-item border collapse */
	margin:110 0 0 0;
	left:-10000px;
	/* trbl */
	}
	
	
/* menu list-items */
ul.horizontal ul li {
	/* duplicate menu width */
	width:225px;
	height:25px;
	}

/* you can use <ul> classes to specify different menu widths */
ul.horizontal ul.wide, ul.horizontal ul.wide li {
	width:250px;
	}


/* you can use <ul> classes to specify different menu widths */
ul.horizontal ul.wider, ul.horizontal ul.wider li {
	width:320px;
	}

/* you can use <ul> classes to specify different menu widths */
ul.horizontal ul.normal, ul.horizontal ul.narrow li {
	width:200px;
	}


/* you can use <ul> classes to specify different menu widths */
ul.horizontal ul.narrow, ul.horizontal ul.narrow li {
	width:160px;
	}


/* further child-menu offset */
ul.horizontal ul ul {
	/* this DOES NOT already include 1px compensation on TOP and LEFT, for list-item border collapse (1px defaults to around 0.05em) */
	margin: 0 0 0 180px; /* overlapping menu */
	}

/* menu triggers -- position menus back on the screen to show 
   hide these from safari < 1.2 because of it's "sticky hover" bug 
   and because the menu positioning doesn't work
   using the "@media with Media Type in Mixed Case" hack
   http://www.dithered.com/css_filters/css_only/media_mixed_case.html */
@media Screen, Projection { 
	ul.horizontal li:hover > ul { left:-2px; top:20px }
	ul.horizontal ul li:hover > ul { left:10px !important;top:-3px !important;}
	}

/* but it would break other browsers, so we need to negate it  using a rule that's hidden from them with the "@media with Media Type in Mixed Case" hack
   http://www.dithered.com/css_filters/css_only/media_mixed_case.html */
@media Screen, Projection { ul.horizontal a { float:none; } }

/* msn/osx can see through that, but needs the float as well,  so re-apply it using the "not my child" hack
   http://www.jasonkarldavis.com/articles/notmychild/ */
ul.horizontal a:not(:nth-child(n)) { float:left; }

/* compensate submenus, using !important to increase specificity for osx/msn */
ul.horizontal ul a { float:none !important; }

