Stage style page head

Desktop view

The stage page head can be displayed instead of a page headline at the top of a content page.
It consists of the mandatory keyline and optional elements like
- Infoline
- List items with icons (up to 10)
- Button, CTA (one or two)
- Background image
- Action stamp
The text area can be placed on the left hand side of the stage. Different widths and vertical alignments, as well as different font sizes for keylineare available (see examples).
- Keyline font size
  - Large
  - Medium (default)
  - Small
- Text width
  - Medium (default)
  - Small
  - Large
- Text position
  - Top
  - Center
  - Bottom
Optionally, individual words of the infoline can be highlighted in red. If 'inverted' is selcted on 'Theme'-layout higlighted words are bold not red.
Optionally, font in all text elements can be in white color if background image is dark. Make sure readability remains accessible.
Optionaly it is possible to apply the white context box to improve readability of text if needed.
Image
- Ratio
  Requires to insert a 327:167 or 23:8 image (by cropping or by original dimensions) for all viewports
- Minimum resolution
  3840px x 1960px or 3840px x 1336px
Margin below page heads
Hiding the bottom margin allows eliminating white space between page heads that have an image and a Top Level Grid (or other Top Level component) that has a background color.
Only use for these cases.

Use it as an engaging element for your page content.
Choose the right combination of elements, the right message area width and a keylinefont size that best fits your specific message.
Always think mobile! Don’t combine too many elements.
If the text is displayed in front of the image in the desktop view, make sure that it is readable (accessible).