$(document).ready(function(){

    $("#socio a").mouseover(function() {
        
        if($(this).attr("title") == "") return false; 
        $("body").append('<span class="infobulle"></span>');
        var bulle = $(".infobulle:last");
        bulle.append($(this).attr("title"));
        $(this).attr("title", "");
        var posTop = $(this).offset().top - bulle.height()-10;
        var posLeft = $(this).offset().left + $(this).width()/2 - bulle.width()/2;
        bulle.css({
            left:posLeft,
            top:posTop - 5,
            opacity: 0
            });
        bulle.animate({
            top:posTop,
            opacity: 1
            }, 300);
    });
    
    $("#socio a").mouseout(function() {
        var bulle = $(".infobulle:last");
        $(this).attr("title", bulle.text());
        bulle.animate({
            top:bulle.offset().top - 10,
            opacity: 0
            }, 300, "linear", function() {
                    bulle.remove();
                });
        
    });
    
    $(".vignette").mouseover(function() {
        $(this).stop().animate({
            opacity: 1,
            },200);
        $(this).find(".plus").stop().animate({
            opacity: 1,
            bottom: 0
            },200);
        });
    
    $(".vignette").mouseout(function() {
        $(this).stop().animate({
            opacity:0.6,
            },200);
       $(this).find(".plus").stop().animate({
            opacity:0,
            bottom: -26
            },200);
        });
    
  
    

 });