* {
  margin: 0;
  padding: 0;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

html,
body {
  position: relative;
}

html {
  overflow-y: scroll;
}

a {
  text-decoration: none;
}

ul,
ol {
  list-style: none;
}

img {
  max-width: 100%;
}

/* Tokens */

:root {
  /* Tokens */
  --space-0: 0rem;
  --space-1: 1rem; /* 16px */
  --space-2: 2rem; /* 32px */
  --space-3: 3rem; /* 48px */
  --space-4: 4rem; /* 64px */
  --space-5: 5rem; /* 80px */
  --space-6: 6rem; /* 96px */
  --space-7: 8rem; /* 128px */
  --space-8: 12rem; /* 192px */
  --space-9: 16rem; /* 256px */

  --hdg: initial;
  --media-hdg: initial; /* Set value in media.css */

  --columns-width: initial;
  --column-gutter: initial;
  --column-gap: initial;

  --border-width: initial;

  --component-bg-color: var(--smoke);
  --component-border-color: var(--silver);
  --component-border-radius: 0.125rem;
  --component-border-width: 0.0625rem;
  --component-focus: 0 0 0.125rem 0.125rem var(--light);
  --component-speed: 0.1s;
  --component-shadow: var(--shadow);
  --component-margin-bottom: 1.5rem;
  --component-padding: 0.5rem 0.75rem;

  --white: white;
  --smoke: #f1f3f5;
  --light: #dee2e6;
  --silver: #adb5bd;
  --dark: #495057;
  --gray: #212529;
  --black: black;
  --red: #f03e3e;
  --pink: #d6336c;
  --grape: #ae3ec9;
  --violet: #7048e8;
  --indigo: #4263eb;
  --blue: #1c7ed6;
  --cyan: #1098ad;
  --teal: #0ca678;
  --green: #37b24d;
  --lime: #74b816;
  --yellow: #f59f00;
  --orange: #f76707;
  --state-primary: var(--blue);
  --state-secondary: var(--gray);
  --state-success: var(--green);
  --state-info: var(--cyan);
  --state-warning: var(--orange);
  --state-danger: var(--red);
  --state-disabled: var(--silver);
  --darken: rgba(0, 0, 0, 0.1);
  --darken-more: rgba(0, 0, 0, 0.5);
  --lighten: rgba(255, 255, 255, 0.1);
  --lighten-more: rgba(255, 255, 255, 0.5);
  --shadow: rgba(80, 80, 80, 0.1);
  --shadow-more: rgba(80, 80, 80, 0.5);

  /* Alert */
  --alert-border-radius: var(--component-border-radius);
  --alert-padding: 0.75rem;
  --alert-bg-color: initial;
  --alert-color: var(--gray);

  /* Animate */
  --animation-delay: initial;
  --animation-duration: initial;
  --animation-name: initial;
  --animation-translate: initial;

  /* Badge */
  --chip-font-size: 0.75rem;
  --chip-border-radius: 2rem;
  --chip-focus: var(--component-focus);
  --chip-speed: var(--component-speed);
  --chip-color: var(--gray);
  --chip-border-color: initial;
  --chip-bg-color: initial;
  --chip-padding: 0.25rem 0.5rem;
  --chip-color-active: var(--white);
  --chip-bg-color-active: var(--state-primary);
  --chip-link-color: var(--link-color);
  --chip-weight: var(--font-weight-medium);

  /* Button */
  --button-font-size: 1rem;
  --button-font-family: inherit;
  --button-font-weight: inherit;
  --button-border-radius: var(--component-border-radius);
  --button-border-width: var(--component-border-width);
  --button-focus: var(--component-focus);
  --button-speed: var(--component-speed);
  --button-color: initial;
  --button-bg-color: initial;
  --button-padding: 0.75rem 1rem;

  /* Dropdown */
  --dropdown-bg-color: var(--component-bg-color);
  --dropdown-border-color: var(--component-border-color);
  --dropdown-border-radius: var(--component-border-radius);
  --dropdown-border-width: var(--component-border-width);
  --dropdown-padding: var(--component-padding);

  /* Form */
  --input-font-size: var(--component-font-size);
  --input-font-family: inherit;
  --input-font-weight: inherit;
  --input-color: var(--body-color);
  --input-border-color: var(--component-border-color);
  --input-border-width: 0.0625rem;
  --input-border-radius: var(--component-border-radius);
  --input-bg-color: var(--white);
  --input-readonly-bg-color: var(--component-bg-color);
  --input-focus-color: var(--state-primary);
  --input-addon-bg-color: var(--component-bg-color);
  --input-addon-color: var(--body-color-muted);
  --input-hint-color: var(--body-color-muted);
  --input-hint-font-size: var(--font-size-small);
  --input-icon-width: 1.5rem;
  --input-icon-offset: 0.5rem;
  --input-icon-color: var(--state-secondary);
  --input-invalid-color: var(--state-danger);
  --input-invalid-border-color: var(--state-danger);
  --input-valid-color: var(--state-success);
  --input-padding: var(--component-padding);
  --input-valid-border-color: var(--state-success);
  --fieldset-border-color: var(--component-border-color);
  --fieldset-border-width: var(--component-border-width);
  --fieldset-border-radius: var(--component-border-radius);
  --fieldset-padding-x: 1rem;
  --fieldset-padding-y: 1.5rem;
  --label-color: inherit;

  /* Grid */
  --grid-columns: repeat(auto, 1fr);
  --grid-rows: repeat(auto, 1fr);
  --grid-column: auto / span 1;
  --grid-row: auto / span 1;

  /* List */
  --list-breadcrumb-seperator: '/';
  --list-breadcrumb-gap: 0.5rem;
  --list-breadcrumb-weight: var(--font-weight-medium);
  --list-step-color: var(--gray);
  --list-step-bg-color: var(--component-bg-color);

  /* Nav */
  --nav-height: 3rem;
  --nav-link-color: initial;
  --nav-padding: var(--component-padding);

  /* Tab */
  --tab-color: initial;
  --tab-border-color: initial;
  --tab-padding: var(--component-padding);
  --tab-border: 0.125rem;

  /* Table */
  --table-bg-color: var(--white);
  --table-border-color: var(--component-border-color);
  --table-border-width: var(--component-border-width);
  --table-header-bg-color: transparent;
  --table-spacing-x: 0.75rem;
  --table-spacing-y: 0.5rem;
  --table-hover-color: var(--white);
  --table-hover-bg-color: initial;
  --table-stripe-bg-color: var(--component-bg-color);

  /* Text */
  --font-sans-serif: sans-serif;
  --font-serif: serif;
  --font-system: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu,
    Cantarell, Fira Sans, Droid Sans, Helvetica Neue;
  --font-monospace: Menlo, Consolas, 'DejaVu Sans Mono', monospace;
  --blockquote-padding: 0.75rem;
  --body-bg-color: var(--white);
  --body-color: var(--gray);
  --body-color-muted: var(--gray);
  --font-family: var(--font-system);
  --font-size: 1rem;
  --font-size-small: calc(var(--font-size) * 0.75);
  --font-weight-thin: 200;
  --font-weight: 300;
  --font-weight-medium: 400;
  --font-weight-bold: 600;
  --line-height: 1.5;
  --code-font-size: 0.75rem;
  --code-color: var(--gray);
  --code-border-radius: var(--component-border-radius);
  --code-bg-color: var(--component-bg-color);
  --code-padding-x: 0.5rem;
  --code-padding-y: 0.125rem;
  --headings-font-family: var(--font-system);
  --headings-font-weight: var(--font-weight);
  --headings-line-height: 1.5;
  --headings-margin-bottom: 0.75rem;
  --headings-color: inherit;
  --headings-font-size-h1: var(--hdg, 4rem);
  --headings-font-size-h2: var(--hdg, 3rem);
  --headings-font-size-h3: var(--hdg, 2rem);
  --headings-font-size-h4: var(--hdg, 1.5rem);
  --headings-font-size-h5: var(--hdg, 1rem);
  --headings-font-size-h6: var(--hdg, 0.75rem);
  --hr-border-width: 0.0625rem;
  --hr-border-color: var(--component-border-color);
  --hr-margin-x: 0;
  --hr-margin-y: 2rem;
  --kbd-font-size: 0.75rem;
  --kbd-color: var(--white);
  --kbd-border-radius: var(--component-border-radius);
  --kbd-bg-color: var(--gray);
  --kbd-padding-x: calc(var(--font-size) * 0.4);
  --kbd-padding-y: calc(var(--font-size) * 0.2);
  --link-color: var(--state-primary);
  --link-text-decoration: none;
  --link-color-hover: var(--link-color);
  --link-text-decoration-hover: underline;
  --mark-color: inherit;
  --mark-bg-color: var(--yellow);
  --mark-padding-x: 0.75rem;
  --mark-padding-y: 0.25rem;
  --p-margin: 1.5rem;
  --placeholder-color: var(--body-color-muted);
  --pre-color: var(--code-color);
  --pre-border-radius: var(--component-border-radius);
  --pre-bg-color: var(--code-bg-color);
  --pre-max-height: none;
  --selection-color: var(--white);
  --selection-bg-color: var(--state-primary);

  /* Tooltip */
  --tooltip-color: var(--white);
  --tooltip-bg-color: var(--gray);
  --tooltip-border-radius: var(--component-border-radius);
  --tooltip-min-width: 2rem;
  --tooltip-padding: 0.5rem;
}

.isGap,
.isGap .isGap {
  --gap-0: 0rem;
  --gap-1: 0.0625rem; /* 1px */
  --gap-2: 0.125rem; /* 2px */
  --gap-3: 0.25rem; /* 4px */
  --gap-4: 0.5rem; /* 8px */
  --gap-5: 0.75rem; /* 12px */
  --gap-6: 1rem; /* 16px */
  --gap-7: 1.25rem; /* 20px */
  --gap-8: 1.5rem; /* 24px */
  --gap-9: 2rem; /* 32px */
}

.isGap * {
  --gap-0: initial;
  --gap-1: initial;
  --gap-2: initial;
  --gap-3: initial;
  --gap-4: initial;
  --gap-5: initial;
  --gap-6: initial;
  --gap-7: initial;
  --gap-8: initial;
  --gap-9: initial;
}

/* Components */

.alert {
  color: var(--alert-color);
  background-color: var(--alert-bg-color, var(--state-primary));
  border-radius: var(--alert-border-radius);
  padding: var(--alert-padding);
  margin-top: 0;
  margin-bottom: var(--component-margin-bottom);
  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--lighten-more)), to(var(--lighten-more)));
  background-image: linear-gradient(var(--lighten-more), var(--lighten-more));
  display: block;
}

