.starselection {
    position: relative;
    margin-bottom: 20px;
    min-height: 60px;
    border: none;
    padding: 0;
  }
  
  .starselection legend {
    margin-bottom: 10px;
    font-size: 20px;
  }
  
  .starselection input {
   position:absolute;
   margin-right:-100%;
   opacity:0;
  }
  .starselection input:checked ~ label,
  .starselection input:focus ~ label {
    background-position: 0 -30px;
  }
  
  .starselection label {
    position: relative;
    float: left;
    width: 30px;
    font-size: .1em;
    color: transparent;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: 0 -30px;
  }
  
  .starselection label,
  .starselection label:before {
   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=");
  }
  
  .starselection label:before {
   content:'';
   position:absolute;
   display:block;
   pointer-events:none;
   opacity:0;
   background-position: 0 30px;
  }
  
  /* Fokusmarkierung per Tastatur */
  .starselection .starselection__focus-ring {
      position:absolute;
      left:0;
      width:100%;
      height:30px;
      outline:2px dotted #999;
      pointer-events:none;
      opacity:0;
  }
  .starselection .input-no-rate:focus ~ .starselection__focus-ring {
      opacity:1;
  }
  
  /* Sternentausch */
  
  .starselection input:checked ~ label {
   background-position:0 0;
  }
  .starselection input:checked + label,
  .starselection input:focus + label {
   background-position:0 -30px;
  }
  .starselection input:hover ~ label,
  .starselection input:focus ~ label{
   background-position:0 0;
  }
  .starselection input:hover + label,
  .starselection input:focus + label {
   background-position:0 -30px;
  }
  .starselection input:hover + label:before,
  .starselection input:focus + label:before {
   opacity:1;
  }
  
  /* Breite und Positionierung */
  .starselection label:nth-of-type(5):before {
   width:120px;
   left:-120px;
  }
  .starselection label:nth-of-type(4):before {
   width:90px;
   left:-90px;
  }
  .starselection label:nth-of-type(3):before {
   width:60px;
   left:-60px;
  }
  .starselection label:nth-of-type(2):before {
   width:30px;
   left:-30px;
  }
  .starselection label:nth-of-type(1):before {
   width:0;
   left:0;
  }
  
  /* Effekt 1: grow */
  
  .starselection--grow label:after,
  .starselection--growrotate label:after {
   content:' ';
   position:absolute;
   bottom:0;
   left:0;
   opacity:0;
   width:30px;
   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-repeat:no-repeat;
  }
  
  .starselection--grow input:checked + label:after,
  .starselection--growrotate input:checked + label:after {
   background-position:0 -30px;
   opacity:1;
   animation-duration:1s;
   animation-fill-mode:forwards;
  }
  
  .starselection--grow input:checked + label:after {
   animation-name:stargrow;
  }
  
  .starselection--growrotate input:checked + label:after {
   animation-name:stargrowrotate;
  }
  
  @keyframes stargrow {
   0% {
    transform:scale(1);
   }
   70% {
    transform:scale(3);
    opacity:0;
   }
   to {
    transform:scale(1);
    opacity:0;
   }
  }
  
  @keyframes stargrowrotate {
   0% {
    transform:scale(1) rotate(0deg)
   }
   99% {
    transform:scale(4) rotate(90deg);
    opacity:0
   }
   to {
    transform:scale(1) rotate(0deg);
    opacity:0
   }
  }

  form#reviewsform input[type="text"],form#reviewsform input[type="email"] {
    min-height: 42px;
}

form#reviewsform textarea#review_message {
  min-height: 220px;
}