@charset "utf-8"; /* CSS Document */ body, html { background: #f3f3f3; } .c-ccc { color: #ccc; } .ax-naills span.axills-boxer { display: inline-block; padding: 3px 5px; background: #f5f5f5; color: #999999; font-size: 10px; border-radius: 5px; } .ax-naills span.axills-right { background: #fff; color: #17b3ec; border: 1px solid #17b3ec; padding: 3px 5px; border-radius: 5px; font-size: 10px; } .ax-naills .c-btn-tiny { padding: 3px 15px; border-color: #17b3ec; color: #17b3ec; } .ax-naills .c-btn-tiny-grey { padding: 3px 15px; border-color: #C0C0C0; color: #C0C0C0; background-color: #E5E5E5; } .ax-naills span.ax-longboxer { background: #f5f5f5; color: #999999; font-size: 10px; padding: 3px 10px; display: inline-block; max-width: 100%; box-sizing: border-box; border-radius: 5px; } .c-17b3ec { color: #17b3ec; } .ax-naills span.ax-qybox { display: inline-block; font-size: 10px; padding: 2px 5px; border-radius: 5px; font-size: 10px; } .ax-naills span.ax-qybox.b-ff9555 { color: #ff9555; border: 1px solid #ff9555; } .ax-naills span.ax-qybox.b-2ddc46 { color: #2ddc46; border: 1px solid #2ddc46; } .ax-naills span.ax-qybox.b-2d8cdc { color: #2d8cdc; border: 1px solid #2d8cdc; } .c-4bd663 { color: #4bd663; } .tioper-hd { line-height: 33px; } .bgc-f7f7f7 { background: #f7f7f7; } .bgc-ebebeb { background: #ebebeb; } #serv-liang th { background: #f4f7fa; vertical-align: middle; text-align: center; border-right: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; padding: 10px 5px; } #serv-liang td { background: #fff; vertical-align: middle; text-align: center; border-right: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; padding: 10px 5px; color: #5b5b5b; } #serv-liang td.first { color: #909090; } .c-list .c-list-info > p.c-f12 { font-size: 12px; } .tanper .c-btn { padding: 5px 5px; } .tanper { background: #fbfcfc; } /* 医患沟通开始 */ .c-chat-box { border: none; padding-left: 2%; padding-right: 2%; } .time-tips { margin: 10px 0 0 0; text-align: center; clear: both; } .time-tips span { position: relative; display: inline-block; padding: 0 60px; color: #aeaeae; font-size: 15px; } .time-tips span:before, .time-tips span:after { position: absolute; content: ""; display: block; width: 50px; height: 1px; background: #e6e4e1; top: 50%; } .time-tips span:before { left: 0; } .time-tips span:after { right: 0; } .chat-left, .chat-right { clear: both; overflow: hidden; padding: 10px 0; } .chat-left > dt, .chat-right > dt { width: 40px; height: 40px; } .chat-left > dt { float: left; margin-right: 15px; } .chat-right > dt { float: right; margin-left: 15px; } .chat-left > dt img, .chat-right > dt img { width: 40px; height: 40px; border-radius: 50%; } .chat-left > dd, .chat-right > dd { position: relative; min-height: 18px; font-size: 15px; display: inline-block; max-width: 80%; background: #fff; border: 1px solid #e1e1e1; border-radius: 6px; padding: 8px 10px; box-shadow: 1px 1px 1px rgba(0, 0, 0, .1); } .chat-left > dd { float: left; white-space: pre-wrap; word-wrap: break-word; } .chat-right > dd { float: right; background: #bce0ff; border: 1px solid #81bdf7; white-space: pre-wrap; word-wrap: break-word; } .chat-left > dd:after { content: ""; position: absolute; top: 14px; left: -6px; display: block; width: 8px; height: 8px; background: #fff; border-color: #e1e1e1; border-style: solid; border-width: 1px 0 0 1px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); } .chat-right > dd:after { content: ""; position: absolute; top: 14px; right: -6px; display: block; width: 8px; height: 8px; background: #bce0ff; border-color: #81bdf7; border-style: solid; border-width: 1px 0 0 1px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); transform: rotate(135deg); } .chat-left > dd p img, .chat-right > dd p img { max-width: 150px; max-height: 150px; margin: 5px 0; } .chat-msg-box { bottom: 0; left: 0 } .chat-msg-box .input-group .form-control { height: 32px; } .pull-more { text-align: center; color: #5b5b5b; font-size: 14px; padding: 14px 0; } /* 医患沟通结束 */ .pt13 { padding-top: 13px; } .jt-boradius { border-radius: 5px; } .bot-pper a.c-btn { border: 1px dashed #999999; text-align: center; display: block; color: #666666; font-size: 16px; border-radius: 5px; } .c-999999 { color: #999999; } .lh40 { line-height: 40px; } /***/ .call-con { clear: both; overflow: hidden; } .phone-book, .doctor-list, .ill-case { width: 100%; background: #fff; } .phone-book li, .doctor-list li, .ill-case li { width: 100%; overflow: hidden; border-bottom: 1px solid #e1e1e1; } .contacts { position: relative; height: 65px; transform: translateX(0); transition: all 0.3s; -webkit-transform: translateX(0); -webkit-transition: all 0.3s; -moz-transform: translateX(0); -moz-transition: all 0.3s; } .contact-sin { position: absolute; top: 50%; padding: 0 15px 0 15px; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; transform: translateY(50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); } .contact-sin dt { position: absolute; width: 40px; } .contact-sin dd { float: left; min-height: 40px; width: 100%; } .contact-sin dd h4 { font-size: 15px; display: inline-block; padding-right: 20px; line-height: normal; vertical-align: middle; position: relative; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .contact-sin h4 .iconfont { position: absolute; top: 50%; right: 0; margin-top: -9px; font-size: 14px; } .contact-sin dt a, .doctor-sin dt a { display: block; } .doctors { position: relative; height: 90px; padding-right: 60px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .doctor-sin { position: absolute; top: 50%; padding: 0 60px 0 15px; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; transform: translateY(50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); } .doctors:after { position: absolute; top: 50%; right: 60px; content: ""; display: block; width: 1px; height: 54px; background: #e1e1e1; z-index: 100; margin-top: -27px; } .apply:after { right: 75px; background: rgba(0, 0, 0, 0); } .apply .doctor-sin { padding-right: 70px; } @media screen and (min-width:360px) { .apply .doctor-sin { padding-right: 75px; } } .doctor-sin dt { position: absolute; width: 54px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); } .doctor-sin dd { float: left; margin-left: 69px; padding: 5px 0; min-height: 54px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .doctor-sin dd h4 { font-size: 18px; display: inline-block; padding: 0 0 4px 0; line-height: normal; vertical-align: middle; position: relative; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .doctor-sin dd p { white-space: pre-wrap; word-wrap: break-word; max-height: 40px; overflow: hidden; } .scrollLeft { transform: translateX(-72px); transition: all 0.3s; -webkit-transform: translateX(-72px); -webkit-transition: all 0.3s; -moz-transform: translateX(-72px); -moz-transition: all 0.3s; } .call-phone { position: absolute; display: inline-block; width: 40px; height: 40px; right: 10px; top: 50%; margin-top: -20px; text-align: center; line-height: 40px; } .call-phone .iconfont { font-size: 30px; color: #4dcd70; } .apply-btn { position: absolute; display: inline-block; width: 50px; right: 15px; top: 50%; margin-top: -14px; text-align: center; line-height: 40px; } .del-contact { position: absolute; display: inline-block; width: 72px; height: 100%; background: #ff3b2f; left: 100%; top: 0; text-align: center; line-height: 65px; color: #fff; font-size: 18px; } .call-tips { list-style: decimal; list-style-position: outside; padding-left: 15px; } .call-tips li { padding-bottom: 5px; } .no-data { width: 100%; font-size: 12px; color: #909090; text-align: center; padding: 30px 0; } .no-data-img { width: 40%; max-width: 320px; margin: 0 auto; } .no-data-icon { width: 100%; height: 0; padding-bottom: 100%; background: url(http://ued.yihu.cn/htmlCode/健康之路APP/诊间咨询/images/nodata.png) no-repeat 0 0; background-size: 100% auto; } .no-data p { font-size: 14px; padding-top: 10px; } em.online, em.offline { display: inline-block; font-size: 12px; background: #4dcd70; color: #fff; border-radius: 2px; padding: 0 2px; line-height: 14px; vertical-align: middle; } em.offline { background: #909090; } /**/ .header-menus { right: 15px; top: 0; position: absolute; } .header-menus a { color: #5cb4ff; } .referral-pop { width: 250px; position: fixed; left: 50%; margin-left: -125px; top: 50%; margin-top: -80px; z-index: 600; } .referral-pop-hold { position: relative; z-index: 631; background: #fff; border-radius: 7px; overflow: hidden; } .referral-pop-hold a { display: block; line-height: 55px; text-align: center; color: #666; border-bottom: 1px solid #f2f2f2; font-size: 16px; } .referral-pop-hold a.cancle { color: #999; border-bottom: none; } .referral-pop-mb { width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: rgba(0, 0, 0, .5); z-index: 600; } .juris-close { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, .7); left: 0; top: 0; z-index: 600; color: #fff; text-align: center; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; font-size: 18px; } .seval-hold { position: relative; padding-left: 33px; font-size: 12px; color: #999; margin-top: 6px; } .seval-tit { position: absolute; left: 0; top: 5px; } .seval-con { background: #eee; padding: 7px 10px; border-radius: 5px; } .star-img { vertical-align: middle; margin-bottom: 4px; } .tw-add { margin: 0 7px 0 2px; text-align: center; } .tw-add-detail { padding: 7px 15px; border-top: 1px solid #e1e1e1; margin-top: 10px; } .tw-add-detail li { display: block; width: 25%; text-align: center; float: left; color: #909090; } .tw-add-detail li img { margin: 5px; } .ask-lab-lage { width: 100%; overflow: auto; border-bottom: 1px solid #e1e1e1; } .ask-lab-lage ul { display: block; width: 400px; background: #fff; } .ask-lab-lage li { display: block; width: auto; padding: 0 2px; float: left; line-height: 40px; text-align: center; position: relative; margin: 0 12px; } .ask-lab-lage li a { margin-top: 5px; color: #333; } .ask-lab-lage li.curr a { color: #17b3ec; } .ask-lab-lage li.curr:before { content: ''; display: block; width: 100%; height: 2px; background: #17b3ec; position: absolute; left: 0; bottom: 0; } .appeal-texa { background: #fff; border: none; width: 100%; padding: 10px; height: 150px; font-size: 14px; } .mui-toast-container { position: fixed; z-index: 9999; bottom: 50px; width: 100%; -webkit-transition: opacity .8s; transition: opacity .8s; opacity: 0 } .mui-toast-container.mui-active { opacity: 1 } .mui-toast-message { font-size: 14px; width: 270px; margin: 5px auto; padding: 5px; text-align: center; color: #000; border-radius: 7px; background-color: #d8d8d8 } .win-broadcast { position: fixed; outline: 0px; top: 50%; left: 50%; margin: -113px 0 0 -135px; width: 269px; height: 226px; border-radius: 5px; z-index: 100; } .win-broadcast .bg { background-color: #fff; width: 269px; height: 226px; border-radius: 5px; display: block; } .win-broadcast .broadcast { background: url(../images/broadcast.png) no-repeat 0 -2px; width: 85px; height: 85px; display: block; background-size: 100%; position: absolute; top: 67px; left: 34%; border-radius: 50%; z-index: 99; } .win-broadcast .word { position: absolute; bottom: 0; border-radius: 5px; border-top: 1px solid #e1e1e1; border-top-right-radius: 0; border-top-left-radius: 0; color: #666; background-color: #fff; height: 35px; width: 100%; line-height: 35px; } .win-broadcast .word.title { top: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; } .delete { display: block; position: absolute; height: 12px; width: 12px; border-radius: 50%; background-color: #fff; right: 6px; top: 6px; z-index: 10; text-align: center; line-height: 9px; color: #919191; font-size: 12px; } .broadcast-shadow-panel { width: 100%; position: absolute; overflow: hidden; z-index: 10; top: 0; background-color: rgba(0, 0, 0, .35); } /*动画*/ .win-broadcast .broadcast { animation: broadcast 2s infinite; -webkit-animation: broadcast 2s infinite; /* Safari 和 Chrome */ } @-webkit-keyframes broadcast { 0% { background-color: #ccf5ff; box-shadow: 0 0 0 0px #ccf5ff, 0 0 0 0 #c3e9f2, 0 0 0 0px #e9fffe, 0 0 0 0 #ddf5f4; } 25% { background-color: #ccf5ff; box-shadow: 0 0 0 5px #ccf5ff, 0 0 0 1px #c3e9f2, 0 0 0 20px #e9fffe, 0 0 0 1px #ddf5f4; } 50% { background-color: #ccf5ff; box-shadow: 0 0 0 10px #ccf5ff, 0 0 0 1px #c3e9f2, 0 0 0 25px #e9fffe, 0 0 0 1px #ddf5f4; } 100% { background-color: #ccf5ff; box-shadow: 0 0 0 15px #ccf5ff, 0 0 0 1px #c3e9f2, 0 0 0 30px #e9fffe, 0 0 0 1px #ddf5f4; } } /* 12-18 */ .nxz-voice { line-height: 21px; text-align: right; } .nzx-tb { display: inline-block; width: 15px; height: 21px; background: url(../images/icon-broadcast.png) no-repeat; background-size: 100% auto; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -ms-background-size: 100% auto; vertical-align: middle; } .win-broadcast-mb { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 10; background: rgba(0, 0, 0, .35); display: none; } .myorder li .vlname { line-height: 20px; border-bottom: 1px solid #f2f2f2; position: relative; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; } .pa-icon-dagou { width: 20px; height: 20px; font-size: 13px; display: block; text-align: center; border-radius: 100%; border: 1px solid #e1e1e1; } .pa-icon-dagou.on { background: #17b3ec; color: #fff; } .ask-record li { background: #fff; position: relative; padding: 10px 35px 10px 45px; border-top: 1px solid #f2f2f2; color: #909090; } .ask-record li .ar-check { position: absolute; left: 10px; top: 50%; margin-top: -10px; } .ask-record li .ar-check i { display: block; width: 18px; height: 18px; border: 1px solid #e1e1e1; border-radius: 50%; } .ask-record li .ar-check i.checked { background: #17b3ec; border: 1px solid #17b3ec; } .ask-record li .ar-check i.checked:before { content: "\d61a"; position: absolute; top: -12px; left: 3px; color: #fff; font-size: 12px; } .ask-record li .arrow-right { position: absolute; right: 12px; top: 50%; margin-top: -6px; transform: rotate(135deg); -webkit-transform: rotate(135deg); transition: all .3s ease; } .ask-record li .arrow-right.ashow { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-top: -3px; } .view-more { display: inline-block; width: 100%; text-align: center; padding: 15px 0 10px 0; } .view-more a { /*color: #5b5b5b;*/ color: #17b3ec; } .time-tips span{ padding: 2px 10px; border-radius: 15px; color: #aaa; /*background-color: #E1E1E1;*/ font-size: 12px; } .chat-left, .chat-right { display: -webkit-box; clear: both; overflow: hidden; padding: 10px 0; } .chat-right{ -webkit-box-direction: reverse; } .chat-left > dt{ float: none; } .chat-right > dt { float: none; } .chat-right .word-bread{ text-align: left; /*float: right;*/ background: #17b3ec; border: 1px solid #17b3ec; white-space: pre-wrap; word-wrap: break-word; position: relative; min-height: 18px; font-size: 15px; display: inline-block; max-width: 80%; border-radius: 6px; padding: 8px 10px; box-shadow: 1px 1px 1px rgba(0, 0, 0, .1); } .chat-right > div.c-content{ -webkit-box-flex: 1; text-align: right; } .chat-right .word-bread:after{ content: ""; position: absolute; top: 5px; right: -5px; display: block; width: 8px; height: 8px; background: #17b3ec; border-color: #E1E1E1; border-style: solid; border-width: 1px 0 0 1px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); transform: rotate(135deg); } .chat-left .word-bread{ /*float: left;*/ white-space: pre-wrap; word-wrap: break-word; position: relative; min-height: 18px; font-size: 15px; display: inline-block; max-width: 80%; background: #fff; border: 1px solid #e1e1e1; border-radius: 6px; padding: 8px 10px; box-shadow: 1px 1px 1px rgba(0, 0, 0, .1); } .chat-left > div.c-content{ -webkit-box-flex: 1; text-align: left; } .chat-left .word-bread:after{ content: ""; position: absolute; top: 5px; left: -5px; display: block; width: 8px; height: 8px; background: #fff; border-color: #e1e1e1; border-style: solid; border-width: 1px 0 0 1px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); } .chat-left span.name, .chat-right span.name{ display: block; height: 24px; } .time-tips span:before, .time-tips span:after{ height: 0!important; } .zi2{ z-index: 2; } .doc-name { font-size: 15px; } /*#contain{position: absolute; width: 95%; top:45px; bottom: 52px; overflow-y: auto;}*/ @media only screen and (max-width: 640px) { .doc-name { font-size: 13px; } } .chat-right.checkbox:after, .chat-left.checkbox:before{ display: block; content: '√'; line-height: 24px; width: 22px; height: 22px; border: 1px solid #ccc; border-radius: 50%; margin-right: 10px; color: #f3f3f3; text-align: center; font-size: 16px; box-sizing: border-box; } .chat-right.checked:after, .chat-left.checked:before{ background: #17b3ec; border: none; } .log-oper{ position: absolute; background: rgba(20, 20, 20, .8); border-radius: 8px; color: #fff; z-index: 10000; display: -webkit-box; display: none; } .log-oper li{ margin: 8px 0px; padding: 0px 8px; font-size: 14px; border-left: 1px solid #fff; } .log-oper li:first-child{ border-left:none ; } .log-oper div{ position: absolute; /*width: 10px; height: 10px; background: transparent;*/ /*-webkit-transform: rotate(45deg);*/ top: 37px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid rgba(20, 20, 20, .8); border-bottom: 8px solid transparent; } .footer-bar{ z-index: 2; bottom: 0; left: 0; width: 100%; position: fixed; border-top-width: 1px; border-color: #e1e1e1; border-style: solid; background-color: #fff; display: -webkit-box; } .c-hide{ display: none; } .footer-bar li{ margin: 10px 0px; -webkit-box-flex: 1; text-align: center; line-height: 27px; font-size: 16px; color: #333; } .footer-bar li:first-child{ border-right: 1px solid #e1e1e1; } .footer-bar li > img{ width: 22px; margin-right: 10px; } .header-group{ line-height: 20px; } .btn-cancel{ color: #fff; font-size: 16px; display: none; } .tw-add{ width: 50px; margin: 3px 5px 3px 0; } .input-group input{ margin-bottom: 0; } .c-main .c-btn{ padding-top: 5px; padding-bottom: 5px; } .chat-right .wb-img{ padding: 2px; } .wb-img img{ position: relative; z-index: 2; border-radius: 6px; } .xt-xiaoxi{ background: #888; color: #fff!important; padding: 4px 10px!important; border-radius: 8px!important; } .yy-hold{ background: #ccc; } .rprogress { position: absolute; left: 50%; top: 50%; width: 140px; height: 140px; margin-left: -70px; margin-top: -70px; background-repeat: no-repeat; background-position: center center; background-size: 30px 30px; background-color: rgba(0, 0, 0, 0.7); border-radius: 5px; display: none; -webkit-transition: .15s; z-index: 100; } .rschedule { background: url("../images/yuying_icon5.png"); background-repeat: no-repeat; background-position: center center; background-size: 30px 50px; width: 46px; height: 50px; position: absolute; left: 30px; top: 40px; } .r-sigh{ display: none; border-radius: 50px; box-shadow: 0 0 15px #2187e7; width: 46px; height: 46px; position: absolute; left: 50%; top: 50%; margin-left: -23px; margin-top: -23px; text-align: center; line-height: 46px; font-size: 40px; font-weight: bold; color: #2187e7; } .rprogress-sigh{ background-image: none !important; } .rprogress-sigh .rschedule{ display: none !important; } .rprogress-sigh .r-sigh{ display: block !important; } .rsalert { font-size: 12px; color: #bbb; text-align: center; position: absolute; border-radius: 5px; width: 130px; margin: 5px 5px; padding: 5px; left: 0px; bottom: 0px; } .chat-right .audio{ padding-right: 30px; background: url("../images/yuyin4_icon.png") no-repeat -20px 0 #17b3ec; background-size: 18px; -webkit-background-size: 18px; -moz-background-size: 18px; -o-background-size: 18px; background-position: 90% 50%; } .chat-right .audio.active{ background: url("../images/yuyin3.gif") no-repeat -20px 0 #17b3ec; background-size: 18px; -webkit-background-size: 18px; -moz-background-size: 18px; -o-background-size: 18px; background-position: 90% 50%; } .chat-right .soundWav{ height: 20px;display: -webkit-box;-webkit-box-direction: normal; } .chat-right .soundWavT{ display: block;margin-left: 10px; } .chat-right .soundWav img{ position: relative; width: 40px; height: 30px; top: -5px; } .chat-left .audio{ padding-left: 30px; background: url("../images/yuyin_icon.png") no-repeat #fff; background-size: 18px; -webkit-background-size: 18px; -moz-background-size: 18px; -o-background-size: 18px; background-position: 10% 50%; } .chat-left .audio.active{ background: url("../images/yuyin-2.gif") no-repeat #fff; background-size: 18px; -webkit-background-size: 18px; -moz-background-size: 18px; -o-background-size: 18px; background-position: 10% 50%; } .chat-left .soundWav{ height: 20px;display: -webkit-box;-webkit-box-direction: reverse; } .chat-left .soundWavT{ display: block;margin-right: 10px; } .chat-left .soundWav img{ position: relative; width: 40px; height: 30px; top: -5px; } .volumn { display: inline-block; height: 30px; line-height: 40px; text-align: center; position: relative; vertical-align: bottom; left: 84px; top: 60px; } .volumn div { height: 3px; margin-bottom: 0; background-color: white; margin-right: -12px; margin-bottom: 6px; } .volumn .line1 { width: 10px; -webkit-animation: line1 2s infinite ease-in-out alternate; } .volumn .line2 { width: 14px; -webkit-animation: line2 2s infinite ease-in-out alternate; } .volumn .line3 { width: 18px; -webkit-animation: line3 2s infinite ease-in-out alternate; } .volumn .line4 { width: 22px; /*-webkit-animation: line 0.6s infinite 1.8s ease-in-out alternate;*/ /*-webkit-animation-delay: 3.6s;*/ } @-webkit-keyframes line1 { 0% { opacity: 0; } 41%{ opacity: 0; } 42%{ opacity: 1; } 55% { opacity: 1; } 56% { opacity: 0; } 100% { opacity: 0; } } @-webkit-keyframes line2 { 0% { opacity: 0; } 27%{ opacity: 0; } 28%{ opacity: 1; } 73% { opacity: 1; } 74% { opacity: 0; } 100% { opacity: 0; } } @-webkit-keyframes line3 { 0% { opacity: 0; } 13%{ opacity: 0; } 14%{ opacity: 1; } 84% { opacity: 1; } 85% { opacity: 0; } 100% { opacity: 0; } } .input-msg{ min-height: 32px; width: 100%; line-height: 22px; overflow-x: hidden; overflow-y: auto; /*_overflow-y: visible; _height: 32px;*/ max-height: 120px; background-color: #fff; background-image: none; border: 1px solid #e1e1e1; padding: 5px 10px; font-size: 14px; border-radius: 4px; -webkit-user-select: auto; user-modify: read-write-plaintext-only; -webkit-user-modify: read-write-plaintext-only } .preview-video{padding: 6px 0px;max-height: 100px;position: relative;} .preview-video .video-img-right{width: 135px !important;height: 100px;border-radius: 15px;border-bottom-right-radius: 0px;border-top-right-radius: 0px;} .preview-video .video-img-left{width: 135px !important;height: 100px;border-radius: 15px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;} .preview-video .bofang-icon-right{position: absolute;right: 65px;bottom: 50%;width: 25px !important;height: 25px;margin-right: -12px;top: 40px;z-index: 100;} .preview-video .bofang-icon-left{position: absolute;left: 65px;bottom: 50%;width: 25px !important;height: 25px;margin-right: -12px;top: 40px;z-index: 100;} .preview-video .shichang-time-right{position: absolute;right: 27px;bottom: 50%;width: auto;height: 18px;margin-right: -12px;top: 82px;font-size: 12px;color: #fff;} .preview-video .shichang-time-left{position: absolute;left: 5px;bottom: 50%;width: auto;height: 18px;margin-left: 90px;top: 82px;font-size: 12px;color: #fff} .preview-video .jianjiao-icon-right{top: 6px;z-index: 20;position: absolute;right: 12px;width: 20px !important;height: 100px;margin-right: -12px;} .preview-video .jianjiao-icon-left{top: 6px;z-index: 20;position: absolute;left: 12px;width: 20px !important;height: 100px;margin-left: -12px;} /*添加文章类消息显示样式*/ .chat-left .word-article{ width: 82%; max-width: 82%; text-align: left; } .chat-left .word-article:after{background: #fff;} .chat-left .article-content{ -webkit-box-direction: reverse; display: -webkit-box; height: 80px; padding: 5px 0px; overflow: hidden; } .chat-left .article-content>img{ width: 60px !important; height: 60px; margin-top: 3px; } .chat-left .article-content>div{ -webkit-box-flex: 1; overflow: hidden; padding: 1px 0px 0px 5px; } .xzzx{ position: fixed; bottom: 0; left:0; width: 100%; height: 60px; padding:10px; text-align: center; } .xzzx span{ display: inline-block; color: #fff; font-size: 16px; background-color: #74bf00; width: 100%; border-radius: 5px; height: 40px; line-height: 40px; } .xzzx img{ vertical-align: middle; margin-bottom: 3px; margin-right: 5px; }