.alert:empty {
  display: none;
}

.alert:hover {
  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--lighten-more)), to(var(--lighten-more)));
  background-image: linear-gradient(var(--lighten-more), var(--lighten-more));
}

a.alert {
  color: currentcolor;
  font-weight: var(--font-weight-bold);
  display: inline-block;
}

button,
.button {
  font-family: var(--button-font-family);
  font-size: var(--button-font-size);
  font-weight: var(--button-font-weight);
  text-align: center;
  text-decoration: none;
  color: var(--button-color, white);
  background-color: var(--button-bg-color, var(--state-primary));
  border-radius: var(--button-border-radius);
  border-style: solid;
  border-width: var(--button-border-width);
  border-color: var(--button-bg-color, var(--state-primary));
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  vertical-align: middle;
  white-space: nowrap;
  padding: var(--button-padding);
  cursor: pointer;
  line-height: calc((var(--button-font-size) * var(--line-height)) - 2px);
  display: inline-block;
  -webkit-transition: var(--button-speed) all;
  transition: var(--button-speed) all;
}

button:hover,
.button:hover {
  color: var(--button-color, white);
  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--darken)), to(var(--darken)));
  background-image: linear-gradient(var(--darken), var(--darken));
  text-decoration: none;
}

button:active,
button.isActive,
.button:active,
.button.isActive {
  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--lighten)), to(var(--lighten)));
  background-image: linear-gradient(var(--lighten), var(--lighten));
}

button:focus,
.button:focus {
  outline: none;
  box-shadow: var(--button-focus);
}

button:disabled,
button.isDisabled .button:disabled,
.button.isDisabled {
  opacity: 0.2;
  text-decoration: none;
  opacity: 0.5;
  cursor: not-allowed;
}

button.isOutline,
.button.isOutline {
  border-color: var(--button-bg-color, var(--state-primary));
  background-color: transparent;
  color: var(--button-color, var(--link-color));
}

button.isOutline:hover,
.button.isOutline:hover,
button.isOutline:focus,
.button.isOutline:focus {
  background-image: none;
  text-decoration: none;
}

button.isBlock,
.button.isBlock {
  width: 100% !important;
  display: block;
}

button.isLink,
.button.isLink {
  border-color: transparent;
  background-color: transparent;
  color: var(--link-color);
  -webkit-text-decoration: var(--link-text-decoration);
          text-decoration: var(--link-text-decoration);
}

button.isLink:hover,
.button.isLink:hover,
button.isLink:focus,
.button.isLink:focus {
  border-color: transparent;
  background-image: none;
  color: var(--link-color-hover);
  -webkit-text-decoration: var(--link-text-decoration-hover);
          text-decoration: var(--link-text-decoration-hover);
}

.chip {
  font-size: var(--chip-font-size);
  color: var(--chip-color);
  background-color: var(--chip-bg-color, var(--smoke));
  border-radius: var(--chip-border-radius);
  border: 2px solid var(--chip-border-color, var(--light));
  padding: var(--chip-padding);
  vertical-align: baseline;
  display: inline-block;
  -webkit-transition: var(--chip-speed) all;
  transition: var(--chip-speed) all;
  line-height: calc((var(--chip-font-size) * var(--line-height)) - 2px);
  font-weight: var(--chip-weight);
}

.chip:empty {
  display: none;
}

a.chip:hover {
  color: var(--chip-color);
  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--darken)), to(var(--darken)));
  background-image: linear-gradient(var(--darken), var(--darken));
  text-decoration: none;
  --chip-border-color: var(--chip-link-color);
}

a.chip:focus {
  outline: none;
  box-shadow: var(--chip-focus);
}

.dropdown {
  display: inline-block;
  background: var(--dropdown-bg-color);
  border-radius: var(--dropdown-border-radius);
  border-color: var(--dropdown-border-color);
  border-width: var(--dropdown-border-width);
  border-style: solid;
}

.dropdown li > a, .dropdown li :not(a) {
  display: block;
  padding: var(--dropdown-padding);
  border-bottom-color: var(--dropdown-border-color);
  border-bottom-width: var(--dropdown-border-width);
  border-bottom-style: solid;
}

.dropdown li a:hover {
  text-decoration: none;
  background-image: -webkit-gradient(linear, left top, left bottom, from(var(--darken)), to(var(--darken)));
  background-image: linear-gradient(var(--darken), var(--darken));
}

.dropdown li:last-of-type a {
  border-bottom: 0;
}

fieldset {
  border: solid var(--fieldset-border-width) var(--fieldset-border-color);
  border-radius: var(--fieldset-border-radius);
  padding: var(--fieldset-padding-y) var(--fieldset-padding-x);
  margin-bottom: 1.5rem;
}

fieldset legend {
  font-weight: var(--font-weight-bold);
  padding: 0 0.25rem;
}

fieldset:last-child {
  margin-bottom: 0;
}

label {
  color: var(--label-color);
  display: inline-block;
  margin-bottom: 0.25rem;
}

label + label {
  margin-left: 1rem;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]),
select,
textarea,
textarea[type="text"] {
  width: 100%;
  font-family: var(--input-font-family);
  font-size: var(--input-font-size);
  font-weight: var(--input-font-weight);
  color: var(--input-color);
  border: solid var(--input-border-width) var(--input-border-color);
  border-radius: var(--input-border-radius);
  background-color: var(--input-bg-color);
  line-height: var(--line-height);
  vertical-align: middle;
  display: block;
  padding: var(--input-padding);
  margin: 0;
  -webkit-transition: var(--component-speed) border-color,
    var(--component-speed) background-color, var(--component-speed) color;
  transition: var(--component-speed) border-color,
    var(--component-speed) background-color, var(--component-speed) color;
  white-space: nowrap;
  -moz-appearance: none;
  -webkit-appearance: none;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]):focus,
