/* ======= Реётинг 5 звёзд ====== */
.div_for_ratingHolder {
	display: block;
	text-align: center;
	margin: 20px 0px;
}
.ratingHolder {
    display: inline-block;
    width: 210px;
    position: relative;
    margin: 0px auto;
}
.ratingHolder .userRatingHolder {
    opacity: 0;
    transition: .1s;
}
.ratingHolder:hover .userRatingHolder, .ratingHolder.voted .userRatingHolder {opacity: 1; transition: .1s;}
.ratingHolder .userRating {
     position: absolute; top: -10px; left: 0;
     padding: 10px 16px;
     cursor: pointer;
     z-index: 12;
     background-color: #ffffff;
     border-radius: 5px;
     width: 180px; height: 31px;
}
.ratingHolder.voted .userRating {background-color: #598a86;}
.ratingHolder .passiveRatingHolder {
    position: relative;
    width: 178px;
    height: 37px;
    /* left: 50%; */
    margin-left: 16px;
    display: block;
    /* padding: 10px 16px; */
}
.ratingHolder .passiveRatingHolder > div {
    position:absolute; left: 0; top: 0;
    height: 37px;
    background-image: url("/star_rating/stars.svg");
    background-repeat: no-repeat;
    background-size: 178px;
}
.ratingHolder .passiveRatingHolder .ratingBg {background-position: 0 0; width: 178px; z-index: 1;}
.ratingHolder .passiveRatingHolder .ratingMask {background-position: 0 -41px; z-index: 10;}
.ratingHolder .vote {
    transition: .2s;
    position: absolute; top: 0;
    cursor: pointer;
    z-index: 99;
    width: 32px; height: 31px;
    background-image: url("/star_rating/stars.svg");
    background-repeat: no-repeat; background-position: 0 0; background-size: 178px;
}
.ratingHolder .vote:hover ~ .vote, .vote.active ~ .vote {transition: .2s; background-position: 0 -41px;}
.ratingHolder .vote:hover, .ratingHolder.voted .vote.active {transition: .2s; background-position: 0 -81px;}
.ratingHolder .votingHolder {direction: rtl; position: relative}
.ratingHolder .vote.onestar {left: 80%;}
.ratingHolder .vote.twostar {left: 60%;}
.ratingHolder .vote.threestar {left: 40%;}
.ratingHolder .vote.fourstar {left: 20%;}
.ratingHolder .vote.fivestar {left: 0;}
.ratingHolder.voted .vote {pointer-events:none;}
.ratingHolder.voted .vote:hover {background-position: 0 0;}
.ratingHolder.voted .vote.active ~ .vote {background-position: 0 -41px;}
.ratingHolder.voted .vote.active:hover {background-position: 0 -81px;}
.ratingHolder .rateNumbers {text-align: center; width: 100%; color: #a1a1a1;font-size: 14px;}
.ratingHolder .rateNumbers .ratingvalue {color: #2d2d2d; font-size: 26px;}
.ratingHolder .rateNumbers .bestrating {margin-bottom: 4px; display: inline-block; font-size: 20px;}
.ratingHolder .text {
    color: #4f8d88; 
    text-align: center; 
	margin: 8px 0px; 
	opacity: 1; 
	transition: .1s;
    line-height: 18px; 
	/*height: 0px;*/
}
.ratingHolder.voted .text {opacity: 1; margin: 10px 0 0 0; transition: .1s; height: auto;}



/* ======= Реётинг 5 звёзд ====== */







/* ===== mini_rating 5 strars =====*/
.div_for_mini_ratingHolder {
    display: block;
    text-align: center;
    margin: 10px 5px;
    clear: both;
}
.mini_passiveRatingHolder {
    display: inline-block;
    position: relative;
    width: 120px; 
    height: 22px;
}
.mini_passiveRatingHolder > div {
    position:absolute; 
        left: 0; 
        top: 0;
    height: 22px;
    background-image: url("/star_rating/stars.svg");
    background-repeat: no-repeat;
    background-size: 120px;
}
.mini_ratingBg {
    background-position: 0 0; 
    width: 120px; 
    z-index: 1;
}
.mini_ratingMask{
    background-position: 0 -79px; z-index: 99;
}
/* ===== mini_rating 5 strars =====*/