@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;700&display=swap");
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
  ========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
  ========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
  margin: 0;
}

/**
* Render the `main` element consistently in IE.
*/
main {
  display: block;
}

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
  ========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
  box-sizing: content-box; /* 1 */
  block-size: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
  ========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
  background-color: transparent;
}

/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
  font-weight: bolder;
}

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
* Add the correct font size in all browsers.
*/
small {
  font-size: 80%;
}

/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
  ========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
  border-style: none;
}

/* Forms
  ========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
  overflow: visible;
}

/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
  text-transform: none;
}

/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
}

/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
* Correct the padding in Firefox.
*/
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
*    `fieldset` elements in all browsers.
*/
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-inline-size: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
  vertical-align: baseline;
}

/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
  overflow: auto;
}

/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  block-size: auto;
}

/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
  ========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
  display: block;
}

/*
* Add the correct display in all browsers.
*/
summary {
  display: list-item;
}

/* Misc
  ========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
  display: none;
}

/**
* Add the correct display in IE 10.
*/
[hidden] {
  display: none;
}

:root {
  --framex-alert-color-danger: hsl(0, 71%, 51%);
  --framex-alert-color-info: hsl(195, 100%, 42%);
  --framex-alert-color-success: hsl(150, 100%, 33%);
  --framex-alert-color-warning: hsl(48, 89%, 55%);
}

:root {
  --framex-base-color-background: rgba(255, 255, 255, 0.6705882353);
  --framex-base-color-blockquote-border: #2563EB;
  --framex-base-color-border: hsl(216, 12%, 84%);
  --framex-base-color-code-background: #f1f5fe;
  --framex-base-color-code-foreground: hsl(205, 100%, 2%);
  --framex-base-color-heading: hsl(215, 28%, 17%);
  --framex-base-color-link: #2563EB;
  --framex-base-color-link-hover: #124bc7;
  --framex-base-color-mark-background: hsl(50, 100%, 80%);
  --framex-base-color-mark-foreground: hsl(205, 100%, 2%);
  --framex-base-color-marker: #2563EB;
  --framex-base-color-primary: #2563EB;
  --framex-base-color-secondary: hsl(186, 100%, 60%);
  --framex-base-color-strong: hsl(205, 100%, 2%);
  --framex-base-color-text: hsl(221, 39%, 11%);
  --framex-base-color-master: hsl(231, 80%, 43%);
  --framex-base-color-ash: hsl(216, 12%, 84%);
  --framex-base-color-dark: hsl(215, 28%, 17%);
  --framex-base-color-light: hsl(220, 13%, 91%);
  --framex-base-color-entry-background: hsl(0, 0%, 100%);
  --framex-base-color-entry-border: hsl(220, 14%, 96%);
  --framex-base-color-entry-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);
  --framex-base-color-white: hsl(0, 0%, 100%);
  --framex-base-color-bg-foreground: hsl(0, 0%, 100%);
  --framex-base-color-bg-background: hsl(210, 20%, 98%);
  --framex-base-color-bg-hover: #f1f5fe;
  --framex-base-color-bg-foreground-light: hsl(210, 20%, 98%);
  --framex-base-color-bg-nav: hsl(0, 0%, 100%);
  --framex-base-color-text-nav: rgba(255, 255, 255, 0.6705882353);
  --framex-base-color-color-black: hsl(205, 100%, 2%);
}

:root {
  --framex-btn-color-primary-background: #2563EB;
  --framex-btn-color-primary-background-hover: #134cca;
  --framex-btn-color-primary-foreground: hsl(0, 0%, 100%);
  --framex-btn-color-primary-shadow: #c9d8fa;
  --framex-btn-color-secondary-background: hsl(186, 100%, 60%);
  --framex-btn-color-secondary-background-hover: #00e6ff;
  --framex-btn-color-secondary-foreground: hsl(205, 100%, 2%);
  --framex-btn-color-secondary-shadow: #e6fcff;
  --framex-btn-color-pagination-background: hsl(0, 0%, 100%);
  --framex-btn-color-pagination-background-hover: #6b95f1;
  --framex-btn-color-pagination-foreground: #2563EB;
  --framex-btn-color-pagination-foreground-hover: hsl(0, 0%, 100%);
  --framex-btn-color-pagination-focus-ring: #2563EB;
  --framex-btn-color-dark-background: hsl(215, 28%, 17%);
  --framex-btn-color-dark-background-hover: #0d1117;
  --framex-btn-color-dark-foreground: hsl(0, 0%, 100%);
  --framex-btn-color-dark-shadow: #627fa7;
  --framex-btn-color-dark-focus-ring: hsl(215, 28%, 17%);
}

:root {
  --framex-form-color-background: hsl(220, 14%, 96%);
  --framex-form-color-background-disabled: hsl(0, 0%, 95%);
  --framex-form-color-border: hsl(260, 4%, 70%);
  --framex-form-color-border-disabled: hsl(220, 13%, 91%);
  --framex-form-color-border-focus: hsl(218, 11%, 65%);
  --framex-form-color-check-background: #2563EB;
  --framex-form-color-check-focus-ring: #2563EB;
  --framex-form-color-check-foreground: hsl(0, 0%, 100%);
  --framex-form-color-group-label-background: hsl(210, 60%, 98%);
  --framex-form-color-group-label-foreground: hsl(220, 9%, 46%);
  --framex-form-color-invalid: hsl(0, 84%, 60%);
  --framex-form-color-invalid-focus-ring: rgba(239, 67, 67, 0.25);
  --framex-form-color-label: hsl(205, 100%, 2%);
  --framex-form-color-legend: hsl(205, 100%, 2%);
  --framex-form-color-placeholder: hsl(208, 7%, 40%);
  --framex-form-color-range-thumb-background: #2563EB;
  --framex-form-color-range-thumb-focus-ring: hsl(220, 14%, 96%);
  --framex-form-color-range-track-background: hsl(220, 13%, 91%);
  --framex-form-color-ring-focus: hsl(218, 11%, 65%);
  --framex-form-color-select-foreground: hsl(215, 28%, 17%);
  --framex-form-color-text: hsl(220, 9%, 46%);
  --framex-form-color-valid: #22C55E;
  --framex-form-color-valid-focus-ring: rgba(34, 197, 94, 0.25);
}

:root {
  --framex-selection-color-foreground: hsl(0, 0%, 100%);
  --framex-selection-color-background: #2563EB;
}

:root {
  --framex-scrollbar-color-thumb-background: hsla(0, 0%, 0%, 0.15);
  --framex-scrollbar-color-thumb-background-hover: hsla(0, 0%, 0%, 0.25);
  --framex-scrollbar-color-track-background: hsla(0, 0%, 0%, 0.05);
}

:root {
  --framex-table-color-border: hsl(215, 63%, 93%);
  --framex-table-color-caption: hsl(208, 9%, 42%);
  --framex-table-color-heading: hsl(205, 100%, 2%);
  --framex-table-color-hover: hsla(0, 0%, 0%, 0.05);
  --framex-table-color-stripe: hsla(0, 0%, 0%, 0.025);
  --framex-table-color-text: hsl(208, 9%, 42%);
}

:root {
  --framex-breadcrumb-color-separator: hsl(0, 0%, 80%);
}

:root {
  --framex-framexcolors-color-primary: #2563EB;
  --framex-framexcolors-color-sky: #60A5FA;
  --framex-framexcolors-color-blue: #3B82F6;
  --framex-framexcolors-color-purple: #A855F7;
  --framex-framexcolors-color-violet: hsl(298, 69%, 48%);
  --framex-framexcolors-color-pink: hsl(0, 91%, 71%);
  --framex-framexcolors-color-red: hsl(0, 84%, 60%);
  --framex-framexcolors-color-yellow: #FACC15;
  --framex-framexcolors-color-orange: #F97316;
  --framex-framexcolors-color-green: #22C55E;
  --framex-framexcolors-color-teal: hsl(169, 74%, 37%);
  --framex-framexcolors-color-bordo: hsl(342, 72%, 31%);
  --framex-framexcolors-color-navy: hsl(12, 6%, 15%);
  --framex-framexcolors-color-ash: hsl(216, 12%, 84%);
  --framex-framexcolors-color-dark: hsl(215, 28%, 17%);
}

:root {
  --framex-nav-color-nav-bg: hsl(0, 0%, 100%);
  --framex-nav-color-nav-bg-megamenu: hsl(210, 40%, 96%);
  --framex-nav-color-nav-shadow: 0px 6px 34px rgba(87, 87, 87, 0.06);
}

:root {
  --framex-graycolors-color-gray-50: hsl(180, 11%, 96%);
  --framex-graycolors-color-gray-100: hsl(192, 16%, 94%);
  --framex-graycolors-color-gray-200: hsl(200, 12%, 85%);
  --framex-graycolors-color-gray-300: hsl(201, 11%, 75%);
  --framex-graycolors-color-gray-400: hsl(202, 9%, 58%);
  --framex-graycolors-color-gray-500: hsl(207, 9%, 42%);
  --framex-graycolors-color-gray-600: hsl(209, 15%, 36%);
  --framex-graycolors-color-gray-700: hsl(211, 23%, 28%);
  --framex-graycolors-color-gray-800: hsl(214, 33%, 21%);
  --framex-graycolors-color-gray-900: hsl(217, 46%, 15%);
  --framex-graycolors-color-gray-950: hsl(218, 61%, 8%);
}

:root {
  --framex-font-family-base: Manrope;
  --framex-font-family-cursive: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
  --framex-font-size-base: 1.025rem;
  --framex-font-size-lead: clamp(1.15rem, 2vw, 1.35rem);
  --framex-font-size-lg: clamp(1.234rem, 2vw, 1.25rem);
  --framex-font-size-sm: 0.875rem;
  --framex-font-size-ratio: 1.25;
  --framex-font-weight-base: 400;
  --framex-font-weight-heading: 800;
  --framex-inline-border-radius: 0.425rem;
  --framex-inline-padding: 0.1em 0.3em;
  --framex-line-height-base: 1.6;
  --framex-line-height-heading: calc(2px + 2ex + 2px);
  --framex-line-height-lg: 1.8;
  --framex-line-height-md: 1.5;
  --framex-line-height-sm: 1.2;
  --framex-letter-spacing: 0.03em;
  --framex-letter-spacing-lg: 0.06em;
  --framex-letter-spacing-heading: 0;
  --framex-dd: 1.3;
  --framex-border-radius-lg: 0.925rem;
  --framex-border-radius-sm: 0.425rem;
  --framex-container-inline-size: 84rem;
  --framex-page-margin: 2cm;
  --framex-hidden-elements: header, footer, aside, nav, form, iframe, [class^="aspect-ratio"];
}
@media (prefers-reduced-motion: no-preference) {
  :root {
    --framex-duration: 0.15s;
    --framex-timing-function: ease-in-out;
  }
}

:root[data-theme-mode=dark] {
  --framex-base-color-primary: #93C5FD;
  --framex-base-color-dark: hsl(215, 28%, 17%);
  --framex-base-color-light: hsl(220, 13%, 91%);
  --framex-base-color-white: hsl(0, 0%, 100%);
  --framex-base-color-entry-background: hsl(216, 28%, 19%);
  --framex-base-color-entry-border: #2d3949;
  --framex-base-color-entry-shadow: 0px 6px 34px rgba(51, 51, 51, 0.41);
  --framex-base-color-bg-foreground: hsl(214, 32%, 17%);
  --framex-base-color-bg-background: hsl(219, 46%, 11%);
  --framex-base-color-bg-foreground-light: hsl(219, 24%, 26%);
  --framex-base-color-bg-nav: hsl(214, 32%, 17%);
  --framex-base-color-bg-hover: hsl(219, 24%, 26%);
  --framex-base-color-background: hsl(219, 46%, 11%);
  --framex-base-color-blockquote-border: #93C5FD;
  --framex-base-color-border: hsl(217, 19%, 27%);
  --framex-base-color-code-background: #f0f7ff;
  --framex-base-color-code-foreground: hsl(205, 100%, 2%);
  --framex-base-color-heading: hsl(220, 13%, 91%);
  --framex-base-color-link: #93C5FD;
  --framex-base-color-link-hover: #449bfc;
  --framex-base-color-mark-background: hsl(50, 100%, 80%);
  --framex-base-color-mark-foreground: hsl(205, 100%, 2%);
  --framex-base-color-marker: #93C5FD;
  --framex-base-color-secondary: #2563EB;
  --framex-base-color-text: hsl(220, 13%, 91%);
  --framex-base-color-text-nav: hsl(220, 13%, 91%);
  --framex-base-color-color-black: hsl(205, 100%, 2%);
  --framex-base-color-foreground-hover: hsl(217, 19%, 27%);
}

:root[data-theme-mode=dark] {
  --framex-breadcrumb-color-arrow: hsla(0, 0%, 100%, 0.1);
}

:root[data-theme-mode=dark] {
  --framex-btn-color-primary-background: #93C5FD;
  --framex-btn-color-primary-background-hover: hsl(186, 100%, 45%);
  --framex-btn-color-primary-foreground: hsl(186, 100%, 5%);
  --framex-btn-color-primary-shadow: hsl(186, 100%, 25%);
  --framex-btn-color-secondary-background: #2563EB;
  --framex-btn-color-secondary-background-hover: #3c74ed;
  --framex-btn-color-secondary-foreground: hsl(0, 0%, 100%);
  --framex-btn-color-secondary-shadow: #0e3b9c;
  --framex-btn-color-dark-background: hsl(221, 39%, 11%);
  --framex-btn-color-dark-background-hover: #020204;
  --framex-btn-color-dark-foreground: hsl(0, 0%, 100%);
  --framex-btn-color-dark-shadow: #4865a3;
  --framex-btn-color-dark-focus-ring: hsl(221, 39%, 11%);
}

:root[data-theme-mode=dark] {
  --framex-form-color-background: hsl(219, 46%, 11%);
  --framex-form-color-background-disabled: hsl(205, 100%, 2%);
  --framex-form-color-border-disabled: hsl(220, 9%, 46%);
  --framex-form-color-border-focus: #93C5FD;
  --framex-form-color-border: hsl(220, 9%, 46%);
  --framex-form-color-check-background: #93C5FD;
  --framex-form-color-check-foreground: hsl(205, 100%, 2%);
  --framex-form-color-invalid: hsl(0, 84%, 60%);
  --framex-form-color-invalid-shadow: rgba(239, 67, 67, 0.25);
  --framex-form-color-label: hsl(0, 0%, 100%);
  --framex-form-color-legend: hsl(0, 0%, 100%);
  --framex-form-color-placeholder: hsl(0, 0%, 60%);
  --framex-form-color-select-foreground: hsl(0, 0%, 100%);
  --framex-form-color-shadow-focus: rgba(147, 197, 253, 0.25);
  --framex-form-color-text: hsl(220, 13%, 91%);
  --framex-form-color-valid: #22C55E;
  --framex-form-color-valid-shadow: rgba(34, 197, 94, 0.25);
}

:root[data-theme-mode=dark] {
  --framex-footer-color-background: hsl(245, 38%, 10%);
}

:root[data-theme-mode=dark] {
  --framex-navigation-color-arrow: hsla(0, 0%, 100%, 0.15);
  --framex-navigation-color-icon-background: hsl(245, 38%, 10%);
  --framex-navigation-color-icon-background-hover: #93C5FD;
  --framex-navigation-color-icon-foreground: #93C5FD;
  --framex-navigation-color-icon-foreground-hover: hsl(186, 100%, 5%);
}

:root[data-theme-mode=dark] {
  --framex-nav-color-nav-bg: hsl(219, 46%, 11%);
  --framex-nav-color-nav-bg-megamenu: hsl(219, 46%, 11%);
  --framex-nav-color-nav-shadow: 0px 6px 34px rgba(0, 0, 0, 0.41);
}

:root[data-theme-mode=dark] {
  --framex-prism-color-color: hsl(217, 34%, 88%);
  --framex-prism-color-background: hsl(245, 38%, 7%);
  --framex-prism-color-comment: hsl(180, 9%, 55%);
  --framex-prism-color-punctuation: hsl(276, 68%, 75%);
  --framex-prism-color-namespace: hsl(197, 31%, 77%);
  --framex-prism-color-deleted: hsla(1, 83%, 63%, 0.56);
  --framex-prism-color-boolean: hsl(350, 100%, 67%);
  --framex-prism-color-number: hsl(14, 90%, 70%);
  --framex-prism-color-constant: hsl(221, 100%, 75%);
  --framex-prism-color-class-name: hsl(33, 100%, 77%);
  --framex-prism-color-regex: hsl(217, 34%, 88%);
}

:root[data-theme-mode=dark] {
  --framex-table-color-border: hsl(220, 9%, 46%);
  --framex-table-color-caption: hsl(220, 9%, 46%);
  --framex-table-color-heading: hsl(0, 0%, 100%);
  --framex-table-color-hover: hsla(0, 0%, 100%, 0.05);
  --framex-table-color-stripe: hsla(0, 0%, 100%, 0.025);
  --framex-table-color-text: color("text");
}

:root[data-theme-mode=dark] {
  --framex-selection-color-background: #93C5FD;
  --framex-selection-color-foreground: hsl(186, 100%, 5%);
}

:root[data-theme-mode=dark] {
  --framex-search-color-icon: hsla(0, 0%, 100%, 0.25);
}

:root[data-theme-mode=dark] {
  --framex-scrollbar-color-thumb-background: hsla(0, 0%, 100%, 0.15);
  --framex-scrollbar-color-thumb-background-hover: hsla(0, 0%, 100%, 0.25);
  --framex-scrollbar-color-track-background: hsla(0, 0%, 100%, 0.05);
}

[data-theme-mode=dark] {
  color-scheme: dark;
}
[data-theme-mode=dark] body,
[data-theme-mode=dark] section, [data-theme-mode=dark] footer {
  background: var(--framex-base-color-background) !important;
}
[data-theme-mode=dark] body .band,
[data-theme-mode=dark] body .bw,
[data-theme-mode=dark] body [class*=bg-soft],
[data-theme-mode=dark] body [class*=bg-pal],
[data-theme-mode=dark] body .bg-navy,
[data-theme-mode=dark] section .band,
[data-theme-mode=dark] section .bw,
[data-theme-mode=dark] section [class*=bg-soft],
[data-theme-mode=dark] section [class*=bg-pal],
[data-theme-mode=dark] section .bg-navy, [data-theme-mode=dark] footer .band,
[data-theme-mode=dark] footer .bw,
[data-theme-mode=dark] footer [class*=bg-soft],
[data-theme-mode=dark] footer [class*=bg-pal],
[data-theme-mode=dark] footer .bg-navy {
  background: var(--framex-base-color-bg-foreground) !important;
}
[data-theme-mode=dark] body a,
[data-theme-mode=dark] section a, [data-theme-mode=dark] footer a {
  color: var(--framex-base-color-link);
}
[data-theme-mode=dark] body a:hover,
[data-theme-mode=dark] section a:hover, [data-theme-mode=dark] footer a:hover {
  color: var(--framex-base-color-link-hover);
}
@media only screen and (max-width: 991.999px) {
  [data-theme-mode=dark] body .navigation-body, [data-theme-mode=dark] body .navigation-header,
  [data-theme-mode=dark] section .navigation-body,
  [data-theme-mode=dark] section .navigation-header, [data-theme-mode=dark] footer .navigation-body, [data-theme-mode=dark] footer .navigation-header {
    background: var(--framex-base-color-bg-foreground) !important;
  }
}
[data-theme-mode=dark] body .bg-gray-50,
[data-theme-mode=dark] body .bg-gray-100,
[data-theme-mode=dark] body .bg-gray-200,
[data-theme-mode=dark] body .bg-gray-300,
[data-theme-mode=dark] body .bg-gray-400,
[data-theme-mode=dark] body .bg-purple,
[data-theme-mode=dark] body .bg-primary,
[data-theme-mode=dark] section .bg-gray-50,
[data-theme-mode=dark] section .bg-gray-100,
[data-theme-mode=dark] section .bg-gray-200,
[data-theme-mode=dark] section .bg-gray-300,
[data-theme-mode=dark] section .bg-gray-400,
[data-theme-mode=dark] section .bg-purple,
[data-theme-mode=dark] section .bg-primary, [data-theme-mode=dark] footer .bg-gray-50,
[data-theme-mode=dark] footer .bg-gray-100,
[data-theme-mode=dark] footer .bg-gray-200,
[data-theme-mode=dark] footer .bg-gray-300,
[data-theme-mode=dark] footer .bg-gray-400,
[data-theme-mode=dark] footer .bg-purple,
[data-theme-mode=dark] footer .bg-primary {
  background-color: var(--framex-base-color-bg-foreground-light) !important;
}

.light-switch {
  display: none;
}

[data-theme-mode=light] .themeMode .ai-moon {
  display: block;
}
[data-theme-mode=light] .themeMode .ai-sun {
  cursor: pointer;
  display: none;
}

[data-theme-mode=dark] .themeMode .ai-moon {
  display: none !important;
}
[data-theme-mode=dark] .themeMode .ai-sun {
  cursor: pointer;
  display: block;
}

.sr-only {
  block-size: 1px !important;
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  inline-size: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
}

[tabindex="-1"]:focus {
  outline: none !important;
}

::-moz-selection {
  background-color: var(--framex-selection-color-background);
  color: var(--framex-selection-color-foreground);
  text-shadow: none;
}

::selection {
  background-color: var(--framex-selection-color-background);
  color: var(--framex-selection-color-foreground);
  text-shadow: none;
}

html {
  box-sizing: border-box;
}
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

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

body {
  background: var(--framex-base-color-background);
  color: var(--framex-base-color-text);
}

a {
  color: var(--framex-base-color-link);
  text-decoration: underline;
  transition-duration: var(--framex-duration);
  transition-property: color;
  transition-timing-function: var(--framex-timing-function);
}
a:hover {
  color: var(--framex-base-color-link-hover);
}

button {
  color: inherit;
}

a,
button {
  touch-action: manipulation;
}

hr {
  border: 0;
  border-block-start: 1px solid var(--framex-base-color-border);
}

img {
  block-size: auto;
  display: block;
  max-inline-size: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

iframe {
  block-size: 100%;
  display: block;
  inline-size: 100%;
}

figure {
  margin-inline: 0;
}
figure figcaption {
  margin-block-start: 0.5rem;
  text-align: center;
}

.bands {
  --bands-gutter-x: 1rem;
  --bands-gutter-y: 1rem;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-2 * var(--framex-gutter-y));
  margin-right: calc(-0.5 * var(--framex-gutter-x));
  margin-left: calc(-0.5 * var(--framex-gutter-x));
}
.bands > * {
  padding-right: calc(var(--bands-gutter-x) * 0.5);
  padding-left: calc(var(--bands-gutter-x) * 0.5);
  margin-top: var(--bands-gutter-y);
}
.bands.reverse {
  flex-direction: row-reverse;
}
.bands .band--1 {
  width: 8.3333333333%;
  flex-grow: 1;
}
.bands .band--2 {
  width: 16.6666666667%;
  flex-grow: 1;
}
.bands .band--3 {
  width: 25%;
  flex-grow: 1;
}
.bands .band--4 {
  width: 33.3333333333%;
  flex-grow: 1;
}
.bands .band--5 {
  width: 41.6666666667%;
  flex-grow: 1;
}
.bands .band--6 {
  width: 50%;
  flex-grow: 1;
}
.bands .band--7 {
  width: 58.3333333333%;
  flex-grow: 1;
}
.bands .band--8 {
  width: 66.6666666667%;
  flex-grow: 1;
}
.bands .band--9 {
  width: 75%;
  flex-grow: 1;
}
.bands .band--10 {
  width: 83.3333333333%;
  flex-grow: 1;
}
.bands .band--11 {
  width: 91.6666666667%;
  flex-grow: 1;
}
.bands .band--12 {
  width: 100%;
  flex-grow: 1;
}
@media only screen and (min-width: 768px) {
  .bands .band-md--1 {
    width: 8.3333333333%;
    flex-grow: 1;
  }
  .bands .band-md--2 {
    width: 16.6666666667%;
    flex-grow: 1;
  }
  .bands .band-md--3 {
    width: 25%;
    flex-grow: 1;
  }
  .bands .band-md--4 {
    width: 33.3333333333%;
    flex-grow: 1;
  }
  .bands .band-md--5 {
    width: 41.6666666667%;
    flex-grow: 1;
  }
  .bands .band-md--6 {
    width: 50%;
    flex-grow: 1;
  }
  .bands .band-md--7 {
    width: 58.3333333333%;
    flex-grow: 1;
  }
  .bands .band-md--8 {
    width: 66.6666666667%;
    flex-grow: 1;
  }
  .bands .band-md--9 {
    width: 75%;
    flex-grow: 1;
  }
  .bands .band-md--10 {
    width: 83.3333333333%;
    flex-grow: 1;
  }
  .bands .band-md--11 {
    width: 91.6666666667%;
    flex-grow: 1;
  }
  .bands .band-md--12 {
    width: 100%;
    flex-grow: 1;
  }
}
@media only screen and (min-width: 992px) {
  .bands .band-lg--1 {
    width: 8.3333333333%;
    flex-grow: 1;
  }
  .bands .band-lg--2 {
    width: 16.6666666667%;
    flex-grow: 1;
  }
  .bands .band-lg--3 {
    width: 25%;
    flex-grow: 1;
  }
  .bands .band-lg--4 {
    width: 33.3333333333%;
    flex-grow: 1;
  }
  .bands .band-lg--5 {
    width: 41.6666666667%;
    flex-grow: 1;
  }
  .bands .band-lg--6 {
    width: 50%;
    flex-grow: 1;
  }
  .bands .band-lg--7 {
    width: 58.3333333333%;
    flex-grow: 1;
  }
  .bands .band-lg--8 {
    width: 66.6666666667%;
    flex-grow: 1;
  }
  .bands .band-lg--9 {
    width: 75%;
    flex-grow: 1;
  }
  .bands .band-lg--10 {
    width: 83.3333333333%;
    flex-grow: 1;
  }
  .bands .band-lg--11 {
    width: 91.6666666667%;
    flex-grow: 1;
  }
  .bands .band-lg--12 {
    width: 100%;
    flex-grow: 1;
  }
}
@media only screen and (min-width: 1200px) {
  .bands .band-xl--1 {
    width: 8.3333333333%;
    flex-grow: 1;
  }
  .bands .band-xl--2 {
    width: 16.6666666667%;
    flex-grow: 1;
  }
  .bands .band-xl--3 {
    width: 25%;
    flex-grow: 1;
  }
  .bands .band-xl--4 {
    width: 33.3333333333%;
    flex-grow: 1;
  }
  .bands .band-xl--5 {
    width: 41.6666666667%;
    flex-grow: 1;
  }
  .bands .band-xl--6 {
    width: 50%;
    flex-grow: 1;
  }
  .bands .band-xl--7 {
    width: 58.3333333333%;
    flex-grow: 1;
  }
  .bands .band-xl--8 {
    width: 66.6666666667%;
    flex-grow: 1;
  }
  .bands .band-xl--9 {
    width: 75%;
    flex-grow: 1;
  }
  .bands .band-xl--10 {
    width: 83.3333333333%;
    flex-grow: 1;
  }
  .bands .band-xl--11 {
    width: 91.6666666667%;
    flex-grow: 1;
  }
  .bands .band-xl--12 {
    width: 100%;
    flex-grow: 1;
  }
}
.bands.bands-gap-0, .bands.bands-gap-x-0 {
  --bands-gutter-x: 0;
}
.bands.bands-gap-0, .bands.bands-gap-y-0 {
  --bands-gutter-y: 0;
}
.bands.bands-gap-1, .bands.bands-gap-x-1 {
  --bands-gutter-x: 0.5rem;
}
.bands.bands-gap-1, .bands.bands-gap-y-1 {
  --bands-gutter-y: 0.5rem;
}
.bands.bands-gap-2, .bands.bands-gap-x-2 {
  --bands-gutter-x: 1rem;
}
.bands.bands-gap-2, .bands.bands-gap-y-2 {
  --bands-gutter-y: 1rem;
}
.bands.bands-gap-3, .bands.bands-gap-x-3 {
  --bands-gutter-x: 1.5rem;
}
.bands.bands-gap-3, .bands.bands-gap-y-3 {
  --bands-gutter-y: 1.5rem;
}
.bands.bands-gap-4, .bands.bands-gap-x-4 {
  --bands-gutter-x: 2rem;
}
.bands.bands-gap-4, .bands.bands-gap-y-4 {
  --bands-gutter-y: 2rem;
}
.bands.bands-gap-5, .bands.bands-gap-x-5 {
  --bands-gutter-x: 3rem;
}
.bands.bands-gap-5, .bands.bands-gap-y-5 {
  --bands-gutter-y: 3rem;
}

.container,
.container-fluid,
.container-narrow,
.container-wide,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
  width: 100%;
  padding-right: var(--framex-gutter-x, 0.75rem);
  padding-left: var(--framex-gutter-x, 0.75rem);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-sm,
  .container-narrow,
  .container-wide,
  .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-md,
  .container-sm,
  .container-narrow,
  .container-wide,
  .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container-lg,
  .container-md,
  .container-sm,
  .container-narrow,
  .container-wide,
  .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container-wide,
  .container {
    max-width: 1140px;
  }
}
@media (min-width: 1440px) {
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm,
  .container-wide,
  .container {
    max-width: 1320px;
  }
}
@media (min-width: 1600px) {
  .container-wide {
    max-width: 1520px;
  }
}
.row {
  --framex-gutter-x: 1rem;
  --framex-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--framex-gutter-y));
  margin-right: calc(-0.5 * var(--framex-gutter-x));
  margin-left: calc(-0.5 * var(--framex-gutter-x));
}

.row > * {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--framex-gutter-x) * 0.5);
  padding-left: calc(var(--framex-gutter-x) * 0.5);
  margin-top: var(--framex-gutter-y);
}

.col {
  flex: 1 0 0%;
}

.row-cols-auto > * {
  flex: 0 0 auto;
  width: auto;
}

.row-cols-1 > * {
  flex: 0 0 auto;
  width: 100%;
}

.row-cols-2 > * {
  flex: 0 0 auto;
  width: 50%;
}

.row-cols-3 > * {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.row-cols-4 > * {
  flex: 0 0 auto;
  width: 25%;
}

.row-cols-5 > * {
  flex: 0 0 auto;
  width: 20%;
}

.row-cols-6 > * {
  flex: 0 0 auto;
  width: 16.6666666667%;
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}

.col-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}

.col-3 {
  flex: 0 0 auto;
  width: 25%;
}

.col-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}

.col-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}

.col-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}

.col-9 {
  flex: 0 0 auto;
  width: 75%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}

.col-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.offset-1 {
  margin-left: 8.33333333%;
}

.offset-2 {
  margin-left: 16.66666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.33333333%;
}

.offset-5 {
  margin-left: 41.66666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.33333333%;
}

.offset-8 {
  margin-left: 66.66666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.33333333%;
}

.offset-11 {
  margin-left: 91.66666667%;
}

.g-0,
.gx-0 {
  --framex-gutter-x: 0;
}

.g-0,
.gy-0 {
  --framex-gutter-y: 0;
}

.g-1,
.gx-1 {
  --framex-gutter-x: 0.25rem;
}

.g-1,
.gy-1 {
  --framex-gutter-y: 0.25rem;
}

.g-2,
.gx-2 {
  --framex-gutter-x: 0.5rem;
}

.g-2,
.gy-2 {
  --framex-gutter-y: 0.5rem;
}

.g-3,
.gx-3 {
  --framex-gutter-x: 1rem;
}

.g-3,
.gy-3 {
  --framex-gutter-y: 1rem;
}

.g-4,
.gx-4 {
  --framex-gutter-x: 1.5rem;
}

.g-4,
.gy-4 {
  --framex-gutter-y: 1.5rem;
}

.g-5,
.gx-5 {
  --framex-gutter-x: 3rem;
}

.g-5,
.gy-5 {
  --framex-gutter-y: 3rem;
}

