Masthead

A masthead contains global properties such as logotype, navigation and settings in an organized fashion and it is accessible from all parts of the application. All pages should share a common masthead.

Masthead should contain the following components to maintain proper layout and formatting: MastheadToggle, MastheadMain, and MastheadContent.

MastheadMain represents the smaller area taken up by a logo, and will typically contain a MastheadBrand. MastheadContent represents the main portion of the masthead area and will typically contain a Toolbar or other menu-like content such as Dropdown.

Examples

Basic

Basic with mixed content

Display inline

Display stack

Display stack, display inline responsive

Light variant

Light 200 variant

Inset

With icon router link

Props

*required
Name	Type	Default	Description
backgroundColor	'dark' \| 'light' \| 'light200'	'dark'	Background theme color of the masthead
children	React.ReactNode		Content rendered inside of the masthead
className	string		Additional classes added to the masthead
display	{ default?: 'inline' \| 'stack'; sm?: 'inline' \| 'stack'; md?: 'inline' \| 'stack'; lg?: 'inline' \| 'stack'; xl?: 'inline' \| 'stack'; '2xl'?: 'inline' \| 'stack'; }	{ md: 'inline' }	Display type at various breakpoints
inset	{ default?: 'insetNone' \| 'insetXs' \| 'insetSm' \| 'insetMd' \| 'insetLg' \| 'insetXl' \| 'inset2xl' \| 'inset3xl'; sm?: 'insetNone' \| 'insetXs' \| 'insetSm' \| 'insetMd' \| 'insetLg' \| 'insetXl' \| 'inset2xl' \| 'inset3xl'; md?: 'insetNone' \| 'insetXs' \| 'insetSm' \| 'insetMd' \| 'insetLg' \| 'insetXl' \| 'inset2xl' \| 'inset3xl'; lg?: 'insetNone' \| 'insetXs' \| 'insetSm' \| 'insetMd' \| 'insetLg' \| 'insetXl' \| 'inset2xl' \| 'inset3xl'; xl?: 'insetNone' \| 'insetXs' \| 'insetSm' \| 'insetMd' \| 'insetLg' \| 'insetXl' \| 'inset2xl' \| 'inset3xl'; '2xl'?: 'insetNone' \| 'insetXs' \| 'insetSm' \| 'insetMd' \| 'insetLg' \| 'insetXl' \| 'inset2xl' \| 'inset3xl'; }		Insets at various breakpoints

MastheadToggle

*required
Name	Type	Default	Description
children	React.ReactNode		Content rendered inside of the masthead toggle.
className	string		Additional classes added to the masthead toggle.

MastheadMain

*required
Name	Type	Default	Description
children	React.ReactNode		Content rendered inside of the masthead main block.
className	string		Additional classes added to the masthead main.

MastheadBrand

*required
Name	Type	Default	Description
children	React.ReactNode		Content rendered inside of the masthead brand.
className	string		Additional classes added to the masthead brand.
component	React.ElementType<any> \| React.ComponentType<any>	'a'	Component type of the masthead brand.

MastheadContent

*required
Name	Type	Default	Description
children	React.ReactNode		Content rendered inside of the masthead content block.
className	string		Additional classes added to the masthead content.

CSS variables


	.pf-c-masthead.pf-m-light-200	--pf-global--Color--100	#151515
--pf-global--Color--100 --pf-global--Color--dark-100 $pf-global--Color--dark-100 $pf-color-black-900 #151515
	.pf-c-masthead.pf-m-light-200	--pf-global--Color--200	#6a6e73
--pf-global--Color--200 --pf-global--Color--dark-200 $pf-global--Color--dark-200 $pf-color-black-600 #6a6e73
	.pf-c-masthead.pf-m-light-200	--pf-global--BorderColor--100	#d2d2d2
--pf-global--BorderColor--100 --pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 $pf-color-black-300 #d2d2d2
	.pf-c-masthead.pf-m-light-200	--pf-global--primary-color--100	#06c
--pf-global--primary-color--100 --pf-global--primary-color--dark-100 $pf-global--primary-color--dark-100 $pf-color-blue-400 #06c
	.pf-c-masthead.pf-m-light-200	--pf-global--link--Color	#06c
