/* =========================================================
   PSYCHOSOCIAL - THE EVENTS CALENDAR
   COMPLETE RESPONSIVE DARK STYLE
   ========================================================= */


/* =========================================================
   1. ALGEMENE KLEUREN
   ========================================================= */

.tribe-events,
.tribe-events-view,
.tribe-events-single,
body.single-tribe_events .tribe-events-single {
    background: #000 !important;
    color: #fff !important;
}


/* =========================================================
   2. EVENTLIJST - ZOEKBALK
   ========================================================= */

.tribe-events .tribe-events-c-events-bar,
.tribe-events .tribe-events-c-events-bar__search-container,
.tribe-events .tribe-events-c-search__input-control {
    background: #111 !important;
    border-color: #333 !important;
    box-shadow: none !important;
}

.tribe-events .tribe-events-c-search__input {
    background: #111 !important;
    color: #fff !important;
}

.tribe-events .tribe-events-c-search__input::placeholder {
    color: #aaa !important;
    opacity: 1 !important;
}


/* Zoekicoon */

.tribe-events .tribe-events-c-events-bar__search-button,
.tribe-events .tribe-events-c-events-bar__search-button-icon-svg,
.tribe-events .tribe-events-c-events-bar__search-button svg,
.tribe-events .tribe-events-c-events-bar__search-button svg path {
    color: #fff !important;
    fill: #fff !important;
    stroke: #fff !important;
}


/* =========================================================
   3. FIND EVENTS BUTTON
   ========================================================= */

.tribe-events .tribe-events-c-search__button {
    background: #b51e23 !important;
    color: #fff !important;

    border: 0 !important;
    border-radius: 4px !important;

    font-weight: 700 !important;
}

.tribe-events .tribe-events-c-search__button:hover {
    background: #d2262c !important;
}


/* =========================================================
   4. LIST / MONTH / DAY
   ========================================================= */

.tribe-events .tribe-events-c-view-selector,
.tribe-events .tribe-events-c-view-selector__content,
.tribe-events .tribe-events-c-view-selector__list {
    background: #111 !important;
}

.tribe-events .tribe-events-c-view-selector__list-item-text,
.tribe-events .tribe-events-c-view-selector__list-item-link {
    color: #ccc !important;
    opacity: 1 !important;
}

.tribe-events
.tribe-events-c-view-selector__list-item--active
.tribe-events-c-view-selector__list-item-text,
.tribe-events
.tribe-events-c-view-selector__list-item--active
.tribe-events-c-view-selector__list-item-link {
    color: #fff !important;
}

.tribe-events .tribe-events-c-view-selector__list-item-link:hover,
.tribe-events
.tribe-events-c-view-selector__list-item-link:hover
.tribe-events-c-view-selector__list-item-text {
    color: #d2262c !important;
}


/* =========================================================
   5. TODAY + PIJLEN + UPCOMING
   ========================================================= */

.tribe-events .tribe-events-c-top-bar__today-button {
    background: #111 !important;
    color: #fff !important;

    border: 1px solid #555 !important;
}

.tribe-events .tribe-events-c-top-bar__today-button:hover {
    background: #222 !important;
    border-color: #aaa !important;
}

.tribe-events .tribe-events-c-top-bar__nav-link,
.tribe-events .tribe-events-c-top-bar__datepicker-button,
.tribe-events .tribe-events-c-top-bar__datepicker-time {
    color: #fff !important;
}

.tribe-events .tribe-events-c-top-bar__nav-link svg path,
.tribe-events .tribe-events-c-top-bar__datepicker-button svg path {
    fill: #fff !important;
    stroke: #fff !important;
}


/* =========================================================
   6. MAANDSCHEIDING
   ========================================================= */

.tribe-events .tribe-events-calendar-list__month-separator-text {
    color: #ddd !important;
}

.tribe-events .tribe-events-calendar-list__month-separator::after {
    background-color: #555 !important;
}


/* =========================================================
   7. EVENTLIJST - DATUM / TITEL / TEKST
   ========================================================= */

.tribe-events .tribe-events-calendar-list__event-date-tag-weekday,
.tribe-events .tribe-events-calendar-list__event-date-tag-daynum {
    color: #fff !important;
}