@media (min-width: 576px) {
  .col-sm {
    flex: 1 0 0%;
  }
  .row-cols-sm-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-sm-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-sm-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-sm-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  .row-cols-sm-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-sm-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-sm-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
  .col-sm-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-sm-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-sm-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-sm-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-sm-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-sm-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-sm-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-sm-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-sm-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-sm-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-sm-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-sm-0 {
    margin-left: 0;
  }
  .offset-sm-1 {
    margin-left: 8.33333333%;
  }
  .offset-sm-2 {
    margin-left: 16.66666667%;
  }
  .offset-sm-3 {
    margin-left: 25%;
  }
  .offset-sm-4 {
    margin-left: 33.33333333%;
  }
  .offset-sm-5 {
    margin-left: 41.66666667%;
  }
  .offset-sm-6 {
    margin-left: 50%;
  }
  .offset-sm-7 {
    margin-left: 58.33333333%;
  }
  .offset-sm-8 {
    margin-left: 66.66666667%;
  }
  .offset-sm-9 {
    margin-left: 75%;
  }
  .offset-sm-10 {
    margin-left: 83.33333333%;
  }
  .offset-sm-11 {
    margin-left: 91.66666667%;
  }
  .g-sm-0,
  .gx-sm-0 {
    --framex-gutter-x: 0;
  }
  .g-sm-0,
  .gy-sm-0 {
    --framex-gutter-y: 0;
  }
  .g-sm-1,
  .gx-sm-1 {
    --framex-gutter-x: 0.25rem;
  }
  .g-sm-1,
  .gy-sm-1 {
    --framex-gutter-y: 0.25rem;
  }
  .g-sm-2,
  .gx-sm-2 {
    --framex-gutter-x: 0.5rem;
  }
  .g-sm-2,
  .gy-sm-2 {
    --framex-gutter-y: 0.5rem;
  }
  .g-sm-3,
  .gx-sm-3 {
    --framex-gutter-x: 1rem;
  }
  .g-sm-3,
  .gy-sm-3 {
    --framex-gutter-y: 1rem;
  }
  .g-sm-4,
  .gx-sm-4 {
    --framex-gutter-x: 1.5rem;
  }
  .g-sm-4,
  .gy-sm-4 {
    --framex-gutter-y: 1.5rem;
  }
  .g-sm-5,
  .gx-sm-5 {
    --framex-gutter-x: 3rem;
  }
  .g-sm-5,
  .gy-sm-5 {
    --framex-gutter-y: 3rem;
  }
}
@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }
  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-md-0 {
    margin-left: 0;
  }
  .offset-md-1 {
    margin-left: 8.33333333%;
  }
  .offset-md-2 {
    margin-left: 16.66666667%;
  }
  .offset-md-3 {
    margin-left: 25%;
  }
  .offset-md-4 {
    margin-left: 33.33333333%;
  }
  .offset-md-5 {
    margin-left: 41.66666667%;
  }
  .offset-md-6 {
    margin-left: 50%;
  }
  .offset-md-7 {
    margin-left: 58.33333333%;
  }
  .offset-md-8 {
    margin-left: 66.66666667%;
  }
  .offset-md-9 {
    margin-left: 75%;
  }
  .offset-md-10 {
    margin-left: 83.33333333%;
  }
  .offset-md-11 {
    margin-left: 91.66666667%;
  }
  .g-md-0,
  .gx-md-0 {
    --framex-gutter-x: 0;
  }
  .g-md-0,
  .gy-md-0 {
    --framex-gutter-y: 0;
  }
  .g-md-1,
  .gx-md-1 {
    --framex-gutter-x: 0.25rem;
  }
  .g-md-1,
  .gy-md-1 {
    --framex-gutter-y: 0.25rem;
  }
  .g-md-2,
  .gx-md-2 {
    --framex-gutter-x: 0.5rem;
  }
  .g-md-2,
  .gy-md-2 {
    --framex-gutter-y: 0.5rem;
  }
  .g-md-3,
  .gx-md-3 {
    --framex-gutter-x: 1rem;
  }
  .g-md-3,
  .gy-md-3 {
    --framex-gutter-y: 1rem;
  }
  .g-md-4,
  .gx-md-4 {
    --framex-gutter-x: 1.5rem;
  }
  .g-md-4,
  .gy-md-4 {
    --framex-gutter-y: 1.5rem;
  }
  .g-md-5,
  .gx-md-5 {
    --framex-gutter-x: 3rem;
  }
  .g-md-5,
  .gy-md-5 {
    --framex-gutter-y: 3rem;
  }
}
@media (min-width: 992px) {
  .col-lg {
    flex: 1 0 0%;
  }
  .row-cols-lg-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-lg-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-lg-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-lg-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  .row-cols-lg-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-lg-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-lg-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-lg-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-lg-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-lg-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-lg-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-lg-0 {
    margin-left: 0;
  }
  .offset-lg-1 {
    margin-left: 8.33333333%;
  }
  .offset-lg-2 {
    margin-left: 16.66666667%;
  }
  .offset-lg-3 {
    margin-left: 25%;
  }
  .offset-lg-4 {
    margin-left: 33.33333333%;
  }
  .offset-lg-5 {
    margin-left: 41.66666667%;
  }
  .offset-lg-6 {
    margin-left: 50%;
  }
  .offset-lg-7 {
    margin-left: 58.33333333%;
  }
  .offset-lg-8 {
    margin-left: 66.66666667%;
  }
  .offset-lg-9 {
    margin-left: 75%;
  }
  .offset-lg-10 {
    margin-left: 83.33333333%;
  }
  .offset-lg-11 {
    margin-left: 91.66666667%;
  }
  .g-lg-0,
  .gx-lg-0 {
    --framex-gutter-x: 0;
  }
  .g-lg-0,
  .gy-lg-0 {
    --framex-gutter-y: 0;
  }
  .g-lg-1,
  .gx-lg-1 {
    --framex-gutter-x: 0.25rem;
  }
  .g-lg-1,
  .gy-lg-1 {
    --framex-gutter-y: 0.25rem;
  }
  .g-lg-2,
  .gx-lg-2 {
    --framex-gutter-x: 0.5rem;
  }
  .g-lg-2,
  .gy-lg-2 {
    --framex-gutter-y: 0.5rem;
  }
  .g-lg-3,
  .gx-lg-3 {
    --framex-gutter-x: 1rem;
  }
  .g-lg-3,
  .gy-lg-3 {
    --framex-gutter-y: 1rem;
  }
  .g-lg-4,
  .gx-lg-4 {
    --framex-gutter-x: 1.5rem;
  }
  .g-lg-4,
  .gy-lg-4 {
    --framex-gutter-y: 1.5rem;
  }
  .g-lg-5,
  .gx-lg-5 {
    --framex-gutter-x: 3rem;
  }
  .g-lg-5,
  .gy-lg-5 {
    --framex-gutter-y: 3rem;
  }
}
@media (min-width: 1200px) {
  .col-xl {
    flex: 1 0 0%;
  }
  .row-cols-xl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-xl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-xl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-xl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  .row-cols-xl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-xl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-xl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-xl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-xl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-xl-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-xl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-xl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-xl-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-xl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-xl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-xl-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-xl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-xl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-xl-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-xl-0 {
    margin-left: 0;
  }
  .offset-xl-1 {
    margin-left: 8.33333333%;
  }
  .offset-xl-2 {
    margin-left: 16.66666667%;
  }
  .offset-xl-3 {
    margin-left: 25%;
  }
  .offset-xl-4 {
    margin-left: 33.33333333%;
  }
  .offset-xl-5 {
    margin-left: 41.66666667%;
  }
  .offset-xl-6 {
    margin-left: 50%;
  }
  .offset-xl-7 {
    margin-left: 58.33333333%;
  }
  .offset-xl-8 {
    margin-left: 66.66666667%;
  }
  .offset-xl-9 {
    margin-left: 75%;
  }
  .offset-xl-10 {
    margin-left: 83.33333333%;
  }
  .offset-xl-11 {
    margin-left: 91.66666667%;
  }
  .g-xl-0,
  .gx-xl-0 {
    --framex-gutter-x: 0;
  }
  .g-xl-0,
  .gy-xl-0 {
    --framex-gutter-y: 0;
  }
  .g-xl-1,
  .gx-xl-1 {
    --framex-gutter-x: 0.25rem;
  }
  .g-xl-1,
  .gy-xl-1 {
    --framex-gutter-y: 0.25rem;
  }
  .g-xl-2,
  .gx-xl-2 {
    --framex-gutter-x: 0.5rem;
  }
  .g-xl-2,
  .gy-xl-2 {
    --framex-gutter-y: 0.5rem;
  }
  .g-xl-3,
  .gx-xl-3 {
    --framex-gutter-x: 1rem;
  }
  .g-xl-3,
  .gy-xl-3 {
    --framex-gutter-y: 1rem;
  }
  .g-xl-4,
  .gx-xl-4 {
    --framex-gutter-x: 1.5rem;
  }
  .g-xl-4,
  .gy-xl-4 {
    --framex-gutter-y: 1.5rem;
  }
  .g-xl-5,
  .gx-xl-5 {
    --framex-gutter-x: 3rem;
  }
  .g-xl-5,
  .gy-xl-5 {
    --framex-gutter-y: 3rem;
  }
}
@media (min-width: 1400px) {
  .col-xxl {
    flex: 1 0 0%;
  }
  .row-cols-xxl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-xxl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-xxl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-xxl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }
  .row-cols-xxl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-xxl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-xxl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
  .col-xxl-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-xxl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-xxl-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-xxl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-xxl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-xxl-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-xxl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-xxl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-xxl-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-xxl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-xxl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-xxl-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-xxl-0 {
    margin-left: 0;
  }
  .offset-xxl-1 {
    margin-left: 8.33333333%;
  }
  .offset-xxl-2 {
    margin-left: 16.66666667%;
  }
  .offset-xxl-3 {
    margin-left: 25%;
  }
  .offset-xxl-4 {
    margin-left: 33.33333333%;
  }
  .offset-xxl-5 {
    margin-left: 41.66666667%;
  }
  .offset-xxl-6 {
    margin-left: 50%;
  }
  .offset-xxl-7 {
    margin-left: 58.33333333%;
  }
  .offset-xxl-8 {
    margin-left: 66.66666667%;
  }
  .offset-xxl-9 {
    margin-left: 75%;
  }
  .offset-xxl-10 {
    margin-left: 83.33333333%;
  }
  .offset-xxl-11 {
    margin-left: 91.66666667%;
  }
  .g-xxl-0,
  .gx-xxl-0 {
    --framex-gutter-x: 0;
  }
  .g-xxl-0,
  .gy-xxl-0 {
    --framex-gutter-y: 0;
  }
  .g-xxl-1,
  .gx-xxl-1 {
    --framex-gutter-x: 0.25rem;
  }
  .g-xxl-1,
  .gy-xxl-1 {
    --framex-gutter-y: 0.25rem;
  }
  .g-xxl-2,
  .gx-xxl-2 {
    --framex-gutter-x: 0.5rem;
  }
  .g-xxl-2,
  .gy-xxl-2 {
    --framex-gutter-y: 0.5rem;
  }
  .g-xxl-3,
  .gx-xxl-3 {
    --framex-gutter-x: 1rem;
  }
  .g-xxl-3,
  .gy-xxl-3 {
    --framex-gutter-y: 1rem;
  }
  .g-xxl-4,
  .gx-xxl-4 {
    --framex-gutter-x: 1.5rem;
  }
  .g-xxl-4,
  .gy-xxl-4 {
    --framex-gutter-y: 1.5rem;
  }
  .g-xxl-5,
  .gx-xxl-5 {
    --framex-gutter-x: 3rem;
  }
  .g-xxl-5,
  .gy-xxl-5 {
    --framex-gutter-y: 3rem;
  }
}
.grid {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
}

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

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

.column-start-1 {
  grid-column-start: 1;
}

.column-end-1 {
  grid-column-end: 2;
}

.column-span-1 {
  grid-column-end: span 1;
}

.row-start-1 {
  grid-row-start: 1;
}

.row-end-1 {
  grid-row-end: 2;
}

.row-span-1 {
  grid-row-end: span 1;
}

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

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

.column-start-2 {
  grid-column-start: 2;
}

.column-end-2 {
  grid-column-end: 3;
}

.column-span-2 {
  grid-column-end: span 2;
}

.row-start-2 {
  grid-row-start: 2;
}

.row-end-2 {
  grid-row-end: 3;
}

.row-span-2 {
  grid-row-end: span 2;
}

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

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

.column-start-3 {
  grid-column-start: 3;
}

.column-end-3 {
  grid-column-end: 4;
}

.column-span-3 {
  grid-column-end: span 3;
}

.row-start-3 {
  grid-row-start: 3;
}

.row-end-3 {
  grid-row-end: 4;
}

.row-span-3 {
  grid-row-end: span 3;
}

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

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

.column-start-4 {
  grid-column-start: 4;
}

.column-end-4 {
  grid-column-end: 5;
}

.column-span-4 {
  grid-column-end: span 4;
}

.row-start-4 {
  grid-row-start: 4;
}

.row-end-4 {
  grid-row-end: 5;
}

.row-span-4 {
  grid-row-end: span 4;
}

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

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

.column-start-5 {
  grid-column-start: 5;
}

.column-end-5 {
  grid-column-end: 6;
}

.column-span-5 {
  grid-column-end: span 5;
}

.row-start-5 {
  grid-row-start: 5;
}

.row-end-5 {
  grid-row-end: 6;
}

.row-span-5 {
  grid-row-end: span 5;
}

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

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

.column-start-6 {
  grid-column-start: 6;
}

.column-end-6 {
  grid-column-end: 7;
}

.column-span-6 {
  grid-column-end: span 6;
}

.row-start-6 {
  grid-row-start: 6;
}

.row-end-6 {
  grid-row-end: 7;
}

.row-span-6 {
  grid-row-end: span 6;
}

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

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

.column-start-7 {
  grid-column-start: 7;
}

.column-end-7 {
  grid-column-end: 8;
}

.column-span-7 {
  grid-column-end: span 7;
}

.row-start-7 {
  grid-row-start: 7;
}

.row-end-7 {
  grid-row-end: 8;
}

.row-span-7 {
  grid-row-end: span 7;
}

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

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

.column-start-8 {
  grid-column-start: 8;
}

.column-end-8 {
  grid-column-end: 9;
}

.column-span-8 {
  grid-column-end: span 8;
}

.row-start-8 {
  grid-row-start: 8;
}

.row-end-8 {
  grid-row-end: 9;
}

.row-span-8 {
  grid-row-end: span 8;
}

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

.has-9-rows {
  grid-template-rows: repeat(9, 1fr);
}

.column-start-9 {
  grid-column-start: 9;
}

.column-end-9 {
  grid-column-end: 10;
}

.column-span-9 {
  grid-column-end: span 9;
}

.row-start-9 {
  grid-row-start: 9;
}

.row-end-9 {
  grid-row-end: 10;
}

.row-span-9 {
  grid-row-end: span 9;
}

.has-10-columns {
  grid-template-columns: repeat(10, 1fr);
}

.has-10-rows {
  grid-template-rows: repeat(10, 1fr);
}

.column-start-10 {
  grid-column-start: 10;
}

.column-end-10 {
  grid-column-end: 11;
}

.column-span-10 {
  grid-column-end: span 10;
}

.row-start-10 {
  grid-row-start: 10;
}

.row-end-10 {
  grid-row-end: 11;
}

.row-span-10 {
  grid-row-end: span 10;
}

.has-11-columns {
  grid-template-columns: repeat(11, 1fr);
}

.has-11-rows {
  grid-template-rows: repeat(11, 1fr);
}

.column-start-11 {
  grid-column-start: 11;
}

.column-end-11 {
  grid-column-end: 12;
}

.column-span-11 {
  grid-column-end: span 11;
}

.row-start-11 {
  grid-row-start: 11;
}

.row-end-11 {
  grid-row-end: 12;
}

.row-span-11 {
  grid-row-end: span 11;
}

.has-12-columns {
  grid-template-columns: repeat(12, 1fr);
}

.has-12-rows {
  grid-template-rows: repeat(12, 1fr);
}

.column-start-12 {
  grid-column-start: 12;
}

.column-end-12 {
  grid-column-end: 13;
}

.column-span-12 {
  grid-column-end: span 12;
}

.row-start-12 {
  grid-row-start: 12;
}

.row-end-12 {
  grid-row-end: 13;
}

.row-span-12 {
  grid-row-end: span 12;
}

.gap-column-1 {
  -moz-column-gap: 5px;
       column-gap: 5px;
}

.gap-row-1 {
  row-gap: 5px;
}

.gap-column-2 {
  -moz-column-gap: 10px;
       column-gap: 10px;
}

.gap-row-2 {
  row-gap: 10px;
}

.gap-column-3 {
  -moz-column-gap: 15px;
       column-gap: 15px;
}

.gap-row-3 {
  row-gap: 15px;
}

.gap-column-4 {
  -moz-column-gap: 20px;
       column-gap: 20px;
}

.gap-row-4 {
  row-gap: 20px;
}

.gap-column-5 {
  -moz-column-gap: 25px;
       column-gap: 25px;
}

.gap-row-5 {
  row-gap: 25px;
}

.gap-column-6 {
  -moz-column-gap: 30px;
       column-gap: 30px;
}

.gap-row-6 {
  row-gap: 30px;
}

.gap-column-7 {
  -moz-column-gap: 35px;
       column-gap: 35px;
}

.gap-row-7 {
  row-gap: 35px;
}

.gap-column-8 {
  -moz-column-gap: 40px;
       column-gap: 40px;
}

.gap-row-8 {
  row-gap: 40px;
}

@media only screen and (min-width: 768px) {
  .has-md-1-columns {
    grid-template-columns: repeat(1, 1fr);
  }
  .has-md-1-rows {
    grid-template-rows: repeat(1, 1fr);
  }
  .column-start-md-1 {
    grid-column-start: 1;
  }
  .column-end-md-1 {
    grid-column-end: 2;
  }
  .column-span-md-1 {
    grid-column-end: span 1;
  }
  .row-start-md-1 {
    grid-row-start: 1;
  }
  .row-end-md-1 {
    grid-row-end: 2;
  }
  .row-span-md-1 {
    grid-row-end: span 1;
  }
  .has-md-2-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .has-md-2-rows {
    grid-template-rows: repeat(2, 1fr);
  }
  .column-start-md-2 {
    grid-column-start: 2;
  }
  .column-end-md-2 {
    grid-column-end: 3;
  }
  .column-span-md-2 {
    grid-column-end: span 2;
  }
  .row-start-md-2 {
    grid-row-start: 2;
  }
  .row-end-md-2 {
    grid-row-end: 3;
  }
  .row-span-md-2 {
    grid-row-end: span 2;
  }
  .has-md-3-columns {
    grid-template-columns: repeat(3, 1fr);
  }
  .has-md-3-rows {
    grid-template-rows: repeat(3, 1fr);
  }
  .column-start-md-3 {
    grid-column-start: 3;
  }
  .column-end-md-3 {
    grid-column-end: 4;
  }
  .column-span-md-3 {
    grid-column-end: span 3;
  }
  .row-start-md-3 {
    grid-row-start: 3;
  }
  .row-end-md-3 {
    grid-row-end: 4;
  }
  .row-span-md-3 {
    grid-row-end: span 3;
  }
  .has-md-4-columns {
    grid-template-columns: repeat(4, 1fr);
  }
  .has-md-4-rows {
    grid-template-rows: repeat(4, 1fr);
  }
  .column-start-md-4 {
    grid-column-start: 4;
  }
  .column-end-md-4 {
    grid-column-end: 5;
  }
  .column-span-md-4 {
    grid-column-end: span 4;
  }
  .row-start-md-4 {
    grid-row-start: 4;
  }
  .row-end-md-4 {
    grid-row-end: 5;
  }
  .row-span-md-4 {
    grid-row-end: span 4;
  }
  .has-md-5-columns {
    grid-template-columns: repeat(5, 1fr);
  }
  .has-md-5-rows {
    grid-template-rows: repeat(5, 1fr);
  }
  .column-start-md-5 {
    grid-column-start: 5;
  }
  .column-end-md-5 {
    grid-column-end: 6;
  }
  .column-span-md-5 {
    grid-column-end: span 5;
  }
  .row-start-md-5 {
    grid-row-start: 5;
  }
  .row-end-md-5 {
    grid-row-end: 6;
  }
  .row-span-md-5 {
    grid-row-end: span 5;
  }
  .has-md-6-columns {
    grid-template-columns: repeat(6, 1fr);
  }
  .has-md-6-rows {
    grid-template-rows: repeat(6, 1fr);
  }
  .column-start-md-6 {
    grid-column-start: 6;
  }
  .column-end-md-6 {
    grid-column-end: 7;
  }
  .column-span-md-6 {
    grid-column-end: span 6;
  }
  .row-start-md-6 {
    grid-row-start: 6;
  }
  .row-end-md-6 {
    grid-row-end: 7;
  }
  .row-span-md-6 {
    grid-row-end: span 6;
  }
  .has-md-7-columns {
    grid-template-columns: repeat(7, 1fr);
  }
  .has-md-7-rows {
    grid-template-rows: repeat(7, 1fr);
  }
  .column-start-md-7 {
    grid-column-start: 7;
  }
  .column-end-md-7 {
    grid-column-end: 8;
  }
  .column-span-md-7 {
    grid-column-end: span 7;
  }
  .row-start-md-7 {
    grid-row-start: 7;
  }
  .row-end-md-7 {
    grid-row-end: 8;
  }
  .row-span-md-7 {
    grid-row-end: span 7;
  }
  .has-md-8-columns {
    grid-template-columns: repeat(8, 1fr);
  }
  .has-md-8-rows {
    grid-template-rows: repeat(8, 1fr);
  }
  .column-start-md-8 {
    grid-column-start: 8;
  }
  .column-end-md-8 {
    grid-column-end: 9;
  }
  .column-span-md-8 {
    grid-column-end: span 8;
  }
  .row-start-md-8 {
    grid-row-start: 8;
  }
  .row-end-md-8 {
    grid-row-end: 9;
  }
  .row-span-md-8 {
    grid-row-end: span 8;
  }
  .has-md-9-columns {
    grid-template-columns: repeat(9, 1fr);
  }
  .has-md-9-rows {
    grid-template-rows: repeat(9, 1fr);
  }
  .column-start-md-9 {
    grid-column-start: 9;
  }
  .column-end-md-9 {
    grid-column-end: 10;
  }
  .column-span-md-9 {
    grid-column-end: span 9;
  }
  .row-start-md-9 {
    grid-row-start: 9;
  }
  .row-end-md-9 {
    grid-row-end: 10;
  }
  .row-span-md-9 {
    grid-row-end: span 9;
  }
  .has-md-10-columns {
    grid-template-columns: repeat(10, 1fr);
  }
  .has-md-10-rows {
    grid-template-rows: repeat(10, 1fr);
  }
  .column-start-md-10 {
    grid-column-start: 10;
  }
  .column-end-md-10 {
    grid-column-end: 11;
  }
  .column-span-md-10 {
    grid-column-end: span 10;
  }
  .row-start-md-10 {
    grid-row-start: 10;
  }
  .row-end-md-10 {
    grid-row-end: 11;
  }
  .row-span-md-10 {
    grid-row-end: span 10;
  }
  .has-md-11-columns {
    grid-template-columns: repeat(11, 1fr);
  }
  .has-md-11-rows {
    grid-template-rows: repeat(11, 1fr);
  }
  .column-start-md-11 {
    grid-column-start: 11;
  }
  .column-end-md-11 {
    grid-column-end: 12;
  }
  .column-span-md-11 {
    grid-column-end: span 11;
  }
  .row-start-md-11 {
    grid-row-start: 11;
  }
  .row-end-md-11 {
    grid-row-end: 12;
  }
  .row-span-md-11 {
    grid-row-end: span 11;
  }
  .has-md-12-columns {
    grid-template-columns: repeat(12, 1fr);
  }
  .has-md-12-rows {
    grid-template-rows: repeat(12, 1fr);
  }
  .column-start-md-12 {
    grid-column-start: 12;
  }
  .column-end-md-12 {
    grid-column-end: 13;
  }
  .column-span-md-12 {
    grid-column-end: span 12;
  }
  .row-start-md-12 {
    grid-row-start: 12;
  }
  .row-end-md-12 {
    grid-row-end: 13;
  }
  .row-span-md-12 {
    grid-row-end: span 12;
  }
  .gap-column-md-1 {
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
  .gap-row-md-1 {
    row-gap: 5px;
  }
  .gap-column-md-2 {
    -moz-column-gap: 10px;
         column-gap: 10px;
  }
  .gap-row-md-2 {
    row-gap: 10px;
  }
  .gap-column-md-3 {
    -moz-column-gap: 15px;
         column-gap: 15px;
  }
  .gap-row-md-3 {
    row-gap: 15px;
  }
  .gap-column-md-4 {
    -moz-column-gap: 20px;
         column-gap: 20px;
  }
  .gap-row-md-4 {
    row-gap: 20px;
  }
  .gap-column-md-5 {
    -moz-column-gap: 25px;
         column-gap: 25px;
  }
  .gap-row-md-5 {
    row-gap: 25px;
  }
  .gap-column-md-6 {
    -moz-column-gap: 30px;
         column-gap: 30px;
  }
  .gap-row-md-6 {
    row-gap: 30px;
  }
  .gap-column-md-7 {
    -moz-column-gap: 35px;
         column-gap: 35px;
  }
  .gap-row-md-7 {
    row-gap: 35px;
  }
  .gap-column-md-8 {
    -moz-column-gap: 40px;
         column-gap: 40px;
  }
  .gap-row-md-8 {
    row-gap: 40px;
  }
}
@media only screen and (min-width: 992px) {
  .has-lg-1-columns {
    grid-template-columns: repeat(1, 1fr);
  }
  .has-lg-1-rows {
    grid-template-rows: repeat(1, 1fr);
  }
  .column-start-lg-1 {
    grid-column-start: 1;
  }
  .column-end-lg-1 {
    grid-column-end: 2;
  }
  .column-span-lg-1 {
    grid-column-end: span 1;
  }
  .row-start-lg-1 {
    grid-row-start: 1;
  }
  .row-end-lg-1 {
    grid-row-end: 2;
  }
  .row-span-lg-1 {
    grid-row-end: span 1;
  }
  .has-lg-2-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .has-lg-2-rows {
    grid-template-rows: repeat(2, 1fr);
  }
  .column-start-lg-2 {
    grid-column-start: 2;
  }
  .column-end-lg-2 {
    grid-column-end: 3;
  }
  .column-span-lg-2 {
    grid-column-end: span 2;
  }
  .row-start-lg-2 {
    grid-row-start: 2;
  }
  .row-end-lg-2 {
    grid-row-end: 3;
  }
  .row-span-lg-2 {
    grid-row-end: span 2;
  }
  .has-lg-3-columns {
    grid-template-columns: repeat(3, 1fr);
  }
  .has-lg-3-rows {
    grid-template-rows: repeat(3, 1fr);
  }
  .column-start-lg-3 {
    grid-column-start: 3;
  }
  .column-end-lg-3 {
    grid-column-end: 4;
  }
  .column-span-lg-3 {
    grid-column-end: span 3;
  }
  .row-start-lg-3 {
    grid-row-start: 3;
  }
  .row-end-lg-3 {
    grid-row-end: 4;
  }
  .row-span-lg-3 {
    grid-row-end: span 3;
  }
  .has-lg-4-columns {
    grid-template-columns: repeat(4, 1fr);
  }
  .has-lg-4-rows {
    grid-template-rows: repeat(4, 1fr);
  }
  .column-start-lg-4 {
    grid-column-start: 4;
  }
  .column-end-lg-4 {
    grid-column-end: 5;
  }
  .column-span-lg-4 {
    grid-column-end: span 4;
  }
  .row-start-lg-4 {
    grid-row-start: 4;
  }
  .row-end-lg-4 {
    grid-row-end: 5;
  }
  .row-span-lg-4 {
    grid-row-end: span 4;
  }
  .has-lg-5-columns {
    grid-template-columns: repeat(5, 1fr);
  }
  .has-lg-5-rows {
    grid-template-rows: repeat(5, 1fr);
  }
  .column-start-lg-5 {
    grid-column-start: 5;
  }
  .column-end-lg-5 {
    grid-column-end: 6;
  }
  .column-span-lg-5 {
    grid-column-end: span 5;
  }
  .row-start-lg-5 {
    grid-row-start: 5;
  }
  .row-end-lg-5 {
    grid-row-end: 6;
  }
  .row-span-lg-5 {
    grid-row-end: span 5;
  }
  .has-lg-6-columns {
    grid-template-columns: repeat(6, 1fr);
  }
  .has-lg-6-rows {
    grid-template-rows: repeat(6, 1fr);
  }
  .column-start-lg-6 {
    grid-column-start: 6;
  }
  .column-end-lg-6 {
    grid-column-end: 7;
  }
  .column-span-lg-6 {
    grid-column-end: span 6;
  }
  .row-start-lg-6 {
    grid-row-start: 6;
  }
  .row-end-lg-6 {
    grid-row-end: 7;
  }
  .row-span-lg-6 {
    grid-row-end: span 6;
  }
  .has-lg-7-columns {
    grid-template-columns: repeat(7, 1fr);
  }
  .has-lg-7-rows {
    grid-template-rows: repeat(7, 1fr);
  }
  .column-start-lg-7 {
    grid-column-start: 7;
  }
  .column-end-lg-7 {
    grid-column-end: 8;
  }
  .column-span-lg-7 {
    grid-column-end: span 7;
  }
  .row-start-lg-7 {
    grid-row-start: 7;
  }
  .row-end-lg-7 {
    grid-row-end: 8;
  }
  .row-span-lg-7 {
    grid-row-end: span 7;
  }
  .has-lg-8-columns {
    grid-template-columns: repeat(8, 1fr);
  }
  .has-lg-8-rows {
    grid-template-rows: repeat(8, 1fr);
  }
  .column-start-lg-8 {
    grid-column-start: 8;
  }
  .column-end-lg-8 {
    grid-column-end: 9;
  }
  .column-span-lg-8 {
    grid-column-end: span 8;
  }
  .row-start-lg-8 {
    grid-row-start: 8;
  }
  .row-end-lg-8 {
    grid-row-end: 9;
  }
  .row-span-lg-8 {
    grid-row-end: span 8;
  }
  .has-lg-9-columns {
    grid-template-columns: repeat(9, 1fr);
  }
  .has-lg-9-rows {
    grid-template-rows: repeat(9, 1fr);
  }
  .column-start-lg-9 {
    grid-column-start: 9;
  }
  .column-end-lg-9 {
    grid-column-end: 10;
  }
  .column-span-lg-9 {
    grid-column-end: span 9;
  }
  .row-start-lg-9 {
    grid-row-start: 9;
  }
  .row-end-lg-9 {
    grid-row-end: 10;
  }
  .row-span-lg-9 {
    grid-row-end: span 9;
  }
  .has-lg-10-columns {
    grid-template-columns: repeat(10, 1fr);
  }
  .has-lg-10-rows {
    grid-template-rows: repeat(10, 1fr);
  }
  .column-start-lg-10 {
    grid-column-start: 10;
  }
  .column-end-lg-10 {
    grid-column-end: 11;
  }
  .column-span-lg-10 {
    grid-column-end: span 10;
  }
  .row-start-lg-10 {
    grid-row-start: 10;
  }
  .row-end-lg-10 {
    grid-row-end: 11;
  }
  .row-span-lg-10 {
    grid-row-end: span 10;
  }
  .has-lg-11-columns {
    grid-template-columns: repeat(11, 1fr);
  }
  .has-lg-11-rows {
    grid-template-rows: repeat(11, 1fr);
  }
  .column-start-lg-11 {
    grid-column-start: 11;
  }
  .column-end-lg-11 {
    grid-column-end: 12;
  }
  .column-span-lg-11 {
    grid-column-end: span 11;
  }
  .row-start-lg-11 {
    grid-row-start: 11;
  }
  .row-end-lg-11 {
    grid-row-end: 12;
  }
  .row-span-lg-11 {
    grid-row-end: span 11;
  }
  .has-lg-12-columns {
    grid-template-columns: repeat(12, 1fr);
  }
  .has-lg-12-rows {
    grid-template-rows: repeat(12, 1fr);
  }
  .column-start-lg-12 {
    grid-column-start: 12;
  }
  .column-end-lg-12 {
    grid-column-end: 13;
  }
  .column-span-lg-12 {
    grid-column-end: span 12;
  }
  .row-start-lg-12 {
    grid-row-start: 12;
  }
  .row-end-lg-12 {
    grid-row-end: 13;
  }
  .row-span-lg-12 {
    grid-row-end: span 12;
  }
  .gap-column-lg-1 {
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
  .gap-row-lg-1 {
    row-gap: 5px;
  }
  .gap-column-lg-2 {
    -moz-column-gap: 10px;
         column-gap: 10px;
  }
  .gap-row-lg-2 {
    row-gap: 10px;
  }
  .gap-column-lg-3 {
    -moz-column-gap: 15px;
         column-gap: 15px;
  }
  .gap-row-lg-3 {
    row-gap: 15px;
  }
  .gap-column-lg-4 {
    -moz-column-gap: 20px;
         column-gap: 20px;
  }
  .gap-row-lg-4 {
    row-gap: 20px;
  }
  .gap-column-lg-5 {
    -moz-column-gap: 25px;
         column-gap: 25px;
  }
  .gap-row-lg-5 {
    row-gap: 25px;
  }
  .gap-column-lg-6 {
    -moz-column-gap: 30px;
         column-gap: 30px;
  }
  .gap-row-lg-6 {
    row-gap: 30px;
  }
  .gap-column-lg-7 {
    -moz-column-gap: 35px;
         column-gap: 35px;
  }
  .gap-row-lg-7 {
    row-gap: 35px;
  }
  .gap-column-lg-8 {
    -moz-column-gap: 40px;
         column-gap: 40px;
  }
  .gap-row-lg-8 {
    row-gap: 40px;
  }
}
@media only screen and (min-width: 1200px) {
  .has-xl-1-columns {
    grid-template-columns: repeat(1, 1fr);
  }
  .has-xl-1-rows {
    grid-template-rows: repeat(1, 1fr);
  }
  .column-start-xl-1 {
    grid-column-start: 1;
  }
  .column-end-xl-1 {
    grid-column-end: 2;
  }
  .column-span-xl-1 {
    grid-column-end: span 1;
  }
  .row-start-xl-1 {
    grid-row-start: 1;
  }
  .row-end-xl-1 {
    grid-row-end: 2;
  }
  .row-span-xl-1 {
    grid-row-end: span 1;
  }
  .has-xl-2-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .has-xl-2-rows {
    grid-template-rows: repeat(2, 1fr);
  }
  .column-start-xl-2 {
    grid-column-start: 2;
  }
  .column-end-xl-2 {
    grid-column-end: 3;
  }
  .column-span-xl-2 {
    grid-column-end: span 2;
  }
  .row-start-xl-2 {
    grid-row-start: 2;
  }
  .row-end-xl-2 {
    grid-row-end: 3;
  }
  .row-span-xl-2 {
    grid-row-end: span 2;
  }
  .has-xl-3-columns {
    grid-template-columns: repeat(3, 1fr);
  }
  .has-xl-3-rows {
    grid-template-rows: repeat(3, 1fr);
  }
  .column-start-xl-3 {
    grid-column-start: 3;
  }
  .column-end-xl-3 {
    grid-column-end: 4;
  }
  .column-span-xl-3 {
    grid-column-end: span 3;
  }
  .row-start-xl-3 {
    grid-row-start: 3;
  }
  .row-end-xl-3 {
    grid-row-end: 4;
  }
  .row-span-xl-3 {
    grid-row-end: span 3;
  }
  .has-xl-4-columns {
    grid-template-columns: repeat(4, 1fr);
  }
  .has-xl-4-rows {
    grid-template-rows: repeat(4, 1fr);
  }
  .column-start-xl-4 {
    grid-column-start: 4;
  }
  .column-end-xl-4 {
    grid-column-end: 5;
  }
  .column-span-xl-4 {
    grid-column-end: span 4;
  }
  .row-start-xl-4 {
    grid-row-start: 4;
  }
  .row-end-xl-4 {
    grid-row-end: 5;
  }
  .row-span-xl-4 {
    grid-row-end: span 4;
  }
  .has-xl-5-columns {
    grid-template-columns: repeat(5, 1fr);
  }
  .has-xl-5-rows {
    grid-template-rows: repeat(5, 1fr);
  }
  .column-start-xl-5 {
    grid-column-start: 5;
  }
  .column-end-xl-5 {
    grid-column-end: 6;
  }
  .column-span-xl-5 {
    grid-column-end: span 5;
  }
  .row-start-xl-5 {
    grid-row-start: 5;
  }
  .row-end-xl-5 {
    grid-row-end: 6;
  }
  .row-span-xl-5 {
    grid-row-end: span 5;
  }
  .has-xl-6-columns {
    grid-template-columns: repeat(6, 1fr);
  }
  .has-xl-6-rows {
    grid-template-rows: repeat(6, 1fr);
  }
  .column-start-xl-6 {
    grid-column-start: 6;
  }
  .column-end-xl-6 {
    grid-column-end: 7;
  }
  .column-span-xl-6 {
    grid-column-end: span 6;
  }
  .row-start-xl-6 {
    grid-row-start: 6;
  }
  .row-end-xl-6 {
    grid-row-end: 7;
  }
  .row-span-xl-6 {
    grid-row-end: span 6;
  }
  .has-xl-7-columns {
    grid-template-columns: repeat(7, 1fr);
  }
  .has-xl-7-rows {
    grid-template-rows: repeat(7, 1fr);
  }
  .column-start-xl-7 {
    grid-column-start: 7;
  }
  .column-end-xl-7 {
    grid-column-end: 8;
  }
  .column-span-xl-7 {
    grid-column-end: span 7;
  }
  .row-start-xl-7 {
    grid-row-start: 7;
  }
  .row-end-xl-7 {
    grid-row-end: 8;
  }
  .row-span-xl-7 {
    grid-row-end: span 7;
  }
  .has-xl-8-columns {
    grid-template-columns: repeat(8, 1fr);
  }
  .has-xl-8-rows {
    grid-template-rows: repeat(8, 1fr);
  }
  .column-start-xl-8 {
    grid-column-start: 8;
  }
  .column-end-xl-8 {
    grid-column-end: 9;
  }
  .column-span-xl-8 {
    grid-column-end: span 8;
  }
  .row-start-xl-8 {
    grid-row-start: 8;
  }
  .row-end-xl-8 {
    grid-row-end: 9;
  }
  .row-span-xl-8 {
    grid-row-end: span 8;
  }
  .has-xl-9-columns {
    grid-template-columns: repeat(9, 1fr);
  }
  .has-xl-9-rows {
    grid-template-rows: repeat(9, 1fr);
  }
  .column-start-xl-9 {
    grid-column-start: 9;
  }
  .column-end-xl-9 {
    grid-column-end: 10;
  }
  .column-span-xl-9 {
    grid-column-end: span 9;
  }
  .row-start-xl-9 {
    grid-row-start: 9;
  }
  .row-end-xl-9 {
    grid-row-end: 10;
  }
  .row-span-xl-9 {
    grid-row-end: span 9;
  }
  .has-xl-10-columns {
    grid-template-columns: repeat(10, 1fr);
  }
  .has-xl-10-rows {
    grid-template-rows: repeat(10, 1fr);
  }
  .column-start-xl-10 {
    grid-column-start: 10;
  }
  .column-end-xl-10 {
    grid-column-end: 11;
  }
  .column-span-xl-10 {
    grid-column-end: span 10;
  }
  .row-start-xl-10 {
    grid-row-start: 10;
  }
  .row-end-xl-10 {
    grid-row-end: 11;
  }
  .row-span-xl-10 {
    grid-row-end: span 10;
  }
  .has-xl-11-columns {
    grid-template-columns: repeat(11, 1fr);
  }
  .has-xl-11-rows {
    grid-template-rows: repeat(11, 1fr);
  }
  .column-start-xl-11 {
    grid-column-start: 11;
  }
  .column-end-xl-11 {
    grid-column-end: 12;
  }
  .column-span-xl-11 {
    grid-column-end: span 11;
  }
  .row-start-xl-11 {
    grid-row-start: 11;
  }
  .row-end-xl-11 {
    grid-row-end: 12;
  }
  .row-span-xl-11 {
    grid-row-end: span 11;
  }
  .has-xl-12-columns {
    grid-template-columns: repeat(12, 1fr);
  }
  .has-xl-12-rows {
    grid-template-rows: repeat(12, 1fr);
  }
  .column-start-xl-12 {
    grid-column-start: 12;
  }
  .column-end-xl-12 {
    grid-column-end: 13;
  }
  .column-span-xl-12 {
    grid-column-end: span 12;
  }
  .row-start-xl-12 {
    grid-row-start: 12;
  }
  .row-end-xl-12 {
    grid-row-end: 13;
  }
  .row-span-xl-12 {
    grid-row-end: span 12;
  }
  .gap-column-xl-1 {
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
  .gap-row-xl-1 {
    row-gap: 5px;
  }
  .gap-column-xl-2 {
    -moz-column-gap: 10px;
         column-gap: 10px;
  }
  .gap-row-xl-2 {
    row-gap: 10px;
  }
  .gap-column-xl-3 {
    -moz-column-gap: 15px;
         column-gap: 15px;
  }
  .gap-row-xl-3 {
    row-gap: 15px;
  }
  .gap-column-xl-4 {
    -moz-column-gap: 20px;
         column-gap: 20px;
  }
  .gap-row-xl-4 {
    row-gap: 20px;
  }
  .gap-column-xl-5 {
    -moz-column-gap: 25px;
         column-gap: 25px;
  }
  .gap-row-xl-5 {
    row-gap: 25px;
  }
  .gap-column-xl-6 {
    -moz-column-gap: 30px;
         column-gap: 30px;
  }
  .gap-row-xl-6 {
    row-gap: 30px;
  }
  .gap-column-xl-7 {
    -moz-column-gap: 35px;
         column-gap: 35px;
  }
  .gap-row-xl-7 {
    row-gap: 35px;
  }
  .gap-column-xl-8 {
    -moz-column-gap: 40px;
         column-gap: 40px;
  }
  .gap-row-xl-8 {
    row-gap: 40px;
  }
}
@media only screen and (min-width: 1440px) {
  .has-xxl-1-columns {
    grid-template-columns: repeat(1, 1fr);
  }
  .has-xxl-1-rows {
    grid-template-rows: repeat(1, 1fr);
  }
  .column-start-xxl-1 {
    grid-column-start: 1;
  }
  .column-end-xxl-1 {
    grid-column-end: 2;
  }
  .column-span-xxl-1 {
    grid-column-end: span 1;
  }
  .row-start-xxl-1 {
    grid-row-start: 1;
  }
  .row-end-xxl-1 {
    grid-row-end: 2;
  }
  .row-span-xxl-1 {
    grid-row-end: span 1;
  }
  .has-xxl-2-columns {
    grid-template-columns: repeat(2, 1fr);
  }
  .has-xxl-2-rows {
    grid-template-rows: repeat(2, 1fr);
  }
  .column-start-xxl-2 {
    grid-column-start: 2;
  }
  .column-end-xxl-2 {
    grid-column-end: 3;
  }
  .column-span-xxl-2 {
    grid-column-end: span 2;
  }
  .row-start-xxl-2 {
    grid-row-start: 2;
  }
  .row-end-xxl-2 {
    grid-row-end: 3;
  }
  .row-span-xxl-2 {
    grid-row-end: span 2;
  }
  .has-xxl-3-columns {
    grid-template-columns: repeat(3, 1fr);
  }
  .has-xxl-3-rows {
    grid-template-rows: repeat(3, 1fr);
  }
  .column-start-xxl-3 {
    grid-column-start: 3;
  }
  .column-end-xxl-3 {
    grid-column-end: 4;
  }
  .column-span-xxl-3 {
    grid-column-end: span 3;
  }
  .row-start-xxl-3 {
    grid-row-start: 3;
  }
  .row-end-xxl-3 {
    grid-row-end: 4;
  }
  .row-span-xxl-3 {
    grid-row-end: span 3;
  }
  .has-xxl-4-columns {
    grid-template-columns: repeat(4, 1fr);
  }
  .has-xxl-4-rows {
    grid-template-rows: repeat(4, 1fr);
  }
  .column-start-xxl-4 {
    grid-column-start: 4;
  }
  .column-end-xxl-4 {
    grid-column-end: 5;
  }
  .column-span-xxl-4 {
    grid-column-end: span 4;
  }
  .row-start-xxl-4 {
    grid-row-start: 4;
  }
  .row-end-xxl-4 {
    grid-row-end: 5;
  }
  .row-span-xxl-4 {
    grid-row-end: span 4;
  }
  .has-xxl-5-columns {
    grid-template-columns: repeat(5, 1fr);
  }
  .has-xxl-5-rows {
    grid-template-rows: repeat(5, 1fr);
  }
  .column-start-xxl-5 {
    grid-column-start: 5;
  }
  .column-end-xxl-5 {
    grid-column-end: 6;
  }
  .column-span-xxl-5 {
    grid-column-end: span 5;
  }
  .row-start-xxl-5 {
    grid-row-start: 5;
  }
  .row-end-xxl-5 {
    grid-row-end: 6;
  }
  .row-span-xxl-5 {
    grid-row-end: span 5;
  }
  .has-xxl-6-columns {
    grid-template-columns: repeat(6, 1fr);
  }
  .has-xxl-6-rows {
    grid-template-rows: repeat(6, 1fr);
  }
  .column-start-xxl-6 {
    grid-column-start: 6;
  }
  .column-end-xxl-6 {
    grid-column-end: 7;
  }
  .column-span-xxl-6 {
    grid-column-end: span 6;
  }
  .row-start-xxl-6 {
    grid-row-start: 6;
  }
  .row-end-xxl-6 {
    grid-row-end: 7;
  }
  .row-span-xxl-6 {
    grid-row-end: span 6;
  }
  .has-xxl-7-columns {
    grid-template-columns: repeat(7, 1fr);
  }
  .has-xxl-7-rows {
    grid-template-rows: repeat(7, 1fr);
  }
  .column-start-xxl-7 {
    grid-column-start: 7;
  }
  .column-end-xxl-7 {
    grid-column-end: 8;
  }
  .column-span-xxl-7 {
    grid-column-end: span 7;
  }
  .row-start-xxl-7 {
    grid-row-start: 7;
  }
  .row-end-xxl-7 {
    grid-row-end: 8;
  }
  .row-span-xxl-7 {
    grid-row-end: span 7;
  }
  .has-xxl-8-columns {
    grid-template-columns: repeat(8, 1fr);
  }
  .has-xxl-8-rows {
    grid-template-rows: repeat(8, 1fr);
  }
  .column-start-xxl-8 {
    grid-column-start: 8;
  }
  .column-end-xxl-8 {
    grid-column-end: 9;
  }
  .column-span-xxl-8 {
    grid-column-end: span 8;
  }
  .row-start-xxl-8 {
    grid-row-start: 8;
  }
  .row-end-xxl-8 {
    grid-row-end: 9;
  }
  .row-span-xxl-8 {
    grid-row-end: span 8;
  }
  .has-xxl-9-columns {
    grid-template-columns: repeat(9, 1fr);
  }
  .has-xxl-9-rows {
    grid-template-rows: repeat(9, 1fr);
  }
  .column-start-xxl-9 {
    grid-column-start: 9;
  }
  .column-end-xxl-9 {
    grid-column-end: 10;
  }
  .column-span-xxl-9 {
    grid-column-end: span 9;
  }
  .row-start-xxl-9 {
    grid-row-start: 9;
  }
  .row-end-xxl-9 {
    grid-row-end: 10;
  }
  .row-span-xxl-9 {
    grid-row-end: span 9;
  }
  .has-xxl-10-columns {
    grid-template-columns: repeat(10, 1fr);
  }
  .has-xxl-10-rows {
    grid-template-rows: repeat(10, 1fr);
  }
  .column-start-xxl-10 {
    grid-column-start: 10;
  }
  .column-end-xxl-10 {
    grid-column-end: 11;
  }
  .column-span-xxl-10 {
    grid-column-end: span 10;
  }
  .row-start-xxl-10 {
    grid-row-start: 10;
  }
  .row-end-xxl-10 {
    grid-row-end: 11;
  }
  .row-span-xxl-10 {
    grid-row-end: span 10;
  }
  .has-xxl-11-columns {
    grid-template-columns: repeat(11, 1fr);
  }
  .has-xxl-11-rows {
    grid-template-rows: repeat(11, 1fr);
  }
  .column-start-xxl-11 {
    grid-column-start: 11;
  }
  .column-end-xxl-11 {
    grid-column-end: 12;
  }
  .column-span-xxl-11 {
    grid-column-end: span 11;
  }
  .row-start-xxl-11 {
    grid-row-start: 11;
  }
  .row-end-xxl-11 {
    grid-row-end: 12;
  }
  .row-span-xxl-11 {
    grid-row-end: span 11;
  }
  .has-xxl-12-columns {
    grid-template-columns: repeat(12, 1fr);
  }
  .has-xxl-12-rows {
    grid-template-rows: repeat(12, 1fr);
  }
  .column-start-xxl-12 {
    grid-column-start: 12;
  }
  .column-end-xxl-12 {
    grid-column-end: 13;
  }
  .column-span-xxl-12 {
    grid-column-end: span 12;
  }
  .row-start-xxl-12 {
    grid-row-start: 12;
  }
  .row-end-xxl-12 {
    grid-row-end: 13;
  }
  .row-span-xxl-12 {
    grid-row-end: span 12;
  }
  .gap-column-xxl-1 {
    -moz-column-gap: 5px;
         column-gap: 5px;
  }
  .gap-row-xxl-1 {
    row-gap: 5px;
  }
  .gap-column-xxl-2 {
    -moz-column-gap: 10px;
         column-gap: 10px;
  }
  .gap-row-xxl-2 {
    row-gap: 10px;
  }
  .gap-column-xxl-3 {
    -moz-column-gap: 15px;
         column-gap: 15px;
  }
  .gap-row-xxl-3 {
    row-gap: 15px;
  }
  .gap-column-xxl-4 {
    -moz-column-gap: 20px;
         column-gap: 20px;
  }
  .gap-row-xxl-4 {
    row-gap: 20px;
  }
  .gap-column-xxl-5 {
    -moz-column-gap: 25px;
         column-gap: 25px;
  }
  .gap-row-xxl-5 {
    row-gap: 25px;
  }
  .gap-column-xxl-6 {
    -moz-column-gap: 30px;
         column-gap: 30px;
  }
  .gap-row-xxl-6 {
    row-gap: 30px;
  }
  .gap-column-xxl-7 {
    -moz-column-gap: 35px;
         column-gap: 35px;
  }
  .gap-row-xxl-7 {
    row-gap: 35px;
  }
  .gap-column-xxl-8 {
    -moz-column-gap: 40px;
         column-gap: 40px;
  }
  .gap-row-xxl-8 {
    row-gap: 40px;
  }
}
/* NAVIGATION
================================*/
.navigation {
  display: flex;
  align-items: initial;
  width: 100%;
  min-height: 45px;
  padding: 0;
  position: relative;
  line-height: initial;
  font-family: inherit;
  box-sizing: border-box;
  background-color: var(--framex-base-color-bg-foreground);
  transition: background 0.1s;
}
@media (min-width: 1024px) {
  .navigation {
    height: auto;
  }
}
.navigation *,
.navigation *:before,
.navigation *:after {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  text-decoration: none;
}
.navigation.fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 19998;
}
.navigation.sticky-top {
  position: sticky;
  top: 0;
  will-change: opacity;
  z-index: 19998;
}
.navigation > .container {
  display: flex;
}

/* MOBILE HEADER
================================*/
.navigation-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 1024px) {
  .navigation-header {
    display: none;
  }
}

/* OVERLAY PANEL
================================*/
.overlay-panel {
  width: 0;
  height: 0;
  position: fixed;
  left: 0;
  top: 0;
  opacity: 0;
  z-index: -999999;
  transition: opacity 0.1s;
}
.overlay-panel.is-visible {
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 19999;
}
.overlay-panel.is-invisible {
  opacity: 0;
}
@media (min-width: 1024px) {
  .overlay-panel.is-visible {
    display: none !important;
  }
}

/* NAVIGATION BRAND TEXT
================================*/
.navigation-brand-text a {
  font-size: 17px;
  font-weight: bold;
  color: var(--framex-base-color-text);
  text-decoration: none;
}
@media (min-width: 1024px) {
  .navigation-brand-text a {
    font-size: 22px;
  }
}
.navigation-header .navigation-brand-text {
  padding: 0 1rem;
}

/* NAVIGATION LOGO
================================*/
.navigation-logo {
  display: flex;
  align-items: center;
}
.navigation-logo a {
  display: flex;
  align-items: center;
}
.navigation-logo a img {
  height: 40px;
  display: block;
}
@media (min-width: 1024px) {
  .navigation-logo a img {
    height: 58px;
  }
}
.navigation-logo-top .navigation-body .navigation-logo img {
  width: auto;
  height: auto;
}
.navigation-header .navigation-logo {
  padding: 0 1rem;
}
.navigation-logo.navigation-item a img {
  width: auto;
  height: auto;
}

/* NAVIGATION BUTTON TOGGLER
================================*/
.navigation-button-toggler {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  cursor: pointer;
}
.navigation-button-toggler .hamburger-icon {
  width: 20px;
  height: 2px;
  display: inline-block;
  font-style: normal;
  color: var(--framex-base-color-text);
  box-shadow: inset 0 0 0 32px, 0 -6px, 0 6px;
}

/* NAVIGATION BODY
================================*/
.navigation-body {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: -100%;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: #ffffff;
  z-index: 20000;
  transition: left 0.01s cubic-bezier(0.1, 0.1, 0.1, 0.1), right 0.01s cubic-bezier(0.1, 0.1, 0.1, 0.1);
}
@media (min-width: 768px) {
  .navigation-body {
    width: 400px;
  }
}
@media (min-width: 1024px) {
  .navigation-body {
    display: flex;
    align-items: center;
    width: 100%;
    position: relative;
    left: auto;
    overflow: visible;
    z-index: auto;
    background-color: transparent;
    transition: all 0.01s ease 0.01s;
  }
}
.navigation-body.offcanvas-right {
  left: auto;
  right: -100%;
}
@media (min-width: 1024px) {
  .navigation-body.offcanvas-right {
    right: auto;
  }
}
.navigation-body.is-visible {
  left: 0;
  transition: left 0.01s, right 0.01s;
}
.navigation-body.offcanvas-right.is-visible {
  right: 0;
  left: auto;
}
@media (min-width: 1024px) {
  .navigation-body.offcanvas-right.is-visible {
    right: auto;
  }
}
.navigation-body.is-invisible {
  left: -100%;
}
.navigation-body.offcanvas-right.is-invisible {
  right: -100%;
}
.navigation-body.scroll-momentum {
  -webkit-overflow-scrolling: touch;
}
@media (min-width: 1024px) {
  .navigation-centered .navigation-body {
    justify-content: center;
  }
  .navigation-justified .navigation-body {
    justify-content: space-between;
  }
  .navigation-logo-top .navigation-body {
    flex-direction: column;
  }
}

.navigation-body-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px;
  border-bottom: solid 1px var(--framex-base-color-border);
}
@media (min-width: 1024px) {
  .navigation-body-header {
    border: none;
  }
  .navigation-centered .navigation-body-header {
    padding: 0;
  }
  .navigation-logo-top .navigation-body-header {
    padding-top: 20px;
  }
}

