hauntd/yii2-vote

.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.vote:hover .vote-btn {
  -webkit-transition: opacity 0.15s ease 0.2s ease-out;
  -moz-transition: opacity 0.15s ease 0.2s ease-out;
  -o-transition: opacity 0.15s ease 0.2s ease-out;
  transition: opacity 0.15s ease 0.2s ease-out;
  -webkit-transition: opacity 0.15s ease;
  -moz-transition: opacity 0.15s ease;
  -o-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
.vote.vote-visible-buttons .vote-btn {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
.vote .vote-count,
.vote .vote-btn {
  padding: 3px 8px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.vote .vote-count {
  position: relative;
  background: #ECF0F1;
  color: #5e7980;
  font-weight: bolder;
  font-size: 11pt;
  display: inline-block;
  padding: 3px 12px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.vote .vote-count.vote-loading > span {
  animation: 1s voteFadeOut;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.vote .vote-btn {
  border: 0;
  background: transparent;
  font-weight: bolder;
  font-size: 11pt;
  cursor: pointer;
  text-align: center;
  -webkit-transition: opacity 0.2s ease 0.2s ease-out;
  -moz-transition: opacity 0.2s ease 0.2s ease-out;
  -o-transition: opacity 0.2s ease 0.2s ease-out;
  transition: opacity 0.2s ease 0.2s ease-out;
  -webkit-transition: opacity 0.2s ease;
  -moz-transition: opacity 0.2s ease;
  -o-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
}
.vote .vote-btn i.glyphicon {
  font-size: 11pt;
  color: #a3b6bb;
}
.vote .vote-btn:hover,
.vote .vote-btn.vote-active {
  color: #a3b6bb;
  background: #ECF0F1;
}
.vote .vote-btn:hover i.glyphicon,
.vote .vote-btn.vote-active i.glyphicon {
  color: #ECF0F1;
}
.vote .vote-btn:hover.vote-up,
.vote .vote-btn.vote-active.vote-up {
  color: #ECF0F1;
  background: #03A678;
}
.vote .vote-btn:hover.vote-down,
.vote .vote-btn.vote-active.vote-down {
  color: #ECF0F1;
  background: #D24D57;
}
.vote .vote-btn.vote-loading {
  animation: 1s voteHalfOpacity;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.vote-toggle .vote-btn {
  position: relative;
}
.vote-toggle .vote-btn .vote-icon {
  margin-right: 7px;
  padding-right: 7px;
  border-right: 1px solid #aaa;
}
.vote-toggle .vote-btn .vote-count {
  display: inline-block;
  font-weight: bolder;
  font-size: 10pt;
  background: #ECF0F1;
  color: #5e7980;
  padding: 0 8px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.vote-toggle .vote-btn.vote-loading .vote-icon,
.vote-toggle .vote-btn.vote-loading .vote-label,
.vote-toggle .vote-btn.vote-loading .vote-count {
  animation: 1s voteHalfOpacity;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.vote-toggle.vote-toggle-like .vote-btn.vote-active .vote-icon {
  color: #e74c3c;
}
.vote-toggle.vote-toggle-favorite .vote-btn.vote-active .vote-icon {
  color: #f39c12;
}
.vote .vote-loader,
.vote-toggle .vote-loader {
  position: absolute;
  top: 50%;
  width: 100%;
  left: 0;
  height: 7px;
  text-align: center;
  animation: 1s voteFadeIn;
  animation-iteration-count: 1;
}
.vote .vote-loader span,
.vote-toggle .vote-loader span {
  height: 7px;
  width: 7px;
  margin-left: 2px;
  margin-right: 2px;
  background-color: #9E9EA1;
  border-radius: 50%;
  position: relative;
  top: -10.5px;
  display: inline-block;
}
.vote .vote-loader span:nth-of-type(1),
.vote-toggle .vote-loader span:nth-of-type(1) {
  animation: 1s voteBlink infinite 0.334s;
}
.vote .vote-loader span:nth-of-type(2),
.vote-toggle .vote-loader span:nth-of-type(2) {
  animation: 1s voteBlink infinite 0.667s;
}
.vote .vote-loader span:nth-of-type(3),
.vote-toggle .vote-loader span:nth-of-type(3) {
  animation: 1s voteBlink infinite 1s;
}
@keyframes voteBlink {
  50% {
    background-color: #3498db;
  }
}
@keyframes voteFadeIn {
  from {
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
    filter: alpha(opacity=0);
  }
  to {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
}
@keyframes voteFadeOut {
  from {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
  to {
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
    filter: alpha(opacity=0);
  }
}
@keyframes voteHalfOpacity {
  from {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
  to {
    -moz-opacity: 0.2;
    -khtml-opacity: 0.2;
    -webkit-opacity: 0.2;
    opacity: 0.2;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
    filter: alpha(opacity=20);
  }
}