var decal_x = 15;
var decal_y = -25;
var skn = document.getElementById("bulle").style;
var skn2 = document.getElementById("bulle2").style;
document.onmousemove = suivre_souris;

function disparaitre(){document.getElementById("bulle").innerHTML = '';skn.visibility = 'hidden';}
function disparaitre2(){document.getElementById("bulle2").innerHTML = '';skn2.display = 'none';}

function pop(txt)
{
    var tableau = '<table border="0" cellpadding="0" cellspacing="0">';
    tableau = tableau + '<tr>';
    tableau = tableau + '<td>';
    tableau = tableau + '<div style="position:relative;top:0px;left:1px;">';
    tableau = tableau + '<table border="0" cellpadding="0" cellspacing="0">';
    tableau = tableau + '<tr>';
    tableau = tableau + '<td valign="bottom"><img src="/images/fleche_bulle.gif"></td>';
    tableau = tableau + '</tr>';
    tableau = tableau + '</table>';
    tableau = tableau + '</div>';
    tableau = tableau + '</td>';
    tableau = tableau + '<td>';
    tableau = tableau + '<table border="0" cellpadding="0" cellspacing="0">';
    tableau = tableau + '<tr>';
    tableau = tableau + '<td width="10" height="18"><img src="/images/cadre_haut_gauche.gif"></td>';
    tableau = tableau + '<td align="left" height="18" style="background-image:url(\'/images/cadre_haut.gif\');padding-left:10px;"></td>';
    tableau = tableau + '<td width="10" height="18" valign="bottom"><img src="/images/cadre_haut_droite.gif"></td>';
    tableau = tableau + '</tr>';
    tableau = tableau + '<tr>';
    tableau = tableau + '<td style="background-image:url(\'/images/cadre_gauche.gif\')"></td>';
    tableau = tableau + '<td><table border="0" cellpadding="0" cellspacing="0"><tr>';
    tableau = tableau + '<td><img src="/images/logo_pt.jpg" border="0"></td>';
    tableau = tableau + '<td align="center" bgcolor="#FFFFFF" style="color:#FF6600;font-weight:bold;padding:5px;font-size:20px;">'+ txt +'</td>';
    tableau = tableau + '</tr></table></td>';
    tableau = tableau + '<td style="background-image:url(\'/images/cadre_droite.gif\')"></td>';
    tableau = tableau + '</tr> ';
    tableau = tableau + '<tr>';
    tableau = tableau + '<td width="10" height="12"><img src="/images/cadre_bas_gauche.gif"></td>';
    tableau = tableau + '<td style="background-image:url(\'/images/cadre_bas.gif\')"></td>';
    tableau = tableau + '<td width="10" height="12"><img src="/images/cadre_bas_droite.gif" runat="server"/></td>';
    tableau = tableau + '</tr>';
    tableau = tableau + '</table>';
    tableau = tableau + '</td>';
    tableau = tableau + '</tr>';
    tableau = tableau + '</table>';
    var contenu = tableau;
    document.getElementById("bulle").innerHTML = contenu;
    skn.visibility = "visible";
}

function pop2(txt)
{
    var tableau2 = '<table border="0" cellpadding="0" cellspacing="0">';
    tableau2 = tableau2 + '<tr>';
    tableau2 = tableau2 + '<td>';
    tableau2 = tableau2 + '<div style="position:relative;top:0px;left:1px;">';
    tableau2 = tableau2 + '<table border="0" cellpadding="0" cellspacing="0">';
    tableau2 = tableau2 + '<tr>';
    tableau2 = tableau2 + '<td valign="bottom"><img src="/images/fleche_bulle.gif"></td>';
    tableau2 = tableau2 + '</tr>';
    tableau2 = tableau2 + '</table>';
    tableau2 = tableau2 + '</div>';
    tableau2 = tableau2 + '</td>';
    tableau2 = tableau2 + '<td>';
    tableau2 = tableau2 + '<table border="0" cellpadding="0" cellspacing="0">';
    tableau2 = tableau2 + '<tr>';
    tableau2 = tableau2 + '<td width="10" height="18"><img src="/images/cadre_haut_gauche.gif"></td>';
    tableau2 = tableau2 + '<td align="left" height="18" style="background-image:url(\'/images/cadre_haut.gif\');padding-left:10px;"></td>';
    tableau2 = tableau2 + '<td width="10" height="18" valign="bottom"><img src="/images/cadre_haut_droite.gif"></td>';
    tableau2 = tableau2 + '</tr>';
    tableau2 = tableau2 + '<tr>';
    tableau2 = tableau2 + '<td style="background-image:url(\'/images/cadre_gauche.gif\')"></td>';
    tableau2 = tableau2 + '<td><table border="0" cellpadding="0" cellspacing="0"><tr>';
    tableau2 = tableau2 + '<td></td>';
    tableau2 = tableau2 + '<td align="center" bgcolor="#FFFFFF" style="color:#FF6600;font-weight:bold;padding:5px;font-size:20px;">'+ txt +'</td>';
    tableau2 = tableau2 + '</tr></table></td>';
    tableau2 = tableau2 + '<td style="background-image:url(\'/images/cadre_droite.gif\')"></td>';
    tableau2 = tableau2 + '</tr> ';
    tableau2 = tableau2 + '<tr>';
    tableau2 = tableau2 + '<td width="10" height="12"><img src="/images/cadre_bas_gauche.gif"></td>';
    tableau2 = tableau2 + '<td style="background-image:url(\'/images/cadre_bas.gif\')"></td>';
    tableau2 = tableau2 + '<td width="10" height="12"><img src="/images/cadre_bas_droite.gif" runat="server"/></td>';
    tableau2 = tableau2 + '</tr>';
    tableau2 = tableau2 + '</table>';
    tableau2 = tableau2 + '</td>';
    tableau2 = tableau2 + '</tr>';
    tableau2 = tableau2 + '</table>';
    var contenu = tableau2;
    document.getElementById("bulle").innerHTML = contenu;
    skn.visibility = "visible";
}