select:focus,
textarea:focus,
textarea[type="text"]:focus {
  outline: none;
  border-color: var(--input-focus-color);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"])[disabled],
select[disabled],
textarea[disabled],
textarea[type="text"][disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"])[readonly],
select[readonly],
textarea[readonly],
textarea[type="text"][readonly] {
  background-color: var(--input-readonly-bg-color);
}

input[type="checkbox"],
input[type="radio"] {
  vertical-align: 0.0625rem;
}

select {
  position: relative;
  background-image: url("data:image/svg+xml, %3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='41px' height='26px' viewBox='0 0 41 26' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cpolygon id='Path-3' fill='%23000000' points='0 5.38215461 19.9830489 25.3652035 40.1398855 5.20836689 34.9315186 0 19.8691842 15.0623344 4.83971338 0.0328636246'%3E%3C/polygon%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 0.5rem;
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 0.25rem;
}

textarea {
  height: auto;
  resize: vertical;
  line-height: var(--line-height);
  white-space: normal;
}

.inputField {
  margin-bottom: var(--component-margin-bottom);
}

.inputGroup {
  width: 100%;
  display: -webkit-box;
  display: flex;
  margin-bottom: var(--component-margin-bottom);
}

.inputGroup > input,
.inputGroup > button,
.inputGroup > .button,
.inputGroup > .inputIcon input,
.inputGroup > .inputIcon select {
  border-radius: 0;
}

.inputGroup > input:first-child,
.inputGroup > button:first-child,
.inputGroup > .button:first-child,
.inputGroup > .inputIcon:first-child input,
.inputGroup > .inputIcon:first-child select {
  border-top-left-radius: var(--input-border-radius);
  border-bottom-left-radius: var(--input-border-radius);
}

.inputGroup > input:last-child,
.inputGroup > button:last-child,
.inputGroup > .button:last-child,
.inputGroup > .inputIcon:last-child input,
.inputGroup > .inputIcon:last-child select {
  border-top-right-radius: var(--input-border-radius);
  border-bottom-right-radius: var(--input-border-radius);
}

.inputGroup > input + input {
  border-left-width: 0;
}

.inputGroup > input + input:focus {
  border-left-width: var(--input-border-width);
  margin-left: calc(var(--input-border-width) * -1);
}

.inputGroup button:focus,
.inputGroup .button:focus {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

.inputHint {
  font-size: var(--input-hint-font-size);
  color: var(--input-hint-color);
  margin: 0 0 0 0;
  display: block;
}

.inputGroup + .inputHint {
  margin-top: calc(-1 * var(--component-margin-bottom));
  margin-bottom: var(--component-margin-bottom);
}

.inputAddon {
  font-size: var(--input-font-size);
  line-height: var(--line-height);
  border-top: solid var(--input-border-width) var(--input-border-color);
  border-bottom: solid var(--input-border-width) var(--input-border-color);
  background: var(--input-addon-bg-color);
  color: var(--input-addon-color);
  padding: var(--input-padding);
  white-space: nowrap;
}

.inputAddon:first-child {
  border-left: solid var(--input-border-width) var(--input-border-color);
  border-top-left-radius: var(--input-border-radius);
  border-bottom-left-radius: var(--input-border-radius);
}

.inputAddon:last-child {
  border-right: solid var(--input-border-width) var(--input-border-color);
  border-top-right-radius: var(--input-border-radius);
  border-bottom-right-radius: var(--input-border-radius);
}

.inputIcon {
  position: relative;
  width: 100%;
}

.inputIcon select {
  position: static;
}

.inputIcon input:not(:first-child),
.inputIcon select:not(:first-child) {
  padding-left: var(--input-icon-width);
}

.inputIcon input:not(:last-child) {
  padding-right: var(--input-icon-width);
}

.inputIcon:first-child:not(input, select),
.inputIcon:last-child:not(input, select) {
  position: absolute;
  top: 0;
  left: var(--input-icon-offset);
  line-height: var(--line-height);
  color: var(--input-icon-color);
  vertical-align: middle;
  pointer-events: none;
}

.inputIcon:last-child:not(input, select) {
  left: auto;
  right: var(--input-icon-offset);
}

.isInvalid label {
  color: var(--input-invalid-color) !important;
}

.isInvalid input,
.isInvalid select,
.isInvalid textarea {
  color: var(--input-invalid-color) !important;
  border-color: var(--input-invalid-border-color) !important;
}

.isInvalid .inputIcon :first-child:not(input, select),
.isInvalid .inputIcon :last-child:not(input, select) {
  color: var(--input-invalid-color);
}

.isValid label {
  color: var(--input-valid-color) !important;
}

.isValid input,
.isValid select,
.isValid textarea {
  color: var(--input-valid-color) !important;
  border-color: var(--input-valid-border-color) !important;
}

.isValid .inputIcon :first-child:not(input, select),
.isValid .inputIcon :last-child:not(input, select) {
  color: var(--input-valid-color);
}

.listCircle > li {
  list-style-type: circle;
}

.listDecimal > li {
  list-style-type: decimal;
}

.listDisc > li {
  list-style-type: disc;
}

.listGreek > li {
  list-style-type: lower-greek;
}

.listLowerLatin > li {
  list-style-type: lower-latin;
}

.listLowerRoman > li {
  list-style-type: lower-roman;
}

.listNone > li {
  list-style-type: none;
}

.listSquare > li {
  list-style-type: square;
}

.listUpperLatin > li {
  list-style-type: upper-latin;
}

.listUpperRoman > li {
  list-style-type: upper-roman;
}

.listComma > * {
  display: inline-block;
}

.listComma > *:not(:last-child):after {
  content: ", ";
}

.listStep > li {
  counter-increment: step-counter;
}

.listStep > li::before {
  content: counter(step-counter);
  border-radius: 100px;
  width: 2rem;
  height: 2rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  margin-left: -2rem;
  margin-right: 1rem;
  text-align: center;
  display: inline-block;
  background-color: var(--list-step-bg-color);
  color: var(--list-step-color);
  line-height: 2;
}

[class*="list"].isAligned {
  margin-left: 1rem;
}

.listBreadcrumb {
  display: -webkit-box;
  display: flex;
  font-size: 14px;
}

.listBreadcrumb > li {
  display: block;
  font-weight: var(--list-breadcrumb-weight);
  color: var(--state-disabled);
}

.listBreadcrumb > li:after {
  display: inline-block;
  content: var(--list-breadcrumb-seperator);
  padding: 0 var(--list-breadcrumb-gap);
  color: var(--state-disabled);
}

.listBreadcrumb > li:last-of-type {
  color: inherit;
}

.listBreadcrumb li:last-of-type:after {
  content: none;
}

.nav {
  display: -webkit-box;
  display: flex;
  min-height: var(--nav-height);
  -webkit-box-align: center;
          align-items: center;
  color: var(--nav-link-color, var(--link-color));
}

.nav .navCenter {
  display: -webkit-box;
  display: flex;
  -webkit-box-flex: 1;
          flex: 1;
  -webkit-box-pack: center;
          justify-content: center;
}

.nav .navLeft {
  display: -webkit-box;
  display: flex;
  -webkit-box-flex: 1;
          flex: 1;
  -webkit-box-pack: start;
          justify-content: flex-start;
}

.nav .navRight {
  display: -webkit-box;
  display: flex;
  -webkit-box-flex: 1;
          flex: 1;
  -webkit-box-pack: end;
          justify-content: flex-end;
}

.nav img {
  max-height: var(--nav-height);
}

.nav a {
  text-decoration: none;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  padding: var(--nav-padding);
  color: inherit;
}

.nav .isActive:not(.button) {
  color: var(--nav-link-color, var(--link-color));
}

.nav .button {
  margin: var(--nav-padding);
  color: var(--button-color, white);
}

.tab {
  display: -webkit-box;
  display: flex;
  line-height: calc((var(--button-font-size) * var(--line-height)) - 2px);
}

.tab.isFull > a {
  -webkit-box-flex: 1;
          flex: 1;
}

.tab.isSimple > :not(.isActive) {
  border-color: transparent;
}

.tab > a {
  padding: var(--tab-padding);
  -webkit-box-flex: 0;
          flex: 0 1 auto;
  border-bottom: var(--tab-border) solid
    var(--tab-border-color, var(--state-disabled));
  text-align: center;
  text-decoration: none;
  color: var(--body-color);
}

.tab > a:hover {
  border-color: var(--tab-border-color, var(--state-primary));
  text-decoration: none;
}

.tab > a.isActive {
  border-color: var(--tab-border-color, var(--state-primary));
  color: var(--tab-color, var(--state-primary));
}

table {
  width: 100%;
  background-color: var(--table-bg-color);
  border-collapse: collapse;
  margin-bottom: 1.5rem;
}

table caption {
  caption-side: bottom;
  font-size: var(--font-size-small);
  color: var(--body-color-muted);
  text-align: center;
  padding-top: var(--table-spacing-y);
}

table th {
  text-align: left;
  background-color: var(--table-header-bg-color);
  border-bottom: solid var(--table-border-width)
    var(--table-border-color);
  padding: var(--table-spacing-y) var(--table-spacing-x);
}

table td {
  border-bottom: solid var(--table-border-width) var(--table-border-color);
  padding: var(--table-spacing-y) var(--table-spacing-x);
}

table.isBordered {
  border: solid var(--table-border-width) var(--table-border-color);
}

table.isBordered td {
  border-style: solid;
  border-width: var(--table-border-width);
  border-color: var(--table-border-color);
}

table.isHoverable tr:hover td {
  color: var(--table-hover-color);
  background-color: var(--table-hover-bg-color, var(--state-primary));
}

table.isStriped tr:nth-child(odd) td {
  background-color: var(--table-stripe-bg-color);
}

body {
  background: var(--body-bg-color);
  font-family: var(--font-family);
  font-weight: var(--font-weight);
  font-size: var(--font-size);
  color: var(--body-color);
  line-height: var(--line-height);
}

a {
  color: var(--link-color);
  -webkit-text-decoration: var(--link-text-decoration);
          text-decoration: var(--link-text-decoration);
}

a:hover {
  color: var(--link-color-hover);
  -webkit-text-decoration: var(--link-text-decoration-hover);
          text-decoration: var(--link-text-decoration-hover);
}

a.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: 0.5;
}

abbr[title] {
  text-decoration: none;
  border-bottom: dashed 2px currentcolor;
}

blockquote,
.blockquote {
  font-size: 120%;
  border-left: solid 0.25rem var(--component-border-color);
  padding: var(--blockquote-padding);
  margin-bottom: var(--component-margin-bottom);
  margin-left: 0;
}

blockquote :last-child,
.blockquote :last-child {
  margin-bottom: 0;
}

code,
.code {
  font-family: var(--font-monospace);
  font-size: var(--code-font-size);
  color: var(--code-color);
  background-color: var(--code-bg-color);
  border-radius: var(--code-border-radius);
  padding: var(--code-padding-y) var(--code-padding-x);
}

del,
.del {
  color: var(--red);
}

figure {
  margin-top: 0;
  margin-bottom: 1.5rem;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-weight: var(--headings-font-weight);
  line-height: var(--headings-line-height);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--headings-font-family);
  color: var(--headings-color);
  margin-bottom: var(--headings-margin-bottom);
  margin-top: 0;
}

h1,
.h1 {
  font-size: calc(var(--headings-font-size-h1) * var(--media-hdg, 1));
}

h2,
.h2 {
  font-size: calc(var(--headings-font-size-h2) * var(--media-hdg, 1));
}

h3,
.h3 {
  font-size: calc(var(--headings-font-size-h3) * var(--media-hdg, 1));
}

h4,
.h4 {
  font-size: calc(var(--headings-font-size-h4) * var(--media-hdg, 1));
}

h5,
.h5 {
  font-size: calc(var(--headings-font-size-h5) * var(--media-hdg, 1));
}

h6,
.h6 {
  font-size: calc(var(--headings-font-size-h6) * var(--media-hdg, 1));
}

hr {
  border: none;
  border-top: solid var(--hr-border-width) var(--hr-border-color);
  margin: var(--hr-margin-y) var(--hr-margin-x);
}

img,
.img {
  height: auto;
  max-width: 100%;
  vertical-align: middle;
}

ins,
.ins {
  color: var(--green);
}

kbd,
.kbd {
  font-family: var(--font-monospace);
  font-size: var(--kbd-font-size);
  color: var(--kbd-color);
  background-color: var(--kbd-bg-color);
  border-radius: var(--kbd-border-radius);
  padding: var(--kbd-padding-y) var(--kbd-padding-x);
}

mark,
.mark {
  color: var(--mark-color);
  background-color: var(--mark-bg-color);
  padding: var(--mark-padding-y) var(--mark-padding-x);
}

p {
  margin-top: 0;
  margin-bottom: var(--p-margin);
}

pre {
  max-height: var(--pre-max-height);
  overflow-y: auto;
  font-family: var(--font-monospace);
  color: var(--pre-color);
  background-color: var(--pre-bg-color);
  border-radius: var(--pre-border-radius);
  padding: 1rem;
  margin-top: 0;
  margin-bottom: 1.5rem;
}

.pre {
  white-space: pre;
}

.preline {
  white-space: pre-line;
}

.prewrap {
  white-space: pre-wrap;
}

.nowrap {
  white-space: nowrap;
}

small,
.small {
  font-size: var(--font-size-small);
}

sub {
  vertical-align: sub;
}

sup {
  vertical-align: super;
}

.ellipsis {
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.italic {
  font-style: italic;
}

.normal {
  font-style: normal;
}

.oblique {
  font-style: oblique;
}

.thin {
  font-weight: var(--font-weight-thin);
}

.regular {
  font-weight: var(--font-weight);
}

.medium {
  font-weight: var(--font-weight-medium);
}

b,
strong,
.bold {
  font-weight: var(--font-weight-bold);
}

.muted {
  color: var(--body-color-muted) !important;
}

.center {
  text-align: center;
}

.justify {
  text-align: justify;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

.linethrough {
  text-decoration: line-through;
}

.overline {
  text-decoration: overline;
}

.plaintext {
  text-decoration: none;
}

.underline {
  text-decoration: underline;
}

.capitalize {
  text-transform: capitalize;
}

.lowercase {
  text-transform: lowercase;
}

.uppercase {
  text-transform: uppercase;
}

.breakword {
  word-wrap: break-word;
}

.tooltip {
  display: inline-block;
  position: relative;
  border-bottom: 0.0625rem dashed var(--component-border-color);
}

.tooltip:hover > .tooltip-text {
  display: block;
}

.tooltipText {
  display: none;
  position: absolute;
  bottom: 125%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  min-width: var(--tooltip-min-width);
  padding: var(--tooltip-padding);
  color: var(--tooltip-color);
  text-align: center;
  background: var(--tooltip-bg-color);
  border-radius: var(--tooltip-border-radius);
}

/* Utilities */

.isAnimated {
  -webkit-animation-duration: var(--animation-duration, 1s);
          animation-duration: var(--animation-duration, 1s);
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-delay: var(--animation-delay, 0s);
          animation-delay: var(--animation-delay, 0s);
  -webkit-animation-name: var(--animation-name, none);
          animation-name: var(--animation-name, none);
}

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
            transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
            transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
          animation-name: pulse;
}

@-webkit-keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
          animation-name: shake;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
            transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
            transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
          animation-name: fadeInDown;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
            transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
            transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
          animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(var(--animation-translate, 100%), 0, 0);
            transform: translate3d(var(--animation-translate, 100%), 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(var(--animation-translate, 100%), 0, 0);
            transform: translate3d(var(--animation-translate, 100%), 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
          animation-name: fadeInRight;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, var(--animation-translate, 100%), 0);
            transform: translate3d(0, var(--animation-translate, 100%), 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, var(--animation-translate, 100%), 0);
            transform: translate3d(0, var(--animation-translate, 100%), 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
          animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, var(--animation-translate, 100%), 0);
            transform: translate3d(0, var(--animation-translate, 100%), 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, var(--animation-translate, 100%), 0);
            transform: translate3d(0, var(--animation-translate, 100%), 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
            transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
            transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
          animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(var(--animation-translate, 100%), 0, 0);
            transform: translate3d(var(--animation-translate, 100%), 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(var(--animation-translate, 100%), 0, 0);
            transform: translate3d(var(--animation-translate, 100%), 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
          animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
            transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
            transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
          animation-name: fadeOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
            transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
            transform: translate3d(0, calc(-1 * var(--animation-translate, 100%)), 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
          animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
            transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
            transform: translate3d(calc(-1 * var(--animation-translate, 100%)), 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
          animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(var(--animation-translate, 100%), 0, 0);
            transform: translate3d(var(--animation-translate, 100%), 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(var(--animation-translate, 100%), 0, 0);
            transform: translate3d(var(--animation-translate, 100%), 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
          animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, var(--animation-translate, 100%), 0);
            transform: translate3d(0, var(--animation-translate, 100%), 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, var(--animation-translate, 100%), 0);
            transform: translate3d(0, var(--animation-translate, 100%), 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
          animation-name: slideInUp;
}

.rad0 {
  border-radius: 0;
}

.rad1 {
  border-radius: 0.0625rem;
}

.rad2 {
  border-radius: 0.125rem;
}

.rad3 {
  border-radius: 0.25rem;
}

.rad4 {
  border-radius: 0.5rem;
}

.rad5 {
  border-radius: 0.75rem;
}

.rad100 {
  border-radius: 100%;
}

.radMax {
  border-radius: 9999px;
}

.bord1 {
  border: 0.0625rem solid;
}

.bord2 {
  border: 0.125rem solid;
}

.bordWid {
  border: var(--border-width, 0.5rem) solid;
}

.bordT1 {
  border-top: 0.0625rem solid;
}

.bordT2 {
  border-top: 0.125rem solid;
}

.bordTWid {
  border-top: var(--border-width, 0.5rem) solid;
}

.bordL1 {
  border-left: 0.0625rem solid;
}

.bordL2 {
  border-left: 0.125rem solid;
}

.bordLWid {
  border-left: var(--border-width, 0.5rem) solid;
}

.bordB1 {
  border-bottom: 0.0625rem solid;
}

.bordB2 {
  border-bottom: 0.125rem solid;
}

.bordBWid {
  border-bottom: var(--border-width, 0.5rem) solid;
}

.bordR1 {
  border-right: 0.0625rem solid;
}

.bordR2 {
  border-right: 0.125rem solid;
}

.bordRWid {
  border-right: var(--border-width, 0.5rem) solid;
}

.bordX1 {
  border-left: 0.0625rem solid;
  border-right: 0.0625rem solid;
}

.bordX2 {
  border-left: 0.125rem solid;
  border-right: 0.125rem solid;
}

.bordXWid {
  border-left: var(--border-width, 0.5rem) solid;
  border-right: var(--border-width, 0.5rem) solid;
}

.bordY1 {
  border-top: 0.0625rem solid;
  border-bottom: 0.0625rem solid;
}

.bordY2 {
  border-top: 0.125rem solid;
  border-bottom: 0.125rem solid;
}

.bordYWid {
  border-top: 0.25rem solid;
  border-bottom: var(--border-width, 0.5rem) solid;
}

.white {
  color: var(--white);
}

.smoke {
  color: var(--smoke);
}

.light,
.light {
  color: var(--light);
}

.silver {
  color: var(--silver);
}

.dark,
.dark {
  color: var(--dark);
}

.gray,
.grey {
  color: var(--gray);
}

.black {
  color: var(--black);
}

.red {
  color: var(--red);
}

.pink {
  color: var(--pink);
}

.grape {
  color: var(--grape);
}

.violet {
  color: var(--violet);
}

.indigo {
  color: var(--indigo);
}

.blue {
  color: var(--blue);
}

.cyan {
  color: var(--cyan);
}

.teal {
  color: var(--teal);
}

.green {
  color: var(--green);
}

.lime {
  color: var(--lime);
}

.yellow {
  color: var(--yellow);
}

.orange {
  color: var(--orange);
}

.primary {
  color: var(--state-primary);
}

.secondary {
  color: var(--state-secondary);
}

.success {
  color: var(--state-success);
}

.info {
  color: var(--state-info);
}

.warning {
  color: var(--state-warning);
}

.danger {
  color: var(--state-danger);
}

.disabled {
  color: var(--state-disabled);
}

.transparent {
  color: transparent;
}

.bgWhite {
  background-color: var(--white);
}

.bgSmoke {
  background-color: var(--smoke);
}

.bgLight,
.bgLight {
  background-color: var(--light);
}

.bgSilver {
  background-color: var(--silver);
}

.bgDark,
.bgDark {
  background-color: var(--dark);
}

.bgGray,
.bgGrey {
  background-color: var(--gray);
}

.bgBlack {
  background-color: var(--black);
}

.bgRed {
  background-color: var(--red);
}

.bgPink {
  background-color: var(--pink);
}

.bgGrape {
  background-color: var(--grape);
}

.bgViolet {
  background-color: var(--violet);
}

.bgIndigo {
  background-color: var(--indigo);
}

.bgBlue {
  background-color: var(--blue);
}

.bgCyan {
  background-color: var(--cyan);
}

.bgTeal {
  background-color: var(--teal);
}

.bgGreen {
  background-color: var(--green);
}

.bgLime {
  background-color: var(--lime);
}

.bgYellow {
  background-color: var(--yellow);
}

.bgOrange {
  background-color: var(--orange);
}

.bgPrimary {
  background-color: var(--state-primary);
}

.bgSecondary {
  background-color: var(--state-secondary);
}

.bgSuccess {
  background-color: var(--state-success);
}

.bgInfo {
  background-color: var(--state-info);
}

.bgWarning {
  background-color: var(--state-warning);
}

.bgDanger {
  background-color: var(--state-danger);
}

.bgDisabled {
  background-color: var(--state-disabled);
}

.bgTransparent {
  background-color: transparent;
}

.bordWhite {
  border-color: var(--white);
}

.bordSmoke {
  border-color: var(--smoke);
}

.bordLight,
.bordLight {
  border-color: var(--light);
}

.bordSilver {
  border-color: var(--silver);
}

.bordDark,
.bordDark {
  border-color: var(--dark);
}

.bordGray,
.bordGrey {
  border-color: var(--gray);
}

.bordBlack {
  border-color: var(--black);
}

.bordRed {
  border-color: var(--red);
}

.bordPink {
  border-color: var(--pink);
}

.bordGrape {
  border-color: var(--grape);
}

.bordViolet {
  border-color: var(--violet);
}

.bordIndigo {
  border-color: var(--indigo);
}

.bordBlue {
  border-color: var(--blue);
}

.bordCyan {
  border-color: var(--cyan);
}

.bordTeal {
  border-color: var(--teal);
}

.bordGreen {
  border-color: var(--green);
}

.bordLime {
  border-color: var(--lime);
}

.bordYellow {
  border-color: var(--yellow);
}

.bordOrange {
  border-color: var(--orange);
}

.bordPrimary {
  border-color: var(--state-primary);
}

.bordSecondary {
  border-color: var(--state-secondary);
}

.bordSuccess {
  border-color: var(--state-success);
}

.bordInfo {
  border-color: var(--state-info);
}

.bordWarning {
  border-color: var(--state-warning);
}

.bordDanger {
  border-color: var(--state-danger);
}

.bordDisabled {
  border-color: var(--state-disabled);
}

.bordTransparent {
  border-color: transparent;
}

.row,
.cols {
  max-width: var(--columns-width, 80rem);
  margin-left: auto;
  margin-right: auto;
  width: auto;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-flow: row wrap;
  -webkit-box-pack: start;
          justify-content: flex-start;
}

.row.isFull, .cols.isFull {
  max-width: 100%;
}

.row .row,
.cols .cols {
  margin-left: calc(var(--column-gutter, 2rem) / -2);
  margin-right: calc(var(--column-gutter, 2rem) / -2);
}

.row > .row,
.cols > .cols {
  margin-left: 0;
  margin-right: 0;
  width: 100%;
}

.col {
  -webkit-box-flex: 1;
          flex: 1;
}

.col,
.col1,
.col2,
.col3,
.col4,
.col5,
.col6,
.col7,
.col8,
.col9,
.col10,
.col11,
.col12 {
  padding: 0 calc(var(--column-gutter, 2rem) / 2);
  max-width: var(--columns-width, 80rem);
}

.cols {
  padding: 0;
}

.isFlush > .row,
.isFlush > .cols,
.isFlush > [class*='col'] {
  padding: 0;
}

.col1 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/1));
  max-width: calc(100% / (12/1));
}

.col2 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/2));
  max-width: calc(100% / (12/2));
}

.col3 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/3));
  max-width: calc(100% / (12/3));
}

.col4 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/4));
  max-width: calc(100% / (12/4));
}

