/* 11/06/2021 Tous droits réservés */
.popup{
    /*     color:#ccc;
         text-shadow:0 -1px 0 black;                
    */
}
.popup:hover, .popup:focus{
    background:rgba(0,0,0,.1);
}

.popup span{
    z-index: 20;
    display:inline-block;

    font-family: calibri, arial, sans-serif;
    font-size: 0.9em;     

    position:absolute;                
    margin-top: -20px;
    margin-left: 35px;

    color:yellow;
    background:rgba(0,0,0,.7);
    padding:3px;
    border-radius:4px;
    box-shadow:0 0 2px rgba(0,0,0,.5);
    transform:scale(0) rotate(-12deg);     
    transition:all .45s;
    opacity:0;     
}

.popup .bas span{
    background:rgba(0,0,0,.7);
    margin-top: 0px;
}
.popup span .rouge{
    z-index: 20;
    background-color: red;
    padding: 10px;
} 

.popup span .orange{
    z-index: 20;
    background-color: rgba(231, 126, 32, 1);
    color: black;
    padding: 10px;
} 

.popup:hover span, .popup:focus span{
    transform:scale(1) rotate(0);  
    opacity:1;     
}