.py-8 {
    padding-bottom: 4.5rem !important;
    padding-top: 4.5rem !important
}

@media (min-width: 576px) {
    .py-sm-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media (min-width: 768px) {
    .py-md-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media (min-width: 992px) {
    .py-lg-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media (min-width: 1200px) {
    .py-xl-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

@media (min-width: 1400px) {
    .py-xxl-8 {
        padding-bottom: 4.5rem !important;
        padding-top: 4.5rem !important
    }
}

.bsb-timeline-2 {
    --bsb-tl-color: rgb(75,75,75);
    --bsb-tl-circle-color: var(--bs-primary);
    --bsb-tl-circle-color-done: var(--bs-success);
    --bsb-tl-circle-color-todo: gray;
    --bsb-tl-circle-size: 32px;
    --bsb-tl-circle-offset: 16px
}

.bsb-timeline-2 .timeline {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative
}

.bsb-timeline-2 .timeline:after {
    background-color: var(--bsb-tl-color);
    bottom: 0;
    content: "";
    left: 0;
    margin-left: -1px;
    position: absolute;
    top: 0;
    width: 2px
}

.bsb-timeline-2 .timeline > .timeline-item {
    margin: 0;
    padding: 0;
    position: relative
}

.bsb-timeline-2 .timeline > .timeline-item .timeline-icon {
    align-items: center;
    background-color: var(--bsb-tl-circle-color);
    border-radius: 50%;
    display: flex;
    height: var(--bsb-tl-circle-size);
    justify-content: center;
    left: calc(var(--bsb-tl-circle-offset) * -1);
    position: absolute;
    top: 0;
    width: var(--bsb-tl-circle-size);
    z-index: 1
}


.bsb-timeline-2 .timeline > .timeline-item .timeline-icon:has(.bi-check-lg), .bsb-timeline-2 .timeline > .timeline-item .timeline-icon.done {
    background-color: var(--bsb-tl-circle-color-done);
}
.bsb-timeline-2 .timeline > .timeline-item .timeline-icon:has(.bi-circle), .bsb-timeline-2 .timeline > .timeline-item .timeline-icon.todo {
    background-color: var(--bsb-tl-circle-color-todo);
}

.bsb-timeline-2 .timeline > .timeline-item .timeline-content {
    margin: 0 0 2.5rem 2.5rem;
    padding: 0.6rem 1rem 1rem;
    position: relative;
}

@media (min-width: 768px) {
    .bsb-timeline-2 .timeline > .timeline-item .timeline-content {
        margin: 3rem
    }
}



/*.timeline {*/
/*    position: relative;*/
/*    padding: 21px 0px 10px;*/
/*    margin-top: 4px;*/
/*    margin-bottom: 30px;*/

/*    margin-right: 30px;*/
/*}*/

/*.timeline .line {*/
/*    position: absolute;*/
/*    width: 4px;*/
/*    display: block;*/
/*    background: currentColor;*/
/*    top: 0px;*/
/*    bottom: 0px;*/
/*    margin-left: 30px;*/
/*}*/

/*.timeline .separator {*/
/*    border-top: 1px solid grey;*/
/*    padding: 5px;*/
/*    padding-left: 40px;*/
/*    font-style: italic;*/
/*    font-size: .9em;*/
/*    margin-left: 30px;*/
/*}*/

/*.timeline .line::before { top: -4px; }*/
/*.timeline .line::after { bottom: -4px; }*/
/*.timeline .line::before,*/
/*.timeline .line::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    left: -4px;*/
/*    width: 12px;*/
/*    height: 12px;*/
/*    display: block;*/
/*    border-radius: 50%;*/
/*    background: currentColor;*/
/*}*/

/*.timeline .panel {*/
/*    position: relative;*/
/*    margin: 10px 0px 21px 70px;*/
/*    clear: both;*/
/*}*/

/*.timeline .panel::before {*/
/*    position: absolute;*/
/*    display: block;*/
/*    top: 8px;*/
/*    left: -24px;*/
/*    content: '';*/
/*    width: 0px;*/
/*    height: 0px;*/
/*    border: inherit;*/
/*    border-width: 12px;*/
/*    border-top-color: transparent;*/
/*    border-bottom-color: transparent;*/
/*    border-left-color: transparent;*/
/*}*/

/*.timeline .panel .panel-heading.icon * { font-size: 20px; vertical-align: middle; line-height: 40px; }*/
/*.timeline .panel .panel-heading.icon {*/
/*    position: absolute;*/
/*    left: -59px;*/
/*    display: block;*/
/*    width: 40px;*/
/*    height: 40px;*/
/*    padding: 0px;*/
/*    border-radius: 50%;*/
/*    text-align: center;*/
/*    float: left;*/
/*}*/

/*.timeline .panel-outline {*/
/*    border-color: transparent;*/
/*    background: transparent;*/
/*    box-shadow: none;*/
/*}*/

/*.timeline .panel-outline .panel-body {*/
/*    padding: 10px 0px;*/
/*}*/

/*.timeline .panel-outline .panel-heading:not(.icon),*/
/*.timeline .panel-outline .panel-footer {*/
/*    display: none;*/
/*}*/

