.whazzup.wzp_box {
    z-index: 10000000 !important;
    position: fixed;
    bottom: 25px;
    right: 25px;
    transition: width 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,0.06),0 2px 32px 0 rgba(0,0,0,0.16);
    background-color: rgb(48, 191, 57);
    color: rgb(255, 255, 255);
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    box-sizing: border-box;
    padding: 0;
}
.wzpanimatedshadow{
    animation: wzp-wave linear 3s infinite, scale-in .5s cubic-bezier(.25,.46,.45,.94) both;
}
.wzp_sbox {
    justify-content: center;
    align-items: center;
    display: flex;
}
img.wzp_img {
    height: 60px;
    width: 60px;
}
.wzpanimated{
    animation: wzp_shake linear 1.5s infinite;
}
.wzp-wave{
	animation: wzp-wave linear 3s infinite;
}
.scale-in-whatsapp-and-waves{
	animation: wzp-wave linear 3s infinite, scale-in .5s cubic-bezier(.25,.46,.45,.94) both;
}

.wzp_popup {
    right: 30px;
    bottom: 100px;
    background: white;
    box-shadow: 5px 5px 5px -5px rgba(34, 60, 80, 0.6);
    border-radius: 6px;
    width: 400px;
    min-width: 50px;
    text-align: left;
    max-width: calc(100% - 20px);
    transition: background-color 150ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border: 1px solid #f5f5f5;
    z-index: 10000000 !important;
    position: fixed;
   animation: wzp_show 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}
.wzp_hide_popup_anime{
   animation: wzp_hide 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; 
}
.wzp_popup_header {
    display: flex;
    padding: 10px;
}

.wzp_popup_image {
    width: 40px;
    height: 40px;
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
    border: 1px solid #7e3ef7;
    border-radius: 54%;
    min-width: 40px;
}

.wzp_popup_info {
    margin-left: 20px;
}

.wzp_popup_name {
    font-size: 16px;
    color: #000;
    margin-bottom: 3px;
}

.wzp_popup_message {
    color: #161c2d;
    font-size: 14px;
    line-height: 19px;
}
.wzp_popup_close {
    color: #434343;
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: 16px;
    cursor:pointer;
}

@keyframes wzp-wave{
	0%{
	    box-shadow: 0 8px 10px rgba(48, 191, 57, 0.3), 0 0 0 0 rgba(48, 191, 57, 0.2), 0 0 0 0 rgba(48, 191, 57, 0.2)
	}
	40%{
	    box-shadow: 0 8px 10px rgba(48, 191, 57, 0.3), 0 0 0 35px rgba(48, 191, 57, 0.2), 0 0 0 0 rgba(48, 191, 57, 0.2)
	}
	80%{
	    box-shadow: 0 8px 10px rgba(48, 191, 57, 0.3), 0 0 0 55px rgba(48, 191, 57, 0), 0 0 0 26.7px rgba(48, 191, 57, 0.067)
	}
	100%{
	    box-shadow: 0 8px 10px rgba(48, 191, 57, 0.3), 0 0 0 80px rgba(48, 191, 57, 0), 0 0 0 40px rgba(48, 191, 57, 0.0)
	}
}
@keyframes wzp_shake{
    0%{
        transform:rotate(0) scale(1) skew(0.017rad)
    }
    25%{
        transform:rotate(0) scale(1) skew(0.017rad)
    }
    35%{
        transform:rotate(-0.3rad) scale(1) skew(0.017rad)
    }
    45%{
        transform:rotate(0.3rad) scale(1) skew(0.017rad)
    }
    55%{
        transform:rotate(-0.3rad) scale(1) skew(0.017rad)
    }
    65%{
        transform:rotate(0.3rad) scale(1) skew(0.017rad)
    }
    75%{
        transform:rotate(0) scale(1) skew(0.017rad)
    }
    100%{
        transform:rotate(0) scale(1) skew(0.017rad)
    }
}
@keyframes wzp_show{
    0%{
        transform:translateZ(-1400px) translateY(22px);
        opacity:0
    }
    20%{
        transform:translateZ(-1000px) translateY(18px);
        opacity:0.2
    }
    40%{
        transform:translateZ(-600px) translateY(15px);
        opacity:0.4
    }
    60%{
        transform:translateZ(-200px) translateY(11px);
        opacity:0.6
    }
    80%{
        transform:translateZ(-0px) translateY(5px);
        opacity:0.8
    }
    100%{
        transform:translateZ(0) translateY(0);
        opacity:1
    }
}
@keyframes wzp_hide{
    100%{
        transform:translateZ(-1400px) translateY(20px);
        opacity:0
    }
    0%{
        transform:translateZ(0) translateY(0);
        opacity:1
    }
}
.whazzup.wzp_box{
   display:none; 
}
.wzp_ondesktop{
    display:none;
}
.wzp_onmobile{
    display:none;
}

.wzp_popup{
    display:none;
}
.wzp_popupmobile{
    display:none;
}
.wzp_popupdesktop{
    display:none;
}
@media only screen and (min-width: 600px) {
    .whazzup.wzp_box.wzp_ondesktop{
        display:block!important;
    }
    .wzp_popup.wzp_popupdesktop{
        display:block!important;
    }
}
@media only screen and (max-width: 600px) {
    .whazzup.wzp_box.wzp_onmobile{
        display:block!important;
    }
    .wzp_popup.wzp_popupmobile{
        display:block!important;
    }
}