Video Showcase

The video iframe supports YouTube and Vimeo. Autoplay should be enabled for best results.

<div class="tcu-video-showcase">
    <div class="tcu-video-showcase__video">
        <button class="tcu-video-showcase__poster-btn tcu-video-showcase__poster">
            <span class="show-for-sr">Play Video</span>
            <picture>
                <img class="tcu-video-showcase__image" src="https://tcu150.dev.tcu.edu/images/building-projects.jpg" alt="" loading="lazy" />
            </picture>
        </button>
        <div class="tcu-video-showcase__embed">
            <iframe title="" class="tcu-video-showcase__video-src" data-src="https://player.vimeo.com/video/728168863?h=4698387fd7&amp;badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479&amp;autoplay=1&amp;transparent=false&amp;width=415&amp;height=256" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe>
        </div>
    </div>
    <div class="tcu-video-showcase__content">
        <div class="tcu-video-showcase__header">
            <h2 class="tcu-video-showcase__headline">Title Card Headline</h2>
        </div>
        <p>Title Card Content Block (optional)</p>
        <div class="button-group">
            <a href="#" class="tcu-button  | button ">
                Primary Button
            </a>
        </div>
    </div>
</div>