--pf-global--link--Color --pf-global--link--Color--dark $pf-global--link--Color--dark $pf-global--primary-color--100 $pf-color-blue-400 #06c
	.pf-c-masthead.pf-m-light-200	--pf-global--link--Color--hover	#004080
--pf-global--link--Color--hover --pf-global--link--Color--dark--hover $pf-global--link--Color--dark--hover $pf-global--primary-color--200 $pf-color-blue-500 #004080
	.pf-c-masthead.pf-m-light-200	--pf-global--BackgroundColor--100	#fff
--pf-global--BackgroundColor--100 --pf-global--BackgroundColor--light-100 $pf-global--BackgroundColor--light-100 $pf-color-white #fff
	.pf-c-masthead.pf-m-light-200	--pf-c-masthead--BackgroundColor	#f0f0f0
--pf-c-masthead--BackgroundColor --pf-c-masthead--m-light-200--BackgroundColor --pf-global--BackgroundColor--200 $pf-global--BackgroundColor--200 $pf-color-black-200 #f0f0f0
	.pf-c-masthead.pf-m-light-200	--pf-c-masthead__main--BorderBottomColor	#d2d2d2
--pf-c-masthead__main--BorderBottomColor --pf-c-masthead--m-light-200__main--BorderBottomColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--Color--100	#fff
--pf-global--Color--100 --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--Color--200	#f0f0f0
--pf-global--Color--200 --pf-global--Color--light-200 $pf-global--Color--light-200 $pf-color-black-200 #f0f0f0
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--BorderColor--100	#b8bbbe
--pf-global--BorderColor--100 --pf-global--BorderColor--light-100 $pf-global--BorderColor--light-100 $pf-color-black-400 #b8bbbe
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--primary-color--100	#73bcf7
--pf-global--primary-color--100 --pf-global--primary-color--light-100 $pf-global--primary-color--light-100 $pf-color-blue-200 #73bcf7
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--link--Color	#2b9af3
--pf-global--link--Color --pf-global--link--Color--light $pf-global--link--Color--light $pf-global--active-color--300 $pf-color-blue-300 #2b9af3
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--link--Color--hover	#2b9af3
--pf-global--link--Color--hover --pf-global--link--Color--light $pf-global--link--Color--light $pf-global--active-color--300 $pf-color-blue-300 #2b9af3
	.pf-c-masthead .pf-c-button.pf-m-plain	--pf-global--BackgroundColor--100	#151515
