Button

A button is a box area or text that communicates and triggers user actions when clicked or selected. Buttons can be used to communicate and immediately trigger actions a user can take in an application, like submitting a form, canceling a process, or creating a new object. Buttons can also be used to take a user to a new location, like another page inside of a web application, or an external site such as help or documentation.

Examples

Variations

Default plain button:
No padding plain button:

Small buttons

Disabled

Aria-disabled

Links as buttons

Primary link to W3.org Secondary link to anchor Secondary danger link to anchor Tertiary link to W3.org Link to W3.org Link danger to W3.org

Inline link as span

Lorem ipsum dolor sit amet, consectetur adipiscing elit. This is long button text that needs to be a span so that it will wrap inline with the text around it. Sed hendrerit nisi in cursus maximus. Ut malesuada nisi turpis, in condimentum velit elementum non.

Block level

Types

Call to action

Progress

Link button with a count

Documentation

Overview

Always add a modifier class to add color to the button.

Button vs link

Semantic buttons and links are important for usability as well as accessibility. Using an a instead of a button element to perform user initiated actions should be avoided, unless absolutely necessary.

Accessibility

Attribute	Applied to	Outcome
`aria-pressed="true or false"`	`.pf-v5-c-button`	Indicates that the button is a toggle. When set to "true", `pf-m-active` should also be set so that the button displays in an active state. Required when button is a toggle
`aria-label="[button label text]"`	`.pf-v5-c-button.pf-m-plain`	Provides an accessible name for the button when an icon is used instead of text. Required when icon is used with no supporting text
`aria-label="[descriptive text]"`	`a.pf-v5-c-button`, `span.pf-v5-c-button.pf-m-link.pf-m-inline`	The button component's text should adequately describe its purpose. If it does not, `aria-label` can provide more detailed interaction information.
`disabled`	`button.pf-v5-c-button`	When a button element is used, indicates that it is unavailable and removes it from keyboard focus. Required when button is disabled
`aria-disabled="true"`	`button.pf-v5-c-button`	When a button element is used, indicates that it is unavailable but does not prevent keyboard or hover interactions. Used when a disabled button provides interactive elements like a tooltip.
`aria-disabled="true"`	`a.pf-v5-c-button.pf-m-disabled`, `span.pf-v5-c-button.pf-m-link.pf-m-inline.pf-m-disabled`	When a non-button element is used, indicates that it is unavailable. Required when element is disabled
`aria-expanded="true"`	`.pf-v5-c-button.pf-m-expanded`	Indicates that the expanded content element is visible. Required
`tabindex="-1"`	`a.pf-v5-c-button.pf-m-disabled`, `span.pf-v5-c-button.pf-m-link.pf-m-inline.pf-m-disabled`	When a non-button element is used, removes it from keyboard focus. Required when element is disabled
`tabindex="0"`	`span.pf-v5-c-button.pf-m-link.pf-m-inline`	Inserts the span into the tab order of the page so that it is focusable. Required when the element is a span

Usage

Class	Applied to	Outcome
`.pf-v5-c-button`	`<button>`	Initiates a button. Always use it with a modifier class. Required
`.pf-v5-c-button__icon`	`<span>`	Initiates a button icon.
`.pf-v5-c-button__progress`	`<span>`	Initiates a button progress container.
`.pf-v5-c-button__count`	`<span>`	Initiates a button count container. Note: Count should only be used on link buttons.
`.pf-m-primary`	`.pf-v5-c-button`	Modifies for primary styles.
`.pf-m-secondary`	`.pf-v5-c-button`	Modifies for secondary styles.
`.pf-m-tertiary`	`.pf-v5-c-button`	Modifies for tertiary styles.
`.pf-m-danger`	`.pf-v5-c-button`	Modifies for danger styles.
`.pf-m-warning`	`.pf-v5-c-button`	Modifies for warning styles.
`.pf-m-link`	`.pf-v5-c-button`	Modifies for link styles. This button has no background or border and is styled as a link. This button would commonly appear in a form and may include an icon.
`.pf-m-plain`	`.pf-v5-c-button`	Modifies for icon styles. This button has no background or border, uses a standard text color, and is used for `.pf-m-plain` icon buttons such as close, expand, kebab, etc.
`.pf-m-no-padding`	`.pf-v5-c-button.pf-m-plain`	Modifies a plain button to remove padding. This modifier should only be used when the button is inline within a sentence or block of text. Adjacent plain buttons without padding should always have spacing between them.
`.pf-m-inline`	`.pf-v5-c-button.pf-m-link`	Modifies for inline styles. This button is presented similar to a normal link and has no padding and is displayed inline with other inline content. When used as a `<span>`, the text will flow inline with text around it.
`.pf-m-block`	`.pf-v5-c-button`	Creates a block level button.
`.pf-m-control`	`.pf-v5-c-button`	Modifies for control styles. Note: This modifier should only be used when using buttons in the Input Group or Clipboard Copy components.
`.pf-m-expanded`	`.pf-v5-c-button.pf-m-control`	Modifies a control button for the expanded state.
`.pf-m-start`	`.pf-v5-c-button__icon`	Applies right spacing to an icon inside of a button when the icon comes before text.
`.pf-m-end`	`.pf-v5-c-button__icon`	Applies left spacing to an icon inside of a button when the icon comes after text.
`.pf-m-active`	`.pf-v5-c-button`	Forces display of the active state of the button. This modifier should be used when `aria-pressed` is set to true so that the button displays in an active state.
`.pf-m-small`	`.pf-v5-c-button`	Modifies the button so that it has small font size.
`.pf-m-aria-disabled`	`.pf-v5-c-button`	Modifies a button to be visually disabled, yet is still focusable.
`.pf-m-display-lg`	`.pf-v5-c-button`, `pf-v5-c-button.pf-m-link`	Modifies the button and link button for large display styling. For example, use this modifier to achieve "call to action" styles.
`.pf-m-progress`	`.pf-v5-c-button`	Indicates that the button supports the progress state. Note: Not used with the plain variation.
`.pf-m-in-progress`	`.pf-v5-c-button`	Indicates that the button is in the in progress state.

CSS variables

Expand or collapse column	Selector	Variable	Value
	.pf-v5-c-button	--pf-v5-c-button--PaddingTop	0.375rem
--pf-v5-c-button--PaddingTop --pf-v5-global--spacer--form-element $pf-v5-global--spacer--form-element pf-size-prem(6px) 0.375rem
	.pf-v5-c-button	--pf-v5-c-button--PaddingRight	1rem
--pf-v5-c-button--PaddingRight --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--PaddingBottom	0.375rem
--pf-v5-c-button--PaddingBottom --pf-v5-global--spacer--form-element $pf-v5-global--spacer--form-element pf-size-prem(6px) 0.375rem
	.pf-v5-c-button	--pf-v5-c-button--PaddingLeft	1rem
