/*
***********************
RATING VOTO
***********************
*/
.rating-wrap {
margin-top: 17px;
margin-bottom: 40px;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
align-items: center;
border-top: 6px solid #F2F2F2;
border-bottom: 6px solid #F2F2F2;
padding: 20px 30px;
}
.rating-wrap .rating-title {
font-size: 24px;
font-weight: 400;
margin: 0;
}
.rating-wrap .rating-wrap-stars {
margin-left: auto;
top: 10px;
position: relative;
}
.rating-wrap .rating-wrap-stars ul.rating-stars {
padding: 0;
list-style-type: none;
}
.rating-wrap .rating-wrap-stars .rating-star {
width: 20px;
height: 20px;
position: relative;
list-style: none;
display: inline-block;
}
.rating-wrap .rating-wrap-stars .rating-star:before {
/* content: url('../images/star_empty.svg'); */
content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,');
}
.rating-wrap .rating-wrap-stars .rating-star.hover:before {
cursor: pointer;
background-image: url('data:image/svg+xml,');
}
/*
***********************
RATING BLOCK
***********************
*/
.rating {
display: flex;
justify-content: space-between;
}
.rating span {
width: 20px;
height: 20px;
display: inline-block;
position: relative;
}
.rating span::before, .rating span::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-repeat: no-repeat;
}
.rating span::before {
background-image: url('data:image/svg+xml,');
}
.rating span::after {
background-image: url('data:image/svg+xml,');
}
.rating[data-score="0"] span::after {
display: none;
}
.rating[data-score="1"] span:nth-child(2)::after, .rating[data-score="1"] span:nth-child(3)::after, .rating[data-score="1"] span:nth-child(4)::after, .rating[data-score="1"] span:nth-child(5)::after {
display: none;
}
.rating[data-score="2"] span:nth-child(3)::after, .rating[data-score="2"] span:nth-child(4)::after, .rating[data-score="2"] span:nth-child(5)::after {
display: none;
}
.rating[data-score="3"] span:nth-child(4)::after, .rating[data-score="3"] span:nth-child(5)::after {
display: none;
}
.rating[data-score="4"] span:nth-child(5)::after {
display: none;
}