.navigation-body-close-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  margin-left: auto;
  padding-bottom: 2px;
  line-height: initial;
  text-align: center;
  font-size: 25px;
  color: var(--framex-base-color-text);
  cursor: pointer;
}
@media (min-width: 1024px) {
  .navigation-body-close-button {
    display: none;
  }
}

.navigation-body-section {
  width: 100%;
  padding: 16px;
  display: inline-flex;
  flex-direction: column;
}
@media (min-width: 1024px) {
  .navigation-body-section {
    width: auto;
    display: inline-block;
  }
}
.navigation-body-section + .navigation-body-section {
  padding-top: 0;
}
@media (min-width: 1024px) {
  .navigation-body-section + .navigation-body-section {
    padding-top: 16px;
  }
}

/* NAVIGATION MENU
================================*/
.navigation-menu {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0rem;
  display: inline-block;
}
@media (min-width: 1024px) {
  .navigation-menu {
    width: auto;
    display: flex;
    align-items: center;
  }
  .navigation .navigation-menu {
    align-self: stretch;
    align-items: stretch;
  }
  .navigation-logo-top .navigation-menu {
    justify-content: center;
  }
}

/* Navbar item */
.navigation-item {
  width: 100%;
  margin: 0;
  display: inline-block;
}
@media (min-width: 1024px) {
  .navigation-item {
    width: auto;
  }
}

/* Navbar link */
.navigation-link {
  width: 100%;
  padding: 13px 16px;
  display: flex;
  align-items: center;
  position: relative;
  font-size: 15px;
  letter-spacing: 0.3px;
  color: var(--framex-base-color-text);
  border-bottom: solid 1px var(--framex-base-color-border);
  transition: color 0.1s;
  font-weight: 700;
}
.navigation-link:visited {
  color: var(--framex-base-color-text);
}
@media (min-width: 1024px) {
  .navigation-item:last-child .navigation-link {
    border-top: none;
    border-bottom: none;
  }
}
.navigation-item:not(.navigation-brand-text):hover .navigation-link, .navigation-item:not(.navigation-brand-text):focus .navigation-link, .navigation-item:not(.navigation-brand-text).is-active .navigation-link {
  text-decoration: none !important;
  color: var(--framex-base-color-primary);
  background-color: transparent;
}
@media (min-width: 1024px) {
  .navigation-link {
    height: 100%;
    padding: 10px 13px;
    line-height: 45px;
    border: none;
  }
}
.navigation-menu.navigation-social-menu + .navigation-menu:not(.navigation-social-menu) .navigation-item:first-child .navigation-link {
  border-top: solid 1px var(--framex-base-color-border);
}
@media (min-width: 1024px) {
  .navigation-menu.navigation-social-menu + .navigation-menu:not(.navigation-social-menu) .navigation-item:first-child .navigation-link {
    border-top: none;
  }
}
.navigation-link i {
  width: 28px;
  float: left;
  text-align: center;
  font-size: 24px;
  line-height: 0;
}
.navigation-link i[class*=ai] {
  font-size: 15px;
}
@media (min-width: 1024px) {
  .navigation-link i {
    width: auto;
  }
}
.navigation-link i + span {
  padding-left: 8px;
}
.navigation-icon-item .navigation-link {
  padding: 13px 16px;
}
@media (min-width: 1024px) {
  .navigation-icon-item .navigation-link {
    width: 100%;
    margin: 0;
    padding: 25px 25.6px;
    border-left: solid 1px var(--framex-base-color-border);
  }
}
@media (min-width: 1024px) {
  .navigation-icon-item .navigation-link span:not(.submenu-indicator) {
    display: none;
  }
}
@media (min-width: 1024px) {
  .navigation-icon-item .navigation-link .navigation-badge {
    right: 10px;
  }
}
@media (min-width: 1024px) {
  .navigation-icon-item .navigation-link i {
    width: 20px;
    height: 26px;
    margin: 0;
    line-height: 26px;
    text-align: center;
    float: left;
    font-size: 25.6px;
  }
  .navigation-icon-item .navigation-link i[class*=ai] {
    width: auto;
    font-size: 15px;
  }
}
.navigation-avatar-item .navigation-link {
  font-size: 12px;
  font-weight: bold;
}
.navigation-avatar-item .navigation-link img {
  width: 48px;
  border: solid 2px var(--framex-base-color-primary);
  border-radius: 50%;
}
.navigation-avatar-item .navigation-link span {
  margin-left: 8px;
}
.navigation-body-section + .navigation-menu:not(.navigation-social-menu) > .navigation-item:first-child > .navigation-link {
  border-top: solid 1px var(--framex-base-color-border);
}
@media (min-width: 1024px) {
  .navigation-body-section + .navigation-menu:not(.navigation-social-menu) > .navigation-item:first-child > .navigation-link {
    border-top: none;
  }
}

/* NAVIGATION SOCIAL MENU
================================*/
.navigation-social-menu {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 0 10px;
  text-align: center;
}
@media (min-width: 1024px) {
  .navigation-social-menu {
    width: auto;
  }
}
@media (max-width: 1023px) {
  .navigation-social-menu {
    padding: 16px;
  }
}
.navigation-social-menu .navigation-item {
  width: auto;
  display: inline-block;
}
.navigation-social-menu .navigation-item .navigation-link {
  margin: 0;
  padding: 0 5px;
  border: none;
}
.navigation-social-menu .navigation-item .navigation-link i {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 38px;
  height: 38px;
  margin: 0;
  line-height: initial;
  font-size: 19px;
  border-radius: 50%;
  background-color: var(--framex-base-color-bg-background);
}
.navigation-social-menu .navigation-item .navigation-link i:not([class*=fa]):before {
  margin-right: -1px;
}
.navigation-social-menu .navigation-item:last-child .navigation-link {
  padding-right: 0;
}
.navigation-social-menu .navigation-item:first-child .navigation-link {
  padding-left: 0;
}
@media (max-width: 1023px) {
  .navigation-social-menu .navigation-item {
    display: flex;
  }
}

/* SUBMENU INDICATOR
================================*/
.submenu-indicator {
  width: 46px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 20000;
}
@media (min-width: 1024px) {
  .submenu-indicator {
    width: 6px;
    height: 6px;
    margin-left: 6px;
    float: right;
    position: relative;
  }
  li:not(.navigation-icon-item) span:not(.navigation-badge) + .submenu-indicator, li:not(.navigation-icon-item) i + span + .navigation-badge + .submenu-indicator {
    margin-left: 0;
  }
}
.submenu-indicator:after {
  height: 6px;
  width: 6px;
  margin: -3px 0 0 -3px;
  top: 50%;
  left: 50%;
  content: "";
  position: absolute;
  border-style: solid;
  border-width: 0 1px 1px 0;
  border-color: transparent var(--framex-base-color-text) var(--framex-base-color-text) transparent;
  transform: rotate(45deg);
  transition: border 0.1s, transform 0.1s;
}
.navigation-item:hover > .navigation-link > .submenu-indicator:after, .navigation-item:focus > .navigation-link > .submenu-indicator:after, .navigation-item.is-active > .navigation-link > .submenu-indicator:after {
  border-color: transparent var(--framex-base-color-primary) var(--framex-base-color-primary) transparent;
}
.submenu-indicator.is-active:after {
  transform: rotate(-135deg);
}
@media (min-width: 1024px) {
  .submenu-indicator.is-active:after {
    transform: rotate(45deg);
  }
}

/* NAVIGATION TEXT
================================*/
.navigation-text {
  padding: 11px 0;
  display: inline-block;
  color: var(--framex-base-color-text);
  font-size: 14px;
}
@media (min-width: 1024px) {
  .navigation-text {
    padding: 11px 16px;
  }
}

/* NAVIGATION BADGE
================================*/
.navigation-badge {
  min-width: 18px !important;
  height: 18px;
  margin: 0 5px;
  display: inline-block;
  line-height: 18px;
  text-align: center;
  font-size: 11px;
  color: #ffffff;
  border-radius: 20px;
  background-color: var(--framex-base-color-bg-foreground-light);
}
@media (min-width: 1024px) {
  .navigation-link .navigation-badge {
    position: absolute;
    right: -2px;
    top: calc(50% - 20px);
  }
  .navigation-dropdown-link .navigation-badge {
    position: static;
  }
}

/* NAVIGATION DROPDOWN
================================*/
.navigation-dropdown {
  width: 100%;
  max-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  list-style: none;
  position: static;
  display: block;
  z-index: 20001;
  background-color: var(--framex-base-color-bg-foreground);
  transition: max-height 0.1s cubic-bezier(0, 1, 0, 1);
}
.navigation-dropdown.is-visible {
  max-height: 2500px;
  transition: max-height 0.01s ease-out;
}
@media (min-width: 1024px) {
  .navigation-dropdown {
    width: 300px;
    position: absolute;
    display: inline-block;
    opacity: 0;
    box-shadow: 0 12px 20px -5px rgba(0, 0, 0, 0.05);
    transition: opacity 0.01s linear, max-height 0.01s linear 0.01s;
  }
  .navigation-dropdown.is-visible {
    opacity: 1;
    overflow: visible;
    transition: opacity 0.1s linear, max-height 0.01s linear;
  }
  .navigation-item > .navigation-dropdown {
    box-shadow: inset 0 1px 0 var(--framex-base-color-border), 0 12px 20px -5px rgba(0, 0, 0, 0.05);
  }
}
.navigation-dropdown .navigation-dropdown {
  left: 100%;
}
.navigation-dropdown .navigation-dropdown-left {
  right: 100%;
  left: auto;
}

.navigation-dropdown-item {
  width: 100%;
  margin: 0;
  display: inline-block;
}

.navigation-dropdown-link {
  width: 100%;
  display: inline-block;
  position: relative;
  font-size: 15px;
  color: var(--framex-base-color-text);
  border-bottom: solid 1px var(--framex-base-color-border);
  transition: color 0.01s, background 0.01s;
}
.navigation-dropdown-link:visited {
  color: var(--framex-base-color-text);
}
.navigation-dropdown-item:hover > .navigation-dropdown-link, .navigation-dropdown-item:focus > .navigation-dropdown-link, .navigation-dropdown-item.is-active > .navigation-dropdown-link {
  text-decoration: none !important;
  color: var(--framex-base-color-primary);
  background-color: var(--framex-base-color-bg-hover);
}
.navigation-dropdown-link {
  padding: 14px 19px;
}
.navigation-dropdown-link + ul .navigation-dropdown-link {
  padding-left: 32px;
}
.navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link {
  padding-left: 48px;
}
.navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link {
  padding-left: 48px;
}
.navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link {
  padding-left: 64px;
}
.navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link + ul .navigation-dropdown-link {
  padding-left: 128px;
}
@media (min-width: 1024px) {
  .navigation-dropdown-link {
    padding-left: 19px !important;
    border-bottom: none;
  }
}
.navigation-dropdown-link > .submenu-indicator {
  right: 0;
  top: 0;
  position: absolute;
}
.navigation-dropdown-item:hover > .navigation-dropdown-link > .submenu-indicator:after, .navigation-dropdown-item:focus > .navigation-dropdown-link > .submenu-indicator:after, .navigation-dropdown-item.is-active > .navigation-dropdown-link > .submenu-indicator:after {
  border-color: transparent var(--framex-base-color-primary) var(--framex-base-color-primary) transparent;
}
@media (min-width: 1024px) {
  .navigation-dropdown-link > .submenu-indicator {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }
  .navigation-dropdown-link > .submenu-indicator:after {
    transform: rotate(-45deg);
  }
  .navigation-dropdown-link > .submenu-indicator.submenu-indicator-left:after {
    transform: rotate(135deg);
  }
}

/* NAVIGATION HORIZONTAL DROPDOWN
================================*/
.navigation-dropdown-horizontal {
  background-color: var(--framex-base-color-bg-foreground);
}
@media (min-width: 1024px) {
  .navigation-dropdown-horizontal {
    width: 100% !important;
    left: 0;
  }
  .navigation-dropdown-horizontal .navigation-dropdown-horizontal {
    left: 0;
    top: 100%;
    box-shadow: inset 0 1px 0 var(--framex-base-color-border), 0 12px 20px -5px rgba(0, 0, 0, 0.05);
  }
  .navigation-dropdown-horizontal .navigation-dropdown-item {
    width: auto;
  }
  .navigation-dropdown-horizontal .navigation-dropdown-link {
    padding: 19px 19px;
    display: flex;
  }
  .navigation-dropdown-horizontal .submenu-indicator {
    right: 0px;
    position: relative;
  }
  .navigation-dropdown-horizontal .submenu-indicator:after {
    margin-top: 5px;
    transform: rotate(45deg);
  }
  .navigation-dropdown-horizontal.is-visible {
    display: block;
  }
}

/* MEGAMENU
================================*/
.navigation-megamenu {
  width: 100%;
  max-height: 0;
  overflow: hidden;
  display: block;
  position: static;
  font-size: 14px;
  color: var(--framex-base-color-text);
  z-index: 20001;
  background-color: var(--framex-nav-color-nav-bg-megamenu);
  transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
}
.navigation-megamenu.is-visible {
  max-height: 2500px;
  border-bottom: solid 1px var(--framex-base-color-border);
  transition: max-height 0.5s ease-out;
}
@media (min-width: 1024px) {
  .navigation-megamenu {
    position: absolute;
    opacity: 0;
    border-top: solid 0px transparent;
    box-shadow: inset 0 1px 0 var(--framex-base-color-border), 0 12px 20px -5px rgba(0, 0, 0, 0.05);
    transition: opacity 0.1s linear, max-height 0.1s linear 0.1s;
  }
  .navigation-megamenu.is-visible {
    opacity: 1;
    border-bottom: none;
    transition: opacity 0.1s linear, max-height 0s linear;
  }
  .navigation-megamenu.navigation-megamenu-half {
    width: 50%;
  }
  .navigation-megamenu.navigation-megamenu-quarter {
    width: 25%;
  }
}
.scroll-momentum .navigation-megamenu {
  transform: translateZ(0);
}
@media (min-width: 1024px) {
  .scroll-momentum .navigation-megamenu {
    transform: none;
  }
}
.navigation-megamenu [class*=container] {
  width: 100%;
}
.navigation-megamenu [class*=container] [class*=col-] {
  padding: 0;
}

.navigation-megamenu-container {
  padding: 16px;
  display: table;
}

/* MEGAMENU LIST
================================*/
.navigation-list {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 1024px) {
  [class^=navigation-col]:last-of-type .navigation-list {
    padding: 0;
  }
}
.navigation-list > li {
  width: 100%;
  margin: 0;
}
.navigation-list > li > a {
  padding: 10px 30px 10px 30px;
  display: flex;
  align-items: center;
  position: relative;
  font-size: 14px;
  color: var(--framex-base-color-text);
  text-decoration: none;
  transition: color 0.5s, background 0.5s;
}
.navigation-list > li > a:hover {
  color: var(--framex-base-color-primary);
  background-color: var(--framex-base-color-bg-hover);
}
@media (min-width: 1024px) {
  .navigation-list > li > a {
    border-right: solid 1px var(--framex-base-color-border);
  }
}
[class^=navigation-col]:last-of-type .navigation-list > li > a {
  border-right: none;
}
.navigation-list > li:not(.navigation-list-heading) > a:before {
  content: "◥";
  position: absolute;
  left: 12px;
  font-size: 9px;
  transform: rotate(45deg);
}

.navigation-list-heading {
  text-transform: uppercase;
  font-weight: bold;
}
.navigation-list-heading > a {
  padding: 0 16px 13px !important;
}
.navigation-list-heading > a:hover {
  color: var(--framex-base-color-text) !important;
  background-color: transparent !important;
}

/* NAVIGATION TABS
================================*/
.navigation-tabs {
  width: 100%;
  float: left;
  display: block;
  position: relative;
  background-color: var(--framex-base-color-bg-background);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.07);
}
@media (min-width: 1024px) {
  .navigation-tabs:after {
    content: "";
    width: 80%;
    height: 100%;
    position: absolute;
    right: 0;
    background-color: var(--framex-base-color-bg-hover);
    z-index: 99;
  }
}

.navigation-tabs-nav {
  width: 100%;
  margin: 0;
  padding: 0;
  float: left;
  list-style: none;
}
@media (min-width: 1024px) {
  .navigation-tabs-nav {
    width: 20%;
  }
}
.navigation-tabs-nav > li a {
  width: 100%;
  padding: 14px 16px;
  float: left;
  font-size: 14px;
  text-decoration: none;
  color: var(--framex-base-color-text);
  outline: 0;
  background-color: var(--framex-base-color-bg-background);
  transition: background 0.1s;
}
.navigation-tabs-nav > li.is-active a, .navigation-tabs-nav > li:hover a, .navigation-tabs-nav > li:active a {
  background-color: var(--framex-base-color-bg-hover);
}

.navigation-tabs-pane {
  width: 100%;
  min-height: 30px;
  padding: 16px;
  float: right;
  display: none;
  position: relative;
  opacity: 0;
  font-size: 15px;
  color: var(--framex-base-color-text);
  z-index: 100;
  background-color: var(--framex-base-color-bg-hover);
  transition: opacity 0.1s;
}
.navigation-tabs-pane.is-active {
  display: block;
  opacity: 1;
}
@media (min-width: 1024px) {
  .navigation-tabs-pane {
    width: 80%;
  }
}

/* TRANSPARENT NAVIGATION
 ================================*/
.navigation-transparent {
  background-color: transparent;
}
.navigation-transparent .navigation-header .navigation-brand-text a {
  color: #ffffff;
}
@media (min-width: 1024px) {
  .navigation-transparent .navigation-body .navigation-brand-text a {
    color: #ffffff;
  }
}
.navigation-transparent .navigation-button-toggler .hamburger-icon {
  color: #ffffff;
}
@media (min-width: 1024px) {
  .navigation-transparent .navigation-link {
    color: #ffffff;
  }
  .navigation-transparent .navigation-link > .submenu-indicator:after {
    border-color: transparent #ffffff #ffffff transparent;
  }
  .navigation-transparent .navigation-item:hover > .navigation-link > .submenu-indicator:after,
  .navigation-transparent .navigation-item:focus > .navigation-link > .submenu-indicator:after,
  .navigation-transparent .navigation-item.is-active > .navigation-link > .submenu-indicator:after {
    border-color: transparent #ffffff #ffffff transparent;
  }
  .navigation-transparent .navigation-item:not(.navigation-brand-text):hover .navigation-link,
  .navigation-transparent .navigation-item:not(.navigation-brand-text):focus .navigation-link,
  .navigation-transparent .navigation-item:not(.navigation-brand-text).is-active .navigation-link {
    color: #ffffff;
  }
  .navigation-transparent .navigation-icon-item .navigation-link {
    border-left: none;
  }
}
@media (min-width: 1024px) {
  .navigation-transparent .navigation-input {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.01);
    border-color: rgba(255, 255, 255, 0.05);
  }
  .navigation-transparent .navigation-input ::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.2);
  }
  .navigation-transparent .navigation-input ::-moz-placeholder {
    color: rgba(255, 255, 255, 0.2);
  }
  .navigation-transparent .navigation-input :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.2);
  }
  .navigation-transparent .navigation-input :-moz-placeholder {
    color: rgba(255, 255, 255, 0.2);
  }
}
@media (min-width: 1024px) {
  .navigation-transparent .navigation-social-menu .navigation-link i {
    background-color: rgba(255, 255, 255, 0.05);
  }
}
@media (min-width: 1024px) {
  .navigation-transparent .navigation-item > .navigation-dropdown,
  .navigation-transparent .navigation-megamenu.is-visible {
    border-top-color: transparent;
  }
}

/* NAVIGATION FULLSCREEN
 ================================*/
