.emojiPickerIconWrap {display:inline-block; position:relative;}
.emojiPickerIcon {position:absolute; top:0; right:0; cursor:pointer; }

.emojiPickerIconWrap .white {background:url("") center center no-repeat; background-size:60%;}
.emojiPickerIconWrap .black {background:url("") center center no-repeat; background-size:60%;}
.emojiPickerIconWrap .yellow {background:url("") center center no-repeat; background-size:60%;}
.emojiPickerIconWrap .grey, .emojiPickerIconWrap .gray {background:url("") center center no-repeat; background-size:60%;}

.emojiPicker {display:none; position:absolute; outline:none; border:none; box-shadow:0 0 7px #555; border-top-left-radius:4px; border-top-right-radius:4px; font-family:Helvetica, Arial, sans-serif; }
.emojiPicker div.emoji {width:1.3em; height:1.3em; position:relative; display:inline-block;}
.emojiPicker span.emoji {width:1.3em; height:1.3em; display:inline-block; position:relative; overflow:hidden; text-indent:-9999px; vertical-align:middle;}
.emojiPicker .hidden {display:none;}

.emojiPicker nav {display:flex; position:relative; z-index:0; background-color:#eee; border-top-left-radius:4px; border-top-right-radius:4px; border-bottom:1px solid #ddd;}
.emojiPicker nav div.tab {position:relative; flex-grow:1; top:1px; display:inline-block; margin:2% 0 0 0; padding:2% 2% 1% 2%; text-align:center; border:1px solid #eee; border-top-left-radius:4px; border-top-right-radius:4px; cursor:pointer;}
.emojiPicker nav div.tab:hover  {background-color:#ddd;}
.emojiPicker nav div.tab.active {background-color:#fff; box-shadow:0 0 3px #ccc; border:1px solid #ddd; border-bottom:none;}
.emojiPicker nav div.tab:first-of-type {margin-left:1%;}
.emojiPicker nav div.tab:last-of-type {margin-right:1%;}

.emojiPicker nav div.tab .emoji {width:1.1em; height:1.1em;}
.emojiPicker nav div.tab .emoji-tab-recent  {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-people {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-nature  {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-food    {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-activity   {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-travel  {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-object  {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-symbol  {background:url("") center center no-repeat;}
.emojiPicker nav div.tab .emoji-tab-flag    {background:url("") center center no-repeat;}

.emojiPicker .sections {overflow:scroll; position:relative; background:#fff; z-index:10;}
.emojiPicker section {overflow:hidden; width:100%; padding-top:1%;}
.emojiPicker section h1 {clear:both; margin:0; padding:2%; color:#444; font-size:14px; text-transform:capitalize;}
.emojiPicker section em {float:left; display:inline-block; padding:2%; border-radius:4px; cursor:pointer;}
.emojiPicker section em:hover {background-color:#eee;}
.emojiPicker section em div {width:40px; margin:1%;}
.emojiPicker section em div:hover {cursor:pointer;}

.emojiPicker section .wrap {width:100%;}
.emojiPicker section.search .wrap {padding-top:1%;}
.emojiPicker section.search input {display:block; width:96%; height:28px; margin:2%; padding:1%; font-size:12px; border:1px solid #ddd; border-radius:4px;}

.emojiPicker .shortcode {height:40px; background:#eee; border-top:1px solid #ddd; vertical-align:middle;}
.emojiPicker .shortcode .info {display:none;}
.emojiPicker .shortcode .emoji {position:relative; top:4px; left:8px; width:1.9em; height:1.9em; margin-right:20px;}
.emojiPicker .shortcode em {position:relative; top:-5px; color:#444; font-size:12px; font-weight:900; font-style:normal;}
.emojiPicker .shortcode em.tabTitle {position:relative; top:10px; left:8px; font-size:14px;}
.emojiPicker .shortcode em.tabTitle .count {font-size:12px; font-weight:500;}
.emojiPicker .shortcode .random .tabTitle {color:#7d7d7d; font-size:12px;}
.emojiPicker .shortcode .eod {float:right; padding:8px 10px 0 0; max-width:200px;}
.emojiPicker .shortcode .eod .emoji {top:-10px; left:0; margin-right:10px;}
.emojiPicker .shortcode .eod .emojiName {max-width:70%; padding:5px 0 0 0; font-size:10px; font-weight:normal;}
