.tooltip-wrapper {
    position: relative;
    display: inline-block;
    cursor: help;
}

    .tooltip-wrapper:hover {
        border-bottom: 1px dotted #2e60bb;
    }

        .tooltip-wrapper:hover span {
            visibility: visible;
        }

.tooltip-text ul {
    padding-left: 0; /* reboot was adding a 2rem padding left making lists in Tooltips too wide */
}

.tooltip-text {
    font-size: smaller;
    visibility: hidden;
    position: absolute;
    width: 200px;
    bottom: 100%;
    left: 30%;
    margin-left: -60px;
    background-color: #363636;
    color: #fff;
    text-align: center;
    padding: 0.5em;
    border-radius: 6px;
    z-index: 1;
}

    .tooltip-text::after {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #555 transparent transparent transparent;
    }