.p-list {
display : table;
margin : 0;
}
.p-list .pic, .p-list .pic2, .p-list .detail {
display : table-cell;
vertical-align : middle;
position : relative;
}
.p-list .detail {
padding-left : 15px;
}
.p-list .pic .c-bg-img-center {
width : 130px;
height : 130px;
}
.p-list .pic2, .p-list .pic2 .c-bg-img-center {
width : 200px;
height : 200px;
}
.p-list .detail .list-unstyled {
margin : 0;
padding : 0;
}
.p-list .detail .status {
font-weight : 500;
text-transform : uppercase;
}
.p-list .detail .message {
font-size : 14px;
}
.p-list .pic2 .new-message {
position : absolute;
top : 0;
left : 0;
height : 100px;
width : 100px;
background : blue;
}
.message .side-list .file ul li span {
display : table-cell; font-size:14px;
}
.message .side-list .file ul li.on {
color : #343780;
}

.message .c-list, .message .m-list, .message .side-list {
display : table-cell;
}
.message .c-list {
width : 250px;
}
.message .top {
padding : 10px;
border-bottom : 1px solid #eee;
}
.message .top h2 {
font-size : 18px;
margin : 0;
display : inline-block;
}
.message em {
font-size : 11px;
color : #d0d0d0;
}
.message .c-list .search {
width : 100%;
background : #f6f6f6;
border-bottom : 1px solid #eee;
padding : 5px 0;
position : relative;
}
.message .c-list .search input, .message .m-list .bottom input {
width : 100%;
border : none;
background : none;
padding : 5px 35px 5px 10px;
}
.message .c-list .search input:focus, .message .m-list .bottom input:focus {
outline : none;
}
.message .c-list .search i, .message .m-list .bottom button {
line-height : 30px;
position : absolute;
top : 2px;
right : 10px;
}
.message .c-list .chat-list {
height : 100px;
overflow : scroll;
}
.message .c-list .chat-list .chat {
display : table;
width : 100%;
padding : 10px;
}
.message .c-list .chat-list .chat.active {
background-color : #eee;
}
.message .c-list .chat-list .chat + .chat {
border-top : 1px solid #eee;
}
.message .c-list .chat-list .chat img, .message .c-list .chat-list .chat .desc {
display : table-cell;
vertical-align : middle;
}
.message .c-list .chat-list .chat img {
width : 50px;
border-radius : 100px;
}
.message .c-list .chat-list .chat .desc {
padding-left : 10px;
width : 80%;
}
.message .c-list .chat-list .chat .desc .notif {
width : 8px;
height : 8px;
margin : 0 5px 1px 0;
background-color : #FF6B57;
}
.message .c-list .chat-list .chat .desc em {
float : right;
}
.message .c-list .chat-list .chat .desc p {
margin : 0;
}
.message .m-list, .message .side-list {
border-left : 1px solid #eee;
}
.message .m-list .chat-list2 {
padding : 15px;
overflow-y : scroll;
}
.message .m-list .chat-list2 .chat2 {
padding : 15px;
border : #eee solid 1px;
width : 90%;
position : relative;
margin-left : 10px;
}
.message .m-list .chat-list2 .chat2 + .chat2 {
margin-top : 15px;
}
.message .m-list .chat-list2 .chat2:before {
content : '';
position : absolute;
left : -15px;
top : 10px;
width : 0;
height : 0;
border-right : 15px solid #eee;
border-top : 10px solid transparent;
border-bottom : 10px solid transparent;
}
.message .m-list .chat-list2 .chat2.pull-right:before {
right : -15px;
left : auto;
border-right : none;
border-left : 15px solid #eee;
}
.message .m-list .chat-list2 .chat2.pull-right {
background-color : #f6f6f6;
margin-right : 10px;
}
.message .m-list .chat-list2 .chat2.pull-right a {
font-size : 14px;
padding : 5px 10px;
}
.message .m-list .chat-list2 .chat2 .top {
padding : 0 0 10px 0;
}
.message .m-list .chat-list2 .chat2 .top h2 {
font-size : 16px;
}
.message .m-list .chat-list2 .chat2.pull-right .top h2 {
float : right;
}
.message .m-list .chat-list2 .chat2 .top em {
float : right;
}
.message .m-list .chat-list2 .chat2.pull-right .top em {
float : none;
}
.message .m-list .chat-list2 .chat2 p, .message .m-list .chat-list2 .chat2 a {
margin : 10px 0 0;
}
.message .m-list .chat-list2 .section {
display : block;
text-align : center;
font-weight : bold;
padding : 15px 0;
}
.message .m-list .chat-list2 .clear {
clear : both;
display : block;
height : 15px;
}
.message .m-list .bottom {
padding : 5px;
border-top : 1px solid #eee;
position : relative;
}
.message .m-list .bottom button {
top : 3.5px;
right : 0;
line-height : 27px;
}
.message .m-list .top i, .message .side-list .top i {
float : right;
margin-top : 3px;
cursor : pointer;
display : none;
opacity : 0;
}
.message .m-list .top i:hover, .message .side-list .top i:hover {
color : #BCD432;
}
.message .side-list {
width : 250px;
}
.message .side-list .chat-list3 {
overflow-y : scroll;
}
.message .side-list .upload {
padding : 30px 15px;
border-bottom : 1px solid #eee;
text-align : center;
}
.message .side-list .upload i {
font-size : 40px;
margin-bottom : 10px;
}
.message .side-list .c-detail {
position : relative;
text-align : center;
padding : 15px;
border-bottom : 1px solid #eee;
}
.message .side-list .c-detail .profile-pic {
border : none;
background-size : 100%;
width : 150px;
height : 150px;
top : 0;
position : relative;
margin : auto;
}
.message .side-list .c-detail .c-product-rating {
color : #BCD432;
}
.message .side-list .c-detail .btn {
width : 100%;
margin : 0;
}
.message .side-list .c-detail .btn + .btn {
margin-top : 10px;
}
.message .side-list .file {
padding : 15px 15px 5px;
}
.message .side-list .file h2 {
display : inline-block;
margin-right : 5px;
}
.message .side-list .file ul {
margin-bottom : 0;
}