.col5 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/5));
  max-width: calc(100% / (12/5));
}

.col6 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/6));
  max-width: calc(100% / (12/6));
}

.col7 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/7));
  max-width: calc(100% / (12/7));
}

.col8 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/8));
  max-width: calc(100% / (12/8));
}

.col9 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/9));
  max-width: calc(100% / (12/9));
}

.col10 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/10));
  max-width: calc(100% / (12/10));
}

.col11 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/11));
  max-width: calc(100% / (12/11));
}

.col12 {
  -webkit-box-flex: 0;
          flex: 0 0 calc(100% / (12/12));
  max-width: calc(100% / (12/12));
}

.isOrder1 {
  -webkit-box-ordinal-group: 2;
          order: 1;
}

.isOrder2 {
  -webkit-box-ordinal-group: 3;
          order: 2;
}

.isOrder3 {
  -webkit-box-ordinal-group: 4;
          order: 3;
}

.isOrder4 {
  -webkit-box-ordinal-group: 5;
          order: 4;
}

.isOrder5 {
  -webkit-box-ordinal-group: 6;
          order: 5;
}

.isOrder6 {
  -webkit-box-ordinal-group: 7;
          order: 6;
}

.isOrder7 {
  -webkit-box-ordinal-group: 8;
          order: 7;
}

