.starability-result {
    position: relative;
    width: 150px;
    height: 30px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII=");
    font-size: 0.1em;
    color: transparent;
  }
  
  .starability-result:after {
    content: ' ';
    position: absolute;
    left: 0;
    height: 30px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII=");
    background-position: 0 -30px;
  }
  
  .starability-result[data-rating="5"]::after {
    width: 150px;
  }
  
  .starability-result[data-rating="4"]::after {
    width: 120px;
  }
  
  .starability-result[data-rating="3"]::after {
    width: 90px;
  }
  
  .starability-result[data-rating="2"]::after {
    width: 60px;
  }
  
  .starability-result[data-rating="1"]::after {
    width: 30px;
  }
  
  @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi) {
    .starability-result {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg==");
      background-size: 30px auto;
    }
    .starability-result:after {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg==");
      background-size: 30px auto;
    }
  }
  
  @-webkit-keyframes checkmark {
    0% {
      -webkit-transform: translateX(-15px);
              transform: translateX(-15px);
    }
    60% {
      opacity: 1;
    }
    70% {
      -webkit-transform: none;
              transform: none;
    }
    80% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  @keyframes checkmark {
    0% {
      -webkit-transform: translateX(-15px);
              transform: translateX(-15px);
    }
    60% {
      opacity: 1;
    }
    70% {
      -webkit-transform: none;
              transform: none;
    }
    80% {
      opacity: 1;
    }
    100% {
      opacity: 0;
    }
  }
  
  .starability-checkmark {
    display: block;
    position: relative;
    width: 150px;
    min-height: 60px;
    padding: 0;
    border: none;
  }
  
  .starability-checkmark > input {
    position: absolute;
    margin-right: -100%;
    opacity: 0;
  }
  
  .starability-checkmark > input:checked ~ label,
  .starability-checkmark > input:focus ~ label {
    background-position: 0 0;
  }
  
  .starability-checkmark > input:checked + label,
  .starability-checkmark > input:focus + label {
    background-position: 0 -30px;
  }
  
  .starability-checkmark > input[disabled]:hover + label {
    cursor: default;
  }
  
  .starability-checkmark > input:not([disabled]):hover ~ label {
    background-position: 0 0;
  }
  
  .starability-checkmark > input:not([disabled]):hover + label {
    background-position: 0 -30px;
  }
  
  .starability-checkmark > input:not([disabled]):hover + label::before {
    opacity: 1;
  }
  
  .starability-checkmark > input:focus + label {
    outline: 1px dotted #999;
  }
  
  .starability-checkmark .starability-focus-ring {
    position: absolute;
    left: 0;
    width: 100%;
    height: 30px;
    outline: 2px dotted #999;
    pointer-events: none;
    opacity: 0;
  }
  
  .starability-checkmark > .input-no-rate:focus ~ .starability-focus-ring {
    opacity: 1;
  }
  
  .starability-checkmark > label {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    font-size: 0.1em;
    color: transparent;
    cursor: pointer;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII=");
    background-repeat: no-repeat;
    background-position: 0 -30px;
  }
  
  .starability-checkmark > label::before {
    content: '';
    position: absolute;
    display: block;
    height: 30px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAMAAABGivqtAAAAxlBMVEUAAACZmZn2viTHuJ72viOampqampr1viSampr3vySampqdnZ34wiX1vSSampr1vSOZmZmampr1viT2vSOampr2viT2viSampr2viSampr2vyX4vyWbm5v3vSSdnZ32wSadnZ36wCWcnJyZmZn/wSr/2ySampr2vSP2viSZmZn2vSSZmZn2vST2viSampr2viSbm5ubm5uZmZn1vSSampqbm5v2vSWampqampr3vSf5wiT5vyagoKD/xCmkpKT/yCSZmZn1vSO4V2dEAAAAQHRSTlMA+vsG9fO6uqdgRSIi7+3q39XVqZWVgnJyX09HPDw1NTAwKRkYB+jh3L6+srKijY2Ef2lpYllZUU5CKigWFQ4Oneh1twAAAZlJREFUOMuV0mdzAiEQBmDgWq4YTWIvKRqT2Htv8P//VJCTGfYQZnw/3fJ4tyO76KE0m1b2fZu+U/pu4QGlA7N+Up5PIz9d+cmkbSrSNr9seT3GKeNYIyeO5j16S28exY5suK0U/QKmmeCCX6xs22hJLVkitMImxCvEs8EG3SCRCN/ViFPqnq5epIzZ07QJJvkM9Tkz1xnkmXbfSvR7f4H8AtXBkLGj74mMvjM1+VHZpAZ4LM4K/LBWEI9jwP71v1ZEQ6dyvQMf8A/1pmdZnKce/VH1iIsdte4U8VEtY23xOujxtFpWDgKbfjD2YeEhY0OzfjGeLyO/XfnNpAcmcjDwKOXRfU1IyiTRyEkaiz67pb9oJHJb9vVqKfgjLBPyF5Sq9T0KmSUhQmtiQrJGPHVi0DoSabj31G2gW3buHd0pY85lNdcCk8xlNDPXMuSyNiwl+theIb9C7RLIpKvviYy+M6H8qGwSAp6Is19+GP6KxwnggJ/kq6Jht5rnRQA4z9zyRRaXssvyqp5I6Vutv0vkpJaJtnjpz/8B19ytIayazLoAAAAASUVORK5CYII=");
    background-position: 0 30px;
    pointer-events: none;
    opacity: 0;
  }
  
  .starability-checkmark > label:nth-of-type(5)::before {
    width: 120px;
    left: -120px;
  }
  
  .starability-checkmark > label:nth-of-type(4)::before {
    width: 90px;
    left: -90px;
  }
  
  .starability-checkmark > label:nth-of-type(3)::before {
    width: 60px;
    left: -60px;
  }
  
  .starability-checkmark > label:nth-of-type(2)::before {
    width: 30px;
    left: -30px;
  }
  
  .starability-checkmark > label:nth-of-type(1)::before {
    width: 0px;
    left: 0px;
  }
  
  @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi) {
    .starability-checkmark > label {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAB4CAMAAACZ62E6AAABAlBMVEUAAACZmZmampr2vSObm5v/yiufn5+ampr1viP1viSZmZn2viOZmZmampqampr2viSampqampqcnJz5vyScnJz3wSf/wyn/xiujo6Oqqqr/0C/1vSOampr2viP2viOampr2viP2vST2viOampqampqampr1vyP3viSampr2vyT4vyX3viSbm5ubm5v5wCT8xSmgoKCampqampr3vyb2wiWenp72viOampqZmZmampr2viP2viP1viSampqbm5v2vyT3viObm5v4vyadnZ34wSSbm5v2viSZmZn2viP2vST2viP2viT1viOZmZn2viT2viX3viT3vyb2vyOZmZn1vSOZmZlNN+fKAAAAVHRSTlMA9uz4PQwS8O7r5+fTw4yMelw2MB0dFRELBgbS+/Hfu7uxqKWdg4N7ZmZMPi8pKRgPs0w7Nhb14drKw6Gck21tXkNDIyMZ1rDLycTBtaqVknlfV0sGP8ZwAAADW0lEQVRYw9zWvYqDQBSG4TPDoCAqKhYKQgoVLFaIgZCkiCBBUqVazv3fyu4aEXWdM85Uy779A+LP58AfTQgw73AwtxFiZIwbxMbUfuB3H4b49YNfZrbGodoI52+cm9hH9sbZwwAXOFbo2zjDsSzWxnecuuvaM8MpdtbEPs7y9azF5phZWrjERaWOPdpLbB81cICrgv3W4mvMLbU6RmFQeA5u5HhFEEbHLdWLsMxvHJXxW16Goh+ZqPyny1Az5j79SsCJoWHsBNAxQ9sNF26bWFuMC8v1LY+mmeTadjaqtaNnnXoxWBcde1nNWnzdb68xrOqvu22/MTzuPutujpJ122NvluSb8tTWk85CclDZQwLS0oa2TQpEKacsJy0kSJaQOKJxROKKxhWJ7zS+k9ijsUdim8Y2ZWNUFBP4pMKfOv8onX9WrsI5gd3VVLXtatxcuU0znGUHCUAS2DgrS6mT6hTzrXEjfIZj5Dk2xKkihqm4wKlQfQRqalhUP9UHo3FIPAG/Et44JVLsDDf0JHmB3OEByOwZES8hSAsviGjBdh3ylh6plmMnW4IyAUVJWcE/76vTell1EIaiMBwIAcWBA9GC0lIdKFXQQUsHVVCklN7ojf3+z3JOxYqK2TH555+K6CJJQtRbr9XtDmCnjH0AX9Va8J+liIMvDtRsCk2pEs6hKVexR2g7KuDihwt5a9MfprY0fkLXU9ZmFLpoJolN6GXKWWfZx0tHCocwKJSxC22ItYUEjmBUJHFjfYz1xQxlfaLiZsBExq2IPtbkNbLtOwwuGgjTLkH43mYtSzam7+1Bsr3nm5uExBQUozEh9V7N7uvmwZcqdpm0C6vJW63bZEuXtbrV2zpDzhrpYLBWMnY1mjV7JWFtMio7zbWniWFxvHnWm1yGxXmOPXP+L3YV2ysjnNhaZNeMcHPvuL27BMnVMaujljBAYyje4niH4g2ONyh+4PiB4gOODyjWcKxh1gZBNoJjEY4R/BLhF4IDEQ4QPBoEoyxH4+bxrUsHyxwxQlg0WHXqYifVLmo67cKY/UtaXFxBV26TLjuHrkp8BPJTMij1xQejdkgO24nf7dBOCRcbzQuNOR9Qs64GzzrfQa8It2oFAA6Zrga9xEeq1KHmLUHIiCAWInsg1x/MLqkMsItF8QAAAABJRU5ErkJggg==");
      background-size: 30px auto;
    }
  }
  
  @media screen and (-ms-high-contrast: active) {
    .starability-checkmark {
      width: auto;
    }
    .starability-checkmark > input {
      position: static;
      margin-right: 0;
      opacity: 1;
    }
    .starability-checkmark .input-no-rate {
      display: none;
    }
    .starability-checkmark > label {
      display: inline;
      float: none;
      width: auto;
      height: auto;
      font-size: 1em;
      color: inherit;
      background: none;
    }
    .starability-checkmark > label::before, .starability-checkmark > label::after {
      display: none;
    }
  }
  
  .starability-checkmark > label {
    z-index: 2;
  }
  
  .starability-checkmark > label::after {
    content: ' ';
    position: absolute;
    opacity: 0;
    width: 30px;
    height: 30px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzM4MUFFNkVFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzM4MUFFNkZFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowMjVDOUVGRkUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowMjVDOUYwMEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PrdrnzwAAAI6SURBVHja7Jc9SwNBEIZnL+qBIopgE7EKgtjY+gcsRA2JkEItbGxEooU2xkIs1EZBDFrZiY0pjFGwEfEviI2NpWkEEQRJIt46s4l4d9ndu5zRNB4c5D52npvZmXknjHMOjTgMaNDRMHCT/YIxpn5zLxaGdx4Dbo3hmxG8E648yQPwB2DGBTSzLCxk8yoT9m1ljgsZmIClj3XgMOvLFQaH0BJak32Af/BOdBwsOMYl7bUFkr3iJk7DUu5cBVbv8XY0CRbP1Q4ViHaxlmyoPk3qsfCUoPVIXxb98lwfatrTonUfzFNF2E2jn/ZcH2pKpLpBK2EXNnWhTsfR24/HH1De8GyVPjFDPTx5mpd7THUaOKKQReN9+ONW+txl2wkWzSEQ9BLaOidF7ZrmMF4/V0fcadu1x6IjBYFOwNxRoZwjhVVsNl2SFyO6Xh1WA9gJninXvRsHdHt8F6GLCgvh2kWCsczTyOgULOe2wDDmv6EdIz6hnuqkavC93ddX5RJbOjsQTcE04zbohg9oXgNGlZHLyhAUijeQTnSW4diJkpkXGzTlo54f1GCSNvXCQQHfS3Tb+vmKP2i1bYceCz0twr4WXiJ4bBhK1gxGYtN39pNtpcdUh6Sn2ojxAWyBdzVByaZLn6uzmkScGrsWLqtTjUgIm14zF30ZiXj9prpp2TQir2PKWsYWfq6IaMM1hXg3kOVcWtSrV9iVow+uJRuBxlv6WhJxr4RzJxKtUXjqf8r8i/H2/y/Mbx6fAgwA8wT2yCo9WaMAAAAASUVORK5CYII=");
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzM4MUFFNkVFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzM4MUFFNkZFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowMjVDOUVGRkUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowMjVDOUYwMEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PrdrnzwAAAI6SURBVHja7Jc9SwNBEIZnL+qBIopgE7EKgtjY+gcsRA2JkEItbGxEooU2xkIs1EZBDFrZiY0pjFGwEfEviI2NpWkEEQRJIt46s4l4d9ndu5zRNB4c5D52npvZmXknjHMOjTgMaNDRMHCT/YIxpn5zLxaGdx4Dbo3hmxG8E648yQPwB2DGBTSzLCxk8yoT9m1ljgsZmIClj3XgMOvLFQaH0BJak32Af/BOdBwsOMYl7bUFkr3iJk7DUu5cBVbv8XY0CRbP1Q4ViHaxlmyoPk3qsfCUoPVIXxb98lwfatrTonUfzFNF2E2jn/ZcH2pKpLpBK2EXNnWhTsfR24/HH1De8GyVPjFDPTx5mpd7THUaOKKQReN9+ONW+txl2wkWzSEQ9BLaOidF7ZrmMF4/V0fcadu1x6IjBYFOwNxRoZwjhVVsNl2SFyO6Xh1WA9gJninXvRsHdHt8F6GLCgvh2kWCsczTyOgULOe2wDDmv6EdIz6hnuqkavC93ddX5RJbOjsQTcE04zbohg9oXgNGlZHLyhAUijeQTnSW4diJkpkXGzTlo54f1GCSNvXCQQHfS3Tb+vmKP2i1bYceCz0twr4WXiJ4bBhK1gxGYtN39pNtpcdUh6Sn2ojxAWyBdzVByaZLn6uzmkScGrsWLqtTjUgIm14zF30ZiXj9prpp2TQir2PKWsYWfq6IaMM1hXg3kOVcWtSrV9iVow+uJRuBxlv6WhJxr4RzJxKtUXjqf8r8i/H2/y/Mbx6fAgwA8wT2yCo9WaMAAAAASUVORK5CYII=");
  }
  
  @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi) {
    .starability-checkmark > label::after {
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTgyRjdBNDlFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTgyRjdBNEFFMEFDMTFFNjkzRkJGMTdBODM0NzVDNTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDMzgxQUU3OEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFODJGN0E0OEUwQUMxMUU2OTNGQkYxN0E4MzQ3NUM1MCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvR97twAAARDSURBVHja7JvNaxNBFMDfbEvaDQQaPFUQBYvkD7D1ZtUKVSGJhVILft16UA9qogdRKKgXm9CLCnqrLVilUJOiUJTqVT0VLz3Ugz3YU2mh0MQiWefNJqVps5Od2dnN1mQgodm0M++37828ry0xDAPqaWhQZ6MB3ABuAO/t0Wz1BSHE+ezPruiQXzsNBThFP0WAQAcYEAYwQsVV1um1VXptkX5YoLd/DlrbPsH1VzmnS1t5H2L5hSzw0wth+LMRpxD46qVXdMEZcvQmzNJXBlqCGbjxZtWfwKjN3FqCLnWXgoaU2B+Bdfr2BPS2tKjW3QVOxYbo+zBdpd2VjUfIMps/mX1ZW+DR/v3wd/Mdnb7TmyOHfIfmwHm4NfXbe+BU/Biddto1rXK1TfogmfkqAyznltKxS2AUPnsOa5K0s7VRBpn7JaxhXKhgjPsjiiCXIZGdcM+k0Yzx7oq7GrcGdWHayUrm7dyk8YDCPesfWDBloTIx2VSHlnga12LP2tnTzFOoBGZ+1ivXI0XdWYwFFBxaZgT105fa3emu9LbDpYhMfg9juOh32JJps9DWiYYxEchv/FIWG7uuZRp7twYPYsIhp2Ez6wnVyEQxZdwU0zKVFWWWPrQwxauNpn5Aq94FmjYoAR2XM+nnV3XYWF3x3O8y2GD3Vh6cjvdBoTBJfwrYDkaC4X3GtbGcmIaxUuE5LDXjppYzZUl/IjMtqGm9KLugSZtlGY9hA92VUr+3By6+p78wb3sujuy8PRzx0IyXrGBxDCxNjAkGPhFxYCy4eQWrQY9lUp+KvaY+dlBwzg5xYFZddFCZ0EjSVnSEsLdnFpXBVpGdY9JGSBpW13tpnppm+arVYcNgjePWsNEXUrBVZFdciC/Clk5ZTM4rnrBkhQKf5cPCkBs7iANM1oX953bYMrdC+pl/LMFqpIden3cP1lp23qElWgA/BPn8kYrfJLIzFPKceUBxYEdio0o0y5Gdd2gtCsexUPgI6dgJC+gvoIcjXFgwbqrJnKxl5+3hBYmFQlAwPlhCW3UPUtHHymCryK5xdvecdJ3JhI7aq6ZQWAPuKT6Z5sSBsYu3ddBIQU+xwJ9fOrqvHBZlNmUXBEbzwy6e/AiwLGckOmANazx0IXKb5TXetCp/nHG4PKZ047u6BOlYwhVYGzLzgbE/y1qWDqGxU1GqKiJswUi5VuJBmaVrWqpNj5BJ+XDR1vwPIJl9xByGdNUSm9Fmf1aBf3QVdpnJKh9alvnOYfD/GLbzlID9ZtpI7Jt/uw80abmT7So3JqfNNOy8qzJt1aaMsjnPlnYMVpEgfQ6CETdGjslk4xEIuXwY+7AaGfINLspS5dEH5wUAltSzSkaupprldP/VHFq7QsN6eqilZN5NgaPshPTyNMY1Bc1YjYbLE4E6eTBt+6irRw+3j7p5uNRK63vl8eH/dTT+BaAB3ABuAO+p8U+AAQA0fxy2fEEf3gAAAABJRU5ErkJggg==");
      background-size: 30px auto;
    }
  }
  
  .starability-checkmark > label:nth-of-type(5)::after {
    right: -45px;
  }
  
  .starability-checkmark > label:nth-of-type(4)::after {
    right: -75px;
  }
  
  .starability-checkmark > label:nth-of-type(3)::after {
    right: -105px;
  }
  
  .starability-checkmark > label:nth-of-type(2)::after {
    right: -135px;
  }
  
  .starability-checkmark > label:nth-of-type(1)::after {
    right: -165px;
  }
  
  .starability-checkmark > input:checked + label::after {
    display: inline-block;
    -webkit-animation-name: checkmark;
            animation-name: checkmark;
    -webkit-animation-duration: .7s;
            animation-duration: .7s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
  }