- Global Elements
- Atoms
-
Molecules
- Breadcrumbs
- Button with Dropdown
- Button with Modal (mobile only)
- Clear Filter Button
- Form: Email
- Form: Search
- Jump Links
- Pagination
- Policy Notice
- Section Title
- Social: Share
- Social: Nav
- Social: Custom links
- Card: Person Author
- Card: Person - minimal
- Card: Person
- Card: Person - full bio
- Card: Action
- Card: Common
- Card: Featured
- Card: News
- Card: News (md)
- Card: Press Release
- Card: Spotlight
- Card: Listing News small
- Card: Listing
- Card: Listing News
- Card: Listing Press
- Card: Listing date-first (sm)
- Filter Collection
- Components
- Banner: Global
- Cards: Featured Content
- Cards: Latest Content
- Cards: Featured Case/Legislation
- Cards: Listing
- Cards: Small Date First Listing
- Cards: News Listing
- Cards: News Md
- Cards: Press Releases
- Cards: Person (minimal)
- Cards: Related Issues
- Carousel: Action Cards
- CTA: Email Capture
- CTA: Alert Bar
- CTA: Slim
- Hero: Title on Color
- Hero: Title Metadata
- Hero: Homepage
- Hero: 404 Page
- Hero: Issue Detail
- Hero: Legislation Detail
- Hero: Podcast Detail
- Hero: Overlay
- Hero: Sidebar
- Hero: Sidebar Bio
- Search Dropdown
- Flexible Components
- Accordion
- Audio
- Buttons
- Content Collection
- Content Link
- Divider
- Heading
- iFrame
- Image/Video Collection
- Infogram
- Migrated Content
- Notice
- Podcast
- Pull Quote
- Text
- Timeline
- Quiz
- Expandable Card
- Image
- Video
- YouTube
- Archive Page Links
ACLU Parent Theme
Design system components available to the National and Affiliate sites.
Global Elements
The "Foundations" section outlines the color tokens, typography styles, grids, and spacing rules used throughout the design system.
Colors
Colorways
Colorways are color relationships between background colors, text, buttons and other elements. Using a block with a different colorway can help break up a longer page or change the tone.
Development notes: defined in tokens/src/color .tokens.json, and global/bundles/common/styles/CSS/_elements/colorways .css. Variable names: .color-primary in CSS: var(--color-primary) and .color-secondary in CSS: var(--color-secondary)
colorway-dark-navy
colorway-dark-burgundy
colorway-white
colorway-cream
colorway-red
colorway-blue
colorway-light-azure
colorway-light-orange
colorway-dark-purple
colorway-offblack
Typography
Use headings to improve scan-ability and provide context for users to better understand the page. Headings also help structure page content for screen readers and search engines. Headings should be logically structured on a page using proper hierarchy, headings are ranked 'h1' through 'h6'. A page starts with the H1 heading, which describes a page's main topic— the title of the page. Subsections can be organized with 'h2 level headings. Those subsections can themselves be divided with 'h3' level headings, and so on.
Defined in global/bundles/common/styles/_elements/typography.css. Use classes in twig templates to apply styles.
Header styles
.is-heading.is-special-size-90
.is-heading.is-size-1
.is-heading.is-size-2
.is-heading.is-size-3
.is-heading.is-size-4
.is-heading.is-size-5
.is-heading.is-special-size-21
.is-heading.is-size-2 uppercase
.is-heading.is-size-4 uppercase
.is-heading.is-size-5 uppercase
Text styles
.is-body.is-size-4 font-bold
.is-body.is-size-5 font-bold
.is-body.is-size-6 font-bold
.is-body.is-size-7 font-bold
.is-body.is-special-size-21 font-bold
.is-body.is-size-4
.is-body.is-size-5
.is-body.is-size-6
.is-body.is-size-7
.is-body.is-special-size-21
Serif
.is-body-serif.is-size-5
.is-body-serif.is-size-6
.is-body-serif.is-size-7
Formatted text
Text wrapped in the class ".text-formatted". Strong text . Italic text . And a link.
Spacing
Spacing values define the space between elements on the page. This can include space between buttons, between columns of text, or around an image. Setting a scale of sizes helps the page to feel cohesive and considered.
All of the margin, padding and height classes use generated from these base values. They are also available as css and tailwind variables.Vertical component spacing classes include: .block-spacing--default, .block-spacing--sm, .block-spacing--lg classes define block-level spacing. Tokens defined in tokens/src/spacer.tokens.json. See tokens/src/spacer-tokens.json for definitions. CSS custom property name: --spacer-[size]
0
0 rem
(0 px)
1
.25 rem
(4 px)
2
.5 rem
(8 px)
3
.75 rem
(12 px)
4
1 rem
(16 px)
6
1.5 rem
(24 px)
7
1.75 rem
(28 px)
8
2 rem
(32 px)
10
2.5 rem
(40 px)
11
2.75 rem
(44 px)
12
3 rem
(48 px)
14
3.5 rem
(56 px)
16
4 rem
(64 px)
20
5 rem
(80 px)
24
6 rem
(96 px)
Grids
Developer notes: Defined in tailwind-grids.json. Use "site-container p-site" for site container and site-wide side padding
.grid
.grid.grid-cols-2.gap-default
.grid.grid-cols-3.gap-default
grid.grid-cols-4.gap-default
grid.grid-cols-5.gap-default
grid.grid-cols-12.gap-default .col-span-4 .col-span-8
Atoms
The “Atoms” section defines small UI components in the design system including buttons, badges, and icons.
Badges
tag-alert
Buttons & Links
Buttons and links with icons are designed to work across colorways and have a consistent set of interaction styles.
All button and links can be included in a php template as components. CSS: common/styles/CSS/atoms-molecules/buttons.css, and buttons-icons.css. Templates: common/styles/template-partials/atoms/buttons
Dark Navy Colorway
.btn-text | svg_name: download-lg | size: md
White Colorway
.btn-text | svg_name: download-lg | size: md
Dark Burgundy Colorway
.btn-text | svg_name: download-lg | size: md
Icons
Verified icons and their labels can be found in atoms/icons.php.
Form input
See also: Form molecules.
Molecules
The “Molecules” section outlines larger UI elements throughout the design system including section titles and cards that can display a variety of content. These elements are often seen in multiple organisms or sections of your site. For example, a card may appear on an archive page in a listing as well as in a featured content component.
Button with Dropdown
global/template-parts/molecules/btn-with-dropdown
Button with Modal (mobile only)
global/template-parts/molecules/btn-with-modal
Form: Email
global/template-parts/molecules/form-email
Form: input states across colorways
global/template-parts/atoms/form-input
Form: email
global/template-parts/molecules/form-email/display/form-email--display
Form: Search
global/template-parts/molecules/form-search
Jump Links
global/template-parts/molecules/jumplinks
Pagination
global/template-parts/molecules/pagination
(coming soon)
Policy Notice
global/template-parts/molecules/policy-notice
Section Title
global/template-parts/molecules/section-title
Section Title
Section Title w/description
This is a description of the section title. It can be used to provide more context to the user.
Card: Person Author
global/template-parts/molecules/card--author
Card: Person - minimal
global/template-parts/molecules/card--person-minimal
Card: Person
global/template-parts/molecules/card--person
Card: Person - full bio
global/template-parts/molecules/card--person-full-bio