.tribe-events .tribe-events-calendar-list__event-title,
.tribe-events .tribe-events-calendar-list__event-title-link,
.tribe-events .tribe-events-calendar-list__event-title a {
    color: #fff !important;
}

.tribe-events .tribe-events-calendar-list__event-title-link:hover {
    color: #d2262c !important;
}

.tribe-events .tribe-events-calendar-list__event-datetime,
.tribe-events .tribe-event-date-start,
.tribe-events .tribe-event-time,
.tribe-events .tribe-events-calendar-list__event-venue,
.tribe-events .tribe-events-calendar-list__event-description,
.tribe-events .tribe-events-calendar-list__event-details {
    color: #cfcfcf !important;
}

.tribe-events a {
    color: #fff;
}


/* =========================================================
   8. EVENTLIJST - CONSISTENTE AFBEELDINGEN
   ========================================================= */

/*
 * Iedere afbeelding krijgt een voorspelbaar vak.
 *
 * object-fit: contain:
 * - geen cropping
 * - geen vervorming
 * - staande poster blijft volledig zichtbaar
 * - liggende foto blijft volledig zichtbaar
 */

.tribe-events
.tribe-events-calendar-list__event-featured-image-wrapper {
    width: 100% !important;
    max-width: 420px !important;

    aspect-ratio: 16 / 9 !important;

    overflow: hidden !important;

    background: #000 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 4px auto 12px !important;
}


.tribe-events
.tribe-events-calendar-list__event-featured-image-link {
    display: flex !important;

    width: 100% !important;
    height: 100% !important;

    align-items: center !important;
    justify-content: center !important;

    background: #000 !important;
}


.tribe-events
.tribe-events-calendar-list__event-featured-image {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    max-width: 100% !important;
    max-height: 100% !important;

    object-fit: contain !important;
    object-position: center center !important;
}


/* =========================================================
   9. SINGLE EVENT - BASIS
   ========================================================= */

body.single-tribe_events .tribe-events-single {
    width: min(94%, 1400px) !important;

    max-width: 1400px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-top: clamp(24px, 3vw, 42px) !important;
    padding-bottom: 32px !important;
}


/* =========================================================
   10. SINGLE EVENT - BACK LINK
   ========================================================= */

body.single-tribe_events .tribe-events-back {
    margin: 0 0 14px !important;
}

body.single-tribe_events .tribe-events-back a {
    color: #ddd !important;

    font-weight: 700 !important;
    text-decoration: none !important;
}

body.single-tribe_events .tribe-events-back a:hover {
    color: #d2262c !important;
}


/* =========================================================
   11. SINGLE EVENT - TITEL
   ========================================================= */

body.single-tribe_events
.tribe-events-single-event-title {
    color: #fff !important;

    font-size: clamp(30px, 3vw, 46px) !important;
    line-height: 1.08 !important;

    font-weight: 700 !important;

    margin: 0 0 12px !important;

    max-width: 1200px !important;
}


/* =========================================================
   12. SINGLE EVENT - DATUM + TIJD + PRIJS
   ========================================================= */

body.single-tribe_events .tribe-events-schedule {
    display: flex !important;

    flex-wrap: wrap !important;
    align-items: center !important;

    gap: 10px !important;

    margin: 0 0 24px !important;
}

body.single-tribe_events .tribe-events-schedule h2 {
    color: #fff !important;

    font-size: clamp(17px, 1.5vw, 21px) !important;
    line-height: 1.3 !important;

    font-weight: 400 !important;

    margin: 0 !important;
}

body.single-tribe_events .tribe-events-cost {
    display: inline-block !important;

    background: #b51e23 !important;
    color: #fff !important;

    padding: 5px 11px !important;

    border-radius: 4px !important;

    font-size: 15px !important;
    font-weight: 700 !important;

    line-height: 1.2 !important;

    margin: 0 !important;
}


/* =========================================================
   13. SINGLE EVENT - HOOFDLAYOUT DESKTOP
   ========================================================= */

