.post-actions {
  margin-left: 55px;
  height: 13px;

  .action {
    display: inline-block;
    width: 55px;

    .count {
      color: @muted-text;
      font-size: 11.5px;
      font-weight: 700;
      vertical-align: top;
      margin-left: 5px;
    }

    &.reply:hover {

      .count {
        color: var(--theme-color);
      }

      * {
        stroke: var(--theme-color);
      }
    }

    &.vote.voted,
    &.vote:hover {

      .count {
        color: crimson;
      }

      * {
        stroke: crimson;
      }
    }
  }

  .icon * {
    stroke: #999;
    stroke-width: 8px;
    fill: none;
  }

  .vote-icon {

    &.voted {

      .heart * {
        fill: crimson;
        stroke: crimson;
      }
    }

    &.vote-animation .heart {
      animation: puff-out-center 0.25s cubic-bezier(0.165, 0.840, 0.440, 1.000) both;
    }
  }

  .icon {
    cursor: pointer;
    width: 14.5px;
    height: 14.5px;
  }
}


@keyframes puff-out-center {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.3);
    opacity: 0;
  }
}