.isOrder8 {
  -webkit-box-ordinal-group: 9;
          order: 8;
}

.isOrder9 {
  -webkit-box-ordinal-group: 10;
          order: 9;
}

.isOrder10 {
  -webkit-box-ordinal-group: 11;
          order: 10;
}

.isOrder11 {
  -webkit-box-ordinal-group: 12;
          order: 11;
}

.isOrder12 {
  -webkit-box-ordinal-group: 13;
          order: 12;
}

.isOffset1 {
  margin-left: calc(100% / (12/1));
}

.isOffset2 {
  margin-left: calc(100% / (12/2));
}

.isOffset3 {
  margin-left: calc(100% / (12/3));
}

.isOffset4 {
  margin-left: calc(100% / (12/4));
}

.isOffset5 {
  margin-left: calc(100% / (12/5));
}

.isOffset6 {
  margin-left: calc(100% / (12/6));
}

.isOffset7 {
  margin-left: calc(100% / (12/7));
}

.isOffset8 {
  margin-left: calc(100% / (12/8));
}

.isOffset9 {
  margin-left: calc(100% / (12/9));
}

.isOffset10 {
  margin-left: calc(100% / (12/10));
}

.isOffset11 {
  margin-left: calc(100% / (12/11));
}

[class*=' multiCol'],
[class^='multiCol'] {
  -webkit-column-gap: var(--column-gap);
     -moz-column-gap: var(--column-gap);
          column-gap: var(--column-gap);
}

.multiCol2 {
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
}

.multiCol3 {
  -webkit-column-count: 3;
     -moz-column-count: 3;
          column-count: 3;
}

.multiCol4 {
  -webkit-column-count: 4;
     -moz-column-count: 4;
          column-count: 4;
}

.ht0 {
  height: 0;
}

.ht1 {
  height: var(--gap-1, var(--space-1));
}

.ht2 {
  height: var(--gap-2, var(--space-2));
}

.ht3 {
  height: var(--gap-3, var(--space-3));
}

.ht4 {
  height: var(--gap-4, var(--space-4));
}

.ht5 {
  height: var(--gap-5, var(--space-5));
}

.ht6 {
  height: var(--gap-6, var(--space-6));
}

.ht7 {
  height: var(--gap-7, var(--space-7));
}

.ht8 {
  height: var(--gap-8, var(--space-8));
}

.ht9 {
  height: var(--gap-9, var(--space-9));
}

.ht25 {
  height: 25%;
}

.ht33 {
  height: calc(100% / 3);
}

.ht50 {
  height: 50%;
}

.ht66 {
  height: calc((100% / 3) * 2);
}

.ht75 {
  height: 75%;
}

.ht100 {
  height: 100%;
}

.viewHt25 {
  min-height: 25vh;
}

.viewHt33 {
  min-height: calc(100 / 3) vh;
}

