/* ===== TIMELINE ===== */

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

/* Pojedynczy wpis */
.timeline > li {
    display: grid;
    grid-template-columns: 18% 1fr;
    gap: 5%;
    position: relative;
    min-height: 80px;
    padding-bottom: 40px;
    margin-top: 20px;
}

/* ===== TIME ===== */

.timeline-time {
    position: sticky;
    top: 20px;
    align-self: start;
    background-color: #ffffff;
    text-align: right;
    font-weight: 600;
}

.timeline-time .date {
    display: block;
    font-size: 22px;
    line-height: 26px;
    color: #3c3c3c;
}

.timeline-time .time {
    display: block;
    font-size: 30px;
    line-height: 34px;
    color: #3c3c3c;
}
.timeline:before {
    content: '';
    position: absolute;
    top: -20px;
    bottom: 0px;
    width: 25%;
    background: #ffffff;
    left: -5%;
}



/* ===== BODY ===== */

.timeline-body {
    position: relative;
}

/* Header */
.timeline-header {
    padding-bottom: 10px;
    line-height: 30px;
}

.timeline-header .title {
    margin: 0;
    font-size: 30px;
    color: #ffffff;
    font-weight: 600;
}

/* Content */
.timeline-content {
    font-size: 20px;
    line-height: 24px;
    color: #ffffff;
}

/* Footer */
.timeline-footer {
    margin-top: 10px;
    /* border-top: 1px solid rgba(255,255,255,.2); */
}