--pf-v5-c-button--PaddingLeft --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--LineHeight	1.5
--pf-v5-c-button--LineHeight --pf-v5-global--LineHeight--md $pf-v5-global--LineHeight--md 1.5
	.pf-v5-c-button	--pf-v5-c-button--FontWeight	400
--pf-v5-c-button--FontWeight --pf-v5-global--FontWeight--normal $pf-v5-global--FontWeight--normal 400
	.pf-v5-c-button	--pf-v5-c-button--FontSize	1rem
--pf-v5-c-button--FontSize --pf-v5-global--FontSize--md $pf-v5-global--FontSize--md pf-font-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--BorderRadius	3px
--pf-v5-c-button--BorderRadius --pf-v5-global--BorderRadius--sm $pf-v5-global--BorderRadius--sm 3px
	.pf-v5-c-button	--pf-v5-c-button--after--BorderRadius	3px
--pf-v5-c-button--after--BorderRadius --pf-v5-global--BorderRadius--sm $pf-v5-global--BorderRadius--sm 3px
	.pf-v5-c-button	--pf-v5-c-button--after--BorderColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--after--BorderWidth	1px
--pf-v5-c-button--after--BorderWidth --pf-v5-global--BorderWidth--sm $pf-v5-global--BorderWidth--sm 1px
	.pf-v5-c-button	--pf-v5-c-button--hover--after--BorderWidth	2px
--pf-v5-c-button--hover--after--BorderWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--focus--after--BorderWidth	2px
--pf-v5-c-button--focus--after--BorderWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--active--after--BorderWidth	2px
--pf-v5-c-button--active--after--BorderWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--disabled--Color	#6a6e73
--pf-v5-c-button--disabled--Color --pf-v5-global--disabled-color--100 $pf-v5-global--disabled-color--100 $pf-v5-color-black-600 #6a6e73
	.pf-v5-c-button	--pf-v5-c-button--disabled--BackgroundColor	#d2d2d2
--pf-v5-c-button--disabled--BackgroundColor --pf-v5-global--disabled-color--200 $pf-v5-global--disabled-color--200 $pf-v5-color-black-300 #d2d2d2
	.pf-v5-c-button	--pf-v5-c-button--disabled--after--BorderColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-primary--BackgroundColor	#06c
--pf-v5-c-button--m-primary--BackgroundColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-primary--Color	#fff
--pf-v5-c-button--m-primary--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-primary--hover--BackgroundColor	#004080
--pf-v5-c-button--m-primary--hover--BackgroundColor --pf-v5-global--primary-color--200 $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-primary--hover--Color	#fff
--pf-v5-c-button--m-primary--hover--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-primary--focus--BackgroundColor	#004080
--pf-v5-c-button--m-primary--focus--BackgroundColor --pf-v5-global--primary-color--200 $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-primary--focus--Color	#fff
--pf-v5-c-button--m-primary--focus--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-primary--active--BackgroundColor	#004080
--pf-v5-c-button--m-primary--active--BackgroundColor --pf-v5-global--primary-color--200 $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-primary--active--Color	#fff
--pf-v5-c-button--m-primary--active--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--after--BorderColor	#06c
--pf-v5-c-button--m-secondary--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--Color	#06c
--pf-v5-c-button--m-secondary--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--hover--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--hover--after--BorderColor	#06c
--pf-v5-c-button--m-secondary--hover--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--hover--Color	#06c
--pf-v5-c-button--m-secondary--hover--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--focus--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--focus--after--BorderColor	#06c
--pf-v5-c-button--m-secondary--focus--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--focus--Color	#06c
--pf-v5-c-button--m-secondary--focus--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--active--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--active--after--BorderColor	#06c
--pf-v5-c-button--m-secondary--active--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--active--Color	#06c
--pf-v5-c-button--m-secondary--active--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--Color	#c9190b
--pf-v5-c-button--m-secondary--m-danger--Color --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--after--BorderColor	#c9190b
--pf-v5-c-button--m-secondary--m-danger--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--hover--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--hover--Color	#a30000
--pf-v5-c-button--m-secondary--m-danger--hover--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--hover--after--BorderColor	#c9190b
--pf-v5-c-button--m-secondary--m-danger--hover--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--focus--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--focus--Color	#a30000
--pf-v5-c-button--m-secondary--m-danger--focus--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--focus--after--BorderColor	#c9190b
--pf-v5-c-button--m-secondary--m-danger--focus--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--active--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--active--Color	#a30000
--pf-v5-c-button--m-secondary--m-danger--active--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-secondary--m-danger--active--after--BorderColor	#c9190b
--pf-v5-c-button--m-secondary--m-danger--active--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--after--BorderColor	#151515
--pf-v5-c-button--m-tertiary--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--Color	#151515
--pf-v5-c-button--m-tertiary--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--hover--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--hover--after--BorderColor	#151515
--pf-v5-c-button--m-tertiary--hover--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--hover--Color	#151515
--pf-v5-c-button--m-tertiary--hover--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--focus--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--focus--after--BorderColor	#151515
--pf-v5-c-button--m-tertiary--focus--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--focus--Color	#151515
--pf-v5-c-button--m-tertiary--focus--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--active--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--active--after--BorderColor	#151515
--pf-v5-c-button--m-tertiary--active--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-tertiary--active--Color	#151515
--pf-v5-c-button--m-tertiary--active--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-warning--BackgroundColor	#f0ab00
--pf-v5-c-button--m-warning--BackgroundColor --pf-v5-global--warning-color--100 $pf-v5-global--warning-color--100 $pf-v5-color-gold-400 #f0ab00
	.pf-v5-c-button	--pf-v5-c-button--m-warning--Color	#151515
--pf-v5-c-button--m-warning--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-warning--hover--BackgroundColor	#c58c00
--pf-v5-c-button--m-warning--hover--BackgroundColor --pf-v5-global--palette--gold-500 $pf-v5-color-gold-500 #c58c00
	.pf-v5-c-button	--pf-v5-c-button--m-warning--hover--Color	#151515
--pf-v5-c-button--m-warning--hover--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-warning--focus--BackgroundColor	#c58c00
--pf-v5-c-button--m-warning--focus--BackgroundColor --pf-v5-global--palette--gold-500 $pf-v5-color-gold-500 #c58c00
	.pf-v5-c-button	--pf-v5-c-button--m-warning--focus--Color	#151515
--pf-v5-c-button--m-warning--focus--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-warning--active--BackgroundColor	#c58c00
--pf-v5-c-button--m-warning--active--BackgroundColor --pf-v5-global--palette--gold-500 $pf-v5-color-gold-500 #c58c00
	.pf-v5-c-button	--pf-v5-c-button--m-warning--active--Color	#151515
