.container-notification-chat{
    position: absolute;
    top: 2vw;
    z-index: 400;
    background-color: var(--main-color);
    width: 90%;
    transform: translateY(-350%);
    border-radius: 5px;
    transition: all 300ms;
    margin:auto;
    right:0;
    left:0;
    box-shadow: 0 0 10px #969696;
    overflow: hidden;
}
.container-notification-chat.active{transform: translateY(0%);}

.container-notification-chat .name-client-notification{
    text-align: center;
    color: #fff;
    font-size: 10pt;
    border-bottom:  solid #373737;
    padding: 1vw 9vw;
    background-color: #373737;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.container-notification-chat > .notification-options{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.icon-notification > img{
    height:12.5%;
    padding:5vw
}

.container-text-chat{
    width: 80%;
    position: relative;
}
.container-text-chat > p {
    text-align:  left;
    position: relative;
    background-color: rgb(74,78,87);
    color: #fff;
    width: 90%;
    left: 5%;
    padding: 7vw;
    border-radius: 2vw;
}


.container-text-chat > p::before{
    content: '';
    width: 5vw;
    height: 5vw;
    border-left: 2vw solid rgb(74,78,87);
    position: absolute;
    left: -2vw;
    top: -1.5vw;
    border-radius: 5px;
    transform: rotate(90deg);
    border-top: 4vw solid transparent;
    border-bottom: 4vw solid transparent;
}

.container-text-chat > p > span.time-notification{
    right: 3vw;
    position: absolute;
    top: 2vw;
    font-size: 1vw;
}
.container-text-chat > p > span.message-client-notification {
    overflow:  hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position:  absolute;
    width: calc(100% - 3vw);
    left: 3vw;
    top: 5.5vw;
    font-size:  3.5vw;
}
.container-notification-chat > div{
    width: 100%;
    display:block;
    margin:auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 3vw 1vw;
}
.container-notification-chat > div > span{
    color: #fff;
    font-size: 15pt;
    text-align: center;
    display: block;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5; /* number of lines to show */
    -webkit-box-orient: vertical;
}