Cards

Cards are used to present discrete pieces of content and are typically used in listings.

<div class="au-card au-body au-card--shadow au-card--clickable au-card--fullimg">

    <div class="image-outer">
        <div class="image-placeholder" style="max-width: 800px;">
            <div style="padding-top: 56.25%;"></div>
        </div>
        <div class="image-wrapper image-loading">
            <div class="image">
                <img width="800" height="450" data-src="../../images/trex_16x9.jpg">
            </div>
        </div>
    </div>

    <div class="au-card__inner">
        <h3 class="au-card__title"><a class="au-card--clickable__link" href="#">DTA Design System card with AusGov styling</a></h3>
    </div>
</div>