@media (min-width: 768px) {
   .step-wizard-list {
       flex-direction: row; 
   }
   .step-wizard-item {
       min-width: 100px; 
   }
   .step-wizard-item+.step-wizard-item:after {
       content: "";
       position: absolute;
       left: 0;
       top: 19px; 
       background: #21d4fd;
       width: 100%;
       height: 2px;
       transform: translateX(-50%);
       z-index: -10;
   }
}

@media (max-width: 768px) {
   .step-wizard-list {
       flex-direction: column;
   }
   .step-wizard-item {
       min-width: auto; 
   }
   .step-wizard-item+.step-wizard-item:after {
       display: none; 
   }
}

/* @media (max-width: 768px) {
   .row.g-3 > div {
       flex-basis: 100%; 
   }
} */

.step-wizard-item.step-1 .progress-count:after {
   background: #FA994B;
   border: 2px solid #fff;
   color: #fff;
}

.step-wizard-item.step-2 .progress-count:after {
   background: #8699A8;
   border: 2px solid #fff;
   color: #fff;
}

.step-wizard-item.step-3 .progress-count:after {
   background: #F5C861;
   border: 2px solid #fff;
   color: #fff;
}

.step-wizard-item.step-4 .progress-count:after {
   background: #2496D2;
   border: 2px solid #fff;
   color: #fff;
}

.step-wizard-item.step-5 .progress-count:after {
   background: #3C9C30;
   border: 2px solid #fff;
   color: #fff;
}

.step-wizard {
   height: auto;
   justify-content: center;
   align-items: center;
   margin-top: 30px;
}

.step-wizard-list {
   background: #fff;
   box-shadow: 0 15px 25px rgba(0, 0, 0, 0.1);
   color: #333;
   list-style-type: none;
   border-radius: 10px;
   display: flex;
   padding: 0px 0px;
   position: relative;
   z-index: 10;
   margin: 0;
}


.step-wizard-item {
   padding: 0px 10px;
   flex-basis: 0;
   -webkit-box-flex: 1;
   -ms-flex-positive: 1;
   flex-grow: 1;
   max-width: 100%;
   display: flex;
   flex-direction: column;
   text-align: center;
   min-width: 100px;
   position: relative;
}

.progress-count {
   height: 40px;
   width: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   font-weight: 600;
   margin: 0 auto;
   position: relative;
   z-index: 10;
   color: transparent;
}

.progress-count:after {
   content: "";
   height: 40px;
   width: 40px;
   background: #21d4fd;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   border-radius: 50%;
   z-index: -10;
}

.progress-count:before {
   content: "";
   height: 10px;
   width: 20px;
   border-left: 3px solid #fff;
   border-bottom: 3px solid #fff;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -60%) rotate(-45deg);
   transform-origin: center center;
}

.progress-label {
   font-size: 14px;
   font-weight: 600;
   margin-top: 10px;
}

.current-item .progress-count:before,
.current-item~.step-wizard-item .progress-count:before {
   display: none;
}

.current-item~.step-wizard-item .progress-count:after {
   height: 10px;
   width: 10px;
}

.current-item~.step-wizard-item .progress-label {
   opacity: 0.5;
}

.current-item .progress-count:after {
   background: #fff;
   border: 2px solid #21d4fd;
}

.current-item .progress-count {
   color: #fff;
}

 /* Stars rating */
 .rating {
   display: inline-block;
   font-size: 24px;
}

.rating .fa-star {
   color: goldenrod;
   cursor: pointer;
}

.rating .fa-star:hover,
.rating .fa-star.active {
   color: gold;


}