--pf-v5-c-button--m-warning--active--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-danger--BackgroundColor	#c9190b
--pf-v5-c-button--m-danger--BackgroundColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-danger--Color	#fff
--pf-v5-c-button--m-danger--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-danger--hover--BackgroundColor	#a30000
--pf-v5-c-button--m-danger--hover--BackgroundColor --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-danger--hover--Color	#fff
--pf-v5-c-button--m-danger--hover--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-danger--focus--BackgroundColor	#a30000
--pf-v5-c-button--m-danger--focus--BackgroundColor --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-danger--focus--Color	#fff
--pf-v5-c-button--m-danger--focus--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-danger--active--BackgroundColor	#a30000
--pf-v5-c-button--m-danger--active--BackgroundColor --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-danger--active--Color	#fff
--pf-v5-c-button--m-danger--active--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-link--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--Color	#06c
--pf-v5-c-button--m-link--Color --pf-v5-global--link--Color $pf-v5-global--link--Color $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-link--hover--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--hover--Color	#004080
--pf-v5-c-button--m-link--hover--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-link--focus--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--focus--Color	#004080
--pf-v5-c-button--m-link--focus--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-link--active--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--active--Color	#004080
--pf-v5-c-button--m-link--active--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-link--disabled--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--disabled--Color	#6a6e73
--pf-v5-c-button--m-link--disabled--Color --pf-v5-global--disabled-color--100 $pf-v5-global--disabled-color--100 $pf-v5-color-black-600 #6a6e73
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--FontSize	inherit
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--hover--TextDecoration	underline
--pf-v5-c-button--m-link--m-inline--hover--TextDecoration --pf-v5-global--link--TextDecoration--hover $pf-v5-global--link--TextDecoration--hover underline
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--hover--Color	#004080
--pf-v5-c-button--m-link--m-inline--hover--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--PaddingTop	0
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--PaddingRight	0
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--PaddingBottom	0
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--PaddingLeft	0
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline__progress--Left	0.25rem
--pf-v5-c-button--m-link--m-inline__progress--Left --pf-v5-global--spacer--xs $pf-v5-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-inline--m-in-progress--PaddingLeft	calc(0.25rem + 1rem + 0.5rem)
--pf-v5-c-button--m-link--m-inline--m-in-progress--PaddingLeft calc(--pf-v5-c-button--m-link--m-inline__progress--Left + 1rem + --pf-v5-global--spacer--sm) calc(--pf-v5-global--spacer--xs + 1rem + $pf-v5-global--spacer--sm) calc($pf-v5-global--spacer--xs + 1rem + $pf-v5-global--spacer--sm) calc(pf-size-prem(4px) + 1rem + pf-size-prem(8px)) calc(0.25rem + 1rem + 0.5rem)
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--Color	#c9190b
--pf-v5-c-button--m-link--m-danger--Color --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--hover--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--hover--Color	#a30000
--pf-v5-c-button--m-link--m-danger--hover--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--focus--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--focus--Color	#a30000
--pf-v5-c-button--m-link--m-danger--focus--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--active--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-danger--active--Color	#a30000
--pf-v5-c-button--m-link--m-danger--active--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button	--pf-v5-c-button--m-plain--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-plain--Color	#6a6e73
--pf-v5-c-button--m-plain--Color --pf-v5-global--Color--200 $pf-v5-global--Color--200 $pf-v5-color-black-600 #6a6e73
	.pf-v5-c-button	--pf-v5-c-button--m-plain--hover--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-plain--hover--Color	#151515
--pf-v5-c-button--m-plain--hover--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-plain--focus--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-plain--focus--Color	#151515
--pf-v5-c-button--m-plain--focus--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-plain--active--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-plain--active--Color	#151515
--pf-v5-c-button--m-plain--active--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-plain--disabled--Color	#d2d2d2
--pf-v5-c-button--m-plain--disabled--Color --pf-v5-global--disabled-color--200 $pf-v5-global--disabled-color--200 $pf-v5-color-black-300 #d2d2d2
	.pf-v5-c-button	--pf-v5-c-button--m-plain--disabled--BackgroundColor	transparent
	.pf-v5-c-button	--pf-v5-c-button--m-control--BackgroundColor	#fff
--pf-v5-c-button--m-control--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-control--Color	#151515
--pf-v5-c-button--m-control--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-control--BorderRadius	0
	.pf-v5-c-button	--pf-v5-c-button--m-control--after--BorderWidth	1px
--pf-v5-c-button--m-control--after--BorderWidth --pf-v5-global--BorderWidth--sm $pf-v5-global--BorderWidth--sm 1px
	.pf-v5-c-button	--pf-v5-c-button--m-control--after--BorderTopColor	#f0f0f0
--pf-v5-c-button--m-control--after--BorderTopColor --pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--300 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button	--pf-v5-c-button--m-control--after--BorderRightColor	#f0f0f0
--pf-v5-c-button--m-control--after--BorderRightColor --pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--300 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button	--pf-v5-c-button--m-control--after--BorderBottomColor	#8a8d90
--pf-v5-c-button--m-control--after--BorderBottomColor --pf-v5-global--BorderColor--200 $pf-v5-global--BorderColor--200 $pf-v5-color-black-500 #8a8d90
	.pf-v5-c-button	--pf-v5-c-button--m-control--after--BorderLeftColor	#f0f0f0
--pf-v5-c-button--m-control--after--BorderLeftColor --pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--300 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button	--pf-v5-c-button--m-control--disabled--BackgroundColor	#f0f0f0
--pf-v5-c-button--m-control--disabled--BackgroundColor --pf-v5-global--disabled-color--300 $pf-v5-global--disabled-color--300 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button	--pf-v5-c-button--m-control--hover--BackgroundColor	#fff
--pf-v5-c-button--m-control--hover--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-control--hover--Color	#151515
--pf-v5-c-button--m-control--hover--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-control--hover--after--BorderBottomWidth	2px
--pf-v5-c-button--m-control--hover--after--BorderBottomWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--m-control--hover--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--hover--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-control--active--BackgroundColor	#fff
--pf-v5-c-button--m-control--active--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-control--active--Color	#151515
--pf-v5-c-button--m-control--active--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-control--active--after--BorderBottomWidth	2px
--pf-v5-c-button--m-control--active--after--BorderBottomWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--m-control--active--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--active--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-control--focus--BackgroundColor	#fff
--pf-v5-c-button--m-control--focus--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-control--focus--Color	#151515
--pf-v5-c-button--m-control--focus--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-control--focus--after--BorderBottomWidth	2px
--pf-v5-c-button--m-control--focus--after--BorderBottomWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--m-control--focus--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--focus--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-control--m-expanded--BackgroundColor	#fff
--pf-v5-c-button--m-control--m-expanded--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button	--pf-v5-c-button--m-control--m-expanded--Color	#151515
--pf-v5-c-button--m-control--m-expanded--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--m-control--m-expanded--after--BorderBottomWidth	2px
--pf-v5-c-button--m-control--m-expanded--after--BorderBottomWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button	--pf-v5-c-button--m-control--m-expanded--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--m-expanded--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-small--FontSize	0.875rem
--pf-v5-c-button--m-small--FontSize --pf-v5-global--FontSize--sm $pf-v5-global--FontSize--sm pf-font-prem(14px) 0.875rem
	.pf-v5-c-button	--pf-v5-c-button--m-display-lg--PaddingTop	1rem
