.teahouse_opening_heading {
    font-size: 46px;
    text-transform: uppercase;
    color: var(--black);
    margin: 120px 0 20px;
    text-align: center;
}

.about:first-of-type {
    margin-top: 70px;
}

.about:nth-of-type(2) {
    z-index: 10;
    margin-top: 0px;
    margin-bottom: 140px;
}

.about:nth-of-type(2) .column:last-of-type {
    margin-top: 100px;
}

.leaf_to_cup {
    width: 80%;
    margin: 80px auto 0;
}

.about .column {
    position: relative;
}

.pathline {
    position: absolute;
    width: 700px;
    height: 400px;
    left: 100px;
    bottom: 0;
    clip-path: inset(50px 0 0 0);
    transform: translateY(230px);
    z-index: 10;
}

.pathline svg {
    transform: translateY(-50px);
}

.history_heading {
    width: 230px;
    height: auto;
    margin: 140px auto 40px;
}

.timeline {
    margin-bottom: 140px;
}

.timeline_image {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.timeline_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    opacity: 1;
}

.timeline .desktop {
    display: flex;
}

.timeline .shortened,
.timeline .tablet,
.timeline .mobile {
    display: none;
}

@media (max-width: 1450px) {
    .pathline {
        left: 80px;
        width: 600px;
        height: 350px;
        clip-path: inset(20px 0 0 0);
        transform: translateY(230px);
    }

    .pathline svg {
        transform: translateY(-50px);
    }
}

@media (max-width: 1250px) {
    .timeline .shortened {
        display: flex;
    }

    .timeline .desktop,
    .timeline .tablet,
    .timeline .mobile {
        display: none;
    }
}

@media (max-width: 990px) {
    .timeline .tablet {
        display: flex;
    }

    .timeline .desktop,
    .timeline .shortened,
    .timeline .mobile,
    .pathline {
        display: none;
    }

    .about:first-of-type {
        margin-top: 20px;
    }

    .about_image {
        margin: 100px auto 0;
    }

    .about:nth-of-type(2) {
        margin-bottom: 90px;
    }

    .about:nth-of-type(2) .column:first-of-type .about_image {
        margin: 20px auto;
        width: 80%;
    }

    .history_heading {
        margin: 110px auto 40px;
    }
}

@media (max-width: 600px) {
    .timeline .mobile {
        display: flex;
    }

    .timeline .desktop,
    .timeline .shortened,
    .timeline .tablet {
        display: none;
    }
}