/* fix positioning if more than one jot tool */ .jotplugins > div, #profile-jot-plugin-wrapper > div { float: left; } .jotplugins::after, #profile-jot-plugin-wrapper::after { content: ''; display: block; clear: both; } #profile-smiley-wrapper { float: left; margin-left: 15px; cursor: pointer; height: 10px; display: inline-block; } #profile-smiley-wrapper .btn { padding: 0; margin: 0; border: 0; background: none; width: 20px; height: 20px; line-height: inherit; display: inline-block; overflow: hidden; padding: 1px; color: #999; vertical-align: text-top; } #smileybutton { position: absolute; z-index: 99; display: none; } .smiley_button > img { height: 18px; width: 18px; margin-right: 18px; } div.smiley-preview { background-color: #FFF; box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); max-height: 200px; overflow: auto; } div.smiley-preview img.smiley { max-height: 25px; max-width: 25px; cursor: pointer; vertical-align: baseline; } div.smiley-preview > span { cursor: pointer; font-size: 24px; padding: 5px; text-align: center; width: 45px; height: 45px; line-height: 45px; float: left; display: block; } div.smiley-preview > span:hover, div.smiley-preview > span:focus { background-color: rgba(0,0,0,.1); } div.smiley-preview::after { content: ''; display: block; clear: both; }