/*
 * Linkerzijde:
 * beschrijving
 * kalenderknop
 * details
 *
 * Rechterzijde:
 * afbeelding
 * venue
 *
 * Hierdoor gebruiken we de breedte van een desktopscherm
 * in plaats van alles eindeloos onder elkaar te zetten.
 */

@media (min-width: 900px) {

    body.single-tribe_events
    .tribe-events-single > .tribe_events {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1.1fr)
            minmax(340px, 0.9fr) !important;

        grid-template-areas:
            "description image"
            "subscribe   image"
            "primary     secondary" !important;

        column-gap: clamp(36px, 6vw, 90px) !important;
        row-gap: 18px !important;

        align-items: start !important;
    }


    body.single-tribe_events
    .tribe-events-single-event-description {
        grid-area: description !important;
    }


    body.single-tribe_events
    .tribe-events-event-image {
        grid-area: image !important;
    }


    body.single-tribe_events
    .tribe-events-c-subscribe-dropdown__container {
        grid-area: subscribe !important;
    }


    body.single-tribe_events
    .tribe-events-single-section.primary {
        grid-area: primary !important;
    }


    body.single-tribe_events
    .tribe-events-single-section.secondary {
        grid-area: secondary !important;
    }
}


/* =========================================================
   14. SINGLE EVENT - BESCHRIJVING
   ========================================================= */

body.single-tribe_events
.tribe-events-single-event-description {
    color: #eee !important;

    font-size: clamp(16px, 1.35vw, 20px) !important;
    line-height: 1.45 !important;

    margin: 0 !important;
}

body.single-tribe_events
.tribe-events-single-event-description p {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}


/* =========================================================
   15. SINGLE EVENT - AFBEELDING
   ========================================================= */

/*
 * Dit is belangrijk voor toekomstige evenementen.
 *
 * Het maakt niet uit of je uploadt:
 * - vierkant
 * - 16:9
 * - staande poster
 * - extreem brede foto
 *
 * Hij wordt nooit vervormd en nooit afgesneden.
 */

body.single-tribe_events .tribe-events-event-image {
    display: flex !important;

    align-items: flex-start !important;
    justify-content: center !important;

    width: 100% !important;

    margin: 0 !important;

    background: #000 !important;

    overflow: hidden !important;
}


body.single-tribe_events
.tribe-events-event-image img {
    display: block !important;

    width: auto !important;
    height: auto !important;

    max-width: 100% !important;

    /*
     * Belangrijk:
     * poster kan nooit meer het hele scherm domineren.
     */
    max-height: min(40vh, 440px) !important;

    object-fit: contain !important;
    object-position: center center !important;

    margin: 0 auto !important;
}


/* =========================================================
   16. SINGLE EVENT - ADD TO CALENDAR
   ========================================================= */

body.single-tribe_events
.tribe-events-c-subscribe-dropdown__container {
    margin: 6px 0 0 !important;
}

body.single-tribe_events
.tribe-events-c-subscribe-dropdown__button {
    margin: 0 !important;
}


/* =========================================================
   17. SINGLE EVENT - META BLOKKEN
   ========================================================= */

/*
 * Details / Organizer / Venue worden veel compacter.
 */