Role Type
Person Name
Pronouns: she/her
Title
Department
Organization
Card: Action
global/template-parts/molecules/card--action
Card: Common
global/template-parts/molecules/card--common
Card: Featured
global/template-parts/molecules/card--featured
Card title

Card: News
global/template-parts/molecules/card--news
Card: News (md)
global/template-parts/molecules/card--news-md
Card: Press Release
global/template-parts/molecules/card--press-release
Card: Spotlight
global/template-parts/molecules/card--spotlight
Card: Listing News small
global/template-parts/molecules/card--listing--news-sm
Card: Listing
global/template-parts/molecules/card--listing
Card: Listing News
global/template-parts/molecules/card--listing--news
Card: Listing Press
global/template-parts/molecules/card--listing--press
Card title
Card: Listing date-first (sm)
global/template-parts/molecules/card--listing--date-first--small
Filter Collection
global/template-parts/molecules/filter-collection
Components
Components available on all pages. They can be used to build entire page layouts in dynamic ways.
Banner: Global
global/template-parts/organisms/components/banner--global/display/banner--global--display
Freedom is a family value.
Cards: Featured Content
global/template-parts/organisms/components/cards--featured/display/cards--featured--display
Featured
Content Title Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Cards: Latest Content
global/template-parts/organisms/components/cards--latest-content/display/cards--latest-content--display
Latest Content
This is a description of the featured content. It can be used to provide more context to the user.

