/*Star method one*/

/*.container{
    margin: 20px auto;
   
}

input[type="checkbox"]{
	width:100%;
	height:100%;
	opacity:0;
	cursor:pointer;	
}
label{
	position:relative;
	width: 15px;
    height: 15px;
    display: inline-block;	
}
.check::before, .rated::after{
	content:'\2605';
	font-size:25px;
	position:absolute;
	color:#777;
	left:0;
	bottom:0;
    line-height: 50px;	
}
.rated::after{
	color:orange;
}*/



/*Star method two*/

.rating {
  display: flex;
  align-items: center;
  font-size: 1rem;
  margin-bottom: 0.5rem;
  clear:both
}

.rating__stars {
  display: inline;
}

.rating__score {
  padding-right: 0.75rem;
}

.stars-outer {
  display: inline-block;
  position: relative;
  font-family: FontAwesome;
}

.stars-outer::before {
  content: "\2605 \2605 \2605 \2605 \2605";
  color: #808080;
}

.stars-inner {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  overflow: hidden;
  width: 0;
}

.stars-inner::before {
  content: "\2605 \2605 \2605 \2605 \2605";
  color:orange;
}