/* 
HERO
*/
#about_p-hero .--media {opacity: .75;}
#about_p-hero h3 {z-index: 5;}

@media only screen and (min-width: 1096px) {
    #about_p-hero {
        min-height: calc(var(--vh) * 100);
        max-height: calc(var(--vh) * 100);
    }
}




/* 
FEED
*/
#about_p-feed {margin-top: var(--size-d);}




/* 
EVENTS
*/
#about_p-events {margin-top: var(--size-l);}

#about_p-events h3,
#about_p-events--header,
#about_p-events--nav {margin-bottom: var(--size-d);}

#about_p-events--nav {
    column-gap: var(--size-s);
    row-gap: var(--size-s);
}

#about_p-events ul[data-view='ongoing'] > li[data-time='past'] {display: none;}
#about_p-events ul[data-view='past'] > li[data-time='ongoing'] {display: none;}

.about_p-events--entry {
    padding: .7rem;
    width: 100%;
    border-radius: 2px;
    aspect-ratio: 3/1;
}
@media (hover: hover) {
    .about_p-events--entry {transition: background 250ms ease-in-out;}
    .about_p-events--entry:hover {background: rgba(255, 255, 255, .08);}
}

/* OVERLAY */
.about_p-events--overlay {
    background: rgba(0, 0, 0, .5);
    backdrop-filter: blur(4rem);
    -webkit-backdrop-filter: blur(4rem);
    z-index: 220;
}
.about_p-events--overlay[data-status='hide'] {display: none !important;}

.about_p-events--overlay > button {
    top: 1.5rem;
    right: 1.5rem;
    z-index: 5;
}
.about_p-events--overlay > button img {height: 1.5rem; width: auto;}

.about_p-events--overlay .--container {
    width: 100%;
    max-width: 56rem;
    height: 100%;
    border-radius: 4px;
    background: rgba(2552, 255, 255, .08);
    backdrop-filter: blur(4rem);
    -webkit-backdrop-filter: blur(4rem);
    overflow-y: auto;
    overflow-x: hidden;
    margin-right: auto;
    margin-left: auto;
}

.about_p-events--overlay .--gallery-container {scroll-snap-type: x mandatory;}
.about_p-events--overlay .--gallery-container .--media {
    scroll-snap-align: center;
    opacity: .75;
}
.about_p-events--overlay .--gallery-title {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.about_p-events--overlay .--main {
    margin-top: var(--size-d);
    row-gap: var(--size-l);
}
.about_p-events--overlay .--main > * {grid-column: 1/-1;}

.about_p-events--overlay .--main-information--details .--entry {
    border-top: 1px solid white;
    padding-top: var(--size-xs);
    margin-bottom: var(--size-xs);
}

@media only screen and (min-width: 768px) {
    .about_p-events--overlay > button {
        top: 2rem;
        right: 2rem;
    }

    .about_p-events--overlay .--main-information {
        position: sticky;
        top: 0;
        align-self: flex-start;
        grid-column: 1/2;
    }
}

@media only screen and (min-width: 1096px) {
    .about_p-events--overlay > button {
        top: 2rem;
        right: 2rem;
    }

    .about_p-events--overlay .--main-information {grid-column: 2/-1; grid-row: 1;}
    .about_p-events--overlay .--main-feed {grid-column: 1/2; grid-row: 1;}
}




/* 
PARTNERS
*/
#about_p-partners {margin-top: var(--size-l);}

#about_p-partners--grid li {grid-column: span 1;}
#about_p-partners--grid a {
    grid-column: span 1;
    padding: .7rem;
    width: 100%;
    border-radius: 2px;
    aspect-ratio: 3/1;
}
@media (hover: hover) {
    #about_p-partners--grid a {transition: background 250ms ease-in-out;}
    #about_p-partners--grid a:hover {background: rgba(255, 255, 255, .08);}
}

#about_p-partners h3,
#about_p-partners--header {
    margin-bottom: var(--size-d);
}