function ShowOptionPanel_Site(Count,OptionID,uniqueID){
	
	for(i=1;i<=Count;i++){
		document.getElementById('PanelButton'+i+':'+uniqueID).className='PanelButton';
		document.getElementById('PanelOption'+i+':'+uniqueID).className='PanelOption';
	}

	document.getElementById('PanelButton'+OptionID+':'+uniqueID).className='PanelButtonOn';
	document.getElementById('PanelOption'+OptionID+':'+uniqueID).className='PanelOptionOn';
}


function ShowStoryPanel_Site(Count,OptionID,uniqueID){
	myHTML='Pages:  ';
	for(i=1;i<=Count;i++){
		document.getElementById('PanelStory'+i+':'+uniqueID).className='PanelStory';
	}
	document.getElementById('PanelStory'+OptionID+':'+uniqueID).className='PanelStoryOn';
	if(OptionID>1){
		myHTML += "<button class=MenuButton  onclick=\"StoryPanel_Control("+Count+",'Back','"+uniqueID+"');\">&nbsp;<&nbsp;</button>";
	}
	for(i=1;i<=Count;i++){
		myHTML += "<button   onclick=\"ShowStoryPanel_Site("+Count+","+i+",'"+uniqueID+"');\"  ";
		myHTML += (i==OptionID)?' class=MenuButtonActive ': ' class=MenuButton';
		myHTML += ">&nbsp;"+i+"&nbsp;</button>";
	}
	
	if(OptionID<Count){
	myHTML += "<button class=MenuButton onclick=\"StoryPanel_Control("+Count+",'Next','"+uniqueID+"');\">&nbsp;>&nbsp;</button>";
	}
	document.getElementById('storyButtons'+uniqueID).innerHTML=myHTML;
}

function StoryPanel_Control(Count,Direction,uniqueID){
	for(i=1;i<=Count;i++){
		if(document.getElementById('PanelStory'+i+':'+uniqueID).className=='PanelStoryOn'){
			currentID = i;
		}
		document.getElementById('PanelStory'+i+':'+uniqueID).className='PanelStory';
	}

	nextID = (currentID == Count)?1:currentID+1;
	backID = currentID-1;
	if(Direction=='Next'){
		ShowStoryPanel_Site(Count,nextID,uniqueID);
	}else{
		ShowStoryPanel_Site(Count,backID,uniqueID);
	}
}
function MenuOver(DivID){
	myDiv=document.getElementById(DivID);
	if(myDiv){
		myContent=document.getElementById(DivID).innerHTML;
		document.getElementById('SubMenuDiv').innerHTML=myContent;
		document.getElementById('SubMenuDiv').style.height='20px';
	}else{
		document.getElementById('SubMenuDiv').innerHTML='';
		document.getElementById('SubMenuDiv').style.backgroundColor='';
		document.getElementById('SubMenuDiv').style.height='0px';
	}
}


jQuery(document).ready(function(){  
  
    jQuery("ul.subnav").parent().append("<span></span>"); //Only shows drop down trigger when js is enabled (Adds empty span tag after ul.subnav*)  
  
    jQuery("ul.MainMenuList li span").click(function() { //When trigger is clicked...  
  
        //Following events are applied to the subnav itself (moving subnav up and down)  
        jQuery(this).parent().find("ul.subnav").slideDown('fast').show(); //Drop down the subnav on click  
  
        jQuery(this).parent().hover(function() {  
        }, function(){  
            jQuery(this).parent().find("ul.subnav").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up  
        });  
  
        //Following events are applied to the trigger (Hover events for the trigger)  
        }).hover(function() {  
            jQuery(this).addClass("subhover"); //On hover over, add class "subhover"  
        }, function(){  //On Hover Out  
            jQuery(this).removeClass("subhover"); //On hover out, remove class "subhover"  
    });  
  
});