.ellipsis {
    /*display: block;*/
    white-space: nowrap;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    /*transition: all .2s linear;
    padding: .5rem 1rem;*/
}
/*max-width:1px;overflow:hidden; white-space:nowrap; text-overflow:ellipsis;*/
.ellipsis:focus, .ellipsis:hover {
    color: transparent;
}

.ellipsis:focus:after, .ellipsis:hover:after {
    content: attr(data-text);
    overflow: visible;
    text-overflow: inherit;
    background: #fff;
    position: absolute;
    left: auto;
    top: auto;
    width: auto;
    max-width: 20rem;
    border: 1px solid #eaebec;
    padding: 0 .5rem;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .28);
    white-space: normal;
    display: block;
    color: black;
    margin-top: -1.25rem;
    z-index: 1;
    user-select: text!important;
}