jQuery.noConflict();
    var tempo = 2000;
    
    
    
  jQuery(document).ready(function(){
    var debug = false;
    // intial bindings:
    BindEnter('sec',2);
    BindEnter('third',3);
    BindEnter('fourth',4);

/*
    jQuery(".over2").click(function(){  

      unBindLief('sec',2);
      FadeOutBut('sec');
      jQuery('div#more2').fadeIn(tempo); 
      showBackLink('sec',2);      
    });
  */  

   jQuery(".over3").click(function(){      
      unBindLief('third',3)
      FadeOutBut('third');  
      //jQuery(this).css('margin-left', '-250px');
      jQuery(this).animate({marginLeft: "-250px"},tempo);
      jQuery('div#more3').fadeIn(tempo); 
      showBackLink('third',3);  
    });

   jQuery(".over4").click(function(){      
      unBindLief('fourth',4)
      FadeOutBut('fourth');  
      //jQuery(this).css('margin-left', '-482px');
      jQuery(this).animate({marginLeft: "-482px"},tempo);
      jQuery('div#more4').fadeIn(tempo); 
      showBackLink('fourth',4);  
    });
    
    
    /* These functions do the work */
    function BindEnter(item, number){
      if(debug) console.log('BindEnter('+item+','+number+')');      
      var over = '.over'+number;
      var eidi = 'div#'+item;
      jQuery(eidi).bind('mouseenter', function(){      
        jQuery(over).fadeIn('fast');        
        jQuery(over).css('z-index', '1000').css('cursor','pointer').parent().css('z-index','999');
        BindLief(item, number);
      });
    }    
    function BindLief(item, number) {  
      if(debug) console.log('BindLief('+item+','+number+')');         
      var item = 'div#'+item;
      var number = '.over'+number;
      jQuery(item).bind('mouseleave', function(){
        jQuery(number).fadeOut('fast');
        jQuery(number).css('z-index',"").parent().css('z-index',"");
      });
    }    
    function unBindLief(item, number) {  
      if(debug) console.log('unBindLief('+item+','+number+')');         
      var item = 'div#'+item;
      var number = '.over'+number;
      jQuery(item).unbind('mouseleave');
      jQuery(item).unbind('mouseenter');
    }
    function FadeOutBut(notout) {
      if(debug) console.log('FadeOutBut('+notout+')');
      if(notout != 'first') jQuery('div#first').fadeOut(tempo);
      if(notout != 'sec') jQuery('div#sec').fadeOut(tempo);  
      if(notout == 'sec') jQuery('div#sec > img.orig').attr('src', 'u/haha2_nono.png'); 
      if(notout != 'third') jQuery('div#third').fadeOut(tempo);
      if(notout == 'third') jQuery('div#third > img.orig').attr('src', 'u/haha3_nono.png'); 
      if(notout != 'fourth') jQuery('div#fourth').fadeOut(tempo); 
      if(notout == 'fourth') jQuery('div#fourth > img.orig').attr('src', 'u/haha4_nono.png'); 
    }
    function FadeInBut(notin) {
      if(notin != 'first') jQuery('div#first').fadeIn(tempo);
      if(notin != 'sec') jQuery('div#sec').fadeIn(tempo);  
      if(notin == 'sec') jQuery('div#sec > img.orig').attr('src', 'u/haha2.png'); 
      if(notin != 'third') jQuery('div#third').fadeIn(tempo);
      if(notin == 'third') jQuery('div#third > img.orig').attr('src', 'u/haha3.png'); 
      if(notin != 'fourth') jQuery('div#fourth').fadeIn(tempo);  
      if(notin == 'fourth') jQuery('div#fourth > img.orig').attr('src', 'u/haha4.png'); 
    }
    
    function showBackLink(item, number)
    {
      if(debug) console.log('showBackLink('+item+','+number+')');      
      var out = 'div#more'+number;
      var outclass = '.over'+number;
      jQuery(outclass).css('cursor','auto');
      jQuery('div#backLink').show();
      jQuery('div#backLink').bind('click', function(){
        hideBackLink(item, number);
        BindLief(item, number);
        BindEnter(item, number);
        FadeInBut(item);
        jQuery(out).fadeOut(tempo);
          
        if(number == 4){
          if(debug) console.log('moving back to right');
          jQuery(outclass).animate({marginLeft: "0px"},tempo, function(){
            jQuery(outclass).fadeOut('fast');
          });
        }
        else if(number == 3){
          if(debug) console.log('moving back to right');
          jQuery(outclass).animate({marginLeft: "0px"},tempo, function(){
            jQuery(outclass).fadeOut('fast');
          });
        }
        else
          jQuery(outclass).fadeOut(tempo);
      });   
    }
    
    function hideBackLink(item, number)
    { 
      if(debug) console.log('hideBackLink('+item+','+number+')');      
      jQuery('div#backLink').hide();      
    }
    
  });

