.wb-image-video-content {
    .row {
        --bs-gutter-y: 2rem;
        --bs-gutter-x: 2rem;
    }
    .wb-image-video-content--media {
        padding: 2rem;
        background: var( --wb--color--secondary);
        background: linear-gradient(45deg,var( --wb--color--primary) 40%, var( --wb--color--secondary) 100%);
        color: var(--wb--color--white);
        border-radius: 1rem;

        .wb-image-video-content--image,
        .wb-image-video-content--video {
            position: relative;
            overflow: hidden;
            border-radius: 0.75rem;
            padding-top: 70%;
            display: block;
            img {
                position: absolute;
                width: 100%;
                height: 100%;
                object-fit: cover;
                inset: 0;
            }
        }

        .wb-image-video-content--video {
            padding-top: 56.25%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;

            .wb-image-video-content--video--play {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
            }
        }
    }

    .wb-image-video-content--media.primary {
        background: var(--wb--color--primary);
    }

    .wb-image-video-content--media.secondary {
        background: var(--wb--color--secondary);
    }

    .wb-image-video-content--media.white {
        background: var(--wb--color--white);
        color: var(--wb--color--text);
    }

    .wb-image-video-content--media.light-grey {
        background: var(--wb--color--light-grey);
        color: var(--wb--color--text);
    }

    .wb-image-video-content--media.light-blue {
        background: var(--wb--color--light-lightbg);
        color: var(--wb--color--text);
    }
}




/* .wb-image-video-content.is-style-full-bg  {
    .wb-image-video-content--media {
        background: var(--wb--color--white);
        color: var(--wb--color--text);
    }
} */

.wb-image-video-content.is-style-pill {
    .container > .wb-image-video-content--container {
        background-color: var(--wb--color--lightbg);
        padding: 2rem;
        border-radius: 1.25rem;
    }
}