// JavaScript Document
var firstNav = "nav1";
var mailbox ="box1";
$(document).ready(
  function(){
    $( '#slides div' ).mouseover(
      function(){
		  
        $("#"+mailbox).hide();
		
		$(this).addClass($(this ).attr( 'id' )+'_over');
	 	mailbox='box' + $(this).attr('id').replace('nav', '');
		
		if(firstNav != $(this ).attr( 'id' )){
			$("#"+firstNav).removeClass(firstNav+'_over');
		}
		
		// Call addClass('abc') on all divs		
        $('#box' + $( this ).attr( 'id' ).replace( 'nav', '' ) ).show();
		$('#box' + $( this ).attr( 'id' ).replace( 'nav', '' )).fadeIn(1000);
      }
    );
	
	$('#slides div').mouseout(
      function(){
          $("#"+mailbox).show();
		  //$('#box' + $( this ).attr( 'id' ).replace( 'nav', '' )).fadeOut(1000);
		 //$(this).removeClass($(this ).attr( 'id' )+'_over');		  
		 
		   firstNav = $(this ).attr( 'id' );
      }
    );
	
	
	/********************************************************************************************************************
	OPEN DEFAULT DIV ON PAGE LOAD
	********************************************************************************************************************/	
	$("div.nav1").show();
	$("div.nav1").addClass('nav1_over');
	
  }
);