#main_emoticon {
	height:25px;
	padding:5px 0;
	border-radius:5px 5px 0 0;
}
.bar_options{
	height:100%;
	width:auto;
	float:left;
	padding:0 4px;
}
.bar_options:first-child {
	border-left:none !important;
}
.bar_options:last-child {
	border-right:none !important;
}
.bar_options img {
	width:auto;
	height:100%;
	display:block;
	margin:0 auto;
}

#picker_box {
	width:130px;
	height:auto;
	padding:2px;
	display:none;
	z-index:10000;
}
.bar_options_item {
	width:21px;
	height:21px;
	float:left;
	margin-right:3px;
	margin-top:2px
}
.bar_options_item img {
	width:100%;
	height:100%:
}
.picker, .wrap_picker {
	height:17px;
	width:17px;
	margin:0 auto;
	float:left;
}
.wrap_picker {
	margin-top:3px;
}
.wrap_picker {
	background-size:100% 100%;
}
.empty_pick {
	background-size:100% 100%;
}

.pick_color {
	width:18px;
	height:18px;
	float:left;
	margin:3px;
	background-size:100% 100%;
}
#list_emoticon {
	width:235px;
	height:auto;
	display:none;
	z-index:10000;
	padding:5px;
}
#list_emoticon img {
	float:left;
	display:block;
	margin:4px;
	height:25px;
	width:auto;
}
#smile_content {
	width:235px;
	height:auto;
}
/* Reverse message order */
.chat_messages, #messages, .messages_list {
    display: flex !important;
    flex-direction: column-reverse !important;
}

/* Message input area layout */
#input_area, .input_area {
    display: flex !important;
    align-items: center;
}
#message_input, .message_input {
    flex: 1;
    padding: 10px;
    border-radius: 4px 0 0 4px;
    border: 1px solid #ccc;
}
#send_button, .send_button {
    padding: 10px 20px;
    border: none;
    background: #0cf;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    border-radius: 0 4px 4px 0;
}
#send_button:hover, .send_button:hover {
    opacity: 0.9;
}
