.chat-body1{margin-top:7px;}
p.font-else{float:left;line-height:2;font-family:open sans,sans-serif!important;margin-top:12px;margin-left:7px;}
p.font-me{float:left;line-height:2;font-family:open sans,sans-serif!important;margin-top:12px;margin-left:7px;}
#chat,#chat:after{transition:all .4s ease-in-out}
#chat{font-weight:700;cursor:pointer;font-family:Arial,sans-serif;text-align:center;height:30px;}
#chat:after,#chat:before{position:absolute;border-style:solid;content:""}
#chat{margin-top:-50px;font-size:18px!important;width:100px;border-radius:7px;padding:3px 5px;font-size:12px;background:#ff850d;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);transform:translateZ(0);}
#chat:before{border-width:10px 11px 0 0;border-color:#ff850d transparent #ff850d;left:7px;bottom:-10px;}
#chat:after{border-width:9px 8px 0 0;border-color:#ff850d transparent #ff850d;left:8px;bottom:-8px;}
#chat:hover{background:#007aff;-webkit-animation-name:hvr-pulse-grow;-moz-animation-name:hvr-pulse-grow;animation-name:hvr-pulse-grow;-webkit-animation-duration:.3s;-moz-animation-duration:.3s;animation-duration:.3s;-webkit-animation-timing-function:linear;-moz-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;-moz-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;-moz-animation-direction:alternate;animation-direction:alternate}
#chat:hover:after{border-color:#007aff transparent #007aff!important;}
#chat:hover:before{border-color:#007aff transparent #007aff!important;}
.animated-chat{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
@-webkit-keyframes tada{0%{-webkit-transform:scale(1)}
10%,20%{-webkit-transform:scale(.9)rotate(-3deg)}
30%,50%,70%,90%{-webkit-transform:scale(1.1)rotate(3deg)}
40%,60%,80%{-webkit-transform:scale(1.1)rotate(-3deg)}
100%{-webkit-transform:scale(1)rotate(0)}
}
@keyframes tada{0%{transform:scale(1)}
10%,20%{transform:scale(.9)rotate(-3deg)}
30%,50%,70%,90%{transform:scale(1.1)rotate(3deg)}
40%,60%,80%{transform:scale(1.1)rotate(-3deg)}
100%{transform:scale(1)rotate(0)}
}
.tada{-webkit-animation-name:tada;animation-name:tada}
@-webkit-keyframes hvr-pulse-grow{to{-webkit-transform:scale(1.1);transform:scale(1.1)}
}
@keyframes hvr-pulse-grow{to{-webkit-transform:scale(1.1);transform:scale(1.1)}
}
#chat-circle{z-index:111;position:fixed;bottom:50px;right:120px;background:#007aff;width:40px;height:40px;border-radius:50%;color:white;padding:7px;cursor:pointer;box-shadow:0px 3px 16px 0px rgba(0, 0, 0, 0.6), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);}
.btn#my-btn{background:white;padding-top:13px;padding-bottom:12px;border-radius:45px;padding-right:40px;padding-left:40px;color:#5865C3;}
#chat-overlay{background:rgba(255,255,255,0.1);position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;display:none;}
.chat-box{z-index:111;display:none;background:#efefef;position:fixed;right:30px;bottom:50px;width:350px;max-width:85vw;max-height:100vh;border-radius:5px;}
.chat-box-toggle{float:right;cursor:pointer;}
.chat-box-header{background:#3193ff;height:30px;border-top-left-radius:5px;border-top-right-radius:5px;color:white;text-align:center;font-size:16px;}
.chat-box-body{position:relative;height:370px;height:auto;overflow:hidden;}
.chat-box-body:after{content:"";background-image:url(https://giphy.com/gifs/xThuWjC7yute751y0g);opacity:0.1;top:0;left:0;bottom:0;right:0;height:100%;position:absolute;z-index:-1;}
#chat-input{background:#ffffff;width:100%;position:relative;height:30px;padding-top:10px;padding-right:50px;padding-bottom:10px;padding-left:15px;border:none;resize:none;outline:none;color:#000;border-top:none;border-bottom-right-radius:5px;border-bottom-left-radius:5px;overflow:hidden;}
}
.chat-input > form{margin-bottom:0;}
#chat-input::-webkit-input-placeholder{color:#ccc;}
#chat-input::-moz-placeholder{color:#ccc;}
#chat-input:-ms-input-placeholder{color:#ccc;}
#chat-input:-moz-placeholder{color:#ccc;}
.chat-submit{position:absolute;bottom:1px;right:10px;background:transparent;box-shadow:none;border:none;border-radius:50%;color:#3193ff;width:25px;height:25px;}
.chat-logs{padding:6px 7px;height:370px;overflow-y:scroll;}
.chat-logs::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);background-color:#F5F5F5;}
.chat-logs::-moz-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);background-color:#F5F5F5;}
.chat-logs::-moz-scrollbar{width:5px;background-color:#F5F5F5;}
.chat-logs::-webkit-scrollbar{width:5px;background-color:#F5F5F5;}
.chat-logs::-webkit-scrollbar-thumb{background-color:#5A5EB9;}
.chat-logs::-mox-scrollbar-thumb{background-color:#5A5EB9;}
@media only screen and (max-width:500px){.chat-logs{height:40vh;}
}
.chat-msg.user > .msg-avatar img{width:45px;border-radius:50%;float:left;width:15%;}
.chat-msg.self > .msg-avatar img{margin-top:14px;width:45px;height:45px;border-radius:50%;float:right;}
.cm-msg-text{background:white;display:inline-block;padding:9px 11px;line-height:1rem;min-height:2rem;border-radius:1rem;margin-bottom:0.5rem;word-break:break-all;text-transform:capitalize;margin-top:13px;margin-right:5px;border-bottom-right-radius:0.125rem;margin-left:5px;}
.chat-msg{clear:both;}
.chat-msg.self > .cm-msg-text{float:right;background-color:#ff6600;color:#fff;}
.cm-msg-button>ul>li{list-style:none;float:left;width:50%;}
.cm-msg-button{clear:both;margin-bottom:70px;}
.close_chat{line-height:27px;font-size:20px;}
.cm-msg-text-me{color:#fff!important;float:right!important;background-color:#ffa600!important;}
.chat_right{float:right;}
.chat_img_right{float:right!important;}
.username_chat{font-size:18px;font-weight:600;margin-top:1px;float:left;text-transform:capitalize;}
.logout_chat{cursor:pointer;width:41px;margin-top:-32px;height:38px;}