HTML Navigation Navigation is used to organize an application’s structure and content, making it easy to find information and accomplish tasks. Navigation communicates relationships, context, and actions a user can take within an application. Related design guidelines: Navigation system
Examples Documentation CSS Variables Link 1 Current and expanded example sub-navigation Link 2 Expanded, but not current example sub-navigation The navigation system relies on several different sub-components:
.pf-c-nav__list - default navigation list. It is the basis for both default and expandable, vertical navigation..pf-c-nav__simple-list - nav list simple is used within .pf-c-nav__subnav in expandable navigation..pf-c-nav__horizontal-list - nav list horizontal is a shareable component that can be used within the page header, as primary navigation, or as tertiary navigation, when expandable, vertical navigation is implemented..pf-c-nav__tertiary-list - nav list tertiary is a component that can be used within <main>, as third level navigation (tertiary navigation), when expandable, vertical navigation is implemented.Attribute Applied to Outcome aria-label="[landmark description]".pf-c-navDescribes <nav> landmark. aria-labelledby="[id value of link describing subnav]".pf-c-nav__subnavGives the subnav <section> landmark an accessible name by referring to the element that provides the subnav <section> landmark title. aria-expanded="false".pf-c-nav__linkIndicates that subnav section is hidden. aria-expanded="true".pf-c-nav__linkIndicates that subnav section is visible. hidden.pf-c-nav__subnavIndicates that the subnav section is hidden so that it isn't visible in the UI and isn't accessed by assistive technologies. disabled.pf-c-nav__scroll-buttonIndicates that a scroll button is disabled, when at the first or last item of a list. Required when disabled aria-current="page".pf-c-nav__linkIndicates the current page link. Can only occur once on page.
Class Applied to Outcome .pf-c-nav<nav>Initiates a primary nav element. .pf-c-nav__subnav<section>Initiates a subnav section. .pf-c-nav__list<ul>Initiates default nav list. .pf-c-nav__simple-list<ul>Initiates simple nav list. .pf-c-nav__item<li>Initiates default nav list item. .pf-c-nav__scroll-button<button>Intitiates a nav scroll button. Required for horizontal navs .pf-c-nav__link<a>Initiates default nav list link. .pf-c-nav__section<section>Initiates a nav section element. .pf-c-nav__section-title<h1>, <h2>, <h3>, <h4>, <h5>, <h6>Initiates a nav section title. .pf-c-nav__toggle<span>Initiates a chevron indicating expandability of a pf-c-nav__list-link. .pf-c-nav__toggle-icon<span>Initiates a nav toggle icon wrapper. .pf-m-scrollable.pf-c-navModifies nav for the scrollable state. .pf-m-light.pf-c-navModifies nav for the light variation. Note: only for use with vertical navs, and requires .pf-m-light on the page component's sidebar element (.pf-c-page__sidebar) . .pf-m-expandable.pf-c-nav__itemModifies for the expandable state. .pf-m-expanded.pf-c-nav__itemModifies for the expanded state. .pf-m-current.pf-c-nav__linkModifies for the current state. .pf-m-start.pf-c-navModifiers the nav to show the overflow at the start. .pf-m-end.pf-c-navModifiers the nav to show the overflow at the end.
Selector Variable React Token Value .pf-c-nav --pf-c-nav--Transition all 250ms cubic-bezier(.42, 0, .58, 1)
--pf-c-nav--Transition
all 250ms cubic-bezier(.42, 0, .58, 1) .pf-c-nav --pf-c-nav__item--m-expanded__toggle-icon--Transform .pf-c-nav --pf-c-nav--m-light__item--before--BorderColor --pf-c-nav--m-light__item--before--BorderColor
--pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav --pf-c-nav--m-light__item--m-current--not--m-expanded__link--BackgroundColor --pf-c-nav--m-light__item--m-current--not--m-expanded__link--BackgroundColor
--pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav --pf-c-nav--m-light__link--Color --pf-c-nav--m-light__link--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav--m-light__link--hover--Color --pf-c-nav--m-light__link--hover--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav--m-light__link--focus--Color --pf-c-nav--m-light__link--focus--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav--m-light__link--active--Color --pf-c-nav--m-light__link--active--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav--m-light__link--m-current--Color --pf-c-nav--m-light__link--m-current--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav--m-light__link--hover--BackgroundColor --pf-c-nav--m-light__link--hover--BackgroundColor
--pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav --pf-c-nav--m-light__link--focus--BackgroundColor --pf-c-nav--m-light__link--focus--BackgroundColor
--pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav --pf-c-nav--m-light__link--active--BackgroundColor --pf-c-nav--m-light__link--active--BackgroundColor
--pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav --pf-c-nav--m-light__link--m-current--BackgroundColor --pf-c-nav--m-light__link--m-current--BackgroundColor
--pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav --pf-c-nav--m-light__link--before--BorderColor --pf-c-nav--m-light__link--before--BorderColor
--pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav --pf-c-nav--m-light__link--after--BorderColor --pf-c-nav--m-light__link--after--BorderColor
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav--m-light__subnav__link--m-current--after--BorderColor --pf-c-nav--m-light__subnav__link--m-current--after--BorderColor
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav--m-light__section-title--Color --pf-c-nav--m-light__section-title--Color
--pf-global--Color--dark-200 $pf-global--Color--dark-200 .pf-c-nav --pf-c-nav--m-light__section-title--BorderBottomColor --pf-c-nav--m-light__section-title--BorderBottomColor
--pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav --pf-c-nav--m-light__subnav__link--hover--after--BorderColor --pf-c-nav--m-light__subnav__link--hover--after--BorderColor
--pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 .pf-c-nav --pf-c-nav--m-light__subnav__link--focus--after--BorderColor --pf-c-nav--m-light__subnav__link--focus--after--BorderColor
--pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 .pf-c-nav --pf-c-nav--m-light__subnav__link--active--after--BorderColor --pf-c-nav--m-light__subnav__link--active--after--BorderColor
--pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 .pf-c-nav --pf-c-nav--m-light--c-divider--BackgroundColor --pf-c-nav--m-light--c-divider--BackgroundColor
--pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav --pf-c-nav__item--m-expanded__toggle--Transform .pf-c-nav --pf-c-nav__item--m-current--not--m-expanded__link--BackgroundColor --pf-c-nav__item--m-current--not--m-expanded__link--BackgroundColor
--pf-global--BackgroundColor--dark-400 $pf-global--BackgroundColor--dark-400 .pf-c-nav --pf-c-nav__link--m-current--not--m-expanded__link--after--BorderWidth --pf-c-nav__link--m-current--not--m-expanded__link--after--BorderWidth
--pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav --pf-c-nav__item--before--BorderColor --pf-c-nav__item--before--BorderColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__item--before--BorderWidth --pf-c-nav__item--before--BorderWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__link--FontSize --pf-c-nav__link--FontSize
--pf-global--FontSize--md .pf-c-nav --pf-c-nav__link--FontWeight --pf-c-nav__link--FontWeight
--pf-global--FontWeight--normal $pf-global--FontWeight--normal .pf-c-nav --pf-c-nav__link--PaddingTop --pf-c-nav__link--PaddingTop
.pf-c-nav --pf-c-nav__link--PaddingRight --pf-c-nav__link--PaddingRight
.pf-c-nav --pf-c-nav__link--PaddingBottom --pf-c-nav__link--PaddingBottom
.pf-c-nav --pf-c-nav__link--PaddingLeft --pf-c-nav__link--PaddingLeft
.pf-c-nav --pf-c-nav__link--xl--PaddingRight --pf-c-nav__link--xl--PaddingRight
.pf-c-nav --pf-c-nav__link--xl--PaddingLeft --pf-c-nav__link--xl--PaddingLeft
.pf-c-nav --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__link--hover--Color --pf-c-nav__link--hover--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__link--focus--Color --pf-c-nav__link--focus--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__link--active--Color --pf-c-nav__link--active--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__link--m-current--Color --pf-c-nav__link--m-current--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__link--BackgroundColor .pf-c-nav --pf-c-nav__link--hover--BackgroundColor --pf-c-nav__link--hover--BackgroundColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__link--focus--BackgroundColor --pf-c-nav__link--focus--BackgroundColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__link--active--BackgroundColor --pf-c-nav__link--active--BackgroundColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__link--m-current--BackgroundColor --pf-c-nav__link--m-current--BackgroundColor
--pf-global--BackgroundColor--dark-400 $pf-global--BackgroundColor--dark-400 .pf-c-nav --pf-c-nav__link--OutlineOffset --pf-c-nav__link--OutlineOffset
calc(--pf-global--spacer--xs * -1) calc($pf-global--spacer--xs * -1) calc(pf-size-prem(4px) * -1) .pf-c-nav --pf-c-nav__link--before--BorderColor --pf-c-nav__link--before--BorderColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__link--m-current--before--BorderWidth .pf-c-nav --pf-c-nav__link--after--BorderColor --pf-c-nav__link--after--BorderColor
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__link--after--BorderWidth --pf-c-nav__link--after--BorderWidth
--pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav --pf-c-nav__link--after--BorderBottomWidth .pf-c-nav --pf-c-nav__link--after--BorderLeftWidth .pf-c-nav --pf-c-nav__link--m-current--after--BorderWidth --pf-c-nav__link--m-current--after--BorderWidth
--pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav --pf-c-nav__simple-list__link--MarginTop --pf-c-nav__simple-list__link--MarginTop
.pf-c-nav --pf-c-nav__simple-list__link--MarginBottom --pf-c-nav__simple-list__link--MarginBottom
.pf-c-nav --pf-c-nav__simple-list__link--PaddingTop --pf-c-nav__simple-list__link--PaddingTop
.pf-c-nav --pf-c-nav__simple-list__link--PaddingRight --pf-c-nav__simple-list__link--PaddingRight
.pf-c-nav --pf-c-nav__simple-list__link--PaddingBottom --pf-c-nav__simple-list__link--PaddingBottom
.pf-c-nav --pf-c-nav__simple-list__link--PaddingLeft --pf-c-nav__simple-list__link--PaddingLeft
.pf-c-nav --pf-c-nav__simple-list__link--xl--PaddingRight --pf-c-nav__simple-list__link--xl--PaddingRight
.pf-c-nav --pf-c-nav__simple-list__link--xl--PaddingLeft --pf-c-nav__simple-list__link--xl--PaddingLeft
.pf-c-nav --pf-c-nav__simple-list__link--Color --pf-c-nav__simple-list__link--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav__simple-list__link--m-current--after--BorderWidth --pf-c-nav__simple-list__link--m-current--after--BorderWidth
--pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav --pf-c-nav__horizontal-list__link--PaddingTop --pf-c-nav__horizontal-list__link--PaddingTop
.pf-c-nav --pf-c-nav__horizontal-list__link--PaddingRight --pf-c-nav__horizontal-list__link--PaddingRight
.pf-c-nav --pf-c-nav__horizontal-list__link--PaddingBottom --pf-c-nav__horizontal-list__link--PaddingBottom
.pf-c-nav --pf-c-nav__horizontal-list__link--PaddingLeft --pf-c-nav__horizontal-list__link--PaddingLeft
.pf-c-nav --pf-c-nav__horizontal-list__link--lg--PaddingTop --pf-c-nav__horizontal-list__link--lg--PaddingTop
.pf-c-nav --pf-c-nav__horizontal-list__link--lg--PaddingBottom --pf-c-nav__horizontal-list__link--lg--PaddingBottom
.pf-c-nav --pf-c-nav__horizontal-list__link--Color --pf-c-nav__horizontal-list__link--Color
--pf-global--Color--light-300 $pf-global--Color--light-300 .pf-c-nav --pf-c-nav__horizontal-list__link--hover--Color --pf-c-nav__horizontal-list__link--hover--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__horizontal-list__link--focus--Color --pf-c-nav__horizontal-list__link--focus--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__horizontal-list__link--active--Color --pf-c-nav__horizontal-list__link--active--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__horizontal-list__link--m-current--Color --pf-c-nav__horizontal-list__link--m-current--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__horizontal-list__link--BackgroundColor .pf-c-nav --pf-c-nav__horizontal-list__link--hover--BackgroundColor .pf-c-nav --pf-c-nav__horizontal-list__link--focus--BackgroundColor .pf-c-nav --pf-c-nav__horizontal-list__link--active--BackgroundColor .pf-c-nav --pf-c-nav__horizontal-list__link--m-current--BackgroundColor .pf-c-nav --pf-c-nav__horizontal-list__link--before--BorderColor --pf-c-nav__horizontal-list__link--before--BorderColor
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__horizontal-list__link--before--BorderWidth .pf-c-nav --pf-c-nav__horizontal-list__link--hover--before--BorderWidth --pf-c-nav__horizontal-list__link--hover--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__horizontal-list__link--focus--before--BorderWidth --pf-c-nav__horizontal-list__link--focus--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__horizontal-list__link--active--before--BorderWidth --pf-c-nav__horizontal-list__link--active--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__horizontal-list__link--m-current--before--BorderWidth --pf-c-nav__horizontal-list__link--m-current--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__tertiary-list__link--PaddingTop --pf-c-nav__tertiary-list__link--PaddingTop
.pf-c-nav --pf-c-nav__tertiary-list__link--PaddingRight --pf-c-nav__tertiary-list__link--PaddingRight
.pf-c-nav --pf-c-nav__tertiary-list__link--PaddingBottom --pf-c-nav__tertiary-list__link--PaddingBottom
.pf-c-nav --pf-c-nav__tertiary-list__link--PaddingLeft --pf-c-nav__tertiary-list__link--PaddingLeft
.pf-c-nav --pf-c-nav__tertiary-list__link--Color --pf-c-nav__tertiary-list__link--Color
--pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav --pf-c-nav__tertiary-list__link--hover--Color --pf-c-nav__tertiary-list__link--hover--Color
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav__tertiary-list__link--focus--Color --pf-c-nav__tertiary-list__link--focus--Color
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav__tertiary-list__link--active--Color --pf-c-nav__tertiary-list__link--active--Color
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav__tertiary-list__link--m-current--Color --pf-c-nav__tertiary-list__link--m-current--Color
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav__tertiary-list__link--BackgroundColor .pf-c-nav --pf-c-nav__tertiary-list__link--hover--BackgroundColor .pf-c-nav --pf-c-nav__tertiary-list__link--focus--BackgroundColor .pf-c-nav --pf-c-nav__tertiary-list__link--active--BackgroundColor .pf-c-nav --pf-c-nav__tertiary-list__link--m-current--BackgroundColor .pf-c-nav --pf-c-nav__tertiary-list__link--before--BorderColor --pf-c-nav__tertiary-list__link--before--BorderColor
--pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav --pf-c-nav__tertiary-list__link--before--BorderWidth .pf-c-nav --pf-c-nav__tertiary-list__link--hover--before--BorderWidth --pf-c-nav__tertiary-list__link--hover--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__tertiary-list__link--focus--before--BorderWidth --pf-c-nav__tertiary-list__link--focus--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__tertiary-list__link--active--before--BorderWidth --pf-c-nav__tertiary-list__link--active--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__tertiary-list__link--m-current--before--BorderWidth --pf-c-nav__tertiary-list__link--m-current--before--BorderWidth
--pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav --pf-c-nav__subnav--PaddingBottom --pf-c-nav__subnav--PaddingBottom
.pf-c-nav --pf-c-nav__subnav--xl--PaddingLeft --pf-c-nav__subnav--xl--PaddingLeft
--pf-c-nav__link--PaddingLeft .pf-c-nav --pf-c-nav__subnav__link--FontSize --pf-c-nav__subnav__link--FontSize
--pf-global--FontSize--sm .pf-c-nav --pf-c-nav__subnav__link--hover--after--BorderColor --pf-c-nav__subnav__link--hover--after--BorderColor
--pf-global--BorderColor--200 $pf-global--BorderColor--200 .pf-c-nav --pf-c-nav__subnav__link--focus--after--BorderColor --pf-c-nav__subnav__link--focus--after--BorderColor
--pf-global--BorderColor--200 $pf-global--BorderColor--200 .pf-c-nav --pf-c-nav__subnav__link--active--after--BorderColor --pf-c-nav__subnav__link--active--after--BorderColor
--pf-global--BorderColor--200 $pf-global--BorderColor--200 .pf-c-nav --pf-c-nav__subnav__link--m-current--after--BorderColor --pf-c-nav__subnav__link--m-current--after--BorderColor
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__subnav__link--hover--after--BorderWidth --pf-c-nav__subnav__link--hover--after--BorderWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__subnav__link--focus--after--BorderWidth --pf-c-nav__subnav__link--focus--after--BorderWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__subnav__link--active--after--BorderWidth --pf-c-nav__subnav__link--active--after--BorderWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__subnav__link--m-current--after--BorderWidth --pf-c-nav__subnav__link--m-current--after--BorderWidth
--pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav --pf-c-nav__subnav--MaxHeight .pf-c-nav --pf-c-nav--subnav__simple-list__link--MarginTop .pf-c-nav --pf-c-nav--subnav__simple-list__link--MarginBottom .pf-c-nav --pf-c-nav__subnav__simple-list__link--PaddingRight --pf-c-nav__subnav__simple-list__link--PaddingRight
.pf-c-nav --pf-c-nav__subnav__simple-list__link--PaddingLeft --pf-c-nav__subnav__simple-list__link--PaddingLeft
.pf-c-nav --pf-c-nav__item--m-expanded__subnav--MaxHeight .pf-c-nav --pf-c-nav__section--MarginTop --pf-c-nav__section--MarginTop
.pf-c-nav --pf-c-nav__section--section--MarginTop --pf-c-nav__section--section--MarginTop
.pf-c-nav --pf-c-nav__section-title--PaddingTop --pf-c-nav__section-title--PaddingTop
.pf-c-nav --pf-c-nav__section-title--PaddingRight --pf-c-nav__section-title--PaddingRight
.pf-c-nav --pf-c-nav__section-title--PaddingBottom --pf-c-nav__section-title--PaddingBottom
.pf-c-nav --pf-c-nav__section-title--PaddingLeft --pf-c-nav__section-title--PaddingLeft
.pf-c-nav --pf-c-nav__section-title--xl--PaddingRight --pf-c-nav__section-title--xl--PaddingRight
.pf-c-nav --pf-c-nav__section-title--xl--PaddingLeft --pf-c-nav__section-title--xl--PaddingLeft
.pf-c-nav --pf-c-nav__section-title--FontSize --pf-c-nav__section-title--FontSize
--pf-global--FontSize--sm .pf-c-nav --pf-c-nav__section-title--Color --pf-c-nav__section-title--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__section-title--BorderBottomColor --pf-c-nav__section-title--BorderBottomColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__section-title--BorderBottomWidth --pf-c-nav__section-title--BorderBottomWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__scroll-button--Color --pf-c-nav__scroll-button--Color
--pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav --pf-c-nav__scroll-button--hover--Color --pf-c-nav__scroll-button--hover--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__scroll-button--focus--Color --pf-c-nav__scroll-button--focus--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__scroll-button--active--Color --pf-c-nav__scroll-button--active--Color
--pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav --pf-c-nav__scroll-button--disabled--Color --pf-c-nav__scroll-button--disabled--Color
--pf-global--disabled-color--100 $pf-global--disabled-color--100 .pf-c-nav --pf-c-nav__scroll-button--BackgroundColor .pf-c-nav --pf-c-nav__scroll-button--Width --pf-c-nav__scroll-button--Width
--pf-global--target-size--MinWidth $pf-global--target-size--MinWidth .pf-c-nav --pf-c-nav__scroll-button--OutlineOffset --pf-c-nav__scroll-button--OutlineOffset
calc(-1 * --pf-global--spacer--xs) calc(-1 * $pf-global--spacer--xs) calc(-1 * pf-size-prem(4px)) .pf-c-nav --pf-c-nav__scroll-button--Transition margin .125s, transform .125s, opacity .125s
.pf-c-nav --pf-c-nav__scroll-button--before--BorderColor --pf-c-nav__scroll-button--before--BorderColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav --pf-c-nav__scroll-button--before--BorderWidth --pf-c-nav__scroll-button--before--BorderWidth
--pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav --pf-c-nav__scroll-button--before--BorderRightWidth .pf-c-nav --pf-c-nav__scroll-button--before--BorderLeftWidth .pf-c-nav --pf-c-nav__scroll-button--disabled--before--BorderColor .pf-c-nav --pf-c-nav__toggle--PaddingRight --pf-c-nav__toggle--PaddingRight
.pf-c-nav --pf-c-nav__toggle--PaddingLeft --pf-c-nav__toggle--PaddingLeft
.pf-c-nav --pf-c-nav__toggle--FontSize --pf-c-nav__toggle--FontSize
--pf-global--icon--FontSize--md $pf-global--icon--FontSize--md .pf-c-nav --pf-c-nav__toggle-icon--Transition --pf-c-nav__toggle-icon--Transition
--pf-global--TransitionDuration $pf-global--TransitionDuration .pf-c-nav --pf-c-nav--c-divider--MarginTop --pf-c-nav--c-divider--MarginTop
.pf-c-nav --pf-c-nav--c-divider--MarginBottom --pf-c-nav--c-divider--MarginBottom
.pf-c-nav --pf-c-nav--c-divider--PaddingRight .pf-c-nav --pf-c-nav--c-divider--PaddingLeft .pf-c-nav --pf-c-nav--c-divider--BackgroundColor --pf-c-nav--c-divider--BackgroundColor
--pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav.pf-m-light --pf-c-nav__item--before--BorderColor --pf-c-nav__item--before--BorderColor
--pf-c-nav--m-light__item--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav.pf-m-light --pf-c-nav__item--m-current--not--m-expanded__link--BackgroundColor --pf-c-nav__item--m-current--not--m-expanded__link--BackgroundColor
--pf-c-nav--m-light__item--m-current--not--m-expanded__link--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav.pf-m-light --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav--m-light__link--Color --pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__link--hover--Color --pf-c-nav__link--hover--Color
--pf-c-nav--m-light__link--hover--Color --pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__link--focus--Color --pf-c-nav__link--focus--Color
--pf-c-nav--m-light__link--focus--Color --pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__link--active--Color --pf-c-nav__link--active--Color
--pf-c-nav--m-light__link--active--Color --pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__link--m-current--Color --pf-c-nav__link--m-current--Color
--pf-c-nav--m-light__link--m-current--Color --pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__link--hover--BackgroundColor --pf-c-nav__link--hover--BackgroundColor
--pf-c-nav--m-light__link--hover--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav.pf-m-light --pf-c-nav__link--focus--BackgroundColor --pf-c-nav__link--focus--BackgroundColor
--pf-c-nav--m-light__link--focus--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav.pf-m-light --pf-c-nav__link--active--BackgroundColor --pf-c-nav__link--active--BackgroundColor
--pf-c-nav--m-light__link--active--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav.pf-m-light --pf-c-nav__link--m-current--BackgroundColor --pf-c-nav__link--m-current--BackgroundColor
--pf-c-nav--m-light__link--m-current--BackgroundColor --pf-global--BackgroundColor--light-300 $pf-global--BackgroundColor--light-300 .pf-c-nav.pf-m-light --pf-c-nav__link--before--BorderColor --pf-c-nav__link--before--BorderColor
--pf-c-nav--m-light__link--before--BorderColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav.pf-m-light --pf-c-nav__link--after--BorderColor --pf-c-nav__link--after--BorderColor
--pf-c-nav--m-light__link--after--BorderColor --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav.pf-m-light --pf-c-nav__subnav__link--hover--after--BorderColor --pf-c-nav__subnav__link--hover--after--BorderColor
--pf-c-nav--m-light__subnav__link--hover--after--BorderColor --pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__subnav__link--focus--after--BorderColor --pf-c-nav__subnav__link--focus--after--BorderColor
--pf-c-nav--m-light__subnav__link--focus--after--BorderColor --pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__subnav__link--active--after--BorderColor --pf-c-nav__subnav__link--active--after--BorderColor
--pf-c-nav--m-light__subnav__link--active--after--BorderColor --pf-global--BorderColor--dark-100 $pf-global--BorderColor--dark-100 .pf-c-nav.pf-m-light --pf-c-nav__subnav__link--m-current--after--BorderColor --pf-c-nav__subnav__link--m-current--after--BorderColor
--pf-c-nav--m-light__subnav__link--m-current--after--BorderColor --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav.pf-m-light --pf-c-nav__section-title--Color --pf-c-nav__section-title--Color
--pf-c-nav--m-light__section-title--Color --pf-global--Color--dark-200 $pf-global--Color--dark-200 .pf-c-nav.pf-m-light --pf-c-nav__section-title--BorderBottomColor --pf-c-nav__section-title--BorderBottomColor
--pf-c-nav--m-light__section-title--BorderBottomColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav.pf-m-light .pf-c-divider --pf-c-divider--after--BackgroundColor --pf-c-divider--after--BackgroundColor
--pf-c-nav--m-light--c-divider--BackgroundColor --pf-global--BorderColor--300 $pf-global--BorderColor--300 .pf-c-nav .pf-c-divider --pf-c-divider--after--BackgroundColor --pf-c-divider--after--BackgroundColor
--pf-c-nav--c-divider--BackgroundColor --pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav__item.pf-m-expandable --pf-c-nav__link--before--BorderBottomWidth .pf-c-nav__item.pf-m-current:not(.pf-m-expanded) --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__item--m-current--not--m-expanded__link--BackgroundColor --pf-global--BackgroundColor--dark-400 $pf-global--BackgroundColor--dark-400 .pf-c-nav__item.pf-m-current:not(.pf-m-expanded) --pf-c-nav__link--after--BorderLeftWidth --pf-c-nav__link--after--BorderLeftWidth
--pf-c-nav__link--m-current--not--m-expanded__link--after--BorderWidth --pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav__link:hover --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav__link--hover--Color --pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav__link:hover --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__link--hover--BackgroundColor --pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav__link:focus --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav__link--focus--Color --pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav__link:focus --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__link--focus--BackgroundColor --pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav__link:active --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav__link--active--Color --pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav__link:active --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__link--active--BackgroundColor --pf-global--BackgroundColor--dark-200 $pf-global--BackgroundColor--dark-200 .pf-c-nav__link.pf-m-current --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav__link--m-current--Color --pf-global--Color--light-100 $pf-global--Color--light-100 .pf-c-nav__link.pf-m-current --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__link--m-current--BackgroundColor --pf-global--BackgroundColor--dark-400 $pf-global--BackgroundColor--dark-400 .pf-c-nav__link.pf-m-current --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__link--m-current--before--BorderWidth .pf-c-nav__link.pf-m-current --pf-c-nav__link--after--BorderLeftWidth --pf-c-nav__link--after--BorderLeftWidth
--pf-c-nav__link--m-current--after--BorderWidth --pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav__simple-list --pf-c-nav__link--PaddingTop --pf-c-nav__link--PaddingTop
--pf-c-nav__simple-list__link--PaddingTop .pf-c-nav__simple-list --pf-c-nav__link--PaddingRight --pf-c-nav__link--PaddingRight
--pf-c-nav__simple-list__link--PaddingRight .pf-c-nav__simple-list --pf-c-nav__link--PaddingBottom --pf-c-nav__link--PaddingBottom
--pf-c-nav__simple-list__link--PaddingBottom .pf-c-nav__simple-list --pf-c-nav__link--PaddingLeft --pf-c-nav__link--PaddingLeft
--pf-c-nav__simple-list__link--PaddingLeft .pf-c-nav__simple-list --pf-c-nav__link--FontSize --pf-c-nav__link--FontSize
--pf-c-nav__simple-list__link--FontSize --pf-c-nav__subnav__link--FontSize --pf-global--FontSize--sm .pf-c-nav__simple-list --pf-c-nav__link--before--BorderColor .pf-c-nav__simple-list --pf-c-nav__link--m-current--after--BorderWidth --pf-c-nav__link--m-current--after--BorderWidth
--pf-c-nav__simple-list__link--m-current--after--BorderWidth --pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav__simple-list --pf-c-nav--c-divider--PaddingRight --pf-c-nav--c-divider--PaddingRight
--pf-c-nav__simple-list__link--PaddingRight .pf-c-nav__simple-list --pf-c-nav--c-divider--PaddingLeft --pf-c-nav--c-divider--PaddingLeft
--pf-c-nav__simple-list__link--PaddingLeft .pf-c-nav__horizontal-list --pf-c-nav__link--Right --pf-c-nav__link--Right
--pf-c-nav__link--PaddingRight --pf-c-nav__horizontal-list__link--PaddingRight .pf-c-nav__horizontal-list --pf-c-nav__link--Left --pf-c-nav__link--Left
--pf-c-nav__link--PaddingLeft --pf-c-nav__horizontal-list__link--PaddingLeft .pf-c-nav__horizontal-list --pf-c-nav__link--PaddingTop --pf-c-nav__link--PaddingTop
--pf-c-nav__horizontal-list__link--PaddingTop .pf-c-nav__horizontal-list --pf-c-nav__link--PaddingRight --pf-c-nav__link--PaddingRight
--pf-c-nav__horizontal-list__link--PaddingRight .pf-c-nav__horizontal-list --pf-c-nav__link--PaddingBottom --pf-c-nav__link--PaddingBottom
--pf-c-nav__horizontal-list__link--PaddingBottom .pf-c-nav__horizontal-list --pf-c-nav__link--PaddingLeft --pf-c-nav__link--PaddingLeft
--pf-c-nav__horizontal-list__link--PaddingLeft .pf-c-nav__horizontal-list --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav__horizontal-list__link--Color --pf-global--Color--light-300 $pf-global--Color--light-300 .pf-c-nav__horizontal-list --pf-c-nav__link--hover--Color --pf-c-nav__link--hover--Color
--pf-c-nav__horizontal-list__link--hover--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__horizontal-list --pf-c-nav__link--active--Color --pf-c-nav__link--active--Color
--pf-c-nav__horizontal-list__link--active--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__horizontal-list --pf-c-nav__link--focus--Color --pf-c-nav__link--focus--Color
--pf-c-nav__horizontal-list__link--focus--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__horizontal-list --pf-c-nav__link--m-current--Color --pf-c-nav__link--m-current--Color
--pf-c-nav__horizontal-list__link--m-current--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__horizontal-list --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__horizontal-list__link--BackgroundColor .pf-c-nav__horizontal-list --pf-c-nav__link--hover--BackgroundColor --pf-c-nav__link--hover--BackgroundColor
--pf-c-nav__horizontal-list__link--hover--BackgroundColor .pf-c-nav__horizontal-list --pf-c-nav__link--focus--BackgroundColor --pf-c-nav__link--focus--BackgroundColor
--pf-c-nav__horizontal-list__link--focus--BackgroundColor .pf-c-nav__horizontal-list --pf-c-nav__link--active--BackgroundColor --pf-c-nav__link--active--BackgroundColor
--pf-c-nav__horizontal-list__link--active--BackgroundColor .pf-c-nav__horizontal-list --pf-c-nav__link--m-current--BackgroundColor --pf-c-nav__link--m-current--BackgroundColor
--pf-c-nav__horizontal-list__link--m-current--BackgroundColor .pf-c-nav__horizontal-list --pf-c-nav__link--before--BorderColor --pf-c-nav__link--before--BorderColor
--pf-c-nav__horizontal-list__link--before--BorderColor --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__horizontal-list --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__horizontal-list__link--before--BorderWidth .pf-c-nav__horizontal-list .pf-c-nav__link:hover --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__horizontal-list__link--hover--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__horizontal-list .pf-c-nav__link:focus --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__horizontal-list__link--focus--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__horizontal-list .pf-c-nav__link:active --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__horizontal-list__link--active--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__horizontal-list .pf-c-nav__link.pf-m-current --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__horizontal-list__link--m-current--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__tertiary-list --pf-c-nav__link--PaddingTop --pf-c-nav__link--PaddingTop
--pf-c-nav__tertiary-list__link--PaddingTop .pf-c-nav__tertiary-list --pf-c-nav__link--PaddingRight --pf-c-nav__link--PaddingRight
--pf-c-nav__tertiary-list__link--PaddingRight .pf-c-nav__tertiary-list --pf-c-nav__link--PaddingBottom --pf-c-nav__link--PaddingBottom
--pf-c-nav__tertiary-list__link--PaddingBottom .pf-c-nav__tertiary-list --pf-c-nav__link--PaddingLeft --pf-c-nav__link--PaddingLeft
--pf-c-nav__tertiary-list__link--PaddingLeft .pf-c-nav__tertiary-list --pf-c-nav__link--Color --pf-c-nav__link--Color
--pf-c-nav__tertiary-list__link--Color --pf-global--Color--dark-100 $pf-global--Color--dark-100 .pf-c-nav__tertiary-list --pf-c-nav__link--hover--Color --pf-c-nav__link--hover--Color
--pf-c-nav__tertiary-list__link--hover--Color --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav__tertiary-list --pf-c-nav__link--active--Color --pf-c-nav__link--active--Color
--pf-c-nav__tertiary-list__link--active--Color --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav__tertiary-list --pf-c-nav__link--focus--Color --pf-c-nav__link--focus--Color
--pf-c-nav__tertiary-list__link--focus--Color --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav__tertiary-list --pf-c-nav__link--m-current--Color --pf-c-nav__link--m-current--Color
--pf-c-nav__tertiary-list__link--m-current--Color --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav__tertiary-list --pf-c-nav__link--BackgroundColor --pf-c-nav__link--BackgroundColor
--pf-c-nav__tertiary-list__link--BackgroundColor .pf-c-nav__tertiary-list --pf-c-nav__link--hover--BackgroundColor --pf-c-nav__link--hover--BackgroundColor
--pf-c-nav__tertiary-list__link--hover--BackgroundColor .pf-c-nav__tertiary-list --pf-c-nav__link--focus--BackgroundColor --pf-c-nav__link--focus--BackgroundColor
--pf-c-nav__tertiary-list__link--focus--BackgroundColor .pf-c-nav__tertiary-list --pf-c-nav__link--active--BackgroundColor --pf-c-nav__link--active--BackgroundColor
--pf-c-nav__tertiary-list__link--active--BackgroundColor .pf-c-nav__tertiary-list --pf-c-nav__link--m-current--BackgroundColor --pf-c-nav__link--m-current--BackgroundColor
--pf-c-nav__tertiary-list__link--m-current--BackgroundColor .pf-c-nav__tertiary-list --pf-c-nav__link--before--BorderColor --pf-c-nav__link--before--BorderColor
--pf-c-nav__tertiary-list__link--before--BorderColor --pf-global--active-color--100 $pf-global--active-color--100 .pf-c-nav__tertiary-list --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__tertiary-list__link--before--BorderWidth .pf-c-nav__tertiary-list .pf-c-nav__link:hover --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__tertiary-list__link--hover--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__tertiary-list .pf-c-nav__link:focus --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__tertiary-list__link--focus--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__tertiary-list .pf-c-nav__link:active --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__tertiary-list__link--active--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__tertiary-list .pf-c-nav__link.pf-m-current --pf-c-nav__link--before--BorderBottomWidth --pf-c-nav__link--before--BorderBottomWidth
--pf-c-nav__tertiary-list__link--m-current--before--BorderWidth --pf-global--BorderWidth--lg $pf-global--BorderWidth--lg .pf-c-nav__subnav --pf-c-nav__link--FontSize --pf-c-nav__link--FontSize
--pf-c-nav__subnav__link--FontSize --pf-global--FontSize--sm .pf-c-nav__subnav --pf-c-nav__simple-list__link--MarginTop --pf-c-nav__simple-list__link--MarginTop
--pf-c-nav--subnav__simple-list__link--MarginTop .pf-c-nav__subnav --pf-c-nav__simple-list__link--MarginBottom --pf-c-nav__simple-list__link--MarginBottom
--pf-c-nav--subnav__simple-list__link--MarginBottom .pf-c-nav__subnav --pf-c-nav__simple-list__link--FontSize --pf-c-nav__simple-list__link--FontSize
--pf-c-nav__subnav__link--FontSize --pf-global--FontSize--sm .pf-c-nav__subnav --pf-c-nav__simple-list__link--PaddingRight --pf-c-nav__simple-list__link--PaddingRight
--pf-c-nav__subnav__simple-list__link--PaddingRight .pf-c-nav__subnav --pf-c-nav__simple-list__link--PaddingLeft --pf-c-nav__simple-list__link--PaddingLeft
--pf-c-nav__subnav__simple-list__link--PaddingLeft .pf-c-nav__item.pf-m-expanded .pf-c-nav__subnav --pf-c-nav__subnav--MaxHeight --pf-c-nav__subnav--MaxHeight
--pf-c-nav__item--m-expanded__subnav--MaxHeight .pf-c-nav__subnav .pf-c-nav__link:hover --pf-c-nav__link--after--BorderLeftWidth --pf-c-nav__link--after--BorderLeftWidth
--pf-c-nav__subnav__link--hover--after--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav__subnav .pf-c-nav__link:hover --pf-c-nav__link--after--BorderColor --pf-c-nav__link--after--BorderColor
--pf-c-nav__subnav__link--hover--after--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 .pf-c-nav__subnav .pf-c-nav__link:focus --pf-c-nav__link--after--BorderLeftWidth --pf-c-nav__link--after--BorderLeftWidth
--pf-c-nav__subnav__link--focus--after--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav__subnav .pf-c-nav__link:focus --pf-c-nav__link--after--BorderColor --pf-c-nav__link--after--BorderColor
--pf-c-nav__subnav__link--focus--after--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 .pf-c-nav__subnav .pf-c-nav__link:active --pf-c-nav__link--after--BorderLeftWidth --pf-c-nav__link--after--BorderLeftWidth
--pf-c-nav__subnav__link--active--after--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav__subnav .pf-c-nav__link:active --pf-c-nav__link--after--BorderColor --pf-c-nav__link--after--BorderColor
--pf-c-nav__subnav__link--active--after--BorderColor --pf-global--BorderColor--200 $pf-global--BorderColor--200 .pf-c-nav__subnav .pf-c-nav__link.pf-m-current --pf-c-nav__link--after--BorderLeftWidth --pf-c-nav__link--after--BorderLeftWidth
--pf-c-nav__subnav__link--m-current--after--BorderWidth --pf-global--BorderWidth--xl $pf-global--BorderWidth--xl .pf-c-nav__subnav .pf-c-nav__link.pf-m-current --pf-c-nav__link--after--BorderColor --pf-c-nav__link--after--BorderColor
--pf-c-nav__subnav__link--m-current--after--BorderColor --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__section + .pf-c-nav__section --pf-c-nav__section--MarginTop --pf-c-nav__section--MarginTop
--pf-c-nav__section--section--MarginTop .pf-c-nav__scroll-button:hover --pf-c-nav__scroll-button--Color --pf-c-nav__scroll-button--Color
--pf-c-nav__scroll-button--hover--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__scroll-button:focus --pf-c-nav__scroll-button--Color --pf-c-nav__scroll-button--Color
--pf-c-nav__scroll-button--focus--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__scroll-button:active --pf-c-nav__scroll-button--Color --pf-c-nav__scroll-button--Color
--pf-c-nav__scroll-button--active--Color --pf-global--active-color--400 $pf-global--active-color--400 .pf-c-nav__scroll-button:disabled --pf-c-nav__scroll-button--Color --pf-c-nav__scroll-button--Color
--pf-c-nav__scroll-button--disabled--Color --pf-global--disabled-color--100 $pf-global--disabled-color--100 .pf-c-nav__scroll-button:disabled --pf-c-nav__scroll-button--before--BorderColor --pf-c-nav__scroll-button--before--BorderColor
--pf-c-nav__scroll-button--disabled--before--BorderColor .pf-c-nav__scroll-button:nth-of-type(1) --pf-c-nav__scroll-button--before--BorderRightWidth --pf-c-nav__scroll-button--before--BorderRightWidth
--pf-c-nav__scroll-button--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm .pf-c-nav__scroll-button:nth-of-type(2) --pf-c-nav__scroll-button--before--BorderLeftWidth --pf-c-nav__scroll-button--before--BorderLeftWidth
--pf-c-nav__scroll-button--before--BorderWidth --pf-global--BorderWidth--sm $pf-global--BorderWidth--sm
