<div class="dcf-bleed unl-bg-darker-gray">
        <div class="dcf-relative dcf-mb-8">
            <img class="dcf-d-block" src="images/heroes/andrews-erin-chambers.png" alt="Andrews Hall exterior view" />
            <div class="unl-bg-darkest-gray dcf-absolute dcf-pin-top dcf-h-100% dcf-w-100%" style="opacity: 0.5"></div>
            <div class="dcf-wrapper dcf-absolute dcf-pin-top dcf-h-100% dcf-grid-full dcf-ai-center">
                <div>
                    <h2 class="unl-cream dcf-mb-1">
                    <span class="dcf-subhead">Optional intro</span>
                    <span class="dcf-txt-h5 dcf-uppercase">Heading</span>
                    <span class="dcf-subhead dcf-mt-4 dcf-d-">Optional outro</span>
                    </h2>
                    <a class="dcf-btn dcf-btn-inverse-secondary" href="#">Button 1</a>
                    <a class="dcf-btn dcf-btn-primary" href="#">Button 2</a>
                </div>
            </div>
            <div class="dcf-wrapper dcf-absolute dcf-pin-bottom dcf-w-100%">
                <p class="dcf-txt-2xs dcf-txt-right dcf-uppercase unl-cream unl-font-sans">Photo credit: Erin Chambers</p>
            </div>
        </div>
</div>
<div class="dcf-wrapper">Page content</div>