/* ================================================================ 
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-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.menu { width:796px; height:51px; position:relative; z-index:100; text-align:left; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 16px; color: #000000; margin-left:7px; }

/* hack to correct IE5.5 faulty box model */
* html .menu { width:796px; w\idth:796px; }

/* remove all the bullets, borders and padding from the default list styling */
.menu ul { padding:0; margin:0; list-style-type:none; background-image:url(../../images/menu/bg.gif) !important; background-position:bottom; background-repeat:repeat-x; }

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li { float:left; position:relative; }
.menu .one { width:74px; }
.menu .two { width:100px; }
.menu .three { width:85px; }
.menu .four { width:88px; }
.menu .five { width:92px; }
.menu .six { width:128px; }
.menu .seven { width:114px; }
.menu .eight { width:115px; }

/* style the links for the top level */
.menu a { display:block; height:51px; line-height:51px; }
.menu .one a { width:74px; }
.menu .two a { width:100px; }
.menu .three a { width:85px; }
.menu .four a { width:88px; }
.menu .five a { width:92px; }
.menu .six a { width:128px; }
.menu .seven a { width:114px; }
.menu .eight a { width:115px; }
/* a hack so that IE5.5 faulty box model is corrected 
* html .menu a, * html .menu a:visited {width:149px; w\idth:138px;}
* html .menu a, * html .menu .home a:visited {  width:56px; }
* html .menu a, * html .menu .about a:visited {width:72px; }
* html .menu a, * html .menu .wines a:visited { width:58px; }
* html .menu a, * html .menu .newsReviews a:visited { width:118px; }
* html .menu a, * html .menu .ordering a:visited { width:72px; }
* html .menu a, * html .menu .contact a:visited { width:64px; }*/

/* style the second level background */
.menu ul ul a.drop {background:#d4d8bd url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;}

/* style the second level hover */
.menu ul ul a.drop:hover{background:#c9ba65 url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;}
.menu ul ul :hover > a.drop {background:#c9ba65 url(http://www.cssplay.co.uk/graphics/drop.gif) bottom right no-repeat;}

/* style the third level background */
.menu ul ul ul a { /*background:#FFF;*/ }

/* style the third level hover */
.menu ul ul ul a:hover { /*background:#FFF;*/ }

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:51px;left:0;}

/* another hack for IE5.5 */
* html .menu ul ul {top:51px;t\op:51px;}

/* position the third level flyout menu */
.menu ul ul ul{left:149px; top:-1px; width:300px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-149px;}

/* 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 top level hover */
/*.menu a:hover, */.menu ul ul a:hover{ color:#ff6600; /*background:#FFF;*/ }
/*.menu :hover > a, */.menu ul ul :hover > a { color:#ff6600; /*background:#FFF;*/ }

/* style the second level links */
.menu ul ul a { background:#FFF; color:#000; height:auto; width:auto; line-height:26px; text-decoration:none; border-left:solid 1px #eaeaea; border-right:solid 1px #eaeaea; }
.menu ul ul a:hover { color:#ff6600; }
.menu ul li .buying { width:135px; margin-left:0; }
.menu ul li .buying a  { width:135px; padding-left:25px; }
.menu ul li .selling { width:115px; margin-left:0; }
.menu ul li .selling a  { width:115px; padding-left:25px; }
.menu ul li .renting { width:158px; margin-left:0; }
.menu ul li .renting a  { width:158px; padding-left:25px; }
.menu ul ul .bottomLink a { padding-bottom:5px; background-image:url(../../images/menu/bg.gif) !important; background-position:bottom; background-repeat:repeat-x; }

/* yet another hack for IE5.5 */
/** html .menu ul ul a, * html .menu ul ul a:visited {width:118px;w\idth:118px;}*/

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

/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}

/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}