.wcrr_rating_template_3 {
  display: flex;
  align-items: center;
  padding:10px;
  gap:30px;
  font-family: 'Segoe UI', sans-serif;

}
.wcrr_star_fill {
  position: absolute;
  z-index: 99;
  fill: #b22ca8;
}
.wcrr_star_fill_without {
    position: relative;
    top: 0px;
    left: 0px;
    fill: rgb(230, 230, 230);
}
.wcrr_rating_number {
    font-size: 14px;
    color: #000;
    font-weight: 500;
    height: 24px;
    margin-right:3px;
}
  .star_rating_point span {
      font-size: 18px !important;
      font-weight: 500;
      display: block;
      position: absolute;
      color:#000;
      
  }
.star_rating_point svg #circle_fill {
      stroke: #b22ca8;
      stroke-dasharray: 0, 284;
      stroke-dashoffset: 0;
}
.wcrr_rating_num {
  display: flex;
  width: 21px;
  align-items: center;
}
#div21 {
  height: 120px;
  width: 25px;
}

#div22 {
  height: 120px;
  width: 25px;
}

#div23 {
  height: 120px;
  width: 225px;
}

#div24 {
  height: 120px;
  width: 25px;
}

.div212 {
  margin-top: 8px;
  height: 13px;
  font-size: large;
  font-weight: 800;
}

.div213 {
  color: skyblue;
  margin-top: 9px;
  height: 12px;
  font-size: initial;
}

.div2131 {
  color: #ed7272;
  margin-top: 9px;
  height: 12px;
  font-size: initial;
}

.div2132 {
  color: #77e377;
  margin-top: 9px;
  height: 12px;
  font-size: initial;
}

.div231 {
  height: 15px;
  width: 60%;
  background-color: skyblue;
}

.div232 {
  height: 15px;
  width: 40%;
  background-color: skyblue;
}

.div233 {
  height: 15px;
  width: 10%;
  background-color: #ed7272;
}

.div234 {
  height: 15px;
  width: 10%;
  background-color: #77e377;
}

.div230 {
  height: 15px;
  width: 10%;
  background-color: skyblue;
}

.div214 {
  border: 1px solid gray;
  background-color: #e3dede;
  margin-top: 6px;
  height: 15px;
  width: 220px;
  font-size: large;
  font-weight: 800;
}

#icon12 {
  color: #b22ca8;
  font-size: larger;
  font-weight: 800;
}

#icon13 {
  color: #b8b4b4;
  font-size: larger;
  font-weight: 800;
}

#div111 {
  border: 3px solid #b22ca8;
  border-radius: 100%;
  height: 70px;
  width: 70px;
  margin-top: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

h1 {
  color: red;
  font-size: 20px;
}

.rating_wrapper {
  height: 120px;
  width: 500px;
  display: flex;
}

.rating_summary_wrapper {
  height: 120px;
  width: 200px;
}
.average_rating_wrapper {
  height: 50px;
  width: 200px;
  display: flex;
  justify-content: center;
}

.total_rating_reviews {
  height: 66px;
  width: 200px;
  display: flex;
  justify-content: center;
  font-size: medium;
  font-weight: 800;
}

.average_rating {
  margin-block-start: auto;
  font-size: larger;
  font-weight: 800;
}

.average_rating_icon {
  margin-block-start: auto;
  color: blue;
  font-size: larger;
  font-weight: 800;
}
.wcrr_rating_progressbar {
  display: flex;
  align-items: center;
  margin-bottom: 13px;
}
.background_progress_bar {
  margin-left: 10px;
}
.wcrr_rating_icon {
  fill: #b22ca8;
}

.fill_progress_bar {
  height: 10px;
  background-color: #b22ca8;
  border-radius: 15px;
}
.background_progress_bar {
  background-color: #B9B9B7;
  height: 10px;
  width: 310px;
  border-radius: 5px;
}
.total_rating_count {
    font-size: 14px;
    color: #000;
    font-weight: 500;
    height: 24px;
    margin-left:13px;
}
@media only screen and (max-width: 480px) {
.wcrr_rating_template_3{
  display: block;
}
}