<div id="sidebar">
	<attach event="onmouseover" handler="rollOver" />
	<attach event="onmouseout" handler="rollOff" />
	<script type="text/javascript">
	function rollOver() {
	  //change the colour
	  element.className += (element.className?&apos; &apos;:&apos;&apos;) + &apos;CSStoHighlight&apos;;
	  //change display of child
	  for( var x = 0; element.childNodes[x]; x++ ){
	    if( element.childNodes[x].tagName == &apos;UL&apos; ) { element.childNodes[x].className += (element.childNodes[x].className?&apos; &apos;:&apos;&apos;) + &apos;CSStoShow&apos;; }
	    if( element.childNodes[x].tagName == &apos;A&apos; ) { element.childNodes[x].className += (element.childNodes[x].className?&apos; &apos;:&apos;&apos;) + &apos;CSStoHighLink&apos;; }
	  }
	}
	
	function rollOff() {
	  //change the colour
	  element.className = element.className.replace(/ ?CSStoHighlight$/,&apos;&apos;);
	  //change display of child
	  for( var x = 0; element.childNodes[x]; x++ ){
	    if( element.childNodes[x].tagName == &apos;UL&apos; ) { element.childNodes[x].className = element.childNodes[x].className.replace(/ ?CSStoShow$/,&apos;&apos;); }
	    if( element.childNodes[x].tagName == &apos;A&apos; ) { element.childNodes[x].className = element.childNodes[x].className.replace(/ ?CSStoHighLink$/,&apos;&apos;); }
	  }
	}
</script>