Card title

Card title
Cards: Featured Case/Legislation
global/template-parts/organisms/components/cards--featured-case-legislation/display/cards--featured-case-legislation--display
Cards: Listing
global/template-parts/organisms/components/cards--listing/display/cards--listing--display
Sample Heading
This is a description of the listing content. It can be used to provide more context to the user.
Cards: Small Date First Listing
global/template-parts/organisms/components/cards--listing--date-first--small/display/cards--listing--date-first--small--display
Cards: News Md
global/template-parts/organisms/components/cards--news-md/display/cards--news-md--display
Sample Heading
This is a description of the listing content. It can be used to provide more context to the user.
Cards: Person (minimal)
global/template-parts/organisms/components/cards--person-minimal/display/cards--person-minimal--display
Person (minimal)
Cards: Related Issues
global/template-parts/organisms/components/cards--related-issues/display/cards--related-issues--display
Related Issues
Carousel: Action Cards
global/template-parts/organisms/components/carousel--action/display/carousel--action--display
Take Action
CTA: Email Capture
global/template-parts/organisms/components/cta--email-capture/display/cta--email-capture--display
Stay Informed
Sign up to be the first to hear about how to take action.
By completing this form, I agree to receive occasional emails per the terms of the ACLU’s privacy statement.
By completing this form, I agree to receive occasional emails per the terms of the ACLU’s privacy statement.
CTA: Alert Bar
global/template-parts/organisms/components/cta--alert-bar/display/cta--alert-bar--display
CTA: Slim
global/template-parts/organisms/components/cta--slim/display/cta--slim--display
If you've been discriminated against based on lorem ipsum dolor sit amet, consectetur est, the ACLU wants to hear about it.
If you've been discriminated against based on lorem ipsum dolor sit amet, consectetur est, the ACLU wants to hear about it.
Hero: Title on Color
global/template-parts/organisms/components/hero--title-on-color/display/hero--title-on-color--display
- Level 1 >
- Level 2 >
- Level 3
Page or Content Title
Without description, breadcrumbs or social.
Page or Content Title
Hero: Title Metadata
global/template-parts/organisms/components/hero--title-metadata/display/hero--title-metadata--display
- Level 1 >
- Level 2 >
- Level 3
Page or Content Title
July 12, 2023 9:45 am
Hero: Homepage
global/template-parts/organisms/components/hero--homepage/display/hero--homepage--display
Email Signup, Blue
Make a local impact
Support ACLU Texas’ Fight for Justice
Your donation amplifies the voice of liberty in Texas. Together, we can champion the causes of equality, freedom, and justice in our own backyard.

Email Signup, Red
Make a local impact
Support ACLU Texas’ Fight for Justice
Your donation amplifies the voice of liberty in Texas. Together, we can champion the causes of equality, freedom, and justice in our own backyard.

Donate, Blue
Make a local impact
Support ACLU Texas’ Fight for Justice
Your donation amplifies the voice of liberty in Texas. Together, we can champion the causes of equality, freedom, and justice in our own backyard.

Donate, Red
Make a local impact
Support ACLU Texas’ Fight for Justice
Your donation amplifies the voice of liberty in Texas. Together, we can champion the causes of equality, freedom, and justice in our own backyard.

Hero: 404 Page
global/template-parts/organisms/components/hero--404/display/hero--404--display
Page Not Found
Sorry, we couldn’t find this page. There may have been a typo or a broken link. Try searching to find what you were looking for.
Some things you can do:

