.login-container{position:absolute;width:100%;height:100%;background:#f9f6f6cc;display:flex;justify-content:center;align-items:center}.login-form{width:90%;padding:1%;background:#f7f8f9;border-radius:5px;border:solid 1px darkgray;margin:1%}.people-list{width:280px;position:absolute;left:0;top:0;padding:20px;z-index:7}.chat{border-left:1px solid #eaeaea}.people-list{transition:.5s}.chat-list li{padding:10px 15px;list-style:none;border-radius:3px}.chat-list li:hover{background:#efefef;cursor:pointer}.chat-list li.active{background:#efefef}.chat-list li .name{font-size:15px}.chat-list img{width:45px;border-radius:50%}.people-list img{float:left;border-radius:50%}.about{float:left;padding-left:8px}.status{color:#999;font-size:13px}.chat-header{padding:15px 20px;border-bottom:2px solid #f4f7f6}.chat-header img{float:left;border-radius:40px;width:40px}.chat-about{float:left;padding-left:10px}.chat-history{padding:10px;border-bottom:2px solid #fff;max-height:50vh;overflow-y:scroll;overflow-x:hidden}.chat-history ul{padding:0}.chat-history ul li{list-style:none;margin-bottom:30px}.chat-history ul li:last-child{margin-bottom:0}.message-data{margin-bottom:15px}.message-data img{border-radius:40px;width:40px}.message-data-time{color:#434651;padding-left:6px}.message{color:#444;padding:10px;line-height:26px;font-size:16px;border-radius:7px;display:inline-block;position:relative}.message:after{bottom:100%;left:100%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-bottom-color:#fff;border-width:10px;margin-left:-10px}.my-message{background:#efefef}.my-message:after{bottom:100%;left:30px;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-bottom-color:#efefef;border-width:10px;margin-left:-10px}.other-message{background:#e8f1f3;text-align:right}.other-message:after{border-bottom-color:#e8f1f3;left:70%}.chat-message{padding:20px}.online,.offline,.me{margin-right:2px;font-size:8px;vertical-align:middle}.online{color:#86c541}.offline{color:#e47297}.me{color:#1d8ecd}.float-right{float:right}.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}@media only screen and (max-width: 767px){.people-list{height:465px;width:100%;overflow-x:auto;background:#fff;left:-400px;display:none}.people-list.open{left:0}.chat{margin:0}.chat .chat-header{border-radius:.55rem .55rem 0 0}}@media only screen and (min-width: 768px) and (max-width: 992px){.chat-list{height:650px;overflow-x:auto}}@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1){.chat-list{height:480px;overflow-x:auto}.chat-history{height:calc(100vh - 350px);overflow-x:auto}}#images-container{display:none;position:fixed;width:100%;height:100%;background:#a9a9a9;top:0;left:0}