@charset "utf-8";
/* CSS Document */

#main_navigation { overflow: visible; }
#main_navigation .submenu {
	position: absolute;
	top: 29px;           /* this [top] position plus [padding-top] ensures the submenu hangs over the bottom of the TAB; this ensures that the mooving mouse is always over either the TAB or the submenu as the mouse moves down to the submenu - otherwise the mouseout on the TAB would cause the submenu to disapear as the mouse leaves the tab. */
	padding-top: 5px;  /* See notes above next to top:29px; */
	background-image: url(../images/spacer.gif); /* IE BUG: lte_IE_7 does not recognise the [padding-top: 5px;] as part of the mouseover, so I had to add a reapeated transparent background gif image (which is included behind the padding, and therefore solves the problem - makes IE "see" the padding as actually being there. */
	background-repeat: repeat;
	overflow: visible;
	visibility: hidden;
	z-index: 200;
}
#main_navigation #servicesSubMenu {left: 48px;}
#main_navigation #businessesSubMenu {left: 151px;}
#main_navigation #individualsSubMenu {left: 257px;}
#main_navigation #whyVenSubMenu {left: 367px;}

#main_navigation #servicesSubMenu { visibility: hidden; } /* DEV NB TESTING: Used when you want to make a dropdown menu visible for testing */

.submenu #edge_btm_left {
background-image:url(../images/Mmenu_shdw_1_btmLeft.png);
background-repeat: no-repeat;
width: 18px;
}
.submenu #edge_btm {
background-image:url(../images/Mmenu_shdw_2_btm.png);
background-repeat: repeat-x;
}
.submenu #edge_btm_right {
background-image:url(../images/Mmenu_shdw_3_btmRight.png);
background-repeat: no-repeat;	
width: 24px;
}
.submenu #edge_right {
background-image:url(../images/Mmenu_shdw_4_right.png);
background-repeat: repeat-y;
width: 24px;
}