.skills-bar .bar{
    margin: 1.2rem 0;
}

.skills-bar .bar:first-child{
    margin-top: 0;
}

.skills-bar .bar .bar-info span{
    font-size: larger;
}

.skills-bar .bar .progress-line{
    position: relative;
    height: 0.75rem;
    width: 100%;
    background-color: #fff;
    border-radius: 0.375rem;
}

.filled-line{
    height: 100%;
    width: 80%;
    background-color: #682ae9;
    position: absolute;
    border-radius: 0.375rem;

    transform: scaleX(0);
    transform-origin: left;
}

@keyframes bar-fill {
    100%{
        transform: scaleX(1);
    }
}

.progress-line-animation{
    animation: bar-fill 1.5s cubic-bezier(1,0,0.5,1) forwards;
}