.floating-wpp{

    position:fixed;

    bottom:80px;

    left:50px;

    font-size:14px;

    transition:bottom .2s

}

.floating-wpp .floating-wpp-button{

    position:relative;

    border-radius:50%;

    box-shadow:1px 1px 4px rgba(60,60,60,0.4);

    transition:box-shadow .2s;

    cursor:pointer;

    overflow:hidden

}

.floating-wpp .floating-wpp-button img,.floating-wpp .floating-wpp-button svg{

    position:absolute;

    width:80%;

    height:auto;

    object-fit:cover;

    top:50%;

    left:50%;

    transform:translate3d(-50%,-50%,0);

    border-radius:50%

}

.floating-wpp:hover{

    bottom:90px

}

.floating-wpp:hover .floating-wpp-button{

    box-shadow:1px 2px 8px rgba(60,60,60,0.4)

}

.floating-wpp .floating-wpp-popup{

    border-radius:6px;

    background-color:#e5ddd5;

    position:absolute;

    overflow:hidden;

    padding:0;

    box-shadow:1px 2px 8px rgba(60,60,60,0.25);

    width:0;

    height:0;

    bottom:0;

    opacity:0;

    transition:bottom .1s ease-out,opacity .2s ease-out;

    transform-origin:bottom

}

.floating-wpp .floating-wpp-popup.active{

    padding:0 12px 12px 12px;

    width:260px;

    height:auto;

    bottom:82px;

    opacity:1

}

.floating-wpp .floating-wpp-popup .floating-wpp-message{

    background-color:white;

    padding:8px;

    border-radius:0 5px 5px 5px;

    box-shadow:1px 1px 1px rgba(0,0,0,0.15);

    opacity:0;

    transition:opacity .2s

}

.floating-wpp .floating-wpp-popup.active .floating-wpp-message{

    opacity:1;

    transition-delay:.2s

}

.floating-wpp .floating-wpp-popup .floating-wpp-head{

    text-align:right;

    color:white;

    margin:0 -15px 10px -15px;

    padding:6px 12px;

    display:flex;

    justify-content:space-between;

    cursor:pointer

}

.floating-wpp .floating-wpp-input-message{

    background-color:white;

    margin:10px -15px -15px -15px;

    padding:0 15px;

    display:flex;

    align-items:center

}

.floating-wpp .floating-wpp-input-message textarea{

    border:1px solid #ccc;

    border-radius:4px;

    box-shadow:none;

    padding:8px;

    margin:10px 0;

    width:100%;

    max-width:100%;

    

    font-family:inherit;

    font-size:inherit;

    resize:none

}

.floating-wpp .floating-wpp-btn-send{

    margin-left:12px;

    font-size:0;

    cursor:pointer

}

.floating-wpp-avatar{

    vertical-align:middle;

    width:70px;

    height:70px;

    border-radius:50%;

    margin:10px 0 10px 10px

}

.floating-wpp-avatar-info{

    color:white;

    margin:10px 80px 0 10px;

    text-align:left

}

.floating-wpp-avatar-name{

    font-weight:bold;

    font-size:16px

}

.close{

    color:white;
    font-weight: bold;
    font-size: 18px;
    margin-left: -40px;

}