function suivre_souris(evt)
{
    if(!evt) evt = window.event;
    var x = evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft);
    var y = evt.clientY + (document.documentElement.scrollTop ||  document.body.scrollTop);
    document.getElementById("bulle").style.left = x + decal_x + 'px';
    document.getElementById("bulle").style.top  = y + decal_y + 'px';
}

function pop3(id,evt)
{
    document.getElementById("bulle2").innerHTML = document.getElementById(id).innerHTML;
    skn2.display = "block";
    if(!evt) evt = window.event;
    var x = evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft);
    var y = evt.clientY + (document.documentElement.scrollTop ||  document.body.scrollTop);
    document.getElementById("bulle2").style.left = x - 90 + 'px';
    document.getElementById("bulle2").style.top  = y - 175 + 'px';
    
}

var tableau4 = '<table border="0" cellpadding="0" cellspacing="0">';
tableau4 = tableau4 + '<tr>';
tableau4 = tableau4 + '<td width="10" height="18"><img src="/images/cadre_haut_gauche.gif"></td>';
tableau4 = tableau4 + '<td align="left" height="18" style="background-image:url(\'/images/cadre_haut.gif\');padding-left:10px;"></td>';
tableau4 = tableau4 + '<td width="10" height="18" valign="bottom"><img src="/images/cadre_haut_droite.gif"></td>';
tableau4 = tableau4 + '</tr>';
tableau4 = tableau4 + '<tr>';
tableau4 = tableau4 + '<td style="background-image:url(\'/images/cadre_gauche.gif\')"></td>';
tableau4 = tableau4 + '<td><table border="0" cellpadding="0" cellspacing="0"><tr>';
tableau4 = tableau4 + '<td></td>';
tableau4 = tableau4 + '<td align="center" bgcolor="#FFFFFF" style="padding:0px;font-size:11px;" width="350">';

var tableau4_fin = '</td>';
tableau4_fin = tableau4_fin + '</tr></table></td>';
tableau4_fin = tableau4_fin + '<td style="background-image:url(\'/images/cadre_droite.gif\')"></td>';
tableau4_fin = tableau4_fin + '</tr> ';
tableau4_fin = tableau4_fin + '<tr>';
tableau4_fin = tableau4_fin + '<td width="10" height="12"><img src="/images/cadre_bas_gauche.gif"></td>';
tableau4_fin = tableau4_fin + '<td style="background-image:url(\'/images/cadre_bas.gif\')"></td>';
tableau4_fin = tableau4_fin + '<td width="10" height="12"><img src="/images/cadre_bas_droite.gif" runat="server"/></td>';
tableau4_fin = tableau4_fin + '</tr>';
tableau4_fin = tableau4_fin + '<tr>';
tableau4_fin = tableau4_fin + '<td align="center" colspan="3">';
tableau4_fin = tableau4_fin + '<div style="position:relative;top:-4px;left:0px;">';
tableau4_fin = tableau4_fin + '<table border="0" cellpadding="0" cellspacing="0" width="100%">';
tableau4_fin = tableau4_fin + '<tr>';
tableau4_fin = tableau4_fin + '<td valign="top" align="center"><img src="/images/fleche_bulle_bas.gif"></td>';
tableau4_fin = tableau4_fin + '</tr>';
tableau4_fin = tableau4_fin + '</table>';
tableau4_fin = tableau4_fin + '</div>';
tableau4_fin = tableau4_fin + '</td>';
tableau4_fin = tableau4_fin + '</tr>';
tableau4_fin = tableau4_fin + '</table>';

function pop4(id)
{
    document.getElementById("bulle2").innerHTML = tableau4 + document.getElementById(id).innerHTML + tableau4_fin;
    skn2.display = "block";
    if (navigator.appName=="Microsoft Internet Explorer")
    {
        var x = event.x + document.documentElement.scrollLeft;
        var y = event.y + document.documentElement.scrollTop;
    }
    if (navigator.appName!="Microsoft Internet Explorer")
    {
        var x = e.pageX + document.body.scrollLeft;
        var y = e.pageY + document.body.scrollTop;
    }
    document.getElementById("bulle2").style.left = x - (document.getElementById("bulle2").offsetWidth/2) + 'px';
    document.getElementById("bulle2").style.top  = y - (document.getElementById("bulle2").offsetHeight + 10) + 'px';
}

function pop4_2(texte)
{
    document.getElementById("bulle2").innerHTML = tableau4 + texte + tableau4_fin;
    skn2.display = "block";
    if (navigator.appName=="Microsoft Internet Explorer")
    {
        var x = event.x + document.documentElement.scrollLeft;
        var y = event.y + document.documentElement.scrollTop;
    }
    if (navigator.appName!="Microsoft Internet Explorer")
    {
        var x = e.pageX + document.body.scrollLeft;
        var y = e.pageY + document.body.scrollTop;
    }
    document.getElementById("bulle2").style.left = x - (document.getElementById("bulle2").offsetWidth/2) + 'px';
    document.getElementById("bulle2").style.top  = y - (document.getElementById("bulle2").offsetHeight + 10) + 'px';
}