Without buttons.
Page Not Found
Sorry, we couldn’t find this page. There may have been a typo or a broken link. Try searching to find what you were looking for.

Hero: Issue Detail
global/template-parts/organisms/components/hero--issue-detail/display/hero--issue-detail--display
Issue Detail

Issue Detail Hero with Facts.
Issue Detail

What you need to know
Fact 1
Description of Fact 1
Fact 2
Description of Fact 2
Fact 3
Description of Fact 3
Hero: Legislation Detail
global/template-parts/organisms/components/hero--legislation-detail/display/hero--legislation-detail--display
Page or Content Title
- Status: Active
- Bill number: SB 322
- Session: 2023
- Latest Update: July 12, 2023

Hero: Overlay
global/template-parts/organisms/components/hero--overlay/display/hero--overlay--display


Be Known: Supporting Black and LGBTQ+ Communities
Hero: Sidebar
global/template-parts/organisms/components/hero--sidebar/display/hero--sidebar--display
- Home >
- Press Releases
Heading
Medical decisions should be made between patients (and their parents) and their doctors – not politicians. Ask your legislators to support freedom as family value in 2024!
Search Dropdown
global/template-parts/organisms/components/search-dropdown/display/search-dropdown--display
Flexible-components
Flexible-components available on all pages. They can be used to build entire page layouts in dynamic ways.
Accordion
global/template-parts/organisms/flexible-components/accordion/display/accordion--display
Audio
global/template-parts/organisms/flexible-components/audio/display/audio--display
Buttons
global/template-parts/organisms/flexible-components/buttons/display/buttons--display
Content Collection
global/template-parts/organisms/flexible-components/content-collection/display/content-collection--display
Content Collection: Grid Display
Content Collection: List Display