--pf-v5-c-button--m-display-lg--PaddingTop --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--m-display-lg--PaddingRight	2rem
--pf-v5-c-button--m-display-lg--PaddingRight --pf-v5-global--spacer--xl $pf-v5-global--spacer--xl pf-size-prem(32px) 2rem
	.pf-v5-c-button	--pf-v5-c-button--m-display-lg--PaddingBottom	1rem
--pf-v5-c-button--m-display-lg--PaddingBottom --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--m-display-lg--PaddingLeft	2rem
--pf-v5-c-button--m-display-lg--PaddingLeft --pf-v5-global--spacer--xl $pf-v5-global--spacer--xl pf-size-prem(32px) 2rem
	.pf-v5-c-button	--pf-v5-c-button--m-display-lg--FontWeight	700
--pf-v5-c-button--m-display-lg--FontWeight --pf-v5-global--FontWeight--bold $pf-v5-global--FontWeight--bold 700
	.pf-v5-c-button	--pf-v5-c-button--m-link--m-display-lg--FontSize	1.125rem
--pf-v5-c-button--m-link--m-display-lg--FontSize --pf-v5-global--FontSize--lg $pf-v5-global--FontSize--lg pf-font-prem(18px) 1.125rem
	.pf-v5-c-button	--pf-v5-c-button__icon--m-start--MarginRight	0.25rem
--pf-v5-c-button__icon--m-start--MarginRight --pf-v5-global--spacer--xs $pf-v5-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-v5-c-button	--pf-v5-c-button__icon--m-end--MarginLeft	0.25rem
--pf-v5-c-button__icon--m-end--MarginLeft --pf-v5-global--spacer--xs $pf-v5-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-v5-c-button	--pf-v5-c-button__progress--width	calc(1rem + 0.5rem)
--pf-v5-c-button__progress--width calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm) calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm) calc(pf-font-prem(16px) + pf-size-prem(8px)) calc(1rem + 0.5rem)
	.pf-v5-c-button	--pf-v5-c-button__progress--Opacity	0
	.pf-v5-c-button	--pf-v5-c-button__progress--TranslateY	-50%
	.pf-v5-c-button	--pf-v5-c-button__progress--TranslateX	0
	.pf-v5-c-button	--pf-v5-c-button__progress--Top	50%
	.pf-v5-c-button	--pf-v5-c-button__progress--Left	1rem
--pf-v5-c-button__progress--Left --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--m-progress--TransitionProperty	padding
	.pf-v5-c-button	--pf-v5-c-button--m-progress--TransitionDuration	250ms
--pf-v5-c-button--m-progress--TransitionDuration --pf-v5-global--TransitionDuration $pf-v5-global--TransitionDuration 250ms
	.pf-v5-c-button	--pf-v5-c-button--m-progress--PaddingRight	calc(1rem + calc(1rem + 0.5rem) / 2)
--pf-v5-c-button--m-progress--PaddingRight calc(--pf-v5-global--spacer--md + --pf-v5-c-button__progress--width / 2) calc($pf-v5-global--spacer--md + calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm) / 2) calc($pf-v5-global--spacer--md + calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm) / 2) calc(pf-size-prem(16px) + calc(pf-font-prem(16px) + pf-size-prem(8px)) / 2) calc(1rem + calc(1rem + 0.5rem) / 2)
	.pf-v5-c-button	--pf-v5-c-button--m-progress--PaddingLeft	calc(1rem + calc(1rem + 0.5rem) / 2)
--pf-v5-c-button--m-progress--PaddingLeft calc(--pf-v5-global--spacer--md + --pf-v5-c-button__progress--width / 2) calc($pf-v5-global--spacer--md + calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm) / 2) calc($pf-v5-global--spacer--md + calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm) / 2) calc(pf-size-prem(16px) + calc(pf-font-prem(16px) + pf-size-prem(8px)) / 2) calc(1rem + calc(1rem + 0.5rem) / 2)
	.pf-v5-c-button	--pf-v5-c-button--m-in-progress--PaddingRight	1rem
--pf-v5-c-button--m-in-progress--PaddingRight --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button	--pf-v5-c-button--m-in-progress--PaddingLeft	calc(1rem + calc(1rem + 0.5rem))
--pf-v5-c-button--m-in-progress--PaddingLeft calc(--pf-v5-global--spacer--md + --pf-v5-c-button__progress--width) calc($pf-v5-global--spacer--md + calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm)) calc($pf-v5-global--spacer--md + calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm)) calc(pf-size-prem(16px) + calc(pf-font-prem(16px) + pf-size-prem(8px))) calc(1rem + calc(1rem + 0.5rem))
	.pf-v5-c-button	--pf-v5-c-button--m-in-progress--m-plain--Color	#06c
--pf-v5-c-button--m-in-progress--m-plain--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button	--pf-v5-c-button--m-in-progress--m-plain__progress--Left	50%
	.pf-v5-c-button	--pf-v5-c-button--m-in-progress--m-plain__progress--TranslateX	-50%
	.pf-v5-c-button	--pf-v5-c-button__count--MarginLeft	0.5rem
--pf-v5-c-button__count--MarginLeft --pf-v5-global--spacer--sm $pf-v5-global--spacer--sm pf-size-prem(8px) 0.5rem
	.pf-v5-c-button	--pf-v5-c-button--disabled__c-badge--Color	#151515
--pf-v5-c-button--disabled__c-badge--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button	--pf-v5-c-button--disabled__c-badge--BackgroundColor	#f0f0f0
--pf-v5-c-button--disabled__c-badge--BackgroundColor --pf-v5-global--BackgroundColor--200 $pf-v5-global--BackgroundColor--200 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button	--pf-v5-c-button--m-primary__c-badge--BorderColor	#f0f0f0
--pf-v5-c-button--m-primary__c-badge--BorderColor --pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--300 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button	--pf-v5-c-button--m-primary__c-badge--BorderWidth	1px
--pf-v5-c-button--m-primary__c-badge--BorderWidth --pf-v5-global--BorderWidth--sm $pf-v5-global--BorderWidth--sm 1px
	.pf-v5-c-button:hover	--pf-v5-c-button--after--BorderWidth	2px
--pf-v5-c-button--after--BorderWidth --pf-v5-c-button--hover--after--BorderWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button:focus	--pf-v5-c-button--after--BorderWidth	2px
--pf-v5-c-button--after--BorderWidth --pf-v5-c-button--focus--after--BorderWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button:active	--pf-v5-c-button--after--BorderWidth	2px
--pf-v5-c-button--after--BorderWidth --pf-v5-c-button--active--after--BorderWidth --pf-v5-global--BorderWidth--md $pf-v5-global--BorderWidth--md 2px
	.pf-v5-c-button.pf-m-small	--pf-v5-c-button--FontSize	0.875rem