.viewHt50 {
  min-height: 50vh;
}

.viewHt66 {
  min-height: calc((100 / 3) * 2) vh;
}

.viewHt75 {
  min-height: 75vh;
}

.viewHt100 {
  min-height: 100vh;
}

.wid0 {
  width: 0;
}

.wid1 {
  width: var(--gap-1, var(--space-1));
}

.wid2 {
  width: var(--gap-2, var(--space-2));
}

.wid3 {
  width: var(--gap-3, var(--space-3));
}

.wid4 {
  width: var(--gap-4, var(--space-4));
}

.wid5 {
  width: var(--gap-5, var(--space-5));
}

.wid6 {
  width: var(--gap-6, var(--space-6));
}

.wid7 {
  width: var(--gap-7, var(--space-7));
}

.wid8 {
  width: var(--gap-8, var(--space-8));
}

.wid9 {
  width: var(--gap-9, var(--space-9));
}

.wid25 {
  width: 25%;
}

.wid33 {
  width: calc(100% / 3);
}

.wid50 {
  width: 50%;
}

.wid66 {
  width: calc((100% / 3) * 2);
}

.wid75 {
  width: 75%;
}

.wid100 {
  width: 100%;
}

.viewWid25 {
  width: 25vw;
}

.viewWid33 {
  width: calc(100 / 3) vw;
}

.viewWid50 {
  width: 50vw;
}

.viewWid66 {
  width: calc((100 / 3) * 2) vw;
}

.viewWid75 {
  width: 75vw;
}

.viewWid100 {
  width: 100vw;
}

.maxWid0 {
  max-width: 0;
}

.maxWid1 {
  max-width: var(--gap-1, var(--space-1));
}

.maxWid2 {
  max-width: var(--gap-2, var(--space-2));
}

.maxWid3 {
  max-width: var(--gap-3, var(--space-3));
}

.maxWid4 {
  max-width: var(--gap-4, var(--space-4));
}

.maxWid5 {
  max-width: var(--gap-5, var(--space-5));
}

.maxWid6 {
  max-width: var(--gap-6, var(--space-6));
}

.maxWid7 {
  max-width: var(--gap-7, var(--space-7));
}

.maxWid8 {
  max-width: var(--gap-8, var(--space-8));
}

.maxWid9 {
  max-width: var(--gap-9, var(--space-9));
}

.maxWid25 {
  max-width: 25%;
}

.maxWid33 {
  max-width: calc(100% / 3);
}

.maxWid50 {
  max-width: 50%;
}

.maxWid66 {
  max-width: calc((100% / 3) * 2);
}

.maxWid75 {
  max-width: 75%;
}

.maxWid100 {
  max-width: 100%;
}

.clearfix:after {
  clear: both;
}

.clearfix:after,
.clearfix:before {
  display: block;
  content: " ";
}

.block {
  display: block;
}

.hidden {
  visibility: hidden;
}

.visible {
  visibility: visible;
}

.inline {
  display: inline;
}

.inlineBlock {
  display: inline-block;
}

.inlineFlex {
  display: -webkit-inline-box;
  display: inline-flex;
}

.inlineTable {
  display: inline-table;
}

.none {
  display: none;
}

.table {
  display: table;
  table-layout: fixed;
}

.tableCell {
  display: table-cell;
}

.tableColumn {
  display: table-column;
}

.tableRow {
  display: table-row;
}

.floatLeft {
  float: left;
}

.floatRight {
  float: right;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

.relative {
  position: relative;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
}

.bottom0 {
  bottom: 0;
}

.bottom1 {
  bottom: var(--gap-1, var(--space-1));
}

.bottom2 {
  bottom: var(--gap-2, var(--space-2));
}

.bottom3 {
  bottom: var(--gap-3, var(--space-3));
}

.bottom4 {
  bottom: var(--gap-4, var(--space-4));
}

.bottom5 {
  bottom: var(--gap-5, var(--space-5));
}

.bottom6 {
  bottom: var(--gap-6, var(--space-6));
}

.bottom7 {
  bottom: var(--gap-7, var(--space-7));
}

.bottom8 {
  bottom: var(--gap-8, var(--space-8));
}

.bottom9 {
  bottom: var(--gap-9, var(--space-9));
}

.left0 {
  left: 0;
}

.left1 {
  left: var(--gap-1, var(--space-1));
}

.left2 {
  left: var(--gap-2, var(--space-2));
}

.left3 {
  left: var(--gap-3, var(--space-3));
}

.left4 {
  left: var(--gap-4, var(--space-4));
}

.left5 {
  left: var(--gap-5, var(--space-5));
}

.left6 {
  left: var(--gap-6, var(--space-6));
}

.left7 {
  left: var(--gap-7, var(--space-7));
}

.left8 {
  left: var(--gap-8, var(--space-8));
}

.left9 {
  left: var(--gap-9, var(--space-9));
}

.right0 {
  right: 0;
}

.right1 {
  right: var(--gap-1, var(--space-1));
}

.right2 {
  right: var(--gap-2, var(--space-2));
}

.right3 {
  right: var(--gap-3, var(--space-3));
}

.right4 {
  right: var(--gap-4, var(--space-4));
}

.right5 {
  right: var(--gap-5, var(--space-5));
}

.right6 {
  right: var(--gap-6, var(--space-6));
}

.right7 {
  right: var(--gap-7, var(--space-7));
}

.right8 {
  right: var(--gap-8, var(--space-8));
}

.right9 {
  right: var(--gap-9, var(--space-9));
}

.top0 {
  top: 0;
}

.top1 {
  top: var(--gap-1, var(--space-1));
}

.top2 {
  top: var(--gap-2, var(--space-2));
}

.top3 {
  top: var(--gap-3, var(--space-3));
}

.top4 {
  top: var(--gap-4, var(--space-4));
}

.top5 {
  top: var(--gap-5, var(--space-5));
}

.top6 {
  top: var(--gap-6, var(--space-6));
}

.top7 {
  top: var(--gap-7, var(--space-7));
}

.top8 {
  top: var(--gap-8, var(--space-8));
}

.top9 {
  top: var(--gap-9, var(--space-9));
}

.z0 {
  z-index: 0;
}

.z1 {
  z-index: 10;
}

.z2 {
  z-index: 20;
}

.z3 {
  z-index: 30;
}

.z4 {
  z-index: 40;
}

.z5 {
  z-index: 50;
}

.z6 {
  z-index: 60;
}

.z7 {
  z-index: 70;
}

.z8 {
  z-index: 80;
}

.z9 {
  z-index: 90;
}

.z10 {
  z-index: 100;
}

.overflowHidden {
  overflow: hidden;
}

.overflowScroll {
  overflow: scroll;
}

.flex {
  display: -webkit-box;
  display: flex;
}

.flexWrap {
  flex-wrap: wrap;
}

.flexWrapReverse {
  flex-wrap: wrap-reverse;
}

.flexReverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
          flex-direction: row-reverse;
}

.flexReverse.flexCol {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
          flex-direction: column-reverse;
}

.flexCol {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
}

.flexRow {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}

.flexCenter {
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
}

.flexYCenter {
  -webkit-box-align: center;
          align-items: center;
}

.flexXCenter {
  -webkit-box-pack: center;
          justify-content: center;
}

.flexAround {
  justify-content: space-around;
}

.flexBetween {
  -webkit-box-pack: justify;
          justify-content: space-between;
}

.flexRight {
  -webkit-box-pack: end;
          justify-content: flex-end;
}

.flexBaseline {
  -webkit-box-align: baseline;
          align-items: baseline;
}

.flexEnd {
  -webkit-box-align: end;
          align-items: flex-end;
}

.flexStart {
  -webkit-box-align: start;
          align-items: flex-start;
}

.grow1,
.grow2,
.grow3,
.grow4,
.grow5,
.grow6 {
  flex-basis: 0;
}

.grow1 {
  -webkit-box-flex: 1;
          flex-grow: 1;
}

.grow2 {
  -webkit-box-flex: 2;
          flex-grow: 2;
}

.grow3 {
  -webkit-box-flex: 3;
          flex-grow: 3;
}

.grow4 {
  -webkit-box-flex: 4;
          flex-grow: 4;
}

.grow5 {
  -webkit-box-flex: 5;
          flex-grow: 5;
}

.grow6 {
  -webkit-box-flex: 6;
          flex-grow: 6;
}

.selfCenter {
  align-self: center;
}

.selfStart {
  align-self: flex-start;
}

.selfEnd {
  align-self: flex-end;
}

.selfBaseline {
  align-self: baseline;
}

.grid {
  display: grid;
}

.gridGap0 {
  grid-gap: 0;
}

.gridGap1 {
  grid-gap: var(--gap-1, var(--space-1));
}

.gridGap2 {
  grid-gap: var(--gap-2, var(--space-2));
}

.gridGap3 {
  grid-gap: var(--gap-3, var(--space-3));
}

.gridGap4 {
  grid-gap: var(--gap-4, var(--space-4));
}

.gridGap5 {
  grid-gap: var(--gap-5, var(--space-5));
}

.gridGapX0 {
  grid-row-gap: 0;
}