--pf-global--BackgroundColor--100 --pf-global--BackgroundColor--dark-100 $pf-global--BackgroundColor--dark-100 $pf-color-black-900 #151515
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-card	--pf-c-card--BackgroundColor	rgba(#030303, .32)
--pf-c-card--BackgroundColor --pf-global--BackgroundColor--dark-transparent-200 $pf-global--BackgroundColor--dark-transparent-200 rgba($pf-color-black-1000, .32) rgba(#030303, .32)
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--Color	#06c
--pf-c-button--m-primary--Color --pf-global--primary-color--dark-100 $pf-global--primary-color--dark-100 $pf-color-blue-400 #06c
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--hover--Color	#06c
--pf-c-button--m-primary--hover--Color --pf-global--primary-color--dark-100 $pf-global--primary-color--dark-100 $pf-color-blue-400 #06c
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--focus--Color	#06c
--pf-c-button--m-primary--focus--Color --pf-global--primary-color--dark-100 $pf-global--primary-color--dark-100 $pf-color-blue-400 #06c
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--active--Color	#06c
--pf-c-button--m-primary--active--Color --pf-global--primary-color--dark-100 $pf-global--primary-color--dark-100 $pf-color-blue-400 #06c
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--BackgroundColor	#fff
--pf-c-button--m-primary--BackgroundColor --pf-global--BackgroundColor--light-100 $pf-global--BackgroundColor--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--hover--BackgroundColor	#f0f0f0
--pf-c-button--m-primary--hover--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 $pf-color-black-200 #f0f0f0
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--focus--BackgroundColor	#f0f0f0
--pf-c-button--m-primary--focus--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 $pf-color-black-200 #f0f0f0
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-primary--active--BackgroundColor	#f0f0f0
--pf-c-button--m-primary--active--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 $pf-color-black-200 #f0f0f0
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--Color	#fff
--pf-c-button--m-secondary--Color --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--hover--Color	#fff
--pf-c-button--m-secondary--hover--Color --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--focus--Color	#fff
--pf-c-button--m-secondary--focus--Color --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--active--Color	#fff
--pf-c-button--m-secondary--active--Color --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--BorderColor	#fff
--pf-c-button--m-secondary--BorderColor --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--hover--BorderColor	#fff
--pf-c-button--m-secondary--hover--BorderColor --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--focus--BorderColor	#fff
--pf-c-button--m-secondary--focus--BorderColor --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button	--pf-c-button--m-secondary--active--BorderColor	#fff
--pf-c-button--m-secondary--active--BorderColor --pf-global--Color--light-100 $pf-global--Color--light-100 $pf-color-white #fff
	.pf-c-masthead	--pf-c-masthead--PaddingLeft	1rem
--pf-c-masthead--PaddingLeft --pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--PaddingRight	1rem
--pf-c-masthead--PaddingRight --pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--BackgroundColor	#151515
--pf-c-masthead--BackgroundColor --pf-global--BackgroundColor--dark-100 $pf-global--BackgroundColor--dark-100 $pf-color-black-900 #151515
	.pf-c-masthead	--pf-c-masthead--inset	1rem
--pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--xl--inset	1.5rem
--pf-c-masthead--xl--inset --pf-global--spacer--lg $pf-global--spacer--lg pf-size-prem(24px) 1.5rem
	.pf-c-masthead	--pf-c-masthead--m-display-stack--GridTemplateColumns	max-content 1fr
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--GridColumn	-1 / 1
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--MinHeight	4.375rem
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--Order	-1
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--FlexBasis	100%
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--PaddingTop	0.5rem
--pf-c-masthead--m-display-stack__main--PaddingTop --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--PaddingBottom	0.5rem
--pf-c-masthead--m-display-stack__main--PaddingBottom --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--MarginRight	0
	.pf-c-masthead	--pf-c-masthead--m-display-stack__main--before--BorderBottom	1px solid #6a6e73
--pf-c-masthead--m-display-stack__main--before--BorderBottom --pf-c-masthead__main--before--BorderBottomWidth solid --pf-c-masthead__main--before--BorderBottomColor --pf-global--BorderWidth--sm solid --pf-global--palette--black-600 $pf-global--BorderWidth--sm solid $pf-color-black-600 1px solid #6a6e73
	.pf-c-masthead	--pf-c-masthead--m-display-stack__toggle--GridColumn	1
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--GridColumn	2
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--MinHeight	auto
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--Order	1
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--PaddingTop	0
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--PaddingBottom	0
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--MarginLeft	0
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight	calc(1rem * -1)
--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead	--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft	calc(1rem * -1)
--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead	--pf-c-masthead--m-display-inline--GridTemplateColumns	max-content max-content 1fr
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--GridColumn	2
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--MinHeight	4.375rem
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--Order	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--FlexBasis	auto
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--PaddingTop	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--PaddingBottom	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--MarginRight	calc(1.5rem / 2)
--pf-c-masthead--m-display-inline__main--MarginRight calc(--pf-global--spacer--lg / 2) calc($pf-global--spacer--lg / 2) calc(pf-size-prem(24px) / 2) calc(1.5rem / 2)
	.pf-c-masthead	--pf-c-masthead--m-display-inline__main--BorderBottom	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__toggle--GridColumn	1
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--GridColumn	3
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--MinHeight	4.375rem
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--Order	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--PaddingTop	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--PaddingBottom	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--MarginLeft	calc(1.5rem / 2)
--pf-c-masthead--m-display-inline__content--MarginLeft calc(--pf-global--spacer--lg / 2) calc($pf-global--spacer--lg / 2) calc(pf-size-prem(24px) / 2) calc(1.5rem / 2)
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight	0
	.pf-c-masthead	--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft	0
	.pf-c-masthead	--pf-c-masthead__main--before--Right	calc(1rem * -1)
--pf-c-masthead__main--before--Right calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead	--pf-c-masthead__main--before--Left	calc(1rem * -1)
--pf-c-masthead__main--before--Left calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead	--pf-c-masthead__main--before--BorderBottomWidth	1px
--pf-c-masthead__main--before--BorderBottomWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-masthead	--pf-c-masthead__main--before--BorderBottomColor	#6a6e73
--pf-c-masthead__main--before--BorderBottomColor --pf-global--palette--black-600 $pf-color-black-600 #6a6e73
	.pf-c-masthead	--pf-c-masthead__toggle--MarginRight	0.5rem
--pf-c-masthead__toggle--MarginRight --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead	--pf-c-masthead__toggle--MarginLeft	calc(1rem * -1)
--pf-c-masthead__toggle--MarginLeft calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead	--pf-c-masthead__toggle--c-button--FontSize	1.5rem
--pf-c-masthead__toggle--c-button--FontSize --pf-global--FontSize--2xl $pf-global--FontSize--2xl pf-font-prem(24px) 1.5rem
	.pf-c-masthead	--pf-c-masthead--m-light--BackgroundColor	#fff
--pf-c-masthead--m-light--BackgroundColor --pf-global--BackgroundColor--100 $pf-global--BackgroundColor--100 $pf-color-white #fff
	.pf-c-masthead	--pf-c-masthead--m-light__main--BorderBottomColor	#f0f0f0
--pf-c-masthead--m-light__main--BorderBottomColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-masthead	--pf-c-masthead--m-light-200--BackgroundColor	#f0f0f0
--pf-c-masthead--m-light-200--BackgroundColor --pf-global--BackgroundColor--200 $pf-global--BackgroundColor--200 $pf-color-black-200 #f0f0f0
	.pf-c-masthead	--pf-c-masthead--m-light-200__main--BorderBottomColor	#d2d2d2
--pf-c-masthead--m-light-200__main--BorderBottomColor --pf-global--BorderColor--100 $pf-global--BorderColor--100 $pf-color-black-300 #d2d2d2
	.pf-c-masthead	--pf-c-masthead--c-toolbar__item--Display	flex
	.pf-c-masthead	--pf-c-masthead--item-border-color--base	#3c3f42
--pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-context-selector--Width	auto
	.pf-c-masthead	--pf-c-masthead--c-context-selector__toggle--BorderTopColor	#3c3f42
--pf-c-masthead--c-context-selector__toggle--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-context-selector__toggle--BorderRightColor	#3c3f42
--pf-c-masthead--c-context-selector__toggle--BorderRightColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-context-selector__toggle--BorderLeftColor	#3c3f42
--pf-c-masthead--c-context-selector__toggle--BorderLeftColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor	transparent
	.pf-c-masthead	--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor	transparent
	.pf-c-masthead	--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor	#3c3f42
--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor	#3c3f42
--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor	#3c3f42
--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor	transparent
	.pf-c-masthead	--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor	transparent
	.pf-c-masthead	--pf-c-masthead--c-menu-toggle--before--BorderTopColor	#3c3f42
--pf-c-masthead--c-menu-toggle--before--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-menu-toggle--before--BorderRightColor	#3c3f42
--pf-c-masthead--c-menu-toggle--before--BorderRightColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-menu-toggle--before--BorderLeftColor	#3c3f42
--pf-c-masthead--c-menu-toggle--before--BorderLeftColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor	transparent
	.pf-c-masthead	--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor	transparent
	.pf-c-masthead	--pf-c-masthead--c-toolbar__content--PaddingRight	0
	.pf-c-masthead	--pf-c-masthead--c-toolbar__content--PaddingLeft	0
	.pf-c-masthead	--pf-c-masthead--c-toolbar__expandable-content--PaddingTop	1rem
--pf-c-masthead--c-toolbar__expandable-content--PaddingTop --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--c-toolbar__expandable-content--PaddingRight	1rem
--pf-c-masthead--c-toolbar__expandable-content--PaddingRight --pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--c-toolbar__expandable-content--PaddingBottom	1rem
--pf-c-masthead--c-toolbar__expandable-content--PaddingBottom --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--c-toolbar__expandable-content--PaddingLeft	1rem
--pf-c-masthead--c-toolbar__expandable-content--PaddingLeft --pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead	--pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth	1px
--pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm 1px
	.pf-c-masthead	--pf-c-masthead--c-toolbar__expandable-content--BorderTopColor	#3c3f42
--pf-c-masthead--c-toolbar__expandable-content--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead	--pf-c-masthead--GridTemplateColumns	max-content 1fr
--pf-c-masthead--GridTemplateColumns --pf-c-masthead--m-display-stack--GridTemplateColumns max-content 1fr
	.pf-c-masthead	--pf-c-masthead__main--GridColumn	-1 / 1
--pf-c-masthead__main--GridColumn --pf-c-masthead--m-display-stack__main--GridColumn -1 / 1
	.pf-c-masthead	--pf-c-masthead__main--MinHeight	4.375rem
--pf-c-masthead__main--MinHeight --pf-c-masthead--m-display-stack__main--MinHeight 4.375rem
	.pf-c-masthead	--pf-c-masthead__main--Order	-1
--pf-c-masthead__main--Order --pf-c-masthead--m-display-stack__main--Order -1
	.pf-c-masthead	--pf-c-masthead__main--FlexBasis	100%
--pf-c-masthead__main--FlexBasis --pf-c-masthead--m-display-stack__main--FlexBasis 100%
	.pf-c-masthead	--pf-c-masthead__main--PaddingTop	0.5rem
--pf-c-masthead__main--PaddingTop --pf-c-masthead--m-display-stack__main--PaddingTop --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead	--pf-c-masthead__main--PaddingBottom	0.5rem
--pf-c-masthead__main--PaddingBottom --pf-c-masthead--m-display-stack__main--PaddingBottom --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead	--pf-c-masthead__main--MarginRight	0
--pf-c-masthead__main--MarginRight --pf-c-masthead--m-display-stack__main--MarginRight 0
	.pf-c-masthead	--pf-c-masthead__main--before--BorderBottom	1px solid #6a6e73
--pf-c-masthead__main--before--BorderBottom --pf-c-masthead--m-display-stack__main--before--BorderBottom --pf-c-masthead__main--before--BorderBottomWidth solid --pf-c-masthead__main--before--BorderBottomColor --pf-global--BorderWidth--sm solid --pf-global--palette--black-600 $pf-global--BorderWidth--sm solid $pf-color-black-600 1px solid #6a6e73
	.pf-c-masthead	--pf-c-masthead__content--GridColumn	2
--pf-c-masthead__content--GridColumn --pf-c-masthead--m-display-stack__content--GridColumn 2
	.pf-c-masthead	--pf-c-masthead__content--MinHeight	auto
--pf-c-masthead__content--MinHeight --pf-c-masthead--m-display-stack__content--MinHeight auto
	.pf-c-masthead	--pf-c-masthead__content--Order	1
--pf-c-masthead__content--Order --pf-c-masthead--m-display-stack__content--Order 1
	.pf-c-masthead	--pf-c-masthead__content--PaddingTop	0
--pf-c-masthead__content--PaddingTop --pf-c-masthead--m-display-stack__content--PaddingTop 0
	.pf-c-masthead	--pf-c-masthead__content--PaddingBottom	0
--pf-c-masthead__content--PaddingBottom --pf-c-masthead--m-display-stack__content--PaddingBottom 0
	.pf-c-masthead	--pf-c-masthead__content--MarginLeft	0
--pf-c-masthead__content--MarginLeft --pf-c-masthead--m-display-stack__content--MarginLeft 0
	.pf-c-masthead	--pf-c-masthead__content--c-nav--m-horizontal--MarginRight	calc(1rem * -1)
--pf-c-masthead__content--c-nav--m-horizontal--MarginRight --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead	--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft	calc(1rem * -1)
--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead.pf-m-light	--pf-c-masthead--BackgroundColor	#fff
--pf-c-masthead--BackgroundColor --pf-c-masthead--m-light--BackgroundColor --pf-global--BackgroundColor--100 $pf-global--BackgroundColor--100 $pf-color-white #fff
	.pf-c-masthead.pf-m-light	--pf-c-masthead__main--BorderBottomColor	#f0f0f0
--pf-c-masthead__main--BorderBottomColor --pf-c-masthead--m-light__main--BorderBottomColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 $pf-color-black-200 #f0f0f0
	.pf-c-masthead .pf-c-toolbar	--pf-c-toolbar__content--PaddingRight	0
--pf-c-toolbar__content--PaddingRight --pf-c-masthead--c-toolbar__content--PaddingRight 0
	.pf-c-masthead .pf-c-toolbar	--pf-c-toolbar__content--PaddingLeft	0
--pf-c-toolbar__content--PaddingLeft --pf-c-masthead--c-toolbar__content--PaddingLeft 0
	.pf-c-masthead .pf-c-toolbar	--pf-c-toolbar__expandable-content--PaddingTop	1rem
--pf-c-toolbar__expandable-content--PaddingTop --pf-c-masthead--c-toolbar__expandable-content--PaddingTop --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead .pf-c-toolbar	--pf-c-toolbar__expandable-content--PaddingRight	1rem
--pf-c-toolbar__expandable-content--PaddingRight --pf-c-masthead--c-toolbar__expandable-content--PaddingRight --pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead .pf-c-toolbar	--pf-c-toolbar__expandable-content--PaddingBottom	1rem
--pf-c-toolbar__expandable-content--PaddingBottom --pf-c-masthead--c-toolbar__expandable-content--PaddingBottom --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead .pf-c-toolbar	--pf-c-toolbar__expandable-content--PaddingLeft	1rem
--pf-c-toolbar__expandable-content--PaddingLeft --pf-c-masthead--c-toolbar__expandable-content--PaddingLeft --pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead .pf-c-menu-toggle	--pf-c-menu-toggle--before--BorderTopColor	#3c3f42
--pf-c-menu-toggle--before--BorderTopColor --pf-c-masthead--c-menu-toggle--before--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-menu-toggle	--pf-c-menu-toggle--before--BorderRightColor	#3c3f42
--pf-c-menu-toggle--before--BorderRightColor --pf-c-masthead--c-menu-toggle--before--BorderRightColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-menu-toggle	--pf-c-menu-toggle--before--BorderLeftColor	#3c3f42
--pf-c-menu-toggle--before--BorderLeftColor --pf-c-masthead--c-menu-toggle--before--BorderLeftColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-menu-toggle.pf-m-full-height	--pf-c-menu-toggle--before--BorderTopColor	transparent
--pf-c-menu-toggle--before--BorderTopColor --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor transparent
	.pf-c-masthead .pf-c-menu-toggle.pf-m-full-height	--pf-c-menu-toggle--before--BorderBottomColor	transparent
--pf-c-menu-toggle--before--BorderBottomColor --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor transparent
	.pf-c-masthead .pf-c-context-selector	--pf-c-context-selector--Width	auto
--pf-c-context-selector--Width --pf-c-masthead--c-context-selector--Width auto
	.pf-c-masthead .pf-c-context-selector	--pf-c-context-selector__toggle--BorderTopColor	#3c3f42
--pf-c-context-selector__toggle--BorderTopColor --pf-c-masthead--c-context-selector__toggle--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-context-selector	--pf-c-context-selector__toggle--BorderRightColor	#3c3f42
--pf-c-context-selector__toggle--BorderRightColor --pf-c-masthead--c-context-selector__toggle--BorderRightColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-context-selector	--pf-c-context-selector__toggle--BorderLeftColor	#3c3f42
--pf-c-context-selector__toggle--BorderLeftColor --pf-c-masthead--c-context-selector__toggle--BorderLeftColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-context-selector.pf-m-full-height	--pf-c-context-selector__toggle--BorderTopColor	transparent
--pf-c-context-selector__toggle--BorderTopColor --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor transparent
	.pf-c-masthead .pf-c-context-selector.pf-m-full-height	--pf-c-context-selector__toggle--BorderBottomColor	transparent
--pf-c-context-selector__toggle--BorderBottomColor --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor transparent
	.pf-c-masthead .pf-c-dropdown	--pf-c-dropdown__toggle--before--BorderTopColor	#3c3f42
--pf-c-dropdown__toggle--before--BorderTopColor --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-dropdown	--pf-c-dropdown__toggle--before--BorderRightColor	#3c3f42
--pf-c-dropdown__toggle--before--BorderRightColor --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-dropdown	--pf-c-dropdown__toggle--before--BorderLeftColor	#3c3f42
--pf-c-dropdown__toggle--before--BorderLeftColor --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor --pf-c-masthead--item-border-color--base --pf-global--palette--black-800 $pf-color-black-800 #3c3f42
	.pf-c-masthead .pf-c-dropdown.pf-m-full-height	--pf-c-dropdown__toggle--before--BorderTopColor	transparent
--pf-c-dropdown__toggle--before--BorderTopColor --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor transparent
	.pf-c-masthead .pf-c-dropdown.pf-m-full-height	--pf-c-dropdown__toggle--before--BorderBottomColor	transparent
--pf-c-dropdown__toggle--before--BorderBottomColor --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor transparent
	.pf-c-masthead__main:last-child	--pf-c-masthead__main--MarginRight	0
	.pf-c-masthead__content:only-child	--pf-c-masthead__content--MarginLeft	0
	.pf-c-masthead__toggle ~ .pf-c-masthead__content	--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft	calc(0 * -1)
--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft calc(--pf-c-masthead__content--MarginLeft * -1) calc(--pf-c-masthead--m-display-stack__content--MarginLeft * -1) calc(0 * -1)
	.pf-c-masthead__toggle .pf-c-button	--pf-c-button--FontSize	1.5rem
--pf-c-button--FontSize --pf-c-masthead__toggle--c-button--FontSize --pf-global--FontSize--2xl $pf-global--FontSize--2xl pf-font-prem(24px) 1.5rem
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead--GridTemplateColumns	max-content 1fr
--pf-c-masthead--GridTemplateColumns --pf-c-masthead--m-display-stack--GridTemplateColumns max-content 1fr
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--GridColumn	-1 / 1
--pf-c-masthead__main--GridColumn --pf-c-masthead--m-display-stack__main--GridColumn -1 / 1
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--MinHeight	4.375rem
--pf-c-masthead__main--MinHeight --pf-c-masthead--m-display-stack__main--MinHeight 4.375rem
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--Order	-1
--pf-c-masthead__main--Order --pf-c-masthead--m-display-stack__main--Order -1
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--FlexBasis	100%
--pf-c-masthead__main--FlexBasis --pf-c-masthead--m-display-stack__main--FlexBasis 100%
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--PaddingTop	0.5rem
--pf-c-masthead__main--PaddingTop --pf-c-masthead--m-display-stack__main--PaddingTop --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--PaddingBottom	0.5rem
--pf-c-masthead__main--PaddingBottom --pf-c-masthead--m-display-stack__main--PaddingBottom --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--MarginRight	0
--pf-c-masthead__main--MarginRight --pf-c-masthead--m-display-stack__main--MarginRight 0
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__main--before--BorderBottom	1px solid #6a6e73
--pf-c-masthead__main--before--BorderBottom --pf-c-masthead--m-display-stack__main--before--BorderBottom --pf-c-masthead__main--before--BorderBottomWidth solid --pf-c-masthead__main--before--BorderBottomColor --pf-global--BorderWidth--sm solid --pf-global--palette--black-600 $pf-global--BorderWidth--sm solid $pf-color-black-600 1px solid #6a6e73
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--GridColumn	2
--pf-c-masthead__content--GridColumn --pf-c-masthead--m-display-stack__content--GridColumn 2
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--MinHeight	auto
--pf-c-masthead__content--MinHeight --pf-c-masthead--m-display-stack__content--MinHeight auto
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--Order	1
--pf-c-masthead__content--Order --pf-c-masthead--m-display-stack__content--Order 1
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--PaddingTop	0
--pf-c-masthead__content--PaddingTop --pf-c-masthead--m-display-stack__content--PaddingTop 0
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--PaddingBottom	0
--pf-c-masthead__content--PaddingBottom --pf-c-masthead--m-display-stack__content--PaddingBottom 0
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--MarginLeft	0
--pf-c-masthead__content--MarginLeft --pf-c-masthead--m-display-stack__content--MarginLeft 0
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--c-nav--m-horizontal--MarginRight	calc(1rem * -1)
--pf-c-masthead__content--c-nav--m-horizontal--MarginRight --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead.pf-m-display-stack	--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft	calc(1rem * -1)
--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft calc(--pf-c-masthead--inset * -1) calc(--pf-global--spacer--md * -1) calc($pf-global--spacer--md * -1) calc(pf-size-prem(16px) * -1) calc(1rem * -1)
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead--GridTemplateColumns	max-content max-content 1fr
--pf-c-masthead--GridTemplateColumns --pf-c-masthead--m-display-inline--GridTemplateColumns max-content max-content 1fr
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--GridColumn	2
--pf-c-masthead__main--GridColumn --pf-c-masthead--m-display-inline__main--GridColumn 2
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--MinHeight	4.375rem
--pf-c-masthead__main--MinHeight --pf-c-masthead--m-display-inline__main--MinHeight 4.375rem
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--Order	0
--pf-c-masthead__main--Order --pf-c-masthead--m-display-inline__main--Order 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--FlexBasis	auto
--pf-c-masthead__main--FlexBasis --pf-c-masthead--m-display-inline__main--FlexBasis auto
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--PaddingTop	0
--pf-c-masthead__main--PaddingTop --pf-c-masthead--m-display-inline__main--PaddingTop 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--PaddingBottom	0
--pf-c-masthead__main--PaddingBottom --pf-c-masthead--m-display-inline__main--PaddingBottom 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--MarginRight	calc(1.5rem / 2)
--pf-c-masthead__main--MarginRight --pf-c-masthead--m-display-inline__main--MarginRight calc(--pf-global--spacer--lg / 2) calc($pf-global--spacer--lg / 2) calc(pf-size-prem(24px) / 2) calc(1.5rem / 2)
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__main--before--BorderBottom	0
--pf-c-masthead__main--before--BorderBottom --pf-c-masthead--m-display-inline__main--BorderBottom 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--GridColumn	3
--pf-c-masthead__content--GridColumn --pf-c-masthead--m-display-inline__content--GridColumn 3
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--MinHeight	4.375rem
--pf-c-masthead__content--MinHeight --pf-c-masthead--m-display-inline__content--MinHeight 4.375rem
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--Order	0
--pf-c-masthead__content--Order --pf-c-masthead--m-display-inline__content--Order 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--PaddingTop	0
--pf-c-masthead__content--PaddingTop --pf-c-masthead--m-display-inline__content--PaddingTop 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--PaddingBottom	0
--pf-c-masthead__content--PaddingBottom --pf-c-masthead--m-display-inline__content--PaddingBottom 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--MarginLeft	calc(1.5rem / 2)
--pf-c-masthead__content--MarginLeft --pf-c-masthead--m-display-inline__content--MarginLeft calc(--pf-global--spacer--lg / 2) calc($pf-global--spacer--lg / 2) calc(pf-size-prem(24px) / 2) calc(1.5rem / 2)
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--c-nav--m-horizontal--MarginRight	0
--pf-c-masthead__content--c-nav--m-horizontal--MarginRight --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight 0
	.pf-c-masthead.pf-m-display-inline	--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft	0
--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft 0
	.pf-c-masthead.pf-m-inset-none	--pf-c-masthead--inset	0
	.pf-c-masthead.pf-m-inset-sm	--pf-c-masthead--inset	0.5rem
--pf-c-masthead--inset --pf-global--spacer--sm $pf-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-c-masthead.pf-m-inset-md	--pf-c-masthead--inset	1rem
--pf-c-masthead--inset --pf-global--spacer--md $pf-global--spacer--md pf-size-prem(16px) 1rem
	.pf-c-masthead.pf-m-inset-lg	--pf-c-masthead--inset	1.5rem
--pf-c-masthead--inset --pf-global--spacer--lg $pf-global--spacer--lg pf-size-prem(24px) 1.5rem
	.pf-c-masthead.pf-m-inset-xl	--pf-c-masthead--inset	2rem
--pf-c-masthead--inset --pf-global--spacer--xl $pf-global--spacer--xl pf-size-prem(32px) 2rem
	.pf-c-masthead.pf-m-inset-2xl	--pf-c-masthead--inset	3rem
--pf-c-masthead--inset --pf-global--spacer--2xl $pf-global--spacer--2xl pf-size-prem(48px) 3rem

View source on GitHub

QUICKLINKS

CONTRIBUTE

STAY IN TOUCH

Privacy statement Terms of use All policies and guidelines