Lorem Ipsum Dolor Sit Amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem IpsumThere is a base card treatment that can be evolved to have different types of content within it. All cards have the same hover/focus interactions, except for Contact Cards and the Alert/Announcement Card.
Item Design Guidelines Not Provided
Cards can be added as a 2-, 3-, or 4-column list in different sections and on various content types.
The first row of .card-list__items
in any card list will have the top padding removed.
If there are multiple rows of cards, orphaned cards will be left-aligned, except in a centered 2-col-list employing the class, .card-list--2-col--centered
, where any orphaned cards will be centered.
Use the class deco-graphic
plus deco-graphic--left
and/or deco-graphic--right
on the card-list container to add the decorative SVGs to the left top or right bottom of the card list.
This is short supporting copy that describes the CTA.
This is short supporting copy that describes the CTA.
This is short supporting copy that describes the CTA.
This is short supporting copy that describes the CTA.
This is short supporting copy that describes the CTA.
This is short supporting copy that describes the CTA.
This is short supporting copy that describes the CTA.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem IpsumLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua consectetur adipiscing elit.
Lorem IpsumLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
Lorem IpsumLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua consectetur adipiscing elit.
Lorem IpsumLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem IpsumLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua consectetur adipiscing elit.
Lorem Ipsum