.smileys {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  list-style: none;
  margin: 0;
  padding: 0;
}

.smileys .button {
  height: 46px;
  justify-content: center;
  line-height: 46px;
  min-width: 40px;
  padding: 2px 8px;
  vertical-align: bottom;
}

.smileys .button:hover {
  background-color: #eeeeee;
}

[class^="smiley-"] {
  background-repeat: no-repeat;
  display: inline-block;
  margin: 0 1px;
}

[class^="smiley-"] span {
  display: none;
}

.smiley-ah             { background-image: url("smileys/ah.gif");             height: 32px; width:  15px; }
.smiley-cheers         { background-image: url("smileys/cheers.gif");         height: 16px; width:  57px; }
.smiley-confused       { background-image: url("smileys/confused.png");       height: 22px; width:  15px; }
.smiley-dontunderstand { background-image: url("smileys/dontunderstand.gif"); height: 15px; width:  37px; }
.smiley-gaga           { background-image: url("smileys/gaga.gif");           height: 16px; width:  23px; }
.smiley-grin           { background-image: url("smileys/grin.png");           height: 15px; width:  15px; }
.smiley-grr            { background-image: url("smileys/grr.gif");            height: 16px; width:  16px; }
.smiley-kicker         { background-image: url("smileys/kicker.png");         height: 39px; width: 102px; }
.smiley-laugh          { background-image: url("smileys/laugh.gif");          height: 25px; width:  29px; }
.smiley-love           { background-image: url("smileys/love.gif");           height: 15px; width:  15px; }
.smiley-no             { background-image: url("smileys/no.gif");             height: 19px; width:  22px; }
.smiley-ohh            { background-image: url("smileys/ohh.gif");            height: 25px; width:  37px; }
.smiley-puke           { background-image: url("smileys/puke.gif");           height: 30px; width:  64px; }
.smiley-rolleyes       { background-image: url("smileys/rolleyes.gif");       height: 15px; width:  15px; }
.smiley-rtfm           { background-image: url("smileys/rtfm.png");           height: 24px; width:  19px; }
.smiley-sad            { background-image: url("smileys/sad.gif");            height: 15px; width:  15px; }
.smiley-smile          { background-image: url("smileys/smile.png");          height: 15px; width:  15px; }
.smiley-stink          { background-image: url("smileys/stink.png");          height: 15px; width:  24px; }
.smiley-tongue         { background-image: url("smileys/tongue.png");         height: 15px; width:  15px; }
.smiley-wink           { background-image: url("smileys/wink.png");           height: 15px; width:  15px; }
.smiley-xxx            { background-image: url("smileys/xxx.gif");            height: 22px; width:  74px; }
.smiley-yes            { background-image: url("smileys/yes.gif");            height: 15px; width:  15px; }
.smiley-zap            { background-image: url("smileys/zap.gif");            height: 23px; width:  62px; }
.smiley-zzz            { background-image: url("smileys/zzz.gif");            height: 25px; width:  27px; }