--pf-v5-c-button--FontSize --pf-v5-c-button--m-small--FontSize --pf-v5-global--FontSize--sm $pf-v5-global--FontSize--sm pf-font-prem(14px) 0.875rem
	.pf-v5-c-button.pf-m-primary.pf-m-display-lg	--pf-v5-c-button--PaddingTop	1rem
--pf-v5-c-button--PaddingTop --pf-v5-c-button--m-display-lg--PaddingTop --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button.pf-m-primary.pf-m-display-lg	--pf-v5-c-button--PaddingRight	2rem
--pf-v5-c-button--PaddingRight --pf-v5-c-button--m-display-lg--PaddingRight --pf-v5-global--spacer--xl $pf-v5-global--spacer--xl pf-size-prem(32px) 2rem
	.pf-v5-c-button.pf-m-primary.pf-m-display-lg	--pf-v5-c-button--PaddingBottom	1rem
--pf-v5-c-button--PaddingBottom --pf-v5-c-button--m-display-lg--PaddingBottom --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button.pf-m-primary.pf-m-display-lg	--pf-v5-c-button--PaddingLeft	2rem
--pf-v5-c-button--PaddingLeft --pf-v5-c-button--m-display-lg--PaddingLeft --pf-v5-global--spacer--xl $pf-v5-global--spacer--xl pf-size-prem(32px) 2rem
	.pf-v5-c-button.pf-m-primary.pf-m-display-lg	--pf-v5-c-button--FontWeight	700
--pf-v5-c-button--FontWeight --pf-v5-c-button--m-display-lg--FontWeight --pf-v5-global--FontWeight--bold $pf-v5-global--FontWeight--bold 700
	.pf-v5-c-button.pf-m-primary:hover	--pf-v5-c-button--m-primary--Color	#fff
--pf-v5-c-button--m-primary--Color --pf-v5-c-button--m-primary--hover--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-primary:hover	--pf-v5-c-button--m-primary--BackgroundColor	#004080
--pf-v5-c-button--m-primary--BackgroundColor --pf-v5-c-button--m-primary--hover--BackgroundColor --pf-v5-global--primary-color--200 $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-primary:focus	--pf-v5-c-button--m-primary--Color	#fff
--pf-v5-c-button--m-primary--Color --pf-v5-c-button--m-primary--focus--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-primary:focus	--pf-v5-c-button--m-primary--BackgroundColor	#004080
--pf-v5-c-button--m-primary--BackgroundColor --pf-v5-c-button--m-primary--focus--BackgroundColor --pf-v5-global--primary-color--200 $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-primary:active	--pf-v5-c-button--m-primary--Color	#fff
--pf-v5-c-button--m-primary--Color --pf-v5-c-button--m-primary--active--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-primary:active	--pf-v5-c-button--m-primary--BackgroundColor	#004080
--pf-v5-c-button--m-primary--BackgroundColor --pf-v5-c-button--m-primary--active--BackgroundColor --pf-v5-global--primary-color--200 $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-secondary	--pf-v5-c-button--after--BorderColor	#06c
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-secondary:hover	--pf-v5-c-button--m-secondary--Color	#06c
--pf-v5-c-button--m-secondary--Color --pf-v5-c-button--m-secondary--hover--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-secondary:hover	--pf-v5-c-button--m-secondary--BackgroundColor	transparent
--pf-v5-c-button--m-secondary--BackgroundColor --pf-v5-c-button--m-secondary--hover--BackgroundColor transparent
	.pf-v5-c-button.pf-m-secondary:hover	--pf-v5-c-button--after--BorderColor	#06c
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--hover--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-secondary:focus	--pf-v5-c-button--m-secondary--Color	#06c
--pf-v5-c-button--m-secondary--Color --pf-v5-c-button--m-secondary--focus--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-secondary:focus	--pf-v5-c-button--m-secondary--BackgroundColor	transparent
--pf-v5-c-button--m-secondary--BackgroundColor --pf-v5-c-button--m-secondary--focus--BackgroundColor transparent
	.pf-v5-c-button.pf-m-secondary:focus	--pf-v5-c-button--after--BorderColor	#06c
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--focus--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-secondary.pf-m-active	--pf-v5-c-button--m-secondary--Color	#06c
--pf-v5-c-button--m-secondary--Color --pf-v5-c-button--m-secondary--active--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-secondary.pf-m-active	--pf-v5-c-button--m-secondary--BackgroundColor	transparent
--pf-v5-c-button--m-secondary--BackgroundColor --pf-v5-c-button--m-secondary--active--BackgroundColor transparent
	.pf-v5-c-button.pf-m-secondary.pf-m-active	--pf-v5-c-button--after--BorderColor	#06c
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--active--after--BorderColor --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-tertiary	--pf-v5-c-button--after--BorderColor	#151515
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-tertiary--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-tertiary:hover	--pf-v5-c-button--m-tertiary--Color	#151515
--pf-v5-c-button--m-tertiary--Color --pf-v5-c-button--m-tertiary--hover--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-tertiary:hover	--pf-v5-c-button--m-tertiary--BackgroundColor	transparent
--pf-v5-c-button--m-tertiary--BackgroundColor --pf-v5-c-button--m-tertiary--hover--BackgroundColor transparent
	.pf-v5-c-button.pf-m-tertiary:hover	--pf-v5-c-button--after--BorderColor	#151515
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-tertiary--hover--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-tertiary:focus	--pf-v5-c-button--m-tertiary--Color	#151515
--pf-v5-c-button--m-tertiary--Color --pf-v5-c-button--m-tertiary--focus--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-tertiary:focus	--pf-v5-c-button--m-tertiary--BackgroundColor	transparent
--pf-v5-c-button--m-tertiary--BackgroundColor --pf-v5-c-button--m-tertiary--focus--BackgroundColor transparent
	.pf-v5-c-button.pf-m-tertiary:focus	--pf-v5-c-button--after--BorderColor	#151515
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-tertiary--focus--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-tertiary:active	--pf-v5-c-button--m-tertiary--Color	#151515
--pf-v5-c-button--m-tertiary--Color --pf-v5-c-button--m-tertiary--active--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-tertiary:active	--pf-v5-c-button--m-tertiary--BackgroundColor	transparent
--pf-v5-c-button--m-tertiary--BackgroundColor --pf-v5-c-button--m-tertiary--active--BackgroundColor transparent
	.pf-v5-c-button.pf-m-tertiary:active	--pf-v5-c-button--after--BorderColor	#151515
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-tertiary--active--after--BorderColor --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-link	--pf-v5-c-button--disabled--BackgroundColor	transparent
--pf-v5-c-button--disabled--BackgroundColor --pf-v5-c-button--m-link--disabled--BackgroundColor transparent
	.pf-v5-c-button.pf-m-link	--pf-v5-c-button--disabled--Color	#6a6e73
