/*  First Example with big stars */
.rate-ex1-cnt{
	width:230px; 
    height: 40px;
	/* border:#e9e9e9 1px solid;
	background-color:  #f6f6f6; */
}
.rate-ex1-cnt .rate-btn{
	width: 45px; 
    height:40px;
	float: left;
	background: var(--wpr-bg-eb004f34-c949-43b8-9ec5-5aaf47ff0d2d) no-repeat;
	cursor: pointer;
}
.rate-ex1-cnt .rate-btn:hover, .rate-ex1-cnt  .rate-btn-hover, .rate-ex1-cnt  .rate-btn-active{
	background: var(--wpr-bg-9360d67e-7fb3-441e-8e8e-109e6c605578) no-repeat;
}
/* End first Example with big stars */


/*  Second Example with big stars */
.rate-ex2-cnt{
	width: 160px;
    height: 30px;
    /* border: #e9e9e9 1px solid; */
    /* background-color: #f6f6f6; */
}
.rate-ex2-cnt .rate-btn{
	width: 30px; height:30px;
	float: left;
	background: var(--wpr-bg-18ea0c0a-0541-4af1-8e02-392befc30113) no-repeat;
	cursor: pointer;
}
.rate-ex2-cnt .rate-btn:hover, .rate-ex2-cnt  .rate-btn-hover, .rate-ex2-cnt  .rate-btn-active{
	background: var(--wpr-bg-c12bf202-5be7-4893-a564-9c077dfbbe5e) no-repeat;
}
/* End second Example with big stars */

/*  Third Example with big stars */
.rate-ex3-cnt{
	width:90px; 
    height: 17px;
	/* border:#e9e9e9 1px solid;
	background-color:  #f6f6f6; */
}
.rate-ex3-cnt .rate-btn{
	width: 17px; height:17px;
	float: left;
	background: var(--wpr-bg-dfee6404-d9ca-4998-a96f-4a7c58893b88) no-repeat;
	cursor: pointer;
}
.rate-ex3-cnt .rate-btn:hover, .rate-ex3-cnt  .rate-btn-hover, .rate-ex3-cnt  .rate-btn-active{
	background: var(--wpr-bg-5b5531a2-2a5b-4b51-bba1-861714eb13ab) no-repeat;
}
/* End third Example with big stars */


/* rate result */
.rate-result-cnt{
	width: 82px; height: 18px;
	position: relative;
	background-color: #ccc;
	border: #ccc 1px solid;
}
.rate-stars{
	width: 82px; height: 18px;
	background: var(--wpr-bg-1548d6e8-2ddf-4c7e-a0bd-8c51d7f7ccdd) no-repeat;
	position: absolute;
}
.rate-bg{
	height: 18px;
	background-color: #ffbe10;
	position: absolute;
}