.menu {width: 10em;}
.menu, .menu ul {margin:0;padding:0;border:0;list-style-type: none;display: block;}
.menu li {margin: 0;padding: 0;border: 0;display: block;position: relative;z-index: 0;}
.menu li:hover {z-index: 10000;}
.menu ul {visibility: hidden;position: absolute;z-index:10;left: 0;top: 0;}
.menu li:hover>ul {visibility:visible;left:100%;}
.menu:after, .menu ul:after {content: ".";height: 0;display: block;visibility: hidden;overflow: hidden;clear: both;}
.menu, .menu ul {min-height: 0;}

.menu ul {padding: 30px 30px 30px 10px;margin: -30px 0 0 -50px;}
.menu, .menu ul li {color:#364B9A;background:#FBFDF1;}

.menu {width: 13em;}
.menu ul {width: 15em;}

.menu a {text-decoration:none;color:#364B9A;padding:3px 0px 3px 10px;display:block;}

.menu li{border:0px solid #ccc;}

.menu>li + li, .menu ul>li + li {	/* and remove the top border on all but first item in the list */
	border-top: 0;
}

.menu li:hover>ul {	/* inset submenus, to show off overlapping */
	top: 5px;
	left: 90%;
}

/* special colouring for "Main menu:", and for "xx submenu" items in ADxMenu
	placed here to clarify the terminology I use when referencing submenus in posts */
.menu>li:first-child>a, .menu li + li + li li:first-child>a {
	color: #567;
}