.card{background:#fff;transition:.5s;border:0;margin-bottom:30px;border-radius:.55rem;position:relative;width:100%;box-shadow:0 1px 2px #0000001a}.chat-app .people-list{background-color:#fff}.chat-app .chat{margin-left:280px;border-left:1px solid #eaeaea}.people-list{-moz-transition:.5s;-o-transition:.5s;-webkit-transition:.5s;transition:.5s}.people-list .chat-list li{padding:15px 30px;list-style:none;border-bottom:1px solid #dbd0d0;border-right:1px solid #dbd0d0}.people-list .chat-list li:first-child{border-top:1px solid #dbd0d0}.people-list .chat-list li:hover{background:#efefef;cursor:pointer}.people-list .chat-list li.active{background:#efefef;border-right:0px}.people-list .chat-list img{width:45px;border-radius:50%}.people-list img{float:left;border-radius:50%}.people-list .about{float:left;padding-left:8px}.people-list .status{color:#999;font-size:13px}.chat .chat-header{padding:15px 20px;border-bottom:2px solid #f4f7f6}.chat .chat-header img{float:left;border-radius:40px;width:40px}.chat .chat-header .chat-about{float:left;padding-left:10px}.chat .chat-history ul{padding:0}.chat .chat-history ul li,.messagelist{list-style:none;margin-bottom:30px;margin-top:5px}.chat .chat-history ul li:last-child{margin-bottom:0}.chat .chat-history .message-data{margin-bottom:15px}.chat .chat-history .message-data img{border-radius:40px;width:40px}.chat .chat-history .sent_message .message-data-time{padding-left:6px;position:absolute;bottom:-25px;right:4px;color:#4e4c4c;font-size:14px}.chat .chat-history .received_message .message-data-time{padding-left:6px;position:absolute;bottom:-25px;left:4px;color:#4e4c4c;font-size:14px}.chat .chat-history .message{color:#444;padding:18px 20px;line-height:26px;font-size:16px;border-radius:7px 0 7px 7px;display:inline-block;position:relative;min-width:100px}.chat .chat-history .message:after{bottom:100%;left:7%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-bottom-color:#fff;border-width:10px;margin-left:-10px}.chat .chat-history .my-message{background:#efefef}.chat .chat-history .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}.chat .chat-history .other-message{background:#e67e3f;text-align:right;color:#fff}.chat .chat-history .other-message:after{border-bottom-color:#e67e3f;left:89%}.chat .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 (min-width: 768px) and (max-width: 992px){.chat-app .chat-list{height:650px;overflow-x:auto}.chat-app .chat-history{height:600px;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-app .chat-list{height:480px;overflow-x:auto}.chat-app .chat-history{height:calc(100vh - 350px);overflow-x:auto}}