.rating-area {
	overflow: hidden;
	width: 150px;
	margin: 0 auto;
white-space:nowrap;
}
.rating-area:not(:checked) > input {
	display: none;
}
.rating-area:not(:checked) > label {
	float: right;
	width: 25px;
	padding: 0;
	cursor: pointer;
	font-size: 32px;
	line-height: 32px;
	color: #C24BE7;
	/*text-shadow: 1px 1px #bbb;*/
}
.rating-area:not(:checked) > label:before {
	content: ' ';
background:url(images/star.png);
width: 21px;
    height: 20px;
    display: block;
}
.rating-area > input:checked ~ label {
	background:url(images/star-active.png);
background-repeat: no-repeat;

	
}
.rating-area:not(:checked) > label:hover,
.rating-area:not(:checked) > label:hover ~ label {
	background:url(images/star-active.png);
background-repeat: no-repeat;

}
.rating-area > input:checked + label:hover,
.rating-area > input:checked + label:hover ~ label,
.rating-area > input:checked ~ label:hover,
.rating-area > input:checked ~ label:hover ~ label,
.rating-area > label:hover ~ input:checked ~ label {
	/*background:url(images/star-active.png);
width: 21px;
    height: 20px;
background-repeat: no-repeat;*/
	
}
.rate-area > label:active {
	position: relative;
}