body.single-tribe_events
.tribe-events-single-section {
    background: #0d0d0d !important;

    color: #fff !important;

    border: 1px solid #333 !important;
    border-radius: 4px !important;

    padding: 18px !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


/* DETAILS + ORGANIZER naast elkaar */

body.single-tribe_events
.tribe-events-single-section.primary {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 20px 30px !important;
}


/* Meta groepen */

body.single-tribe_events
.tribe-events-meta-group {
    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Kopjes */

body.single-tribe_events
.tribe-events-single-section-title {
    color: #fff !important;

    font-size: 17px !important;
    line-height: 1.2 !important;

    font-weight: 700 !important;

    margin: 0 0 12px !important;
}


/* Definitielijsten */

body.single-tribe_events
.tribe-events-single-section dl {
    margin: 0 !important;
}


body.single-tribe_events
.tribe-events-single-section dt {
    color: #fff !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    line-height: 1.3 !important;

    margin: 7px 0 2px !important;
}


body.single-tribe_events
.tribe-events-single-section dd {
    color: #ddd !important;

    font-size: 14px !important;
    line-height: 1.35 !important;

    margin: 0 0 7px !important;
}


/* Links */

body.single-tribe_events
.tribe-events-single-section a {
    color: #fff !important;
    text-decoration: underline !important;
}

body.single-tribe_events
.tribe-events-single-section a:hover {
    color: #d2262c !important;
}


/* =========================================================
   18. SINGLE EVENT - VENUE + MAP
   ========================================================= */

body.single-tribe_events
.tribe-events-single-section.secondary {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(150px, 200px) !important;

    gap: 18px !important;

    align-items: start !important;
}


/* Map niet gigantisch */

body.single-tribe_events
.tribe-events-venue-map {
    width: 100% !important;
    max-width: 200px !important;

    margin: 0 !important;
}


body.single-tribe_events
.tribe-events-venue-map > div,
body.single-tribe_events
.tribe-events-venue-map iframe {
    width: 100% !important;
    max-width: 200px !important;

    height: 140px !important;

    min-height: 0 !important;
}


/* =========================================================
   19. SINGLE EVENT - VORIGE / VOLGENDE EVENT
   ========================================================= */

body.single-tribe_events
.tribe-events-nav-pagination {
    width: 100% !important;

    border-top: 1px solid #444 !important;

    margin-top: 24px !important;
    padding-top: 18px !important;
}

body.single-tribe_events
.tribe-events-nav-pagination a {
    color: #fff !important;
}

body.single-tribe_events
.tribe-events-nav-pagination a:hover {
    color: #d2262c !important;
}


/* =========================================================
   20. TABLET
   ========================================================= */

@media
(max-width: 1100px)
and (min-width: 768px) {

    body.single-tribe_events
    .tribe-events-single {
        width: 92% !important;
    }


    body.single-tribe_events
    .tribe-events-single > .tribe_events {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(300px, 0.8fr) !important;

        column-gap: 32px !important;
    }


    body.single-tribe_events
    .tribe-events-event-image img {
        max-height: 38vh !important;
    }


    body.single-tribe_events
    .tribe-events-single-section.secondary {
        grid-template-columns: 1fr !important;
    }


    body.single-tribe_events
    .tribe-events-venue-map {
        max-width: 100% !important;
    }


    body.single-tribe_events
    .tribe-events-venue-map > div,
    body.single-tribe_events
    .tribe-events-venue-map iframe {
        max-width: 100% !important;
        height: 150px !important;
    }
}


/* =========================================================
   21. MOBIEL - EVENTLIJST
   ========================================================= */

@media (max-width: 767px) {

    .tribe-events .tribe-events-c-events-bar {
        background: #111 !important;
    }


    .tribe-events
    .tribe-events-c-view-selector__content {
        background: #111 !important;
    }


    .tribe-events
    .tribe-events-c-top-bar__datepicker-button,
    .tribe-events
    .tribe-events-c-top-bar__datepicker-time {
        color: #fff !important;
    }


    .tribe-events
    .tribe-events-calendar-list__month-separator-text {
        color: #ddd !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-date-tag-weekday,
    .tribe-events
    .tribe-events-calendar-list__event-date-tag-daynum {
        color: #fff !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-title-link {
        color: #fff !important;
    }


    /*
     * Op mobiel iets hoger afbeeldingsvak.
     * Daardoor zijn zowel posters als liggende afbeeldingen
     * prettig te bekijken.
     */

    .tribe-events
    .tribe-events-calendar-list__event-featured-image-wrapper {
        width: 100% !important;
        max-width: none !important;

        aspect-ratio: 4 / 3 !important;

        margin-top: 12px !important;
        margin-bottom: 16px !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-featured-image-link {
        width: 100% !important;
        height: 100% !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-featured-image {
        width: 100% !important;
        height: 100% !important;

        object-fit: contain !important;
        object-position: center center !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-row {
        margin-bottom: 36px !important;
    }
}


/* =========================================================
   22. MOBIEL - SINGLE EVENT
   ========================================================= */

@media (max-width: 899px) {

    /*
     * Op telefoon/tablet gewoon één kolom.
     * Daardoor kan niets buiten het scherm lopen.
     */

    body.single-tribe_events
    .tribe-events-single > .tribe_events {
        display: flex !important;

        flex-direction: column !important;

        gap: 20px !important;
    }


    body.single-tribe_events
    .tribe-events-single {
        width: auto !important;

        margin-left: 20px !important;
        margin-right: 20px !important;

        padding-top: 24px !important;
    }


    body.single-tribe_events
    .tribe-events-single-event-title {
        font-size: clamp(30px, 8vw, 40px) !important;

        line-height: 1.08 !important;

        margin-bottom: 12px !important;
    }


    body.single-tribe_events
    .tribe-events-schedule {
        margin-bottom: 20px !important;

        gap: 8px !important;
    }


    body.single-tribe_events
    .tribe-events-schedule h2 {
        font-size: 17px !important;
    }


    body.single-tribe_events
    .tribe-events-single-event-description {
        font-size: 17px !important;
        line-height: 1.5 !important;
    }


    /*
     * Poster / foto mobiel:
     * maximaal 42% van de schermhoogte.
     */

    body.single-tribe_events
    .tribe-events-event-image {
        width: 100% !important;

        margin: 0 auto !important;

        order: 2 !important;
    }


    body.single-tribe_events
    .tribe-events-event-image img {
        width: auto !important;
        height: auto !important;

        max-width: 100% !important;
        max-height: 42vh !important;

        object-fit: contain !important;

        margin: 0 auto !important;
    }


    /*
     * Meta-informatie niet meer naast elkaar.
     */

    body.single-tribe_events
    .tribe-events-single-section.primary,
    body.single-tribe_events
    .tribe-events-single-section.secondary {
        display: grid !important;

        grid-template-columns: 1fr !important;

        gap: 18px !important;

        padding: 16px !important;
    }


    body.single-tribe_events
    .tribe-events-venue-map {
        width: 100% !important;
        max-width: 100% !important;
    }


    body.single-tribe_events
    .tribe-events-venue-map > div,
    body.single-tribe_events
    .tribe-events-venue-map iframe {
        width: 100% !important;
        max-width: 100% !important;

        height: 190px !important;
    }
}


/* =========================================================
   23. EXTRA KLEINE TELEFOONS
   ========================================================= */

@media (max-width: 480px) {

    body.single-tribe_events
    .tribe-events-single {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }


    body.single-tribe_events
    .tribe-events-single-event-title {
        font-size: 30px !important;
    }


    body.single-tribe_events
    .tribe-events-event-image img {
        max-height: 38vh !important;
    }


    body.single-tribe_events
    .tribe-events-single-section {
        padding: 14px !important;
    }
}

/* =========================================================
   SINGLE EVENT - OUDE TEC SCHEIDINGSLIJN VERWIJDEREN
   ========================================================= */

body.single-tribe_events .tribe-events-event-meta,
body.single-tribe_events .tribe-events-event-meta.primary,
body.single-tribe_events .tribe-events-event-meta.secondary {
    border-top: 0 !important;
    border-bottom: 0 !important;
}

/* Eventuele pseudo-elementen van The Events Calendar */
body.single-tribe_events .tribe-events-event-meta::before,
body.single-tribe_events .tribe-events-event-meta::after,
body.single-tribe_events .tribe-events-single-section::before,
body.single-tribe_events .tribe-events-single-section::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
}

/* =========================================================
   EVENTS - HELE AFBEELDING KLIKBAAR
   ========================================================= */

.tribe-events .tribe-events-calendar-list__event-featured-image-wrapper {
    position: relative !important;
}

/* De standaard The Events Calendar-link vult het hele fotovak */
.tribe-events .tribe-events-calendar-list__event-featured-image-link {
    display: flex !important;

    width: 100% !important;
    height: 100% !important;

    align-items: center !important;
    justify-content: center !important;

    position: relative !important;
    z-index: 2 !important;

    cursor: pointer !important;
    pointer-events: auto !important;
}

/* Klik gaat naar de link rondom de foto */
.tribe-events .tribe-events-calendar-list__event-featured-image {
    pointer-events: none !important;
}

/* Kleine visuele feedback */
.tribe-events .tribe-events-calendar-list__event-featured-image-link:hover img {
    opacity: 0.88 !important;
}

/* Mooie overgang */
.tribe-events .tribe-events-calendar-list__event-featured-image {
    transition: opacity 0.18s ease !important;
}

/* =========================================================
   PSYCHOSOCIAL NANOGRAM CURSOR
   Working cursor asset restored
   Hotspot consistent: 50 / 50
   ========================================================= */

@media (hover: hover) and (pointer: fine) {

    html,
    body,
    body * {
        cursor: url("https://psychosocialtribute.com/wp-content/uploads/2026/08/Nanogramwit-e1787792060685.png") 50 50, auto !important;
    }

    a,
    button,
    input[type="submit"],
    input[type="button"],
    .button,
    .wp-block-button__link,
    .tribe-events a,
    .tribe-events button,
    nav a,
    .menu a,
    [role="button"],
    [type="submit"] {
        cursor: url("https://psychosocialtribute.com/wp-content/uploads/2026/08/Nanogramwit-e1787792060685.png") 50 50, pointer !important;
    }

}


/* =========================================================
   PSYCHOSOCIAL EVENTS
   TEKST LINKS + AFBEELDING RECHTS
   ========================================================= */


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 900px) {

    /* Event zelf wordt een 2-koloms grid */
    .tribe-events
    .tribe-events-calendar-list__event {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(300px, 420px) !important;

        column-gap: clamp(32px, 4vw, 60px) !important;

        align-items: start !important;

        width: 100% !important;
    }


    /* Tekstgedeelte */
    .tribe-events
    .tribe-events-calendar-list__event-details {

        grid-column: 1 !important;
        grid-row: 1 !important;

        width: 100% !important;
        max-width: none !important;

        padding: 0 !important;
        margin: 0 !important;
    }


    /* Afbeelding rechts */
    .tribe-events
    .tribe-events-calendar-list__event-featured-image-wrapper {

        grid-column: 2 !important;
        grid-row: 1 !important;

        width: 100% !important;
        max-width: 420px !important;

        aspect-ratio: 16 / 9 !important;

        margin: 0 0 0 auto !important;

        align-self: start !important;

        overflow: hidden !important;

        background: #000 !important;
    }


    /* Link vult het hele fotovak */
    .tribe-events
    .tribe-events-calendar-list__event-featured-image-link {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 100% !important;
    }


    /* Foto nooit croppen */
    .tribe-events
    .tribe-events-calendar-list__event-featured-image {

        display: block !important;

        width: 100% !important;
        height: 100% !important;

        max-width: 100% !important;
        max-height: 100% !important;

        object-fit: contain !important;
        object-position: center center !important;
    }


    /* Iets compactere ruimte tussen events */
    .tribe-events
    .tribe-events-calendar-list__event-row {

        margin-bottom: 42px !important;
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (min-width: 768px) and (max-width: 899px) {

    .tribe-events
    .tribe-events-calendar-list__event {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(220px, 34%) !important;

        column-gap: 24px !important;

        align-items: start !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-details {

        grid-column: 1 !important;
        grid-row: 1 !important;

        width: 100% !important;

        padding: 0 !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-featured-image-wrapper {

        grid-column: 2 !important;
        grid-row: 1 !important;

        width: 100% !important;
        max-width: 320px !important;

        aspect-ratio: 16 / 9 !important;

        margin: 0 0 0 auto !important;
    }
}


/* =========================================================
   MOBIEL
   ========================================================= */

@media (max-width: 767px) {

    /* Terug naar één kolom */
    .tribe-events
    .tribe-events-calendar-list__event {

        display: block !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-details {

        width: 100% !important;
        max-width: none !important;
    }


    /* Foto weer onder de tekst */
    .tribe-events
    .tribe-events-calendar-list__event-featured-image-wrapper {

        width: 100% !important;
        max-width: none !important;

        aspect-ratio: 4 / 3 !important;

        margin: 16px 0 0 !important;
    }


    .tribe-events
    .tribe-events-calendar-list__event-featured-image {

        width: 100% !important;
        height: 100% !important;

        object-fit: contain !important;
    }
}