.progress-container {
    position: relative;
    margin-top: 0 !important;
}

.circular-progress {
    transform: rotate(-90deg); /* Rotate to start the progress at the top */
}

.progress-bg {
    fill: none;
    stroke-width: 10;
}

.progress-bar {
    fill: none;
    stroke: green; /* Color of the progress bar */
    stroke-width: 0;
    stroke-dasharray: 282; /* Circumference of the circle */
    stroke-dashoffset: 282; /* Start fully hidden */
    transition: stroke-dashoffset 0.3s linear; /* Animate over 5 seconds */
}

.picon {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 50px; /* Match the size of your icon */
    color: #3498db; /* Icon color */
    margin-top: 0 !important;
    transition: all 100ms linear;
    border-radius: 20%;
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);
}