MXML accordian

CustomAccordian.mxml

<mx:Canvas width="200" height="100%" id="rightCanvas">

	<mx:Box width="100%" height="100%" styleName="fseControlBar">
	</mx:Box>
	<mx:Box width="100%" height="100%" styleName="fseControlBar" backgroundAlpha="1">
		<mx:filters> <flash.filters:BevelFilter xmlns:flash.filters="flash.filters.*"
				angle="90"
				blurX="1"
				blurY="1"
				distance="1"
				highlightAlpha=".4"
				shadowAlpha=".4"
				highlightColor="0x000000"
				shadowColor="0xFFFFFF"
				knockout="true"/>
		</mx:filters>
	</mx:Box>
	<mx:Image source="{isRightClosed == false?(openNav):closeNav}"
					  useHandCursor="true"
					  buttonMode="true"
					  mouseChildren="false"
					  id="closeRightNavBtn"
					  click="handleRightNav(event)"
					  left="5"
					  top="5"/>
		<head:GlassHeaders id="rightBoxLbl"
				   right="5"
				   top="1"
				   headerTitle="STUDENTS KIDS MOVIES"
				   toolTip="Click to Expand or Shrink"
				   useHandCursor="true"
				   textAlign="right"
				   click="handleRightNav(event)"
				   fontFamily="Myriad"/>

		<mx:Box left="5"
			top="30"
			bottom="20"
			right="5"
			width="100%"
			height="100%"
			id="rightPnl">

		<mx:Accordion id="rightAcc"
			  height="100%"
			  width="100%">
		</mx:Accordion>

	</mx:Box>

</mx:Canvas>