.d-none{
    display: none !important;
}
.d-block{
    display: block;
}
.circle-wrap h3{
    color: #7a6dde;
    font-size: 25px;
}
.circle-wrap {
    float: left;
    margin: 2rem;
    width: 150px;
    height: 150px;
    background: #ddc7b9;
    border-radius: 50%;
    margin-top: 10rem;
}

.circle-wrap .circle .mask,
.circle-wrap .circle .fill {
    width: 150px;
    height: 150px;
    position: absolute;
    border-radius: 50%;
}

.circle-wrap .circle .mask {
    clip: rect(0px, 150px, 150px, 74px);
}

.circle-wrap .circle .mask .fill {
    clip: rect(0px, 75px, 150px, 0px);
    background-color: #F3275A;
}

.circle-wrap.firstPercentage .circle .mask.full,
.circle-wrap.firstPercentage .circle .fill {
    animation: firstPercentage ease-in-out 3s forwards;
}

.circle-wrap.secondPercentage .circle .mask.full,
.circle-wrap.secondPercentage .circle .fill {
    animation: secondPercentage ease-in-out 3s forwards;
}

.circle-wrap.thirdPercentage .circle .mask.full,
.circle-wrap.thirdPercentage .circle .fill {
    animation: thirdPercentage ease-in-out 3s forwards;
}

.circle-wrap .inside-circle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: #121212;
    margin-top: 5px;
    margin-left: 5px;
    z-index: 1;
    font-weight: 700;
    font-size: 2em;
    text-align: center;
}

@keyframes firstPercentage {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(160deg);
    }
}

@keyframes secondPercentage {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(173deg);
    }
}

@keyframes thirdPercentage {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(180deg);
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.progress-bar-counter{
    width: 100%;
}
.progress-bar-container{
    background: linear-gradient(#ffffff, #ffffff) padding-box, linear-gradient(90deg, #c43e6a,#63bfc7) border-box;
    border-radius: 50em;
    border: 2px solid transparent;
}
.progress-bar-body{
    background: linear-gradient(90deg,#7e80b6,#c53d69 0,#60c2ca);
    border-radius: 50em;
}
.landing_page{
    display: flex;
    flex-direction: column;
    max-width: 570px;
    width: 100%;
    height: 100%;
}