#webchat-wrapper {
	width: 100%;
	height: 100%;
}

#webchat-wrapper .card-body-cs {
	background: rgb(246, 246, 247);
	overflow: hidden;
}

#webchat-wrapper .btn-user-icon {
    top: -15px !important;
    left: calc(100% - 50%) !important;
	padding: 7px 11px !important;
}

#webchat-wrapper .chat-list li .chat-content {
	width: 100%;
    display: block;
    padding: 0px;
}

#webchat-wrapper .chat-list li {
    margin-top: 5px;
}

#webchat-wrapper .chat-list li .chat-content .box {
    font-size: 13px;
    font-weight: 500;
}

#webchat-wrapper .chat-list li .chat-content h6 {
    color: rgb(112, 112, 112);
}

#webchat-wrapper .chat-list li .chat-content h6 small {
    font-weight: 600;
}

#webchat-wrapper .textarea {
  display: block;
  width: 100%;
  overflow: hidden;
  resize: none;
  min-height: 40px;
  line-height: 20px;
  font-size: 14px;
}

#webchat-wrapper .textarea[contenteditable]:empty::before {
  content: "Enter your message";
  color: gray;
}

#webchat-wrapper .write-message {
	padding: 10px;
	max-height: 100px;
	overflow: auto;
	margin: 0;
	min-height: 60px;
	border-top: 1px solid rgba(0,0,0,.125);
}

#webchat-wrapper .btn-send {
    right: 25px;
    top: calc(100% - 70%);
}

#webchat-wrapper .form-control,
#webchat-wrapper .form-register {
	font-size: 13px;
}

#webchat-wrapper .oc-chat-box .chat-list li.li-disabled {
    opacity: 0.5;
}

#webchat-wrapper .of-y-auto {
    overflow-y: auto !important;
}

#webchat-wrapper #typing-status{
    font-size: 11px;
    text-transform: lowercase;
	font-weight: 500;
}

#webchat-wrapper #typing-info {
	padding: 2px 10px;
}