.chatroom-container { position: relative; padding: 0; max-width: 970px; overflow: hidden; margin-bottom: 20px; padding-bottom: 55px; border-radius: 5px; border-radius: 0\9\0; background: #F1F2F6; }

.pachat-block, .pagroup-list, .tabcont-list, .tabcont-list * { -webkit-transition: all .3s ease-out,color .1s; transition: all .3s ease-out,color .1s; }

.tab-content, .createGroup-room,
.pagroup-room, .createGroup-room > li, .CGroup-btn-step { -webkit-transition: -webkit-transform .4s ease-out; transition: transform .4s ease-out; }


.pageTBtn { cursor: pointer; }

.tab-menu { overflow: hidden; }

.tab-menu li { float: left; }

.tab-content, .createGroup-room { white-space: nowrap; letter-spacing: -4px; /*根据不同字体字号或许需要做一定的调整*/ word-spacing: 0; font-size: 0; }

.tab-content > li { width: 100%; height: 100%; }

.tab-content > li, .createGroup-room > li { display: inline-block; letter-spacing: normal; word-spacing: normal; *display: inline; zoom: 1; vertical-align: top; font-size: 15px; }

.tab-content > li .tabcont-list:last-child { margin-bottom: 10px; }

.data-close { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 99; display: none; background: rgba(0,0,0,.2); }
/*display table start*/
.dis-table, .tabcont-box { display: table; width: 100%; }

.dis-table > *, .tabcont-box > *, .dis-tr > * { display: table-cell; vertical-align: middle; }

.dis-thead { display: table-header-group; }

.dis-tbody { display: table-row-group; }


.dis-tfoot { display: table-footer-group; }

.dis-tr { display: table-row; }

.dis-caption { display: table-caption; }
/*display table end*/
/*tab-menu start*/
.pagroup-tab-menu { position: relative; line-height: 39px; left: 0; text-align: center; width: 100%; overflow: hidden; color: #333; z-index: 10; background: #f7f7f7; border-bottom: 1px solid #ddd; z-index: 101; }

.pagroup-tab-menu li { cursor: pointer; margin: 0 20px 0 10px; padding: 0 10px; font-size: 16px; color: #555; }

.pagroup-tab-menu li.active { color: #394F75; box-shadow: inset 0 -2px 0 #394F75; }

.pagroup-tab-content { top: 40px; }

/*tab-menu end*/

.pachat-block { background: none; border: none; text-align: center; margin-bottom: 0; bottom: 0; }

.pachat-block, .pachat-box { position: absolute; top: 40px; left: 0; right: 0; }

.pachat-box { bottom: 20px; background: #fff; /*height: 100%;*/ max-width: 1170px; margin: 0 auto; border-radius: 4px; /*position: relative;*/ overflow: hidden; }

.pagroup-list { text-align: left; overflow: hidden; width: 100%; height: 100%; position: relative; z-index: 10; }

.pagroup-list-head { background-color: #394F75; color: #f2f2f2; overflow: hidden; line-height: 50px; height: 50px; padding: 0 10px; }

.pabox-search { position: relative; }

.pabox-search input { line-height: 1; border-radius: 4px; border: none; background: #2D3D5A; padding: 0 12px 0 30px; width: 240px; outline: none; height: 36px; }

.pabox-search input + i { position: absolute; top: 0; left: 9px; font-size: 14px; color: rgba(255,255,255,.7); }

.pabox-search input:focus { background: #21324F; }

.pabox-search input:focus + i { color: #fff; }


.tabcont-list { position: relative; padding: 10px 20px 0; /*transition:all linear .4s;*/ }
.tabcont-list:after { content:"";display:block;clear:both;float:none;}

.tabcont-list.foldUp { max-height: 40px;overflow: hidden; }

.tabcont-list-classify { position: relative; width: 100%; float: none; overflow: hidden; margin: 0 0 0 20px !important; min-height: 0 !important; }

.tabcont-list-classify span { padding: 0 10px; font-size: 13px; }

.tabcont-list-cate { position: relative; border: 1px solid transparent; cursor: pointer; min-height: 0 !Important; }

.tabcont-list-cate:hover { border-color: #ddd; }

.tabcont-list-cate:hover .iconfont { opacity: 1; color: #333; }

.tabcont-list-cate span { background: #fff; padding: 0 10px; position: relative; z-index: 1; float: left; }

.tabcont-list-cate:before, .tabcont-list-cate:after, .tabcont-list-classify:before { content: ""; position: absolute; left: 0; }

.tabcont-list-cate:before, .tabcont-list-classify:before { top: 4px; height: 13px; width: 5px; background: #394f75; z-index: 10; }

.tabcont-list-classify:before { height: 12px; top: 5px; background: #7b96c4; }

.tabcont-list-cate:after { height: 1px; right: 13px; border-bottom: 1px dashed #e0e0e0; top: 10px; }

.tabcont-list-cate .iconfont { float: right; color: #ccc; font-size: 14px; position: relative; top: 1px; opacity: .5; }

.tabcont-list > li { margin: 6px 0; min-height: 80px; overflow: hidden; }

.modal-body .tabcont-list > li { margin: 3px 0 0; }
.pachat-box.open .tabcont-list > li:hover { background-color: rgba(255,255,255,.05); }

.tabcont-box { position: relative; background: #fafafa; border: 1px solid #f2f2f2; text-align: left; width: 90%; border-radius: 4px; padding: 10px; margin: 0 auto; }

.tabcont-box:hover { background: #f7f7f7; border-color: #ddd; }
.tabcont-box:hover .list-group-check .iconfont { color: #ccc; }
.form-select .tabcont-box input:checked + .iconfont { color: #fff !Important; }

.tabcont-box > li { cursor: pointer; }

.tabcont-box > li > div { margin: 5px 0; overflow: hidden; text-overflow: ellipsis; }

.tabcont-box > li > div:first-child { font-size: 15px; }

.tabcont-box > li > div.time { color: #666; font-size: 13px; }

.tabcont-box > li > div.tip sup { border-radius: 50px; background: rgba(209,52,52,.8); color: #fff; padding: 2px 6px; position: relative; top: -2px; }

.tabcont-box > li .list-group-check { position: absolute; top: 50%; right: 0; margin-top: -11px; }
.list-paGPic, .list-paGNotice { width: 50px; }

.list-paGNotice { text-align: right; }

.list-paGPic img { width: 100%; height: 50px; border-radius: 5px; overflow: hidden; }

.list-paGCont { overflow: hidden; max-width: 100px; text-overflow: ellipsis; padding-left: 5px; white-space: nowrap; }

.list-paGWords { color: #999; font-size: 13px; text-overflow: ellipsis; overflow: hidden; }

.pagroup-room { background-color: #fafafa; /*height: 100%;
    position: absolute;
    top: 50px;
    right: 0;
    left: 0;
    opacity: 0;*/ z-index: 10; }

.pagroup-list-content { top: 50px; }

.pagroup-list-content, .pagroup-tab-content { position: absolute; bottom: 0; width: 100%; }


/*PAChat-Room Open Start*/
.pachat-box.open .pagroup-room { opacity: 1; }

.pachat-box.open .pagroup-list { width: 300px; }

.pachat-box.open .tabcont-list { padding: 0; }

.pachat-box.open .tabcont-list > li { width: 100%; border-bottom: 1px solid rgba(0,0,0,.1); margin: 0; }

.pachat-box.open .tabcont-list > li.active { background-color: #21324F !important; }

.pachat-box.open .tabcont-list.foldUp { max-height: 36px; }

.pachat-box.open .tabcont-list-classify { margin: 0 !important; color: #fff; background: none !important; }

.pachat-box.open .tabcont-list-classify span { padding: 2px 13px; font-size: 12px; display: block; background-color: rgba(0,0,0,.1); color: rgba(255,255,255,.6); }

.pachat-box.open .tabcont-list-classify:before { background: none; }

.pachat-box.open .tabcont-box { background: none; border: none; padding: 0; width: 95%; color: #fff; }

.pachat-box.open .pagroup-tab-menu li { margin: 0; width: 33.33333%; }

.pachat-box.open .pagroup-tab-menu li > span { display: none; }

.pachat-box.open .pagroup-list-content { background-color: #394F75; }

.pachat-box.open .pagroup-tab-menu { background: none; border-bottom: 1px solid rgba(0,0,0,.3); }

.pachat-box.open .pagroup-tab-menu li { color: #0b282d; }

.pachat-box.open .pagroup-tab-menu li .iconfont { transition: all linear .2s; display: block; }

.pachat-box.open .pagroup-tab-menu li.active { color: #fff; box-shadow: inset 0 -2px 0 rgba(255,255,255,.6); }

.pachat-box.open .pagroup-tab-menu li.active .iconfont { transform: scale(1.3); -ms-transform: scale(1.3); /* IE 9 */ -webkit-transform: scale(1.3); /* Safari and Chrome */ }

.pachat-box.open .pabox-create span { display: none; }

.pabox-create { cursor: pointer; padding: 0 20px; position: relative; right: -10px; color: #a5c6f2; transition: all linear .2s; color: #FFF; }

.pabox-create:hover { background: #556F9D; }

.pabox-create .iconfont { font-size: 18px; font-weight: 700; position: relative; margin-top: -3px; display: inline-block; top: 2px; }

.pachat-box.open .pabox-create { padding: 0; right: 0; }

.pachat-box.open .pabox-create .iconfont { position: relative; right: -1px; opacity: .8; padding: 8px; border-radius: 4px; transition: all linear .2s; top: 0; display: inline; }

.pachat-box.open .pabox-create:hover { background: none; }

.pachat-box.open .pabox-create .iconfont:hover, .pachat-box.open .pabox-create.active .iconfont { opacity: 1; background: rgba(0,0,0,.1); }

.pachat-box.open .list-paGWords,
.pachat-box.open .tabcont-box > li > div.time { color: rgba(255,255,255,.5); }

.pachat-box.open .tabcont-list-cate { background-color: rgba(255,255,255,.1) !important; line-height: 34px; border: none; color: #fff; }

.pachat-box.open .tabcont-list-cate:before, .pachat-box.open .tabcont-list-cate:after,
.pachat-box.open .tabcont-list-cate span { background: none; border: none; font-size: 13px; }

.pachat-box.open .tabcont-list-cate .iconfont { right: 10px; }

.pachat-box .foldUp .tabcont-list-cate .iconfont { opacity: 1; }

.pachat-box .foldUp .tabcont-list-cate .iconfont:before { content: "\e605"; }

/*PAChat-Room Open End*/
/*scroll style*/

.mCSB_scrollTools .mCSB_draggerRail { background: #ddd; }

.chat-his-dropmenu .dropdown-menu .mCSB_scrollTools .mCSB_draggerRail { background: none; }

.pachat-box.open .pagroup-tab-content > li .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.pachat-box.open .pagroup-tab-content > li .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background: rgba(255,255,255,0.75); }

/*textarea scroll*/
.chatroom-foot .textarea-wrapper { height: 95px; overflow: hidden; border-top: 1px solid #e5e5e5; margin-bottom: 10px; }

.hiddendiv { position: absolute; top: -9999px; visibility: hidden; white-space: pre-wrap; min-height: 80px; font-family: Arial, sans-serif; word-wrap: break-word; left: 20px; right: 20px; }

.mCSB_scrollTools { box-sizing: border-box; padding: 5px 0; }

.mCSB_scrollTools .mCSB_draggerContainer { margin: 5px 0; }

.chatroom-foot .textarea-wrapper .mCustomScrollBox > .mCSB_scrollTools { opacity: 0.7; filter: "alpha(opacity=70)"; -ms-filter: "alpha(opacity=70)"; }

/*scroll style*/
/*pagroup-room start*/
.chatroom-head { position: relative; min-height: 40px; z-index: 100; max-height: 40px; box-shadow: none; background: #f1f2f6; }

.chatroom-title { position: absolute; left: 0; right: 0; top: 0; background: #f1f2f6; border-bottom: 1px solid #ebebeb; z-index: 10; }

.chatroom-title > span { display: inline-block; padding: 0 20px; cursor: pointer; font-size: 16px; }

.group-title { font-size: 15px; }

.group-title .iconfont { margin-top: -2px; display: inline-block; position: relative; top: 2px; }

.chatroom-tool { z-index: 10; position: relative; position: absolute; right: 0; }

.chatroom-tool, .chatroom-title { line-height: 40px; height: 40px; }

.chatroom-tool > .iconfont { padding: 0 16px; color: #21324f; cursor: pointer; display: inline-block; line-height: 38px; }

.chatroom-tool > .icon-Edit { background: rgba(75, 97, 136, 0.5); color: #fff; }

.chatroom-tool .icon-Menu { font-size: 18px; }

.chatroom-tool .icon-Clear { position: relative; bottom: 3px; font-size: 14px; }

.chatroom-tool > .iconfont span { font-family: Arial; font-size: 12px; line-height: normal; }

.chatroom-search { position: relative; display: inline-block; line-height: 40px; vertical-align: top; margin-right: 18px; }

.chatroom-search input { border-radius: 50px; border: 1px solid #ddd; background: #fff; line-height: 1; padding: 0 30px 0 15px; outline: none; width: 240px; height: 30px; transition: all linear .2s; }

.chatroom-search input:focus { border-color: #394f75; }

.chatroom-search .iconfont { position: absolute; line-height: 40px; top: 0; right: 0; padding: 0 10px; cursor: pointer; color: #999; font-size: 15px; }

.chatroom-search .iconfont:hover { background: none !Important; }

.chatroom-search input:focus + .iconfont { color: #21324F; }

#createGroup .chatroom-tool .icon-Clear { bottom: 0; }

.chatroom-tool .iconfont:hover, .chatroom-tool .iconfont.active { background: #fff; color: #21324f; }

.chatroom-tool > .icon-Edit:hover { background: rgba(75, 97, 136, 1); color: #fff; }

.chatroom-tool .icon-Clear:hover { color: #DD4747; }

.chatroom-content { position: absolute; top: 40px; bottom: 150px; width: 100%; }

.chatroom-content-container { padding: 10px 20px; min-height: 580px; }

.createGroup-room { bottom: 0; overflow: hidden; }

.chatroom-foot { position: absolute; width: 100%; bottom: 0; height: 150px; padding: 0 20px; overflow: hidden; background-color: #FAFAFA; }

.chatroom-foot textarea { width: 100%; height: 80px; resize: none; outline: none; border: none; padding: 10px 0; background: none; overflow: hidden; line-height: 22px; font-size: 14px; }

.chatroom-members { text-align: center; overflow: hidden; max-height: 400px; position: relative; top: 40px; visibility: hidden; width: 100%; background: #fff; box-shadow: 0 1px 1px rgba(0,0,0,.05); -webkit-transition: -webkit-transform .2s ease-out; transition: transform .2s ease-out; }

.chatroom-members li { float: left; margin: 0 7px; padding-top: 10px; cursor: pointer; transition: all linear .2s; }

.chatroom-members li:hover { background: #f2f2f2; }

.chat-sendBtn { float: right; position: relative; color: #999; right: 24px; }

.chat-sendBtn button { width: 85px; height: 35px; background: #fff; border-radius: 4px; border: 1px solid #ccc; margin-left: 10px; color: #666; outline: none; }

.chatroom-memberInfo img, .chatroom-addMember .iconfont { width: 55px; height: 55px; }

.chatroom-memberInfo p { color: #888; width: 72px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; font-size: 12px; line-height: 30px; margin-bottom: 0; height: 30px; }

.chatroom-addMember { width: 72px; position: relative; }

.chatroom-addMember:before { position: absolute; top: 100%; white-space: nowrap; left: 0; line-height: 30px; color: #666; visibility: hidden; opacity: 0; transition: opacity .3s linear; width: 100%; }

/*.chatroom-addMember:before {
        content: "Add";
    }*/

.chatroom-moreMember:before { content: "More"; }

.chatroom-addMember:hover:before { visibility: visible; opacity: 1; }

.chatroom-addMember .iconfont { border: 1px dashed #ccc; line-height: 55px; font-size: 33px; color: #ccc; margin: 0 auto; display: block; transition: all linear .4s; }

.chatroom-addMember:hover { background: none !important; }

.chatroom-addMember:hover .iconfont { border: 1px solid #999; color: #999; }
/*pagroup-room end*/

/*creatgroup*/
.createGroup-room > li { position: relative; height: 100%; text-align: left; padding: 10px 20px; background: #FAFAFA; border: 1px solid transparent; z-index: 101; }

.createGroup-room > li:last-child { position: absolute; right: 0; top: 0; bottom: 0; }

.createGroup-room > li.active:first-child { border-right-color: #ddd; }

.createGroup-room > li.active:last-child { border-left-color: #FFF; box-shadow: -1px 0 2px rgba(0,0,0,.2); }


.createGroup-member.active { transform: translateX(-67%); -ms-transform: translateX(-67%); -webkit-transform: translateX(-67%); }

.creGroup-pro { text-align: left; padding: 0 10px 10px; margin-bottom: 0; }

.creGroup-pro dt { margin: 10px auto; font-size: 18px; font-weight: 200; white-space: normal; }

.creGroup-pro dd, .group-options select { padding: 0; background: #fff; border-radius: 4px; border: 1px solid #eee; }

.creGroup-pro dd label { position: relative; display: block; padding: 9px 10px; margin-bottom: 0; border-bottom: 1px solid #f2f2f2; font-weight: 200; font-size: 14px; cursor: pointer; }


.createGroup-room > li .mem-tab-content { top: 100px; background: #fff; border-top: 1px solid #ddd; }

.createGroup-room > li .mem-tab-content img { height: auto; }

.CGroup-infro { position: absolute; top: 0; height: 100px; left: 5px; right: 5px; text-align: center; padding-top: 10px; }

.CGroup-infro > li { position: relative; padding: 8px 0; }

.CGroup-infro input[type="text"] { width: 100%; background: none; border: none; border-bottom: 1px solid #ddd; height: 35px; outline: none; padding-left: 30px; }

.CGroup-infro input[type="text"] + .iconfont { position: absolute; color: #666; top: 11px; left: 5px; font-size: 20px; }

.CGroup-infro input[type="text"]:focus { border-bottom-color: #21324F; }

.CGroup-infro input[type="text"]:focus + .iconfont { color: #21324F; }

.member-title { position: absolute !important; bottom: 0; text-align: left; padding: 0 5px !important; font-weight: 700; color: #666; }

.member-title-select { text-align: right; padding-right: 10px; }

.member-title-select span { font-weight: 300; font-size: 12px; cursor: pointer; }

.member-check input[type="checkbox"], .member-title-select input[type="checkbox"] { display: none; }

.member-check input[type="checkbox"] + a, .member-title-select input[type="checkbox"] + a { border: 1px solid #ccc; display: inline-block; width: 15px; height: 15px; line-height: 18px; text-align: center; font-size: 12px; overflow: hidden; position: relative; top: 3px; }

.member-check input[type="checkbox"] + a:before, .member-title-select input[type="checkbox"] + a:before { visibility: hidden; color: #fff; bottom: 1px; position: relative; }

.member-selcted { width: 80%; margin: 0 auto; }

.member-selcted img { width: 30px; margin-right: 10px; cursor: pointer; transition: all linear .1s; }

.member-selcted img:hover { opacity: .5; }

.member-selct .dis-table { cursor: pointer; }

.member-selct label .iconfont { width: 18px; height: 18px; line-height: 16px; margin-right: 0; }

input[checked="checked"] + a { background: #394F75; border-color: #1F3554; }

input[checked="checked"] + a:before { visibility: visible !important; }

.member-selcted .mCustomScrollBox > .mCSB_scrollTools { overflow: visible !important; z-index: 100; }

.member-selcted .mCSB_horizontal > .mCSB_scrollTools .mCSB_buttonLeft, .member-selcted .mCSB_horizontal > .mCSB_scrollTools .mCSB_buttonRight { min-height: 20px; }

.member-selcted .mCSB_horizontal > .mCSB_scrollTools { opacity: .2; filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; z-index: 10; }

.member-selcted .mCSB_horizontal > .mCSB_container { margin-bottom: 10px; min-width: 100% !important; }

.member-selcted .mCSB_horizontal > .mCSB_container:empty:before { content: "Select Members"; color: #666; }

.member-selcted .mCSB_horizontal > .mCSB_scrollTools .mCSB_buttonLeft, .member-selcted .mCSB_horizontal > .mCSB_scrollTools .mCSB_buttonRight { bottom: 30px; }
/*creatgroup end*/

/*chatroom-sidebar start*/
.chatroom-sidebar-block { position: absolute; top: 40px; float: right; width: 300px; max-height: 640px; overflow: hidden; text-align: center; box-shadow: -1px 1px 2px rgba(0,0,0,.1); border-radius: 0 0 0 2px; right: 0; visibility: hidden; transition: all .2s ease-out; }

.chatroom-sidebar-block.open { visibility: visible; }

.chatroom-sidebar, .chatroom-allMem { position: relative; background: #fafafa; max-height: 500px; }

.chatroom-sidebar, .chatroom-allMem { min-width: 300px; }

.chatroom-allMem { left: 0; }

.GM-list { margin-bottom: 10px; }

.GM-list-title { font-size: 14px; }

.GM-list-edit input { outline: none; text-align: right; min-width: 31%; border: none; border-bottom: 1px solid transparent; height: 34px; position: relative; top: 2px; background: none; line-height: 2; }

.GM-list-edit input:focus { border-bottom-color: #ccc; }

.GM-list-edit { max-width: 300px; line-height: 20px; max-height: 100px; position: relative; overflow: hidden; }

.GM-list-editContent { position: relative; top: -7px; color: #666; transition: all ease-out .2s; }

.GM-list-edit .input { line-height: 38px; position: relative; top: 2px; text-align: right; width: 150px; white-space: nowrap; overflow: hidden; padding: 0 10px; outline: none; text-overflow: ellipsis; }

.GM-list-edit .input:focus { background: #f2f2f2; }

.GM-list-edit .input[contenteditable="true"]:focus { text-overflow: initial; }

.GM-list-editContent { overflow-y: auto; }

.GM-list-editContent:focus { line-height: 18px; outline: 1px solid #ccc; background: #fff; padding: 5px 5px; }

.GM-list + .GM-list { border-top: 1px solid #f2f2f2; }

.GM-list > li { background: #fff; border-bottom: 1px solid #f2f2f2; min-height: 40px; line-height: 40px; width: 100%; padding: 0 10px; overflow: hidden; }

.GM-list > li:hover { background: #fafafa; }

.GM-list > li#AllMembers { cursor: pointer; }

.chatroom-sidebar button { width: 80%; height: 40px; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; outline: none; margin-bottom: 10px; }

button.group-delete:hover { background: #CA4E4E; }

button.group-delete, button.group-delete:active { background: #f45c5c; color: #fff; transition: all linear .1s; }

.groupform-comfirm { position: absolute; top: 0; right: 0; left: 0; background: #F1F2F6; z-index: 100 !important; padding: 7px 0; border-bottom: 1px solid #ddd; -webkit-transition: -webkit-transform .2s ease-out; transition: transform .2s ease-out; border-top: 1px solid #ddd; }

.groupform-comfirm button { display: inline-block; width: 30%; margin: 0 10px; height: 30px; color: #fff; border: none; border-radius: 4px; outline: none; }

.groupform-comfirm button.cancel { background: rgba(0,0,0,.1); }

.groupform-comfirm button { background: #394F75; color: #fff; }

.switchBlock .switchBtn { width: 51px !Important; height: 30px; margin: 0; border-radius: 20px; box-shadow: none; border: 2px solid #e6e6e6; background: #fff; overflow: visible; display: block; transition: all ease-out .1s; }

.switch-btn { border-radius: inherit; float: left; overflow: hidden; box-shadow: 0 2px 7px rgba(0,0,0,.35),0 1px 1px rgba(0,0,0,.15); width: 26px; height: 26px; left: -1px; background-color: #fff; position: relative; }

.switch-off { padding: 1px; display: none; }

.dis-table .GM-list-title { line-height: 18px; text-align: left; padding: 8px 0; }

.dis-table .GM-list-title span { font-size: 12px; color: #999; }

.switchBlock label { margin-bottom: 0; position: relative; top: 1px; cursor: pointer; }

.switchBtn.active { padding-left: 23px; background: #4cd964; border-color: #4cd964; }

/*chatroom-sidebar end*/

/*chatroom-content start*/
.chatroom-chatPhoto { width: 65px; text-align: left; position: relative; }

.chatroom-chatPhoto img { width: 50px; height: 50px; border-radius: 50%; }

.chatroom-chatWord { position: relative; background: #fff; padding: 8px 10px; display: inline-block; border-radius: 4px; text-align: left; font-size: 15px; min-width: 36px; max-width: 765px;word-wrap: break-word; }

.chatroom-chatWord:before { content: "\e613"; position: absolute; left: -10px; top: 3px; color: #fff; }

.chatMember-me .chatroom-chatWord:before { color: #C1EDED; }

.chatroom-chatWord audio { display: block; border-radius: 5px; display: block; max-height: 34px; max-width: 300px; }

.chatroom-chatWord img { cursor: pointer; }

.chatMember-me .chatroom-chatWord { background: #C1EDED; /*border-color: #87aced;*/ min-height: 37px; min-width: 40px; }

.chatroom-chatWord .message-forward { margin: -7px -9px; }

.chatWord-mute { background: #fafafa; }

.chatWord-mute.mute + .chatroom-chatWord { display: inline-block; }

.chatWord-mute.mute, .chatWord-mute + .chatroom-chatWord { display: none; }

.chatroom-chatBlock > div { vertical-align: top; }

.chatroom-chatBlock .form-select { display: none; }

.chatroom-chatList.select .form-select { display: table-cell; }

.chatroom-name-tool { /*overflow: hidden;*/ position: relative; }

.chatroom-name-tool:after { content: ""; display: block; clear: both; flex: none; }

.chatroom-chatName { font-size: 12px; color: #aaa; transition: all linear .2s; min-height: 22px; min-width: 1px; display: inline-block; }

.chatroom-chatName a { color: #999; transition: all linear .2s; min-width: 1px; cursor: pointer; }

.chatroom-chatName .iconfont { margin-left: 5px; font-size: 14px; cursor: pointer; color: #ccc; position: relative; top: 2px; }

.chatroom-chatName .emojiface, .chatroom-chatName .emoji { vertical-align: bottom; }

.chatroom-title > span .emojiextface, .GM-list-edit .input .emojiextface { vertical-align: middle; }

.chatroom-chatTool { top: 0; position: absolute; white-space: nowrap; z-index: 10; visibility: hidden; opacity: 0; font-weight: 200; transition: opacity linear .1s; }

.chatroom-chatTool.active { visibility: visible; opacity: 1; }

.chatroom-chatTool button { background: none !Important; border: none !Important; outline: none !Important; box-shadow: none !Important; padding: 0 10px; color: #333; opacity: .8; text-shadow: 0 1px 0 #fff; }

.chatroom-chatTool button:hover { /*background: #f2f2f2 !Important;*/ opacity: 1; }

.chatroom-chatTool button.active { color: #206E7A !important; }

.chatroom-chatTool button.selected { opacity: 1; }

.chatroom-chatTool button .badge { background: none; color: #333; padding: 0 0 0 5px; font-weight: 100; }

.chatroom-chatTool button .icon-Thumbsdown, .chatroom-chatTool button .icon-Thumbsup { font-size: 14px; position: relative; }

.chatroom-chatTool button .iconfont { font-size: 14px; }

.chatroom-chatTool button .icon-Thumbsup { color: #3db1d7; }

.chatroom-chatTool button [class*="icon-Thumbsdown"] { color: #f98a97; }

.chatroom-chatTool button .icon-Edit { color: #967bdc; }

.chatroom-chatTool button .icon-topic { font-size: 16px; }

.chatroom-chatList { min-height: 386px; }

.chatroom-chatBlock { margin: 20px 0; width: auto; }

.chatroom-chatBlock:first-child { margin-top: 0; }

.chatroom-chatBlock:hover .chatroom-chatTool button { opacity: 1; }

.chatroom-chatBlock:hover .chatroom-chatName, .chatroom-chatBlock:hover .chatroom-chatName .iconfont,
.chatroom-chatBlock:hover .chatroom-chatName a { color: #394f75; }

.chatroom-chatContent { padding-right: 100px; }

.chatroom-chatContent > ul { text-align: left; float: left; }

.chatroom-chatMore > .iconfont { cursor: pointer; color: #999; }

.chatroom-chatMore > .iconfont:hover { color: #333; }

.chatroom-chatMore > .iconfont.open + .chatroom-chatTool { display: block; }

.chatroom-chatMore > .iconfont.reverse + .chatroom-chatTool { right: 0; }

.chatroom-floor { line-height: 24px; color: #b18ccb; }

/*chatMember-me*/

.chatroom-chatTip { text-align: center; margin-bottom: 10px; }

.chatroom-chatTip span { display: inline-block; text-align: left; padding: 5px 8px; background-color: #F8F8F8; border-radius: 4px; color: #666; text-shadow: 0 0 3px rgba(255,255,255,.2); max-width: 80%; font-size: 12px; }
/*chatroom-content end*/

/*chatroom-sidebar start*/
[data-role="page"] { z-index: 10; visibility: hidden; opacity: 0; transition: all linear .2s; }

[data-role="page"][data-direction="left"] { transform: translateX(100%); -ms-transform: translateX(100%); -webkit-transform: translateX(100%); }

[data-role="page"][data-direction="right"] { transform: translate(-100%,0); -ms-transform: translate(-100%,0); -webkit-transform: translate(-100%,0); }

[data-role="page"][data-direction="up"], .pagroup-room { transform: translateY(100%); -ms-transform: translateY(100%); -webkit-transform: translateY(100%); }

.chatroom-members, [data-role="page"][data-direction="down"] { transform: translateY(-100%); -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); }


/*chatroom-sidebar end*/

/*成员列表样式*/
.sear-by-member { padding: 0 10px; }

.mem-tab-content { position: absolute; top: 40px; bottom: 0; left: 0; right: 0; }

.mem-tab-content li { text-align: left; }

.mem-tab-content li .mCSB_container { padding: 0 20px; }

.mem-tab-content li .dis-table, .sear-by-member .dis-table { padding: 6px 0; border-bottom: 1px solid #eee; }

.mem-tab-content li .dis-table:hover, .sear-by-member .dis-table:hover { background: #f7f7f7; }

.member-photo { width: 50px; padding-right: 10px; }

.member-photo img { width: 100%; }

.member-staus { width: 200px; text-align: right; }

.member-check { text-align: right; padding-right: 10px; }

.member-name-name { font-size: 14px; margin: 1px 0; font-weight: 300; }

.member-name-nickname { color: #999; font-size: 12px; }

.member-staus { color: #B14646; font-size: 12px; }

.mem-tab-menu { margin: 0 20px; border-bottom: 1px solid #ddd; }

.mem-tab-menu li { padding: 10px 0 4px; font-size: 14px; margin-right: 20px; border-bottom: 2px solid transparent; cursor: pointer; font-weight: 700; color: #666; }

.mem-tab-menu li.active { border-color: #206E7A; color: #206E7A; }

.mem-tab-menu li:hover { color: #206E7A; }

/*成员列表样式-结束*/
/*动画原点*/
[data-role="page"].open, .pachat-box .pagroup-room.open, .createGroup-member, .createGroup-room > li .CGroup-btn-step,
.chatroom-head.open .chatroom-members { visibility: visible; transform: translate(0,0); -ms-transform: translate(0,0); -webkit-transform: translate(0,0); opacity: 1; }
/*动画原点结束*/
/*@media (max-width: 991px) {
    .pachat-block {
        width: 970px;
    }
}

@media (max-width: 767px) {
    .pachat-block {
        width: 750px;
    }
}*/



/*Create New Group 弹窗*/
/*.group-createBody {
    background: #fafafa;
    min-height: 409px;
    overflow: hidden;
}

.group-options {
    padding: 10px 15px;
    border-bottom: 1px solid #ddd;
}

    .group-options label {
        font-size: 18px;
        font-weight: 200;
    }

    .group-options select {
        margin-bottom: 10px;
        height: 40px;
        padding: 0 10px;
    }

.group-create {
    position: absolute;
    width: 100%;
    left: 0;
    top: 40px;
    background: #f2f2f2;
    bottom: 0;
    -webkit-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
    transform: translateY(221px);
    -ms-transform: translateY(221px);
    -webkit-transform: translateY(221px);
}

    .group-create > * {
        opacity: .2;
    }

.group-cover {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 1;
}

    .group-cover .btn, .group-cover .btn:focus {
        position: relative;
        border-radius: 4px;
        top: 55px;
        z-index: 10;
        opacity: 1;
        width: 200px;
        left: 50%;
        margin-left: -100px;
        height: 40px;
        background: #206E7A;
        color: #fff;
        border-color: #206E7A;
        outline: none !important;
    }

        .group-cover .btn:hover {
            background: #2EA8BB;
            color: #fff;
            border-color: #2EA8BB;
        }

        .group-cover .btn:active {
            background: #206E7A;
            color: #fff;
            border-color: #206E7A;
        }

#newGroup .myFriends {
    overflow: auto;
    width: 100%;
    background: #fff;
    position: absolute;
    top: 40px;
    bottom: 0;
}

.group-create-name {
    position: relative;
}

    .group-create-name label {
        position: absolute;
        margin-bottom: 0;
        line-height: 40px;
        left: 10px;
        z-index: 100;
    }

    .group-create-name input {
        background: none;
        border: none;
        line-height: 40px;
        padding: 0 10px 0 103px;
        border-bottom: 1px solid #ddd;
        width: 100%;
        position: relative;
        z-index: 10;
        outline: none;
    }

        .group-create-name input:focus {
            border-bottom-color: #206E7A;
            background: #fff;
        }*/
/*Create New Group 弹窗结束*/

/*abuseList-table*/
.abuseList-tableItems { padding: 7px 0; }

.abuseList-tableItems > .dis-table { padding: 6px 20px; }

.abuseList-table .dis-table { table-layout: fixed; border-left: 1px solid #f2f2f2; }

.abuseList-table .dis-table li { padding: 7px 5px; border-bottom: 1px solid #eee; border-right: 1px solid #f2f2f2; font-size: 14px; white-space: normal; }

.abuseList-table .dis-table .dis-tr:hover { background: #fafafa; }

.abuseList-table .dis-thead { background: #ecf5fc !important; color: #56719f; }

.abuseList-table .dis-thead li { padding: 8px 5px; }

.abuseList-table .member-name { text-align: left; overflow: hidden; border-left: none; }

.abuseLis-memInfor img { width: 55px; }

.abuse-members { width: 170px; }

.abuseLis-memInfor .media-left { padding: 0; }

.abuseLis-memInfor .media-body .media-heading { margin-bottom: 5px; }

.abuseLis-memInfor .media-body { text-align: left; }

.abuseLis-memInfor .media-body > p { margin-bottom: 0; font-size: 13px; }

.abuse-times, .abuse-status { width: 110px; }

.abuse-times .iconfont, .abuse-status .iconfont { font-size: 12px; color: #666; }

.abuse-times .iconfont { cursor: pointer; }

.abuse-date { width: 140px; }

.abuse-tools { width: 80px; }

.abuse-tools .iconfont { cursor: pointer; }

.abuseList-table .dis-table .dis-tr:hover .abuse-tools .iconfont { color: #b2162e; }

.abuse-group > div:last-child { color: #666; font-size: 13px; }

.abuse-status select { width: auto; border: none; }

.member-name-id { color: #666; font-size: 13px; margin-top: 5px; }

.member-name-tool { text-align: right; }

.member-name-tool > .iconfont { margin-right: 20px; cursor: pointer; position: relative; top: 3px; transition: transform .4s; -webkit-transition: -webkit-transform .4s; transform: rotate(0); -ms-transform: rotate(0); /* IE 9 */ -webkit-transform: rotate(0); /* Safari and Chrome */ }

.member-name-tool > .iconfont:hover { color: #3399D2; }

.member-name-tool > .iconfont.close { transform: rotate(180deg); -ms-transform: rotate(180deg); /* IE 9 */ -webkit-transform: rotate(180deg); /* Safari and Chrome */ }

.abuseList-item .member-photo .iconfont { display: none; text-align: center; margin: 10px auto; width: 24px; height: 24px; border: 1px solid #eee; border-radius: 4px; }

.abuseList-item .member-photo .iconfont:hover { background: #394F75; color: #fff; border-color: #394F75; }

.abuseList-detail { display: none !Important; margin: 10px auto; background: #fff; box-shadow: 0 0 0 1px #ddd; }

.abuseList-tableItems > .dis-table.open { background: #Fafafa; border: 1px solid #ddd; }

.abuseList-tableItems > .dis-table.open .abuseList-detail { display: table !important; }

.abuseList-tableItems > .dis-table.open .member-photo .iconfont { display: block; }
/*abuseList-table end*/
.chatroom-pagination .page-pagination { margin: 0; position: relative; top: 2px; }

.chatroom-pagination .operation-bottom { background: none; padding: 10px 0; }

.chatroom-pagination.active .operation-bottom { box-shadow: none; max-width: 970px; background: #f1f2f6; border-top: 1px solid #ddd; }

.chatroom-pagination .page-pagination .tooltip-inner, .chatroom-tool .tooltip-inner { background: rgba(0,0,0,.5); }

.chatroom-pagination .page-pagination .tooltip-inner { white-space: nowrap; }

.tooltip.top .tooltip-arrow, .chatroom-tool .tooltip-arrow { border-top-color: rgba(0,0,0,.5) !Important; border-bottom-color: rgba(0,0,0,.5) !Important; }

.chat-submit { height: auto; margin-right: 0; border-bottom-right-radius: 0px !Important; border-top-right-radius: 0px !Important; margin-right: 0px !Important; padding: 0 20px; font-weight: 600; font-size: 15px; }

.operation-container .chat-submit { border-right: none !Important; }

.chat-submit-type { display: inline-block; }

.chat-submit-type button { border-bottom-left-radius: 0px; border-top-left-radius: 0px; padding: 0px 5px; font-size: 12px; }

.operation-container.active .chat-submit-type { display: none; }

.chat-submit, .chat-submit:focus { background: #394f75; color: #fff; border: 1px solid #1152C5; height: 36px; border-radius: 5px; box-shadow: none !Important; outline: none !important; transition: all linear .15s; }

.chat-submit img { display: none; margin-left: 4px; }

.chat-submit:hover,
.chat-submit-type > button:hover, .chat-submit-type.open > button { background: #1152C5; color: #fff; border: 1px solid #1152C5; }

.chat-submit:active, .chat-submit:active:focus, .live-left .chat-submit-type > button:active { background: #134aad; color: #fff; }

.chat-submit.sending { background: #fafafa !important; border-color: #ccc !important; color: #666 !important; cursor: default; font-weight: 600; }

.chat-submit.sending .iconfont { display: none; }

.chat-submit.sending img { position: relative; display: inline-block; width: 18px; margin-left: 2px; margin-top: -10px; top: 4px; }

.chat-submit .iconfont { position: relative; margin-left: 5px; top: 1px; }

.chat-submit-type > button { border-bottom-left-radius: 0px; border-top-left-radius: 0px; padding: 0px 5px; font-size: 12px; color: #fff; height: 36px; background-color: #394f75; border-color: #46608c; outline: none !Important; }

.chat-submit-type > button .caret { position: relative; top: -1px; color: #fff !important; }

.chat-submit-type .dropdown-menu { font-size: 12px; padding: 0; /*right: 0;
        left: auto;*/ min-width: 120px; }

.chat-submit-type a { color: #333 !important; line-height: 24px; }

.chat-submit-type .iconfont { font-size: 12px; }

.chatroom-pagination .operation-bottom .pgs button { height: 30px; }

.chatroom-pagination .operation-bottom .pgs { margin: 0 auto;padding: 0; }

.chatroom-pagination .operation-edit { background: #394f75 !Important; position: relative; left: 20px; color: #fff !Important; width: 36px; text-align: center; padding: 0; line-height: 34px; border-radius: 50%; border-color: #253859; z-index: 100; }

.chatroom-pagination .operation-edit:after { content: "Chat"; position: absolute; top: 0; left: 100%; z-index: 100; display: block; color: #999; font: 14px/34px Arial; margin-left: 10px; }

.chatMember-card .media-left { padding-left: 0; }

.chatMember-card .media-left img { width: 80px; height: 80px; }

.chatMember-card .media-body { width: auto; min-width: 100px; vertical-align: middle; }

.chatMember-card .media-body h4 { margin: 0 0 10px; }

.chatMember-card button { margin: 0 10px 10px 0; background: #f2f2f2; border: 1px solid #ddd; padding: 5px 10px; }

.chatroom-chatPhoto img:hover + .chatMember-card { display: block; }

.chatroom-text { word-break: break-word; word-wrap: break-word; overflow: hidden; }

.edui-container { border: none; width: 100% !Important; z-index: 98 !Important; }

.edui-btn-toolbar .edui-btn { margin: 0 6px; }

.edui-container .edui-toolbar { background: #F1F2F6; border-bottom-color: #eee; border-top: 1px solid #eee; }

.edui-tab-content .edui-tab-pane { padding: 15px 10px; }

.chatroom-chatTool-time { position: relative; color: #999; margin-left: 5px; }
/*MemberCard*/
#_memcard { position: absolute; z-index: 2000; padding: 12px; left: 0; top: 0; display: none; visibility: hidden; }

#_memcard:hover { display: block; visibility: visible; }

#_memcard .content { position: relative; max-width: 450px; background: #FFF; border: 1px solid #dcdcdc; border-radius: 5px; padding: 5px; }

#_memcard #arrow { left: 50%; position: absolute; width: 0px; height: 0px; margin-left: -13px; border-left: 13px solid transparent; border-right: 13px solid transparent; }

#_memcard #arrow2 { left: 50%; margin-left: -13px; position: absolute; width: 0px; height: 0px; border-left: 13px solid transparent; border-right: 13px solid transparent; }

#_memcard #arrow.bottom { bottom: 0px; border-top: 13px solid #CCC; left: 100px; }

#_memcard #arrow2.bottom { bottom: 1px; border-top: 13px solid #FAFAFA; left: 100px; }

#_memcard #arrow.top { top: 0; border-bottom: 13px solid #CCC; left: 100px; }

#_memcard #arrow2.top { top: 1px; border-bottom: 13px solid #FAFAFA; left: 100px; }

#_memcard .content .bottom { text-align: center; position: absolute; bottom: 0px; height: 100px; background: #F9F9F9; margin: 0px -10px; width: 100%; line-height: 100px; text-align: right; padding: 10px; }

#_memcard:hover .content { display: block; visibility: visible; }

/*MemberCard--结束*/
.edui-icon-fullscreen { display: none; }

.tip-noList { position: absolute; top: 40px; left: 0; right: 0; bottom: 0; text-align: center; font-size: 18px; color: #787777; text-shadow: 0 2px 0 #FFf; padding: 135px 100px 0; line-height: 30px; }

.tip-noList .iconfont { display: block; font-size: 80px; width: 120px; height: 120px; line-height: 108px; margin: 0 auto 39px; border: 5px solid #d7d7d7; border-radius: 50%; text-align: center; color: #ddd; }

.chatroom-bread { overflow: hidden; padding-left: 10px; }

.chatroom-bread .home-bread { line-height: 38px; }

.chatroom-bread .home-bread[title="Home"]:after { top: 3px; }

.chatroom-bread .breadcrumb { font-size: 14px; }

[data-target] { cursor: pointer; }

.chatroom-chatContent .hideIcon { font-size: 20px; color: #ccc; margin-top: -2px; display: inline-block; position: relative; top: 2px; margin-right: 5px; }

.chatroom-chatContent .muteBtn { color: #337ab7; cursor: pointer; }

.chatroom-chatContent .muteBtn:hover { text-decoration: underline; color: #23527c; }

.chatroom-mesTip { position: relative; display: none; vertical-align: top; }

.chatroom-mesTip a { padding: 0 16px; line-height: 39px; color: #394F75; position: relative; display: block; }

.chatroom-mesTip a:hover { color: #21324F !Important; }

.chatroom-mesTip sub, .tip-newmessage a sub { position: absolute; top: 7px; right: 12px; background: #f00; width: 8px; height: 8px; border-radius: 50%; border: 1px solid #fff; z-index: 1; }

.tip-newmessage a sub { top: 0; right: 3px; }

.chatroom-tipwords { position: absolute; top: 100%; left: 50%; background: #fff; border: 1px solid #ddd; border-radius: 5px; padding: 5px 10px; white-space: nowrap; width: 180px; margin-left: -90px; text-align: center; font-size: 14px; line-height: 24px; box-shadow: 0 1px 3px rgba(0,0,0,.1); color: #333; }

.chatroom-tipwords:before { content: "\e606"; position: absolute; bottom: 100%; left: 50%; color: #FFF; height: 16px; width: 20px; margin-left: -10px; text-shadow: 0 -1px 0 #aaa; }

.chatroom-tipwords .iconfont { position: relative; font-size: 12px; color: #aaa; display: inline-block; padding: 1px; width: 24px; height: 24px; line-height: 24px; box-shadow: 0 0 0 1px #ccc; border-radius: 50%; top: 0; cursor: pointer; transform: scale(.8); -ms-transform: scale(.8); /* IE 9 */ -moz-transform: scale(.8); /* Firefox */ -webkit-transform: scale(.8); /* Safari 和 Chrome */ -o-transform: scale(.8); /* Opera */ }

.chatroom-tipwords .iconfont:hover { box-shadow: 0 0 0 1px #DD4747; }
/*imgView start*/
.imgView, .imgView .cover { top: 0; left: 0; right: 0; bottom: 0; }

.imgView { position: fixed; z-index: 10000; }

.imgView .cover { position: absolute; display: block; background: rgba(0,0,0,.5); }

.img-display { width: 100%; height: 100%; display: inline-block; vertical-align: middle; text-align: center; }

.img-display-block { width: 100%; height: 100%; position: relative; }

.img-display img { /*max-width: 80%;
    max-height: 80%;*/ position: relative; z-index: 10; /*box-shadow: 0 2px 8px rgba(255,255,255,1);
    border: 2px solid #eee;*/ border-radius: 4px; transform: scale(.8); -ms-transform: scale(.8); /* IE 9 */ -moz-transform: scale(.8); /* Firefox */ -webkit-transform: scale(.8); /* Safari 和 Chrome */ -o-transform: scale(.8); /* Opera */ transition: transform ease-out .1s; -moz-transition: -moz-transform ease-out .1s; -ms-transition: -ms-transform ease-out .1s; -webkit-transition: -webkit-transform ease-out .1s; -o-transition: -o-transform ease-out .1s; }

.img-display img.active { transform: scale(1); -ms-transform: scale(1); /* IE 9 */ -moz-transform: scale(1); /* Firefox */ -webkit-transform: scale(1); /* Safari 和 Chrome */ -o-transform: scale(1); /* Opera */ }

.blockStaus { color: #B14646; font-weight: 200; }

.img-display-block .zoomin, .img-display-block .zoomout, .img-display-block .rotate, .img-display-block .close { position: absolute; opacity: .8; color: #fff; font-weight: 100; border: 1px solid #fff; width: 30px; height: 30px; border-radius: 50%; font-size: 12px; text-shadow: none; z-index: 100; line-height: 28px; text-decoration: none; cursor: pointer; }

.img-display-block .zoomin:hover, .img-display-block .zoomout:hover, .img-display-block .rotate:hover, .img-display-block .close:hover { opacity: 1; color: #DD4747; border-color: #DD4747; }
/*imgView end*/

.chatroom-forwarded { margin-top: 4px; margin-top: 0\9\0; }

.chatroom-forwarded span { display: inline-block; background: #fafafa; padding: 2px 10px; border-radius: 50px; overflow: hidden; }

.chatroom-forwarded span a { display: inline; }
/*Report Abuse*/
.abuse-page-head { text-align: left; margin: 40px auto !important; width: auto; }

.abuse-page-title { position: relative; font-size: 20px; padding-right: 50px; }

.abuse-page-title:after { content: ""; position: absolute; width: 1px; background: #d9d9d9; top: 6px; bottom: 6px; right: 23px; }

.abuse-object-body { padding-left: 10px; }

.abuse-object img { width: 50px; height: 50px; border-radius: 50%; }

.abuse-object h5 { margin-bottom: 5px; }

.abuse-object p { font-size: 12px; color: #666; }

.abuse-form { max-width: 980px; margin: 0 auto; text-align: left; }

.abuse-form > dt { line-height: 40px; font-size: 18px; font-weight: normal; border-left: 4px solid #394f75; background: #f1f2f6; padding: 0 10px; margin-bottom: 30px; }

.abuse-form > dd { padding-bottom: 40px; }

.abuse-form label, .abuse-form-evi dt { font-size: 16px; display: block; font-weight: normal; }

.abuse-form .form-select label { margin-bottom: 15px; }

.abuse-form textarea { width: 100%; resize: none; height: 180px; background: #f1f2f6; padding: 10px; border: 1px solid #f1f2f6; transition: all linear .1s; }

.abuse-form-evi { display: none; }

.abuse-form-evi dt { margin-bottom: 5px; }

.abuse-evi-link { padding-right: 30px; }

.abuse-evi-link > dd { margin-bottom: 15px; padding: 0; }

.abuse-evi-link input { height: 34px; padding: 0 10px; border: 1px solid #ddd; width: 100%; }

.abuse-evi-link .iconfont, .chat-clear-btn { width: 50px; text-align: center; cursor: pointer; }

.abuse-evi-link .iconfont:last-child, .abuse-evi-link > dd:last-child .iconfont { display: none; }

.abuse-evi-link .iconfont:before, .chat-clear-btn:before { width: 24px; height: 24px; line-height: 22px; border: 1px solid #db4453; border-radius: 50%; display: inline-block; color: #db4453; opacity: .5; }

.abuse-evi-link .iconfont:hover:before, .chat-clear-btn:hover:before { opacity: 1; }

.abuse-evi-link > dd:last-child .iconfont:last-child { display: table-cell; }

.abuse-evi-link > dd:last-child .iconfont:last-child:before { border-color: #394f75; color: #394f75; opacity: 1; }

.abuse-evi-link > dd:last-child .iconfont:last-child:hover:before { background: #394f75; color: #fff; }

.abuse-evi-pic { padding-right: 30px; font-size: 0; }

.abuse-evi-pic dd { padding: 0; display: inline-block; margin: 0 5px 5px 0; width: 70px; height: 70px; background: #f2f2f2; line-height: 70px; overflow: hidden; vertical-align: top; text-align: center; }

.abuse-evi-pic dd img { display: inline-block; max-height: 100%; cursor: pointer; }

.abuse-evi-pic dd img:hover { opacity: .6; }

.abuse-evi-pic dd.iconfont { display: inline-block; font-size: 31px; color: #ccc; border: 1px solid #ddd; cursor: pointer; }

.abuse-evi-pic dd.iconfont:hover { background: #fff; border-color: #f2f2f2; }

.abuse-evi-pic dd.iconfont:active { background: #f2f2f2; }

.abuse-form-button { padding-top: 30px; }

.abuse-form-button button { width: 120px; }

.abuse-more-btn { font-size: 12px; cursor: pointer; font-weight: 600; color: #394f75; opacity: .8; }

.abuse-more-btn:hover { opacity: 1; }

.abuse-more-btn .iconfont { position: relative; margin-top: -2px; top: 2px; }

.abuse-form-more.open + .abuse-form-evi { display: block; border-bottom: 1px solid #d9d9d9; }

.abuse-evi-his-items { padding: 10px 10px 10px 0; max-height: 200px; overflow-y: auto; background: #F1F2F6; }

.abuse-evi-his-items .chatroom-chatList { min-height: initial; background: #F1F2F6; }
.abuse-evi-his-items .chatroom-chatContent { padding-right: 0; }
.abuse-evi-his-items .chatroom-chatBlock { margin: 10px 0; }
.chat-clear-btn { vertical-align: top; padding-top: 14px; width: 40px; }
.chat-his-select { max-height: 450px; padding: 0; }
.chat-his-select .chatroom-chatList { overflow: hidden; padding: 10px; background: #F1F2F6; }
.chat-his-select .chatroom-chatList > li { margin: 10px 0; }
.chatroom-chatBlock .form-select { padding: 16px 10px 0; }
.chatroom-chatBlock .form-select .iconfont { border-color: #bbb; }
.chat-his-select-bot { padding: 8px 15px; }
.chat-his-select-bot .shareBox-button { position: relative; left: 0; margin: 0; top: 0; }
/*Report Abuse-end*/
.abuse-descr-title { border-bottom: 1px solid #ddd; padding: 10px 0 5px; }
/*Create new Group*/
.modal-body-creGroup { position: relative; top: 0; bottom: 0; max-width: none; padding: 0; }
.modal-body-creGroup + .modal-footer { padding: 8px 15px; }
/*Create new Group--end*/
[data-target="#ChatHistory"] .iconfont { font-size: 14px; position: relative; top: 0; display: inline-block; }
.uploadimg { text-align: center; }
.uploadimg img { max-height: 100%; max-width: 100%; }
.chatroom-chatBlock.fix-pos .chatroom-chatWord { box-shadow: 0 0 0 1px rgba(255,0,0,.8); -webkit-animation-name: shineRed; -webkit-animation-duration: 1.2s; -webkit-animation-iteration-count: 10; -webkit-animation-timing-function: linear; }

@-webkit-keyframes shineRed {
    from { box-shadow: 0 0 8px 0 rgba(255,0,0,.1); }
    50% { box-shadow: 0 0 10px 0 rgba(255,0,0,1); }
    to { box-shadow: 0 0 8px 0 rgba(255,0,0,.1); }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .chatroom-container { border-radius: 0; }
    .chatroom-forwarded { margin-top: 0; }
}

.chatroom-chat-operation { position: absolute; top: 50px; right: 50%; margin-right: -255px; overflow: hidden; border-radius: 2px; box-shadow: 0 1px 3px rgba(0,0,0,.05); background: #f1f2f6; z-index: 1; }
.chatroom-chat-operation li { line-height: 34px; border-right: 1px solid #eee; float: left; opacity: .3; }
.chatroom-chat-operation li:last-child { background: #fafafa; border-right: none; opacity: 1; }
.chatroom-chat-operation.active li { opacity: 1; background: #fafafa; }
.chatroom-chat-operation li a { display: block; font-size: 14px; padding: 4px 17px 4px 6px; color: #394f75; cursor: default; }
.chatroom-chat-operation.active li a, .chatroom-chat-operation li.active a, .chatroom-chat-operation li:last-child a { cursor: pointer; }
.chatroom-chat-operation.active li a:hover, .chatroom-chat-operation li:last-child a:hover { background: #fff; }
.chatroom-chat-operation li .iconfont { margin-top: -4px; position: relative; display: inline-block; top: 4px; width: 40px; text-align: center; vertical-align: top; }

.group-list-none { text-align: center; font-size: 16px; color: #999; padding: 50px 0; }