svg[class^="icon-"] {
  vertical-align: middle;
}

svg[class^="icon-vote"] {
  vertical-align: text-bottom;
}

.icon-white {
  fill: white;
}

.icon-black {
  fill: #343434;
}

.icon-gray {
  fill: #555555;
}

.icon-gray-light {
  fill: #777777;
}

.icon-medium {
  width: 24px;
  height: 24px;
  display: inline-block;
  vertical-align: text-bottom;
}

.icon-small {
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
}

.icon-hero {
  width: 18px;
  height: 18px;
  display: inline-block;
  vertical-align: middle;
}

.icon-visibility {
  width: 15px;
  height: 18px;
  display: inline-block;
  vertical-align: text-bottom;
  fill: #4d4d4d;
}

.icon-responsive {
  width: 100%;
  height: 100%;
}

.img-avatar, .avatar img, .avatar-icon {
  border-radius: 50%;
}