/* CSS Document */

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#header {height: 32px;}

#header ul {margin-top: 0; padding: 10px 8px 0 0; list-style-type: none; float: right;}

/* #header ul ul {margin-top: 0; padding-top: 0;} */
  
#header li {float: right; background: url("../images/right.gif") no-repeat top right; padding: 0 5px 0 0; margin-left: 6px; position:relative;}
  
#header a {float: left; display: block; background: url("../images/left.gif") no-repeat left top; padding: 3px 8px 3px 13px; 
	text-decoration: none; font-weight: bold; color: #fff;}

/* #header ul ul a {padding-top: 0;} */

#header li:hover, #header li:focus {background-image: url(../images/right_on.gif);}
#header a:hover, #header a:focus {color: #CCC; background-image: url(../images/left_on.gif);}

#header #current {background-image: url("../images/right_on.gif");}
  
#header #current a {background-image: url("../images/left_on.gif"); color: #ccc; padding-bottom: 3px; padding-top: 6px;}
  
/* Commented Backslash Hack
   hides rule from IE5-Mac \*/
#header a {float: none;}
/* End IE5-Mac hack */


/*********Show to IE mac *************/
 /*\*//*/
 #header {height: 144px;}

#header ul {padding-top: 104px;}
/**/

/*
.menu {width:745px; height:32px; position:relative; z-index:100;border-right:1px solid #585752; font-family:arial, sans-serif;}
 hack to correct IE5.5 faulty box model 
* html .menu {width:746px; w\idth:745px;}
 remove all the bullets, borders and padding from the default list styling 
.menu ul {padding:0; margin:0; list-style-type:none;}
.menu ul ul {width:149px;}
 float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon 
.menu li {float:left; width:149px; position:relative;}

 style the links for the top level 
.menu a, .menu a:visited {display:block;font-size:12px;text-decoration:none; color:#fff; width:138px; height:30px; border:1px solid #585752; border-width:1px 0 1px 1px; background:#a6a299; padding-left:10px; line-height:29px; font-weight:bold;}
 a hack so that IE5.5 faulty box model is corrected 
* html .menu a, * html .menu a:visited {width:149px; w\idth:138px;}

 style the second level background 
#header ul ul a.drop, #header ul ul a.drop:visited {background:#d4d8bd url(http://www.cssplay.co.uk/menus/breadcrumbs/grey-arrow.gif) no-repeat 130px center;}
 style the second level hover 
#header ul ul a.drop:hover{background:#c9ba65 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;}
#header ul ul :hover > a.drop {background:#c9ba65 url(http://www.cssplay.co.uk/menus/breadcrumbs/blue-arrow.gif) no-repeat 130px center;}
 style the third level background 
#header ul ul ul a, #header ul ul ul a:visited {background:#e2dfa8;}
 style the third level hover 
#header ul ul ul a:hover {background:#b2ab9b;}


 hide the sub levels and give them a positon absolute so that they take up no room 
#header ul ul {visibility: hidden; position: absolute; height: 0; top: 31px; left: 0; width: 149px;}
 another hack for IE5.5 
* html #header ul ul {top:30px;t\op:31px;}

 style the table so that it takes no ppart in the layout - required for IE to work 
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

 style the second level links 
#header ul ul a, #header ul ul a:visited {background:#e5e1d6; color:#000; height:auto; line-height:1em; padding:5px 10px; width:150px;
	border-width:0 1px 1px 1px;}
 yet another hack for IE5.5 
* html #header ul ul a, * html .menu ul ul a:visited {width:150px;w\idth:128px;}

 style the top level hover 
#header a:hover, #header ul ul a:hover{color:#000; background:#fcd6a7;}
#header :hover > a, #header ul ul :hover > a {color:#000; background:#fcd6a7;}

 make the second level visible when hover on first level list OR link 
#header ul li:hover ul, #header ul a:hover ul, #header ul ul li:hover {visibility:visible;} 
*/

