.timeline {
    width: 100%
}

.timeline.timeline-one .timeline-item {
    position: relative;
    width: 50%;
    margin-left: 50%;
    padding-bottom: 2.75rem;
    padding-left: 2.75rem;
    text-align: left
}

@media (max-width: 767.98px) {
    .timeline.timeline-one .timeline-item {
        width:100%;
        margin-left: 0
    }
}

.timeline.timeline-one .timeline-item img {
    margin-bottom: 1.25rem
}

.timeline.timeline-one .timeline-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 14px;
    height: 14px;
    margin-left: -7px;
    background-color: #e6e7ee;
    border: .0625rem solid #D1D9E6;
    box-shadow: inset 1px 2px 1px #d2d2d2,inset -3px -3px 7px #eff0f5;
    border-radius: .55rem
}

.timeline.timeline-one .timeline-item:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 18px;
    width: 6px;
    margin-top: 1.875rem;
    margin-left: -3px;
    border: .0625rem solid #D1D9E6;
    box-shadow: inset 1px 2px 1px #d2d2d2,inset -3px -3px 7px #eff0f5;
    border-radius: .55rem
}

.timeline.timeline-one .timeline-item:nth-child(2n+1) {
    margin-left: 0;
    padding-right: 2.75rem;
    padding-left: 0;
    text-align: right
}

@media (max-width: 767.98px) {
    .timeline.timeline-one .timeline-item:nth-child(2n+1) {
        padding-right:0;
        padding-left: 2.75rem;
        text-align: left
    }
}

.timeline.timeline-one .timeline-item:nth-child(2n+1):before,.timeline.timeline-one .timeline-item:nth-child(2n+1):after {
    right: 0;
    left: auto
}

@media (max-width: 767.98px) {
    .timeline.timeline-one .timeline-item:nth-child(2n+1):before,.timeline.timeline-one .timeline-item:nth-child(2n+1):after {
        right:auto;
        left: 0
    }
}

.timeline.timeline-one .timeline-item:nth-child(2n+1):before {
    margin-right: -7px
}

.timeline.timeline-one .timeline-item:nth-child(2n+1):after {
    margin-right: -3px
}

.timeline.timeline-two .row .timeline-separator {
    width: 15px;
    height: 15px;
    margin: 0 -4px 0 0;
    border: .0625rem solid #D1D9E6
}

.timeline.timeline-two .row .col.middle-line:after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 6px;
    margin-top: 1.875rem;
    margin-left: -3px;
    border: .0625rem solid #D1D9E6;
    box-shadow: inset 1px 2px 1px #d2d2d2,inset -3px -3px 7px #eff0f5;
    border-radius: .55rem
}

.timeline.timeline-two .card .card-body .post-meta span {
    padding-right: .25rem
}

.timeline.timeline-three .row .col.middle-line:after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 6px;
    margin-top: 1.875rem;
    margin-left: -3px;
    border: .0625rem solid #D1D9E6;
    box-shadow: inset 1px 2px 1px #d2d2d2,inset -3px -3px 7px #eff0f5;
    border-radius: .55rem
}