

$(document).ready(
        function(){ 
		
		
		  
     
          /* 
                Make first menu panel open
            */

	        $("#menupanels ul li ul").css("display", "block");
	
            $("#menupanels ul li ul#sub2").hide();
           $("#menupanels ul li ul#sub2").fadeTo("fast", 0.0); 

            $("#menupanels ul li ul#sub3").hide();
            $("#menupanels ul li ul#sub3").fadeTo("fast", 0.0);    			
            
			$("#menupanels ul li ul#sub4").hide();
            $("#menupanels ul li ul#sub4").fadeTo("fast", 0.0);  
            
			$("#menupanels ul li ul#sub1").show();
            $("#menupanels ul li ul#sub1").fadeTo("slow", 1.0);	
         
			
			$("#menupanels ul li#menu1").hover(
                function(){

				    /*close other panels */
				    $("#menupanels ul li ul#sub2").hide();
                    $("#menupanels ul li ul#sub2").fadeTo("fast", 0.0); 

                    $("#menupanels ul li ul#sub3").hide();
                    $("#menupanels ul li ul#sub3").fadeTo("fast", 0.0);  
		    
		    $("#menupanels ul li ul#sub4").hide();
                    $("#menupanels ul li ul#sub4").fadeTo("fast", 0.0); 
				
                    $("#menupanels ul li ul#sub1").show();                    
                    $("#menupanels ul li ul#sub1").fadeTo("slow", 1.0);
                    
                    //TODO: Need to identify (IE) the state of the selected tab 
                    // (is the menu visible - if so, exit without doing anything)
					
                    /*$(".selected a").fadeTo("slow",0.5);
                    $(".selected").fadeTo("slow",0.5);*/
                },
            
                function(){
                     
                  
                }
            )
	
			
            /* Hide and show the opaque background when the menu is in focus */
            $("#menupanels ul li#menu2").hover(
                function(){
	
				    /*close other panels */
				    $("#menupanels ul li ul#sub1").hide();
                    $("#menupanels ul li ul#sub1").fadeTo("fast", 0.0); 

                    $("#menupanels ul li ul#sub3").hide();
                    $("#menupanels ul li ul#sub3").fadeTo("fast", 0.0);  
		    
		            $("#menupanels ul li ul#sub4").hide();
                    $("#menupanels ul li ul#sub4").fadeTo("fast", 0.0); 
				
				    /* show panel */
                    $("#menupanels ul li ul#sub2").show();                    
                    $("#menupanels ul li ul#sub2").fadeTo("slow", 1.0);
                    
                    //TODO: Need to identify (IE) the state of the selected tab 
                    // (is the menu visible - if so, exit without doing anything)
					
                   /* $(".selected a").fadeTo("slow",0.5);
                    $(".selected").fadeTo("slow",0.5);*/
                },
            
                function(){
   
                }
           )
     
            $("#menupanels ul li#menu3").hover(
                function(){
		
				    /*close other panels */
				    $("#menupanels ul li ul#sub1").hide();
                    $("#menupanels ul li ul#sub1").fadeTo("fast", 0.0); 

                    $("#menupanels ul li ul#sub2").hide();
                    $("#menupanels ul li ul#sub2").fadeTo("fast", 0.0);  
		    
		    $("#menupanels ul li ul#sub4").hide();
                    $("#menupanels ul li ul#sub4").fadeTo("fast", 0.0); 
				
                    $("#menupanels ul li ul#sub3").show();                    
                    $("#menupanels ul li ul#sub3").fadeTo("slow", 1.0);
                    
                    //TODO: Need to identify (IE) the state of the selected tab 
                    // (is the menu visible - if so, exit without doing anything)
					
                    /*$(".selected a").fadeTo("slow",0.5);
                    $(".selected").fadeTo("slow",0.5);*/
                },
            
                function(){
                        
                }
            )
     
             $("#menupanels ul li#menu4").hover(
                function(){

				    /*close other panels */
	            $("#menupanels ul li ul#sub1").hide();
                    $("#menupanels ul li ul#sub1").fadeTo("fast", 0.0); 

                    $("#menupanels ul li ul#sub2").hide();
                    $("#menupanels ul li ul#sub2").fadeTo("fast", 0.0);  
				
		    $("#menupanels ul li ul#sub3").hide();
                    $("#menupanels ul li ul#sub3").fadeTo("fast", 0.0); 
				
                    $("#menupanels ul li ul#sub4").show();                    
                    $("#menupanels ul li ul#sub4").fadeTo("slow", 1.0);
                    
                    //TODO: Need to identify (IE) the state of the selected tab 
                    // (is the menu visible - if so, exit without doing anything)
					/*
                    $(".selected a").fadeTo("slow",0.5);
                    $(".selected").fadeTo("slow",0.5);*/
                },
            
                function(){
                        
                }
            );
   
    });
