.quizz-user-results-ccf .quizz-result {
  font-family: 'CircularStd_Medium';
  text-transform: uppercase;
  margin-bottom: 20px;
}
.quizz-user-results-ccf .quizz-result h3 {
  margin-bottom: 5px;
  line-height: 20px;
  font-size: 11px;
  color: #000;
}
.quizz-user-results-ccf .quizz-result .user-result {
  border: solid 1px rgba(255, 255, 255, 0.2);
  background-color: rgba(36, 37, 41, 0.08);
  position: relative;
  border-radius: 4px;
  height: 20px;
  padding: 3px;
  /*width: 80%;*/
  width: 100%;
}
.quizz-user-results-ccf .quizz-result .user-result div:not(.percent) {
  background-color: #D8B97D;
  background-color: var(--Concacaf_gold);
  border-radius: 4px;
  height: 100%;
}
.quizz-user-results-ccf .quizz-result .user-result .percent {
  background-color: #242529;
  background-color: var(--Concacaf_dark_grey);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  position: absolute;
  border-radius: 4px;
  padding: 5px 10px;
  line-height: 20px;
  transition: 0.5s;
  font-size: 12px;
  color: #fff;
  top: -30px;
  z-index: 2;
  opacity: 0;
}
.quizz-user-results-ccf .quizz-result .user-result .percent::before {
  border-bottom: 7.5px solid transparent;
  border-right: 7.5px solid transparent;
  border-left: 7.5px solid transparent;
  border-top: 7.5px solid #242529;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  position: absolute;
  bottom: -13px;
  content: "";
  height: 0px;
  width: 0px;
  left: 50%;
}
.quizz-user-results-ccf .quizz-result .user-result:hover .percent {
  opacity: 1;
}
.quizz-user-results-ccf .quizz-result .avg-result {
  padding-left: 10px;
  text-align: right;
  width: 20%;
}
.quizz-user-results-ccf .quizz-result .avg-result div {
  line-height: 20px;
  font-size: 11px;
  color: #000;
}
.quizz-user-results-ccf .quizz-result .avg-result div span {
  color: #222B45;
  color: var(--Concacaf_black);
  font-family: 'CircularStd_Bold';
  line-height: 16px;
  font-size: 12px;
}
.quizz-user-results-ccf .total-percent {
  color: #222B45;
  color: var(--Concacaf_black);
  font-family: 'CircularStd_Bold';
  justify-content: space-between;
  line-height: 12px;
  font-size: 10px;
  display: flex;
  /*width: 80%;*/
  width: 100%;
}
/*MEDIA QUERIES*/
@media (max-width: 425.98px) {
  .quizz-user-results-ccf .quizz-result .user-result {
    width: 100%;
  }
  .quizz-user-results-ccf .quizz-result .avg-result {
    text-align: left;
    padding-left: 0;
    margin-top: 5px;
    width: 100%;
  }
  .quizz-user-results-ccf .total-percent {
    width: 100%;
  }
}