.nm-wooconvo-item{ border-bottom: 1px solid #ccc; margin-bottom: 5px; } .nm-wooconvo-subject{ cursor: pointer; } .nm-wooconvo-message, .nm-wooconvo-files{ display:none; } #wooconvo-load-order label{ display:block; width: 200px; float: left; } .wooconvo-error{ color: red; } .nm-wooconvo-attachment img{ background: no-repeat url(images/g-icons.png) 0 -132px; height: 21px; width: 21px; margin: -3px 6px 0 0; vertical-align: top; float: right; } .nm-wooconvo-expand-all{ background: #ccc; padding: 5px; margin-bottom: 16px; display: block; width: 134px; } /* uploader styling */ .nm-uploader-area { width: 100%; max-width: 1080px; /*border: 1px dashed;*/ background: #eee; text-align: center; } .nm-uploader-area .container_buttons { width: 230px; height: 100px; margin: 0 auto; } .nm-uploader-area .filelist { margin-top: 20px; } .u_i_c_box { float: left; /* height: 200px; */ width: 180px; border: 1px solid #E0DFDF; margin: 3px; } .u_i_c_box_clearfix{clear: both}; .u_i_c_tools_bar{ display: table-cell; } .u_i_c_thumb { clear: both; height: 100px; overflow: hidden; } .progress_bar { background: #ffc; margin: 25% auto; display: inline-block; width: 95%; border: 1px solid; background-color: #E0DFDF; } .progress_bar_runner{ background-color: #1B4EEE; height: 25px; display: none; } .u_i_c_name { height: 30px; width: 100%; border-top: 1px solid #E0DFDF; text-align: center; background-color: #E0DFDF; overflow: hidden; } .select_button { } .select_button:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9) ); background:-moz-linear-gradient( center top, #e9e9e9 5%, #f9f9f9 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9'); background-color:#e9e9e9; }.select_button:active { position:relative; top:1px; } .btn_center { margin:5px 7px; text-align: center; padding-top: 30px; } .droptext{ display: block; margin: 10px auto; color: #999; } .u_i_c_tools img { max-width: 15px; } .u_i_c_tools_del, .u_i_c_tools_edit, .u_i_c_tools_zoom { width: 15px; margin-left: 60px; margin: 0 auto; display: inline-flex; } /*Chate Styles*/ .wooconvo-send { overflow: hidden; } .wooconvo-send ::selection { background: rgba(82, 179, 217, 0.3); color: inherit; } .wooconvo-send a { color: rgba(82, 179, 217, 0.9); } .wooconvo-send .back { position: absolute; width: 90px; height: 50px; top: 0px; left: 0px; color: #fff; line-height: 50px; font-size: 30px; padding-left: 10px; cursor: pointer; } .wooconvo-send .back img { position: absolute; top: 5px; left: 30px; width: 40px; height: 40px; background-color: rgba(255, 255, 255, 0.98); border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; margin-left: 15px; } .wooconvo-send .back:active { background: rgba(255, 255, 255, 0.2); } .wooconvo-send .name { position: absolute; top: 3px; left: 110px; font-family: 'Lato'; font-size: 25px; font-weight: 300; color: rgba(255, 255, 255, 0.98); cursor: default; } .wooconvo-send .last { position: absolute; top: 30px; left: 115px; font-family: 'Lato'; font-size: 11px; font-weight: 400; color: rgba(255, 255, 255, 0.6); cursor: default; } .wooconvo-send .chat { list-style: none; background: none; margin: 0; padding: 0 0 20px 0; margin-top: 20px; margin-bottom: 10px; } .wooconvo-send .chat li { padding: 0.5rem; overflow: hidden; display: flex; margin-left: 0; } .wooconvo-send .chat .avatar { width: 40px; height: 40px; position: relative; display: block; z-index: 2; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; background-color: rgba(255, 255, 255, 0.9); } .wooconvo-send .chat .avatar img { width: 40px; height: 40px; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; background-color: rgba(255, 255, 255, 0.9); -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .wooconvo-send .chat .day { position: relative; display: block; text-align: center; color: #c0c0c0; height: 20px; text-shadow: 7px 0px 0px #e5e5e5, 6px 0px 0px #e5e5e5, 5px 0px 0px #e5e5e5, 4px 0px 0px #e5e5e5, 3px 0px 0px #e5e5e5, 2px 0px 0px #e5e5e5, 1px 0px 0px #e5e5e5, 1px 0px 0px #e5e5e5, 0px 0px 0px #e5e5e5, -1px 0px 0px #e5e5e5, -2px 0px 0px #e5e5e5, -3px 0px 0px #e5e5e5, -4px 0px 0px #e5e5e5, -5px 0px 0px #e5e5e5, -6px 0px 0px #e5e5e5, -7px 0px 0px #e5e5e5; box-shadow: inset 20px 0px 0px #e5e5e5, inset -20px 0px 0px #e5e5e5, inset 0px -2px 0px #d7d7d7; line-height: 38px; margin-top: 5px; margin-bottom: 20px; cursor: default; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .wooconvo-send .other .msg { order: 1; border-top-left-radius: 0px; box-shadow: -1px 2px 0px #d4d4d4; } .wooconvo-send .other:before { content: ""; position: relative; top: 0px; right: 0px; left: 40px; width: 0px; height: 0px; border: 5px solid #fff; border-left-color: transparent; border-bottom-color: transparent; } .wooconvo-send .self { justify-content: flex-end; align-items: flex-end; } .wooconvo-send .self .msg { order: 1; border-bottom-right-radius: 0px; box-shadow: 1px 2px 0px #D4D4D4; } .wooconvo-send .self .avatar { order: 2; } .wooconvo-send .self .avatar:after { content: ""; position: relative; display: inline-block; bottom: 17px; right: 0px; width: 0px; height: 0px; border: 5px solid #fff; border-right-color: transparent; border-top-color: transparent; box-shadow: 0px 2px 0px #D4D4D4; } .wooconvo-send .msg { background: white; min-width: 50px; padding: 10px; border-radius: 2px; box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.07); } .wooconvo-send .msg p { /*font-size: 0.8rem;*/ margin: 0 0 0.2rem 0; color: #777; white-space: pre-line; } .wooconvo-send .msg img { position: relative; display: block; /*width: 450px;*/ border-radius: 5px; box-shadow: 0px 0px 3px #eee; transition: all 0.4s cubic-bezier(0.565, -0.26, 0.255, 1.41); cursor: default; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } @media screen and (max-width: 800px) { .wooconvo-send .msg img { width: 300px; } .nm-wooconvo-send { position: relative; } } @media screen and (max-width: 550px) { .wooconvo-send .msg img { width: 200px; } } .wooconvo-send .msg time { font-size: 0.7rem; color: #ccc; margin-top: 3px; float: right; cursor: default; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .wooconvo-send .msg .dashicons-clock { font-size: 14px; } @-webikt-keyframes pulse { from { opacity: 0; } to { opacity: 0.5; } } .wooconvo-send ::-webkit-scrollbar { min-width: 12px; width: 12px; max-width: 12px; min-height: 12px; height: 12px; max-height: 12px; /*background: #e5e5e5;*/ /*box-shadow: inset 0px 50px 0px rgba(82, 179, 217, 0.9), inset 0px -52px 0px #fafafa;*/ } .wooconvo-send ::-webkit-scrollbar-thumb { background: #bbb; border: none; border-radius: 100px; border: solid 3px #e5e5e5; box-shadow: inset 0px 0px 3px #999; } .wooconvo-send ::-webkit-scrollbar-thumb:hover { background: #b0b0b0; box-shadow: inset 0px 0px 3px #888; } .wooconvo-send ::-webkit-scrollbar-thumb:active { background: #aaa; box-shadow: inset 0px 0px 3px #7f7f7f; } .wooconvo-send ::-webkit-scrollbar-button { display: block; height: 0; } .wooconvo-send .wooconvo-textarea { box-sizing: border-box; width: 100%; height: 50px; padding-top: 14px; padding-right: 55px; z-index: 99; background: #fafafa; border: 1px solid #d4d4d4; outline: none; color: #666; font-weight: 400; } .wooconvo-send .wooconvo-nofile{ padding-left: 2px !important; } .wooconvo-send ::-webkit-input-placeholder { color: #000; } .wooconvo-send .emojis:active { opacity: 0.9; } .chat-container { position: relative; background-color: #E5E5E5; max-height: 400px; overflow: scroll; overflow-x: hidden; border: 1px solid #d4d4d4; } .bottom-bottons { width: 100%; position: relative; } .nm-wooconvo-send { position: absolute !important; top: 0 !important; right: 0 !important; height: 50px !important; padding: 0 20px !important; background-color: #95d4ff !important; color: #FFF !important; border-radius: 0 !important; } .wooconvo-send .dashicons-paperclip { position: absolute; top: 15px; left: 13px; cursor: pointer; color: #0e80ce; } #sending-order-message { position: absolute; top: 10px; right: 85px; } .wooconvo-send .other .msg time { float: left; } .wooconvo-file-item span{ padding: 5px; } .widefat .column-wc_actions a[class*="convo"]::after { content: "\f125"; } .conversation-btn { padding: 0px; background: #000; margin-bottom: 10px; position: absolute; right: -8px; top: -8px; font-size: 14px; font-weight: bold; border-radius: 50%; width: 30px; height: 30px; border: 0; color: #fff; cursor: pointer; background-color: #e5e5e5 !important; border-radius : 50% !important; }