.messages-container{ margin: 0; }
.messages-container > *{ padding: 0; }
.messages-container .list-users{ background: #fafafa; border-right: 1px solid #e0e0e0; }
.messages-container .list-users .top-box{ position: relative; border-bottom: 1px solid #f0f0f0;background: #fff;}
.messages-container .search{ margin-right: 0px; position: relative; }
.messages-container .search input{ margin: 0; padding:7px 15px 7px 36px; border: 1px solid #f2f2f2; background: #fafafa; }
.messages-container .search > i{ position: absolute; left: 13px; top:12px; border-radius: 0; }
.messages-container .top-box button{ position: absolute; right:15px; top:15px; padding:7px; width: 41px; }
.messages-container .list-users > ul{ margin: 0; padding: 0; height: 450px;  overflow-y: auto; }
.messages-container .list-users ul li,.box-messages .content ul li{ list-style: none; cursor: pointer; position: relative; padding: 10px 10px 10px 68px; border-top: 1px solid #f0f0f0; min-height: 62px; }
.box-messages .content ul li{ margin:0 }
.messages-container .list-users ul li:first-child,.box-messages .content ul li:first-child{ border:none; }
.messages-container .list-users a{ font-size: 13px; text-decoration: none; color: #333; }
.messages-container .list-users ul li img,.box-messages .content ul li img{ position: absolute; border-radius: 50%; width: 40px; height: 40px; left: 15px; top: 10px; }
.messages-container i.status,.box-messages .content ul li i.status{ position: absolute; border-radius: 50%; width: 12px; height: 12px; left: 15px; top: 10px; background: #888; border: 2px solid #f0f0f0; z-index: 1; }
.messages-container i.online,.box-messages .content ul li i.online{ background: green; }
.messages-container .list-users ul li strong,.box-messages .content ul li strong{ font-size: 13px; margin:4px 65px 4px 0;line-height: 14px; font-weight: bold; display: block; }
.messages-container .list-users ul li p,.box-messages .content ul li p{ color: #777; line-height: 15px; padding: 0 22px 0 0; margin-top: 0; margin-bottom: 0; font-size: 13px; display: block; }
.messages-container .list-users ul li b,.box-messages .content ul li b{ position: absolute; right: 11px; bottom: 14px; background: blue; color: #fff; border-radius:10px; font-size: 11px; line-height: 10px; padding:3px 5px; display: inline-block; }
.messages-container .list-users ul li span,.box-messages .content ul li span{ position: absolute; top: 12px; font-size: 12px; right: 10px;  }
.messages-container .list-users ul li strong, .messages-container .list-users ul li p,.box-messages .content ul li strong, .box-messages .content ul li p{ text-overflow: ellipsis;overflow: hidden; white-space: nowrap; }
.messages-container .list-users ul li p u{ font-weight: bold; }
.messages-container .list-users ul li:hover,.messages-container .list-users ul li.active{ background: #fff; }
.messages-container .list-users > ul li.active::before{ content:" "; position: absolute; width: 3px; height: 100%; left: 0; top: 0; background: blue; }
.messages-container img{ padding: 1px; border:1px solid #ddd;  }

.message-container{ position: relative; }
.message-container .top-box{ border-bottom: 1px solid #f0f0f0; background: #fafafa; }
.message-container .top-box img{ width: 40px; position: absolute; left:0px; top:-2px; border-radius:50%; }
.message-container .top-box > div{ min-height:37px; padding-left: 53px; padding-right:80px; }
.message-container.nu .top-box > div *{ display: none; }
.message-container.nu .no-data, .message-container .no-data-m{ position: absolute; line-height: 16px; top: 50%; left: 15px; right: 15px; text-align: center; color: #777; }
.message-container:not(.nu) .no-data{ display: none; }
.message-container.nu .loading-messages .js-processing{ display: none; }

.message-container .top-box strong,.message-container .top-box span{ display: block; padding-top:3px; line-height: 14px; text-overflow: ellipsis;overflow: hidden; white-space: nowrap; }
.message-container .top-box a{ text-decoration: none; }
.message-container .top-box span{ font-size: 13px; color:#777; }
.message-container i.status{ position: relative; top: 1px; left: 0; display: inline-block; }
.message-container .buttons{ position: absolute; right:-10px; top:-7px; min-width: 50px; }
.message-container .buttons button{ padding: 0; background:none; }
.message-container .list-messages,.message-container .loading-messages{ overflow-y: auto; position: relative; height:400px; }
.message-container .list-messages{ display: none; }
.message-container .list-messages .item{ position: relative; margin:20px 15px; padding:0 40px; }
.message-container .list-messages .item .uimg{ width: 30px; height: 30px; border-radius:50%; position: absolute; left: 0; bottom:14px;  }
.message-container .list-messages .item .msg{  padding:9px 13px; border-radius:10px 10px 10px 0; display: inline-block; background: blue; color: #fff;  }
.message-container .list-messages .item .msg p{ padding: 0; margin: 0; line-height: 18px; font-size: 14px; }
.message-container .list-messages .item .time{ display: block; line-height: 12px; font-size: 11px; color:#777; margin-top: 3px; }
.message-container .list-messages .item .msg::before{ content:" "; position: absolute; bottom: 15px; border:7px solid transparent; border-right-color: blue; left: 34px; transform: rotate(90deg); }
.message-container .list-messages .item.right{ text-align: right; }
.message-container .list-messages .item.right p{ text-align:left; }
.message-container .list-messages .item.right .uimg{ left: auto; right: 0; }
.message-container .list-messages .item.right .msg{ border-radius:10px 10px 0 10px; background:#f5f5f5; color: #333; }
.message-container .list-messages .item.right .msg::before{ border-right-color: #f5f5f5; left: auto; right: 34px; }
.message-container .list-messages .item .msg .icon-emoji{ font-size:40px; }
.message-container .list-messages .item.nond{ margin-bottom:-15px; }
.message-container .list-messages .item.nond .msg{ border-radius:10px; }
.message-container .list-messages .item.nond .msg::before{ display: none; }

.message-container .message-form{ border-top: 1px solid #f0f0f0;  position: relative;}
.message-container .message-form textarea{ width: 100%; padding:12px 45px 11px 75px; outline: none;height: 46px;font-size: 14px; border: none;background: none;max-height: 46px; overflow: hidden; }
.message-container .message-form ._btn{ position: absolute; top:10px; margin: 0; z-index: 1; }
.message-container textarea:disabled, .message-container.nu textarea{ position: relative; z-index: 2; background: rgba(255,255,255,0.6); }
.message-container .message-form button{ background: none; padding:3px; margin: 0; border:none; }
.message-container .message-form .btn-attach{ left:15px; }
.message-container .message-form .btn-group{ left:45px; }
.message-container .message-form .btn-send{ right: 15px; color: blue; width: 30px; height: 30px; top: 8px; }
.message-container .message-form .btn-send:disabled{ color: #888; }
.message-container.loading > *,.message-container.deleted > *{ display: none; }
.message-container.deleted p.no-data{ display: block; }

.message-container .js-processing{ display: none; position: absolute; margin-top:-11px; margin-left: -11px ;top: 50%; left: 50%;}
.message-container.loading .js-processing,.message-container .loading-messages .js-processing{ display: inline-block; }
.message-container .list-emoji{ inset:auto auto 0px 0px !important; padding:5px 4px 4px 5px; }
.message-container .list-emoji .fa{ cursor: pointer; font-weight: normal; display: inline-block; padding:0; font-size: 20px; width: 25px; height: 28px; text-align: center; line-height: 27px; }
.message-container .list-emoji .fa:hover{ font-weight: 900; }

.message-container .ajax_results{ position: absolute; top: -50px; left: 15px; right: 15px; }
.message-container .ajax_results .alert{ padding: 6px 10px; font-size: 13px; }


@media (max-width:767px){
   .messages-container .message-container{ display: none; }
   .message-container .top-box{ padding-top: 10px !important; padding-bottom: 10px !important; }
}

@media (max-width:520px){
   .user_notifiactions .box-messages{ display: none; }
}
@media (max-width:420px){
   .message-actions button > span.m,.message-actions .page-counter{ display:none; }
   
}