.star_rating {
	list-style: none;
padding: 0;
margin: 0;
display: inline-flex;
position: relative;
align-items: first baseline;
justify-content: center;
}

.star_rating li a:before {
    font-family: var(--Icon-font);
    content: '\f005';
    font-size: 12px;
	font-weight: bold;
}
.star_rating li a:hover {
  color: #b4453b;
}
.star_rating li a {
  color: #9f9f9f;
}
.star_rating li[style*="20"] ~ li a.one_star {
    color: #ffca00;
}

.star_rating li[style*="40"] ~ li a.two_stars,  .star_rating li[style*="40"] ~ li a.one_star {
    color: #ffca00;
}

.star_rating li[style*="60"] ~ li a.three_stars, .star_rating li[style*="60"] ~ li a.two_stars, .star_rating li[style*="60"] ~ li a.one_star {
    color: #ffca00;
}

.star_rating li[style*="80"] ~ li a.four_stars, .star_rating li[style*="80"] ~ li a.three_stars, .star_rating li[style*="80"] ~ li a.two_stars, .star_rating li[style*="80"] ~ li a.one_star {
    color: #ffca00;
}

.star_rating li[style*="100"] ~ li a.five_stars, .star_rating li[style*="100"] ~ li a.four_stars, .star_rating li[style*="100"] ~ li a.three_stars, .star_rating li[style*="100"] ~ li a.two_stars, .star_rating li[style*="100"] ~ li a.one_star {
    color: #ffca00;
}

 .star_rating li a, 
.star_rating .current_rating {
  position: relative;
  text-indent: -1000px;
  outline: none;
  overflow: hidden;
  border: none;
  font-size: 0;
  top: 0;
  left: 0;
}

.star_rating li a:checked:before {
    animation: star 0.8s ease-out;
}

@keyframes star {
  0% {
    transform: scale(0.8);
  }
  20% {
    transform: scale(1.1);
  }
  40% {
    transform: scale(0.9);
  }
  60% {
    transform: scale(1.05);
  }
  80% {
    transform: scale(0.96);
  }
  100% {
    transform: scale(1);
  }
}


.star_rating_success,
.success_message {
	color: #00b200;
	font-weight: bold;
	font-size: 10px;
	margin-bottom: 10px;
}