.gridGapX1 {
  grid-row-gap: var(--gap-1, var(--space-1));
}

.gridGapX2 {
  grid-row-gap: var(--gap-2, var(--space-2));
}

.gridGapX3 {
  grid-row-gap: var(--gap-3, var(--space-3));
}

.gridGapX4 {
  grid-row-gap: var(--gap-4, var(--space-4));
}

.gridGapX5 {
  grid-row-gap: var(--gap-5, var(--space-5));
}

.gridGapY0 {
  grid-column-gap: 0;
}

.gridGapY1 {
  grid-column-gap: var(--gap-1, var(--space-1));
}

.gridGapY2 {
  grid-column-gap: var(--gap-2, var(--space-2));
}

.gridGapY3 {
  grid-column-gap: var(--gap-3, var(--space-3));
}

.gridGapY4 {
  grid-column-gap: var(--gap-4, var(--space-4));
}

.gridGapY5 {
  grid-column-gap: var(--gap-5, var(--space-5));
}

.gridColsdense {
  grid-auto-flow: row dense;
}

.gridCols,
[class*="gridCols"] {
  grid-auto-flow: row;
}

.gridCols2 {
  grid-template-columns: repeat(2, 1fr);
}

.gridCols3 {
  grid-template-columns: repeat(3, 1fr);
}

.gridCols4 {
  grid-template-columns: repeat(4, 1fr);
}

.gridCols5 {
  grid-template-columns: repeat(5, 1fr);
}

.gridCols6 {
  grid-template-columns: repeat(6, 1fr);
}

.gridCols7 {
  grid-template-columns: repeat(7, 1fr);
}

.gridCols8 {
  grid-template-columns: repeat(8, 1fr);
}

.gridCols9 {
  grid-template-columns: repeat(9, 1fr);
}

.gridCols {
  grid-template-columns: var(--grid-columns);
}

.gridRowsDense {
  grid-auto-flow: column dense;
}

.gridRows,
[class*="gridRows"] {
  grid-auto-flow: column;
}

.gridRows2 {
  grid-template-rows: repeat(2, 1fr);
}

.gridRows3 {
  grid-template-rows: repeat(3, 1fr);
}

.gridRows4 {
  grid-template-rows: repeat(4, 1fr);
}

.gridRows5 {
  grid-template-rows: repeat(5, 1fr);
}

.gridRows6 {
  grid-template-rows: repeat(6, 1fr);
}

.gridRows7 {
  grid-template-rows: repeat(7, 1fr);
}

.gridRows8 {
  grid-template-rows: repeat(8, 1fr);
}

.gridRows {
  grid-template-rows: var(--grid-rows);
}

.Grid > * {
  grid-column: var(--grid-column);
  grid-row: var(--grid-row);
}

.gridRowSpan2 {
  grid-row: span 2;
}

.gridRowSpan3 {
  grid-row: span 3;
}

.gridRowSpan4 {
  grid-row: span 4;
}

.gridRowSpan5 {
  grid-row: span 5;
}

.gridRowSpan6 {
  grid-row: span 6;
}

.gridRowSpan7 {
  grid-row: span 7;
}

.grid-row-span {
  grid-row: var(--grid-row);
}

.gridColSpan2 {
  grid-column: span 2;
}

.gridColSpan3 {
  grid-column: span 3;
}

.gridColSpan4 {
  grid-column: span 4;
}

.gridColSpan5 {
  grid-column: span 5;
}

.gridColSpan6 {
  grid-column: span 6;
}

.gridColSpan7 {
  grid-column: span 7;
}

.gridColSpan {
  grid-column: var(--grid-column);
}

.show,
.showTablet {
  display: none;
}

@media screen and (max-width: 48rem) {
  .hide {
    display: none !important;
  }

  .show {
    display: block !important;
  }

  [class*="Offset"],
  [class*="col"] {
    margin-left: auto;
    margin-right: auto;
    -webkit-box-flex: 0;
            flex: 0 1 100%;
    max-width: 100%;
    min-width: 100%;
  }

  .nav,
  .nav > .cols,
  .nav > .row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
  }

  .navCenter,
  .navLeft,
  .navRight {
    flex-wrap: wrap;
    -webkit-box-pack: center;
            justify-content: center;
  }

  .padReset {
    padding: 0 !important;
  }

  .marReset {
    margin: 0 !important;
  }

  .hdg {
    --media-hdg: 0.8;
  }
}

@media screen and (min-width: 48rem) and (max-width: 60rem) {
  .hideTablet {
    display: none !important;
  }

  .showTablet {
    display: block !important;
  }

  .padTabletReset {
    padding: 0 !important;
  }

  .marTabletReset {
    margin: 0 !important;
  }

  .hdgTablet {
    --media-hdg: 0.9;
  }
}

.opac100 {
  opacity: 1;
}

.opac90 {
  opacity: .9;
}

.opac80 {
  opacity: .8;
}

.opac70 {
  opacity: .7;
}

.opac60 {
  opacity: .6;
}

.opac50 {
  opacity: .5;
}

.opac40 {
  opacity: .4;
}

.opac30 {
  opacity: .3;
}

.opac20 {
  opacity: .2;
}

.opac10 {
  opacity: .1;
}

.opac0 {
  opacity: 0;
}

.mar0 {
  margin: 0;
}

.mar1 {
  margin: var(--gap-1, var(--space-1));
}

.mar2 {
  margin: var(--gap-2, var(--space-2));
}

.mar3 {
  margin: var(--gap-3, var(--space-3));
}

.mar4 {
  margin: var(--gap-4, var(--space-4));
}

.mar5 {
  margin: var(--gap-5, var(--space-5));
}

.mar6 {
  margin: var(--gap-6, var(--space-6));
}

.mar7 {
  margin: var(--gap-7, var(--space-7));
}

.mar8 {
  margin: var(--gap-8, var(--space-8));
}

.mar9 {
  margin: var(--gap-9, var(--space-9));
}

.marT0 {
  margin-top: 0;
}

.marT1 {
  margin-top: var(--gap-1, var(--space-1));
}

.marT2 {
  margin-top: var(--gap-2, var(--space-2));
}

.marT3 {
  margin-top: var(--gap-3, var(--space-3));
}

.marT4 {
  margin-top: var(--gap-4, var(--space-4));
}

.marT5 {
  margin-top: var(--gap-5, var(--space-5));
}

.marT6 {
  margin-top: var(--gap-6, var(--space-6));
}

.marT7 {
  margin-top: var(--gap-7, var(--space-7));
}

.marT8 {
  margin-top: var(--gap-8, var(--space-8));
}

.marT9 {
  margin-top: var(--gap-9, var(--space-9));
}

.marL0 {
  margin-left: 0;
}

.marL1 {
  margin-left: var(--gap-1, var(--space-1));
}

.marL2 {
  margin-left: var(--gap-2, var(--space-2));
}

.marL3 {
  margin-left: var(--gap-3, var(--space-3));
}

.marL4 {
  margin-left: var(--gap-4, var(--space-4));
}

.marL5 {
  margin-left: var(--gap-5, var(--space-5));
}

.marL6 {
  margin-left: var(--gap-6, var(--space-6));
}

.marL7 {
  margin-left: var(--gap-7, var(--space-7));
}

.marL8 {
  margin-left: var(--gap-8, var(--space-8));
}

.marL9 {
  margin-left: var(--gap-9, var(--space-9));
}

.marB0 {
  margin-bottom: 0;
}

.marB1 {
  margin-bottom: var(--gap-1, var(--space-1));
}

.marB2 {
  margin-bottom: var(--gap-2, var(--space-2));
}

.marB3 {
  margin-bottom: var(--gap-3, var(--space-3));
}

.marB4 {
  margin-bottom: var(--gap-4, var(--space-4));
}

.marB5 {
  margin-bottom: var(--gap-5, var(--space-5));
}

.marB6 {
  margin-bottom: var(--gap-6, var(--space-6));
}

.marB7 {
  margin-bottom: var(--gap-7, var(--space-7));
}

.marB8 {
  margin-bottom: var(--gap-8, var(--space-8));
}

.marB9 {
  margin-bottom: var(--gap-9, var(--space-9));
}

.marR0 {
  margin-right: 0;
}

.marR1 {
  margin-right: var(--gap-1, var(--space-1));
}

.marR2 {
  margin-right: var(--gap-2, var(--space-2));
}

.marR3 {
  margin-right: var(--gap-3, var(--space-3));
}

.marR4 {
  margin-right: var(--gap-4, var(--space-4));
}

.marR5 {
  margin-right: var(--gap-5, var(--space-5));
}

.marR6 {
  margin-right: var(--gap-6, var(--space-6));
}

.marR7 {
  margin-right: var(--gap-7, var(--space-7));
}

.marR8 {
  margin-right: var(--gap-8, var(--space-8));
}

.marR9 {
  margin-right: var(--gap-9, var(--space-9));
}

.marXauto {
  margin-left: auto;
  margin-right: auto;
}

.marX0 {
  margin-left: 0;
  margin-right: 0;
}

.marX1 {
  margin-left: var(--gap-1, var(--space-1));
  margin-right: var(--gap-1, var(--space-1));
}

