.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-4 {

    --bsb-tl-color: var(--bs-primary-bg-subtle);

    --bsb-tl-circle-color: var(--bs-light);

    --bsb-tl-circle-border-color: var(--bs-primary);

    --bsb-tl-circle-size: 16px;

    --bsb-tl-circle-border-size: 2px;

    --bsb-tl-circle-offset: 8px;

    --bsb-tl-indicator-color: var(--bs-white)

}



.bsb-timeline-4 .timeline {

    list-style: none;

    margin: 0;

    padding: 0;

    position: relative

}



.bsb-timeline-4 .timeline:after {

    background-color: var(--bsb-tl-color);

    bottom: 0;

    content: "";

    left: 0;

    margin-left: -1px;

    position: absolute;

    top: 0;

    width: 2px

}



@media(min-width:768px) {

    .bsb-timeline-4 .timeline:after {

        left: 50%

    }

}



.bsb-timeline-4 .timeline>.timeline-item {

    margin: 0;

    padding: 0;

    position: relative

}



.bsb-timeline-4 .timeline>.timeline-item:after {

    background: #79B7E4;

    border: var(--bsb-tl-circle-border-size) solid #79B7E4;

    border-radius: 50%;

    content: "";

    height: var(--bsb-tl-circle-size);

    left: calc(var(--bsb-tl-circle-offset)*-1);

    position: absolute;

    top: calc(50% - var(--bsb-tl-circle-offset));

    width: var(--bsb-tl-circle-size);

    z-index: 1

}



.bsb-timeline-4 .timeline>.timeline-item .timeline-body {

    margin: 0;

    padding: 0;

    position: relative

}



.bsb-timeline-4 .timeline>.timeline-item .timeline-meta {

    padding: 2.5rem 0 1rem 2.5rem

}



.bsb-timeline-4 .timeline>.timeline-item .timeline-content {

    padding: 0 0 2.5rem 2.5rem;

    position: relative

}



@media(min-width:768px) {

    .bsb-timeline-4 .timeline>.timeline-item {

        width: 50%

    }



    .bsb-timeline-4 .timeline>.timeline-item .timeline-meta {

        margin-bottom: 0;

        position: absolute;

        top: calc(50% - 17px);

        width: 100%;

        z-index: 1

    }



    .bsb-timeline-4 .timeline>.timeline-item .timeline-content {

        padding: 2.5rem

    }



    .bsb-timeline-4 .timeline>.timeline-item .timeline-indicator {

        position: relative

    }



    .bsb-timeline-4 .timeline>.timeline-item .timeline-indicator:after {

        border-width: 1px;

        border: 10px solid var(--bsb-tl-indicator-color);

        border-color: transparent var(--bsb-tl-indicator-color) transparent transparent;

        border-left-width: 0;

        content: "";

        left: calc(2.5rem - 10px);

        position: absolute;

        top: calc(50% - var(--bsb-tl-circle-offset));

        z-index: 2

    }



    .bsb-timeline-4 .timeline>.timeline-item.left {

        left: 0

    }



    .bsb-timeline-4 .timeline>.timeline-item.left:after {

        left: auto;

        right: calc(var(--bsb-tl-circle-offset)*-1)

    }



    .bsb-timeline-4 .timeline>.timeline-item.left .timeline-meta {

        padding: 0 0 0 2.5rem;

        right: -100%

    }



    .bsb-timeline-4 .timeline>.timeline-item.left .timeline-indicator:after {

        border-width: 1px;

        border: 10px solid var(--bsb-tl-indicator-color);

        border-color: transparent transparent transparent var(--bsb-tl-indicator-color);

        border-right-width: 0;

        left: auto;

        right: calc(2.5rem - 10px)

    }



    .bsb-timeline-4 .timeline>.timeline-item.right {

        left: 50%

    }



    .bsb-timeline-4 .timeline>.timeline-item.right .timeline-meta {

        display: flex;

        justify-content: flex-end;

        left: -110%;

        padding: 0 2.5rem 0 0

    }

}