@media (max-width: 1023px) {
  .navigation-fullscreen .navigation-body {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  .navigation-fullscreen .navigation-body-header {
    border: none;
    padding: 0;
  }
  .navigation-fullscreen .navigation-body-header .navigation-body-close-button,
  .navigation-fullscreen .navigation-body-header .navigation-brand-text,
  .navigation-fullscreen .navigation-body-header .navigation-logo {
    position: absolute;
    top: 20px;
  }
  .navigation-fullscreen .navigation-body-header .navigation-body-close-button {
    right: 20px;
  }
  .navigation-fullscreen .navigation-body-header .navigation-brand-text,
  .navigation-fullscreen .navigation-body-header .navigation-logo {
    left: 20px;
  }
  .navigation-fullscreen .navigation-menu {
    width: 300px;
  }
  .navigation-fullscreen .navigation-link,
  .navigation-fullscreen .navigation-dropdown-link {
    border: none;
  }
  .navigation-fullscreen .navigation-link {
    justify-content: center;
  }
  .navigation-fullscreen .navigation-dropdown-link {
    text-align: center;
  }
  .navigation-fullscreen .navigation-btn {
    width: 300px;
    align-self: center;
  }
  .navigation-fullscreen .navigation-inline-form {
    width: 300px;
    margin: auto;
  }
  .navigation-fullscreen .navigation-inline-form .navigation-btn {
    width: auto;
  }
}
.navigation {
  box-shadow: var(--framex-nav-color-nav-shadow);
}
.navigation.fixed-top {
  background-color: rgba(15, 15, 15, 0.242);
}
.navigation.fixed-top .ai-dot-grid-fill {
  color: #949494 !important;
}
.navigation.sticky-top {
  background-color: var(--framex-base-color-bg-nav);
  transition: background 0.5s;
}
.navigation.bg-active {
  background-color: var(--framex-base-color-bg-nav);
  transition: background 0.5s;
}
.navigation .navigation-list > li > a {
  font-weight: bold;
  border-right: solid 1px var(--framex-border-color);
}
.navigation .nav-noborder.navigation-list > li > a {
  border-right: 0 !important;
}
.navigation .navigation-transparent {
  color: red;
}

.navigation-search-panel {
  width: 100%;
  height: auto;
  position: fixed;
  opacity: 0;
  top: 0;
  left: -100%;
  background: var(--framex-base-color-bg-nav);
  z-index: 999999;
  transition: opacity 0.3s;
}

.navigation-search-panel.is-visible {
  opacity: 1;
  left: 0;
}

.navigation-search-panel form {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.navigation-search-panel input {
  width: 80%;
  padding: 12px;
  font-size: 20px;
  border: none;
  background: var(--framex-form-color-background);
}

.navigation-search-panel-close-button {
  position: absolute;
  font-size: 25px;
  cursor: pointer;
  top: 20px;
  right: 20px;
}

/* UTILITIES
 ================================*/
.align-to-right {
  margin-left: auto !important;
}

.align-to-left {
  margin-right: auto !important;
}

.margin-top {
  margin-top: 1rem !important;
}
@media (min-width: 1024px) {
  .margin-top {
    margin-top: 0 !important;
  }
}

@media (max-width: 1023px) {
  .hide-on-portrait {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  .hide-on-landscape {
    display: none !important;
  }
}

section,
.section {
  padding-block: 2.5rem;
}
section.section--xl,
.section.section--xl {
  padding-block: 5rem;
}
section.section--xxl,
.section.section--xxl {
  padding-block: 7rem;
}

.sidebar {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem;
}
.sidebar > :first-child {
  flex-basis: 18.75rem;
  flex-grow: 1;
}
.sidebar > :last-child {
  flex-basis: 0;
  flex-grow: 999;
  min-inline-size: 50%;
}
.sidebar.reverse {
  flex-direction: row-reverse;
}

.stack > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.stack > * + * {
  margin-block-start: 1.2rem;
}

@media only screen and (max-width: 767.999px) {
  .stack-md-down > * {
    margin-block-end: 0;
    margin-block-start: 0;
  }
  .stack-md-down > * + * {
    margin-block-start: 1.2rem;
  }
}

@media only screen and (max-width: 991.999px) {
  .stack-lg-down > * {
    margin-block-end: 0;
    margin-block-start: 0;
  }
  .stack-lg-down > * + * {
    margin-block-start: 1.2rem;
  }
}

.center {
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: var(--framex-container-inline-size);
  padding-inline: 1.2rem;
}

@media only screen and (max-width: 767.999px) {
  .center-md-down {
    inline-size: 100%;
    margin-inline: auto;
    max-inline-size: var(--framex-container-inline-size);
    padding-inline: 1.2rem;
  }
}

.wrap {
  display: flex;
  flex-wrap: wrap;
}
.wrap.reverse {
  flex-direction: row-reverse;
}

.main-content {
  margin-bottom: 1.2rem;
}
.main-content > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.main-content > * + * {
  margin-block-start: 1.2rem;
}
@media (min-width: 768px) {
  .main-content {
    width: 75%;
    flex-grow: 1;
  }
}

.aside {
  margin-bottom: 1.2rem;
}
.aside > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.aside > * + * {
  margin-block-start: 1.2rem;
}
@media (min-width: 768px) {
  .aside {
    width: 25%;
    flex-grow: 1;
  }
  .aside .stickyInner {
    position: sticky;
    top: 3.7rem;
  }
}

.index-main-content {
  margin-bottom: 1.2rem;
}
.index-main-content > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.index-main-content > * + * {
  margin-block-start: 1.2rem;
}
@media (min-width: 1200px) {
  .index-main-content {
    width: 75%;
    flex-grow: 1;
  }
}

.index-aside {
  margin-bottom: 1.2rem;
}
.index-aside > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.index-aside > * + * {
  margin-block-start: 1.2rem;
}
@media (min-width: 1200px) {
  .index-aside {
    width: 25%;
    flex-grow: 1;
  }
  .index-aside .stickyInner {
    position: sticky;
    top: 5rem;
  }
}

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

.hero {
  position: relative;
  display: flex;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: center;
  align-items: center;
}

.hero-content {
  position: relative;
  padding: 1.2rem;
}
@media only screen and (max-width: 575.999px) {
  .hero-content {
    text-align: center;
  }
}

.hero-purple {
  background-blend-mode: multiply;
  background-color: hsla(258, 89%, 43%, 0.5);
}

.hero-blue {
  background-blend-mode: lighten;
  background-color: hsla(237, 85%, 41%, 0.649);
}

.hero-dark {
  background-blend-mode: multiply;
  background-color: hsla(0, 1%, 14%, 0.116);
}

.hero-yellow {
  background-blend-mode: multiply;
  background-color: hsla(56, 86%, 42%, 0.409);
}

.hero-overlay-1::after {
  background: linear-gradient(to bottom, rgba(20, 20, 20, 0.52), rgba(117, 19, 93, 0.055));
}

.hero-overlay {
  position: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero-overlay::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(30, 34, 40, 0.5);
}

.entry {
  width: 100%;
  color: var(--framex-base-color-text);
  box-shadow: var(--framex-base-color-entry-shadow);
  background: var(--framex-base-color-entry-background);
  padding: 0;
  position: relative;
  overflow: hidden;
}
.entry.entry-link a::after {
  position: absolute;
  inset-block: 0;
  inset-inline: 0;
  cursor: pointer;
  content: "";
}
.entry.reverse {
  flex-direction: row-reverse;
}
.entry.entry-vertical {
  display: flex;
}
.entry.entry-vertical img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 768px) {
  .entry.entry-blog {
    display: flex;
  }
  .entry.entry-blog [data-bg-image] {
    width: 100%;
    min-height: 300px;
  }
  .entry.entry-blog img, .entry.entry-blog img a {
    max-width: 50%;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
@media only screen and (max-width: 767.999px) {
  .entry.entry-blog [data-bg-image] {
    width: 100%;
    height: 400px;
  }
}
.entry.entry-blog .entry-section {
  width: 100%;
}
.entry img {
  max-width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
.entry .title a {
  color: var(--framex-base-color-text);
}
.entry .title a:hover {
  color: var(--framex-base-color-primary);
}
.entry .entry-list {
  color: inherit;
  text-decoration: none;
  display: flex;
  align-items: center;
  padding: 0.75rem 0 0.75rem 0.75rem;
  background-color: transparent;
  border: 1px solid transparent;
}
.entry .entry-list:not(:last-child) {
  border-bottom: 1px solid var(--framex-base-color-border);
}
.entry .entry-list img {
  margin: 0;
  max-width: 5rem;
}
.entry .entry-list .entry-list-content {
  margin-left: 1rem;
  display: flex;
  flex-direction: column;
}
.entry .entry-list .entry-list-title {
  font-size: 1.125em;
  font-weight: 600;
}
.entry .entry-list .entry-list-description {
  margin-top: 0.25em;
  color: #6f7b85;
}
.entry.entry--clean {
  box-shadow: none;
  background-color: transparent;
}
.entry .entry-block {
  padding: 0.5rem 0.6rem;
  background-color: var(--framex-base-color-bg-foreground-light);
  color: var(--framex-base-color-text);
  border-top: 1px solid var(--framex-base-color-border);
  align-items: center;
}
.entry .entry-block-title {
  text-transform: uppercase;
  margin-bottom: 0.375rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: #9ca3af;
  letter-spacing: 0.05em;
}
.entry .entry-block .entry-block-item {
  display: inline-flex;
  margin-right: 0.5rem;
  align-items: center;
  text-decoration: none;
  font-weight: 600;
  border-radius: 6px;
  transition: 0.15s ease;
}
.entry .entry-block .entry-block-item i,
.entry .entry-block .entry-block-item svg {
  margin-right: 5px;
}

.entry-table ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.entry-table li {
  list-style: none;
  padding: 0.4rem 1.2rem !important;
}
.entry-table li + li {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--framex-base-color-border);
}

.entry-section {
  padding: 1.5rem;
}
.entry-section p {
  margin-top: 0;
}
.entry-section p:last-child {
  margin-bottom: 0;
}
.entry-section--border-bottom {
  border-bottom: 1px solid #dedede;
}
.entry-section--border-top {
  border-top: 1px solid #dedede;
}
.entry-section--footer {
  padding: 20px 20px 15px 20px;
}
.entry-section--footer:after {
  display: table;
  content: "";
  clear: both;
}
.entry-section .metas {
  font-size: 14px;
  color: var(--framex-base-color-text);
  letter-spacing: 0.5px;
  margin: 0.6rem 0;
}
.entry-section .metas i {
  color: var(--framex-base-color-primary);
}
.entry-section .metas a {
  text-decoration: none;
}

.entry-title {
  position: relative;
  margin-top: -2.6rem;
  display: flex;
  z-index: 1;
}
.entry-title ::before {
  content: "";
  float: right;
  width: 5%;
  height: 20px;
}
.entry-title ::after {
  content: "";
  background: var(--framex-base-color-entry-background);
  position: absolute;
  top: -9px;
  left: -13px;
  width: 94%;
  height: 100%;
  border-radius: 10px;
  z-index: -1;
}

.img-shape {
  margin: 30px;
  z-index: 1;
  position: relative;
}
.img-shape::before {
  position: absolute;
  left: -31px;
  top: -30px;
  width: 80%;
  height: 90%;
  z-index: -1;
  content: "";
  background-color: red;
  transition: 0.5s;
}
.img-shape::after {
  position: absolute;
  right: -31px;
  bottom: -30px;
  width: 80%;
  height: 90%;
  z-index: -1;
  content: "";
  background-color: #222;
  transition: 0.5s;
}

.entry-image {
  position: relative;
}
.entry-image i {
  color: white;
  font-size: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.ai {
  margin-right: 0.25rem;
}
.ai-2x {
  font-size: 2em;
}
.ai-3x {
  font-size: 3em;
}
.ai-4x {
  font-size: 4em;
}
.ai-5x {
  font-size: 5em;
}
.ai-10x {
  font-size: 10em;
}
.ai-fw {
  width: 1.2857142857em;
  text-align: center;
}
.ai-border {
  padding: 0.2em 0.35em 0.2em;
  border: solid 0.08em var(--framex-base-color-border);
  border-radius: 0.1em;
}

.stickyInner {
  position: sticky;
  top: 5rem;
}

.heading-1 {
  position: relative;
  min-height: 300px;
  text-align: center;
}

.heading-1 span {
  color: #7d0707;
}

.heading-1 h3::before {
  display: block;
  content: "";
  width: 3px;
  height: 6rem;
  background-color: rgba(149, 149, 149, 0.7);
  margin: 0 auto 2.4rem;
}

.lift {
  transform: translateY(0);
  transition: all 0.3s ease;
}

.lift:hover {
  transform: translateY(-0.4rem);
  box-shadow: 0rem 0.25rem 1.25rem rgba(52, 63, 82, 0.1);
}

.btn-primary {
  background-color: var(--framex-btn-color-primary-background);
  border-color: var(--framex-btn-color-primary-background);
  color: var(--framex-btn-color-primary-foreground);
}
.btn-primary:hover {
  background-color: var(--framex-btn-color-primary-background-hover);
  border-color: var(--framex-btn-color-primary-background-hover);
  color: var(--framex-btn-color-primary-foreground);
}
.btn-primary-shadow {
  box-shadow: 0 0.55em 1em -0.2em var(--framex-btn-color-primary-shadow), 0 0.15em 0.35em -0.185em var(--framex-btn-color-primary-shadow);
}

.btn-secondary {
  background-color: var(--framex-btn-color-secondary-background);
  border-color: var(--framex-btn-color-secondary-background);
  color: var(--framex-btn-color-secondary-foreground);
}
.btn-secondary:hover {
  background-color: var(--framex-btn-color-secondary-background-hover);
  border-color: var(--framex-btn-color-secondary-background-hover);
  color: var(--framex-btn-color-secondary-foreground);
}
.btn-secondary-shadow {
  box-shadow: 0 0.55em 1em -0.2em var(--framex-btn-color-secondary-shadow), 0 0.15em 0.35em -0.185em var(--framex-btn-color-secondary-shadow);
}

.btn-dark {
  background-color: var(--framex-btn-color-dark-background);
  border-color: var(--framex-btn-color-dark-background);
  color: var(--framex-btn-color-dark-foreground);
}
.btn-dark:hover {
  background-color: var(--framex-btn-color-dark-background-hover);
  border-color: var(--framex-btn-color-dark-background-hover);
  color: var(--framex-btn-color-dark-foreground);
}
.btn-dark-shadow {
  box-shadow: 0 0.55em 1em -0.2em var(--framex-btn-color-dark-shadow), 0 0.15em 0.35em -0.185em var(--framex-btn-color-dark-shadow);
}

.tw,
.text-white {
  color: hsl(0, 0%, 100%);
}

.tb {
  color: var(--framex-base-color-text);
}

.color {
  color: var(--framex-base-color-primary) !important;
}

.bw {
  background-color: hsl(0, 0%, 100%);
}

.text-muted {
  color: var(--framex-framexcolors-color-ash);
  cursor: not-allowed;
}

.bg-body {
  background-color: var(--framex-base-color-background);
}

.text-primary {
  color: #2563EB;
}

.text-hover-primary:hover {
  color: #2563EB !important;
}

.text-sky {
  color: #60A5FA;
}

.text-hover-sky:hover {
  color: #60A5FA !important;
}

.text-blue {
  color: #3B82F6;
}

.text-hover-blue:hover {
  color: #3B82F6 !important;
}

.text-purple {
  color: #A855F7;
}

.text-hover-purple:hover {
  color: #A855F7 !important;
}

.text-violet {
  color: hsl(298, 69%, 48%);
}

.text-hover-violet:hover {
  color: hsl(298, 69%, 48%) !important;
}

.text-pink {
  color: hsl(0, 91%, 71%);
}

.text-hover-pink:hover {
  color: hsl(0, 91%, 71%) !important;
}

.text-red {
  color: hsl(0, 84%, 60%);
}

.text-hover-red:hover {
  color: hsl(0, 84%, 60%) !important;
}

.text-yellow {
  color: #FACC15;
}

.text-hover-yellow:hover {
  color: #FACC15 !important;
}

.text-orange {
  color: #F97316;
}

.text-hover-orange:hover {
  color: #F97316 !important;
}

.text-green {
  color: #22C55E;
}

.text-hover-green:hover {
  color: #22C55E !important;
}

.text-teal {
  color: hsl(169, 74%, 37%);
}

.text-hover-teal:hover {
  color: hsl(169, 74%, 37%) !important;
}

.text-bordo {
  color: hsl(342, 72%, 31%);
}

.text-hover-bordo:hover {
  color: hsl(342, 72%, 31%) !important;
}

.text-navy {
  color: hsl(12, 6%, 15%);
}

.text-hover-navy:hover {
  color: hsl(12, 6%, 15%) !important;
}

.text-ash {
  color: hsl(216, 12%, 84%);
}

.text-hover-ash:hover {
  color: hsl(216, 12%, 84%) !important;
}

.text-dark {
  color: hsl(215, 28%, 17%);
}

.text-hover-dark:hover {
  color: hsl(215, 28%, 17%) !important;
}

.text-gray-50 {
  color: hsl(180, 11%, 96%);
}

.text-hover-gray-50:hover {
  color: hsl(180, 11%, 96%) !important;
}

.text-gray-100 {
  color: hsl(192, 16%, 94%);
}

.text-hover-gray-100:hover {
  color: hsl(192, 16%, 94%) !important;
}

.text-gray-200 {
  color: hsl(200, 12%, 85%);
}

.text-hover-gray-200:hover {
  color: hsl(200, 12%, 85%) !important;
}

.text-gray-300 {
  color: hsl(201, 11%, 75%);
}

.text-hover-gray-300:hover {
  color: hsl(201, 11%, 75%) !important;
}

.text-gray-400 {
  color: hsl(202, 9%, 58%);
}

.text-hover-gray-400:hover {
  color: hsl(202, 9%, 58%) !important;
}

.text-gray-500 {
  color: hsl(207, 9%, 42%);
}

.text-hover-gray-500:hover {
  color: hsl(207, 9%, 42%) !important;
}

.text-gray-600 {
  color: hsl(209, 15%, 36%);
}

.text-hover-gray-600:hover {
  color: hsl(209, 15%, 36%) !important;
}

.text-gray-700 {
  color: hsl(211, 23%, 28%);
}

.text-hover-gray-700:hover {
  color: hsl(211, 23%, 28%) !important;
}

.text-gray-800 {
  color: hsl(214, 33%, 21%);
}

.text-hover-gray-800:hover {
  color: hsl(214, 33%, 21%) !important;
}

.text-gray-900 {
  color: hsl(217, 46%, 15%);
}

.text-hover-gray-900:hover {
  color: hsl(217, 46%, 15%) !important;
}

.text-gray-950 {
  color: hsl(218, 61%, 8%);
}

.text-hover-gray-950:hover {
  color: hsl(218, 61%, 8%) !important;
}

.bg-gray-50 {
  background-color: hsl(180, 11%, 96%) !important;
}

.bg-hover-gray-50:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(180, 11%, 96%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-100 {
  background-color: hsl(192, 16%, 94%) !important;
}

.bg-hover-gray-100:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(192, 16%, 94%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-200 {
  background-color: hsl(200, 12%, 85%) !important;
}

.bg-hover-gray-200:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(200, 12%, 85%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-300 {
  background-color: hsl(201, 11%, 75%) !important;
}

.bg-hover-gray-300:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(201, 11%, 75%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-400 {
  background-color: hsl(202, 9%, 58%) !important;
}

.bg-hover-gray-400:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(202, 9%, 58%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-500 {
  background-color: hsl(207, 9%, 42%) !important;
}

.bg-hover-gray-500:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(207, 9%, 42%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-600 {
  background-color: hsl(209, 15%, 36%) !important;
}

.bg-hover-gray-600:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(209, 15%, 36%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-700 {
  background-color: hsl(211, 23%, 28%) !important;
}

.bg-hover-gray-700:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(211, 23%, 28%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-800 {
  background-color: hsl(214, 33%, 21%) !important;
}

.bg-hover-gray-800:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(214, 33%, 21%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-900 {
  background-color: hsl(217, 46%, 15%) !important;
}

.bg-hover-gray-900:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(217, 46%, 15%) !important;
  transition: background-color 0.3s ease;
}

.bg-gray-950 {
  background-color: hsl(218, 61%, 8%) !important;
}

.bg-hover-gray-950:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(218, 61%, 8%) !important;
  transition: background-color 0.3s ease;
}

.bg-primary {
  background-color: #2563EB !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-primary:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #2563EB !important;
  transition: background-color 0.5s ease;
}

.bg-soft-primary {
  background-color: #e9effd !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-primary {
  background-color: #b3c8f8 !important;
  background-blend-mode: color-dodge;
}

.bg-sky {
  background-color: #60A5FA !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-sky:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #60A5FA !important;
  transition: background-color 0.5s ease;
}

.bg-soft-sky {
  background-color: #eff6ff !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-sky {
  background-color: #c7e0fd !important;
  background-blend-mode: color-dodge;
}

.bg-blue {
  background-color: #3B82F6 !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-blue:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #3B82F6 !important;
  transition: background-color 0.5s ease;
}

.bg-soft-blue {
  background-color: #ebf3fe !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-blue {
  background-color: #bad3fc !important;
  background-blend-mode: color-dodge;
}

.bg-purple {
  background-color: #A855F7 !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-purple:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #A855F7 !important;
  transition: background-color 0.5s ease;
}

.bg-soft-purple {
  background-color: #f6eefe !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-purple {
  background-color: #e1c4fc !important;
  background-blend-mode: color-dodge;
}

.bg-violet {
  background-color: hsl(298, 69%, 48%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-violet:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(298, 69%, 48%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-violet {
  background-color: #fae9fa !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-violet {
  background-color: #ecb3ee !important;
  background-blend-mode: color-dodge;
}

.bg-pink {
  background-color: hsl(0, 91%, 71%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-pink:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(0, 91%, 71%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-pink {
  background-color: #fef1f1 !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-pink {
  background-color: #fdcece !important;
  background-blend-mode: color-dodge;
}

.bg-red {
  background-color: hsl(0, 84%, 60%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-red:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(0, 84%, 60%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-red {
  background-color: #fdecec !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-red {
  background-color: #f9bdbd !important;
  background-blend-mode: color-dodge;
}

.bg-yellow {
  background-color: #FACC15 !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-yellow:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #FACC15 !important;
  transition: background-color 0.5s ease;
}

.bg-soft-yellow {
  background-color: #fffae8 !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-yellow {
  background-color: #fdedad !important;
  background-blend-mode: color-dodge;
}

.bg-orange {
  background-color: #F97316 !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-orange:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #F97316 !important;
  transition: background-color 0.5s ease;
}

.bg-soft-orange {
  background-color: #fef1e8 !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-orange {
  background-color: #fdcead !important;
  background-blend-mode: color-dodge;
}

.bg-green {
  background-color: #22C55E !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-green:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: #22C55E !important;
  transition: background-color 0.5s ease;
}

.bg-soft-green {
  background-color: #e9f9ef !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-green {
  background-color: #b2ebc7 !important;
  background-blend-mode: color-dodge;
}

.bg-teal {
  background-color: hsl(169, 74%, 37%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-teal:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(169, 74%, 37%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-teal {
  background-color: #e8f6f3 !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-teal {
  background-color: #afdfd6 !important;
  background-blend-mode: color-dodge;
}

.bg-bordo {
  background-color: hsl(342, 72%, 31%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-bordo:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(342, 72%, 31%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-bordo {
  background-color: #f3e8eb !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-bordo {
  background-color: #d5adb9 !important;
  background-blend-mode: color-dodge;
}

.bg-navy {
  background-color: hsl(12, 6%, 15%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-navy:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(12, 6%, 15%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-navy {
  background-color: #eae9e9 !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-navy {
  background-color: #b4b3b2 !important;
  background-blend-mode: color-dodge;
}

.bg-ash {
  background-color: hsl(216, 12%, 84%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-ash:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(216, 12%, 84%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-ash {
  background-color: #fafbfb !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-ash {
  background-color: #eff0f2 !important;
  background-blend-mode: color-dodge;
}

.bg-dark {
  background-color: hsl(215, 28%, 17%) !important;
  color: hsl(0, 0%, 100%) !important;
}

.bg-hover-dark:hover {
  color: hsl(0, 0%, 100%) !important;
  background-color: hsl(215, 28%, 17%) !important;
  transition: background-color 0.5s ease;
}

.bg-soft-dark {
  background-color: #e9eaeb !important;
  color: var(--framex-base-color-text) !important;
}

.bg-pal-dark {
  background-color: #b1b4b9 !important;
  background-blend-mode: color-dodge;
}

.bg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-fixed {
  background-attachment: fixed !important;
}

.bg-svg-1 {
  background: #fff url("data:image/svg+xml,%3Csvg width='1280' height='710' xmlns='http://www.w3.org/2000/svg'%3E %3Cg fill='%231e51c9' fill-rule='evenodd'%3E %3Cpath d='M0 63.354c47.677-2.931 102.14 12.343 163.387 45.822 91.87 50.22 126.954 158.927 248.81 226.016 121.856 67.09 217.644 28.645 324.582 86.582C843.72 479.71 882.997 594 979.392 646.458c64.263 34.971 130.87 56.185 199.821 63.641H0V63.354z'/%3E %3Cpath d='M0 1.393C50.612-3.2 109.835 13.082 177.667 50.234c101.749 55.73 130.439 163.5 265.397 237.95 134.958 74.45 204.648 26.67 323.085 90.963 118.436 64.293 142.832 176.85 249.59 235.062 71.173 38.808 167.927 70.771 290.261 95.89H0V1.393z' opacity='.7'/%3E %3C/g%3E %3C/svg%3E") left bottom/60% no-repeat;
}

.bg-svg-2 {
  background: #fff url("data:image/svg+xml,%3Csvg width='615' height='554' xmlns='http://www.w3.org/2000/svg'%3E %3Cg fill='none' fill-rule='evenodd'%3E %3Cpath d='M463.283 528.726c45.144 0 95.716 8.237 151.717 24.712V0H41.584C28.58 76.038-4.694 126.702.957 203.448c16.342 221.959 215.179 325.278 462.326 325.278z' fill='%239592FB'/%3E %3Cpath d='M382.319 485.092c54.57 14.534 187.124 6.139 232.681-13.977V0H122.36c-16.232 41.585 18.088 107.04 18.088 154.372 0 203.855 45.087 278.309 241.87 330.72z' fill='%238B87FA'/%3E %3Cpath d='M443.883 440.71c54.208 0 128.702-54.567 171.117-81.896V0H231.198c-21.166 38.7-14.497 103.867-14.497 151.086 0 150.221 76.96 289.624 227.182 289.624z' fill='%207F7BFB'/%3E %3C/g%3E %3C/svg%3E") top right no-repeat;
}

.bg-svg-3 {
  background: #fff url("data:image/svg+xml,%3Csvg width='1280' height='433' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M0 0h1280L0 433z' fill='%237F7BFB' fill-rule='evenodd'/%3E %3C/svg%3E ") top/100% no-repeat fixed;
}

.bg-overlay {
  position: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-overlay::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.bg-overlay[data-op="1"]::after {
  opacity: 1 !important;
}

.bg-overlay[data-op="2"]::after {
  opacity: 0.2 !important;
}

.bg-overlay[data-op="3"]::after {
  opacity: 0.3 !important;
}

.bg-overlay[data-op="4"]::after {
  opacity: 0.4 !important;
}

.bg-overlay[data-op="5"]::after {
  opacity: 0.5 !important;
}

.bg-overlay[data-op="6"]::after {
  opacity: 0.6 !important;
}

.bg-overlay[data-op="7"]::after {
  opacity: 0.7 !important;
}

.bg-overlay[data-op="8"]::after {
  opacity: 0.8 !important;
}

.bg-overlay[data-op="9"]::after {
  opacity: 0.9 !important;
}

.bg-overlay[data-style="1"]::after {
  background: hsl(0, 0%, 100%);
}

.bg-overlay[data-style="2"]::after {
  background: #2563EB;
}

.bg-overlay[data-style="3"]::after {
  background: linear-gradient(140deg, #7c1bd6 0%, #31049b 100%);
}

.bg-overlay[data-style="4"]::after {
  background: linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));
}

.bg-overlay[data-style="5"]::after {
  background: radial-gradient(circle at left top, #09c8e6 20%, #2250fc 38%, #5839e4 66%);
}

.bg-overlay[data-style="6"]::after {
  background: radial-gradient(circle at left top, #fe68bb 38%, #4294fa 66%);
}

.bg-overlay[data-style="7"]::after {
  background: radial-gradient(circle at right top, rgb(196, 214, 34) 20%, rgb(147, 216, 57) 38%, #4294fa 66%);
}

.bg-overlay[data-style="8"]::after {
  background: linear-gradient(180deg, #e02b20 0%, #720462 100%);
}

.bg-overlay[data-style="9"]::after {
  background: radial-gradient(circle at center, #00a6c0 0%, #0c71c3 100%);
}

.bg-overlay[data-style="10"]::after {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0.99) 100%);
}

.bg-overlay[data-style="11"]::after {
  background: linear-gradient(90deg, rgb(0, 144, 240) 0%, #5d08e6 100%);
}

.bg-overlay[data-style="12"]::after {
  background: linear-gradient(to bottom, #ba01ff 0, #ff0092 100%);
}

.bg-overlay[data-style="13"]::after {
  background-image: url(../images/bg/overlay.png);
  opacity: 1;
}

.bg-overlay[data-style="14"]::after {
  background-image: url(../images/bg/01.png);
  opacity: 1;
}

.bg-overlay[data-style="15"]::after {
  background-image: url(../images/bg/02.png);
  opacity: 1;
}

.bg-overlay[data-style="16"]::after {
  background-image: url(../images/bg/03.png);
  opacity: 1;
}

.bg-overlay[data-style="17"]::after {
  background-image: url(../images/bg/04.png);
  opacity: 1;
}

.bg-overlay[data-style="18"]::after {
  background-image: url(../images/bg/05.png);
  opacity: 1;
}

.bg-overlay[data-style="19"]::after {
  background-image: url(../images/bg/06.png);
  opacity: 1;
}

.bg-overlay[data-style="20"]::after {
  background-image: url(../images/bg/07.png);
  opacity: 1;
}

.bg-overlay[data-style="21"]::after {
  background-image: url(../images/bg/08.png);
  opacity: 1;
}

.bg-overlay[data-style="22"]::after {
  background-image: url(../images/bg/09.png);
  opacity: 1;
}

.bg-overlay[data-style="100"]::after {
  background: linear-gradient(cyan, transparent), linear-gradient(-45deg, magenta, transparent), linear-gradient(45deg, yellow, transparent);
  background-blend-mode: multiply;
  opacity: 1;
}

.bg-overlay > * {
  position: relative;
  z-index: 1;
}

.bg-gradient-blend {
  background: linear-gradient(160deg, #ffb7b7 9%, #727272 100%), radial-gradient(100% 100% at 30% 10%, #ffd1d1 0%, #260000 100%), linear-gradient(180deg, #00ffff 0%, #ffffff 100%), radial-gradient(100% 100% at 70% 0%, #ff0000 0%, #00ffe0 100%), linear-gradient(280deg, #dbff00 0%, #3300ff 100%);
  background-blend-mode: screen, overlay, color-burn, color-dodge, normal;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#00ffffff", endColorstr="#383838",GradientType=0 ); /* IE6-9 */
}

.body-bg {
  background-image: url("../images/bg/bg-body.svg");
}

/* Block Titles
-----------------------------------------------------------------*/
.title-block {
  padding: 0 15px;
  border-left: 7px solid var(--framex-base-color-primary);
}
.title-block > span {
  display: block;
  margin-top: 4px;
  color: var(--framex-framexcolors-color-ash);
  font-weight: 400;
}
.title-block-right {
  padding: 2px 20px 3px 0;
  border-left: 0;
  border-right: 7px solid var(--framex-base-color-primary);
  text-align: right;
}
.title-block h1 + span {
  font-size: clamp(1.361328125rem, 2vw + 1rem, 1.6015625rem);
}
.title-block h2 + span, .title-block h3 + span {
  font-size: clamp(1.0890625rem, 2vw + 1rem, 1.28125rem);
}
.title-block h4 + span {
  font-size: 1.025rem;
}

.title-block h1,
.title-block h2,
.title-block h3,
.title-block h4 {
  margin-bottom: 0;
}

/* Heading Block - with Subtitle
-----------------------------------------------------------------*/
.heading-block {
  margin-bottom: 50px;
}

.heading-block h1,
.heading-block h2,
.heading-block h3,
.heading-block h4 {
  margin-bottom: 0;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 1px;
  color: var(--framex-base-color-heading);
}

.heading-block > span:not(.before-heading) {
  display: block;
  margin-top: 10px;
  font-weight: 300;
  color: var(--framex-base-color-heading);
}

.heading-block .before-heading {
  margin-bottom: 7px;
}

.heading-block.center > span,
.heading-block.text-center > span,
.center .heading-block > span,
.text-center .heading-block > span {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 768px) {
  .text-md-start .heading-block > span {
    max-width: none !important;
  }
}
.heading-block h1 + span {
  font-size: 1.5rem;
}

.heading-block h2 + span {
  font-size: 1.25rem;
}

.heading-block h3 + span,
.heading-block h4 + span {
  font-size: 1.25rem;
}

.heading-block::after {
  content: "";
  display: block;
  margin-top: 30px;
  width: 40px;
  border-top: 5px solid var(--framex-base-color-primary);
}

.center .heading-block::after,
.text-center .heading-block::after,
.heading-block.center::after,
.heading-block.text-center::after {
  margin: 30px auto 0;
}

@media (min-width: 768px) {
  .text-md-start .heading-block::after {
    margin-left: 0 !important;
  }
}
.heading-block.border-0::after,
.heading-block.border-bottom-0::after {
  display: none;
}

.heading-block.border-color::after {
  border-color: var(--framex-base-color-primary);
}

/*!
 * FlexMasonry
 * Version: 0.2.3
 * Author: Gilbert Pellegrom <gilbert@pellegrom.me>
 * License: MIT
 */
.flexmasonry {
  display: flex;
  flex-flow: column wrap;
  align-content: start;
}

.flexmasonry-item {
  width: 100%;
  padding: 10px;
}

.gallery .flexmasonry-item {
  padding: 2.5px;
}

.flexmasonry-cols-2 .flexmasonry-item {
  width: 50%;
}

.flexmasonry-cols-3 .flexmasonry-item {
  width: 33.333%;
}

.flexmasonry-cols-4 .flexmasonry-item {
  width: 25%;
}

.flexmasonry-cols-5 .flexmasonry-item {
  width: 20%;
}

.flexmasonry-cols-6 .flexmasonry-item {
  width: 16.666%;
}

.flexmasonry-cols-7 .flexmasonry-item {
  width: 14.285%;
}

.flexmasonry-cols-8 .flexmasonry-item {
  width: 12.5%;
}

.flexmasonry-cols-2 .flexmasonry-item:nth-child(2n+1) {
  order: 1;
}

.flexmasonry-cols-2 .flexmasonry-item:nth-child(2n) {
  order: 2;
}

.flexmasonry-cols-3 .flexmasonry-item:nth-child(3n+1) {
  order: 1;
}

.flexmasonry-cols-3 .flexmasonry-item:nth-child(3n+2) {
  order: 2;
}

.flexmasonry-cols-3 .flexmasonry-item:nth-child(3n) {
  order: 3;
}

.flexmasonry-cols-4 .flexmasonry-item:nth-child(4n+1) {
  order: 1;
}

.flexmasonry-cols-4 .flexmasonry-item:nth-child(4n+2) {
  order: 2;
}

.flexmasonry-cols-4 .flexmasonry-item:nth-child(4n+3) {
  order: 3;
}

.flexmasonry-cols-4 .flexmasonry-item:nth-child(4n) {
  order: 4;
}

.flexmasonry-cols-5 .flexmasonry-item:nth-child(5n+1) {
  order: 1;
}

.flexmasonry-cols-5 .flexmasonry-item:nth-child(5n+2) {
  order: 2;
}

.flexmasonry-cols-5 .flexmasonry-item:nth-child(5n+3) {
  order: 3;
}

.flexmasonry-cols-5 .flexmasonry-item:nth-child(5n+4) {
  order: 4;
}

.flexmasonry-cols-5 .flexmasonry-item:nth-child(5n) {
  order: 5;
}

.flexmasonry-cols-6 .flexmasonry-item:nth-child(6n+1) {
  order: 1;
}

.flexmasonry-cols-6 .flexmasonry-item:nth-child(6n+2) {
  order: 2;
}

.flexmasonry-cols-6 .flexmasonry-item:nth-child(6n+3) {
  order: 3;
}

.flexmasonry-cols-6 .flexmasonry-item:nth-child(6n+4) {
  order: 4;
}

.flexmasonry-cols-6 .flexmasonry-item:nth-child(6n+5) {
  order: 5;
}

.flexmasonry-cols-6 .flexmasonry-item:nth-child(6n) {
  order: 6;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n+1) {
  order: 1;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n+2) {
  order: 2;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n+3) {
  order: 3;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n+4) {
  order: 4;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n+5) {
  order: 5;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n+6) {
  order: 6;
}

.flexmasonry-cols-7 .flexmasonry-item:nth-child(7n) {
  order: 7;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+1) {
  order: 1;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+2) {
  order: 2;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+3) {
  order: 3;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+4) {
  order: 4;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+5) {
  order: 5;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+6) {
  order: 6;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n+7) {
  order: 7;
}

.flexmasonry-cols-8 .flexmasonry-item:nth-child(8n) {
  order: 8;
}

.flexmasonry-break {
  content: "";
  flex-basis: 100%;
  width: 0 !important;
  margin: 0;
}

.flexmasonry-break-1 {
  order: 1;
}

.flexmasonry-break-2 {
  order: 2;
}

.flexmasonry-break-3 {
  order: 3;
}

.flexmasonry-break-4 {
  order: 4;
}

.flexmasonry-break-5 {
  order: 5;
}

.flexmasonry-break-6 {
  order: 6;
}

.flexmasonry-break-7 {
  order: 7;
}

.grid-gallery {
  -moz-columns: 3 300px;
       columns: 3 300px;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  margin: 0 auto;
}
.grid-gallery img {
  margin: 0 1rem 1rem 0;
  border-radius: 5px;
}

details div {
  border-left: 1px solid var(--framex-base-color-border);
  border-right: 1px solid var(--framex-base-color-border);
  border-bottom: 1px solid var(--framex-base-color-border);
  padding: 1rem;
}

details div div {
  border: 0;
  padding: 0;
}
details div div p {
  padding-top: 0;
}

details + details {
  margin-top: 0.5rem;
}

summary::-webkit-details-marker {
  display: none;
}

summary {
  border-radius: 0.25rem;
  padding: 0.75em 1em;
  cursor: pointer;
  position: relative;
  padding-left: 3.25rem;
  background-color: var(--framex-base-color-bg-foreground);
  list-style: none;
  font-weight: 700;
  transition: background-color 0.3s ease; /* Add transition for background color */
  box-shadow: 0 0 0 0.05rem rgba(8, 60, 130, 0.06), 0rem 0rem 1.25rem rgba(30, 34, 40, 0.04);
}

summary:before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0.75rem;
  font-size: 14px;
  content: "🟢";
  width: 1.75rem;
  height: 1.75rem;
  color: #FFF;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

details[open] summary {
  background-color: var(--framex-base-color-bg-foreground-light);
  transition: background-color 0.3s ease; /* Add transition for background color */
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

details[open] summary:before {
  font-size: 14px;
  content: "❌";
}

summary:hover {
  background-color: var(--framex-base-color-bg-foreground);
  transition: background-color 0.3s ease; /* Add transition for background color */
}

/* Add transition for max-height to create the accordion effect */
details[open] div {
  max-height: 1000px;
  background-color: var(--framex-base-color-bg-foreground);
}

/* Set the initial max-height for closed accordions */
details:not([open]) div {
  max-height: 0;
}

.avatar {
  font-size: 1.5rem;
  height: 3rem;
  width: 3rem;
  background: var(--framex-base-color-light);
  border-radius: 50%;
  color: var(--framex-base-color-ash);
  display: inline-block;
  font-weight: 300;
  line-height: 1.25;
  margin: 0;
  position: relative;
  vertical-align: middle;
}
.avatar.avatar-xs {
  font-size: 0.8rem;
  height: 1.6rem;
  width: 1.6rem;
}
.avatar.avatar-sm {
  font-size: 2rem;
  height: 4rem;
  width: 4rem;
}
.avatar.avatar-lg {
  font-size: 3rem;
  height: 6rem;
  width: 6rem;
}
.avatar.avatar-xl {
  font-size: 4rem;
  height: 8rem;
  width: 8rem;
}
.avatar img {
  border-radius: 50%;
  height: 100%;
  position: relative;
  width: 100%;
  z-index: 0;
}
.avatar .avatar-icon,
.avatar .avatar-presence {
  background: var(--framex-base-color-ash);
  bottom: 14.64%;
  height: 50%;
  padding: 0.1rem;
  position: absolute;
  right: 14.64%;
  transform: translate(50%, 50%);
  width: 50%;
  z-index: 1;
}
.avatar .avatar-presence {
  background: var(--framex-base-color-ash);
  box-shadow: 0 0 0 0.1rem #ccc;
  border-radius: 50%;
  height: 0.5em;
  width: 0.5em;
}
.avatar .avatar-presence.online {
  background: hsl(150, 100%, 33%);
}
.avatar .avatar-presence.busy {
  background: hsl(0, 71%, 51%);
}
.avatar .avatar-presence.away {
  background: var(--framex-base-color-white);
}
.avatar[data-initial]::before {
  color: currentColor;
  content: attr(data-initial);
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.breadcrumb-list {
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
  display: flex;
  max-inline-size: 100%;
  overflow-x: auto;
  white-space: nowrap;
}
.breadcrumb-list > li {
  align-items: center;
  display: inline-flex;
  margin-block: 0;
}
.breadcrumb-list > li + li::before {
  block-size: 0.4em;
  border-block-end: 2px solid var(--framex-breadcrumb-color-separator);
  border-inline-end: 2px solid var(--framex-breadcrumb-color-separator);
  content: "";
  display: inline-flex;
  inline-size: 0.4em;
  margin-inline: 0.75em;
  transform: rotate(-45deg);
}
[dir=rtl] .breadcrumb-list > li + li::before {
  transform: rotate(45deg);
}

.breadcrumb-list [aria-current=page] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  max-inline-size: 20ch;
  text-align: start;
}

.framex-slider {
  position: relative;
  display: block;
  width: 100%;
  --framex-slider-snap-align: center;
  --framex-slider-item-width: 100%;
  --framex-slider-item-gap: 1rem;
  --framex-slider-item-reveal: 0rem;
  --framex-slider-item-ratio: 2/1;
  --framex-slider-item-count: 1;
  --framex-slider-nav-light: #fff;
  --framex-slider-nav-dark: #333;
  --framex-slider-nav-zoom: 1;
  --framex-slider-track-opacity: 0.1;
  --framex-slider-track-height: 0;
  --framex-slider-nav-outside-size: 3.5rem;
  --framex-slider-indicator-outside-size: 1.5rem;
  --framex-slider-animation-duration: 0.75s;
  --framex-slider-animation-delay: 0s;
  --framex-slider-animation-timing: ease-in-out;
}

.framex-slider,
.framex-slider::after,
.framex-slider::before {
  box-sizing: border-box;
}

.framex-slider ::-webkit-scrollbar {
  height: var(--framex-slider-track-height);
}

.framex-slider ::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, var(--framex-slider-track-opacity));
}

.framex-slider ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.4);
  border-radius: 1rem;
}

.framex-slider ::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.6);
}

.slider-container {
  --framex-slider-item-gap-totalwidth: calc(
    var(--framex-slider-item-gap) * (var(--framex-slider-item-count) - 1)
  );
  --framex-slider-item-width: calc(
    (
        100% - var(--framex-slider-item-reveal) -
          var(--framex-slider-item-gap-totalwidth)
      ) / var(--framex-slider-item-count)
  );
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  display: grid;
  align-items: center;
  height: 100%;
  grid: auto/auto-flow max-content;
  grid-auto-rows: 100%;
  grid-auto-columns: var(--framex-slider-item-width);
  grid-auto-flow: column;
  grid-gap: var(--framex-slider-item-gap);
  list-style: none;
  margin: 0;
  padding: 0;
  scrollbar-width: none;
  scrollbar-color: rgba(0, 0, 0, 0.4) rgba(0, 0, 0, var(--framex-slider-track-opacity));
  background-clip: padding-box;
}

.slider-container > * {
  scroll-snap-align: var(--framex-slider-snap-align);
  position: relative;
  width: 100%;
  height: 100%;
}

.slider-item-helper .slider-container > * {
  background-size: cover;
  background-color: #e1e1e1;
  background-position: 50% 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.slider-item-helper:not(.slider-item-ratio) .slider-container > * {
  min-height: 20rem;
}

.slider-item-ratio .slider-container > * > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.slider-item-ratio-contain .slider-container > * > * {
  -o-object-fit: contain;
  object-fit: contain;
}

.slider-item-ratio .slider-container > ::after {
  display: block;
  padding-top: calc(100% / (var(--framex-slider-item-ratio)));
  content: "";
}

.slider-item-ratio-32x9 {
  --framex-slider-item-ratio: 32/9;
}

.slider-item-ratio-21x9 {
  --framex-slider-item-ratio: 21/9;
}

.slider-item-ratio-16x9 {
  --framex-slider-item-ratio: 16/9;
}

.slider-item-ratio-4x3 {
  --framex-slider-item-ratio: 4/3;
}

.slider-item-ratio-2x1 {
  --framex-slider-item-ratio: 2/1;
}

.slider-item-ratio-1x1 {
  --framex-slider-item-ratio: 1/1;
}

.slider-item-ratio-3x4 {
  --framex-slider-item-ratio: 3/4;
}

.slider-nav-scrollbar {
  --framex-slider-track-height: 0.5rem;
}

.slider-nav-scrollbar .slider-container {
  scrollbar-width: thin;
}

.slider-nav-nodelay .slider-container {
  scroll-behavior: auto;
}

.slider-indicators {
  position: absolute;
  right: 2rem;
  bottom: 0;
  left: 2rem;
  display: flex;
  justify-content: center;
  padding: 0;
  margin-bottom: 1rem;
  list-style: none;
}

.slider-nav-scrollbar .slider-indicators {
  margin-bottom: calc(1rem + var(--framex-slider-track-height));
}

.slider-indicators > .active {
  opacity: 1;
}

.framex-slider.slider-indicators-outside .slider-nav {
  margin-bottom: var(--framex-slider-indicator-outside-size);
}

.framex-slider.slider-indicators-outside {
  padding-bottom: var(--framex-slider-indicator-outside-size);
}

.framex-slider.slider-indicators-outside .slider-indicators,
.framex-slider.slider-indicators-outside.slider-indicators {
  margin-bottom: 0;
}

.slider-indicators > * {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 2rem;
  height: 0.2rem;
  padding: 0;
  border: 0.4rem solid transparent;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  opacity: 0.5;
  transition: opacity 0.4s ease;
}

.slider-indicators-square .slider-indicators > *,
.slider-indicators-square.slider-indicators > * {
  width: 0.5rem;
  height: 0.5rem;
  border: 0.4rem solid transparent;
}

.slider-indicators-round .slider-indicators > *,
.slider-indicators-round.slider-indicators > * {
  width: 0.5rem;
  height: 0.5rem;
  border: 0.4rem solid transparent;
  border-radius: 50%;
}

.slider-indicators-highlight .slider-indicators > .active,
.slider-indicators-highlight.slider-indicators > .active {
  border: 0.33rem solid transparent;
  padding: 0.07rem;
}

.slider-nav {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  border: 0;
  background-color: transparent;
  cursor: pointer;
  padding: 0;
  visibility: hidden;
  opacity: 0.8;
  transition: visibility 0.1s, opacity 0.2s linear;
  margin-bottom: var(--framex-slider-track-height);
  display: flex;
  align-items: center;
  padding: 0 0.5rem;
  filter: drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.5));
  transform: scale(var(--framex-slider-nav-zoom));
}

.slider-nav::before {
  position: absolute;
  content: "";
  padding: 0.5rem;
  width: 3rem;
  height: 3rem;
}

.slider-nav::after {
  content: "";
  -webkit-mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'></path></svg>");
  mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'></path></svg>");
  -webkit-mask-size: cover;
  mask-size: cover;
  background-color: var(--framex-slider-nav-light);
  background-origin: content-box;
  width: 3rem;
  height: 3rem;
}

.slider-nav-arrow .slider-nav::after {
  -webkit-mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5z'></path></svg>");
  mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5z'></path></svg>");
}

.slider-nav-chevron .slider-nav::after {
  -webkit-mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M9.224 1.553a.5.5 0 0 1 .223.67L6.56 8l2.888 5.776a.5.5 0 1 1-.894.448l-3-6a.5.5 0 0 1 0-.448l3-6a.5.5 0 0 1 .67-.223z'></path></svg>");
  mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M9.224 1.553a.5.5 0 0 1 .223.67L6.56 8l2.888 5.776a.5.5 0 1 1-.894.448l-3-6a.5.5 0 0 1 0-.448l3-6a.5.5 0 0 1 .67-.223z'></path></svg>");
}

.slider-nav-caret .slider-nav::after {
  -webkit-mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path d='M10 12.796V3.204L4.519 8 10 12.796zm-.659.753-5.48-4.796a1 1 0 0 1 0-1.506l5.48-4.796A1 1 0 0 1 11 3.204v9.592a1 1 0 0 1-1.659.753z'></path></svg>");
  mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path d='M10 12.796V3.204L4.519 8 10 12.796zm-.659.753-5.48-4.796a1 1 0 0 1 0-1.506l5.48-4.796A1 1 0 0 1 11 3.204v9.592a1 1 0 0 1-1.659.753z'></path></svg>");
}

.slider-nav-caretfill .slider-nav::after {
  -webkit-mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path d='m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z'></path></svg>");
  mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'><path d='m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z'></path></svg>");
}

.framex-slider:hover .slider-nav {
  visibility: visible;
}

.framex-slider.slider-nav-autohide.slider-item-first-visible .slider-nav:not(.slider-nav-next) {
  visibility: hidden;
}

.framex-slider.slider-nav-autohide.slider-item-last-visible .slider-nav.slider-nav-next {
  visibility: hidden;
}

.slider-nav-outside .slider-container {
  margin: 0 var(--framex-slider-nav-outside-size);
}

.slider-nav-outside .slider-nav {
  padding: 0;
}

.framex-slider .slider-nav:hover {
  opacity: 1;
}

.slider-nav-square .slider-nav {
  padding: 0;
}

.slider-nav-round .slider-nav::before,
.slider-nav-square .slider-nav::before {
  background-color: var(--framex-slider-nav-light);
}

.slider-nav-round .slider-nav::after,
.slider-nav-square .slider-nav::after {
  background-color: var(--framex-slider-nav-dark);
  width: 2rem;
  height: 2rem;
  margin: 0.5rem;
}

.slider-nav-round .slider-nav::before {
  border-radius: 50%;
}

.slider-nav-round .slider-nav::after {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' %3E%3Cpath fill-rule='evenodd' d='M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z'%3E%3C/path%3E%3C/svg%3E");
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' %3E%3Cpath fill-rule='evenodd' d='M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z'%3E%3C/path%3E%3C/svg%3E");
}

.slider-nav-dark .slider-nav::after {
  background-color: var(--framex-slider-nav-dark);
}

.slider-nav-dark.slider-nav-round .slider-nav::before,
.slider-nav-dark.slider-nav-square .slider-nav::before {
  background-color: var(--framex-slider-nav-dark);
}

.slider-nav-dark.slider-nav-round .slider-nav::after,
.slider-nav-dark.slider-nav-square .slider-nav::after {
  background-color: var(--framex-slider-nav-light);
}

.slider-nav-sm {
  --framex-slider-nav-zoom: 0.75;
  --framex-slider-nav-outside-size: 2.5rem;
}

.slider-nav.slider-nav-next::after {
  transform: rotate(180deg);
}

.slider-nav.slider-nav-next {
  right: 0;
  left: unset;
}

.slider-nav-visible .slider-nav {
  visibility: visible;
}

.slider-nav-dark .slider-nav {
  opacity: 0.6;
}

.slider-indicators-dark .slider-indicators > *,
.slider-indicators-dark.slider-indicators > * {
  filter: invert(1);
}

.slider-item-snapstart {
  --framex-slider-snap-align: start;
}

.slider-item-nosnap {
  --framex-slider-snap-align: unset;
}

.slider-item-nogap {
  --framex-slider-item-gap: 0rem;
}

.slider-item-reveal {
  --framex-slider-item-reveal: 8rem;
}

.slider-item-snapstart.slider-item-reveal {
  --framex-slider-item-reveal: 4rem;
}

.slider-item-show2 {
  --framex-slider-item-count: 2;
}

.slider-item-show3 {
  --framex-slider-item-count: 3;
}

.slider-item-show4 {
  --framex-slider-item-count: 4;
}

.slider-item-show5 {
  --framex-slider-item-count: 5;
}

.slider-item-show6 {
  --framex-slider-item-count: 6;
}

.slider-nav-mousedrag .slider-container {
  cursor: grab;
}

.slider-nav-mousedrag.dragging .slider-container {
  scroll-snap-type: unset;
  scroll-behavior: unset;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.slider-nav-mousedrag.dragging .slider-nav {
  visibility: hidden;
}

@media (hover: hover) {
  .slider-nav-mousedrag .slider-container::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .slider-nav-animation.slider-nav-animation-fast {
    --framex-slider-animation-duration: 0.25s;
  }
  .slider-nav-animation.slider-nav-animation-slow {
    --framex-slider-animation-duration: 1.25s;
  }
  .slider-nav-animation .slider-container > * > * {
    transition: opacity var(--framex-slider-animation-duration) var(--framex-slider-animation-timing), transform var(--framex-slider-animation-duration) var(--framex-slider-animation-timing);
    transition-delay: var(--framex-slider-animation-delay);
  }
  .slider-nav-animation .slider-container .slide-visible > * {
    transition: opacity var(--framex-slider-animation-duration) var(--framex-slider-animation-timing), transform var(--framex-slider-animation-duration) var(--framex-slider-animation-timing);
    transition-delay: var(--framex-slider-animation-delay);
  }
  .slider-nav-animation.slider-nav-animation-fadein .slider-container > * > * {
    opacity: 0.5;
  }
  .slider-nav-animation.slider-nav-animation-scale .slider-container > * > * {
    transform: scale(0.9);
  }
  .slider-nav-animation.slider-nav-animation-appear .slider-container > * > * {
    opacity: 0.3;
    transform: scale(0.9);
  }
  .slider-nav-animation.slider-nav-animation-scaleup .slider-container > * > * {
    transform: scale(0.25);
  }
  .slider-nav-animation.slider-nav-animation-zoomout .slider-container > * {
    overflow: hidden;
  }
  .slider-nav-animation.slider-nav-animation-zoomout .slider-container > * > * {
    transform: scale(1.3);
  }
  .slider-nav-animation.slider-nav-animation-turn .slider-container > * > * {
    transform: rotateY(70deg);
  }
  .slider-nav-animation.slider-nav-animation-slideup .slider-container > * > * {
    transform: translateY(60%) scale(0.99);
  }
  .slider-nav-animation.slider-nav-animation-slideup .slider-container {
    overflow-y: hidden;
  }
  .slider-nav-animation .slider-container > .slide-visible > * {
    opacity: 1;
    transform: none;
  }
}
@media (min-width: 62rem) {
  .slider-item-show2:not(.slider-item-snapstart) .slider-container > *,
  .slider-item-show4:not(.slider-item-snapstart) .slider-container > *,
  .slider-item-show6:not(.slider-item-snapstart) .slider-container > * {
    scroll-snap-align: unset;
  }
  .slider-item-show2:not(.slider-item-snapstart) .slider-container > ::before,
  .slider-item-show4:not(.slider-item-snapstart) .slider-container > ::before,
  .slider-item-show6:not(.slider-item-snapstart) .slider-container > ::before {
    content: " ";
    display: block;
    position: absolute;
    left: calc(var(--framex-slider-item-gap) / 2 * -1);
    top: 0;
    width: 1px;
    height: 1px;
    scroll-snap-align: var(--framex-slider-snap-align);
  }
  .slider-nav-outside-expand .slider-nav {
    margin-left: -4rem;
  }
  .slider-nav-outside-expand .slider-nav.slider-nav-next {
    margin-right: -4rem;
  }
  .slider-nav-sm.slider-nav-outside-expand .slider-nav {
    margin-left: -3.5rem;
  }
  .slider-nav-sm.slider-nav-outside-expand .slider-nav.slider-nav-next {
    margin-right: -3.5rem;
  }
  .slider-indicators-sm.slider-indicators {
    display: none;
  }
}
@media (max-width: 62rem) {
  .framex-slider {
    --framex-slider-track-height: 0rem;
    --framex-slider-item-reveal: 0rem;
    --framex-slider-item-count: 1;
    --framex-slider-nav-zoom: 0.875;
  }
  .framex-slider .slider-item-show2-sm {
    --framex-slider-item-count: 2;
  }
  .slider-item-reveal {
    --framex-slider-item-reveal: 4rem;
  }
  .slider-item-snapstart.slider-item-reveal {
    --framex-slider-item-reveal: 2rem;
  }
  .slider-item-show6 .slider-container {
    grid-auto-columns: calc(25% - var(--framex-slider-item-gap) / 4 * 3);
  }
  .slider-item-show6.slider-item-reveal .slider-container {
    grid-auto-columns: calc(25% - var(--framex-slider-item-gap) / 4 * 3 - 0.5rem);
  }
  .slider-item-show6.slider-item-reveal .slider-container > * {
    scroll-snap-align: unset;
  }
  .slider-item-show6.slider-item-reveal .slider-container > ::before {
    content: " ";
    display: block;
    position: absolute;
    left: calc(var(--framex-slider-item-gap) / 2 * -1);
    top: 0;
    width: 1px;
    height: 1px;
    scroll-snap-align: center;
  }
  .slider-nav::after,
  .slider-nav::before {
    width: 2rem;
    height: 2rem;
    padding: 0.3rem;
  }
  .slider-nav-round .slider-nav::after,
  .slider-nav-square .slider-nav::after {
    width: 1.75rem;
    height: 1.75rem;
    margin: 0.125rem;
  }
  .slider-nav-outside .slider-container,
  .slider-nav-outside-expand .slider-container {
    margin: 0 2rem;
  }
  .slider-nav-outside-expand .slider-container {
    margin: 0 var(--framex-slider-nav-outside-size);
  }
  .slider-nav-outside-expand .slider-nav {
    padding: 0;
  }
  .slider-indicators-round .slider-indicators > *,
  .slider-indicators-round.slider-indicators > *,
  .slider-indicators-square .slider-indicators > *,
  .slider-indicators-square.slider-indicators > * {
    width: 0.3rem;
    height: 0.3rem;
  }
  .slider-indicators {
    margin-bottom: 0.5rem;
    display: none;
  }
  .slider-nav-scrollbar .slider-indicators {
    margin-bottom: 0;
  }
  .slider-indicators > * {
    width: 1rem;
    height: 0.125rem;
    border-width: 0.25rem;
  }
  .slider-indicators-sm .slider-indicators,
  .slider-indicators-sm.slider-indicators {
    display: flex;
  }
}
@media (max-width: 48rem) {
  .slider-item-show6 .slider-container {
    grid-auto-columns: calc(50% - var(--framex-slider-item-gap) / 2);
  }
  .slider-item-show6.slider-item-reveal .slider-container {
    grid-auto-columns: calc(50% - var(--framex-slider-item-gap) / 2 - 1.5rem);
  }
}
@media (hover: none) {
  .framex-slider.slider-nav-touch .slider-nav {
    visibility: visible;
  }
  .framex-slider:not(.slider-nav-touch).slider-nav-outside .slider-container,
  .framex-slider:not(.slider-nav-touch).slider-nav-outside-expand .slider-container {
    margin: 0 0;
  }
  .slider-item-nosnap-touch {
    --framex-slider-snap-align: unset;
  }
}

.post-heading {
  text-align: center;
}
.post-heading__inner {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: center;
}
.post-heading__title {
  font-size: clamp(2.25rem, 5vw + 1rem, 4.5rem);
  margin-block: 0;
}
.post-heading__meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.2rem;
  justify-content: center;
  margin-block-start: clamp(1.2rem, 5vw, 2.5rem);
}

.post-content > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.post-content > * + * {
  margin-block-start: 1.2rem;
}
@media (min-width: 768px) {
  .post-content {
    font-size: 1.0375rem;
  }
}
.post-content :is(dd, dl, dl, h1, h2, h3, h4, h5, h6, hr, ul, ol, p, blockquote) {
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: 50rem;
}
.post-content * + h2,
.post-content * + h3 {
  margin-block-start: 2.5rem;
}
.post-content h2 + *,
.post-content h3 + *,
.post-content h4 + *,
.post-content h5 + *,
.post-content h6 + * {
  margin-block-start: 1rem;
}
.post-content img,
.post-content iframe {
  border-radius: var(--framex-border-radius-sm);
  filter: drop-shadow(0 0 0.75rem rgba(56, 56, 56, 0.24));
}
.post-content iframe {
  aspect-ratio: 16/9;
}

.pagination__page-number {
  --framex-border-radius: 5px;
  --framex-border-width: 1px;
  --framex-font-size: 1rem;
  --framex-font-weight: 500;
  --framex-gap: spacer("xs");
  --framex-icon-padding: 0.75em;
  --framex-icon-size: 1em;
  --framex-padding: 0.75em 1em;
  --framex-shadow-size: 0.25rem;
  align-items: center;
  border-radius: var(--framex-border-radius);
  border-style: solid;
  border-width: var(--framex-border-width);
  cursor: pointer;
  display: inline-flex;
  font-size: var(--framex-font-size);
  font-weight: var(--framex-font-weight);
  gap: var(--framex-gap);
  justify-content: center;
  line-height: 1;
  padding: var(--framex-padding);
  text-align: start;
  text-decoration: none;
  transition-duration: var(--framex-duration);
  transition-property: background-color, border-color, box-shadow, color;
  transition-timing-function: var(--framex-timing-function);
}

.pagination__page-number:focus {
  outline-color: transparent;
  outline-style: solid;
}

.pagination__page-number:disabled {
  opacity: 0.5;
  pointer-events: none;
}

.pagination__page-number--sm {
  --framex-font-size: 0.8rem;
  --framex-gap: spacer("xxs");
  --framex-icon-padding: 0.5em;
  --framex-icon-size: 0.8rem;
  --framex-padding: 0.5em 0.75em;
  font-size: var(--framex-font-size);
  gap: var(--framex-gap);
  padding: var(--framex-padding);
}

.pagination__page-number--lg {
  --framex-font-size: 1.15rem;
  --framex-gap: spacer("xs");
  --framex-icon-padding: 0.9em;
  --framex-padding: 0.9em 1.15em;
}

.pagination__page-number--block {
  inline-size: 100%;
}

.pagination {
  display: flex;
  justify-content: center;
}
.pagination__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.pagination__links > * + * {
  margin-block-start: 0;
}
.pagination__page-number {
  background-color: var(--framex-btn-color-pagination-background);
  border-color: var(--framex-btn-color-pagination-background);
  color: var(--framex-btn-color-pagination-foreground);
}
.pagination__page-number:hover {
  background-color: var(--framex-btn-color-pagination-background-hover);
  border-color: var(--framex-btn-color-pagination-background-hover);
  color: var(--framex-btn-color-pagination-foreground-hover);
}
.pagination__page-number--current {
  background: var(--framex-btn-color-pagination-background-hover);
  border-color: var(--framex-btn-color-pagination-background-hover);
  color: var(--framex-btn-color-pagination-foreground-hover);
}
.pagination__page-number--sm {
  min-inline-size: 1.75rem;
}

.glightbox-container {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999999 !important;
  overflow: hidden;
  touch-action: none;
  backface-visibility: hidden;
  outline: none;
}

.glightbox-container.inactive {
  display: none;
}

.glightbox-container .gcontainer {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 9999;
  overflow: hidden;
}

.glightbox-container .gslider {
  transition: transform 0.4s ease;
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  position: relative;
  overflow: hidden;
  display: flex !important;
  justify-content: center;
  align-items: center;
  transform: translate3d(0, 0, 0);
}

.glightbox-container .gslide {
  width: 100%;
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
}

.glightbox-container .gslide.current {
  opacity: 1;
  z-index: 99999;
  position: relative;
}

.glightbox-container .gslide.prev {
  opacity: 1;
  z-index: 9999;
}

.glightbox-container .gslide-inner-content {
  width: 100%;
}

.glightbox-container .ginner-container {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  max-width: 100%;
  margin: auto;
  height: 100vh;
}

.glightbox-container .ginner-container.gvideo-container {
  width: 100%;
}

.glightbox-container .ginner-container.desc-bottom,
.glightbox-container .ginner-container.desc-top {
  flex-direction: column;
}

.glightbox-container .ginner-container.desc-left,
.glightbox-container .ginner-container.desc-right {
  max-width: 100% !important;
}

.gslide iframe,
.gslide video {
  outline: none !important;
  border: none;
  min-height: 165px;
  -webkit-overflow-scrolling: touch;
  touch-action: auto;
}

.gslide:not(.current) {
  pointer-events: none;
}

.gslide-image {
  align-items: center;
}

.gslide-image img {
  max-height: 100vh;
  display: block;
  padding: 0;
  float: none;
  outline: none;
  border: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  max-width: 100vw;
  width: auto;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  touch-action: none;
  margin: auto;
  min-width: 200px;
}

.desc-top .gslide-image img,
.desc-bottom .gslide-image img {
  width: auto;
}

.desc-left .gslide-image img,
.desc-right .gslide-image img {
  width: auto;
  max-width: 100%;
}

.gslide-image img.zoomable {
  position: relative;
}

.gslide-image img.dragging {
  cursor: grabbing !important;
  transition: none;
}

.gslide-video {
  position: relative;
  max-width: 100vh;
  width: 100% !important;
}

.gslide-video .gvideo-wrapper {
  width: 100%;
  /* max-width: 160vmin; */
  margin: auto;
}

.gslide-video::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 0, 0, 0.34);
  display: none;
}

.gslide-video.playing::before {
  display: none;
}

.gslide-video.fullscreen {
  max-width: 100% !important;
  min-width: 100%;
  height: 75vh;
}

.gslide-video.fullscreen video {
  max-width: 100% !important;
  width: 100% !important;
}

.gslide-inline {
  background: #fff;
  text-align: left;
  max-height: calc(100vh - 40px);
  overflow: auto;
  max-width: 100%;
  margin: auto;
}

.gslide-inline .ginlined-content {
  padding: 20px;
  width: 100%;
}

.gslide-inline .dragging {
  cursor: grabbing !important;
  transition: none;
}

.ginlined-content {
  overflow: auto;
  display: block !important;
  opacity: 1;
}

.gslide-external {
  display: flex;
  width: 100%;
  min-width: 100%;
  background: #fff;
  padding: 0;
  overflow: auto;
  max-height: 75vh;
  height: 100%;
}

.gslide-media {
  display: flex;
  width: auto;
}

.zoomed .gslide-media {
  box-shadow: none !important;
}

.desc-top .gslide-media,
.desc-bottom .gslide-media {
  margin: 0 auto;
  flex-direction: column;
}

.gslide-description {
  position: relative;
  flex: 1 0 100%;
}

.gslide-description.description-left,
.gslide-description.description-right {
  max-width: 100%;
}

.gslide-description.description-bottom,
.gslide-description.description-top {
  margin: 0 auto;
  width: 100%;
}

.gslide-description p {
  margin-bottom: 12px;
}

.gslide-description p:last-child {
  margin-bottom: 0;
}

.zoomed .gslide-description {
  display: none;
}

.glightbox-button-hidden {
  display: none;
}

/*
     * Description for mobiles
     * something like facebook does the description
     * for the photos
    */
.glightbox-mobile .glightbox-container .gslide-description {
  height: auto !important;
  width: 100%;
  position: absolute;
  bottom: 0;
  padding: 19px 11px;
  max-width: 100vw !important;
  order: 2 !important;
  max-height: 78vh;
  overflow: auto !important;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
  transition: opacity 0.3s linear;
  padding-bottom: 50px;
}

.glightbox-mobile .glightbox-container .gslide-title {
  color: #fff;
  font-size: 1em;
}

.glightbox-mobile .glightbox-container .gslide-desc {
  color: #a1a1a1;
}

.glightbox-mobile .glightbox-container .gslide-desc a {
  color: #fff;
  font-weight: bold;
}

.glightbox-mobile .glightbox-container .gslide-desc * {
  color: inherit;
}

.glightbox-mobile .glightbox-container .gslide-desc .desc-more {
  color: #fff;
  opacity: 0.4;
}

.gdesc-open .gslide-media {
  transition: opacity 0.5s ease;
  opacity: 0.4;
}

.gdesc-open .gdesc-inner {
  padding-bottom: 30px;
}

.gdesc-closed .gslide-media {
  transition: opacity 0.5s ease;
  opacity: 1;
}

.greset {
  transition: all 0.3s ease;
}

.gabsolute {
  position: absolute;
}

.grelative {
  position: relative;
}

.glightbox-desc {
  display: none !important;
}

.glightbox-open {
  overflow: hidden;
}

.gloader {
  height: 25px;
  width: 25px;
  animation: lightboxLoader 0.8s infinite linear;
  border: 2px solid #fff;
  border-right-color: transparent;
  border-radius: 50%;
  position: absolute;
  display: block;
  z-index: 9999;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 47%;
}

.goverlay {
  width: 100%;
  height: calc(100vh + 1px);
  position: fixed;
  top: -1px;
  left: 0;
  background: #000;
  will-change: opacity;
}

.glightbox-mobile .goverlay {
  background: #000;
}

.gprev,
.gnext,
.gclose {
  z-index: 99999;
  cursor: pointer;
  width: 26px;
  height: 44px;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.gprev svg,
.gnext svg,
.gclose svg {
  display: block;
  width: 25px;
  height: auto;
  margin: 0;
  padding: 0;
}

.gprev.disabled,
.gnext.disabled,
.gclose.disabled {
  opacity: 0.1;
}

.gprev .garrow,
.gnext .garrow,
.gclose .garrow {
  stroke: #fff;
}

.gbtn.focused {
  outline: 2px solid #0f3d81;
}

iframe.wait-autoplay {
  opacity: 0;
}

.glightbox-closing .gnext,
.glightbox-closing .gprev,
.glightbox-closing .gclose {
  opacity: 0 !important;
}

/*Skin */
.glightbox-clean .gslide-description {
  background: #fff;
}

.glightbox-clean .gdesc-inner {
  padding: 22px 20px;
}

.glightbox-clean .gslide-title {
  font-size: 1em;
  font-weight: normal;
  font-family: arial;
  color: #000;
  margin-bottom: 19px;
  line-height: 1.4em;
}

.glightbox-clean .gslide-desc {
  font-size: 0.86em;
  margin-bottom: 0;
  font-family: arial;
  line-height: 1.4em;
}

.glightbox-clean .gslide-video {
  background: #000;
}

.glightbox-clean .gprev,
.glightbox-clean .gnext,
.glightbox-clean .gclose {
  background-color: rgba(0, 0, 0, 0.75);
  border-radius: 4px;
}

.glightbox-clean .gprev path,
.glightbox-clean .gnext path,
.glightbox-clean .gclose path {
  fill: #fff;
}

.glightbox-clean .gprev {
  position: absolute;
  top: -100%;
  left: 30px;
  width: 40px;
  height: 50px;
}

.glightbox-clean .gnext {
  position: absolute;
  top: -100%;
  right: 30px;
  width: 40px;
  height: 50px;
}

.glightbox-clean .gclose {
  width: 35px;
  height: 35px;
  top: 15px;
  right: 10px;
  position: absolute;
}

.glightbox-clean .gclose svg {
  width: 18px;
  height: auto;
}

.glightbox-clean .gclose:hover {
  opacity: 1;
}

/*CSS Animations*/
.gfadeIn {
  animation: gfadeIn 0.5s ease;
}

.gfadeOut {
  animation: gfadeOut 0.5s ease;
}

.gslideOutLeft {
  animation: gslideOutLeft 0.3s ease;
}

.gslideInLeft {
  animation: gslideInLeft 0.3s ease;
}

.gslideOutRight {
  animation: gslideOutRight 0.3s ease;
}

.gslideInRight {
  animation: gslideInRight 0.3s ease;
}

.gzoomIn {
  animation: gzoomIn 0.5s ease;
}

.gzoomOut {
  animation: gzoomOut 0.5s ease;
}
@keyframes lightboxLoader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes gfadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes gfadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes gslideInLeft {
  from {
    opacity: 0;
    transform: translate3d(-60%, 0, 0);
  }
  to {
    visibility: visible;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes gslideOutLeft {
  from {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-60%, 0, 0);
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes gslideInRight {
  from {
    opacity: 0;
    visibility: visible;
    transform: translate3d(60%, 0, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes gslideOutRight {
  from {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(60%, 0, 0);
    opacity: 0;
  }
}
@keyframes gzoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 1;
  }
}
@keyframes gzoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
@media (min-width: 769px) {
  .glightbox-container .ginner-container {
    width: auto;
    height: auto;
    flex-direction: row;
  }
  .glightbox-container .ginner-container.desc-top .gslide-description {
    order: 0;
  }
  .glightbox-container .ginner-container.desc-top .gslide-image,
  .glightbox-container .ginner-container.desc-top .gslide-image img {
    order: 1;
  }
  .glightbox-container .ginner-container.desc-left .gslide-description {
    order: 0;
  }
  .glightbox-container .ginner-container.desc-left .gslide-image {
    order: 1;
  }
  .gslide-image img {
    max-height: 97vh;
    max-width: 100%;
  }
  .gslide-image img.zoomable {
    cursor: zoom-in;
  }
  .zoomed .gslide-image img.zoomable {
    cursor: grab;
  }
  .gslide-inline {
    max-height: 95vh;
  }
  .gslide-external {
    max-height: 100vh;
  }
  .gslide-description.description-left,
  .gslide-description.description-right {
    max-width: 275px;
  }
  .glightbox-open {
    height: auto;
  }
  .goverlay {
    background: rgba(0, 0, 0, 0.92);
  }
  .glightbox-clean .gslide-media {
    box-shadow: 1px 2px 9px 0px rgba(0, 0, 0, 0.65);
  }
  .glightbox-clean .description-left .gdesc-inner,
  .glightbox-clean .description-right .gdesc-inner {
    position: absolute;
    height: 100%;
    overflow-y: auto;
  }
  .glightbox-clean .gprev,
  .glightbox-clean .gnext,
  .glightbox-clean .gclose {
    background-color: rgba(0, 0, 0, 0.32);
  }
  .glightbox-clean .gprev:hover,
  .glightbox-clean .gnext:hover,
  .glightbox-clean .gclose:hover {
    background-color: rgba(0, 0, 0, 0.7);
  }
  .glightbox-clean .gprev {
    top: 45%;
  }
  .glightbox-clean .gnext {
    top: 45%;
  }
}
@media (min-width: 992px) {
  .glightbox-clean .gclose {
    opacity: 0.7;
    right: 20px;
  }
}
@media screen and (max-height: 420px) {
  .goverlay {
    background: #000;
  }
}
.plyr--video {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

/* Footer CSS */
.footer-area .footer-widget-area ul li a {
  align-items: center;
  color: var(--framex-base-color-text);
  margin-bottom: 0.375rem;
  font-size: 14px;
  font-weight: 700;
}
.footer-area .footer-widget-area ul li a i {
  color: var(--framex-base-color-heading);
  font-size: 12px;
  margin-right: 0.5rem;
}
.footer-area .footer-widget-area ul li a:hover, .footer-area .footer-widget-area ul li a:focus {
  color: var(--framex-base-color-primary);
}
.footer-area .footer-widget-area ul li:last-child a {
  margin-bottom: 0;
}
.footer-area .footer-widget-area .form-control {
  height: 45px;
  padding: 8px 20px;
}
.footer-area .footer-widget-area .btn {
  padding: 0.5rem 1.75rem;
}
.footer-area .footer-social-icon > a {
  font-size: 1rem;
  color: var(--framex-base-color-text);
  margin-right: 1.25rem;
}
.footer-area .footer-social-icon > a:last-child {
  margin-right: 0;
}
.footer-area .footer-social-icon > a:hover, .footer-area .footer-social-icon > a:focus {
  color: var(--framex-base-color-primary);
}
.footer-area .footer-nav li a {
  color: var(--framex-base-color-heading);
  margin: 0 0.5rem;
}
.footer-area .footer-nav li a:hover, .footer-area .footer-nav li a:focus {
  color: var(--framex-base-color-primary);
}
.footer-area.footer-2 {
  background-color: var(--framex-base-color-master);
}
.footer-area.footer-2 .footer-widget-area ul li a, .footer-area.footer-2 .footer-widget-area ul li a i, .footer-area.footer-2 .footer-widget-area {
  color: var(--framex-base-color-ash);
}

:root {
  --sidebarHeaderBack: #1b1d3a;
  --sidebarBackground: #151933;
  --sidebarColor: #ccc;
  --sidebarLinkHover: #32374f;
}

#sidebar {
  background: var(--sidebarBackground);
  color: var(--sidebarColor);
  transition: all 0.3s;
}

#sidebar .sidebar-header {
  padding: 20px;
  background: var(--sidebarHeaderBack);
  color: var(--sidebarColor);
}

#sidebar ul.sidebarMenu {
  padding: 20px 0;
  list-style: none;
  margin: 0;
  padding: 20px;
}

#sidebar ul.sidebarMenu li {
  position: relative;
}

#sidebar ul.sidebarMenu li a {
  padding: 7px 10px;
  font-size: 1.1em;
  display: block;
  color: var(--sisebarColor);
  text-decoration: none;
}

#sidebar ul.sidebarMenu li a:hover {
  color: #fff;
  border-radius: 8px;
  background: var(--sidebarLinkHover);
}

#sidebar ul.sidebarMenu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#sidebar ul.sidebarMenu ul li a {
  padding-left: 30px;
  display: block;
}

.wrapper {
  display: flex;
  align-items: stretch;
}

#sidebar {
  min-width: 250px;
  max-width: 250px;
}

#sidebar.active {
  margin-left: -250px;
}

a[data-toggle=collapse] {
  position: relative;
}

#content {
  width: 100%;
  min-height: 100vh;
  transition: all 0.3s;
}

@media (max-width: 768px) {
  .wrapper {
    position: relative;
  }
  #sidebar {
    position: absolute;
    z-index: 1;
    min-width: 250px;
    max-width: 250px;
    transform: translateX(-250px);
    transition: transform 0.3s;
    height: 100%;
  }
  #sidebar.active {
    margin-left: 0;
    transition: margin-left 0.3s, transform 0.3s;
    transform: translateX(0);
  }
  #sidebarCollapse {
    float: right;
  }
}
.table-responsive {
  --inline-size: 40rem;
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
}
.table-responsive table {
  min-inline-size: var(--inline-size);
}

.table {
  --framex-line-height: 1.5;
  --framex-padding: 1rem;
  --framex-responsive-inline-size: 40rem;
  border-collapse: collapse;
  color: var(--framex-table-color-text);
  inline-size: 100%;
}
.table caption {
  color: var(--framex-table-color-caption);
  margin-block-end: 1rem;
}
.table th,
.table td {
  border-block-end: 1px solid var(--framex-table-color-border);
  line-height: var(--framex-line-height);
  padding: var(--framex-padding);
}
.table th {
  color: var(--framex-table-color-heading);
  text-align: inherit;
  text-align: -webkit-match-parent;
}
.table--striped > tbody > tr:nth-child(odd) {
  background-color: var(--framex-table-color-stripe);
}
.table--hover > tbody > tr:hover {
  background: var(--framex-table-color-hover);
}
.table--clear-border th,
.table--clear-border td {
  border: 0;
}
.table--in-line th:first-child,
.table--in-line td:first-child {
  padding-inline-start: 0;
}
.table--in-line th:last-child,
.table--in-line td:last-child {
  padding-inline-end: 0;
}
.table--sm {
  --framex-padding: 0.5rem;
}
.table--sm th,
.table--sm td {
  padding: var(--framex-padding);
}
.table--rounded th:first-child,
.table--rounded td:first-child {
  border-end-start-radius: var(--framex-border-radius-sm);
  border-start-start-radius: var(--framex-border-radius-sm);
}
.table--rounded th:last-child,
.table--rounded td:last-child {
  border-end-end-radius: var(--framex-border-radius-sm);
  border-start-end-radius: var(--framex-border-radius-sm);
}

::-moz-selection {
  background-color: var(--framex-selection-color-background);
  color: var(--framex-selection-color-foreground);
  text-shadow: none;
}

::selection {
  background-color: var(--framex-selection-color-background);
  color: var(--framex-selection-color-foreground);
  text-shadow: none;
}

html {
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
  height: 100%;
}
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

body {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--framex-base-color-background);
  color: var(--framex-base-color-text);
  letter-spacing: var(--framex-letter-spacing);
  font-family: var(--framex-font-family-base);
  font-size: var(--framex-font-size-base);
  font-weight: var(--framex-font-weight-base);
  line-height: var(--framex-line-height-base);
}

.wrp,
footer {
  flex-shrink: 0;
}

.wrp {
  flex-grow: 1;
}

p,
li,
h1,
h2,
h3,
h4,
h5,
h6 {
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5 {
  margin-top: 0;
  margin-bottom: 1rem;
  color: var(--framex-base-color-heading);
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5 h6,
.h6 {
  color: inherit;
  font-weight: var(--framex-font-weight-heading);
  line-height: var(--framex-line-height-heading);
  letter-spacing: 0;
}

h1, .h1 {
  font-size: clamp(2.1270751953rem, 2vw + 1rem, 2.5024414063rem);
}

h2, .h2 {
  font-size: clamp(1.7016601563rem, 2vw + 1rem, 2.001953125rem);
}

h3, .h3 {
  font-size: clamp(1.361328125rem, 2vw + 1rem, 1.6015625rem);
}

h4, .h4 {
  font-size: clamp(1.0890625rem, 2vw + 1rem, 1.28125rem);
}

h5, .h5 {
  font-size: 1.025rem;
}

h6, .h6 {
  font-size: 1.025rem;
}

.display-1 {
  font-size: clamp(2.1994113922rem, 4vw + 1rem, 4.8875808716rem);
}

.display-2 {
  font-size: clamp(2.3460388184rem, 4vw + 1rem, 3.9100646973rem);
}

.display-3 {
  font-size: clamp(2.1896362305rem, 4vw + 1rem, 3.1280517578rem);
}

ul,
ol {
  list-style-position: inside;
}
ul li,
ol li {
  list-style-position: outside;
}
ul li::marker,
ol li::marker {
  color: var(--framex-base-color-marker);
}

dl dt {
  color: var(--framex-base-color-heading);
  font-weight: bold;
}
dl dd {
  margin: 0;
}
dl dd + dt {
  margin-block-start: 1rem;
}

.quote {
  border-inline-start: 0.5rem solid var(--framex-base-color-blockquote-border);
  padding-inline-start: 1.2rem;
}
.quote > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
.quote > * + * {
  margin-block-start: 0.5rem;
}
.quote blockquote {
  border-inline-start: 0;
  padding-inline-start: 0;
}
.quote figcaption {
  text-align: start;
}

blockquote {
  border-inline-start: 0.5rem solid var(--framex-base-color-blockquote-border);
  margin-inline-start: 0;
  padding-inline-start: 1.2rem;
}
blockquote > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
blockquote > * + * {
  margin-block-start: 0.5rem;
}

abbr[title] {
  border-block-end: 1px dotted;
  cursor: help;
  text-decoration: none;
}

mark {
  background-color: var(--framex-base-color-mark-background);
  border-radius: var(--framex-inline-border-radius);
  color: var(--framex-base-color-mark-foreground);
  padding: var(--framex-inline-padding);
}

code,
kbd,
samp {
  background-color: var(--framex-base-color-code-background);
  border-radius: var(--framex-inline-border-radius);
  color: var(--framex-base-color-code-foreground);
  padding: var(--framex-inline-padding);
}

.lead {
  font-size: var(--framex-font-size-lead);
}

a {
  color: var(--framex-base-color-link);
  text-decoration: none;
  transition-duration: transition("duration");
  transition-property: color;
  transition-timing-function: transition("timing-function");
}
a:hover {
  color: var(--framex-base-color-link-hover);
}

button {
  color: inherit;
}

a,
button {
  touch-action: manipulation;
}

.text-sm {
  font-size: var(--framex-font-size-sm);
}

.text-lg {
  font-size: var(--framex-font-size-lg);
}

.tc {
  text-align: center;
}

@media only screen and (max-width: 767.999px) {
  .text-center-md-max {
    text-align: center;
  }
}

@media only screen and (max-width: 991.999px) {
  .text-center-lg-max {
    text-align: center;
  }
}

.hyphens {
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}

.fw-100 {
  font-weight: 100 !important;
}

.fw-200 {
  font-weight: 200 !important;
}

.fw-300 {
  font-weight: 300 !important;
}

.fw-400 {
  font-weight: 400 !important;
}

.fw-500 {
  font-weight: 500 !important;
}

.fw-600 {
  font-weight: 700 !important;
}

.fw-700 {
  font-weight: 700 !important;
}

.fw-800 {
  font-weight: 800 !important;
}

.font-12 {
  font-size: 12px !important;
}

.font-14 {
  font-size: 14px !important;
}

.font-15 {
  font-size: 15px !important;
}

.font-16 {
  font-size: 16px !important;
}

.font-18 {
  font-size: 18px !important;
}

.font-20 {
  font-size: 20px !important;
}

.font-22 {
  font-size: 22px !important;
}

.font-24 {
  font-size: 24px !important;
}

.font-28 {
  font-size: 28px !important;
}

.font-30 {
  font-size: 30px !important;
}

.font-34 {
  font-size: 34px !important;
}

.font-38 {
  font-size: 38px !important;
}

.font-46 {
  font-size: 46px !important;
}

.hidden,
[hidden] {
  display: none !important;
}

.btn {
  --framex-border-radius: 5px;
  --framex-border-width: 1px;
  --framex-font-size: 1rem;
  --framex-font-weight: 500;
  --framex-gap: spacer("xs");
  --framex-icon-padding: 0.75em;
  --framex-icon-size: 1em;
  --framex-padding: 0.75em 1em;
  --framex-shadow-size: 0.25rem;
  align-items: center;
  border-radius: var(--framex-border-radius);
  border-style: solid;
  border-width: var(--framex-border-width);
  cursor: pointer;
  display: inline-flex;
  font-size: var(--framex-font-size);
  font-weight: var(--framex-font-weight);
  gap: var(--framex-gap);
  justify-content: center;
  line-height: 1;
  padding: var(--framex-padding);
  text-align: start;
  text-decoration: none;
  transition-duration: var(--framex-duration);
  transition-property: background-color, border-color, box-shadow, color;
  transition-timing-function: var(--framex-timing-function);
}

.btn:focus {
  outline-color: transparent;
  outline-style: solid;
}

.btn:disabled {
  opacity: 0.5;
  pointer-events: none;
}

.btn--icon {
  padding: var(--framex-icon-padding);
}
.btn--icon.btn--sm {
  padding: var(--framex-icon-padding);
}
.btn--icon.btn--lg {
  padding: var(--framex-icon-padding);
}

.btn__icon {
  block-size: var(--framex-icon-size);
  flex-shrink: 0;
  inline-size: var(--framex-icon-size);
  pointer-events: none;
}
.btn__icon--sm {
  block-size: var(--framex-icon-size);
  inline-size: var(--framex-icon-size);
}

.btn--sm {
  --framex-font-size: 0.8rem;
  --framex-gap: spacer("xxs");
  --framex-icon-padding: 0.5em;
  --framex-icon-size: 0.8rem;
  --framex-padding: 0.5em 0.75em;
  font-size: var(--framex-font-size);
  gap: var(--framex-gap);
  padding: var(--framex-padding);
}

.btn--lg {
  --framex-font-size: 1.15rem;
  --framex-gap: spacer("xs");
  --framex-icon-padding: 0.9em;
  --framex-padding: 0.9em 1.15em;
}

.btn--block {
  inline-size: 100%;
}

.form-file::file-selector-button {
  --framex-border-radius: 5px;
  --framex-border-width: 1px;
  --framex-font-size: 1rem;
  --framex-font-weight: 500;
  --framex-gap: spacer("xs");
  --framex-icon-padding: 0.75em;
  --framex-icon-size: 1em;
  --framex-padding: 0.75em 1em;
  --framex-shadow-size: 0.25rem;
  align-items: center;
  border-radius: var(--framex-border-radius);
  border-style: solid;
  border-width: var(--framex-border-width);
  cursor: pointer;
  display: inline-flex;
  font-size: var(--framex-font-size);
  font-weight: var(--framex-font-weight);
  gap: var(--framex-gap);
  justify-content: center;
  line-height: 1;
  padding: var(--framex-padding);
  text-align: start;
  text-decoration: none;
  transition-duration: var(--framex-duration);
  transition-property: background-color, border-color, box-shadow, color;
  transition-timing-function: var(--framex-timing-function);
}

.form-file:focus {
  outline-color: transparent;
  outline-style: solid;
}

.form-file:disabled {
  opacity: 0.5;
  pointer-events: none;
}

.form-file--sm::file-selector-button {
  --framex-font-size: 0.8rem;
  --framex-gap: spacer("xxs");
  --framex-icon-padding: 0.5em;
  --framex-icon-size: 0.8rem;
  --framex-padding: 0.5em 0.75em;
  font-size: var(--framex-font-size);
  gap: var(--framex-gap);
  padding: var(--framex-padding);
}

.form-file--lg::file-selector-button {
  --framex-font-size: 1.15rem;
  --framex-gap: spacer("xs");
  --framex-icon-padding: 0.9em;
  --framex-padding: 0.9em 1.15em;
}

.form-file--block::file-selector-button {
  inline-size: 100%;
}

.form-file {
  display: block;
}
.form-file:focus {
  outline: revert;
}
.form-file:focus-within::file-selector-button {
  background-color: var(--framex-btn-color-primary-background-hover);
}
.form-file::file-selector-button {
  background-color: var(--framex-btn-color-primary-background);
  border-color: var(--framex-btn-color-primary-background);
  color: var(--framex-btn-color-primary-foreground);
  margin-inline-end: 1rem;
}
.form-file::file-selector-button:hover {
  background-color: var(--framex-btn-color-primary-background-hover);
  border-color: var(--framex-btn-color-primary-background-hover);
  color: var(--framex-btn-color-primary-foreground);
}
.form-file::file-selector-button-shadow {
  box-shadow: 0 0.55em 1em -0.2em var(--framex-btn-color-primary-shadow), 0 0.15em 0.35em -0.185em var(--framex-btn-color-primary-shadow);
}

.form-check {
  --framex-border-radius: 0.425rem;
  --framex-border-width: 1px;
  --framex-font-size: 1.125rem;
  --framex-line-height: 1.5;
  --framex-margin-block: 0.1em;
  --framex-vertical-alignment: center;
  align-items: var(--framex-vertical-alignment);
  display: inline-flex;
  gap: 0.5rem;
}

.form-check--vertical-center {
  align-items: center;
}

.form-check--vertical-start {
  align-items: flex-start;
}

.form-check--sm {
  --framex-border-radius: 0.35em;
  --framex-padding: 0.25em 0.75em;
}
.form-check--sm .form-check__control {
  font-size: var(--framex-font-size);
}

.form-check--lg {
  --framex-padding: 0.65em 1em;
}
.form-check__control {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: var(--framex-form-color-background);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  block-size: 1em;
  border: var(--framex-border-width) solid var(--framex-form-color-border);
  flex-shrink: 0;
  font-size: var(--framex-font-size);
  inline-size: 1em;
  line-height: 1;
  margin-block: var(--framex-margin-block);
  transition-duration: var(--framex-duration);
  transition-property: border, box-shadow;
  transition-timing-function: var(--framex-timing-function);
}
.form-check__control[type=radio] {
  border-radius: 50%;
}
.form-check__control[type=checkbox] {
  border-radius: var(--framex-border-radius);
}
.form-check__control:focus-visible {
  outline: 2px solid var(--framex-form-color-check-focus-ring);
  outline-offset: 2px;
}
.form-check__control:checked {
  background-color: var(--framex-form-color-check-background);
  border-color: var(--framex-form-color-check-background);
}
.form-check__control:checked[type=radio] {
  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3ccircle cx="12" cy="12" r="6" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
}
.form-check__control:checked[type=checkbox] {
  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M9.525,13.777l-2.411,-2.412c-0.234,-0.233 -0.613,-0.233 -0.846,0l-1.27,1.27c-0.233,0.233 -0.233,0.612 0,0.846l4.104,4.103c0.116,0.117 0.269,0.175 0.422,0.175l0.003,0c0.152,0 0.305,-0.058 0.421,-0.175l9.054,-9.053c0.233,-0.234 0.233,-0.613 -0,-0.846l-1.27,-1.269c-0.233,-0.234 -0.612,-0.234 -0.846,-0l-7.361,7.361Z" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
}
.form-check__control:indeterminate[type=checkbox] {
  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M19.5,11.1c-0,-0.331 -0.269,-0.6 -0.6,-0.6l-13.8,0c-0.331,0 -0.6,0.269 -0.6,0.6l0,1.8c0,0.331 0.269,0.6 0.6,0.6l13.8,0c0.331,0 0.6,-0.269 0.6,-0.6l-0,-1.8Z" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
  background-color: var(--framex-form-color-check-background);
  border-color: var(--framex-form-color-check-background);
}
.form-check__control:disabled, .form-check__control.disabled {
  background-color: var(--framex-form-color-background-disabled);
  border-color: var(--framex-form-color-border-disabled);
  cursor: not-allowed;
}
.form-check__control:disabled + .form-check__label, .form-check__control.disabled + .form-check__label {
  opacity: 0.5;
}

.form-check__label {
  line-height: var(--framex-line-height);
}

.form-control {
  --webkit-date-line-height: 1.375;
  --framex-border-radius: 0.425rem;
  --framex-border-width: 1px;
  --framex-font-size: 1.025rem;
  --framex-line-height: 1.5;
  --framex-padding: 0.5em 0.75em;
  --framex-textarea-block-size: 6rem;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: var(--framex-form-color-background);
  border: var(--framex-border-width) solid var(--framex-form-color-border);
  border-radius: var(--framex-border-radius);
  box-sizing: border-box;
  color: var(--framex-form-color-text);
  display: block;
  font-size: var(--framex-font-size);
  inline-size: 100%;
  line-height: var(--framex-line-height);
  padding: var(--framex-padding);
  transition-duration: var(--framex-duration);
  transition-property: border, box-shadow;
  transition-timing-function: var(--framex-timing-function);
}
.form-control::-moz-placeholder {
  color: var(--framex-form-color-placeholder);
}
.form-control::placeholder {
  color: var(--framex-form-color-placeholder);
}
.form-control::-webkit-datetime-edit {
  line-height: var(--webkit-date-line-height);
}
.form-control:focus {
  border-color: var(--framex-form-color-border-focus);
  box-shadow: 0 0 0 1px var(--framex-form-color-ring-focus);
  outline: 2px solid transparent;
}
.form-control[type=color] {
  --framex-aspect-ratio: 1;
  --framex-block-size: 100%;
  --framex-inline-size: 2.625rem;
  --framex-padding: 0.5em;
  aspect-ratio: var(--framex-aspect-ratio);
  block-size: var(--framex-block-size);
  inline-size: var(--framex-inline-size);
  padding: var(--framex-padding);
}
.form-control[type=color]::-webkit-color-swatch-wrapper {
  padding: 0;
}
.form-control[type=color]::-moz-color-swatch {
  border: 0;
  border-radius: var(--framex-border-radius);
}
.form-control[type=color]::-webkit-color-swatch {
  border: 0;
  border-radius: var(--framex-border-radius);
}
.form-control[disabled], .form-control[disabled=true] {
  background-color: var(--framex-form-color-background-disabled);
  border-color: var(--framex-form-color-border-disabled);
  cursor: not-allowed;
}
textarea.form-control {
  block-size: var(--framex-textarea-block-size);
  min-block-size: var(--framex-textarea-block-size);
  resize: vertical;
}

.form-control--valid, .form-control--invalid {
  background-position: center right 0.5em;
  background-repeat: no-repeat;
  background-size: 1.25em auto;
  padding-inline-end: 2em;
}
html[dir=rtl] .form-control--valid, html[dir=rtl] .form-control--invalid {
  background-position: center left 0.5em;
}
.form-control--valid {
  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"%3e%3cpath d="M12,2c5.519,0 10,4.481 10,10c0,5.519 -4.481,10 -10,10c-5.519,0 -10,-4.481 -10,-10c0,-5.519 4.481,-10 10,-10Zm0,1.667c4.599,-0 8.333,3.734 8.333,8.333c0,4.599 -3.734,8.333 -8.333,8.333c-4.599,0 -8.333,-3.734 -8.333,-8.333c-0,-4.599 3.734,-8.333 8.333,-8.333Zm-1.476,10.182l-2.984,-2.984c-0.065,-0.065 -0.17,-0.065 -0.235,0l-0.943,0.943c-0.065,0.065 -0.065,0.171 -0,0.236l4.043,4.042c0.033,0.033 0.076,0.05 0.119,0.049c0.044,0.001 0.087,-0.016 0.12,-0.049l6.994,-6.994c0.065,-0.065 0.065,-0.17 0,-0.235l-0.943,-0.943c-0.065,-0.065 -0.17,-0.065 -0.235,-0l-5.936,5.935Z" style="fill:hsl%28150, 100%, 33%%29;"/%3e%3c/svg%3e');
  border-color: var(--framex-alert-color-success);
}
.form-control--valid:focus {
  border-color: var(--framex-form-color-valid);
  box-shadow: 0 0 0 1px var(--framex-form-color-valid-focus-ring);
  outline: 2px solid transparent;
}
.form-control--invalid {
  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"%3e%3cpath d="M12,2c5.519,0 10,4.481 10,10c0,5.519 -4.481,10 -10,10c-5.519,0 -10,-4.481 -10,-10c0,-5.519 4.481,-10 10,-10Zm0,1.667c4.599,-0 8.333,3.734 8.333,8.333c0,4.599 -3.734,8.333 -8.333,8.333c-4.599,0 -8.333,-3.734 -8.333,-8.333c-0,-4.599 3.734,-8.333 8.333,-8.333Zm0.813,11.649c-0,-0.081 -0.065,-0.146 -0.146,-0.146l-1.334,0c-0.081,0 -0.146,0.065 -0.146,0.146l0,1.169c0,0.08 0.065,0.146 0.146,0.146l1.334,-0c0.081,-0 0.146,-0.066 0.146,-0.146l-0,-1.169Zm-0,-7.784c-0,-0.09 -0.073,-0.163 -0.163,-0.163l-1.3,0c-0.09,0 -0.163,0.073 -0.163,0.163l0,6.351c0,0.09 0.073,0.163 0.163,0.163l1.3,-0c0.09,-0 0.163,-0.073 0.163,-0.163l-0,-6.351Z" style="fill:hsl%280, 71%, 51%%29;"/%3e%3c/svg%3e');
  border-color: var(--framex-alert-color-danger);
}
.form-control--invalid:focus {
  border-color: var(--framex-form-color-invalid);
  box-shadow: 0 0 0 1px var(--framex-form-color-invalid-focus-ring);
  outline: 2px solid transparent;
}
.form-control--sm {
  --webkit-date-line-height: 1.36;
  --framex-border-radius: 0.35em;
  --framex-padding: 0.25em 0.75em;
}
.form-control--sm[type=color] {
  --framex-aspect-ratio: 1;
  --framex-block-size: 100%;
  --framex-inline-size: 1.925rem;
  --framex-padding: 0.25em;
}
.form-control--lg {
  --webkit-date-line-height: 1.387;
  --framex-padding: 0.65em 1em;
}
.form-control--lg[type=color] {
  --framex-aspect-ratio: 1;
  --framex-block-size: 100%;
  --framex-inline-size: 3.204rem;
  --framex-padding: 0.5em;
}

select.form-control:not([multiple]):not([size]) {
  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M12,12.507l-3.816,-3.815c-0.171,-0.172 -0.45,-0.172 -0.622,-0l-0.933,0.933c-0.172,0.172 -0.172,0.451 0,0.623l5.06,5.06c0.172,0.172 0.45,0.172 0.622,0l5.06,-5.06c0.172,-0.172 0.172,-0.451 -0,-0.623l-0.933,-0.933c-0.172,-0.172 -0.451,-0.172 -0.622,-0l-3.816,3.815Z" style="fill:hsl%28215, 28%, 17%%29;"/%3e%3c/svg%3e');
  background-position: center right 0.5em;
  background-repeat: no-repeat;
  background-size: 1.25em auto;
  padding-inline-end: 2em;
}
html[dir=rtl] select.form-control:not([multiple]):not([size]) {
  background-position: center left 0.5em;
}

.form-description {
  --framex-font-size: 1em;
  --framex-font-weight: 400;
  color: var(--framex-form-color-text);
  display: block;
  font-size: var(--framex-font-size);
  font-weight: var(--framex-font-weight);
  line-height: var(--framex-line-height-md);
}

fieldset {
  --framex-layout-gap: 1rem;
  --framex-legend-font-size: clamp(1rem, 5vw, 1.25rem);
  --framex-legend-font-weight: 700;
  border: 0;
  margin: 0;
  padding: 0;
}
fieldset > * {
  margin-block-end: 0;
  margin-block-start: 0;
}
fieldset > * + * {
  margin-block-start: var(--framex-layout-gap);
}
fieldset + fieldset {
  margin-block-start: 2.5rem;
}

legend {
  color: var(--framex-form-color-legend);
  font-size: var(--framex-legend-font-size);
  font-weight: var(--framex-legend-font-weight);
}

.form-group {
  --framex-gap: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: var(--framex-gap);
}
.form-group--horizontal-check {
  --framex-gap: 1rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--framex-gap);
}
.form-group--vertical-check {
  --framex-gap: 1rem;
  align-items: start;
  flex-direction: column;
  gap: var(--framex-gap);
}
.form-group--row {
  --framex-container-inline-size: 38rem;
  --framex-gap: 0.25rem 1rem;
  --framex-label-inline-size: 10rem;
  --framex-vertical-alignment: center;
  align-items: var(--framex-vertical-alignment);
  display: grid;
  gap: var(--framex-gap);
  grid-template-columns: minmax(0, 1fr);
}
.form-group--row\:vertical-center {
  align-items: center;
}
.form-group--row\:vertical-start {
  align-items: flex-start;
}
@media (min-width: 576px) {
  .form-group--row {
    grid-template-columns: minmax(0, var(--label-column)) minmax(0, 1fr);
  }
}
@media (min-width: 576px) {
  .form-group--row .form-description,
  .form-group--row .field-feedback {
    grid-column-start: 2;
  }
}
.form-group--stacked {
  display: flex;
}
.form-group--stacked > * + * {
  border-radius: 0;
  margin-inline-start: -1px;
}
.form-group--stacked > *:first-child {
  border-start-end-radius: 0;
  border-start-start-radius: var(--framex-border-radius);
  border-end-end-radius: 0;
  border-end-start-radius: var(--framex-border-radius);
}
.form-group--stacked > *:last-child {
  border-start-end-radius: var(--framex-border-radius);
  border-start-start-radius: 0;
  border-end-end-radius: var(--framex-border-radius);
  border-end-start-radius: 0;
}
.form-group--stacked > *:only-child {
  border-radius: var(--framex-border-radius);
}
.form-group--stacked > *:focus {
  z-index: 2;
}
.form-group-container {
  container: form-group-container/inline-size;
}

.form-label {
  color: var(--framex-form-color-label);
  line-height: 1.5;
  text-align: start;
}

.form-row--mixed {
  --inline-size: 20ch;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.form-row--mixed > * {
  flex: 1 1 var(--inline-size);
}

.field-feedback {
  display: block;
  line-height: 1.5;
}
.field-feedback--valid {
  color: var(--framex-alert-color-success);
}
.field-feedback--invalid {
  color: var(--framex-alert-color-danger);
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: flex !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

.d-grid {
  display: grid !important;
}

@media only screen and (min-width: 768px) {
  .md\:d-none, .d-md-none {
    display: none !important;
  }
  .md\:d-inline, .d-md-inline {
    display: inline !important;
  }
  .md\:d-inline-block, .d-md-inline-block {
    display: inline-block !important;
  }
  .md\:d-block, .d-md-block {
    display: block !important;
  }
  .md\:d-table, .d-md-table {
    display: table !important;
  }
  .md\:d-table-row, .d-md-table-row {
    display: table-row !important;
  }
  .md\:d-table-cell, .d-md-table-cell {
    display: table-cell !important;
  }
  .md\:d-flex, .d-md-flex {
    display: flex !important;
  }
  .md\:d-inline-flex, .d-md-inline-flex {
    display: inline-flex !important;
  }
  .md\:d-grid, .d-md-grid {
    display: grid !important;
  }
}
@media only screen and (min-width: 992px) {
  .lg\:d-none, .d-lg-none {
    display: none !important;
  }
  .lg\:d-inline, .d-lg-inline {
    display: inline !important;
  }
  .lg\:d-inline-block, .d-lg-inline-block {
    display: inline-block !important;
  }
  .lg\:d-block, .d-lg-block {
    display: block !important;
  }
  .lg\:d-table, .d-lg-table {
    display: table !important;
  }
  .lg\:d-table-row, .d-lg-table-row {
    display: table-row !important;
  }
  .lg\:d-table-cell, .d-lg-table-cell {
    display: table-cell !important;
  }
  .lg\:d-flex, .d-lg-flex {
    display: flex !important;
  }
  .lg\:d-inline-flex, .d-lg-inline-flex {
    display: inline-flex !important;
  }
  .lg\:d-grid, .d-lg-grid {
    display: grid !important;
  }
}
@media only screen and (min-width: 1200px) {
  .xl\:d-none, .d-xl-none {
    display: none !important;
  }
  .xl\:d-inline, .d-xl-inline {
    display: inline !important;
  }
  .xl\:d-inline-block, .d-xl-inline-block {
    display: inline-block !important;
  }
  .xl\:d-block, .d-xl-block {
    display: block !important;
  }
  .xl\:d-table, .d-xl-table {
    display: table !important;
  }
  .xl\:d-table-row, .d-xl-table-row {
    display: table-row !important;
  }
  .xl\:d-table-cell, .d-xl-table-cell {
    display: table-cell !important;
  }
  .xl\:d-flex, .d-xl-flex {
    display: flex !important;
  }
  .xl\:d-inline-flex, .d-xl-inline-flex {
    display: inline-flex !important;
  }
  .xl\:d-grid, .d-xl-grid {
    display: grid !important;
  }
}
.float-left {
  float: left !important;
}

.float-right {
  float: right !important;
}

.float-none {
  float: none !important;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.position-static {
  position: static !important;
}

.position-relative {
  position: relative !important;
}

.position-absolute {
  position: absolute !important;
}

.position-fixed {
  position: fixed !important;
}

.position-sticky {
  position: sticky !important;
}

.visible {
  visibility: visible !important;
}

.invisible {
  visibility: hidden !important;
}

.overflow-visible {
  overflow: visible;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-scroll {
  overflow: scroll;
}

.overflow-auto {
  overflow: auto;
}

.overflow-x-visible {
  overflow-x: visible;
}

.overflow-x-hidden {
  overflow-x: hidden;
}

.overflow-x-scroll {
  overflow-x: scroll;
}

.overflow-x-auto {
  overflow-x: auto;
}

.overflow-y-visible {
  overflow-y: visible;
}

.overflow-y-hidden {
  overflow-y: hidden;
}

.overflow-y-scroll {
  overflow-y: scroll;
}

.overflow-y-auto {
  overflow-y: auto;
}

.z-0 {
  z-index: 0 !important;
}

.z-10 {
  z-index: 10 !important;
}

.z-20 {
  z-index: 20 !important;
}

.z-30 {
  z-index: 30 !important;
}

.z-40 {
  z-index: 40 !important;
}

.z-50 {
  z-index: 50 !important;
}

.z-auto {
  z-index: auto !important;
}

.m-0 {
  margin: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.m-6 {
  margin: 3.5rem !important;
}

.m-7 {
  margin: 4rem !important;
}

.m-8 {
  margin: 4.5rem !important;
}

.m-9 {
  margin: 5rem !important;
}

.p-0 {
  padding: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.p-6 {
  padding: 3.5rem !important;
}

.p-7 {
  padding: 4rem !important;
}

.p-8 {
  padding: 4.5rem !important;
}

.p-9 {
  padding: 5rem !important;
}

.mt-0 {
  margin-top: 0 !important;
}

.me-0 {
  margin-right: 0 !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.ms-0 {
  margin-left: 0 !important;
}

.mt-1 {
  margin-top: 0.25rem !important;
}

.me-1 {
  margin-right: 0.25rem !important;
}

.mb-1 {
  margin-bottom: 0.25rem !important;
}

.ms-1 {
  margin-left: 0.25rem !important;
}

.mt-2 {
  margin-top: 0.5rem !important;
}

.me-2 {
  margin-right: 0.5rem !important;
}

.mb-2 {
  margin-bottom: 0.5rem !important;
}

.ms-2 {
  margin-left: 0.5rem !important;
}

.mt-3 {
  margin-top: 1rem !important;
}

.me-3 {
  margin-right: 1rem !important;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.ms-3 {
  margin-left: 1rem !important;
}

.mt-4 {
  margin-top: 1.5rem !important;
}

.me-4 {
  margin-right: 1.5rem !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.ms-4 {
  margin-left: 1.5rem !important;
}

.mt-5 {
  margin-top: 3rem !important;
}

.me-5 {
  margin-right: 3rem !important;
}

.mb-5 {
  margin-bottom: 3rem !important;
}

.ms-5 {
  margin-left: 3rem !important;
}

.mt-6 {
  margin-top: 3.5rem !important;
}

.me-6 {
  margin-right: 3.5rem !important;
}

.mb-6 {
  margin-bottom: 3.5rem !important;
}

.ms-6 {
  margin-left: 3.5rem !important;
}

.mt-7 {
  margin-top: 4rem !important;
}

.me-7 {
  margin-right: 4rem !important;
}

.mb-7 {
  margin-bottom: 4rem !important;
}

.ms-7 {
  margin-left: 4rem !important;
}

.mt-8 {
  margin-top: 4.5rem !important;
}

.me-8 {
  margin-right: 4.5rem !important;
}

.mb-8 {
  margin-bottom: 4.5rem !important;
}

.ms-8 {
  margin-left: 4.5rem !important;
}

.mt-9 {
  margin-top: 5rem !important;
}

.me-9 {
  margin-right: 5rem !important;
}

.mb-9 {
  margin-bottom: 5rem !important;
}

.ms-9 {
  margin-left: 5rem !important;
}

.pt-0 {
  padding-top: 0 !important;
}

.pe-0 {
  padding-right: 0 !important;
}

.pb-0 {
  padding-bottom: 0 !important;
}

.ps-0 {
  padding-left: 0 !important;
}

.pt-1 {
  padding-top: 0.25rem !important;
}

.pe-1 {
  padding-right: 0.25rem !important;
}

.pb-1 {
  padding-bottom: 0.25rem !important;
}

.ps-1 {
  padding-left: 0.25rem !important;
}

.pt-2 {
  padding-top: 0.5rem !important;
}

.pe-2 {
  padding-right: 0.5rem !important;
}

.pb-2 {
  padding-bottom: 0.5rem !important;
}

.ps-2 {
  padding-left: 0.5rem !important;
}

.pt-3 {
  padding-top: 1rem !important;
}

.pe-3 {
  padding-right: 1rem !important;
}

.pb-3 {
  padding-bottom: 1rem !important;
}

.ps-3 {
  padding-left: 1rem !important;
}

.pt-4 {
  padding-top: 1.5rem !important;
}

.pe-4 {
  padding-right: 1.5rem !important;
}

.pb-4 {
  padding-bottom: 1.5rem !important;
}

.ps-4 {
  padding-left: 1.5rem !important;
}

.pt-5 {
  padding-top: 3rem !important;
}

.pe-5 {
  padding-right: 3rem !important;
}

.pb-5 {
  padding-bottom: 3rem !important;
}

.ps-5 {
  padding-left: 3rem !important;
}

.pt-6 {
  padding-top: 3.5rem !important;
}

.pe-6 {
  padding-right: 3.5rem !important;
}

.pb-6 {
  padding-bottom: 3.5rem !important;
}

.ps-6 {
  padding-left: 3.5rem !important;
}

.pt-7 {
  padding-top: 4rem !important;
}

.pe-7 {
  padding-right: 4rem !important;
}

.pb-7 {
  padding-bottom: 4rem !important;
}

.ps-7 {
  padding-left: 4rem !important;
}

.pt-8 {
  padding-top: 4.5rem !important;
}

.pe-8 {
  padding-right: 4.5rem !important;
}

.pb-8 {
  padding-bottom: 4.5rem !important;
}

.ps-8 {
  padding-left: 4.5rem !important;
}

.pt-9 {
  padding-top: 5rem !important;
}

.pe-9 {
  padding-right: 5rem !important;
}

.pb-9 {
  padding-bottom: 5rem !important;
}

.ps-9 {
  padding-left: 5rem !important;
}

.mx-0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.my-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.mx-1 {
  margin-left: 0.25rem !important;
  margin-right: 0.25rem !important;
}

.my-1 {
  margin-top: 0.25rem !important;
  margin-bottom: 0.25rem !important;
}

.mx-2 {
  margin-left: 0.5rem !important;
  margin-right: 0.5rem !important;
}

.my-2 {
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;
}

.mx-3 {
  margin-left: 1rem !important;
  margin-right: 1rem !important;
}

.my-3 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
}

.mx-4 {
  margin-left: 1.5rem !important;
  margin-right: 1.5rem !important;
}

.my-4 {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

.mx-5 {
  margin-left: 3rem !important;
  margin-right: 3rem !important;
}

.my-5 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
}

.mx-6 {
  margin-left: 3.5rem !important;
  margin-right: 3.5rem !important;
}

.my-6 {
  margin-top: 3.5rem !important;
  margin-bottom: 3.5rem !important;
}

.mx-7 {
  margin-left: 4rem !important;
  margin-right: 4rem !important;
}

.my-7 {
  margin-top: 4rem !important;
  margin-bottom: 4rem !important;
}

.mx-8 {
  margin-left: 4.5rem !important;
  margin-right: 4.5rem !important;
}

.my-8 {
  margin-top: 4.5rem !important;
  margin-bottom: 4.5rem !important;
}

.mx-9 {
  margin-left: 5rem !important;
  margin-right: 5rem !important;
}

.my-9 {
  margin-top: 5rem !important;
  margin-bottom: 5rem !important;
}

.px-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.px-1 {
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
}

.py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

.px-2 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.px-3 {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.py-3 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.px-4 {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

.py-4 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

.px-5 {
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}

.py-5 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.px-6 {
  padding-left: 3.5rem !important;
  padding-right: 3.5rem !important;
}

.py-6 {
  padding-top: 3.5rem !important;
  padding-bottom: 3.5rem !important;
}

.px-7 {
  padding-left: 4rem !important;
  padding-right: 4rem !important;
}

.py-7 {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.px-8 {
  padding-left: 4.5rem !important;
  padding-right: 4.5rem !important;
}

.py-8 {
  padding-top: 4.5rem !important;
  padding-bottom: 4.5rem !important;
}

.px-9 {
  padding-left: 5rem !important;
  padding-right: 5rem !important;
}

.py-9 {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}

.mt-auto {
  margin-top: auto !important;
}

.me-auto {
  margin-right: auto !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.ms-auto {
  margin-left: auto !important;
}

.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.my-auto {
  margin-top: auto !important;
  margin-bottom: auto !important;
}

.m-auto {
  margin: auto;
}

@media only screen and (min-width: 768px) {
  .md\:m-0, .m-md-0 {
    margin: 0 !important;
  }
  .md\:m-1, .m-md-1 {
    margin: 0.25rem !important;
  }
  .md\:m-2, .m-md-2 {
    margin: 0.5rem !important;
  }
  .md\:m-3, .m-md-3 {
    margin: 1rem !important;
  }
  .md\:m-4, .m-md-4 {
    margin: 1.5rem !important;
  }
  .md\:m-5, .m-md-5 {
    margin: 3rem !important;
  }
  .md\:m-6, .m-md-6 {
    margin: 3.5rem !important;
  }
  .md\:m-7, .m-md-7 {
    margin: 4rem !important;
  }
  .md\:m-8, .m-md-8 {
    margin: 4.5rem !important;
  }
  .md\:m-9, .m-md-9 {
    margin: 5rem !important;
  }
  .md\:p-0, .p-md-0 {
    padding: 0 !important;
  }
  .md\:p-1, .p-md-1 {
    padding: 0.25rem !important;
  }
  .md\:p-2, .p-md-2 {
    padding: 0.5rem !important;
  }
  .md\:p-3, .p-md-3 {
    padding: 1rem !important;
  }
  .md\:p-4, .p-md-4 {
    padding: 1.5rem !important;
  }
  .md\:p-5, .p-md-5 {
    padding: 3rem !important;
  }
  .md\:p-6, .p-md-6 {
    padding: 3.5rem !important;
  }
  .md\:p-7, .p-md-7 {
    padding: 4rem !important;
  }
  .md\:p-8, .p-md-8 {
    padding: 4.5rem !important;
  }
  .md\:p-9, .p-md-9 {
    padding: 5rem !important;
  }
  .md\:mt-0, .mt-md-0 {
    margin-top: 0 !important;
  }
  .md\:me-0, .me-md-0 {
    margin-right: 0 !important;
  }
  .md\:mb-0, .mb-md-0 {
    margin-bottom: 0 !important;
  }
  .md\:ms-0, .ms-md-0 {
    margin-left: 0 !important;
  }
  .md\:mt-1, .mt-md-1 {
    margin-top: 0.25rem !important;
  }
  .md\:me-1, .me-md-1 {
    margin-right: 0.25rem !important;
  }
  .md\:mb-1, .mb-md-1 {
    margin-bottom: 0.25rem !important;
  }
  .md\:ms-1, .ms-md-1 {
    margin-left: 0.25rem !important;
  }
  .md\:mt-2, .mt-md-2 {
    margin-top: 0.5rem !important;
  }
  .md\:me-2, .me-md-2 {
    margin-right: 0.5rem !important;
  }
  .md\:mb-2, .mb-md-2 {
    margin-bottom: 0.5rem !important;
  }
  .md\:ms-2, .ms-md-2 {
    margin-left: 0.5rem !important;
  }
  .md\:mt-3, .mt-md-3 {
    margin-top: 1rem !important;
  }
  .md\:me-3, .me-md-3 {
    margin-right: 1rem !important;
  }
  .md\:mb-3, .mb-md-3 {
    margin-bottom: 1rem !important;
  }
  .md\:ms-3, .ms-md-3 {
    margin-left: 1rem !important;
  }
  .md\:mt-4, .mt-md-4 {
    margin-top: 1.5rem !important;
  }
  .md\:me-4, .me-md-4 {
    margin-right: 1.5rem !important;
  }
  .md\:mb-4, .mb-md-4 {
    margin-bottom: 1.5rem !important;
  }
  .md\:ms-4, .ms-md-4 {
    margin-left: 1.5rem !important;
  }
  .md\:mt-5, .mt-md-5 {
    margin-top: 3rem !important;
  }
  .md\:me-5, .me-md-5 {
    margin-right: 3rem !important;
  }
  .md\:mb-5, .mb-md-5 {
    margin-bottom: 3rem !important;
  }
  .md\:ms-5, .ms-md-5 {
    margin-left: 3rem !important;
  }
  .md\:mt-6, .mt-md-6 {
    margin-top: 3.5rem !important;
  }
  .md\:me-6, .me-md-6 {
    margin-right: 3.5rem !important;
  }
  .md\:mb-6, .mb-md-6 {
    margin-bottom: 3.5rem !important;
  }
  .md\:ms-6, .ms-md-6 {
    margin-left: 3.5rem !important;
  }
  .md\:mt-7, .mt-md-7 {
    margin-top: 4rem !important;
  }
  .md\:me-7, .me-md-7 {
    margin-right: 4rem !important;
  }
  .md\:mb-7, .mb-md-7 {
    margin-bottom: 4rem !important;
  }
  .md\:ms-7, .ms-md-7 {
    margin-left: 4rem !important;
  }
  .md\:mt-8, .mt-md-8 {
    margin-top: 4.5rem !important;
  }
  .md\:me-8, .me-md-8 {
    margin-right: 4.5rem !important;
  }
  .md\:mb-8, .mb-md-8 {
    margin-bottom: 4.5rem !important;
  }
  .md\:ms-8, .ms-md-8 {
    margin-left: 4.5rem !important;
  }
  .md\:mt-9, .mt-md-9 {
    margin-top: 5rem !important;
  }
  .md\:me-9, .me-md-9 {
    margin-right: 5rem !important;
  }
  .md\:mb-9, .mb-md-9 {
    margin-bottom: 5rem !important;
  }
  .md\:ms-9, .ms-md-9 {
    margin-left: 5rem !important;
  }
  .md\:pt-0, .pt-md-0 {
    padding-top: 0 !important;
  }
  .md\:pe-0, .pe-md-0 {
    padding-right: 0 !important;
  }
  .md\:pb-0, .pb-md-0 {
    padding-bottom: 0 !important;
  }
  .md\:ps-0, .ps-md-0 {
    padding-left: 0 !important;
  }
  .md\:pt-1, .pt-md-1 {
    padding-top: 0.25rem !important;
  }
  .md\:pe-1, .pe-md-1 {
    padding-right: 0.25rem !important;
  }
  .md\:pb-1, .pb-md-1 {
    padding-bottom: 0.25rem !important;
  }
  .md\:ps-1, .ps-md-1 {
    padding-left: 0.25rem !important;
  }
  .md\:pt-2, .pt-md-2 {
    padding-top: 0.5rem !important;
  }
  .md\:pe-2, .pe-md-2 {
    padding-right: 0.5rem !important;
  }
  .md\:pb-2, .pb-md-2 {
    padding-bottom: 0.5rem !important;
  }
  .md\:ps-2, .ps-md-2 {
    padding-left: 0.5rem !important;
  }
  .md\:pt-3, .pt-md-3 {
    padding-top: 1rem !important;
  }
  .md\:pe-3, .pe-md-3 {
    padding-right: 1rem !important;
  }
  .md\:pb-3, .pb-md-3 {
    padding-bottom: 1rem !important;
  }
  .md\:ps-3, .ps-md-3 {
    padding-left: 1rem !important;
  }
  .md\:pt-4, .pt-md-4 {
    padding-top: 1.5rem !important;
  }
  .md\:pe-4, .pe-md-4 {
    padding-right: 1.5rem !important;
  }
  .md\:pb-4, .pb-md-4 {
    padding-bottom: 1.5rem !important;
  }
  .md\:ps-4, .ps-md-4 {
    padding-left: 1.5rem !important;
  }
  .md\:pt-5, .pt-md-5 {
    padding-top: 3rem !important;
  }
  .md\:pe-5, .pe-md-5 {
    padding-right: 3rem !important;
  }
  .md\:pb-5, .pb-md-5 {
    padding-bottom: 3rem !important;
  }
  .md\:ps-5, .ps-md-5 {
    padding-left: 3rem !important;
  }
  .md\:pt-6, .pt-md-6 {
    padding-top: 3.5rem !important;
  }
  .md\:pe-6, .pe-md-6 {
    padding-right: 3.5rem !important;
  }
  .md\:pb-6, .pb-md-6 {
    padding-bottom: 3.5rem !important;
  }
  .md\:ps-6, .ps-md-6 {
    padding-left: 3.5rem !important;
  }
  .md\:pt-7, .pt-md-7 {
    padding-top: 4rem !important;
  }
  .md\:pe-7, .pe-md-7 {
    padding-right: 4rem !important;
  }
  .md\:pb-7, .pb-md-7 {
    padding-bottom: 4rem !important;
  }
  .md\:ps-7, .ps-md-7 {
    padding-left: 4rem !important;
  }
  .md\:pt-8, .pt-md-8 {
    padding-top: 4.5rem !important;
  }
  .md\:pe-8, .pe-md-8 {
    padding-right: 4.5rem !important;
  }
  .md\:pb-8, .pb-md-8 {
    padding-bottom: 4.5rem !important;
  }
  .md\:ps-8, .ps-md-8 {
    padding-left: 4.5rem !important;
  }
  .md\:pt-9, .pt-md-9 {
    padding-top: 5rem !important;
  }
  .md\:pe-9, .pe-md-9 {
    padding-right: 5rem !important;
  }
  .md\:pb-9, .pb-md-9 {
    padding-bottom: 5rem !important;
  }
  .md\:ps-9, .ps-md-9 {
    padding-left: 5rem !important;
  }
  .md\:mx-0, .mx-md-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .md\:my-0, .my-md-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .md\:mx-1, .mx-md-1 {
    margin-left: 0.25rem !important;
    margin-right: 0.25rem !important;
  }
  .md\:my-1, .my-md-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }
  .md\:mx-2, .mx-md-2 {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
  }
  .md\:my-2, .my-md-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }
  .md\:mx-3, .mx-md-3 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
  }
  .md\:my-3, .my-md-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }
  .md\:mx-4, .mx-md-4 {
    margin-left: 1.5rem !important;
    margin-right: 1.5rem !important;
  }
  .md\:my-4, .my-md-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }
  .md\:mx-5, .mx-md-5 {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
  }
  .md\:my-5, .my-md-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }
  .md\:mx-6, .mx-md-6 {
    margin-left: 3.5rem !important;
    margin-right: 3.5rem !important;
  }
  .md\:my-6, .my-md-6 {
    margin-top: 3.5rem !important;
    margin-bottom: 3.5rem !important;
  }
  .md\:mx-7, .mx-md-7 {
    margin-left: 4rem !important;
    margin-right: 4rem !important;
  }
  .md\:my-7, .my-md-7 {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important;
  }
  .md\:mx-8, .mx-md-8 {
    margin-left: 4.5rem !important;
    margin-right: 4.5rem !important;
  }
  .md\:my-8, .my-md-8 {
    margin-top: 4.5rem !important;
    margin-bottom: 4.5rem !important;
  }
  .md\:mx-9, .mx-md-9 {
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }
  .md\:my-9, .my-md-9 {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
  }
  .md\:px-0, .px-md-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .md\:py-0, .py-md-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .md\:px-1, .px-md-1 {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
  }
  .md\:py-1, .py-md-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }
  .md\:px-2, .px-md-2 {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  .md\:py-2, .py-md-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }
  .md\:px-3, .px-md-3 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  .md\:py-3, .py-md-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
  .md\:px-4, .px-md-4 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
  .md\:py-4, .py-md-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }
  .md\:px-5, .px-md-5 {
    padding-left: 3rem !important;
    padding-right: 3rem !important;
  }
  .md\:py-5, .py-md-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
  .md\:px-6, .px-md-6 {
    padding-left: 3.5rem !important;
    padding-right: 3.5rem !important;
  }
  .md\:py-6, .py-md-6 {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
  .md\:px-7, .px-md-7 {
    padding-left: 4rem !important;
    padding-right: 4rem !important;
  }
  .md\:py-7, .py-md-7 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
  .md\:px-8, .px-md-8 {
    padding-left: 4.5rem !important;
    padding-right: 4.5rem !important;
  }
  .md\:py-8, .py-md-8 {
    padding-top: 4.5rem !important;
    padding-bottom: 4.5rem !important;
  }
  .md\:px-9, .px-md-9 {
    padding-left: 5rem !important;
    padding-right: 5rem !important;
  }
  .md\:py-9, .py-md-9 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
  .md\:mt-auto, .mt-md-auto {
    margin-top: auto !important;
  }
  .md\:me-auto, .me-md-auto {
    margin-right: auto !important;
  }
  .md\:mb-auto, .mb-md-auto {
    margin-bottom: auto !important;
  }
  .md\:ms-auto, .ms-md-auto {
    margin-left: auto !important;
  }
  .md\:mx-auto, .mx-md-auto {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .md\:my-auto, .my-md-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
  .m-md-auto {
    margin: auto;
  }
}
@media only screen and (min-width: 992px) {
  .lg\:m-0, .m-lg-0 {
    margin: 0 !important;
  }
  .lg\:m-1, .m-lg-1 {
    margin: 0.25rem !important;
  }
  .lg\:m-2, .m-lg-2 {
    margin: 0.5rem !important;
  }
  .lg\:m-3, .m-lg-3 {
    margin: 1rem !important;
  }
  .lg\:m-4, .m-lg-4 {
    margin: 1.5rem !important;
  }
  .lg\:m-5, .m-lg-5 {
    margin: 3rem !important;
  }
  .lg\:m-6, .m-lg-6 {
    margin: 3.5rem !important;
  }
  .lg\:m-7, .m-lg-7 {
    margin: 4rem !important;
  }
  .lg\:m-8, .m-lg-8 {
    margin: 4.5rem !important;
  }
  .lg\:m-9, .m-lg-9 {
    margin: 5rem !important;
  }
  .lg\:p-0, .p-lg-0 {
    padding: 0 !important;
  }
  .lg\:p-1, .p-lg-1 {
    padding: 0.25rem !important;
  }
  .lg\:p-2, .p-lg-2 {
    padding: 0.5rem !important;
  }
  .lg\:p-3, .p-lg-3 {
    padding: 1rem !important;
  }
  .lg\:p-4, .p-lg-4 {
    padding: 1.5rem !important;
  }
  .lg\:p-5, .p-lg-5 {
    padding: 3rem !important;
  }
  .lg\:p-6, .p-lg-6 {
    padding: 3.5rem !important;
  }
  .lg\:p-7, .p-lg-7 {
    padding: 4rem !important;
  }
  .lg\:p-8, .p-lg-8 {
    padding: 4.5rem !important;
  }
  .lg\:p-9, .p-lg-9 {
    padding: 5rem !important;
  }
  .lg\:mt-0, .mt-lg-0 {
    margin-top: 0 !important;
  }
  .lg\:me-0, .me-lg-0 {
    margin-right: 0 !important;
  }
  .lg\:mb-0, .mb-lg-0 {
    margin-bottom: 0 !important;
  }
  .lg\:ms-0, .ms-lg-0 {
    margin-left: 0 !important;
  }
  .lg\:mt-1, .mt-lg-1 {
    margin-top: 0.25rem !important;
  }
  .lg\:me-1, .me-lg-1 {
    margin-right: 0.25rem !important;
  }
  .lg\:mb-1, .mb-lg-1 {
    margin-bottom: 0.25rem !important;
  }
  .lg\:ms-1, .ms-lg-1 {
    margin-left: 0.25rem !important;
  }
  .lg\:mt-2, .mt-lg-2 {
    margin-top: 0.5rem !important;
  }
  .lg\:me-2, .me-lg-2 {
    margin-right: 0.5rem !important;
  }
  .lg\:mb-2, .mb-lg-2 {
    margin-bottom: 0.5rem !important;
  }
  .lg\:ms-2, .ms-lg-2 {
    margin-left: 0.5rem !important;
  }
  .lg\:mt-3, .mt-lg-3 {
    margin-top: 1rem !important;
  }
  .lg\:me-3, .me-lg-3 {
    margin-right: 1rem !important;
  }
  .lg\:mb-3, .mb-lg-3 {
    margin-bottom: 1rem !important;
  }
  .lg\:ms-3, .ms-lg-3 {
    margin-left: 1rem !important;
  }
  .lg\:mt-4, .mt-lg-4 {
    margin-top: 1.5rem !important;
  }
  .lg\:me-4, .me-lg-4 {
    margin-right: 1.5rem !important;
  }
  .lg\:mb-4, .mb-lg-4 {
    margin-bottom: 1.5rem !important;
  }
  .lg\:ms-4, .ms-lg-4 {
    margin-left: 1.5rem !important;
  }
  .lg\:mt-5, .mt-lg-5 {
    margin-top: 3rem !important;
  }
  .lg\:me-5, .me-lg-5 {
    margin-right: 3rem !important;
  }
  .lg\:mb-5, .mb-lg-5 {
    margin-bottom: 3rem !important;
  }
  .lg\:ms-5, .ms-lg-5 {
    margin-left: 3rem !important;
  }
  .lg\:mt-6, .mt-lg-6 {
    margin-top: 3.5rem !important;
  }
  .lg\:me-6, .me-lg-6 {
    margin-right: 3.5rem !important;
  }
  .lg\:mb-6, .mb-lg-6 {
    margin-bottom: 3.5rem !important;
  }
  .lg\:ms-6, .ms-lg-6 {
    margin-left: 3.5rem !important;
  }
  .lg\:mt-7, .mt-lg-7 {
    margin-top: 4rem !important;
  }
  .lg\:me-7, .me-lg-7 {
    margin-right: 4rem !important;
  }
  .lg\:mb-7, .mb-lg-7 {
    margin-bottom: 4rem !important;
  }
  .lg\:ms-7, .ms-lg-7 {
    margin-left: 4rem !important;
  }
  .lg\:mt-8, .mt-lg-8 {
    margin-top: 4.5rem !important;
  }
  .lg\:me-8, .me-lg-8 {
    margin-right: 4.5rem !important;
  }
  .lg\:mb-8, .mb-lg-8 {
    margin-bottom: 4.5rem !important;
  }
  .lg\:ms-8, .ms-lg-8 {
    margin-left: 4.5rem !important;
  }
  .lg\:mt-9, .mt-lg-9 {
    margin-top: 5rem !important;
  }
  .lg\:me-9, .me-lg-9 {
    margin-right: 5rem !important;
  }
  .lg\:mb-9, .mb-lg-9 {
    margin-bottom: 5rem !important;
  }
  .lg\:ms-9, .ms-lg-9 {
    margin-left: 5rem !important;
  }
  .lg\:pt-0, .pt-lg-0 {
    padding-top: 0 !important;
  }
  .lg\:pe-0, .pe-lg-0 {
    padding-right: 0 !important;
  }
  .lg\:pb-0, .pb-lg-0 {
    padding-bottom: 0 !important;
  }
  .lg\:ps-0, .ps-lg-0 {
    padding-left: 0 !important;
  }
  .lg\:pt-1, .pt-lg-1 {
    padding-top: 0.25rem !important;
  }
  .lg\:pe-1, .pe-lg-1 {
    padding-right: 0.25rem !important;
  }
  .lg\:pb-1, .pb-lg-1 {
    padding-bottom: 0.25rem !important;
  }
  .lg\:ps-1, .ps-lg-1 {
    padding-left: 0.25rem !important;
  }
  .lg\:pt-2, .pt-lg-2 {
    padding-top: 0.5rem !important;
  }
  .lg\:pe-2, .pe-lg-2 {
    padding-right: 0.5rem !important;
  }
  .lg\:pb-2, .pb-lg-2 {
    padding-bottom: 0.5rem !important;
  }
  .lg\:ps-2, .ps-lg-2 {
    padding-left: 0.5rem !important;
  }
  .lg\:pt-3, .pt-lg-3 {
    padding-top: 1rem !important;
  }
  .lg\:pe-3, .pe-lg-3 {
    padding-right: 1rem !important;
  }
  .lg\:pb-3, .pb-lg-3 {
    padding-bottom: 1rem !important;
  }
  .lg\:ps-3, .ps-lg-3 {
    padding-left: 1rem !important;
  }
  .lg\:pt-4, .pt-lg-4 {
    padding-top: 1.5rem !important;
  }
  .lg\:pe-4, .pe-lg-4 {
    padding-right: 1.5rem !important;
  }
  .lg\:pb-4, .pb-lg-4 {
    padding-bottom: 1.5rem !important;
  }
  .lg\:ps-4, .ps-lg-4 {
    padding-left: 1.5rem !important;
  }
  .lg\:pt-5, .pt-lg-5 {
    padding-top: 3rem !important;
  }
  .lg\:pe-5, .pe-lg-5 {
    padding-right: 3rem !important;
  }
  .lg\:pb-5, .pb-lg-5 {
    padding-bottom: 3rem !important;
  }
  .lg\:ps-5, .ps-lg-5 {
    padding-left: 3rem !important;
  }
  .lg\:pt-6, .pt-lg-6 {
    padding-top: 3.5rem !important;
  }
  .lg\:pe-6, .pe-lg-6 {
    padding-right: 3.5rem !important;
  }
  .lg\:pb-6, .pb-lg-6 {
    padding-bottom: 3.5rem !important;
  }
  .lg\:ps-6, .ps-lg-6 {
    padding-left: 3.5rem !important;
  }
  .lg\:pt-7, .pt-lg-7 {
    padding-top: 4rem !important;
  }
  .lg\:pe-7, .pe-lg-7 {
    padding-right: 4rem !important;
  }
  .lg\:pb-7, .pb-lg-7 {
    padding-bottom: 4rem !important;
  }
  .lg\:ps-7, .ps-lg-7 {
    padding-left: 4rem !important;
  }
  .lg\:pt-8, .pt-lg-8 {
    padding-top: 4.5rem !important;
  }
  .lg\:pe-8, .pe-lg-8 {
    padding-right: 4.5rem !important;
  }
  .lg\:pb-8, .pb-lg-8 {
    padding-bottom: 4.5rem !important;
  }
  .lg\:ps-8, .ps-lg-8 {
    padding-left: 4.5rem !important;
  }
  .lg\:pt-9, .pt-lg-9 {
    padding-top: 5rem !important;
  }
  .lg\:pe-9, .pe-lg-9 {
    padding-right: 5rem !important;
  }
  .lg\:pb-9, .pb-lg-9 {
    padding-bottom: 5rem !important;
  }
  .lg\:ps-9, .ps-lg-9 {
    padding-left: 5rem !important;
  }
  .lg\:mx-0, .mx-lg-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .lg\:my-0, .my-lg-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .lg\:mx-1, .mx-lg-1 {
    margin-left: 0.25rem !important;
    margin-right: 0.25rem !important;
  }
  .lg\:my-1, .my-lg-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }
  .lg\:mx-2, .mx-lg-2 {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
  }
  .lg\:my-2, .my-lg-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }
  .lg\:mx-3, .mx-lg-3 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
  }
  .lg\:my-3, .my-lg-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }
  .lg\:mx-4, .mx-lg-4 {
    margin-left: 1.5rem !important;
    margin-right: 1.5rem !important;
  }
  .lg\:my-4, .my-lg-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }
  .lg\:mx-5, .mx-lg-5 {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
  }
  .lg\:my-5, .my-lg-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }
  .lg\:mx-6, .mx-lg-6 {
    margin-left: 3.5rem !important;
    margin-right: 3.5rem !important;
  }
  .lg\:my-6, .my-lg-6 {
    margin-top: 3.5rem !important;
    margin-bottom: 3.5rem !important;
  }
  .lg\:mx-7, .mx-lg-7 {
    margin-left: 4rem !important;
    margin-right: 4rem !important;
  }
  .lg\:my-7, .my-lg-7 {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important;
  }
  .lg\:mx-8, .mx-lg-8 {
    margin-left: 4.5rem !important;
    margin-right: 4.5rem !important;
  }
  .lg\:my-8, .my-lg-8 {
    margin-top: 4.5rem !important;
    margin-bottom: 4.5rem !important;
  }
  .lg\:mx-9, .mx-lg-9 {
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }
  .lg\:my-9, .my-lg-9 {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
  }
  .lg\:px-0, .px-lg-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .lg\:py-0, .py-lg-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .lg\:px-1, .px-lg-1 {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
  }
  .lg\:py-1, .py-lg-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }
  .lg\:px-2, .px-lg-2 {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  .lg\:py-2, .py-lg-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }
  .lg\:px-3, .px-lg-3 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  .lg\:py-3, .py-lg-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
  .lg\:px-4, .px-lg-4 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
  .lg\:py-4, .py-lg-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }
  .lg\:px-5, .px-lg-5 {
    padding-left: 3rem !important;
    padding-right: 3rem !important;
  }
  .lg\:py-5, .py-lg-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
  .lg\:px-6, .px-lg-6 {
    padding-left: 3.5rem !important;
    padding-right: 3.5rem !important;
  }
  .lg\:py-6, .py-lg-6 {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
  .lg\:px-7, .px-lg-7 {
    padding-left: 4rem !important;
    padding-right: 4rem !important;
  }
  .lg\:py-7, .py-lg-7 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
  .lg\:px-8, .px-lg-8 {
    padding-left: 4.5rem !important;
    padding-right: 4.5rem !important;
  }
  .lg\:py-8, .py-lg-8 {
    padding-top: 4.5rem !important;
    padding-bottom: 4.5rem !important;
  }
  .lg\:px-9, .px-lg-9 {
    padding-left: 5rem !important;
    padding-right: 5rem !important;
  }
  .lg\:py-9, .py-lg-9 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
  .lg\:mt-auto, .mt-lg-auto {
    margin-top: auto !important;
  }
  .lg\:me-auto, .me-lg-auto {
    margin-right: auto !important;
  }
  .lg\:mb-auto, .mb-lg-auto {
    margin-bottom: auto !important;
  }
  .lg\:ms-auto, .ms-lg-auto {
    margin-left: auto !important;
  }
  .lg\:mx-auto, .mx-lg-auto {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .lg\:my-auto, .my-lg-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
  .m-lg-auto {
    margin: auto;
  }
}
@media only screen and (min-width: 1200px) {
  .xl\:m-0, .m-xl-0 {
    margin: 0 !important;
  }
  .xl\:m-1, .m-xl-1 {
    margin: 0.25rem !important;
  }
  .xl\:m-2, .m-xl-2 {
    margin: 0.5rem !important;
  }
  .xl\:m-3, .m-xl-3 {
    margin: 1rem !important;
  }
  .xl\:m-4, .m-xl-4 {
    margin: 1.5rem !important;
  }
  .xl\:m-5, .m-xl-5 {
    margin: 3rem !important;
  }
  .xl\:m-6, .m-xl-6 {
    margin: 3.5rem !important;
  }
  .xl\:m-7, .m-xl-7 {
    margin: 4rem !important;
  }
  .xl\:m-8, .m-xl-8 {
    margin: 4.5rem !important;
  }
  .xl\:m-9, .m-xl-9 {
    margin: 5rem !important;
  }
  .xl\:p-0, .p-xl-0 {
    padding: 0 !important;
  }
  .xl\:p-1, .p-xl-1 {
    padding: 0.25rem !important;
  }
  .xl\:p-2, .p-xl-2 {
    padding: 0.5rem !important;
  }
  .xl\:p-3, .p-xl-3 {
    padding: 1rem !important;
  }
  .xl\:p-4, .p-xl-4 {
    padding: 1.5rem !important;
  }
  .xl\:p-5, .p-xl-5 {
    padding: 3rem !important;
  }
  .xl\:p-6, .p-xl-6 {
    padding: 3.5rem !important;
  }
  .xl\:p-7, .p-xl-7 {
    padding: 4rem !important;
  }
  .xl\:p-8, .p-xl-8 {
    padding: 4.5rem !important;
  }
  .xl\:p-9, .p-xl-9 {
    padding: 5rem !important;
  }
  .xl\:mt-0, .mt-xl-0 {
    margin-top: 0 !important;
  }
  .xl\:me-0, .me-xl-0 {
    margin-right: 0 !important;
  }
  .xl\:mb-0, .mb-xl-0 {
    margin-bottom: 0 !important;
  }
  .xl\:ms-0, .ms-xl-0 {
    margin-left: 0 !important;
  }
  .xl\:mt-1, .mt-xl-1 {
    margin-top: 0.25rem !important;
  }
  .xl\:me-1, .me-xl-1 {
    margin-right: 0.25rem !important;
  }
  .xl\:mb-1, .mb-xl-1 {
    margin-bottom: 0.25rem !important;
  }
  .xl\:ms-1, .ms-xl-1 {
    margin-left: 0.25rem !important;
  }
  .xl\:mt-2, .mt-xl-2 {
    margin-top: 0.5rem !important;
  }
  .xl\:me-2, .me-xl-2 {
    margin-right: 0.5rem !important;
  }
  .xl\:mb-2, .mb-xl-2 {
    margin-bottom: 0.5rem !important;
  }
  .xl\:ms-2, .ms-xl-2 {
    margin-left: 0.5rem !important;
  }
  .xl\:mt-3, .mt-xl-3 {
    margin-top: 1rem !important;
  }
  .xl\:me-3, .me-xl-3 {
    margin-right: 1rem !important;
  }
  .xl\:mb-3, .mb-xl-3 {
    margin-bottom: 1rem !important;
  }
  .xl\:ms-3, .ms-xl-3 {
    margin-left: 1rem !important;
  }
  .xl\:mt-4, .mt-xl-4 {
    margin-top: 1.5rem !important;
  }
  .xl\:me-4, .me-xl-4 {
    margin-right: 1.5rem !important;
  }
  .xl\:mb-4, .mb-xl-4 {
    margin-bottom: 1.5rem !important;
  }
  .xl\:ms-4, .ms-xl-4 {
    margin-left: 1.5rem !important;
  }
  .xl\:mt-5, .mt-xl-5 {
    margin-top: 3rem !important;
  }
  .xl\:me-5, .me-xl-5 {
    margin-right: 3rem !important;
  }
  .xl\:mb-5, .mb-xl-5 {
    margin-bottom: 3rem !important;
  }
  .xl\:ms-5, .ms-xl-5 {
    margin-left: 3rem !important;
  }
  .xl\:mt-6, .mt-xl-6 {
    margin-top: 3.5rem !important;
  }
  .xl\:me-6, .me-xl-6 {
    margin-right: 3.5rem !important;
  }
  .xl\:mb-6, .mb-xl-6 {
    margin-bottom: 3.5rem !important;
  }
  .xl\:ms-6, .ms-xl-6 {
    margin-left: 3.5rem !important;
  }
  .xl\:mt-7, .mt-xl-7 {
    margin-top: 4rem !important;
  }
  .xl\:me-7, .me-xl-7 {
    margin-right: 4rem !important;
  }
  .xl\:mb-7, .mb-xl-7 {
    margin-bottom: 4rem !important;
  }
  .xl\:ms-7, .ms-xl-7 {
    margin-left: 4rem !important;
  }
  .xl\:mt-8, .mt-xl-8 {
    margin-top: 4.5rem !important;
  }
  .xl\:me-8, .me-xl-8 {
    margin-right: 4.5rem !important;
  }
  .xl\:mb-8, .mb-xl-8 {
    margin-bottom: 4.5rem !important;
  }
  .xl\:ms-8, .ms-xl-8 {
    margin-left: 4.5rem !important;
  }
  .xl\:mt-9, .mt-xl-9 {
    margin-top: 5rem !important;
  }
  .xl\:me-9, .me-xl-9 {
    margin-right: 5rem !important;
  }
  .xl\:mb-9, .mb-xl-9 {
    margin-bottom: 5rem !important;
  }
  .xl\:ms-9, .ms-xl-9 {
    margin-left: 5rem !important;
  }
  .xl\:pt-0, .pt-xl-0 {
    padding-top: 0 !important;
  }
  .xl\:pe-0, .pe-xl-0 {
    padding-right: 0 !important;
  }
  .xl\:pb-0, .pb-xl-0 {
    padding-bottom: 0 !important;
  }
  .xl\:ps-0, .ps-xl-0 {
    padding-left: 0 !important;
  }
  .xl\:pt-1, .pt-xl-1 {
    padding-top: 0.25rem !important;
  }
  .xl\:pe-1, .pe-xl-1 {
    padding-right: 0.25rem !important;
  }
  .xl\:pb-1, .pb-xl-1 {
    padding-bottom: 0.25rem !important;
  }
  .xl\:ps-1, .ps-xl-1 {
    padding-left: 0.25rem !important;
  }
  .xl\:pt-2, .pt-xl-2 {
    padding-top: 0.5rem !important;
  }
  .xl\:pe-2, .pe-xl-2 {
    padding-right: 0.5rem !important;
  }
  .xl\:pb-2, .pb-xl-2 {
    padding-bottom: 0.5rem !important;
  }
  .xl\:ps-2, .ps-xl-2 {
    padding-left: 0.5rem !important;
  }
  .xl\:pt-3, .pt-xl-3 {
    padding-top: 1rem !important;
  }
  .xl\:pe-3, .pe-xl-3 {
    padding-right: 1rem !important;
  }
  .xl\:pb-3, .pb-xl-3 {
    padding-bottom: 1rem !important;
  }
  .xl\:ps-3, .ps-xl-3 {
    padding-left: 1rem !important;
  }
  .xl\:pt-4, .pt-xl-4 {
    padding-top: 1.5rem !important;
  }
  .xl\:pe-4, .pe-xl-4 {
    padding-right: 1.5rem !important;
  }
  .xl\:pb-4, .pb-xl-4 {
    padding-bottom: 1.5rem !important;
  }
  .xl\:ps-4, .ps-xl-4 {
    padding-left: 1.5rem !important;
  }
  .xl\:pt-5, .pt-xl-5 {
    padding-top: 3rem !important;
  }
  .xl\:pe-5, .pe-xl-5 {
    padding-right: 3rem !important;
  }
  .xl\:pb-5, .pb-xl-5 {
    padding-bottom: 3rem !important;
  }
  .xl\:ps-5, .ps-xl-5 {
    padding-left: 3rem !important;
  }
  .xl\:pt-6, .pt-xl-6 {
    padding-top: 3.5rem !important;
  }
  .xl\:pe-6, .pe-xl-6 {
    padding-right: 3.5rem !important;
  }
  .xl\:pb-6, .pb-xl-6 {
    padding-bottom: 3.5rem !important;
  }
  .xl\:ps-6, .ps-xl-6 {
    padding-left: 3.5rem !important;
  }
  .xl\:pt-7, .pt-xl-7 {
    padding-top: 4rem !important;
  }
  .xl\:pe-7, .pe-xl-7 {
    padding-right: 4rem !important;
  }
  .xl\:pb-7, .pb-xl-7 {
    padding-bottom: 4rem !important;
  }
  .xl\:ps-7, .ps-xl-7 {
    padding-left: 4rem !important;
  }
  .xl\:pt-8, .pt-xl-8 {
    padding-top: 4.5rem !important;
  }
  .xl\:pe-8, .pe-xl-8 {
    padding-right: 4.5rem !important;
  }
  .xl\:pb-8, .pb-xl-8 {
    padding-bottom: 4.5rem !important;
  }
  .xl\:ps-8, .ps-xl-8 {
    padding-left: 4.5rem !important;
  }
  .xl\:pt-9, .pt-xl-9 {
    padding-top: 5rem !important;
  }
  .xl\:pe-9, .pe-xl-9 {
    padding-right: 5rem !important;
  }
  .xl\:pb-9, .pb-xl-9 {
    padding-bottom: 5rem !important;
  }
  .xl\:ps-9, .ps-xl-9 {
    padding-left: 5rem !important;
  }
  .xl\:mx-0, .mx-xl-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .xl\:my-0, .my-xl-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .xl\:mx-1, .mx-xl-1 {
    margin-left: 0.25rem !important;
    margin-right: 0.25rem !important;
  }
  .xl\:my-1, .my-xl-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }
  .xl\:mx-2, .mx-xl-2 {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
  }
  .xl\:my-2, .my-xl-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }
  .xl\:mx-3, .mx-xl-3 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
  }
  .xl\:my-3, .my-xl-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }
  .xl\:mx-4, .mx-xl-4 {
    margin-left: 1.5rem !important;
    margin-right: 1.5rem !important;
  }
  .xl\:my-4, .my-xl-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }
  .xl\:mx-5, .mx-xl-5 {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
  }
  .xl\:my-5, .my-xl-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }
  .xl\:mx-6, .mx-xl-6 {
    margin-left: 3.5rem !important;
    margin-right: 3.5rem !important;
  }
  .xl\:my-6, .my-xl-6 {
    margin-top: 3.5rem !important;
    margin-bottom: 3.5rem !important;
  }
  .xl\:mx-7, .mx-xl-7 {
    margin-left: 4rem !important;
    margin-right: 4rem !important;
  }
  .xl\:my-7, .my-xl-7 {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important;
  }
  .xl\:mx-8, .mx-xl-8 {
    margin-left: 4.5rem !important;
    margin-right: 4.5rem !important;
  }
  .xl\:my-8, .my-xl-8 {
    margin-top: 4.5rem !important;
    margin-bottom: 4.5rem !important;
  }
  .xl\:mx-9, .mx-xl-9 {
    margin-left: 5rem !important;
    margin-right: 5rem !important;
  }
  .xl\:my-9, .my-xl-9 {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
  }
  .xl\:px-0, .px-xl-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .xl\:py-0, .py-xl-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .xl\:px-1, .px-xl-1 {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
  }
  .xl\:py-1, .py-xl-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }
  .xl\:px-2, .px-xl-2 {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  .xl\:py-2, .py-xl-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }
  .xl\:px-3, .px-xl-3 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  .xl\:py-3, .py-xl-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
  .xl\:px-4, .px-xl-4 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
  .xl\:py-4, .py-xl-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }
  .xl\:px-5, .px-xl-5 {
    padding-left: 3rem !important;
    padding-right: 3rem !important;
  }
  .xl\:py-5, .py-xl-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
  .xl\:px-6, .px-xl-6 {
    padding-left: 3.5rem !important;
    padding-right: 3.5rem !important;
  }
  .xl\:py-6, .py-xl-6 {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
  .xl\:px-7, .px-xl-7 {
    padding-left: 4rem !important;
    padding-right: 4rem !important;
  }
  .xl\:py-7, .py-xl-7 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
  .xl\:px-8, .px-xl-8 {
    padding-left: 4.5rem !important;
    padding-right: 4.5rem !important;
  }
  .xl\:py-8, .py-xl-8 {
    padding-top: 4.5rem !important;
    padding-bottom: 4.5rem !important;
  }
  .xl\:px-9, .px-xl-9 {
    padding-left: 5rem !important;
    padding-right: 5rem !important;
  }
  .xl\:py-9, .py-xl-9 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
  .xl\:mt-auto, .mt-xl-auto {
    margin-top: auto !important;
  }
  .xl\:me-auto, .me-xl-auto {
    margin-right: auto !important;
  }
  .xl\:mb-auto, .mb-xl-auto {
    margin-bottom: auto !important;
  }
  .xl\:ms-auto, .ms-xl-auto {
    margin-left: auto !important;
  }
  .xl\:mx-auto, .mx-xl-auto {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .xl\:my-auto, .my-xl-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
  .m-xl-auto {
    margin: auto;
  }
}
.shadow-sm {
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.shadow-lg {
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}

.shadow-page {
  box-shadow: var(--framex-base-color-entry-shadow) !important;
}

.shadow-none {
  box-shadow: none !important;
}

.border {
  border: 1px solid var(--framex-base-color-border) !important;
}

.border-top {
  border-top: 1px solid var(--framex-base-color-border) !important;
}

.border-end {
  border-right: 1px solid var(--framex-base-color-border) !important;
}

.border-bottom {
  border-bottom: 1px solid var(--framex-base-color-border) !important;
}

.border-start {
  border-left: 1px solid var(--framex-base-color-border) !important;
}

.border-solid {
  border-style: solid !important;
}

.border-dashed {
  border-style: dashed !important;
}

.border-dotted {
  border-style: dotted !important;
}

.border-none {
  border-style: none !important;
}

.border-0 {
  border-width: 0px !important;
}

.border-1 {
  border-width: 1px !important;
}

.border-2 {
  border-width: 2px !important;
}

.border-3 {
  border-width: 3px !important;
}

.border-4 {
  border-width: 4px !important;
}

.border-5 {
  border-width: 5px !important;
}

.border-top-0 {
  border-top-width: 0px !important;
}

.border-right-0 {
  border-right-width: 0px !important;
}

.border-bottom-0 {
  border-bottom-width: 0px !important;
}

.border-left-0 {
  border-left-width: 0px !important;
}

.border-top-1 {
  border-top-width: 1px !important;
}

.border-right-1 {
  border-right-width: 1px !important;
}

.border-bottom-1 {
  border-bottom-width: 1px !important;
}

.border-left-1 {
  border-left-width: 1px !important;
}

.border-top-2 {
  border-top-width: 2px !important;
}

.border-right-2 {
  border-right-width: 2px !important;
}

.border-bottom-2 {
  border-bottom-width: 2px !important;
}

.border-left-2 {
  border-left-width: 2px !important;
}

.border-top-3 {
  border-top-width: 3px !important;
}

.border-right-3 {
  border-right-width: 3px !important;
}

.border-bottom-3 {
  border-bottom-width: 3px !important;
}

.border-left-3 {
  border-left-width: 3px !important;
}

.border-top-4 {
  border-top-width: 4px !important;
}

.border-right-4 {
  border-right-width: 4px !important;
}

.border-bottom-4 {
  border-bottom-width: 4px !important;
}

.border-left-4 {
  border-left-width: 4px !important;
}

.border-top-5 {
  border-top-width: 5px !important;
}

.border-right-5 {
  border-right-width: 5px !important;
}

.border-bottom-5 {
  border-bottom-width: 5px !important;
}

.border-left-5 {
  border-left-width: 5px !important;
}

.rounded-sm {
  border-radius: 0.4rem !important;
}

.rounded-top-sm {
  border-top-left-radius: 0.4rem !important;
  border-top-right-radius: 0.4rem !important;
}

.rounded-right-sm {
  border-top-right-radius: 0.4rem !important;
  border-bottom-right-radius: 0.4rem !important;
}

.rounded-bottom-sm {
  border-bottom-left-radius: 0.4rem !important;
  border-bottom-right-radius: 0.4rem !important;
}

.rounded-left-sm {
  border-top-left-radius: 0.4rem !important;
  border-bottom-left-radius: 0.4rem !important;
}

.rounded {
  border-radius: 0.7rem !important;
}

.rounded-top {
  border-top-left-radius: 0.7rem !important;
  border-top-right-radius: 0.7rem !important;
}

.rounded-right {
  border-top-right-radius: 0.7rem !important;
  border-bottom-right-radius: 0.7rem !important;
}

.rounded-bottom {
  border-bottom-left-radius: 0.7rem !important;
  border-bottom-right-radius: 0.7rem !important;
}

.rounded-left {
  border-top-left-radius: 0.7rem !important;
  border-bottom-left-radius: 0.7rem !important;
}

.rounded-lg {
  border-radius: 1rem !important;
}

.rounded-top-lg {
  border-top-left-radius: 1rem !important;
  border-top-right-radius: 1rem !important;
}

.rounded-right-lg {
  border-top-right-radius: 1rem !important;
  border-bottom-right-radius: 1rem !important;
}

.rounded-bottom-lg {
  border-bottom-left-radius: 1rem !important;
  border-bottom-right-radius: 1rem !important;
}

.rounded-left-lg {
  border-top-left-radius: 1rem !important;
  border-bottom-left-radius: 1rem !important;
}

.rounded-circle {
  border-radius: 50% !important;
}

.rounded-bubble-end {
  padding: 0 30px;
  border-radius: 50px 5px 50px 50px;
}

.rounded-bubble-start {
  padding: 0 30px;
  border-radius: 5px 50px 50px 50px;
}

.rounded-bubble-sm {
  border-radius: 20px 3px 20px 20px;
}

.rounded-0 {
  border-radius: 0 !important;
}

.blob-1 {
  border-radius: 67% 33% 61% 39%/47% 30% 70% 53%;
}

.border-primary {
  border-color: #2563EB !important;
}

.border-sky {
  border-color: #60A5FA !important;
}

.border-blue {
  border-color: #3B82F6 !important;
}

.border-purple {
  border-color: #A855F7 !important;
}

.border-violet {
  border-color: hsl(298, 69%, 48%) !important;
}

.border-pink {
  border-color: hsl(0, 91%, 71%) !important;
}

.border-red {
  border-color: hsl(0, 84%, 60%) !important;
}

.border-yellow {
  border-color: #FACC15 !important;
}

.border-orange {
  border-color: #F97316 !important;
}

.border-green {
  border-color: #22C55E !important;
}

.border-teal {
  border-color: hsl(169, 74%, 37%) !important;
}

.border-bordo {
  border-color: hsl(342, 72%, 31%) !important;
}

.border-navy {
  border-color: hsl(12, 6%, 15%) !important;
}

.border-ash {
  border-color: hsl(216, 12%, 84%) !important;
}

.border-dark {
  border-color: hsl(215, 28%, 17%) !important;
}

.border-gray-50 {
  border-color: hsl(180, 11%, 96%) !important;
}

.border-gray-100 {
  border-color: hsl(192, 16%, 94%) !important;
}

.border-gray-200 {
  border-color: hsl(200, 12%, 85%) !important;
}

.border-gray-300 {
  border-color: hsl(201, 11%, 75%) !important;
}

.border-gray-400 {
  border-color: hsl(202, 9%, 58%) !important;
}

.border-gray-500 {
  border-color: hsl(207, 9%, 42%) !important;
}

.border-gray-600 {
  border-color: hsl(209, 15%, 36%) !important;
}

.border-gray-700 {
  border-color: hsl(211, 23%, 28%) !important;
}

.border-gray-800 {
  border-color: hsl(214, 33%, 21%) !important;
}

.border-gray-900 {
  border-color: hsl(217, 46%, 15%) !important;
}

.border-gray-950 {
  border-color: hsl(218, 61%, 8%) !important;
}

.w-25 {
  width: 25% !important;
}

.w-50 {
  width: 50% !important;
}

.w-75 {
  width: 75% !important;
}

.w-100 {
  width: 100% !important;
}

.w-auto {
  width: auto !important;
}

.h-25 {
  height: 25% !important;
}

.h-50 {
  height: 50% !important;
}

.h-75 {
  height: 75% !important;
}

.h-100 {
  height: 100% !important;
}

.h-auto {
  height: auto !important;
}

@media only screen and (min-width: 768px) {
  .w-md-25 {
    width: 25% !important;
  }
  .w-md-50 {
    width: 50% !important;
  }
  .w-md-75 {
    width: 75% !important;
  }
  .w-md-100 {
    width: 100% !important;
  }
  .w-md-auto {
    width: auto !important;
  }
  .h-md-25 {
    height: 25% !important;
  }
  .h-md-50 {
    height: 50% !important;
  }
  .h-md-75 {
    height: 75% !important;
  }
  .h-md-100 {
    height: 100% !important;
  }
  .h-md-auto {
    height: auto !important;
  }
}
@media only screen and (min-width: 992px) {
  .w-lg-25 {
    width: 25% !important;
  }
  .w-lg-50 {
    width: 50% !important;
  }
  .w-lg-75 {
    width: 75% !important;
  }
  .w-lg-100 {
    width: 100% !important;
  }
  .w-lg-auto {
    width: auto !important;
  }
  .h-lg-25 {
    height: 25% !important;
  }
  .h-lg-50 {
    height: 50% !important;
  }
  .h-lg-75 {
    height: 75% !important;
  }
  .h-lg-100 {
    height: 100% !important;
  }
  .h-lg-auto {
    height: auto !important;
  }
}
@media only screen and (min-width: 1200px) {
  .w-xl-25 {
    width: 25% !important;
  }
  .w-xl-50 {
    width: 50% !important;
  }
  .w-xl-75 {
    width: 75% !important;
  }
  .w-xl-100 {
    width: 100% !important;
  }
  .w-xl-auto {
    width: auto !important;
  }
  .h-xl-25 {
    height: 25% !important;
  }
  .h-xl-50 {
    height: 50% !important;
  }
  .h-xl-75 {
    height: 75% !important;
  }
  .h-xl-100 {
    height: 100% !important;
  }
  .h-xl-auto {
    height: auto !important;
  }
}
.w-max-100 {
  max-width: 100% !important;
}

.h-max-100 {
  max-height: 100% !important;
}

.wh-100 {
  width: 100% !important;
  height: 100% !important;
}

.flex-row {
  flex-direction: row;
}
.flex-row-reverse {
  flex-direction: row-reverse;
}
.flex-column {
  flex-direction: column;
}
.flex-column-reverse {
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex-wrap-reverse {
  flex-wrap: wrap-reverse;
}
.flex-nowrap {
  flex-wrap: nowrap;
}

.justify-content-start {
  justify-content: flex-start;
}

.justify-content-end {
  justify-content: flex-end;
}

.justify-content-center {
  justify-content: center;
}

.justify-content-between {
  justify-content: space-between;
}

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

.justify-content-evenly {
  justify-content: space-evenly;
}

.align-items-start {
  align-items: flex-start;
}

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

.align-items-end {
  align-items: flex-end;
}

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

.align-items-center {
  align-items: center;
}

.align-self-center {
  align-self: center;
}

.align-items-baseline {
  align-items: baseline;
}

.align-self-baseline {
  align-self: baseline;
}

.align-items-stretch {
  align-items: stretch;
}

.align-self-stretch {
  align-self: stretch;
}

.align-content-start {
  align-content: flex-start;
}

.align-content-end {
  align-content: flex-end;
}

.align-content-center {
  align-content: center;
}

.align-content-stretch {
  align-content: stretch;
}

.align-content-between {
  align-content: space-between;
}

.align-content-around {
  align-content: space-around;
}

@media only screen and (min-width: 768px) {
  .md\:flex-row, .flex-md-row {
    flex-direction: row;
  }
  .md\:flex-row-reverse, .flex-md-row-reverse {
    flex-direction: row-reverse;
  }
  .md\:flex-column, .flex-md-column {
    flex-direction: column;
  }
  .md\:flex-column-reverse, .flex-md-column-reverse {
    flex-direction: column-reverse;
  }
  .md\:flex-wrap, .flex-md-wrap {
    flex-wrap: wrap;
  }
  .md\:flex-wrap-reverse, .flex-md-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .md\:flex-nowrap, .flex-md-nowrap {
    flex-wrap: nowrap;
  }
  .md\:justify-content-start, .justify-content-md-start {
    justify-content: flex-start;
  }
  .md\:justify-content-end, .justify-content-md-end {
    justify-content: flex-end;
  }
  .md\:justify-content-center, .justify-content-md-center {
    justify-content: center;
  }
  .md\:justify-content-between, .justify-content-md-between {
    justify-content: space-between;
  }
  .md\:justify-content-around, .justify-content-md-around {
    justify-content: space-around;
  }
  .md\:justify-content-evenly, .justify-content-md-evenly {
    justify-content: space-evenly;
  }
  .md\:align-items-start, .align-items-md-start {
    align-items: flex-start;
  }
  .md\:align-self-start, .align-self-md-start {
    align-self: flex-start;
  }
  .md\:align-items-end, .align-items-md-end {
    align-items: flex-end;
  }
  .md\:align-self-end, .align-self-md-end {
    align-self: flex-end;
  }
  .md\:align-items-center, .align-items-md-center {
    align-items: center;
  }
  .md\:align-self-center, .align-self-md-center {
    align-self: center;
  }
  .md\:align-items-baseline, .align-items-md-baseline {
    align-items: baseline;
  }
  .md\:align-self-baseline, .align-self-md-baseline {
    align-self: baseline;
  }
  .md\:align-items-stretch, .align-items-md-stretch {
    align-items: stretch;
  }
  .md\:align-self-stretch, .align-self-md-stretch {
    align-self: stretch;
  }
  .md\:align-content-start, .align-content-md-start {
    align-content: flex-start;
  }
  .md\:align-content-end, .align-content-md-end {
    align-content: flex-end;
  }
  .md\:align-content-center, .align-content-md-center {
    align-content: center;
  }
  .md\:align-content-stretch, .align-content-md-stretch {
    align-content: stretch;
  }
  .md\:align-content-between, .align-content-md-between {
    align-content: space-between;
  }
  .md\:align-content-around, .align-content-md-around {
    align-content: space-around;
  }
}
@media only screen and (min-width: 992px) {
  .lg\:flex-row, .flex-lg-row {
    flex-direction: row;
  }
  .lg\:flex-row-reverse, .flex-lg-row-reverse {
    flex-direction: row-reverse;
  }
  .lg\:flex-column, .flex-lg-column {
    flex-direction: column;
  }
  .lg\:flex-column-reverse, .flex-lg-column-reverse {
    flex-direction: column-reverse;
  }
  .lg\:flex-wrap, .flex-lg-wrap {
    flex-wrap: wrap;
  }
  .lg\:flex-wrap-reverse, .flex-lg-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .lg\:flex-nowrap, .flex-lg-nowrap {
    flex-wrap: nowrap;
  }
  .lg\:justify-content-start, .justify-content-lg-start {
    justify-content: flex-start;
  }
  .lg\:justify-content-end, .justify-content-lg-end {
    justify-content: flex-end;
  }
  .lg\:justify-content-center, .justify-content-lg-center {
    justify-content: center;
  }
  .lg\:justify-content-between, .justify-content-lg-between {
    justify-content: space-between;
  }
  .lg\:justify-content-around, .justify-content-lg-around {
    justify-content: space-around;
  }
  .lg\:justify-content-evenly, .justify-content-lg-evenly {
    justify-content: space-evenly;
  }
  .lg\:align-items-start, .align-items-lg-start {
    align-items: flex-start;
  }
  .lg\:align-self-start, .align-self-lg-start {
    align-self: flex-start;
  }
  .lg\:align-items-end, .align-items-lg-end {
    align-items: flex-end;
  }
  .lg\:align-self-end, .align-self-lg-end {
    align-self: flex-end;
  }
  .lg\:align-items-center, .align-items-lg-center {
    align-items: center;
  }
  .lg\:align-self-center, .align-self-lg-center {
    align-self: center;
  }
  .lg\:align-items-baseline, .align-items-lg-baseline {
    align-items: baseline;
  }
  .lg\:align-self-baseline, .align-self-lg-baseline {
    align-self: baseline;
  }
  .lg\:align-items-stretch, .align-items-lg-stretch {
    align-items: stretch;
  }
  .lg\:align-self-stretch, .align-self-lg-stretch {
    align-self: stretch;
  }
  .lg\:align-content-start, .align-content-lg-start {
    align-content: flex-start;
  }
  .lg\:align-content-end, .align-content-lg-end {
    align-content: flex-end;
  }
  .lg\:align-content-center, .align-content-lg-center {
    align-content: center;
  }
  .lg\:align-content-stretch, .align-content-lg-stretch {
    align-content: stretch;
  }
  .lg\:align-content-between, .align-content-lg-between {
    align-content: space-between;
  }
  .lg\:align-content-around, .align-content-lg-around {
    align-content: space-around;
  }
}
@media only screen and (min-width: 1200px) {
  .xl\:flex-row, .flex-xl-row {
    flex-direction: row;
  }
  .xl\:flex-row-reverse, .flex-xl-row-reverse {
    flex-direction: row-reverse;
  }
  .xl\:flex-column, .flex-xl-column {
    flex-direction: column;
  }
  .xl\:flex-column-reverse, .flex-xl-column-reverse {
    flex-direction: column-reverse;
  }
  .xl\:flex-wrap, .flex-xl-wrap {
    flex-wrap: wrap;
  }
  .xl\:flex-wrap-reverse, .flex-xl-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .xl\:flex-nowrap, .flex-xl-nowrap {
    flex-wrap: nowrap;
  }
  .xl\:justify-content-start, .justify-content-xl-start {
    justify-content: flex-start;
  }
  .xl\:justify-content-end, .justify-content-xl-end {
    justify-content: flex-end;
  }
  .xl\:justify-content-center, .justify-content-xl-center {
    justify-content: center;
  }
  .xl\:justify-content-between, .justify-content-xl-between {
    justify-content: space-between;
  }
  .xl\:justify-content-around, .justify-content-xl-around {
    justify-content: space-around;
  }
  .xl\:justify-content-evenly, .justify-content-xl-evenly {
    justify-content: space-evenly;
  }
  .xl\:align-items-start, .align-items-xl-start {
    align-items: flex-start;
  }
  .xl\:align-self-start, .align-self-xl-start {
    align-self: flex-start;
  }
  .xl\:align-items-end, .align-items-xl-end {
    align-items: flex-end;
  }
  .xl\:align-self-end, .align-self-xl-end {
    align-self: flex-end;
  }
  .xl\:align-items-center, .align-items-xl-center {
    align-items: center;
  }
  .xl\:align-self-center, .align-self-xl-center {
    align-self: center;
  }
  .xl\:align-items-baseline, .align-items-xl-baseline {
    align-items: baseline;
  }
  .xl\:align-self-baseline, .align-self-xl-baseline {
    align-self: baseline;
  }
  .xl\:align-items-stretch, .align-items-xl-stretch {
    align-items: stretch;
  }
  .xl\:align-self-stretch, .align-self-xl-stretch {
    align-self: stretch;
  }
  .xl\:align-content-start, .align-content-xl-start {
    align-content: flex-start;
  }
  .xl\:align-content-end, .align-content-xl-end {
    align-content: flex-end;
  }
  .xl\:align-content-center, .align-content-xl-center {
    align-content: center;
  }
  .xl\:align-content-stretch, .align-content-xl-stretch {
    align-content: stretch;
  }
  .xl\:align-content-between, .align-content-xl-between {
    align-content: space-between;
  }
  .xl\:align-content-around, .align-content-xl-around {
    align-content: space-around;
  }
}
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.text-start {
  text-align: left !important;
}

.text-end {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

.text-wrap {
  white-space: normal !important;
}

.text-nowrap {
  white-space: nowrap !important;
}

.text-break {
  word-break: break-word !important;
  word-wrap: break-word !important;
}

.text-lowercase {
  text-transform: lowercase !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-capitalize {
  text-transform: capitalize !important;
}

.text-decoration-none {
  text-decoration: none !important;
}

.text-decoration-underline {
  text-decoration: underline !important;
}

.text-decoration-line-through {
  text-decoration: line-through !important;
}

.lh-1 {
  line-height: 1 !important;
}

.lh-sm {
  line-height: 1.25 !important;
}

.lh-base {
  line-height: 1.5 !important;
}

.lh-lg {
  line-height: 2 !important;
}

.text-reset {
  color: inherit !important;
}

@media only screen and (min-width: 768px) {
  .text-start {
    text-align: left !important;
  }
  .text-end {
    text-align: right !important;
  }
  .text-center {
    text-align: center !important;
  }
}
@media only screen and (min-width: 992px) {
  .text-start {
    text-align: left !important;
  }
  .text-end {
    text-align: right !important;
  }
  .text-center {
    text-align: center !important;
  }
}
@media only screen and (min-width: 1200px) {
  .text-start {
    text-align: left !important;
  }
  .text-end {
    text-align: right !important;
  }
  .text-center {
    text-align: center !important;
  }
}
.opacity-0 {
  opacity: 0;
}
.opacity-5 {
  opacity: 0.05;
}
.opacity-10 {
  opacity: 0.1;
}
.opacity-25 {
  opacity: 0.25;
}
.opacity-50 {
  opacity: 0.5;
}
.opacity-75 {
  opacity: 0.75;
}
.opacity-100 {
  opacity: 1;
}

.ratio-21by9::before {
  display: block;
  content: "";
  padding-top: 42.857143%;
}
.ratio-16by9::before {
  display: block;
  content: "";
  padding-top: 56.25%;
}
.ratio-4by3::before {
  display: block;
  content: "";
  padding-top: 75%;
}
.ratio-1by1::before {
  display: block;
  content: "";
  padding-top: 100%;
}

.cursor-default {
  cursor: default;
}
.cursor-grab {
  cursor: grab;
}
.cursor-pointer {
  cursor: pointer;
}
.cursor-move {
  cursor: move;
}
.cursor-not-allowed {
  cursor: not-allowed;
}
.cursor-progress {
  cursor: progress;
}
.cursor-help {
  cursor: help;
}
.cursor-crosshair {
  cursor: crosshair;
}

ul li a {
  transition: linear 0.1s;
}
ul[class*=" list-"], ul[class^=list-] {
  padding: 0;
}
ul.list-unstyled li, ul.list-dash li, ul.list-icon li {
  list-style-type: none;
}
ul.list-dash li:before {
  content: "-";
  padding-right: 7px;
}
ul.list-dash li a:hover {
  padding-left: 3px;
}
ul.list-dash li ul, ul.list-dash li ol {
  padding-left: 40px;
}
ul[class*=" list-inline"] li, ul[class^=list-inline] li {
  display: inline-block;
}
ul.list-inline {
  margin-right: -7px;
  margin-left: -7px;
}
ul.list-inline li {
  padding: 0 7px;
}
ul.list-inline-sm {
  margin-right: -3px;
  margin-left: -3px;
}
ul.list-inline-sm li {
  padding: 0 3px;
}
ul.list-inline-lg {
  margin-right: -14px;
  margin-left: -14px;
}
ul.list-inline-lg li {
  padding: 0 14px;
}
ul.list-inline-dash li:after {
  content: "-";
}
ul.list-inline-slash li:after {
  content: "/";
}
ul.list-inline-vbar li:after {
  content: "|";
}
ul.list-inline-dash li:after, ul.list-inline-slash li:after, ul.list-inline-vbar li:after {
  padding: 0 3px 0 6px;
}
ul.list-inline-dash li:last-child:after, ul.list-inline-slash li:last-child:after, ul.list-inline-vbar li:last-child:after {
  content: "";
  padding: 0;
}
ul.list-icon li {
  position: relative;
  padding-left: 22px;
}
ul.list-icon li:before {
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
ul.list-icon li a:hover {
  padding-left: 3px;
}
ul.list-icon li ul, ul.list-icon li ol {
  padding-left: 40px;
}
ul.list-icon.list-icon-check li:before {
  font-family: akar-icons !important;
  content: "\f153";
}
ul.list-icon.list-icon-close li:before {
  font-family: akar-icons !important;
  content: "\f00d";
}
ul.list-icon.list-icon-plus li:before {
  font-family: akar-icons !important;
  content: "\f16e";
}
ul.list-icon.list-icon-cevron li:before {
  font-family: akar-icons !important;
  content: "\f15a";
}
ul.list-icon.list-icon-download li:before {
  font-family: akar-icons !important;
  content: "\f1a0";
}
ul.list-icon.list-icon-caret li:before {
  font-family: akar-icons !important;
  content: "\f28a";
}
ul.list-icon.list-icon-ratio li:before {
  font-family: akar-icons !important;
  content: "\f23b";
}

ol {
  margin: 0 0 -7px;
}
ol li {
  margin: 0 0 7px;
}
ol li ul, ol li ol {
  margin-top: 7px;
}
ol.list-ordered {
  list-style: none;
  counter-reset: custom-counter;
  padding-left: 0;
}
ol.list-ordered li {
  position: relative;
  padding-left: 34px;
  counter-increment: custom-counter;
}
ol.list-ordered li::before {
  content: counter(custom-counter);
}
ol.list-ordered li ol {
  list-style: none;
  padding-left: 0;
}
ol.list-ordered.style-2 li::before, ol.list-ordered.style-3 li::before, ol.list-ordered.style-4 li::before, ol.list-ordered.style-5 li::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  font-size: 13px;
  line-height: 24px;
  text-align: center;
}
ol.list-ordered.style-2 li::before {
  background: var(--framex-graycolors-color-gray-200);
  color: var(--framex-graycolors-color-gray-900);
}
ol.list-ordered.style-3 li::before {
  background: var(--framex-graycolors-color-gray-900);
  color: var(--framex-graycolors-color-gray-100);
}
ol.list-ordered.style-4 li::before {
  background: var(--framex-base-color-primary);
  color: var(--framex-graycolors-color-gray-50);
}
ol.list-ordered.style-5 li::before {
  background: var(--framex-base-color-secondary);
  color: var(--framex-graycolors-color-gray-50);
}

div[class^=bg-black] ol.list-ordered.style-2 li::before, div[class*=" bg-black"] ol.list-ordered.style-2 li::before, div[class^=bg-dark] ol.list-ordered.style-2 li::before, div[class*=" bg-dark"] ol.list-ordered.style-2 li::before {
  background: var(--framex-graycolors-color-gray-200);
  color: var(--framex-base-color-white);
}
div[class^=bg-black] ol.list-ordered.style-3 li::before, div[class*=" bg-black"] ol.list-ordered.style-3 li::before, div[class^=bg-dark] ol.list-ordered.style-3 li::before, div[class*=" bg-dark"] ol.list-ordered.style-3 li::before {
  background: var(--framex-base-color-white);
  color: var(--framex-graycolors-color-gray-900);
}
div[class^=bg-black] ol.list-ordered.style-4 li::before, div[class*=" bg-black"] ol.list-ordered.style-4 li::before, div[class^=bg-dark] ol.list-ordered.style-4 li::before, div[class*=" bg-dark"] ol.list-ordered.style-4 li::before {
  border-color: var(--framex-graycolors-color-gray-300);
  color: var(--framex-graycolors-color-gray-100);
}
div[class^=bg-black] ol.list-ordered.style-5 li::before, div[class*=" bg-black"] ol.list-ordered.style-5 li::before, div[class^=bg-dark] ol.list-ordered.style-5 li::before, div[class*=" bg-dark"] ol.list-ordered.style-5 li::before {
  border-color: var(--framex-base-color-white);
  color: var(--framex-base-color-white);
}

@media only screen and (max-width: 767.999px) {
  ol {
    margin: 0 0 -5px;
  }
  ol li {
    margin: 0 0 5px;
  }
  ul {
    margin: 0 0 -5px;
  }
  ul li {
    margin: 0 0 5px;
  }
  ul li ul, ul li ol {
    margin-top: 5px;
  }
  ul.list-dash li:before {
    content: "-";
    padding-right: 6px;
  }
  ul.list-dash li a:hover {
    padding-left: 2px;
  }
  ul.list-dash li ul, ul.list-dash li ol {
    padding-left: 30px;
  }
  ul.list-inline-lg {
    margin-right: -12px;
    margin-left: -12px;
  }
  ul.list-inline-lg li {
    padding: 0 12px;
  }
  ul.list-inline {
    margin-right: -6px;
    margin-left: -6px;
  }
  ul.list-inline li {
    padding: 0 6px;
  }
  ul.list-inline-sm {
    margin-right: -2px;
    margin-left: -2px;
  }
  ul.list-inline-sm li {
    padding: 0 2px;
  }
}
.clear-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.stretched-link::after {
  position: absolute;
  inset-block: 0;
  inset-inline: 0;
  cursor: pointer;
  content: "";
}

.f-icon {
  font-size: 28px;
  height: 55px;
  width: 55px;
  line-height: 55px;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  border-radius: 50px;
}

.code-wrapper {
  margin-bottom: 0;
  position: relative;
}
.code-wrapper .btn-clipboard {
  font-family: inherit;
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  cursor: pointer;
  transform: none;
  font-size: 0.6rem;
  padding: 0.1rem 0.45rem 0.1rem;
  z-index: 3;
}
.code-wrapper pre {
  margin-bottom: 0;
}

pre[class*=language-] {
  position: relative;
  padding-top: 2rem;
}
pre[class*=language-]:focus {
  outline: none;
}

:not(pre) > code[class*=language-],
pre[class*=language-],
pre {
  margin: 0;
  background: none;
  padding: 2rem;
  font-size: 1rem;
}

#scrollTopButton {
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  transition: all 500ms;
  z-index: 9999;
  width: 2rem;
  height: 2rem;
  background-color: black;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: white;
  cursor: pointer;
  transform: translateY(100px);
}
@media only screen and (min-width: 768px) {
  #scrollTopButton {
    width: 3rem;
    height: 3rem;
    bottom: 2rem;
    right: 2rem;
    font-size: 1.375rem;
  }
}
#scrollTopButton.scrolltop-show {
  transform: translateY(0);
}
#scrollTopButton.scrolltop-hide {
  transform: translateY(100px);
}

@media print {
  .pagebreak {
      clear: both;
      page-break-after: always;
  }
}