@import"block-party.css";

.party-page {
    color: #fff;

}
.party-page  {
    padding-top: 85px;
}
@media (min-width: 900px) {
    .party-page {
        padding-top: 185px;
    }
}
.party-page img {
    display: block;
    max-width: 100%;
    margin: 0 auto
}

.party-page .title-1 {
    height: fit-content;
    font-size: clamp(40px, 10vw, 120px);
    font-weight: 600;
    letter-spacing: .2em;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    z-index: 2;
    margin-bottom: clamp(40px, 7vw, 88px)
}

.party-page .items {
    border-top: 1px solid #fff
}

.party-page .item {
    display: grid;
    grid-template-columns: 130px 1fr 335px;
    grid-column-gap: clamp(10px, 3vw, 58px);
    grid-row-gap: 10px;
    padding: 27px 0;
    border-bottom: 1px solid #fff
}

.party-page .item .data,
.party-page .item .time,
.party-page .item .text {
    grid-column: 1
}

.party-page .item .data {
    font-weight: 600;
    font-size: clamp(14px, 1.9vw, 35px)
}

.party-page .item .time {
    font-size: clamp(14px, 1.2vw, 16px)
}

.party-page .item .text {
    line-height: 1.45;
    opacity: .7;
    margin-top: -20px
}

.party-page .item .img {
    grid-column: 3;
    grid-row: 1/4;
    height: 100%;
    display: flex;
    align-items: center
}

.party-title,
.party-text-1,
.party-text-2 {
    grid-column: 2
}

.party-title {
    grid-row: 1;
    font-family: var(--font-2);
    font-weight: 600;
    font-size: clamp(18px, 2.9vw, 35px);
    line-height: 1.26;
    color: var(--color-2)
}

.party-text-1 {
    grid-row: 2;
    font-weight: 500;
    font-size: clamp(14px, 1.4vw, 18px)
}

.party-text-1 p {
    margin-bottom: 2px
}

.party-text-2 {
    grid-row: 4;
    font-weight: 500;
    line-height: 1.45;
    opacity: .7;
    margin: auto 0 0 0
}

.party-text-2 p {
    margin-bottom: 2px
}

.party-text-2 p:last-child {
    margin-bottom: 0
}

@media(max-width: 900px) {
    .party-page .item {
        grid-template-columns: 53% auto 1fr
    }

    .party-page .item .img {
        grid-column: 1;
        grid-row: 1/6;
        margin-right: 15px
    }

    .party-page .item .img img {
        width: 100%
    }

    .party-page .item .text {
        grid-column: 2/-1;
        grid-row: 5;
        margin-top: 0
    }

    .party-page .item .data,
    .party-page .item .time {
        grid-row: 2
    }

    .party-page .item .data {
        grid-column: 2
    }

    .party-page .item .time {
        grid-column: 3
    }

    .party-title,
    .party-text-1,
    .party-text-2 {
        grid-column: 2/-1
    }

    .party-title {
        grid-row: 1
    }

    .party-text-1 {
        grid-row: 3
    }

    .party-text-2 {
        grid-row: 4
    }
}

@media(max-width: 600px) {
    .party-page .item {
        grid-template-columns: auto 1fr;
        padding-top: 36px
    }

    .party-page .item .img {
        grid-column: 1/-1;
        grid-row: 1;
        height: auto;
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px
    }

    .party-page .item .text {
        grid-column: 1/-1;
        grid-row: 6
    }

    .party-page .item .data,
    .party-page .item .time {
        grid-row: 3
    }

    .party-page .item .data {
        grid-column: 1
    }

    .party-page .item .time {
        grid-column: 2
    }

    .party-title,
    .party-text-1,
    .party-text-2 {
        grid-column: 1/-1;
        grid-row: auto
    }
}

/*# sourceMappingURL=page-party.css.map */