.timelines {
    padding: 80px 0;
}

.timelines h6,
.timelines h1 {
    font-weight: 700;
    line-height: 1.2;
}

.timelines h6 {
    letter-spacing: .2em;
    font-size: 16px;
}

.timelines h1 {
    font-size: 54px;
}

.timelines .timeline-download {
    background-color: var(--color-cian);
    padding: 19px 39px;
    color: white;
    border-radius: 0;
    font-weight: 600;
    font-size: 18px;
    text-transform: uppercase;
}

.timelines .timeline-download:hover {
    color: white;
    opacity: 0.9;
    transition: 0.3s;
    box-shadow: none;
}

.timelines .timeline-btn {
    background-color: var(--color-blue);
    color: white;
    border: none;
    border-radius: 0;
    font-weight: 500;
    font-size: 18px;
    text-transform: uppercase;
    width: 380px;
    height: 95px;
    display: flex;
    justify-content: center;
    align-items: center;
    letter-spacing: 2px;
}

.timelines .timeline-btn-active {
    background-color: var(--color-cian);
}

.timelines .timeline-btn:hover,
.timelines .timeline-btn-active:hover {
    color: white;
    opacity: 0.9;
    transition: 0.3s;
}

.timelines .timeline-contents {
    background-image: url('/../../img/bg-parallax.webp');
    background-color: var(--color-blue);
    background-blend-mode: multiply;
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
    transition: background-position 0.3s ease-in-out;
    color: white;
}

.timelines .timeline-contents img {
    background-color: white;
}

.timelines .timeline-time {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .2em;
    text-transform: uppercase;
    line-height: 1.2;
    color: var(--color-gray-3);
}

.timelines .timeline-title {
    font-size: 28px;
    margin-top: 8px;
    transition: .3s ease-out all;
    text-transform: uppercase;
    line-height: 1.2;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.timelines .timeline-title i {
    font-size: 8px;
}

.timelines .timeline-subtitle {
    transition: .4s ease-out all;
    text-transform: uppercase;
    margin-top: 8px;
}

.timelines .timeline-info * {
    margin-top: 8px;
    color: var(--color-gray-5) !important;
}

.timelines .timeline-panelist-name {
    font-size: 18px;
    margin-top: 8px;
}



@media screen and (max-width: 768px) {
    h1 {
        font-size: 42px !important;
    }
}

/* min */
@media screen and (max-width: 576px) {
    /* none */

    .timelines .timeline-left {
        padding: 0 20px;
    }
}

@media screen and (min-width: 576px) {
    /* sm */

    .timelines .timeline-left {
        padding: 0 60px;
    }
}

@media screen and (min-width: 768px) {
    /* md */

    .timelines .timeline-left {
        padding: 0 80px;
    }
}

@media screen and (min-width: 992px) {
    /* lg */

    .timelines .timeline-left {
        padding: 0 100px;
    }
}

@media screen and (min-width: 1200px) {
    /* xl */

    .timelines .timeline-left {
        padding: 0 120px;
    }
}