window.addEvent('load', function(){
	var mySlideMenu = new hSlideMenu($("navBar"));
	//to avoid flicker when the slideMneu is first constructed, navBar is 
	//initially set with visibility hidden(via CSS .  After the slideMneu 
	//is constructed navBar's visibility is now visible. 
	$('navBar').setStyle("visibility", "visible"); 	
	
	var tabLeftPos; 
	var tabRealWidth;
	var curSecItem;
	
	var tabAnimation = new Fx.Styles($("currentSectionTab"), {duration:150, transition: Fx.Transitions.Quad.easeOut, wait:false});
														
	//sets up the styles for current section tab
	mySlideMenu.mainListItems.each(function(item){ 											
		if(item.getText().trim()==$('currentSectionInput').getText().trim()){
			item.setStyles({"padding-left":"30px",
						  	"padding-right":"30px",
							"padding-top":"13px",
							"font-size":"1em",
							"font-weight":"bold"
						   });
			$E("a", item).setStyle("color", "#333333");
			
			tabLeftPos= $('currentSectionTab').setPosition({
														relativeTo: item,
														position: "left",
														returnPos:true
													}).left;
			tabRealWidth=item.getComputedSize().totalWidth;
			$('currentSectionTab').setStyles({"left": tabLeftPos,
												"width": tabRealWidth,
												"visibility":"visible"
											 });
			
			item.addEvent("mouseover", function(e){
									tabAnimation.start({"left":tabLeftPos, "width":tabRealWidth});
									
									$ES("a", $('mainList')).setStyle("color", "#CCCCCC");
									$E("a", curSecItem).setStyle("color", "#333333");
									})
									
			curSecItem=item;		
		}else{
			item.addEvent("mouseover", function(e){
												tabAnimation.start({"left": $('currentSectionTab').setPosition({
												relativeTo: item,
												position: "left",
												returnPos:true
													}).left.toInt()-15,
												"width": item.getComputedSize({styles:["border", "margin", "padding"]}).totalWidth+30
											 })
				$ES("a", $('mainList')).setStyle("color", "#CCCCCC");
				$E("a", item).setStyle("color", "#333333");
			});
		}
		
		
		$('navBarContainer').addEvent("mouseleave", function(e){
							$ES("a", $('mainList')).setStyle("color", "#CCCCCC");
							$E("a", curSecItem).setStyle("color", "#333333");
							tabAnimation.start({"left": tabLeftPos,
															"width": tabRealWidth
														 });

							});
	})
	
	
	//sets up style for sublist li's
	$ES("li", $("subList")).each(function(item){
									item.addEvent("mouseover", function(e){
										this.setStyle("background-color", "#333333");
										this.setStyle("cursor", "pointer");
										$E("a" , $(this.parentNode.id.substring(0, this.parentNode.id.length-4))).setStyle("color", "#333333");

									});
									
									item.addEvent("mouseout", function(e){
										this.setStyle("background-color", "")
									});
									
									item.addEvent("click", function(e){
										window.location=this.getFirst().getProperty("href");
									})
								})
	
	
	$('currentSectionInput').parentNode.removeChild($('currentSectionInput'));

	//detects whether breadcrubms is in use, if false, erases the bottom dotted border
	if($('breadcrumb').getText().trim()=="")
	{
		$('breadcrumb').setStyle("border-bottom", "none");
	}
})