html, body {width:100%;height:100%}
.chatbot-container {position:fixed;right:20px;bottom:20px;color:#292a4a;z-index:3;font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}
.chatbot-welcome {position:absolute;bottom:0;right:0;display:block;transition:.6s;opacity:1;z-index:1;visibility:visible;z-index:3;line-height:1.5}
.chatbot-welcome.dnone {bottom: -20px;opacity: 0;visibility: hidden;z-index: -1;transition: .6s}
.chatbot-welcome .chatbot-close {display:block;position:absolute;right:12px;top:15px;width:12px;height:12px;background: url('https://ask4essay.com/img/close.png');z-index:2;cursor:pointer}
.chatbot-welcome .chatbot-message {display:block;background:#fff;border:2px solid #0b6ed9;border-radius:9px;border-bottom-right-radius:0;padding:8px 15px;font-size:14px;width:200px;box-shadow:2px 2px 20px rgba(0,0,0,.1);margin-bottom:10px;cursor:pointer}
.chatbot-welcome .chatbot-avatar {display:block;float:right;cursor:pointer}
.chatbot-welcome .chatbot-avatar img {display: block;border: 2px solid #0b6ed9;border-radius: 50%;width: 56px;height: 56px;object-fit: cover}
.chatbot-main {position: absolute;bottom: 0;right: 0;display: block;transition: .6s;opacity: 1;z-index: 2;width: 333px;height: 480px;border: 2px solid #e7f1fb;border-radius: 8px;visibility: visible}
.chatbot-main.dnone {bottom: -20px;opacity: 0;visibility: hidden;transition: .6s}
.chatbot-main .chatbot-header {background:#e7f1fb;padding:10px 17px;line-height:1.5}
.chatbot-main .chatbot-header:after {content: '';display: table;width: 100%;clear: both}
.chatbot-main .chatbot-header .chatbot-avatar {float: left;margin-right: 10px}
.chatbot-main .chatbot-header .chatbot-avatar img {display: block;border: 2px solid #c5cddc;border-radius: 50%;width: 56px;height: 56px;object-fit: cover}
.chatbot-main .chatbot-header .chatbot-close {display: block;position: absolute;right: 20px;top: 20px;width: 12px;height: 12px;background: url('https://ask4essay.com/img/close.png');z-index: 2;cursor: pointer}
.chatbot-main .chatbot-header .chatbot-avatar-name {font-size:18px;font-weight:700;color:#0c6fd9;padding-top:2px}
.chatbot-main .chatbot-header .chatbot-avatar-status {font-size:14px;font-weight:400}
.chatbot-main .chatbot-body {padding:14px 17px;overflow-y:auto;height:400px;background-color:#fff;}
.chatbot-main .chatbot-body:after {content: '';display:table;width:100%;clear:both}
.chatbot-main .chatbot-body::-webkit-scrollbar {width:2px;}
.chatbot-main .chatbot-body::-webkit-scrollbar-thumb {background-color:#0b6ed9;border-radius:2px}
.chatbot-main .chatbot-body .chatbot-dialog {display: block;width: 100%;visibility: visible;opacity: 1;transition: 1s;clear: both}
.chatbot-main .chatbot-body .chatbot-dialog.dnone {visibility: hidden;opacity: 0;height: 0;overflow: hidden;transition: 1s}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-avatar {float: left;width: 25px;height: 25px}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-avatar img {display: block;border: 1px solid #c5cddc;border-radius: 50%;width: 25px;height: 25px;object-fit: cover}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message {display:block;background:#f4f4f4;padding:10px 17px;margin:0 0 10px 8px;border-radius:8px;border-top-left-radius:0;float:left;max-width:260px;line-height:1.5}
.chatbot-main .chatbot-body .chatbot-dialog#types .chatbot-message {display: block;padding: 0 0 10px;margin: 0 0 10px 8px;border-radius: 8px;border-top-left-radius: 0;float: left;width: 100%}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message.transparent {background: transparent}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message button {background: #e7f1fb;border: 2px solid #0b6ed9;border-radius: 8px;font-weight: 700;color: #0b6ed9;padding: 5px 15px;cursor: pointer;transition: .15s;margin: 0 0 8px;width: 100%;text-align: left}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message button:after {content: '→';float: right;font-size: 24px;line-height: 20px;transition: .6s}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message button:hover {background: #0b6ed9;color: #fff}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message ul {display: block;padding: 0;margin: 0;border: 1px solid #f4f4f4;border-radius: 8px;overflow: hidden}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message ul li {display: block;padding: 5px 10px;margin: 0;cursor: pointer;transition: .6s;border-bottom: 1px solid #f4f4f4}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message ul li:last-child {border-bottom: none}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message ul li:before {content: '□ ';font-size: 21px;line-height: 10px}
.chatbot-main .chatbot-body .chatbot-dialog .chatbot-message ul li:hover {background: #0b6ed9;color: #fff}
.chatbot-main .chatbot-body .chatbot-dialog.self .chatbot-message {background: #e7f1fb;border-top-left-radius: 8px;border-bottom-right-radius: 0;float: right}
.chatbot-main .chatbot-body .dots {display: block;position: absolute;z-index: 4;width: 23px;height: 9px;background: url('https://ask4essay.com/img/dot.gif');bottom: 10px;left: 10px}
.chatbot-main .chatbot-body .dots.dnone {display: none}
.chatbot-main .chatbot-controls {position: absolute;width: 100%;bottom: 0;left: 0;padding: 10px 20px;text-align: center}
.chatbot-main .chatbot-controls button {background: #fff;border: 2px solid #0b6ed9;border-radius: 8px;font-weight: 700;color: #0b6ed9;padding: 5px 25px;cursor: pointer;transition: .15s}
.chatbot-main .chatbot-controls button:hover,
.chatbot-main .chatbot-controls button.active {background: #0b6ed9;color: #fff}
.chatbot-main .chatbot-controls button.active {margin-right: 5px}