.lsx-emojipicker-emoji span { display: inline-block; font-size: 24px; width: 33px; height: 35px; cursor: pointer; } .lsx-emojipicker-emoji p { font-size:12px; color:#66757F; text-align:center; border-bottom:1px solid #E6ECF0; } .lsx-emojipicker-appender { position: relative; } .lsx-emojipicker-container { background: #ffffff; border-radius: 3px; z-index: 2; position: absolute; top: 13px; left: -40px; box-shadow: 0.5px 0.5px 3px rgba(0,0,0,0.26); transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; display: none; font-family:"apple color emoji","segoe ui emoji",notocoloremoji,"segoe ui symbol","android emoji",emojisymbols,"emojione mozilla"; color:initial; } ul.lsx-emojipicker-tabs { margin: 0; list-style: none; text-align: center; border-top-left-radius: 3px; border-top-right-radius: 3px; } ul.lsx-emojipicker-tabs li { display: inline-block; text-align: left; font-size: 15px; padding: 6px; cursor: pointer; transition: 0.15s ease-out; border-bottom: 0px solid #189EFC; } ul.lsx-emojipicker-tabs li.selected, ul.lsx-emojipicker-tabs li:HOVER { border-bottom: 3px solid #189EFC; } .lsx-emojipicker-tabs img.emoji { margin: 0; cursor: pointer; } .lsx-emojipicker-tabs img.emoji:HOVER, .lsx-emojipicker-tabs li.selected img.emoji { opacity: 1; } .lsx-emojipicker-emoji span img.emoji { margin: 5px 4px; cursor: pointer; transition: all 0.1s ease-in-out; -webkit-transition: all 0.1s ease-in-out; } .lsx-emojipicker-emoji.lsx-emoji-tab { width: 220px; padding: 8px; height: 200px; border-radius: 4px; overflow: auto; } .lsx-emojipicker-emoji span:HOVER, .lsx-emojipicker-emoji span img.emoji:HOVER { transform: scale(1.1); -webkit-transform: scale(1.1); -ms-transform: scale(1.1); } .lsx-emojipicker-container .loader { border: 6px solid #ececec; border-top: 6px solid #d8d8d8; border-radius: 50%; width: 40px; height: 40px; animation: spin 1.2s linear infinite; margin: 0 auto; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .lsx-emojipicker-wrapper { width: 100%; height: 100%; position: relative; } .lsx-emojipicker-wrapper .spinner-container { position: absolute; background: #ffffffbd; width: 100%; height: 100%; z-index: 10; border-radius: 4px; display: flex; align-items: center; } .lsx-emojipicker-container:before { display: block; content: ""; z-index: -1; width: 20px; height: 20px; position: absolute; transform: rotate(45deg); top: -5px; left: 8px; background-color: #fff; } .lsx-emojipicker-emoji.lsx-emoji-tab.hidden { display: none; }