.marX2 {
  margin-left: var(--gap-2, var(--space-2));
  margin-right: var(--gap-2, var(--space-2));
}

.marX3 {
  margin-left: var(--gap-3, var(--space-3));
  margin-right: var(--gap-3, var(--space-3));
}

.marX4 {
  margin-left: var(--gap-4, var(--space-4));
  margin-right: var(--gap-4, var(--space-4));
}

.marX5 {
  margin-left: var(--gap-5, var(--space-5));
  margin-right: var(--gap-5, var(--space-5));
}

.marX6 {
  margin-left: var(--gap-6, var(--space-6));
  margin-right: var(--gap-6, var(--space-6));
}

.marX7 {
  margin-left: var(--gap-7, var(--space-7));
  margin-right: var(--gap-7, var(--space-7));
}

.marX8 {
  margin-left: var(--gap-8, var(--space-8));
  margin-right: var(--gap-8, var(--space-8));
}

.marX9 {
  margin-left: var(--gap-9, var(--space-9));
  margin-right: var(--gap-9, var(--space-9));
}

.marY0 {
  margin-bottom: 0;
  margin-top: 0;
}

.marY1 {
  margin-bottom: var(--gap-1, var(--space-1));
  margin-top: var(--gap-1, var(--space-1));
}

.marY2 {
  margin-bottom: var(--gap-2, var(--space-2));
  margin-top: var(--gap-2, var(--space-2));
}

.marY3 {
  margin-bottom: var(--gap-3, var(--space-3));
  margin-top: var(--gap-3, var(--space-3));
}

.marY4 {
  margin-bottom: var(--gap-4, var(--space-4));
  margin-top: var(--gap-4, var(--space-4));
}

.marY5 {
  margin-bottom: var(--gap-5, var(--space-5));
  margin-top: var(--gap-5, var(--space-5));
}

.marY6 {
  margin-bottom: var(--gap-6, var(--space-6));
  margin-top: var(--gap-6, var(--space-6));
}

.marY7 {
  margin-bottom: var(--gap-7, var(--space-7));
  margin-top: var(--gap-7, var(--space-7));
}

.marY8 {
  margin-bottom: var(--gap-8, var(--space-8));
  margin-top: var(--gap-8, var(--space-8));
}

.marY9 {
  margin-bottom: var(--gap-9, var(--space-9));
  margin-top: var(--gap-9, var(--space-9));
}

.pad0 {
  padding: 0;
}

.pad1 {
  padding: var(--gap-1, var(--space-1));
}

.pad2 {
  padding: var(--gap-2, var(--space-2));
}

.pad3 {
  padding: var(--gap-3, var(--space-3));
}

.pad4 {
  padding: var(--gap-4, var(--space-4));
}

.pad5 {
  padding: var(--gap-5, var(--space-5));
}

.pad6 {
  padding: var(--gap-6, var(--space-6));
}

.pad7 {
  padding: var(--gap-7, var(--space-7));
}

.pad8 {
  padding: var(--gap-8, var(--space-8));
}

.pad9 {
  padding: var(--gap-9, var(--space-9));
}

.padT0 {
  padding-top: 0;
}

.padT1 {
  padding-top: var(--gap-1, var(--space-1));
}

.padT2 {
  padding-top: var(--gap-2, var(--space-2));
}

.padT3 {
  padding-top: var(--gap-3, var(--space-3));
}

.padT4 {
  padding-top: var(--gap-4, var(--space-4));
}

.padT5 {
  padding-top: var(--gap-5, var(--space-5));
}

.padT6 {
  padding-top: var(--gap-6, var(--space-6));
}

.padT7 {
  padding-top: var(--gap-7, var(--space-7));
}

.padT8 {
  padding-top: var(--gap-8, var(--space-8));
}

.padT9 {
  padding-top: var(--gap-9, var(--space-9));
}

.padL0 {
  padding-left: 0;
}

.padL1 {
  padding-left: var(--gap-1, var(--space-1));
}

.padL2 {
  padding-left: var(--gap-2, var(--space-2));
}

.padL3 {
  padding-left: var(--gap-3, var(--space-3));
}

.padL4 {
  padding-left: var(--gap-4, var(--space-4));
}

.padL5 {
  padding-left: var(--gap-5, var(--space-5));
}

.padL6 {
  padding-left: var(--gap-6, var(--space-6));
}

.padL7 {
  padding-left: var(--gap-7, var(--space-7));
}

.padL8 {
  padding-left: var(--gap-8, var(--space-8));
}

.padL9 {
  padding-left: var(--gap-9, var(--space-9));
}

.padB0 {
  padding-bottom: 0;
}

.padB1 {
  padding-bottom: var(--gap-1, var(--space-1));
}

.padB2 {
  padding-bottom: var(--gap-2, var(--space-2));
}

.padB3 {
  padding-bottom: var(--gap-3, var(--space-3));
}

.padB4 {
  padding-bottom: var(--gap-4, var(--space-4));
}

.padB5 {
  padding-bottom: var(--gap-5, var(--space-5));
}

.padB6 {
  padding-bottom: var(--gap-6, var(--space-6));
}

.padB7 {
  padding-bottom: var(--gap-7, var(--space-7));
}

.padB8 {
  padding-bottom: var(--gap-8, var(--space-8));
}

.padB9 {
  padding-bottom: var(--gap-9, var(--space-9));
}

.padR0 {
  padding-right: 0;
}

.padR1 {
  padding-right: var(--gap-1, var(--space-1));
}

.padR2 {
  padding-right: var(--gap-2, var(--space-2));
}

.padR3 {
  padding-right: var(--gap-3, var(--space-3));
}

.padR4 {
  padding-right: var(--gap-4, var(--space-4));
}

.padR5 {
  padding-right: var(--gap-5, var(--space-5));
}

.padR6 {
  padding-right: var(--gap-6, var(--space-6));
}

.padR7 {
  padding-right: var(--gap-7, var(--space-7));
}

.padR8 {
  padding-right: var(--gap-8, var(--space-8));
}

.padR9 {
  padding-right: var(--gap-9, var(--space-9));
}

.padX0 {
  padding-left: 0;
  padding-right: 0;
}

.padX1 {
  padding-left: var(--gap-1, var(--space-1));
  padding-right: var(--gap-1, var(--space-1));
}

.padX2 {
  padding-left: var(--gap-2, var(--space-2));
  padding-right: var(--gap-2, var(--space-2));
}

.padX3 {
  padding-left: var(--gap-3, var(--space-3));
  padding-right: var(--gap-3, var(--space-3));
}

.padX4 {
  padding-left: var(--gap-4, var(--space-4));
  padding-right: var(--gap-4, var(--space-4));
}

.padX5 {
  padding-left: var(--gap-5, var(--space-5));
  padding-right: var(--gap-5, var(--space-5));
}

.padX6 {
  padding-left: var(--gap-6, var(--space-6));
  padding-right: var(--gap-6, var(--space-6));
}

.padX7 {
  padding-left: var(--gap-7, var(--space-7));
  padding-right: var(--gap-7, var(--space-7));
}

.padX8 {
  padding-left: var(--gap-8, var(--space-8));
  padding-right: var(--gap-8, var(--space-8));
}

.padX9 {
  padding-left: var(--gap-9, var(--space-9));
  padding-right: var(--gap-9, var(--space-9));
}

.padY0 {
  padding-bottom: 0;
  padding-top: 0;
}

.padY1 {
  padding-bottom: var(--gap-1, var(--space-1));
  padding-top: var(--gap-1, var(--space-1));
}

.padY2 {
  padding-bottom: var(--gap-2, var(--space-2));
  padding-top: var(--gap-2, var(--space-2));
}

.padY3 {
  padding-bottom: var(--gap-3, var(--space-3));
  padding-top: var(--gap-3, var(--space-3));
}

.padY4 {
  padding-bottom: var(--gap-4, var(--space-4));
  padding-top: var(--gap-4, var(--space-4));
}

.padY5 {
  padding-bottom: var(--gap-5, var(--space-5));
  padding-top: var(--gap-5, var(--space-5));
}

.padY6 {
  padding-bottom: var(--gap-6, var(--space-6));
  padding-top: var(--gap-6, var(--space-6));
}

.padY7 {
  padding-bottom: var(--gap-7, var(--space-7));
  padding-top: var(--gap-7, var(--space-7));
}

.padY8 {
  padding-bottom: var(--gap-8, var(--space-8));
  padding-top: var(--gap-8, var(--space-8));
}

.padY9 {
  padding-bottom: var(--gap-9, var(--space-9));
  padding-top: var(--gap-9, var(--space-9));
}

.shadow0 {
  box-shadow: none;
}

.shadow1 {
  box-shadow: 0 0.625rem 0.625rem var(--component-shadow);
}

.shadow2 {
  box-shadow: 0 0.125rem 0.125rem var(--component-shadow);
}

.shadow3 {
  box-shadow: 0 0.25rem 0.25rem var(--component-shadow);
}

.shadow4 {
  box-shadow: 0 0.5rem 0.5rem var(--component-shadow);
}

.shadow5 {
  box-shadow: 0 0.75rem 0.75rem var(--component-shadow);
}