.tooltips{
    padding: 0.5%;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    background-color: white;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.349);
    font-family: "Roboto-Medium";
    font-size: 1.25em;
    width: 10.5vw;
    height: auto;
    z-index: 1000;
    opacity: 0;
    transition: .3s ease all ;
    transform: translateY(10px);
    border-radius: 1.5vh 1.5vh 1.5vh 1.5vh;
}
.tooltips.activo{
    opacity: 1; 
    transform: translateY(0px);
}
.tooltips::after{
    content: "";
    left: 20px;
    display: inline-block;
    border-left: 1.2vh solid transparent;
    border-right: 1.2vh solid transparent;
    border-bottom: 1.5vh solid rgba(255, 19, 19, 0.993);
    position: absolute;
    top: -1.5vh;
}