--pf-v5-c-button--disabled--Color --pf-v5-c-button--m-link--disabled--Color --pf-v5-global--disabled-color--100 $pf-v5-global--disabled-color--100 $pf-v5-color-black-600 #6a6e73
	.pf-v5-c-button.pf-m-link:not(.pf-m-inline):hover	--pf-v5-c-button--m-link--Color	#004080
--pf-v5-c-button--m-link--Color --pf-v5-c-button--m-link--hover--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-link:not(.pf-m-inline):hover	--pf-v5-c-button--m-link--BackgroundColor	transparent
--pf-v5-c-button--m-link--BackgroundColor --pf-v5-c-button--m-link--hover--BackgroundColor transparent
	.pf-v5-c-button.pf-m-link:not(.pf-m-inline):focus	--pf-v5-c-button--m-link--Color	#004080
--pf-v5-c-button--m-link--Color --pf-v5-c-button--m-link--focus--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-link:not(.pf-m-inline):focus	--pf-v5-c-button--m-link--BackgroundColor	transparent
--pf-v5-c-button--m-link--BackgroundColor --pf-v5-c-button--m-link--focus--BackgroundColor transparent
	.pf-v5-c-button.pf-m-link:not(.pf-m-inline):active	--pf-v5-c-button--m-link--Color	#004080
--pf-v5-c-button--m-link--Color --pf-v5-c-button--m-link--active--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-link:not(.pf-m-inline):active	--pf-v5-c-button--m-link--BackgroundColor	transparent
--pf-v5-c-button--m-link--BackgroundColor --pf-v5-c-button--m-link--active--BackgroundColor transparent
	.pf-v5-c-button.pf-m-link.pf-m-inline	--pf-v5-c-button--FontSize	inherit
--pf-v5-c-button--FontSize --pf-v5-c-button--m-link--m-inline--FontSize inherit
	.pf-v5-c-button.pf-m-link.pf-m-inline	--pf-v5-c-button__progress--Left	0.25rem
--pf-v5-c-button__progress--Left --pf-v5-c-button--m-link--m-inline__progress--Left --pf-v5-global--spacer--xs $pf-v5-global--spacer--xs pf-size-prem(4px) 0.25rem
	.pf-v5-c-button.pf-m-link.pf-m-inline:hover	--pf-v5-c-button--m-link--Color	#004080
--pf-v5-c-button--m-link--Color --pf-v5-c-button--m-link--m-inline--hover--Color --pf-v5-global--link--Color--hover $pf-v5-global--link--Color--hover $pf-v5-global--primary-color--200 $pf-v5-color-blue-500 #004080
	.pf-v5-c-button.pf-m-link.pf-m-display-lg	--pf-v5-c-button--FontSize	1.125rem
--pf-v5-c-button--FontSize --pf-v5-c-button--m-link--m-display-lg--FontSize --pf-v5-global--FontSize--lg $pf-v5-global--FontSize--lg pf-font-prem(18px) 1.125rem
	.pf-v5-c-button.pf-m-danger:hover	--pf-v5-c-button--m-danger--Color	#fff
--pf-v5-c-button--m-danger--Color --pf-v5-c-button--m-danger--hover--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-danger:hover	--pf-v5-c-button--m-danger--BackgroundColor	#a30000
--pf-v5-c-button--m-danger--BackgroundColor --pf-v5-c-button--m-danger--hover--BackgroundColor --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger:focus	--pf-v5-c-button--m-danger--Color	#fff
--pf-v5-c-button--m-danger--Color --pf-v5-c-button--m-danger--focus--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-danger:focus	--pf-v5-c-button--m-danger--BackgroundColor	#a30000
--pf-v5-c-button--m-danger--BackgroundColor --pf-v5-c-button--m-danger--focus--BackgroundColor --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger:active	--pf-v5-c-button--m-danger--Color	#fff
--pf-v5-c-button--m-danger--Color --pf-v5-c-button--m-danger--active--Color --pf-v5-global--Color--light-100 $pf-v5-global--Color--light-100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-danger:active	--pf-v5-c-button--m-danger--BackgroundColor	#a30000
--pf-v5-c-button--m-danger--BackgroundColor --pf-v5-c-button--m-danger--active--BackgroundColor --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-secondary	--pf-v5-c-button--m-danger--Color	#c9190b
--pf-v5-c-button--m-danger--Color --pf-v5-c-button--m-secondary--m-danger--Color --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button.pf-m-danger.pf-m-secondary	--pf-v5-c-button--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-danger--BackgroundColor --pf-v5-c-button--m-secondary--m-danger--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-secondary	--pf-v5-c-button--after--BorderColor	#c9190b
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--m-danger--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:hover	--pf-v5-c-button--m-secondary--m-danger--Color	#a30000
--pf-v5-c-button--m-secondary--m-danger--Color --pf-v5-c-button--m-secondary--m-danger--hover--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:hover	--pf-v5-c-button--m-secondary--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-secondary--m-danger--BackgroundColor --pf-v5-c-button--m-secondary--m-danger--hover--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:hover	--pf-v5-c-button--after--BorderColor	#c9190b
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--m-danger--hover--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:focus	--pf-v5-c-button--m-secondary--m-danger--Color	#a30000
--pf-v5-c-button--m-secondary--m-danger--Color --pf-v5-c-button--m-secondary--m-danger--focus--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:focus	--pf-v5-c-button--m-secondary--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-secondary--m-danger--BackgroundColor --pf-v5-c-button--m-secondary--m-danger--focus--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:focus	--pf-v5-c-button--after--BorderColor	#c9190b
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--m-danger--focus--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:active	--pf-v5-c-button--m-secondary--m-danger--Color	#a30000
--pf-v5-c-button--m-secondary--m-danger--Color --pf-v5-c-button--m-secondary--m-danger--active--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:active	--pf-v5-c-button--m-secondary--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-secondary--m-danger--BackgroundColor --pf-v5-c-button--m-secondary--m-danger--active--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-secondary:active	--pf-v5-c-button--after--BorderColor	#c9190b
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-secondary--m-danger--active--after--BorderColor --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button.pf-m-danger.pf-m-link	--pf-v5-c-button--m-danger--Color	#c9190b
--pf-v5-c-button--m-danger--Color --pf-v5-c-button--m-link--m-danger--Color --pf-v5-global--danger-color--100 $pf-v5-global--danger-color--100 $pf-v5-color-red-100 #c9190b
	.pf-v5-c-button.pf-m-danger.pf-m-link	--pf-v5-c-button--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-danger--BackgroundColor --pf-v5-c-button--m-link--m-danger--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-link:hover	--pf-v5-c-button--m-link--m-danger--Color	#a30000
--pf-v5-c-button--m-link--m-danger--Color --pf-v5-c-button--m-link--m-danger--hover--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-link:hover	--pf-v5-c-button--m-link--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-link--m-danger--BackgroundColor --pf-v5-c-button--m-link--m-danger--hover--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-link:focus	--pf-v5-c-button--m-link--m-danger--Color	#a30000
--pf-v5-c-button--m-link--m-danger--Color --pf-v5-c-button--m-link--m-danger--focus--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-link:focus	--pf-v5-c-button--m-link--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-link--m-danger--BackgroundColor --pf-v5-c-button--m-link--m-danger--focus--BackgroundColor transparent
	.pf-v5-c-button.pf-m-danger.pf-m-link:active	--pf-v5-c-button--m-link--m-danger--Color	#a30000
