/* Begin CSS Popout Menu */

#menu{
width:140px;
float:right;
padding:0px;
margin-right: 20px;
margin-top: 10px;
}

#menu a, #menu h2{
width:140px;
display:block;
border-bottom:1px solid #ddd;
border-top: 1px solid #FFFFFF;
margin:0;
}

#menu a{
text-decoration:none;
padding:0px 0 0px 10px;
}

#menu a, #menu a:visited{
color:#310D35;
}

#menu a:hover{
color:#310D35;
padding-left:10px;
background: #DDDDDD;
}

#menu a:active{
border: 1px solid #999999;
background: #BBBBBB;
color:#310D35;
}

#menu ul{
list-style:none;
margin:0;
padding:0;
float:left;
width:8em;
}

#menu li{
}

#menu ul ul{
position:absolute;
top:0;
display:none;
border: 1px solid #999;
left: 100%;
width: 160px;
}

#menu ul ul ul{
position: absolute;
top:0;
left:95%;
}

/* Begin non-anchor hover selectors */

div#menu h2:hover{
border: 1px solid #30559C;
}

div#menu li:hover{
cursor:pointer;
z-index:100;
}

div#menu li:hover ul ul,
div#menu li li:hover ul ul,
div#menu li li li:hover ul ul,
div#menu li li li li:hover ul ul
{display:none;}

div#menu li:hover ul,
div#menu li li:hover ul,
div#menu li li li:hover ul,
div#menu li li li li:hover ul
{display:block;}

/* End of non-anchor hover selectors */

/* Styling for Expand */

#menu a.x, #menu a.x:visited{
color:#333;
background:#F7F7F7 url(../images/leftbar_arrow.gif) no-repeat 0% 50%;
padding-left: 25px;
}

#menu a.x:hover{
color:#333;
background:#B5CDE8 url(../images/arrow.gif) no-repeat 99% 50%;
padding-left: 24px;
}

#menu a.x:active{
color:#333;
background:#F7F7F7 url(../images/arrow.gif) no-repeat 100% 50%;
}

/* End CSS Popout Menu */