span.calendario {
    position: relative;
}

    span.calendario:hover {
        text-decoration: none;
    }

    span.calendario:after {
        content: attr(title);
        font-family: Arial, Helvetica, sans-serif;
        font-size: 90%;
        line-height: 1.2em;
        color: #fff;
        width: 200px;
        padding: 5px 10px;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        background: #c00d3f;
        background: -webkit-linear-gradient(#c00d3f, #7b0a2a);
        background: -moz-linear-gradient(#c00d3f, #7b0a2a);
        background: -o-linear-gradient(#c00d3f, #7b0a2a);
        background: -ms-linear-gradient(#c00d3f, #7b0a2a);
        background: linear-gradient(#c00d3f, #7b0a2a);
        -moz-box-shadow: 3px 3px 4px rgba(0,0,0, .65);
        -webkit-box-shadow: 3px 3px 4px rgba(0,0,0, .65);
        box-shadow: 3px 3px 4px rgba(0,0,0, .65);
        position: absolute;
        top: 27px;
        left: -10px;
        display: none;
    }

    span.calendario:before {
        z-index: 1000;
        position: absolute;
        content: "";
        top: 15px;
        left: 0px;
        border-right: 7px transparent solid;
        border-left: 7px transparent solid;
        display: none;
    }

    span.calendario:hover {
        z-index: 1000;
        position: relative;
        color: #8325f7;
    }

        span.calendario:hover:after {
            display: block;
        }

        span.calendario:hover:before {
            display: block;
        }