--pf-v5-c-button--m-link--m-danger--Color --pf-v5-c-button--m-link--m-danger--active--Color --pf-v5-global--danger-color--200 $pf-v5-global--danger-color--200 $pf-v5-color-red-200 #a30000
	.pf-v5-c-button.pf-m-danger.pf-m-link:active	--pf-v5-c-button--m-link--m-danger--BackgroundColor	transparent
--pf-v5-c-button--m-link--m-danger--BackgroundColor --pf-v5-c-button--m-link--m-danger--active--BackgroundColor transparent
	.pf-v5-c-button.pf-m-warning:hover	--pf-v5-c-button--m-warning--Color	#151515
--pf-v5-c-button--m-warning--Color --pf-v5-c-button--m-warning--hover--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-warning:hover	--pf-v5-c-button--m-warning--BackgroundColor	#c58c00
--pf-v5-c-button--m-warning--BackgroundColor --pf-v5-c-button--m-warning--hover--BackgroundColor --pf-v5-global--palette--gold-500 $pf-v5-color-gold-500 #c58c00
	.pf-v5-c-button.pf-m-warning:focus	--pf-v5-c-button--m-warning--Color	#151515
--pf-v5-c-button--m-warning--Color --pf-v5-c-button--m-warning--focus--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-warning:focus	--pf-v5-c-button--m-warning--BackgroundColor	#c58c00
--pf-v5-c-button--m-warning--BackgroundColor --pf-v5-c-button--m-warning--focus--BackgroundColor --pf-v5-global--palette--gold-500 $pf-v5-color-gold-500 #c58c00
	.pf-v5-c-button.pf-m-warning:active	--pf-v5-c-button--m-warning--Color	#151515
--pf-v5-c-button--m-warning--Color --pf-v5-c-button--m-warning--active--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-warning:active	--pf-v5-c-button--m-warning--BackgroundColor	#c58c00
--pf-v5-c-button--m-warning--BackgroundColor --pf-v5-c-button--m-warning--active--BackgroundColor --pf-v5-global--palette--gold-500 $pf-v5-color-gold-500 #c58c00
	.pf-v5-c-button.pf-m-control	--pf-v5-c-button--BorderRadius	0
--pf-v5-c-button--BorderRadius --pf-v5-c-button--m-control--BorderRadius 0
	.pf-v5-c-button.pf-m-control	--pf-v5-c-button--disabled--BackgroundColor	#f0f0f0
--pf-v5-c-button--disabled--BackgroundColor --pf-v5-c-button--m-control--disabled--BackgroundColor --pf-v5-global--disabled-color--300 $pf-v5-global--disabled-color--300 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button.pf-m-control	--pf-v5-c-button--after--BorderWidth	1px
--pf-v5-c-button--after--BorderWidth --pf-v5-c-button--m-control--after--BorderWidth --pf-v5-global--BorderWidth--sm $pf-v5-global--BorderWidth--sm 1px
	.pf-v5-c-button.pf-m-control	--pf-v5-c-button--after--BorderColor	#f0f0f0 #f0f0f0 #8a8d90 #f0f0f0
--pf-v5-c-button--after--BorderColor --pf-v5-c-button--m-control--after--BorderTopColor --pf-v5-c-button--m-control--after--BorderRightColor --pf-v5-c-button--m-control--after--BorderBottomColor --pf-v5-c-button--m-control--after--BorderLeftColor --pf-v5-global--BorderColor--300 --pf-v5-global--BorderColor--300 --pf-v5-global--BorderColor--200 --pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--300 $pf-v5-global--BorderColor--200 $pf-v5-global--BorderColor--300 $pf-v5-color-black-200 $pf-v5-color-black-200 $pf-v5-color-black-500 $pf-v5-color-black-200 #f0f0f0 #f0f0f0 #8a8d90 #f0f0f0
	.pf-v5-c-button.pf-m-control:hover	--pf-v5-c-button--m-control--Color	#151515
--pf-v5-c-button--m-control--Color --pf-v5-c-button--m-control--hover--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-control:hover	--pf-v5-c-button--m-control--BackgroundColor	#fff
--pf-v5-c-button--m-control--BackgroundColor --pf-v5-c-button--m-control--hover--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-control:hover	--pf-v5-c-button--m-control--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--after--BorderBottomColor --pf-v5-c-button--m-control--hover--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-control:active	--pf-v5-c-button--m-control--Color	#151515
--pf-v5-c-button--m-control--Color --pf-v5-c-button--m-control--active--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-control:active	--pf-v5-c-button--m-control--BackgroundColor	#fff
--pf-v5-c-button--m-control--BackgroundColor --pf-v5-c-button--m-control--active--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-control:active	--pf-v5-c-button--m-control--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--after--BorderBottomColor --pf-v5-c-button--m-control--active--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-control:focus	--pf-v5-c-button--m-control--Color	#151515
--pf-v5-c-button--m-control--Color --pf-v5-c-button--m-control--focus--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-control:focus	--pf-v5-c-button--m-control--BackgroundColor	#fff
--pf-v5-c-button--m-control--BackgroundColor --pf-v5-c-button--m-control--focus--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-control:focus	--pf-v5-c-button--m-control--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--after--BorderBottomColor --pf-v5-c-button--m-control--focus--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-control.pf-m-expanded	--pf-v5-c-button--m-control--Color	#151515
--pf-v5-c-button--m-control--Color --pf-v5-c-button--m-control--m-expanded--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-control.pf-m-expanded	--pf-v5-c-button--m-control--BackgroundColor	#fff
--pf-v5-c-button--m-control--BackgroundColor --pf-v5-c-button--m-control--m-expanded--BackgroundColor --pf-v5-global--BackgroundColor--100 $pf-v5-global--BackgroundColor--100 $pf-v5-color-white #fff
	.pf-v5-c-button.pf-m-control.pf-m-expanded	--pf-v5-c-button--m-control--after--BorderBottomColor	#06c
--pf-v5-c-button--m-control--after--BorderBottomColor --pf-v5-c-button--m-control--m-expanded--after--BorderBottomColor --pf-v5-global--active-color--100 $pf-v5-global--active-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-plain	--pf-v5-c-button--disabled--Color	#d2d2d2
--pf-v5-c-button--disabled--Color --pf-v5-c-button--m-plain--disabled--Color --pf-v5-global--disabled-color--200 $pf-v5-global--disabled-color--200 $pf-v5-color-black-300 #d2d2d2
	.pf-v5-c-button.pf-m-plain	--pf-v5-c-button--disabled--BackgroundColor	transparent
