MBSKCO UI Library

Spotlight: Default 

<div class="spotlight py-5 mb-5">
    <div class="container-fluid container-lg">
        <div class="row align-items-center">
            <div class="col-12 col-md-3 col-lg-4 col-xl-5">
                <div class="position-relative">
                    <img src="https://placehold.co/600x700.png" alt="Spotlight" class="img-fluid rounded-5" />
                    <img src="https://placehold.co/250x180.png" alt="Spotlight" class="img-fluid rounded-5 position-absolute top-0 start-0 translate-middle ms-5 mt-5 shadow-lg" />
                    <img src="https://placehold.co/300x250.png" alt="Spotlight" class="img-fluid rounded-5 position-absolute top-100 start-100 translate-middle me-5 mb-5 shadow" />
                </div>
            </div>
            <div class="col-12 col-md-8 col-lg-7 col-xl-6 offset-md-1 pb-5">
                <h2 class="h1 lh-1 fw-bold">Building collective action across the state for our youth of colors success</h2>
                <h3 class="h5 mb-3">MBSK Colorado is a non-profit organization dedicated to disrupting and dismantling the cumulative adverse childhood and young adulthood experiences that affect Colorado's Black and Brown communities intergenerationally.</h3>
                <button class="btn btn-outline-primary">Meet Our Team</button>
                <button class="btn btn-outline-secondary">Get Involved</button>
            </div>
        </div>
    </div>
</div>
 
<div class="spotlight py-5 mb-5">
    <div class="container-fluid container-lg">
        <div class="row align-items-center">
            <div class="col-12 col-md-3 col-lg-4 col-xl-5">
                <div class="position-relative">
                    <img src="https://placehold.co/600x700.png" alt="Spotlight" class="img-fluid rounded-5"/>
                    <img src="https://placehold.co/250x180.png" alt="Spotlight" class="img-fluid rounded-5 position-absolute top-0 start-0 translate-middle ms-5 mt-5 shadow-lg"/>
                    <img src="https://placehold.co/300x250.png" alt="Spotlight" class="img-fluid rounded-5 position-absolute top-100 start-100 translate-middle me-5 mb-5 shadow"/>
                </div>
            </div>
            <div class="col-12 col-md-8 col-lg-7 col-xl-6 offset-md-1 pb-5">
                <h2 class="h1 lh-1 fw-bold">Building collective action across the state for our youth of colors success</h2>
                <h3 class="h5 mb-3">MBSK Colorado is a non-profit organization dedicated to disrupting and dismantling the cumulative adverse childhood and young adulthood experiences that affect Colorado's Black and Brown communities intergenerationally.</h3>
                <button class="btn btn-outline-primary">Meet Our Team</button>
                <button class="btn btn-outline-secondary">Get Involved</button>
            </div>
        </div>
    </div>
</div>
 
/* No context defined. */

No notes defined.