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

/* styling specific to Internet Explorer IE5.5 and IE6. Yet to see if IE7 handles li:hover */

/* Get rid of any default table style */
table {
border-collapse:collapse;
margin:0; 
padding:0;
}
/* ignore the link used by 'other browsers' */
.menu ul li a.hide, .menu ul li a:visited.hide {
display:none;
}

/* set the border to zero to make the main menu hover work */
.menu ul li a:hover {
border:0;
}

a:hover.map1 {background:transparent url(../map/map1.jpg);}
a:hover.map2 {background:transparent url(../map/map2.jpg);}
a:hover.map3 {background:transparent url(../map/map3.jpg);}
a:hover.map4 {background:transparent url(../map/map4.jpg);}
a:hover.map1 em {display:block; width:50px; height:50px; background:transparent url(../map/face2.gif); position:absolute; top:250px; left:50px;}
a:hover.map2 em {display:block; width:50px; height:50px; background:transparent url(../map/face3.gif); position:absolute; top:200px; left:50px;}
a:hover.map3 em {display:block; width:50px; height:50px; background:transparent url(../map/face4.gif); position:absolute; top:150px; left:50px;}
a:hover.map4 em {display:block; width:50px; height:50px; background:transparent url(../map/face1.gif); position:absolute; top:100px; left:50px;}


/* make the sub menu ul visible and position it to the right of the main menu list item */
.menu ul li a:hover ul {
visibility:visible; 
position:absolute; 
top:0; 
left:150px;
width:100px; 
height:150px;
}

/* make the list items vertical with no gaps */
.menu ul li a:hover ul li {
float:left;
width:100px;
}

/* style the size of the submenu links */
.menu ul li a:hover ul li a {
display:block;
width:100px;
height:50px;
}

/* set the border to zero to make the sub menu hover work */
.menu ul li a:hover ul li a:hover {
border:0;
}