/* Infobulle CSS */ /* Style principal : dominante bleue */
:root /*** Variables ***/
{
  --main-bg-color: white;
  --main-color: #2929FF;
  --main-border-color: #9999FF;
  --main-textfont: arial, sans-serif, times;
  --main-textsize-small: 11px;
  --main-textsize: 12px;
  --main-textweight: regular;
  --main-textsize-T2: 14px;
  --main-textweight-T2: regular;
  --main-textsize-T1: 16px;
  --main-textweight-T1: regular;
  --main-textsize-huge: 18px;
  --link-color-link: blue;
  --link-color-hover: gray;
  --link-color-visited: purple;
  --image-height: 300px;
}
a:link {color: var(--link-color-link)}
a:hover {color: var(--link-color-hover) }
a:visited {color: var(--link-color-visited) }
/***************************/
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: -5px;
    left: 105%; 
    margin-left: -0px;
    opacity: 0;
    transition: opacity 1s;
}

.tooltip .tooltiptext:after {
    content: " ";
    position: absolute;
    top: 50%;
    right: 100%; /* To the left of the tooltip */
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #555 transparent transparent;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}
/**** FIN ***/