.progressBarContainer {
    height: 20px;
    border-radius: 20px;
    background:   hsl(0, 0%, 98%);
}

.bar {
    border-radius: 20px;
    width: 0%;
    height: 100%;
    transition: width;
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(.36,.55,.63,.48);
}


.shadow {
    /* 25 50 */
    box-shadow: 0px 45px 50px rgba(0, 0, 0, 0.25); 
}

.red {
    background-color:  hsl(348, 100%, 61%);
}

.green {
    background-color:  hsl(141, 71%, 48%) ;
}

@media screen and (max-width: 500px) {
    .progress {
        width: calc(100vw * 0.7);
        /* height: calc(100vw * 0.7 * 0.145); */
        height: 40px;
        margin: 25px;
    }

}