Shut Down the ICE Detention Machine | American Civil Liberties Union
Content Link
global/template-parts/organisms/flexible-components/content-link/display/content-link--display
Divider
global/template-parts/organisms/flexible-components/divider/display/divider--display
Divider style: hr
Divider style: clear
Heading
global/template-parts/organisms/flexible-components/heading/display/heading--display
Heading Two
Heading Two with Colormark on Top
Heading Three
Heading Four
Heading Two
Heading Two with Colormark on Top
Heading Three
Heading Four
Migrated content Heading example
Some migrated content comes in with a hr.mark and h2.with-mark
iFrame
global/template-parts/organisms/flexible-components/iframe/display/iframe--display
Image/Video Collection
global/template-parts/organisms/flexible-components/image-video-collection/display/image-video-collection--display
Image/Video Collection: Grid Display
This is the description for the Image Collection: Grid Display
Image/Video Collection: Carousel Display
This is the description for the Image Collection: Carousel Display
Infogram
global/template-parts/organisms/flexible-components/infogram/display/infogram--display
global/template-parts/organisms/flexible-components/instagram/display/instagram--display
Migrated Content
global/template-parts/organisms/flexible-components/migrated/display/migrated--display
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
|
Notice
global/template-parts/organisms/flexible-components/notice/display/notice--display
Heading text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
- duis mattis
- Vel in ultricies
- vel fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
- Ultrices praesent amet
- Ipsum justo massa
- Eu dolor aliquet risus gravida nunc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
- duis mattis
- Vel in ultricies
- vel fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
- Ultrices praesent amet
- Ipsum justo massa
- Eu dolor aliquet risus gravida nunc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
- duis mattis
- Vel in ultricies
- vel fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
- Ultrices praesent amet
- Ipsum justo massa
- Eu dolor aliquet risus gravida nunc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
- duis mattis
- Vel in ultricies
- vel fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
- Ultrices praesent amet
- Ipsum justo massa
- Eu dolor aliquet risus gravida nunc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Podcast
global/template-parts/organisms/flexible-components/podcast/display/podcast--display
Pull Quote
global/template-parts/organisms/flexible-components/pullquote/display/pullquote--display
The tone should be authoritative yet approachable, encouraging reader engagement and understanding.— - Quote source, full width
The tone should be authoritative yet approachable, encouraging reader engagement and understanding.— - Quote source, aligned left
The tone should be authoritative yet approachable, encouraging reader engagement and understanding.— - Quote source, aligned right
Text
global/template-parts/organisms/flexible-components/text/display/text--display
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
- duis mattis
- Vel in ultricies
- vel fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
- Ultrices praesent amet
- Ipsum justo massa
- Eu dolor aliquet risus gravida nunc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae duis mattis. Vel in ultricies vel fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Ultrices praesent amet ipsum justo massa. Eu dolor aliquet risus gravida nunc at feugiat consequat purus. Non massa enim vitae
- duis mattis
- Vel in ultricies
- vel fringilla.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ullamcorper mattis lorem non. Non massa enim vitae duis mattis.
- Ultrices praesent amet
- Ipsum justo massa
- Eu dolor aliquet risus gravida nunc
Left-aligned, 1/3 width image followed by a Text component
Right-aligned, half width image followed by a Text component
Timeline
global/template-parts/organisms/flexible-components/timeline/display/timeline--display
Public Defense Reform in Idaho: A Timeline
17-year timeline of efforts to reform Idaho's defective public defense system, explaining how we got here.
2008
Uptick in Complaints
ACLU of Idaho begins to track public defense issues in response to an increase in intake complaints.
2010
Public Defense Report Released
National Legal Aid and Defender Association releases a report finding unconstitutional public defense systems in all of the Idaho counties studied. Idaho’s governor-appointed Criminal Justice Commission creates a subcommittee on public defense.
2012
Public Defense Committee Recommended
Idaho Criminal Justice Commission’s Public Defense Subcommittee recommends creating an interim committee of the Idaho Legislature to focus on public defense reform.
2014
Flat-fee Contracts Banned
Idaho legislature bans flat-fee public defense contracts.
2015
Spring 2015: Public Defense Commission Established
Legislature creates a statewide Public Defense Commission with very limited powers.
Summer 2015: Tucker Lawsuit Filed
ACLU, ACLU of Idaho, and Hogan Lovells US LLP file a class action lawsuit in state court against the Governor and Public Defense Commission members over the statewide public defense system.
2016
January 2016: Lawsuit Dismissed, We Appeal
State trial court dismisses our lawsuit on standing, ripeness, and separation of powers grounds. We immediately appeal to the Idaho Supreme Court.
March 2016: Governor Signs Public Defense Reform Bills
These public defense reform bills:
- Allocate $5 million in new funding for public defense, to be distributed in grants by the Public Defense Commission—the first time in Idaho’s history that state funding is appropriated for trial-level public defense.
- Require the statewide Public Defense Commission to promulgate public defense standards.
- Give the Public Defense Commission enforcement authority to hold counties accountable to new public defense standards.
2017
January 2017: New Commission Rules
Public Defense Commission creates new rules that fail to include workload or caseload standards and use permissive rather than mandatory language.
April 2017: Supreme Court Ruling
Idaho Supreme Court rules that ACLU/Hogan Lovells lawsuit should go forward, holding that “the counties have no practical ability to effect statewide change” and so “the State must implement the remedy.”
December 2017: Class Action Oral Arguments
Both sides in the lawsuit argue before the state District Court over whether the case should be certified as a class action.
2024
October 2024: Consolidation of Public Defense System
The State of Idaho assumed responsibility for delivering all public defense services on October 1, 2024, consolidating all public defense in the state under the Office of the State Public Defender (SPD). Previously, public defense was managed at the county level.
December 2024: ACLU Files Emergency Motion
The persistent, uneven, and statewide issues with Idaho’s public defense system prompted our team to file an emergency motion in December of 2024 in the Idaho Supreme Court. The filing details significant flaws in the state’s public defense system.
Quiz
global/template-parts/organisms/flexible-components/quiz/display/quiz--display
Expandable Card
global/template-parts/organisms/flexible-components/shared-expandable-card/display/shared-expandable-card--display
Expandable Card Title
Image
global/template-parts/organisms/flexible-components/single-image/display/single-image--display
Video
global/template-parts/organisms/flexible-components/video/display/video--display
YouTube
global/template-parts/organisms/flexible-components/youtube/display/youtube--display
Social: Share
global/template-parts/molecules/social--share
Social Share