#evento {
    position : relative;
    scroll-padding: 1rem;
}
#evento .page-title span {
    color : var(--accent);
}
#evento .page-title {
    margin-bottom : 1rem;
    grid-column: innergrid;
}
#evento-wrapper {
    align-items   : start;
    align-content : start;
    gap           : 0 3rem;
    padding-top   : 1rem;
}
.event-featured-picture,
.event-description,
.event-credits,
.event-tickets,
.event-prices,
.event-accessibility,
.related-events,
.event-media {
    grid-column: innergrid;
}
/* The Featured Picture */
.event-featured-picture {
    margin-bottom : 1rem;
}
.event-featured-image {
    object-fit      : cover;
    object-position : center;
    max-height      : 66svh;
}
.event-description {
    font          : var(--sans-m);
    margin-top    : 1rem;
    margin-bottom : 3rem;
}
.event-accessibility .accordion-title {
    display: flex;
    gap : 0.5rem;
    align-items: center;
    padding : 0.35rem 0;
}
.event-accessibility svg {
    width : 1.2rem;
    height : 1.2rem;
}
#evento .event-date-open {
    pointer-events : all;
    cursor         : pointer;
}
#evento .event-date-open:hover path {
    fill : var(--accent);
}
/* Price Tables */
@media (width > 1100px) {    
    .event-prices { display: none; }
}
.event-prices-tables {
    display               : grid;
    grid-template-columns : repeat(1,1fr);
    gap                   : var(--gap-v) 3rem;
    margin-bottom         : 2rem;
    grid-column           : 1 / -1;
}
@media (width > 700px) and (width < 1100px) {
    .event-prices-tables {
        grid-template-columns : repeat(3,1fr);
    }
}
@media (width > 1300px) {
    .event-prices-tables {
        grid-template-columns : repeat(3,1fr);
    }
}
.event-prices-table:only-child {
    grid-column : 1 / -1;
}
.event-prices-table-title {
    font : var(--sans-sl);
}
.event-prices-table-entry {
    border-bottom   : 1px solid var(--dark);
    padding         : 0.25rem 0;
    display         : flex;
    justify-content : space-between;
}
.event-tickets-text-global:not(:last-child) {
    margin-bottom : 1rem;
}
/* Sidebar */
@media (width >= 1100px) {
    .sidebar {
        position   : relative;
        grid-column: 1;
        grid-row   : 1 / 10;
        align-self : stretch;
        padding    : 1.5rem 0 0 0;
        inset      : 0;
    }

    .sidebar-inner {
        height             : auto;
        position           : sticky;
        top                : 2.5rem;
        grid-template-areas: unset;
        grid-template-rows : unset;
        min-height         : unset;
    }
}
.sidebar-evento-related {
    color      : var(--accent);
    margin-top : 1rem;
}
.sidebar-event-prices-button {
    display : none;
}
.evento-buy-button {
    margin-top : 1rem;
}
/* Mobile Adjustments */
@media (width < 1100px) {
    

    #evento-wrapper {
        grid-template-areas : unset;
    }
    #evento .page-title {
        margin-bottom : 0;
    }
    .event-featured-picture {
        margin-top: 1.5rem;
        margin-bottom : 0.5rem;
    }

    #evento .page-title:nth-child(2) {
        margin-top: 1.5rem;
    }
    
    #evento .page-title,
    .sidebar,
    .event-featured-picture,
    .event-description,
    .event-credits,
    .event-tickets,
    .event-prices,
    .event-accessibility,
    .event-media,
    .related-events {
        grid-column : unset;
        order  : 10;
        grid-area: unset;
    }

    .event-featured-picture { order : 1; }
    #evento .page-title { order : 2; }
    .sidebar { order : 3; }

    /* Hide a few things from the sidebar on mobile */
    .sidebar-event-prices,
    .sidebar-evento-title {
        display : none;
    }

    .sidebar-evento {
        margin-top    : 1.5rem;
        margin-bottom : 1.5rem;
    }

    .sidebar-event-prices-button {
        display : block;
        margin-top : 1rem;
    }

    .sidebar {
        display : block;
    }

}
/* The New Sidebar Prices Section */
.sidebar-prices-table-title {
    margin-top : 1rem;
}
.sidebar-prices-table-entry {
    display         : flex;
    justify-content : space-between;
    padding-bottom : 0.25rem;
    border-bottom : 1px solid var(--dark);
    margin-top : 0.25rem;
}
.sidebar-prices-notes {
    margin-top    : 1.5rem;
    margin-bottom : 1.5rem;
    font          : var(--sans-sl);
}
/* Media Gallery */
.event-media-gallery {
    grid-template-columns: 1fr;
}
.event-media-gallery-image,
.event-media-gallery-video {
    display : block;
    width   : 100%;
}
.event-media-gallery :is(iframe,object,embed), .embed-container object, .embed-container embed {
    width        : 100%;
    height       : 100%;
    aspect-ratio : 16/9;
    border       : none;
    display      : block;
}
/* Styles for the old events */
#evento .is-old {
    --accent : #3F3F3F;
}
#evento .is-old img {
    filter : grayscale(1);
}
#evento .is-old #evento-wrapper {
    position : relative;
}
/* Old Event Overlay */
.old-marquee-wrapper {
    position       : fixed;
    left           : var(--side-spacer);
    right          : var(--side-spacer);
    min-height     : unset;
    pointer-events : none;
    transition-property: opacity;
}
.faded-out {
    opacity : 0;
}
.old-marquee-top {
    top : var(--side-spacer);
}
.old-marquee-center {
    position : absolute;
    top      : 50vh;
    animation : fadeout 2s 3s linear forwards;
}
.old-marquee-bottom {
    bottom : var(--side-spacer);
}
.old-marquee-content {
    grid-column    : 1 / -1;
    background     : #900443;
    color          : var(--light);
    font           : var(--nav);
    text-transform : uppercase;
    padding        : 0.25rem 0;
    overflow       : hidden;
}
.old-marquee-top .old-marquee-content {
    grid-column : unset;
    grid-area   : innergrid;
}
.old-marquee-text {
    text-wrap : nowrap;
    animation : marquee 10s linear infinite;
    display   : flex;
    white-space: pre;
}
@keyframes marquee {
    from {
        transform : translateX(0) translateY(1px);
    }
    to {
        transform : translateX(var(--marquee-transform-distance)) translateY(1px);

    }
}
@media (width < 1100px) {
    .old-marquee-top {
        top : calc(2rem + 1px);
    }

    #evento .is-old .page-title {
        padding-top : 1rem;
    }
}
/* The Related Events Section */
.related-events {
    margin-top : 3rem;
    position   : relative;
}
.related-events-title {
    position: sticky;
    top : var(--stickybars-distance);
    z-index: 10;
}