#progress-background {
    --gray-inactive: var(--company_grey_light);
    background-color: white;
    padding-top: 2rem;
    padding-bottom: 2rem;
    min-width: 100%
}

#progress-background a{
    transition: unset;
    border-bottom: none;
}

.container-fluid {
    margin: 0 auto 0 auto !important;
}

.content-module {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.element {
    width: auto;
    align-content: center;
}

.circle-img {
    font-size: 0.9rem;
    color: var(--gray-inactive);
}

/*ELEMENTS USED FOR STEP DIV INACTIVE*/
.circle-wrapper {
    height: 2rem;
    width: 2rem;
    border: 1px solid var(--gray-inactive);
    box-sizing: border-box;
    background-color: white;
    border-radius: 50%;
}

.line {
    box-sizing: border-box;
    height: 1px;
    width: 3rem;
    border: 1px solid var(--gray-inactive);
}

.text {
    color: var(--gray-inactive)
}

/*ELEMENTS USED FOR STEP DIV IN ACTIVE STATE*/
.circle-wrapper.active {
    background-color: var(--company_color);
    border: 1px solid var(--company_color);

}

.line.active, .line.seen {
    border: 1px solid var(--company_color);
}

.text.active {
    color: var(--company_color)
}

.circle-img.active {
    color: var(--company_text_secondary);
}

/*ELEMENTS USED FOR STEP DIV IN SEEN STATE*/
.circle-wrapper.seen {
    border: 1px solid var(--company_color_light_2);
    background-color: white;
}

.line.seen {
    border: 1px solid var(--company_color_light_2);
}

.text.seen {
    color: var(--company_color_light_2)
}

.circle-img.seen {
    color: var(--company_color_light_2)
}

.vertical-line {
    display: none;
}

#progress-background {
    display: none;
}

@media (min-width: 751px) {
    #progress-background {
        display: inline-flex;
    }
}

@media (max-width: 750px) {
    .line {
        display: none;
    }

    #progress-background > div > div {
        flex-direction: column;
    }

    .vertical-line {
        display: block;
        height: 1rem;
        border-left: 1px solid var(--gray-inactive);
        margin-top: .5rem;
        margin-bottom: .5rem;
    }

    .vertical-line.active, .vertical-line.seen {
        border-left-color: var(--company_color);
    }
}
