span {
    position:relative;
}
span[data-tooltip]:before {
    position: absolute;
    right: 28px;
    top: 6px;
    background-color: #292929;
    color: #ffffff;
    height: 30px;
    line-height: 30px;
    border-radius: 5px;
    padding: 0 15px;
    content: attr(data-tooltip);
    white-space: nowrap;
    display: none;
}
span[data-tooltip]:after {
    position: absolute;
    right: 22px;
    bottom: 23px;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #292929;
    content: "";
    display: none;
}
span[data-tooltip]:hover:after, span[data-tooltip]:hover:before {
    display: block;

}

.tooltip-inner {
    max-width: 500px !important;

}


@-moz-document url-prefix() {
    span {
        position:relative;
    }
    span[data-tooltip]:before {
        position: absolute;
        right: 28px;
        top: 16px;
        background-color: #292929;
        color: #ffffff;
        height: 30px;
        line-height: 30px;
        border-radius: 5px;
        padding: 0 15px;
        content: attr(data-tooltip);
        white-space: nowrap;
        display: none;
    }
    span[data-tooltip]:after {
        position: absolute;
        right: 22px;
        top:25px;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        border-left: 7px solid #292929;
        content: "";
        display: none;
    }
    span[data-tooltip]:hover:after, span[data-tooltip]:hover:before {
        display: block;
    }
}