.timeline-object {
    margin: 2rem 0;
    height: 180px;
    border: solid 1px #f1c385;
    background-color: #343a40;
    position: relative;
}

.timeline-object .timeline-items {
    height: 100%;
    position: relative;
    width: 95%;
    left: 50%;
    transform: translate(-50%);
}

.timeline-object .timeline-items .item {
    position: absolute;
    bottom: 35%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px solid #f1c385;
    transform: translate(-50%);
}

.timeline-object .timeline-lines-container {
    width: 95%;
    height: 35%;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
    display: flex;
    justify-content: space-between;
}

.timeline-object .timeline-lines-container .timeline-line {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 0;
    font-size: 13px;
}

.timeline-line.small-line::before {
    font-size: 13px !important;
    margin-top: 2px;
}

.timeline-object .timeline-lines-container .timeline-line::before {
    content: "|";
    font-size: 16px;
}

@media screen and (max-width: 575px) {
    .timeline-object {
        overflow: scroll;
    }

    .timeline-object .timeline-items,
    .timeline-object .timeline-lines-container {
        transform: none;
        width: 300%;
        left: 5%;
    }
}