Cards are containers to show content or actions relevant to an app or certain function. They are always the top layer when They are shown in any layout. They can contain other components as part of them, also can have multiple behaviours depending on how they are used in a flow. They appear from the bottom and can be scrollable or fixed depending on their type.

Template/Assets

Standard 2 column Hero module. Text content is on the right. The image on the right can within a circle or a square and can be bordered (below) or the full height of the module and extend to the right side.
This snippet is NOT responsive. Please Use Hero_mobile and Hero_Tablet for the other respective sizes

Standard 2 column Hero module. Text content is on the right. The image on the right can within a circle or a square and can be bordered (below) or the full height of the module and extend to the right side.
This snippet is NOT responsive. Please Use Hero_mobile and Hero_right_dsk for the other respective sizes

Standard 2 column Hero module. Text content is on the right. The image on the right can within a circle or a square and can be bordered (below) or the full height of the module and extend to the right side.
This snippet is NOT responsive. Please Use Hero_mobile and Hero_Tablet for the other respective sizes

Standard centered image module with center text.
This snippet is NOT responsive. Please Use Hero_mobile and Hero_Tablet for the other respective sizes