--pf-v5-c-button--disabled--BackgroundColor --pf-v5-c-button--m-plain--disabled--BackgroundColor transparent
	.pf-v5-c-button.pf-m-plain:hover	--pf-v5-c-button--m-plain--Color	#151515
--pf-v5-c-button--m-plain--Color --pf-v5-c-button--m-plain--hover--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-plain:hover	--pf-v5-c-button--m-plain--BackgroundColor	transparent
--pf-v5-c-button--m-plain--BackgroundColor --pf-v5-c-button--m-plain--hover--BackgroundColor transparent
	.pf-v5-c-button.pf-m-plain:active	--pf-v5-c-button--m-plain--Color	#151515
--pf-v5-c-button--m-plain--Color --pf-v5-c-button--m-plain--active--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-plain:active	--pf-v5-c-button--m-plain--BackgroundColor	transparent
--pf-v5-c-button--m-plain--BackgroundColor --pf-v5-c-button--m-plain--active--BackgroundColor transparent
	.pf-v5-c-button.pf-m-plain:focus	--pf-v5-c-button--m-plain--Color	#151515
--pf-v5-c-button--m-plain--Color --pf-v5-c-button--m-plain--focus--Color --pf-v5-global--Color--100 $pf-v5-global--Color--100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button.pf-m-plain:focus	--pf-v5-c-button--m-plain--BackgroundColor	transparent
--pf-v5-c-button--m-plain--BackgroundColor --pf-v5-c-button--m-plain--focus--BackgroundColor transparent
	.pf-v5-c-button:disabled .pf-v5-c-badge	--pf-v5-c-badge--m-unread--Color	#151515
--pf-v5-c-badge--m-unread--Color --pf-v5-c-button--disabled__c-badge--Color --pf-v5-global--Color--dark-100 $pf-v5-global--Color--dark-100 $pf-v5-color-black-900 #151515
	.pf-v5-c-button:disabled .pf-v5-c-badge	--pf-v5-c-badge--m-unread--BackgroundColor	#f0f0f0
--pf-v5-c-badge--m-unread--BackgroundColor --pf-v5-c-button--disabled__c-badge--BackgroundColor --pf-v5-global--BackgroundColor--200 $pf-v5-global--BackgroundColor--200 $pf-v5-color-black-200 #f0f0f0
	.pf-v5-c-button:disabled .pf-v5-c-badge	--pf-v5-c-button--m-primary__c-badge--BorderWidth	0
	.pf-v5-c-button.pf-m-aria-disabled	--pf-v5-c-button--after--BorderWidth	0
	.pf-v5-c-button.pf-m-aria-disabled	--pf-v5-c-button--m-link--m-inline--hover--TextDecoration	none
	.pf-v5-c-button.pf-m-progress	--pf-v5-c-button--PaddingRight	calc(1rem + calc(1rem + 0.5rem) / 2)
--pf-v5-c-button--PaddingRight --pf-v5-c-button--m-progress--PaddingRight calc(--pf-v5-global--spacer--md + --pf-v5-c-button__progress--width / 2) calc($pf-v5-global--spacer--md + calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm) / 2) calc($pf-v5-global--spacer--md + calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm) / 2) calc(pf-size-prem(16px) + calc(pf-font-prem(16px) + pf-size-prem(8px)) / 2) calc(1rem + calc(1rem + 0.5rem) / 2)
	.pf-v5-c-button.pf-m-progress	--pf-v5-c-button--PaddingLeft	calc(1rem + calc(1rem + 0.5rem) / 2)
--pf-v5-c-button--PaddingLeft --pf-v5-c-button--m-progress--PaddingLeft calc(--pf-v5-global--spacer--md + --pf-v5-c-button__progress--width / 2) calc($pf-v5-global--spacer--md + calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm) / 2) calc($pf-v5-global--spacer--md + calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm) / 2) calc(pf-size-prem(16px) + calc(pf-font-prem(16px) + pf-size-prem(8px)) / 2) calc(1rem + calc(1rem + 0.5rem) / 2)
	.pf-v5-c-button.pf-m-in-progress	--pf-v5-c-button--m-link--m-inline--PaddingLeft	calc(0.25rem + 1rem + 0.5rem)
--pf-v5-c-button--m-link--m-inline--PaddingLeft --pf-v5-c-button--m-link--m-inline--m-in-progress--PaddingLeft calc(--pf-v5-c-button--m-link--m-inline__progress--Left + 1rem + --pf-v5-global--spacer--sm) calc(--pf-v5-global--spacer--xs + 1rem + $pf-v5-global--spacer--sm) calc($pf-v5-global--spacer--xs + 1rem + $pf-v5-global--spacer--sm) calc(pf-size-prem(4px) + 1rem + pf-size-prem(8px)) calc(0.25rem + 1rem + 0.5rem)
	.pf-v5-c-button.pf-m-in-progress:not(.pf-m-plain)	--pf-v5-c-button--PaddingRight	1rem
--pf-v5-c-button--PaddingRight --pf-v5-c-button--m-in-progress--PaddingRight --pf-v5-global--spacer--md $pf-v5-global--spacer--md pf-size-prem(16px) 1rem
	.pf-v5-c-button.pf-m-in-progress:not(.pf-m-plain)	--pf-v5-c-button--PaddingLeft	calc(1rem + calc(1rem + 0.5rem))
--pf-v5-c-button--PaddingLeft --pf-v5-c-button--m-in-progress--PaddingLeft calc(--pf-v5-global--spacer--md + --pf-v5-c-button__progress--width) calc($pf-v5-global--spacer--md + calc(--pf-v5-global--icon--FontSize--md + --pf-v5-global--spacer--sm)) calc($pf-v5-global--spacer--md + calc($pf-v5-global--icon--FontSize--md + $pf-v5-global--spacer--sm)) calc(pf-size-prem(16px) + calc(pf-font-prem(16px) + pf-size-prem(8px))) calc(1rem + calc(1rem + 0.5rem))
	.pf-v5-c-button.pf-m-in-progress.pf-m-plain	--pf-v5-c-button--m-plain--Color	#06c
--pf-v5-c-button--m-plain--Color --pf-v5-c-button--m-in-progress--m-plain--Color --pf-v5-global--primary-color--100 $pf-v5-global--primary-color--100 $pf-v5-color-blue-400 #06c
	.pf-v5-c-button.pf-m-in-progress.pf-m-plain	--pf-v5-c-button__progress--Left	50%
--pf-v5-c-button__progress--Left --pf-v5-c-button--m-in-progress--m-plain__progress--Left 50%
	.pf-v5-c-button.pf-m-in-progress.pf-m-plain	--pf-v5-c-button__progress--TranslateX	-50%
--pf-v5-c-button__progress--TranslateX --pf-v5-c-button--m-in-progress--m-plain__progress--TranslateX -50%
	.pf-v5-c-button__progress .pf-v5-c-spinner	--pf-v5-c-spinner--Color	currentcolor

View source on GitHub