.dbsScoringResponse {
	min-height: 45px ;
	max-width: 450px ;
	text-align: right ;
	display: inline-flex ;
    flex-direction: row-reverse ; 
    font-size: 1.75em ;
}
.dbsScoringResponse > input {
    display: none ;
} 

.dbsScoringResponse > label:before { 
    font-size: 1em ;
    margin: 5px ;
    font-family: FontAwesome ;
    display: inline-block ;
    content: "\f111" ; 
}

.dbsScoringResponse > label { 
    float: right ;
	  color: transparent ;
   -webkit-text-stroke-width: 2px ;
   -webkit-text-stroke-color: var(--dbsBlack) ; 
}
  
/***** CSS Magic to Highlight Stars on Hover *****/

.dbsScoringResponse > input:checked ~ label {
    color: black ;
} /* hover previous stars in list */

.dbsScoringResponse > input:checked + label:hover, /* hover current star when changing rating */
.dbsScoringResponse > input:checked ~ label:hover,
.dbsScoringResponse > label:hover ~ input:checked ~ label, /* lighten current selection */
.dbsGridbsScoringResponsedResponse > input:checked ~ label:hover ~ label, /* show gold star when clicked */
.dbsScoringResponse:not(:checked) > label:hover, /* hover current star */
.dbsScoringResponse:not(:checked) > label:hover ~ label {
    color: grey ;
}

