

#sidebar ul{
font-weight:normal;
width:160px;
list-style-type: none;
padding-left:0px;
margin:0px;
border:solid red;
border-width:0px;
float:left;
cursor:pointer;
 }

#sidebar li {
/* make the list elements a containing block for the nested lists */
position: relative;
} 

 /* top level = menu title */
#sidebar ul li{
font-size:20px;
text-align:left;
border:solid rgb(185,158,123);
border-width:0px;
padding:2px;
margin:6px 0px 0px 0px;
 }

 /* second level = sub categories ie work, play */
 #sidebar ul li li{
font-size:18px;
text-align:left;
background: rgb(185,158,23);
border:solid rgb(64,69,61);
border-width:1px;
padding:0px 2px 2px 5px;
margin:0px 0px 0px 0px;
background:url('images/menu-grad01.png');

 }
  /* second level = sub categories ie work, play - hover*/
  #sidebar ul li li:hover{
font-size:18px;
text-align:left;
background: rgb(185,158,23);
border:solid rgb(108,113,105);
border-width:1px;
padding:0px 2px 2px 5px;
margin:0px 0px 0px 0px;
background:url('images/menu-grad01.png');

 }
/* first pop out level = children of sub categories ie css experiments, pinball */
 #sidebar li ul ul li{
 list-style-type: none;
text-align:left;
font-size:18px;
border:solid rgb(108,113,105);
border-width:1px;
padding:0px 2px 2px 5px;
margin:-1px 0px 0px 0px;
background:url(rgba.php?r=108&g=113&b=105&a=80) repeat;

 }
 
  #sidebar li ul ul li:hover{
 list-style-type: none;
text-align:left;
font-size:18px;
border:solid rgb(108,113,105);
border-width:1px;
padding:0px 2px 2px 5px;
margin:-1px 0px 0px 0px;
background:url(rgba.php?r=108&g=113&b=105&a=80) repeat;

 }
 
 
#sidebar ul ul ul {
position: absolute;
top: 0;
left: 168px; /* to position them to the right of their containing block */
width: 160px; /* width is based on the containing block */
}

#sidebar ul ul ul,
#sidebar ul ul li:hover ul ul
{display: none;}

#sidebar ul ul li:hover ul,
#sidebar ul ul ul li:hover ul
{display: block;}

<!--[if IE]--->
<style type="text/css" media="screen">
body {
cursor:pointer;
behavior: url(csshover.htc); /* call hover behaviour file */
font-size: 100%; /* enable IE to resize em fonts */
} 
#sidebar ul li {
float: left; /* cure IE5.x "whitespace in lists" problem */
width: 100%;
cursor:pointer;
}
#sidebar ul li a {
height: 1%; /* make links honour display: block; properly */
} 

#sidebar a, #menu h2 {
font: normal 14px arial, helvetica, sans-serif; 
/* if required use em's for IE as it won't resize pixels */
} 
</style>
<!---[endif]-->

