/*
	Suckerfish menu, Paul 8/6/2006
	This is for the Suckerfish menu from http://www.htmldog.com/articles/suckerfish/dropdowns/
	The sfhover class is produced by Javascript whenever a menu item is rolled over so that it
	will work in Internet Explorer as well.
*/

/*POSITIONS AREAS OF THE WORLD IN THE SIDEBAR - no bullet points ETC */
ul.sfnav  {list-style-type: none; margin: 0; padding: 0; width: 135px;} 

/*This controls the top level menu - AREAS OF THE WORLD*/
ul.sfnav li {float: left; width: 135px;  
font-size: 0.7em; 
margin-top:0; 
border-top: 1px solid #fff; 
padding: 4px 0 4px 0;
background-color:#333;
}/*so Opera doesn't throw a wobbly*/




/*POSITIONS CHILD MENU - no bullet points ETC. The -15px aligns the top of child with top of parent */
ul.sfnav ul  {list-style-type: none; margin: -42px 0 0 0; padding: 0;  
/* placing background-color:#cc0000; here reveals IE snag but needs to be removed as it compromises display on all browsers*/
background-color:#333; margin-left: 135px;
} 

/*do this for Opera as well, to make the drop down menus wider*/
ul.sfnav ul li{margin-top: 0; 
/*PUTTING A MARGIN-LEFT VALUE HERE CREATES 'THE' BUG ON IE*/
/*sets the width if the sub menu on both firefox and ie*/
width: 135px; 
border-top: 1px solid white; 
padding-left: 2px; 
background-color:#333;} 


/* CHANGES ALL MENUS LINK FONT COLOUR ETC*/
ul.sfnav a {
display: block;  
text-decoration: none; 
color: #FFF; 
padding: 0 0 0 2px;
} /*for the links, specified absolutely as we have a fixed width*/

/* CHILD MENU WIDTHS -  ONLY SEEMS TO APPLY TO IE IF INCREASED*/
ul.sfnav ul a {} /*the drop down menus can be wider*/


/* why do we have links fly out styles????*/
/*ul.sfnav ul.links li.sfhover, ul.sfnav ul.links li:hover{ background: #99AACC;}*/


/*CHILD MENU WIDTH The width setting here works on Firefox to prevent the child menu spreading horizontally across the page */
ul.sfnav li ul {position: absolute; width: 135px; left: -999em;} /*sub menus are shunted left*/


/* USING THIS CREATES THE IE SNAG ON FIREFOX - moves sub sub menus out to the right - I SUGGEST WE LEAVE OUT  */
/*  ul.sfnav li ul {margin: -1.5em 0 0 135px;}  */




/*The next two lines start the menus off screen and move then on screen into the right place when the mouse is hovering.*/

/*sfhover is for IE*/
ul.sfnav li:hover ul ul, 
ul.sfnav li:hover ul ul ul, 
ul.sfnav li:hover ul ul ul ul,

ul.sfnav li.sfhover ul ul, 
ul.sfnav li.sfhover ul ul ul, 
ul.sfnav li.sfhover ul ul ul ul {left: -999em;}


/* "auto" works in Opera*/
ul.sfnav li:hover ul, 
ul.sfnav li li:hover ul, 
ul.sfnav li li li:hover ul, 
ul.sfnav li li li li:hover ul,

ul.sfnav li.sfhover ul, 
ul.sfnav li li.sfhover ul, 
ul.sfnav li li li.sfhover ul,
ul.sfnav li li li li.sfhover ul {left: auto;}

/* THIS COLOURS THE CHILD MENU TITLES GREY TO DISTINGUISH THEM FROM CHILD MENU LINKS */
ul.sfnav li.topbar {background: #999999; color: white; }
/*THIS IS AS ABOVE BUT FOR IE*/
ul.sfnav li ul li {font-size: 1em;}

/*THIS FORMATS THE MINI DROP DOWNS ON COUNTRY - RESORT - HOTEL PAGES*/
ul.sfnav li.dropdown { background-color: #FFF;  color: #000; width: 150px;} 
ul.sfnav li.dropdown a{ color: #000; } 
ul.sfnav li.dropdown ul {margin: -18px 0 0 85px; background-color: #FFF; } 
ul.sfnav li.dropdown ul li{ background-color: #fff; border:1px solid #cccc99; margin-bottom: 2px; } 
ul.sfnav li.dropdown ul li a{color: #000; } 
ul.sfnav li.dropdown ul li a:hover{color: #000; text-decoration: underline;} 

/*A fix for Suckerfish dropdowns in IE 7 from http://www.builtfromsource.com/2006/10/23/a-fix-for-suckerfish-dropdowns-in-ie-7/*/
ul.sfnav li:hover, ul.sfnav  li.hover {
    position: static;
}