:root {
  --colors-base-white: #ffffff;
  --colors-base-black: #000000;
  --colors-gray-light-mode-25: #fdfdfd;
  --colors-gray-light-mode-50: #fafafa;
  --colors-gray-light-mode-100: #f5f5f5;
  --colors-gray-light-mode-200: #e9eaeb;
  --colors-gray-light-mode-300: #d5d7da;
  --colors-gray-light-mode-400: #a4a7ae;
  --colors-gray-light-mode-500: #717680;
  --colors-gray-light-mode-600: #535862;
  --colors-gray-light-mode-700: #414651;
  --colors-gray-light-mode-800: #252b37;
  --colors-gray-light-mode-900: #181d27;
  --colors-gray-light-mode-950: #0a0d12;
  --colors-brand-25: #e7fffd;
  --colors-brand-50: #d0fffa;
  --colors-brand-100: #99fffa;
  --colors-brand-200: #06f8f0;
  --colors-brand-300: #0ddecd;
  --colors-brand-400: #0fb9a2;
  --colors-brand-500: #159e87;
  --colors-brand-600: #1c7e6c;
  --colors-brand-700: #1f6859;
  --colors-brand-800: #1e5448;
  --colors-brand-900: #1a4539;
  --colors-brand-950: #0e2e26;
  --colors-success-25: #f6fef9;
  --colors-green-25: #f6fef9;
  --colors-success-50: #ecfdf3;
  --colors-success-100: #dcfae6;
  --colors-success-200: #abefc6;
  --colors-success-300: #75e0a7;
  --colors-success-400: #47cd89;
  --colors-success-500: #17b26a;
  --colors-success-600: #079455;
  --colors-success-700: #067647;
  --colors-success-800: #085d3a;
  --colors-success-900: #074d31;
  --colors-success-950: #053321;
  --spacing-0-0px: 0rem;
  --spacing-05-2px: 0.125rem;
  --spacing-1-4px: 0.25rem;
  --spacing-2-8px: 0.5rem;
  --spacing-3-12px: 0.75rem;
  --spacing-4-16px: 1rem;
  --spacing-5-20px: 1.25rem;
  --spacing-6-24px: 1.5rem;
  --spacing-8-32px: 2rem;
  --spacing-10-40px: 2.5rem;
  --spacing-12-48px: 3rem;
  --spacing-16-64px: 4rem;
  --spacing-20-80px: 5rem;
  --spacing-24-96px: 6rem;
  --spacing-32-128px: 8rem;
  --spacing-40-160px: 10rem;
  --spacing-48-192px: 12rem;
  --spacing-56-224px: 14rem;
  --spacing-64-256px: 16rem;
  --spacing-96-384px: 24rem;
  --spacing-80-320px: 20rem;
  --spacing-120-480px: 30rem;
  --spacing-160-640px: 40rem;
  --spacing-192-768px: 48rem;
  --spacing-256-1024px: 64rem;
  --spacing-320-1280px: 80rem;
  --spacing-360-1440px: 90rem;
  --spacing-400-1600px: 100rem;
  --spacing-480-1920px: 120rem;
  --spacing-15-6px: 0.375rem;
  --colors-base-transparent: #ffffff;
  --spacing-140-560px: 35rem;
  --spacing-180-720px: 45rem;

  --spacing-none: var(--spacing-0-0px);
  --spacing-xxs: var(--spacing-05-2px);
  --spacing-xs: var(--spacing-1-4px);
  --spacing-md: var(--spacing-2-8px);
  --spacing-lg: var(--spacing-3-12px);
  --spacing-xl: var(--spacing-4-16px);
  --spacing-2xl: var(--spacing-5-20px);
  --spacing-3xl: var(--spacing-6-24px);
  --spacing-4xl: var(--spacing-8-32px);
  --spacing-6xl: var(--spacing-12-48px);
  --spacing-7xl: var(--spacing-16-64px);
  --spacing-8xl: var(--spacing-20-80px);
  --spacing-9xl: var(--spacing-24-96px);
  --spacing-10xl: var(--spacing-32-128px);
  --spacing-11xl: var(--spacing-40-160px);
  --spacing-sm: var(--spacing-15-6px);
  --spacing-5xl: var(--spacing-10-40px);

  --font-size-display-xs: 1.5rem;
  --font-size-display-sm: 1.875rem;
  --font-size-display-md: 2.25rem;
  --font-size-display-lg: 3rem;
  --font-size-display-xl: 3.75rem;
  --font-size-display-2xl: 4.5rem;

  --line-height-display-xs: 2rem;
  --line-height-display-sm: 2.375rem;
  --line-height-display-md: 2.75rem;
  --line-height-display-lg: 3.75rem;
  --line-height-display-xl: 4.5rem;
  --line-height-display-2xl: 5.625rem;

  --font-size-text-xs: 0.75rem;
  --font-size-text-sm: 0.875rem;
  --font-size-text-md: 1rem;
  --font-size-text-lg: 1.125rem;
  --font-size-text-xl: 1.25rem;

  --line-height-text-xs: 1.125rem;
  --line-height-text-sm: 1.25rem;
  --line-height-text-md: 1.5rem;
  --line-height-text-lg: 1.75rem;
  --line-height-text-xl: 1.875rem;

  --radius-none: 0rem;
  --radius-xxs: 0.125rem;
  --radius-xs: 0.25rem;
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
  --radius-4xl: 1.5rem;
  --radius-full: 624.9375rem;
  --radius-lg: 0.625rem;
  --radius-3xl: 1.25rem;


/* 1. Color modes - Light mode */
  --Component-colors-Alpha-alpha-white-10: #FFFFFF1A;
  --Component-colors-Alpha-alpha-white-20: #FFFFFF33;
  --Component-colors-Alpha-alpha-white-30: #FFFFFF4D;
  --Component-colors-Alpha-alpha-white-40: #FFFFFF66;
  --Component-colors-Alpha-alpha-white-50: #FFFFFF80;
  --Component-colors-Alpha-alpha-white-60: #FFFFFF99;
  --Component-colors-Alpha-alpha-white-70: #FFFFFFB2;
  --Component-colors-Alpha-alpha-white-80: #FFFFFFCC;
  --Component-colors-Alpha-alpha-white-90: #FFFFFFE5;
  --Component-colors-Alpha-alpha-white-100: #FFFFFFFF;
  --Component-colors-Alpha-alpha-black-10: #0000001A;
  --Component-colors-Alpha-alpha-black-20: #00000033;
  --Component-colors-Alpha-alpha-black-30: #0000004D;
  --Component-colors-Alpha-alpha-black-40: #00000066;
  --Component-colors-Alpha-alpha-black-50: #00000080;
  --Component-colors-Alpha-alpha-black-60: #00000099;
  --Component-colors-Alpha-alpha-black-70: #000000B2;
  --Component-colors-Alpha-alpha-black-80: #000000CC;
  --Component-colors-Alpha-alpha-black-90: #000000E5;
  --Component-colors-Alpha-alpha-black-100: #000000FF;
  --Component-colors-Components-App-store-badges-app-store-badge-border: #A6A6A6FF;
  --Component-colors-Components-Avatars-avatar-styles-bg-neutral: #E0E0E0FF;
  --Colors-Effects-Shadows-shadow-xs: #0A0D120D;
  --Colors-Effects-Portfolio-mockups-shadow-main-centre-md: #0A0D1224;
  --Colors-Effects-Portfolio-mockups-shadow-main-centre-lg: #0A0D122E;
  --Colors-Effects-Portfolio-mockups-shadow-overlay-lg: #0A0D121F;
  --Colors-Effects-Portfolio-mockups-shadow-grid-md: #0A0D1214;
  --Colors-Effects-Shadows-shadow-sm_01: #0A0D121A;
  --Colors-Effects-Shadows-shadow-sm_02: #0A0D121A;
  --Colors-Effects-Shadows-shadow-md_01: #0A0D121A;
  --Colors-Effects-Shadows-shadow-md_02: #0A0D120F;
  --Colors-Effects-Shadows-shadow-lg_01: #0A0D1214;
  --Colors-Effects-Shadows-shadow-lg_02: #0A0D1208;
  --Colors-Effects-Shadows-shadow-lg_03: #0A0D120A;
  --Colors-Effects-Shadows-shadow-xl_01: #0A0D1214;
  --Colors-Effects-Shadows-shadow-xl_02: #0A0D1208;
  --Colors-Effects-Shadows-shadow-xl_03: #0A0D120A;
  --Colors-Effects-Shadows-shadow-2xl_01: #0A0D122E;
  --Colors-Effects-Shadows-shadow-2xl_02: #0A0D120A;
  --Colors-Effects-Shadows-shadow-3xl_01: #0A0D1224;
  --Colors-Effects-Shadows-shadow-3xl_02: #0A0D120A;
  --Colors-Effects-Shadows-shadow-skeumorphic-inner: #0A0D120D;
  --Colors-Effects-Shadows-shadow-skeumorphic-inner-border: #0A0D122E;

  --border-skeuemorphic-gradient: rgba(255, 255, 255, 0.12);
  --Colors-Border-border-primary: #D5D7DA;

  --width-xxs: var(--spacing-80-320px);
  --width-xs: var(--spacing-96-384px);
  --width-sm: var(--spacing-120-480px);
  --width-md: var(--spacing-140-560px);
  --width-lg: var(--spacing-160-640px);
  --width-xl: var(--spacing-192-768px);
  --width-2xl: var(--spacing-256-1024px);
  --width-3xl: var(--spacing-320-1280px);
  --width-4xl: var(--spacing-360-1440px);
  --width-5xl: var(--spacing-400-1600px);
  --width-6xl: var(--spacing-480-1920px);
  --paragraph-max-width: var(--spacing-180-720px);
}



/* start::width */
.w-xxs { width: var(--width-xxs) !important;}
.mw-xxs { max-width: var(--width-xxs) !important;}
.min-w-xxs { min-width: var(--width-xxs) !important;}
.w-xs { width: var(--width-xs) !important;}
.mw-xs { max-width: var(--width-xs) !important;}
.min-w-xs { min-width: var(--width-xs) !important;}
.w-sm { width: var(--width-sm) !important;}
.mw-sm { max-width: var(--width-sm) !important;}
.min-w-sm { min-width: var(--width-sm) !important;}
.w-md { width: var(--width-md) !important;}
.mw-md { max-width: var(--width-md) !important;}
.min-w-md { min-width: var(--width-md) !important;}
.w-lg { width: var(--width-lg) !important;}
.mw-lg { max-width: var(--width-lg) !important;}
.min-w-lg { min-width: var(--width-lg) !important;}
.w-xl { width: var(--width-xl) !important;}
.mw-xl { max-width: var(--width-xl) !important;}
.min-w-xl { min-width: var(--width-xl) !important;}
.w-2xl { width: var(--width-2xl) !important;}
.mw-2xl { max-width: var(--width-2xl) !important;}
.min-w-2xl { min-width: var(--width-2xl) !important;}
.w-3xl { width: var(--width-3xl) !important;}
.mw-3xl { max-width: var(--width-3xl) !important;}
.min-w-3xl { min-width: var(--width-3xl) !important;}
.w-4xl { width: var(--width-4xl) !important;}
.mw-4xl { max-width: var(--width-4xl) !important;}
.min-w-4xl { min-width: var(--width-4xl) !important;}
.w-5xl { width: var(--width-5xl) !important;}
.mw-5xl { max-width: var(--width-5xl) !important;}
.min-w-5xl { min-width: var(--width-5xl) !important;}
.w-6xl { width: var(--width-6xl) !important;}
.mw-6xl { max-width: var(--width-6xl) !important;}
.min-w-6xl { min-width: var(--width-6xl) !important;}
/* end::width */


/* start::border radius */
.radius-none { border-radius: var(--radius-none) !important;}
.radius-xxs { border-radius: var(--radius-xxs) !important;}
.radius-xs { border-radius: var(--radius-xs) !important;}
.radius-sm { border-radius: var(--radius-sm) !important;}
.radius-md { border-radius: var(--radius-md) !important;}
.radius-xl { border-radius: var(--radius-xl) !important;}
.radius-2xl { border-radius: var(--radius-2xl) !important;}
.radius-4xl { border-radius: var(--radius-4xl) !important;}
.radius-full { border-radius: var(--radius-full) !important;}
.radius-lg { border-radius: var(--radius-lg) !important;}
.radius-3xl { border-radius: var(--radius-3xl) !important;}
/* end::border radius */

/* start::color brand */
.text-brand-25 { color: var(--colors-brand-25) !important;}
.text-brand-50 { color: var(--colors-brand-50) !important;}
.text-brand-100 { color: var(--colors-brand-100) !important;}
.text-brand-200 { color: var(--colors-brand-200) !important;}
.text-brand-300 { color: var(--colors-brand-300) !important;}
.text-brand-400 { color: var(--colors-brand-400) !important;}
.text-brand-500 { color: var(--colors-brand-500) !important;}
.text-brand-600 { color: var(--colors-brand-600) !important;}
.text-brand-700 { color: var(--colors-brand-700) !important;}
.text-brand-800 { color: var(--colors-brand-800) !important;}
.text-brand-900 { color: var(--colors-brand-900) !important;}
.text-brand-950 { color: var(--colors-brand-950) !important;}
/* end::color brand */

/* start::background brand */
.bg-brand-25 { background-color: var(--colors-brand-25) !important;}
.bg-brand-50 { background-color: var(--colors-brand-50) !important;}
.bg-brand-100 { background-color: var(--colors-brand-100) !important;}
.bg-brand-200 { background-color: var(--colors-brand-200) !important;}
.bg-brand-300 { background-color: var(--colors-brand-300) !important;}
.bg-brand-400 { background-color: var(--colors-brand-400) !important;}
.bg-brand-500 { background-color: var(--colors-brand-500) !important;}
.bg-brand-600 { background-color: var(--colors-brand-600) !important;}
.bg-brand-700 { background-color: var(--colors-brand-700) !important;}
.bg-brand-800 { background-color: var(--colors-brand-800) !important; color: var(--colors-base-white);}
.bg-brand-900 { background-color: var(--colors-brand-900) !important; color: var(--colors-base-white);}
.bg-brand-950 { background-color: var(--colors-brand-950) !important; color: var(--colors-base-white);}
/* end::background brand */

/* start::line hight */
/* text */
.lht-xs { line-height: var(--line-height-text-xs) !important;}
.lht-sm { line-height: var(--line-height-text-sm) !important;}
.lht-md { line-height: var(--line-height-text-md) !important;}
.lht-lg { line-height: var(--line-height-text-lg) !important;}
.lht-xl { line-height: var(--line-height-text-xl) !important;}
.lhd-2xl { line-height: var(--line-height-text-2xl) !important;}


/* display */
.lhd-xs { line-height: var(--line-height-display-xs) !important;}
.lhd-sm { line-height: var(--line-height-display-sm) !important;}
.lhd-md { line-height: var(--line-height-display-md) !important;}
.lhd-lg { line-height: var(--line-height-display-lg) !important;}
.lhd-xl { line-height: var(--line-height-display-xl) !important;}
.lhd-2xl { line-height: var(--line-height-display-2xl) !important;}
/* end::line hight */

/* start::font size */
/* text */
.fst-xs { font-size: var(--font-size-text-xs) !important;}
.fst-sm { font-size: var(--font-size-text-sm) !important;}
.fst-md { font-size: var(--font-size-text-md) !important;}
.fst-lg { font-size: var(--font-size-text-lg) !important;}
.fst-xl { font-size: var(--font-size-text-xl) !important;}

/* display */
.fsd-xs { font-size: var(--font-size-display-xs) !important;}
.fsd-sm { font-size: var(--font-size-display-sm) !important;}
.fsd-md { font-size: var(--font-size-display-md) !important;}
.fsd-lg { font-size: var(--font-size-display-lg) !important;}
.fsd-xl { font-size: var(--font-size-display-xl) !important;}
.fsd-2xl { font-size: var(--font-size-display-2xl) !important;}
/* end::font size */

/* start::border colors */
.border-brand-25  { border-color: var(--colors-brand-25) !important;}
.border-brand-50  { border-color: var(--colors-brand-50) !important;}
.border-brand-100 { border-color: var(--colors-brand-100) !important;}
.border-brand-200 { border-color: var(--colors-brand-200) !important;}
.border-brand-300 { border-color: var(--colors-brand-300) !important;}
.border-brand-400 { border-color: var(--colors-brand-400) !important;}
.border-brand-500 { border-color: var(--colors-brand-500) !important;}
.border-brand-600 { border-color: var(--colors-brand-600) !important;}
.border-brand-700 { border-color: var(--colors-brand-700) !important;}
.border-brand-800 { border-color: var(--colors-brand-800) !important;}
.border-brand-900 { border-color: var(--colors-brand-900) !important;}
.border-brand-950 { border-color: var(--colors-brand-950) !important;}

.border-gray-25  { border-color: var(--colors-gray-light-mode-25) !important;}
.border-gray-50  { border-color: var(--colors-gray-light-mode-50) !important;}
.border-gray-100 { border-color: var(--colors-gray-light-mode-100) !important;}
.border-gray-200 { border-color: var(--colors-gray-light-mode-200) !important;}
.border-gray-300 { border-color: var(--colors-gray-light-mode-300) !important;}
.border-gray-400 { border-color: var(--colors-gray-light-mode-400) !important;}
.border-gray-500 { border-color: var(--colors-gray-light-mode-500) !important;}
.border-gray-600 { border-color: var(--colors-gray-light-mode-600) !important;}
.border-gray-700 { border-color: var(--colors-gray-light-mode-700) !important;}
.border-gray-800 { border-color: var(--colors-gray-light-mode-800) !important;}
.border-gray-900 { border-color: var(--colors-gray-light-mode-900) !important;}
.border-gray-950 { border-color: var(--colors-gray-light-mode-950) !important;}

.border-skeuemorphic-gradient { border-color: var(--border-skeuemorphic-gradient) !important;}
/* end::border colors */

/* start::text colors */
.text-gray-25  { color: var(--colors-gray-light-mode-25) !important;}
.text-gray-50  { color: var(--colors-gray-light-mode-50) !important;}
.text-gray-100 { color: var(--colors-gray-light-mode-100) !important;}
.text-gray-200 { color: var(--colors-gray-light-mode-200) !important;}
.text-gray-300 { color: var(--colors-gray-light-mode-300) !important;}
.text-gray-400 { color: var(--colors-gray-light-mode-400) !important;}
.text-gray-500 { color: var(--colors-gray-light-mode-500) !important;}
.text-gray-600 { color: var(--colors-gray-light-mode-600) !important;}
.text-gray-700 { color: var(--colors-gray-light-mode-700) !important;}
.text-gray-800 { color: var(--colors-gray-light-mode-800) !important;}
.text-gray-900 { color: var(--colors-gray-light-mode-900) !important;}
.text-gray-950 { color: var(--colors-gray-light-mode-950) !important;}
/* hover */
.text-hover-gray-25:hover  { color: var(--colors-gray-light-mode-25) !important;}
.text-hover-gray-50:hover  { color: var(--colors-gray-light-mode-50) !important;}
.text-hover-gray-100:hover { color: var(--colors-gray-light-mode-100) !important;}
.text-hover-gray-200:hover { color: var(--colors-gray-light-mode-200) !important;}
.text-hover-gray-300:hover { color: var(--colors-gray-light-mode-300) !important;}
.text-hover-gray-400:hover { color: var(--colors-gray-light-mode-400) !important;}
.text-hover-gray-500:hover { color: var(--colors-gray-light-mode-500) !important;}
.text-hover-gray-600:hover { color: var(--colors-gray-light-mode-600) !important;}
.text-hover-gray-700:hover { color: var(--colors-gray-light-mode-700) !important;}
.text-hover-gray-800:hover { color: var(--colors-gray-light-mode-800) !important;}
.text-hover-gray-900:hover { color: var(--colors-gray-light-mode-900) !important;}
.text-hover-gray-950:hover { color: var(--colors-gray-light-mode-950) !important;}
/* end::text colors */

/* start::backgroud colors */
.bg-gray-25  { background-color: var(--colors-gray-light-mode-25) !important;}
.bg-gray-50  { background-color: var(--colors-gray-light-mode-50) !important;}
.bg-gray-100 { background-color: var(--colors-gray-light-mode-100) !important;}
.bg-gray-200 { background-color: var(--colors-gray-light-mode-200) !important;}
.bg-gray-300 { background-color: var(--colors-gray-light-mode-300) !important;}
.bg-gray-400 { background-color: var(--colors-gray-light-mode-400) !important;}
.bg-gray-500 { background-color: var(--colors-gray-light-mode-500) !important;}
.bg-gray-600 { background-color: var(--colors-gray-light-mode-600) !important;}
.bg-gray-700 { background-color: var(--colors-gray-light-mode-700) !important;}
.bg-gray-800 { background-color: var(--colors-gray-light-mode-800) !important;}
.bg-gray-900 { background-color: var(--colors-gray-light-mode-900) !important;}
.bg-gray-950 { background-color: var(--colors-gray-light-mode-950) !important;}
/* end::backgroud colors */

/* start::margin */
  .m-none { margin: var(--spacing-none) !important; }
  .mx-none { margin-left: var(--spacing-none) !important; margin-right: var(--spacing-none) !important;}
  .my-none { margin-top: var(--spacing-none) !important; margin-bottom: var(--spacing-none) !important;}
  .mt-none { margin-top: var(--spacing-none) !important; }
  .me-none { margin-right: var(--spacing-none) !important; }
  .mb-none { margin-bottom: var(--spacing-none) !important; }
  .ms-none { margin-left: var(--spacing-none) !important; }
  .m-xxs { margin: var(--spacing-xxs) !important; }
  .mx-xxs { margin-left: var(--spacing-xxs) !important; margin-right: var(--spacing-xxs) !important;}
  .my-xxs { margin-top: var(--spacing-xxs) !important; margin-bottom: var(--spacing-xxs) !important;}
  .mt-xxs { margin-top: var(--spacing-xxs) !important; }
  .me-xxs { margin-right: var(--spacing-xxs) !important; }
  .mb-xxs { margin-bottom: var(--spacing-xxs) !important; }
  .ms-xxs { margin-left: var(--spacing-xxs) !important; }
  .m-xs { margin: var(--spacing-xs) !important; }
  .mx-xs { margin-left: var(--spacing-xs) !important; margin-right: var(--spacing-xs) !important;}
  .my-xs { margin-top: var(--spacing-xs) !important; margin-bottom: var(--spacing-xs) !important;}
  .mt-xs { margin-top: var(--spacing-xs) !important; }
  .me-xs { margin-right: var(--spacing-xs) !important; }
  .mb-xs { margin-bottom: var(--spacing-xs) !important; }
  .ms-xs { margin-left: var(--spacing-xs) !important; }
  .m-md { margin: var(--spacing-md) !important; }
  .mx-md { margin-left: var(--spacing-md) !important; margin-right: var(--spacing-md) !important;}
  .my-md { margin-top: var(--spacing-md) !important; margin-bottom: var(--spacing-md) !important;}
  .mt-md { margin-top: var(--spacing-md) !important; }
  .me-md { margin-right: var(--spacing-md) !important; }
  .mb-md { margin-bottom: var(--spacing-md) !important; }
  .ms-md { margin-left: var(--spacing-md) !important; }
  .m-lg { margin: var(--spacing-lg) !important; }
  .mx-lg { margin-left: var(--spacing-lg) !important; margin-right: var(--spacing-lg) !important;}
  .my-lg { margin-top: var(--spacing-lg) !important; margin-bottom: var(--spacing-lg) !important;}
  .mt-lg { margin-top: var(--spacing-lg) !important; }
  .me-lg { margin-right: var(--spacing-lg) !important; }
  .mb-lg { margin-bottom: var(--spacing-lg) !important; }
  .ms-lg { margin-left: var(--spacing-lg) !important; }
  .m-xl { margin: var(--spacing-xl) !important; }
  .mx-xl { margin-left: var(--spacing-xl) !important; margin-right: var(--spacing-xl) !important;}
  .my-xl { margin-top: var(--spacing-xl) !important; margin-bottom: var(--spacing-xl) !important;}
  .mt-xl { margin-top: var(--spacing-xl) !important; }
  .me-xl { margin-right: var(--spacing-xl) !important; }
  .mb-xl { margin-bottom: var(--spacing-xl) !important; }
  .ms-xl { margin-left: var(--spacing-xl) !important; }
  .m-2xl { margin: var(--spacing-2xl) !important; }
  .mx-2xl { margin-left: var(--spacing-2xl) !important; margin-right: var(--spacing-2xl) !important;}
  .my-2xl { margin-top: var(--spacing-2xl) !important; margin-bottom: var(--spacing-2xl) !important;}
  .mt-2xl { margin-top: var(--spacing-2xl) !important; }
  .me-2xl { margin-right: var(--spacing-2xl) !important; }
  .mb-2xl { margin-bottom: var(--spacing-2xl) !important; }
  .ms-2xl { margin-left: var(--spacing-2xl) !important; }
  .m-3xl { margin: var(--spacing-3xl) !important; }
  .mx-3xl { margin-left: var(--spacing-3xl) !important; margin-right: var(--spacing-3xl) !important;}
  .my-3xl { margin-top: var(--spacing-3xl) !important; margin-bottom: var(--spacing-3xl) !important;}
  .mt-3xl { margin-top: var(--spacing-3xl) !important; }
  .me-3xl { margin-right: var(--spacing-3xl) !important; }
  .mb-3xl { margin-bottom: var(--spacing-3xl) !important; }
  .ms-3xl { margin-left: var(--spacing-3xl) !important; }
  .m-4xl { margin: var(--spacing-4xl) !important; }
  .mx-4xl { margin-left: var(--spacing-4xl) !important; margin-right: var(--spacing-4xl) !important;}
  .my-4xl { margin-top: var(--spacing-4xl) !important; margin-bottom: var(--spacing-4xl) !important;}
  .mt-4xl { margin-top: var(--spacing-4xl) !important; }
  .me-4xl { margin-right: var(--spacing-4xl) !important; }
  .mb-4xl { margin-bottom: var(--spacing-4xl) !important; }
  .ms-4xl { margin-left: var(--spacing-4xl) !important; }
  .m-6xl { margin: var(--spacing-6xl) !important; }
  .mx-6xl { margin-left: var(--spacing-6xl) !important; margin-right: var(--spacing-6xl) !important;}
  .my-6xl { margin-top: var(--spacing-6xl) !important; margin-bottom: var(--spacing-6xl) !important;}
  .mt-6xl { margin-top: var(--spacing-6xl) !important; }
  .me-6xl { margin-right: var(--spacing-6xl) !important; }
  .mb-6xl { margin-bottom: var(--spacing-6xl) !important; }
  .ms-6xl { margin-left: var(--spacing-6xl) !important; }
  .m-7xl { margin: var(--spacing-7xl) !important; }
  .mx-7xl { margin-left: var(--spacing-7xl) !important; margin-right: var(--spacing-7xl) !important;}
  .my-7xl { margin-top: var(--spacing-7xl) !important; margin-bottom: var(--spacing-7xl) !important;}
  .mt-7xl { margin-top: var(--spacing-7xl) !important; }
  .me-7xl { margin-right: var(--spacing-7xl) !important; }
  .mb-7xl { margin-bottom: var(--spacing-7xl) !important; }
  .ms-7xl { margin-left: var(--spacing-7xl) !important; }
  .m-8xl { margin: var(--spacing-8xl) !important; }
  .mx-8xl { margin-left: var(--spacing-8xl) !important; margin-right: var(--spacing-8xl) !important;}
  .my-8xl { margin-top: var(--spacing-8xl) !important; margin-bottom: var(--spacing-8xl) !important;}
  .mt-8xl { margin-top: var(--spacing-8xl) !important; }
  .me-8xl { margin-right: var(--spacing-8xl) !important; }
  .mb-8xl { margin-bottom: var(--spacing-8xl) !important; }
  .ms-8xl { margin-left: var(--spacing-8xl) !important; }
  .m-9xl { margin: var(--spacing-9xl) !important; }
  .mx-9xl { margin-left: var(--spacing-9xl) !important; margin-right: var(--spacing-9xl) !important;}
  .my-9xl { margin-top: var(--spacing-9xl) !important; margin-bottom: var(--spacing-9xl) !important;}
  .mt-9xl { margin-top: var(--spacing-9xl) !important; }
  .me-9xl { margin-right: var(--spacing-9xl) !important; }
  .mb-9xl { margin-bottom: var(--spacing-9xl) !important; }
  .ms-9xl { margin-left: var(--spacing-9xl) !important; }
  .m-10xl { margin: var(--spacing-10xl) !important; }
  .mx-10xl { margin-left: var(--spacing-10xl) !important; margin-right: var(--spacing-10xl) !important;}
  .my-10xl { margin-top: var(--spacing-10xl) !important; margin-bottom: var(--spacing-10xl) !important;}
  .mt-10xl { margin-top: var(--spacing-10xl) !important; }
  .me-10xl { margin-right: var(--spacing-10xl) !important; }
  .mb-10xl { margin-bottom: var(--spacing-10xl) !important; }
  .ms-10xl { margin-left: var(--spacing-10xl) !important; }
  .m-11xl { margin: var(--spacing-11xl) !important; }
  .mx-11xl { margin-left: var(--spacing-11xl) !important; margin-right: var(--spacing-11xl) !important;}
  .my-11xl { margin-top: var(--spacing-11xl) !important; margin-bottom: var(--spacing-11xl) !important;}
  .mt-11xl { margin-top: var(--spacing-11xl) !important; }
  .me-11xl { margin-right: var(--spacing-11xl) !important; }
  .mb-11xl { margin-bottom: var(--spacing-11xl) !important; }
  .ms-11xl { margin-left: var(--spacing-11xl) !important; }
  .m-sm { margin: var(--spacing-sm) !important; }
  .mx-sm { margin-left: var(--spacing-sm) !important; margin-right: var(--spacing-sm) !important;}
  .my-sm { margin-top: var(--spacing-sm) !important; margin-bottom: var(--spacing-sm) !important;}
  .mt-sm { margin-top: var(--spacing-sm) !important; }
  .me-sm { margin-right: var(--spacing-sm) !important; }
  .mb-sm { margin-bottom: var(--spacing-sm) !important; }
  .ms-sm { margin-left: var(--spacing-sm) !important; }
  .m-5xl { margin: var(--spacing-5xl) !important; }
  .mx-5xl { margin-left: var(--spacing-5xl) !important; margin-right: var(--spacing-5xl) !important;}
  .my-5xl { margin-top: var(--spacing-5xl) !important; margin-bottom: var(--spacing-5xl) !important;}
  .mt-5xl { margin-top: var(--spacing-5xl) !important; }
  .me-5xl { margin-right: var(--spacing-5xl) !important; }
  .mb-5xl { margin-bottom: var(--spacing-5xl) !important; }
  .ms-5xl { margin-left: var(--spacing-5xl) !important; }
/* end::margin */

/* start::padding */
  .p-none { padding: var(--spacing-none) !important; }
  .px-none { padding-left: var(--spacing-none) !important; padding-right: var(--spacing-none) !important;}
  .py-none { padding-top: var(--spacing-none) !important; padding-bottom: var(--spacing-none) !important;}
  .pt-none { padding-top: var(--spacing-none) !important; }
  .pe-none { padding-right: var(--spacing-none) !important; }
  .pb-none { padding-bottom: var(--spacing-none) !important; }
  .ps-none { padding-left: var(--spacing-none) !important; }
  .p-xxs { padding: var(--spacing-xxs) !important; }
  .px-xxs { padding-left: var(--spacing-xxs) !important; padding-right: var(--spacing-xxs) !important;}
  .py-xxs { padding-top: var(--spacing-xxs) !important; padding-bottom: var(--spacing-xxs) !important;}
  .pt-xxs { padding-top: var(--spacing-xxs) !important; }
  .pe-xxs { padding-right: var(--spacing-xxs) !important; }
  .pb-xxs { padding-bottom: var(--spacing-xxs) !important; }
  .ps-xxs { padding-left: var(--spacing-xxs) !important; }
  .p-xs { padding: var(--spacing-xs) !important; }
  .px-xs { padding-left: var(--spacing-xs) !important; padding-right: var(--spacing-xs) !important;}
  .py-xs { padding-top: var(--spacing-xs) !important; padding-bottom: var(--spacing-xs) !important;}
  .pt-xs { padding-top: var(--spacing-xs) !important; }
  .pe-xs { padding-right: var(--spacing-xs) !important; }
  .pb-xs { padding-bottom: var(--spacing-xs) !important; }
  .ps-xs { padding-left: var(--spacing-xs) !important; }
  .p-md { padding: var(--spacing-md) !important; }
  .px-md { padding-left: var(--spacing-md) !important; padding-right: var(--spacing-md) !important;}
  .py-md { padding-top: var(--spacing-md) !important; padding-bottom: var(--spacing-md) !important;}
  .pt-md { padding-top: var(--spacing-md) !important; }
  .pe-md { padding-right: var(--spacing-md) !important; }
  .pb-md { padding-bottom: var(--spacing-md) !important; }
  .ps-md { padding-left: var(--spacing-md) !important; }
  .p-lg { padding: var(--spacing-lg) !important; }
  .px-lg { padding-left: var(--spacing-lg) !important; padding-right: var(--spacing-lg) !important;}
  .py-lg { padding-top: var(--spacing-lg) !important; padding-bottom: var(--spacing-lg) !important;}
  .pt-lg { padding-top: var(--spacing-lg) !important; }
  .pe-lg { padding-right: var(--spacing-lg) !important; }
  .pb-lg { padding-bottom: var(--spacing-lg) !important; }
  .ps-lg { padding-left: var(--spacing-lg) !important; }
  .p-xl { padding: var(--spacing-xl) !important; }
  .px-xl { padding-left: var(--spacing-xl) !important; padding-right: var(--spacing-xl) !important;}
  .py-xl { padding-top: var(--spacing-xl) !important; padding-bottom: var(--spacing-xl) !important;}
  .pt-xl { padding-top: var(--spacing-xl) !important; }
  .pe-xl { padding-right: var(--spacing-xl) !important; }
  .pb-xl { padding-bottom: var(--spacing-xl) !important; }
  .ps-xl { padding-left: var(--spacing-xl) !important; }
  .p-2xl { padding: var(--spacing-2xl) !important; }
  .px-2xl { padding-left: var(--spacing-2xl) !important; padding-right: var(--spacing-2xl) !important;}
  .py-2xl { padding-top: var(--spacing-2xl) !important; padding-bottom: var(--spacing-2xl) !important;}
  .pt-2xl { padding-top: var(--spacing-2xl) !important; }
  .pe-2xl { padding-right: var(--spacing-2xl) !important; }
  .pb-2xl { padding-bottom: var(--spacing-2xl) !important; }
  .ps-2xl { padding-left: var(--spacing-2xl) !important; }
  .p-3xl { padding: var(--spacing-3xl) !important; }
  .px-3xl { padding-left: var(--spacing-3xl) !important; padding-right: var(--spacing-3xl) !important;}
  .py-3xl { padding-top: var(--spacing-3xl) !important; padding-bottom: var(--spacing-3xl) !important;}
  .pt-3xl { padding-top: var(--spacing-3xl) !important; }
  .pe-3xl { padding-right: var(--spacing-3xl) !important; }
  .pb-3xl { padding-bottom: var(--spacing-3xl) !important; }
  .ps-3xl { padding-left: var(--spacing-3xl) !important; }
  .p-4xl { padding: var(--spacing-4xl) !important; }
  .px-4xl { padding-left: var(--spacing-4xl) !important; padding-right: var(--spacing-4xl) !important;}
  .py-4xl { padding-top: var(--spacing-4xl) !important; padding-bottom: var(--spacing-4xl) !important;}
  .pt-4xl { padding-top: var(--spacing-4xl) !important; }
  .pe-4xl { padding-right: var(--spacing-4xl) !important; }
  .pb-4xl { padding-bottom: var(--spacing-4xl) !important; }
  .ps-4xl { padding-left: var(--spacing-4xl) !important; }
  .p-6xl { padding: var(--spacing-6xl) !important; }
  .px-6xl { padding-left: var(--spacing-6xl) !important; padding-right: var(--spacing-6xl) !important;}
  .py-6xl { padding-top: var(--spacing-6xl) !important; padding-bottom: var(--spacing-6xl) !important;}
  .pt-6xl { padding-top: var(--spacing-6xl) !important; }
  .pe-6xl { padding-right: var(--spacing-6xl) !important; }
  .pb-6xl { padding-bottom: var(--spacing-6xl) !important; }
  .ps-6xl { padding-left: var(--spacing-6xl) !important; }
  .p-7xl { padding: var(--spacing-7xl) !important; }
  .px-7xl { padding-left: var(--spacing-7xl) !important; padding-right: var(--spacing-7xl) !important;}
  .py-7xl { padding-top: var(--spacing-7xl) !important; padding-bottom: var(--spacing-7xl) !important;}
  .pt-7xl { padding-top: var(--spacing-7xl) !important; }
  .pe-7xl { padding-right: var(--spacing-7xl) !important; }
  .pb-7xl { padding-bottom: var(--spacing-7xl) !important; }
  .ps-7xl { padding-left: var(--spacing-7xl) !important; }
  .p-8xl { padding: var(--spacing-8xl) !important; }
  .px-8xl { padding-left: var(--spacing-8xl) !important; padding-right: var(--spacing-8xl) !important;}
  .py-8xl { padding-top: var(--spacing-8xl) !important; padding-bottom: var(--spacing-8xl) !important;}
  .pt-8xl { padding-top: var(--spacing-8xl) !important; }
  .pe-8xl { padding-right: var(--spacing-8xl) !important; }
  .pb-8xl { padding-bottom: var(--spacing-8xl) !important; }
  .ps-8xl { padding-left: var(--spacing-8xl) !important; }
  .p-9xl { padding: var(--spacing-9xl) !important; }
  .px-9xl { padding-left: var(--spacing-9xl) !important; padding-right: var(--spacing-9xl) !important;}
  .py-9xl { padding-top: var(--spacing-9xl) !important; padding-bottom: var(--spacing-9xl) !important;}
  .pt-9xl { padding-top: var(--spacing-9xl) !important; }
  .pe-9xl { padding-right: var(--spacing-9xl) !important; }
  .pb-9xl { padding-bottom: var(--spacing-9xl) !important; }
  .ps-9xl { padding-left: var(--spacing-9xl) !important; }
  .p-10xl { padding: var(--spacing-10xl) !important; }
  .px-10xl { padding-left: var(--spacing-10xl) !important; padding-right: var(--spacing-10xl) !important;}
  .py-10xl { padding-top: var(--spacing-10xl) !important; padding-bottom: var(--spacing-10xl) !important;}
  .pt-10xl { padding-top: var(--spacing-10xl) !important; }
  .pe-10xl { padding-right: var(--spacing-10xl) !important; }
  .pb-10xl { padding-bottom: var(--spacing-10xl) !important; }
  .ps-10xl { padding-left: var(--spacing-10xl) !important; }
  .p-11xl { padding: var(--spacing-11xl) !important; }
  .px-11xl { padding-left: var(--spacing-11xl) !important; padding-right: var(--spacing-11xl) !important;}
  .py-11xl { padding-top: var(--spacing-11xl) !important; padding-bottom: var(--spacing-11xl) !important;}
  .pt-11xl { padding-top: var(--spacing-11xl) !important; }
  .pe-11xl { padding-right: var(--spacing-11xl) !important; }
  .pb-11xl { padding-bottom: var(--spacing-11xl) !important; }
  .ps-11xl { padding-left: var(--spacing-11xl) !important; }
  .p-sm { padding: var(--spacing-sm) !important; }
  .px-sm { padding-left: var(--spacing-sm) !important; padding-right: var(--spacing-sm) !important;}
  .py-sm { padding-top: var(--spacing-sm) !important; padding-bottom: var(--spacing-sm) !important;}
  .pt-sm { padding-top: var(--spacing-sm) !important; }
  .pe-sm { padding-right: var(--spacing-sm) !important; }
  .pb-sm { padding-bottom: var(--spacing-sm) !important; }
  .ps-sm { padding-left: var(--spacing-sm) !important; }
  .p-5xl { padding: var(--spacing-5xl) !important; }
  .px-5xl { padding-left: var(--spacing-5xl) !important; padding-right: var(--spacing-5xl) !important;}
  .py-5xl { padding-top: var(--spacing-5xl) !important; padding-bottom: var(--spacing-5xl) !important;}
  .pt-5xl { padding-top: var(--spacing-5xl) !important; }
  .pe-5xl { padding-right: var(--spacing-5xl) !important; }
  .pb-5xl { padding-bottom: var(--spacing-5xl) !important; }
  .ps-5xl { padding-left: var(--spacing-5xl) !important; }
/* end::padding */

.shadow-none {
  box-shadow: none !important;
}

.shadow-xs {
  box-shadow: 0 1px 2px 0 var(--Colors-Effects-Shadows-shadow-xs, rgba(10, 13, 18, 0.05)) !important;
}

.shadow-sm {
  box-shadow: 0 1px 3px 0 var(--Colors-Effects-Shadows-shadow-sm_01, rgba(10, 13, 18, 0.10)), 0 1px 2px -1px var(--Colors-Effects-Shadows-shadow-sm_02, rgba(10, 13, 18, 0.10)) !important;
}

.shadow-md {
  box-shadow: 0 4px 6px -1px var(--Colors-Effects-Shadows-shadow-md_01, rgba(10, 13, 18, 0.10)), 0 2px 4px -2px var(--Colors-Effects-Shadows-shadow-md_02, rgba(10, 13, 18, 0.06)) !important;
}

.shadow-lg {
  box-shadow: 0 12px 16px -4px var(--Colors-Effects-Shadows-shadow-lg_01, rgba(10, 13, 18, 0.08)), 0 4px 6px -2px var(--Colors-Effects-Shadows-shadow-lg_02, rgba(10, 13, 18, 0.03)), 0 2px 2px -1px var(--Colors-Effects-Shadows-shadow-lg_03, rgba(10, 13, 18, 0.04)) !important;
}

.shadow-xl {
  box-shadow: 0 20px 24px -4px var(--Colors-Effects-Shadows-shadow-xl_01, rgba(10, 13, 18, 0.08)), 0 8px 8px -4px var(--Colors-Effects-Shadows-shadow-xl_02, rgba(10, 13, 18, 0.03)), 0 3px 3px -1.5px var(--Colors-Effects-Shadows-shadow-xl_03, rgba(10, 13, 18, 0.04)) !important;
}

.shadow-2xl {
  box-shadow: 0 24px 48px -12px var(--Colors-Effects-Shadows-shadow-2xl_01, rgba(10, 13, 18, 0.18)), 0 4px 4px -2px var(--Colors-Effects-Shadows-shadow-2xl_02, rgba(10, 13, 18, 0.04)) !important;
}

.shadow-3xl {
  box-shadow: 0 32px 64px -12px var(--Colors-Effects-Shadows-shadow-3xl_01, rgba(10, 13, 18, 0.14)), 0 5px 5px -2.5px var(--Colors-Effects-Shadows-shadow-3xl_02, rgba(10, 13, 18, 0.04)) !important;
}

.shadow-xs-skeuomorphic {
  box-shadow: 0 0 0 1px var(--Colors-Effects-Shadows-shadow-skeumorphic-inner-border, rgba(10, 13, 18, 0.18)) inset, 0 -2px 0 0 var(--Colors-Effects-Shadows-shadow-skeumorphic-inner, rgba(10, 13, 18, 0.05)) inset, 0 1px 2px 0 var(--Colors-Effects-Shadows-shadow-xs, rgba(10, 13, 18, 0.05)) !important;
}

/* on Medium Screens */
@media (min-width: 768px) {

  /* start::width */
    .w-md-xxs { width: var(--width-xxs) !important;}
    .mw-md-xxs { max-width: var(--width-xxs) !important;}
    .min-md-w-xxs { min-width: var(--width-xxs) !important;}
    .w-md-xs { width: var(--width-xs) !important;}
    .mw-md-xs { max-width: var(--width-xs) !important;}
    .min-md-w-xs { min-width: var(--width-xs) !important;}
    .w-md-sm { width: var(--width-sm) !important;}
    .mw-md-sm { max-width: var(--width-sm) !important;}
    .min-md-w-sm { min-width: var(--width-sm) !important;}
    .w-md-md { width: var(--width-md) !important;}
    .mw-md-md { max-width: var(--width-md) !important;}
    .min-md-w-md { min-width: var(--width-md) !important;}
    .w-md-lg { width: var(--width-lg) !important;}
    .mw-md-lg { max-width: var(--width-lg) !important;}
    .min-md-w-lg { min-width: var(--width-lg) !important;}
    .w-md-xl { width: var(--width-xl) !important;}
    .mw-md-xl { max-width: var(--width-xl) !important;}
    .min-md-w-xl { min-width: var(--width-xl) !important;}
    .w-md-2xl { width: var(--width-2xl) !important;}
    .mw-md-2xl { max-width: var(--width-2xl) !important;}
    .min-md-w-2xl { min-width: var(--width-2xl) !important;}
    .w-md-3xl { width: var(--width-3xl) !important;}
    .mw-md-3xl { max-width: var(--width-3xl) !important;}
    .min-md-w-3xl { min-width: var(--width-3xl) !important;}
    .w-md-4xl { width: var(--width-4xl) !important;}
    .mw-md-4xl { max-width: var(--width-4xl) !important;}
    .min-md-w-4xl { min-width: var(--width-4xl) !important;}
    .w-md-5xl { width: var(--width-5xl) !important;}
    .mw-md-5xl { max-width: var(--width-5xl) !important;}
    .min-md-w-5xl { min-width: var(--width-5xl) !important;}
    .w-md-6xl { width: var(--width-6xl) !important;}
    .mw-md-6xl { max-width: var(--width-6xl) !important;}
    .min-md-w-6xl { min-width: var(--width-6xl) !important;}
  /* end::width */

  /* start::margin */
    .m-md-none { margin: var(--spacing-none) !important; }
    .mx-md-none { margin-left: var(--spacing-none) !important; margin-right: var(--spacing-none) !important;}
    .my-md-none { margin-top: var(--spacing-none) !important; margin-bottom: var(--spacing-none) !important;}
    .mt-md-none { margin-top: var(--spacing-none) !important; }
    .me-md-none { margin-right: var(--spacing-none) !important; }
    .mb-md-none { margin-bottom: var(--spacing-none) !important; }
    .ms-md-none { margin-left: var(--spacing-none) !important; }
    .m-md-xxs { margin: var(--spacing-xxs) !important; }
    .mx-md-xxs { margin-left: var(--spacing-xxs) !important; margin-right: var(--spacing-xxs) !important;}
    .my-md-xxs { margin-top: var(--spacing-xxs) !important; margin-bottom: var(--spacing-xxs) !important;}
    .mt-md-xxs { margin-top: var(--spacing-xxs) !important; }
    .me-md-xxs { margin-right: var(--spacing-xxs) !important; }
    .mb-md-xxs { margin-bottom: var(--spacing-xxs) !important; }
    .ms-md-xxs { margin-left: var(--spacing-xxs) !important; }
    .m-md-xs { margin: var(--spacing-xs) !important; }
    .mx-md-xs { margin-left: var(--spacing-xs) !important; margin-right: var(--spacing-xs) !important;}
    .my-md-xs { margin-top: var(--spacing-xs) !important; margin-bottom: var(--spacing-xs) !important;}
    .mt-md-xs { margin-top: var(--spacing-xs) !important; }
    .me-md-xs { margin-right: var(--spacing-xs) !important; }
    .mb-md-xs { margin-bottom: var(--spacing-xs) !important; }
    .ms-md-xs { margin-left: var(--spacing-xs) !important; }
    .m-md-md { margin: var(--spacing-md) !important; }
    .mx-md-md { margin-left: var(--spacing-md) !important; margin-right: var(--spacing-md) !important;}
    .my-md-md { margin-top: var(--spacing-md) !important; margin-bottom: var(--spacing-md) !important;}
    .mt-md-md { margin-top: var(--spacing-md) !important; }
    .me-md-md { margin-right: var(--spacing-md) !important; }
    .mb-md-md { margin-bottom: var(--spacing-md) !important; }
    .ms-md-md { margin-left: var(--spacing-md) !important; }
    .m-md-lg { margin: var(--spacing-lg) !important; }
    .mx-md-lg { margin-left: var(--spacing-lg) !important; margin-right: var(--spacing-lg) !important;}
    .my-md-lg { margin-top: var(--spacing-lg) !important; margin-bottom: var(--spacing-lg) !important;}
    .mt-md-lg { margin-top: var(--spacing-lg) !important; }
    .me-md-lg { margin-right: var(--spacing-lg) !important; }
    .mb-md-lg { margin-bottom: var(--spacing-lg) !important; }
    .ms-md-lg { margin-left: var(--spacing-lg) !important; }
    .m-md-xl { margin: var(--spacing-xl) !important; }
    .mx-md-xl { margin-left: var(--spacing-xl) !important; margin-right: var(--spacing-xl) !important;}
    .my-md-xl { margin-top: var(--spacing-xl) !important; margin-bottom: var(--spacing-xl) !important;}
    .mt-md-xl { margin-top: var(--spacing-xl) !important; }
    .me-md-xl { margin-right: var(--spacing-xl) !important; }
    .mb-md-xl { margin-bottom: var(--spacing-xl) !important; }
    .ms-md-xl { margin-left: var(--spacing-xl) !important; }
    .m-md-2xl { margin: var(--spacing-2xl) !important; }
    .mx-md-2xl { margin-left: var(--spacing-2xl) !important; margin-right: var(--spacing-2xl) !important;}
    .my-md-2xl { margin-top: var(--spacing-2xl) !important; margin-bottom: var(--spacing-2xl) !important;}
    .mt-md-2xl { margin-top: var(--spacing-2xl) !important; }
    .me-md-2xl { margin-right: var(--spacing-2xl) !important; }
    .mb-md-2xl { margin-bottom: var(--spacing-2xl) !important; }
    .ms-md-2xl { margin-left: var(--spacing-2xl) !important; }
    .m-md-3xl { margin: var(--spacing-3xl) !important; }
    .mx-md-3xl { margin-left: var(--spacing-3xl) !important; margin-right: var(--spacing-3xl) !important;}
    .my-md-3xl { margin-top: var(--spacing-3xl) !important; margin-bottom: var(--spacing-3xl) !important;}
    .mt-md-3xl { margin-top: var(--spacing-3xl) !important; }
    .me-md-3xl { margin-right: var(--spacing-3xl) !important; }
    .mb-md-3xl { margin-bottom: var(--spacing-3xl) !important; }
    .ms-md-3xl { margin-left: var(--spacing-3xl) !important; }
    .m-md-4xl { margin: var(--spacing-4xl) !important; }
    .mx-md-4xl { margin-left: var(--spacing-4xl) !important; margin-right: var(--spacing-4xl) !important;}
    .my-md-4xl { margin-top: var(--spacing-4xl) !important; margin-bottom: var(--spacing-4xl) !important;}
    .mt-md-4xl { margin-top: var(--spacing-4xl) !important; }
    .me-md-4xl { margin-right: var(--spacing-4xl) !important; }
    .mb-md-4xl { margin-bottom: var(--spacing-4xl) !important; }
    .ms-md-4xl { margin-left: var(--spacing-4xl) !important; }
    .m-md-6xl { margin: var(--spacing-6xl) !important; }
    .mx-md-6xl { margin-left: var(--spacing-6xl) !important; margin-right: var(--spacing-6xl) !important;}
    .my-md-6xl { margin-top: var(--spacing-6xl) !important; margin-bottom: var(--spacing-6xl) !important;}
    .mt-md-6xl { margin-top: var(--spacing-6xl) !important; }
    .me-md-6xl { margin-right: var(--spacing-6xl) !important; }
    .mb-md-6xl { margin-bottom: var(--spacing-6xl) !important; }
    .ms-md-6xl { margin-left: var(--spacing-6xl) !important; }
    .m-md-7xl { margin: var(--spacing-7xl) !important; }
    .mx-md-7xl { margin-left: var(--spacing-7xl) !important; margin-right: var(--spacing-7xl) !important;}
    .my-md-7xl { margin-top: var(--spacing-7xl) !important; margin-bottom: var(--spacing-7xl) !important;}
    .mt-md-7xl { margin-top: var(--spacing-7xl) !important; }
    .me-md-7xl { margin-right: var(--spacing-7xl) !important; }
    .mb-md-7xl { margin-bottom: var(--spacing-7xl) !important; }
    .ms-md-7xl { margin-left: var(--spacing-7xl) !important; }
    .m-md-8xl { margin: var(--spacing-8xl) !important; }
    .mx-md-8xl { margin-left: var(--spacing-8xl) !important; margin-right: var(--spacing-8xl) !important;}
    .my-md-8xl { margin-top: var(--spacing-8xl) !important; margin-bottom: var(--spacing-8xl) !important;}
    .mt-md-8xl { margin-top: var(--spacing-8xl) !important; }
    .me-md-8xl { margin-right: var(--spacing-8xl) !important; }
    .mb-md-8xl { margin-bottom: var(--spacing-8xl) !important; }
    .ms-md-8xl { margin-left: var(--spacing-8xl) !important; }
    .m-md-9xl { margin: var(--spacing-9xl) !important; }
    .mx-md-9xl { margin-left: var(--spacing-9xl) !important; margin-right: var(--spacing-9xl) !important;}
    .my-md-9xl { margin-top: var(--spacing-9xl) !important; margin-bottom: var(--spacing-9xl) !important;}
    .mt-md-9xl { margin-top: var(--spacing-9xl) !important; }
    .me-md-9xl { margin-right: var(--spacing-9xl) !important; }
    .mb-md-9xl { margin-bottom: var(--spacing-9xl) !important; }
    .ms-md-9xl { margin-left: var(--spacing-9xl) !important; }
    .m-md-10xl { margin: var(--spacing-10xl) !important; }
    .mx-md-10xl { margin-left: var(--spacing-10xl) !important; margin-right: var(--spacing-10xl) !important;}
    .my-md-10xl { margin-top: var(--spacing-10xl) !important; margin-bottom: var(--spacing-10xl) !important;}
    .mt-md-10xl { margin-top: var(--spacing-10xl) !important; }
    .me-md-10xl { margin-right: var(--spacing-10xl) !important; }
    .mb-md-10xl { margin-bottom: var(--spacing-10xl) !important; }
    .ms-md-10xl { margin-left: var(--spacing-10xl) !important; }
    .m-md-11xl { margin: var(--spacing-11xl) !important; }
    .mx-md-11xl { margin-left: var(--spacing-11xl) !important; margin-right: var(--spacing-11xl) !important;}
    .my-md-11xl { margin-top: var(--spacing-11xl) !important; margin-bottom: var(--spacing-11xl) !important;}
    .mt-md-11xl { margin-top: var(--spacing-11xl) !important; }
    .me-md-11xl { margin-right: var(--spacing-11xl) !important; }
    .mb-md-11xl { margin-bottom: var(--spacing-11xl) !important; }
    .ms-md-11xl { margin-left: var(--spacing-11xl) !important; }
    .m-md-sm { margin: var(--spacing-sm) !important; }
    .mx-md-sm { margin-left: var(--spacing-sm) !important; margin-right: var(--spacing-sm) !important;}
    .my-md-sm { margin-top: var(--spacing-sm) !important; margin-bottom: var(--spacing-sm) !important;}
    .mt-md-sm { margin-top: var(--spacing-sm) !important; }
    .me-md-sm { margin-right: var(--spacing-sm) !important; }
    .mb-md-sm { margin-bottom: var(--spacing-sm) !important; }
    .ms-md-sm { margin-left: var(--spacing-sm) !important; }
    .m-md-5xl { margin: var(--spacing-5xl) !important; }
    .mx-md-5xl { margin-left: var(--spacing-5xl) !important; margin-right: var(--spacing-5xl) !important;}
    .my-md-5xl { margin-top: var(--spacing-5xl) !important; margin-bottom: var(--spacing-5xl) !important;}
    .mt-md-5xl { margin-top: var(--spacing-5xl) !important; }
    .me-md-5xl { margin-right: var(--spacing-5xl) !important; }
    .mb-md-5xl { margin-bottom: var(--spacing-5xl) !important; }
    .ms-md-5xl { margin-left: var(--spacing-5xl) !important; }
  /* end::margin */

  /* start::padding */
    .p-md-none { padding: var(--spacing-none) !important; }
    .px-md-none { padding-left: var(--spacing-none) !important; padding-right: var(--spacing-none) !important;}
    .py-md-none { padding-top: var(--spacing-none) !important; padding-bottom: var(--spacing-none) !important;}
    .pt-md-none { padding-top: var(--spacing-none) !important; }
    .pe-md-none { padding-right: var(--spacing-none) !important; }
    .pb-md-none { padding-bottom: var(--spacing-none) !important; }
    .ps-md-none { padding-left: var(--spacing-none) !important; }
    .p-md-xxs { padding: var(--spacing-xxs) !important; }
    .px-md-xxs { padding-left: var(--spacing-xxs) !important; padding-right: var(--spacing-xxs) !important;}
    .py-md-xxs { padding-top: var(--spacing-xxs) !important; padding-bottom: var(--spacing-xxs) !important;}
    .pt-md-xxs { padding-top: var(--spacing-xxs) !important; }
    .pe-md-xxs { padding-right: var(--spacing-xxs) !important; }
    .pb-md-xxs { padding-bottom: var(--spacing-xxs) !important; }
    .ps-md-xxs { padding-left: var(--spacing-xxs) !important; }
    .p-md-xs { padding: var(--spacing-xs) !important; }
    .px-md-xs { padding-left: var(--spacing-xs) !important; padding-right: var(--spacing-xs) !important;}
    .py-md-xs { padding-top: var(--spacing-xs) !important; padding-bottom: var(--spacing-xs) !important;}
    .pt-md-xs { padding-top: var(--spacing-xs) !important; }
    .pe-md-xs { padding-right: var(--spacing-xs) !important; }
    .pb-md-xs { padding-bottom: var(--spacing-xs) !important; }
    .ps-md-xs { padding-left: var(--spacing-xs) !important; }
    .p-md-md { padding: var(--spacing-md) !important; }
    .px-md-md { padding-left: var(--spacing-md) !important; padding-right: var(--spacing-md) !important;}
    .py-md-md { padding-top: var(--spacing-md) !important; padding-bottom: var(--spacing-md) !important;}
    .pt-md-md { padding-top: var(--spacing-md) !important; }
    .pe-md-md { padding-right: var(--spacing-md) !important; }
    .pb-md-md { padding-bottom: var(--spacing-md) !important; }
    .ps-md-md { padding-left: var(--spacing-md) !important; }
    .p-md-lg { padding: var(--spacing-lg) !important; }
    .px-md-lg { padding-left: var(--spacing-lg) !important; padding-right: var(--spacing-lg) !important;}
    .py-md-lg { padding-top: var(--spacing-lg) !important; padding-bottom: var(--spacing-lg) !important;}
    .pt-md-lg { padding-top: var(--spacing-lg) !important; }
    .pe-md-lg { padding-right: var(--spacing-lg) !important; }
    .pb-md-lg { padding-bottom: var(--spacing-lg) !important; }
    .ps-md-lg { padding-left: var(--spacing-lg) !important; }
    .p-md-xl { padding: var(--spacing-xl) !important; }
    .px-md-xl { padding-left: var(--spacing-xl) !important; padding-right: var(--spacing-xl) !important;}
    .py-md-xl { padding-top: var(--spacing-xl) !important; padding-bottom: var(--spacing-xl) !important;}
    .pt-md-xl { padding-top: var(--spacing-xl) !important; }
    .pe-md-xl { padding-right: var(--spacing-xl) !important; }
    .pb-md-xl { padding-bottom: var(--spacing-xl) !important; }
    .ps-md-xl { padding-left: var(--spacing-xl) !important; }
    .p-md-2xl { padding: var(--spacing-2xl) !important; }
    .px-md-2xl { padding-left: var(--spacing-2xl) !important; padding-right: var(--spacing-2xl) !important;}
    .py-md-2xl { padding-top: var(--spacing-2xl) !important; padding-bottom: var(--spacing-2xl) !important;}
    .pt-md-2xl { padding-top: var(--spacing-2xl) !important; }
    .pe-md-2xl { padding-right: var(--spacing-2xl) !important; }
    .pb-md-2xl { padding-bottom: var(--spacing-2xl) !important; }
    .ps-md-2xl { padding-left: var(--spacing-2xl) !important; }
    .p-md-3xl { padding: var(--spacing-3xl) !important; }
    .px-md-3xl { padding-left: var(--spacing-3xl) !important; padding-right: var(--spacing-3xl) !important;}
    .py-md-3xl { padding-top: var(--spacing-3xl) !important; padding-bottom: var(--spacing-3xl) !important;}
    .pt-md-3xl { padding-top: var(--spacing-3xl) !important; }
    .pe-md-3xl { padding-right: var(--spacing-3xl) !important; }
    .pb-md-3xl { padding-bottom: var(--spacing-3xl) !important; }
    .ps-md-3xl { padding-left: var(--spacing-3xl) !important; }
    .p-md-4xl { padding: var(--spacing-4xl) !important; }
    .px-md-4xl { padding-left: var(--spacing-4xl) !important; padding-right: var(--spacing-4xl) !important;}
    .py-md-4xl { padding-top: var(--spacing-4xl) !important; padding-bottom: var(--spacing-4xl) !important;}
    .pt-md-4xl { padding-top: var(--spacing-4xl) !important; }
    .pe-md-4xl { padding-right: var(--spacing-4xl) !important; }
    .pb-md-4xl { padding-bottom: var(--spacing-4xl) !important; }
    .ps-md-4xl { padding-left: var(--spacing-4xl) !important; }
    .p-md-6xl { padding: var(--spacing-6xl) !important; }
    .px-md-6xl { padding-left: var(--spacing-6xl) !important; padding-right: var(--spacing-6xl) !important;}
    .py-md-6xl { padding-top: var(--spacing-6xl) !important; padding-bottom: var(--spacing-6xl) !important;}
    .pt-md-6xl { padding-top: var(--spacing-6xl) !important; }
    .pe-md-6xl { padding-right: var(--spacing-6xl) !important; }
    .pb-md-6xl { padding-bottom: var(--spacing-6xl) !important; }
    .ps-md-6xl { padding-left: var(--spacing-6xl) !important; }
    .p-md-7xl { padding: var(--spacing-7xl) !important; }
    .px-md-7xl { padding-left: var(--spacing-7xl) !important; padding-right: var(--spacing-7xl) !important;}
    .py-md-7xl { padding-top: var(--spacing-7xl) !important; padding-bottom: var(--spacing-7xl) !important;}
    .pt-md-7xl { padding-top: var(--spacing-7xl) !important; }
    .pe-md-7xl { padding-right: var(--spacing-7xl) !important; }
    .pb-md-7xl { padding-bottom: var(--spacing-7xl) !important; }
    .ps-md-7xl { padding-left: var(--spacing-7xl) !important; }
    .p-md-8xl { padding: var(--spacing-8xl) !important; }
    .px-md-8xl { padding-left: var(--spacing-8xl) !important; padding-right: var(--spacing-8xl) !important;}
    .py-md-8xl { padding-top: var(--spacing-8xl) !important; padding-bottom: var(--spacing-8xl) !important;}
    .pt-md-8xl { padding-top: var(--spacing-8xl) !important; }
    .pe-md-8xl { padding-right: var(--spacing-8xl) !important; }
    .pb-md-8xl { padding-bottom: var(--spacing-8xl) !important; }
    .ps-md-8xl { padding-left: var(--spacing-8xl) !important; }
    .p-md-9xl { padding: var(--spacing-9xl) !important; }
    .px-md-9xl { padding-left: var(--spacing-9xl) !important; padding-right: var(--spacing-9xl) !important;}
    .py-md-9xl { padding-top: var(--spacing-9xl) !important; padding-bottom: var(--spacing-9xl) !important;}
    .pt-md-9xl { padding-top: var(--spacing-9xl) !important; }
    .pe-md-9xl { padding-right: var(--spacing-9xl) !important; }
    .pb-md-9xl { padding-bottom: var(--spacing-9xl) !important; }
    .ps-md-9xl { padding-left: var(--spacing-9xl) !important; }
    .p-md-10xl { padding: var(--spacing-10xl) !important; }
    .px-md-10xl { padding-left: var(--spacing-10xl) !important; padding-right: var(--spacing-10xl) !important;}
    .py-md-10xl { padding-top: var(--spacing-10xl) !important; padding-bottom: var(--spacing-10xl) !important;}
    .pt-md-10xl { padding-top: var(--spacing-10xl) !important; }
    .pe-md-10xl { padding-right: var(--spacing-10xl) !important; }
    .pb-md-10xl { padding-bottom: var(--spacing-10xl) !important; }
    .ps-md-10xl { padding-left: var(--spacing-10xl) !important; }
    .p-md-11xl { padding: var(--spacing-11xl) !important; }
    .px-md-11xl { padding-left: var(--spacing-11xl) !important; padding-right: var(--spacing-11xl) !important;}
    .py-md-11xl { padding-top: var(--spacing-11xl) !important; padding-bottom: var(--spacing-11xl) !important;}
    .pt-md-11xl { padding-top: var(--spacing-11xl) !important; }
    .pe-md-11xl { padding-right: var(--spacing-11xl) !important; }
    .pb-md-11xl { padding-bottom: var(--spacing-11xl) !important; }
    .ps-md-11xl { padding-left: var(--spacing-11xl) !important; }
    .p-md-sm { padding: var(--spacing-sm) !important; }
    .px-md-sm { padding-left: var(--spacing-sm) !important; padding-right: var(--spacing-sm) !important;}
    .py-md-sm { padding-top: var(--spacing-sm) !important; padding-bottom: var(--spacing-sm) !important;}
    .pt-md-sm { padding-top: var(--spacing-sm) !important; }
    .pe-md-sm { padding-right: var(--spacing-sm) !important; }
    .pb-md-sm { padding-bottom: var(--spacing-sm) !important; }
    .ps-md-sm { padding-left: var(--spacing-sm) !important; }
    .p-md-5xl { padding: var(--spacing-5xl) !important; }
    .px-md-5xl { padding-left: var(--spacing-5xl) !important; padding-right: var(--spacing-5xl) !important;}
    .py-md-5xl { padding-top: var(--spacing-5xl) !important; padding-bottom: var(--spacing-5xl) !important;}
    .pt-md-5xl { padding-top: var(--spacing-5xl) !important; }
    .pe-md-5xl { padding-right: var(--spacing-5xl) !important; }
    .pb-md-5xl { padding-bottom: var(--spacing-5xl) !important; }
    .ps-md-5xl { padding-left: var(--spacing-5xl) !important; }
  /* end::padding */



  /* start::line hight */
  /* text */
  .lht-md-xs { line-height: var(--line-height-text-xs) !important;}
  .lht-md-sm { line-height: var(--line-height-text-sm) !important;}
  .lht-md-md { line-height: var(--line-height-text-md) !important;}
  .lht-md-lg { line-height: var(--line-height-text-lg) !important;}
  .lht-md-xl { line-height: var(--line-height-text-xl) !important;}
  .lhd-md-2xl { line-height: var(--line-height-text-2xl) !important;}


  /* display */
  .lhd-md-xs { line-height: var(--line-height-display-xs) !important;}
  .lhd-md-sm { line-height: var(--line-height-display-sm) !important;}
  .lhd-md-md { line-height: var(--line-height-display-md) !important;}
  .lhd-md-lg { line-height: var(--line-height-display-lg) !important;}
  .lhd-md-xl { line-height: var(--line-height-display-xl) !important;}
  .lhd-md-2xl { line-height: var(--line-height-display-2xl) !important;}
  /* end::line hight */

  /* start::font size */
  /* text */
  .fst-md-xs { font-size: var(--font-size-text-xs) !important;}
  .fst-md-sm { font-size: var(--font-size-text-sm) !important;}
  .fst-md-md { font-size: var(--font-size-text-md) !important;}
  .fst-md-lg { font-size: var(--font-size-text-lg) !important;}
  .fst-md-xl { font-size: var(--font-size-text-xl) !important;}

  /* display */
  .fsd-md-xs { font-size: var(--font-size-display-xs) !important;}
  .fsd-md-sm { font-size: var(--font-size-display-sm) !important;}
  .fsd-md-md { font-size: var(--font-size-display-md) !important;}
  .fsd-md-lg { font-size: var(--font-size-display-lg) !important;}
  .fsd-md-xl { font-size: var(--font-size-display-xl) !important;}
  .fsd-md-2xl { font-size: var(--font-size-display-2xl) !important;}
  /* end::font size */
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

  .shadow-lg-none {
    box-shadow: none !important;
  }

  .shadow-lg-xs {
    box-shadow: 0 1px 2px 0 var(--Colors-Effects-Shadows-shadow-xs, rgba(10, 13, 18, 0.05)) !important;
  }

  .shadow-lg-sm {
    box-shadow: 0 1px 3px 0 var(--Colors-Effects-Shadows-shadow-sm_01, rgba(10, 13, 18, 0.10)), 0 1px 2px -1px var(--Colors-Effects-Shadows-shadow-sm_02, rgba(10, 13, 18, 0.10)) !important;
  }

  .shadow-lg-md {
    box-shadow: 0 4px 6px -1px var(--Colors-Effects-Shadows-shadow-md_01, rgba(10, 13, 18, 0.10)), 0 2px 4px -2px var(--Colors-Effects-Shadows-shadow-md_02, rgba(10, 13, 18, 0.06)) !important;
  }

  .shadow-lg-lg {
    box-shadow: 0 12px 16px -4px var(--Colors-Effects-Shadows-shadow-lg_01, rgba(10, 13, 18, 0.08)), 0 4px 6px -2px var(--Colors-Effects-Shadows-shadow-lg_02, rgba(10, 13, 18, 0.03)), 0 2px 2px -1px var(--Colors-Effects-Shadows-shadow-lg_03, rgba(10, 13, 18, 0.04)) !important;
  }

  .shadow-lg-xl {
    box-shadow: 0 20px 24px -4px var(--Colors-Effects-Shadows-shadow-xl_01, rgba(10, 13, 18, 0.08)), 0 8px 8px -4px var(--Colors-Effects-Shadows-shadow-xl_02, rgba(10, 13, 18, 0.03)), 0 3px 3px -1.5px var(--Colors-Effects-Shadows-shadow-xl_03, rgba(10, 13, 18, 0.04)) !important;
  }

  .shadow-lg-2xl {
    box-shadow: 0 24px 48px -12px var(--Colors-Effects-Shadows-shadow-2xl_01, rgba(10, 13, 18, 0.18)), 0 4px 4px -2px var(--Colors-Effects-Shadows-shadow-2xl_02, rgba(10, 13, 18, 0.04)) !important;
  }

  .shadow-lg-3xl {
    box-shadow: 0 32px 64px -12px var(--Colors-Effects-Shadows-shadow-3xl_01, rgba(10, 13, 18, 0.14)), 0 5px 5px -2.5px var(--Colors-Effects-Shadows-shadow-3xl_02, rgba(10, 13, 18, 0.04)) !important;
  }

  .shadow-lg-xs-skeuomorphic {
    box-shadow: 0 0 0 1px var(--Colors-Effects-Shadows-shadow-skeumorphic-inner-border, rgba(10, 13, 18, 0.18)) inset, 0 -2px 0 0 var(--Colors-Effects-Shadows-shadow-skeumorphic-inner, rgba(10, 13, 18, 0.05)) inset, 0 1px 2px 0 var(--Colors-Effects-Shadows-shadow-xs, rgba(10, 13, 18, 0.05)) !important;
  }


  /* start::text colors */
  .text-lg-gray-25  { color: var(--colors-gray-light-mode-25) !important;}
  .text-lg-gray-50  { color: var(--colors-gray-light-mode-50) !important;}
  .text-lg-gray-100 { color: var(--colors-gray-light-mode-100) !important;}
  .text-lg-gray-200 { color: var(--colors-gray-light-mode-200) !important;}
  .text-lg-gray-300 { color: var(--colors-gray-light-mode-300) !important;}
  .text-lg-gray-400 { color: var(--colors-gray-light-mode-400) !important;}
  .text-lg-gray-500 { color: var(--colors-gray-light-mode-500) !important;}
  .text-lg-gray-600 { color: var(--colors-gray-light-mode-600) !important;}
  .text-lg-gray-700 { color: var(--colors-gray-light-mode-700) !important;}
  .text-lg-gray-800 { color: var(--colors-gray-light-mode-800) !important;}
  .text-lg-gray-900 { color: var(--colors-gray-light-mode-900) !important;}
  .text-lg-gray-950 { color: var(--colors-gray-light-mode-950) !important;}
  /* end::text colors */

  /* start::width */
    .w-lg-xxs { width: var(--width-xxs) !important;}
    .mw-lg-xxs { max-width: var(--width-xxs) !important;}
    .min-lg-w-xxs { min-width: var(--width-xxs) !important;}
    .w-lg-xs { width: var(--width-xs) !important;}
    .mw-lg-xs { max-width: var(--width-xs) !important;}
    .min-lg-w-xs { min-width: var(--width-xs) !important;}
    .w-lg-sm { width: var(--width-sm) !important;}
    .mw-lg-sm { max-width: var(--width-sm) !important;}
    .min-lg-w-sm { min-width: var(--width-sm) !important;}
    .w-lg-md { width: var(--width-md) !important;}
    .mw-lg-md { max-width: var(--width-md) !important;}
    .min-lg-w-md { min-width: var(--width-md) !important;}
    .w-lg-lg { width: var(--width-lg) !important;}
    .mw-lg-lg { max-width: var(--width-lg) !important;}
    .min-lg-w-lg { min-width: var(--width-lg) !important;}
    .w-lg-xl { width: var(--width-xl) !important;}
    .mw-lg-xl { max-width: var(--width-xl) !important;}
    .min-lg-w-xl { min-width: var(--width-xl) !important;}
    .w-lg-2xl { width: var(--width-2xl) !important;}
    .mw-lg-2xl { max-width: var(--width-2xl) !important;}
    .min-lg-w-2xl { min-width: var(--width-2xl) !important;}
    .w-lg-3xl { width: var(--width-3xl) !important;}
    .mw-lg-3xl { max-width: var(--width-3xl) !important;}
    .min-lg-w-3xl { min-width: var(--width-3xl) !important;}
    .w-lg-4xl { width: var(--width-4xl) !important;}
    .mw-lg-4xl { max-width: var(--width-4xl) !important;}
    .min-lg-w-4xl { min-width: var(--width-4xl) !important;}
    .w-lg-5xl { width: var(--width-5xl) !important;}
    .mw-lg-5xl { max-width: var(--width-5xl) !important;}
    .min-lg-w-5xl { min-width: var(--width-5xl) !important;}
    .w-lg-6xl { width: var(--width-6xl) !important;}
    .mw-lg-6xl { max-width: var(--width-6xl) !important;}
    .min-lg-w-6xl { min-width: var(--width-6xl) !important;}
    .w-lg-p { width: var(--paragraph-max-width) !important;}
    .mw-lg-p { max-width: var(--paragraph-max-width) !important;}
    .min-lg-w-p { min-width: var(--paragraph-max-width) !important;}
  /* end::width */

  /* start::margin */
    .m-lg-none { margin: var(--spacing-none) !important; }
    .mx-lg-none { margin-left: var(--spacing-none) !important; margin-right: var(--spacing-none) !important;}
    .my-lg-none { margin-top: var(--spacing-none) !important; margin-bottom: var(--spacing-none) !important;}
    .mt-lg-none { margin-top: var(--spacing-none) !important; }
    .me-lg-none { margin-right: var(--spacing-none) !important; }
    .mb-lg-none { margin-bottom: var(--spacing-none) !important; }
    .ms-lg-none { margin-left: var(--spacing-none) !important; }
    .m-lg-xxs { margin: var(--spacing-xxs) !important; }
    .mx-lg-xxs { margin-left: var(--spacing-xxs) !important; margin-right: var(--spacing-xxs) !important;}
    .my-lg-xxs { margin-top: var(--spacing-xxs) !important; margin-bottom: var(--spacing-xxs) !important;}
    .mt-lg-xxs { margin-top: var(--spacing-xxs) !important; }
    .me-lg-xxs { margin-right: var(--spacing-xxs) !important; }
    .mb-lg-xxs { margin-bottom: var(--spacing-xxs) !important; }
    .ms-lg-xxs { margin-left: var(--spacing-xxs) !important; }
    .m-lg-xs { margin: var(--spacing-xs) !important; }
    .mx-lg-xs { margin-left: var(--spacing-xs) !important; margin-right: var(--spacing-xs) !important;}
    .my-lg-xs { margin-top: var(--spacing-xs) !important; margin-bottom: var(--spacing-xs) !important;}
    .mt-lg-xs { margin-top: var(--spacing-xs) !important; }
    .me-lg-xs { margin-right: var(--spacing-xs) !important; }
    .mb-lg-xs { margin-bottom: var(--spacing-xs) !important; }
    .ms-lg-xs { margin-left: var(--spacing-xs) !important; }
    .m-lg-md { margin: var(--spacing-md) !important; }
    .mx-lg-md { margin-left: var(--spacing-md) !important; margin-right: var(--spacing-md) !important;}
    .my-lg-md { margin-top: var(--spacing-md) !important; margin-bottom: var(--spacing-md) !important;}
    .mt-lg-md { margin-top: var(--spacing-md) !important; }
    .me-lg-md { margin-right: var(--spacing-md) !important; }
    .mb-lg-md { margin-bottom: var(--spacing-md) !important; }
    .ms-lg-md { margin-left: var(--spacing-md) !important; }
    .m-lg-lg { margin: var(--spacing-lg) !important; }
    .mx-lg-lg { margin-left: var(--spacing-lg) !important; margin-right: var(--spacing-lg) !important;}
    .my-lg-lg { margin-top: var(--spacing-lg) !important; margin-bottom: var(--spacing-lg) !important;}
    .mt-lg-lg { margin-top: var(--spacing-lg) !important; }
    .me-lg-lg { margin-right: var(--spacing-lg) !important; }
    .mb-lg-lg { margin-bottom: var(--spacing-lg) !important; }
    .ms-lg-lg { margin-left: var(--spacing-lg) !important; }
    .m-lg-xl { margin: var(--spacing-xl) !important; }
    .mx-lg-xl { margin-left: var(--spacing-xl) !important; margin-right: var(--spacing-xl) !important;}
    .my-lg-xl { margin-top: var(--spacing-xl) !important; margin-bottom: var(--spacing-xl) !important;}
    .mt-lg-xl { margin-top: var(--spacing-xl) !important; }
    .me-lg-xl { margin-right: var(--spacing-xl) !important; }
    .mb-lg-xl { margin-bottom: var(--spacing-xl) !important; }
    .ms-lg-xl { margin-left: var(--spacing-xl) !important; }
    .m-lg-2xl { margin: var(--spacing-2xl) !important; }
    .mx-lg-2xl { margin-left: var(--spacing-2xl) !important; margin-right: var(--spacing-2xl) !important;}
    .my-lg-2xl { margin-top: var(--spacing-2xl) !important; margin-bottom: var(--spacing-2xl) !important;}
    .mt-lg-2xl { margin-top: var(--spacing-2xl) !important; }
    .me-lg-2xl { margin-right: var(--spacing-2xl) !important; }
    .mb-lg-2xl { margin-bottom: var(--spacing-2xl) !important; }
    .ms-lg-2xl { margin-left: var(--spacing-2xl) !important; }
    .m-lg-3xl { margin: var(--spacing-3xl) !important; }
    .mx-lg-3xl { margin-left: var(--spacing-3xl) !important; margin-right: var(--spacing-3xl) !important;}
    .my-lg-3xl { margin-top: var(--spacing-3xl) !important; margin-bottom: var(--spacing-3xl) !important;}
    .mt-lg-3xl { margin-top: var(--spacing-3xl) !important; }
    .me-lg-3xl { margin-right: var(--spacing-3xl) !important; }
    .mb-lg-3xl { margin-bottom: var(--spacing-3xl) !important; }
    .ms-lg-3xl { margin-left: var(--spacing-3xl) !important; }
    .m-lg-4xl { margin: var(--spacing-4xl) !important; }
    .mx-lg-4xl { margin-left: var(--spacing-4xl) !important; margin-right: var(--spacing-4xl) !important;}
    .my-lg-4xl { margin-top: var(--spacing-4xl) !important; margin-bottom: var(--spacing-4xl) !important;}
    .mt-lg-4xl { margin-top: var(--spacing-4xl) !important; }
    .me-lg-4xl { margin-right: var(--spacing-4xl) !important; }
    .mb-lg-4xl { margin-bottom: var(--spacing-4xl) !important; }
    .ms-lg-4xl { margin-left: var(--spacing-4xl) !important; }
    .m-lg-6xl { margin: var(--spacing-6xl) !important; }
    .mx-lg-6xl { margin-left: var(--spacing-6xl) !important; margin-right: var(--spacing-6xl) !important;}
    .my-lg-6xl { margin-top: var(--spacing-6xl) !important; margin-bottom: var(--spacing-6xl) !important;}
    .mt-lg-6xl { margin-top: var(--spacing-6xl) !important; }
    .me-lg-6xl { margin-right: var(--spacing-6xl) !important; }
    .mb-lg-6xl { margin-bottom: var(--spacing-6xl) !important; }
    .ms-lg-6xl { margin-left: var(--spacing-6xl) !important; }
    .m-lg-7xl { margin: var(--spacing-7xl) !important; }
    .mx-lg-7xl { margin-left: var(--spacing-7xl) !important; margin-right: var(--spacing-7xl) !important;}
    .my-lg-7xl { margin-top: var(--spacing-7xl) !important; margin-bottom: var(--spacing-7xl) !important;}
    .mt-lg-7xl { margin-top: var(--spacing-7xl) !important; }
    .me-lg-7xl { margin-right: var(--spacing-7xl) !important; }
    .mb-lg-7xl { margin-bottom: var(--spacing-7xl) !important; }
    .ms-lg-7xl { margin-left: var(--spacing-7xl) !important; }
    .m-lg-8xl { margin: var(--spacing-8xl) !important; }
    .mx-lg-8xl { margin-left: var(--spacing-8xl) !important; margin-right: var(--spacing-8xl) !important;}
    .my-lg-8xl { margin-top: var(--spacing-8xl) !important; margin-bottom: var(--spacing-8xl) !important;}
    .mt-lg-8xl { margin-top: var(--spacing-8xl) !important; }
    .me-lg-8xl { margin-right: var(--spacing-8xl) !important; }
    .mb-lg-8xl { margin-bottom: var(--spacing-8xl) !important; }
    .ms-lg-8xl { margin-left: var(--spacing-8xl) !important; }
    .m-lg-9xl { margin: var(--spacing-9xl) !important; }
    .mx-lg-9xl { margin-left: var(--spacing-9xl) !important; margin-right: var(--spacing-9xl) !important;}
    .my-lg-9xl { margin-top: var(--spacing-9xl) !important; margin-bottom: var(--spacing-9xl) !important;}
    .mt-lg-9xl { margin-top: var(--spacing-9xl) !important; }
    .me-lg-9xl { margin-right: var(--spacing-9xl) !important; }
    .mb-lg-9xl { margin-bottom: var(--spacing-9xl) !important; }
    .ms-lg-9xl { margin-left: var(--spacing-9xl) !important; }
    .m-lg-10xl { margin: var(--spacing-10xl) !important; }
    .mx-lg-10xl { margin-left: var(--spacing-10xl) !important; margin-right: var(--spacing-10xl) !important;}
    .my-lg-10xl { margin-top: var(--spacing-10xl) !important; margin-bottom: var(--spacing-10xl) !important;}
    .mt-lg-10xl { margin-top: var(--spacing-10xl) !important; }
    .me-lg-10xl { margin-right: var(--spacing-10xl) !important; }
    .mb-lg-10xl { margin-bottom: var(--spacing-10xl) !important; }
    .ms-lg-10xl { margin-left: var(--spacing-10xl) !important; }
    .m-lg-11xl { margin: var(--spacing-11xl) !important; }
    .mx-lg-11xl { margin-left: var(--spacing-11xl) !important; margin-right: var(--spacing-11xl) !important;}
    .my-lg-11xl { margin-top: var(--spacing-11xl) !important; margin-bottom: var(--spacing-11xl) !important;}
    .mt-lg-11xl { margin-top: var(--spacing-11xl) !important; }
    .me-lg-11xl { margin-right: var(--spacing-11xl) !important; }
    .mb-lg-11xl { margin-bottom: var(--spacing-11xl) !important; }
    .ms-lg-11xl { margin-left: var(--spacing-11xl) !important; }
    .m-lg-sm { margin: var(--spacing-sm) !important; }
    .mx-lg-sm { margin-left: var(--spacing-sm) !important; margin-right: var(--spacing-sm) !important;}
    .my-lg-sm { margin-top: var(--spacing-sm) !important; margin-bottom: var(--spacing-sm) !important;}
    .mt-lg-sm { margin-top: var(--spacing-sm) !important; }
    .me-lg-sm { margin-right: var(--spacing-sm) !important; }
    .mb-lg-sm { margin-bottom: var(--spacing-sm) !important; }
    .ms-lg-sm { margin-left: var(--spacing-sm) !important; }
    .m-lg-5xl { margin: var(--spacing-5xl) !important; }
    .mx-lg-5xl { margin-left: var(--spacing-5xl) !important; margin-right: var(--spacing-5xl) !important;}
    .my-lg-5xl { margin-top: var(--spacing-5xl) !important; margin-bottom: var(--spacing-5xl) !important;}
    .mt-lg-5xl { margin-top: var(--spacing-5xl) !important; }
    .me-lg-5xl { margin-right: var(--spacing-5xl) !important; }
    .mb-lg-5xl { margin-bottom: var(--spacing-5xl) !important; }
    .ms-lg-5xl { margin-left: var(--spacing-5xl) !important; }
  /* end::margin */

  /* start::padding */
    .p-lg-none { padding: var(--spacing-none) !important; }
    .px-lg-none { padding-left: var(--spacing-none) !important; padding-right: var(--spacing-none) !important;}
    .py-lg-none { padding-top: var(--spacing-none) !important; padding-bottom: var(--spacing-none) !important;}
    .pt-lg-none { padding-top: var(--spacing-none) !important; }
    .pe-lg-none { padding-right: var(--spacing-none) !important; }
    .pb-lg-none { padding-bottom: var(--spacing-none) !important; }
    .ps-lg-none { padding-left: var(--spacing-none) !important; }
    .p-lg-xxs { padding: var(--spacing-xxs) !important; }
    .px-lg-xxs { padding-left: var(--spacing-xxs) !important; padding-right: var(--spacing-xxs) !important;}
    .py-lg-xxs { padding-top: var(--spacing-xxs) !important; padding-bottom: var(--spacing-xxs) !important;}
    .pt-lg-xxs { padding-top: var(--spacing-xxs) !important; }
    .pe-lg-xxs { padding-right: var(--spacing-xxs) !important; }
    .pb-lg-xxs { padding-bottom: var(--spacing-xxs) !important; }
    .ps-lg-xxs { padding-left: var(--spacing-xxs) !important; }
    .p-lg-xs { padding: var(--spacing-xs) !important; }
    .px-lg-xs { padding-left: var(--spacing-xs) !important; padding-right: var(--spacing-xs) !important;}
    .py-lg-xs { padding-top: var(--spacing-xs) !important; padding-bottom: var(--spacing-xs) !important;}
    .pt-lg-xs { padding-top: var(--spacing-xs) !important; }
    .pe-lg-xs { padding-right: var(--spacing-xs) !important; }
    .pb-lg-xs { padding-bottom: var(--spacing-xs) !important; }
    .ps-lg-xs { padding-left: var(--spacing-xs) !important; }
    .p-lg-md { padding: var(--spacing-md) !important; }
    .px-lg-md { padding-left: var(--spacing-md) !important; padding-right: var(--spacing-md) !important;}
    .py-lg-md { padding-top: var(--spacing-md) !important; padding-bottom: var(--spacing-md) !important;}
    .pt-lg-md { padding-top: var(--spacing-md) !important; }
    .pe-lg-md { padding-right: var(--spacing-md) !important; }
    .pb-lg-md { padding-bottom: var(--spacing-md) !important; }
    .ps-lg-md { padding-left: var(--spacing-md) !important; }
    .p-lg-lg { padding: var(--spacing-lg) !important; }
    .px-lg-lg { padding-left: var(--spacing-lg) !important; padding-right: var(--spacing-lg) !important;}
    .py-lg-lg { padding-top: var(--spacing-lg) !important; padding-bottom: var(--spacing-lg) !important;}
    .pt-lg-lg { padding-top: var(--spacing-lg) !important; }
    .pe-lg-lg { padding-right: var(--spacing-lg) !important; }
    .pb-lg-lg { padding-bottom: var(--spacing-lg) !important; }
    .ps-lg-lg { padding-left: var(--spacing-lg) !important; }
    .p-lg-xl { padding: var(--spacing-xl) !important; }
    .px-lg-xl { padding-left: var(--spacing-xl) !important; padding-right: var(--spacing-xl) !important;}
    .py-lg-xl { padding-top: var(--spacing-xl) !important; padding-bottom: var(--spacing-xl) !important;}
    .pt-lg-xl { padding-top: var(--spacing-xl) !important; }
    .pe-lg-xl { padding-right: var(--spacing-xl) !important; }
    .pb-lg-xl { padding-bottom: var(--spacing-xl) !important; }
    .ps-lg-xl { padding-left: var(--spacing-xl) !important; }
    .p-lg-2xl { padding: var(--spacing-2xl) !important; }
    .px-lg-2xl { padding-left: var(--spacing-2xl) !important; padding-right: var(--spacing-2xl) !important;}
    .py-lg-2xl { padding-top: var(--spacing-2xl) !important; padding-bottom: var(--spacing-2xl) !important;}
    .pt-lg-2xl { padding-top: var(--spacing-2xl) !important; }
    .pe-lg-2xl { padding-right: var(--spacing-2xl) !important; }
    .pb-lg-2xl { padding-bottom: var(--spacing-2xl) !important; }
    .ps-lg-2xl { padding-left: var(--spacing-2xl) !important; }
    .p-lg-3xl { padding: var(--spacing-3xl) !important; }
    .px-lg-3xl { padding-left: var(--spacing-3xl) !important; padding-right: var(--spacing-3xl) !important;}
    .py-lg-3xl { padding-top: var(--spacing-3xl) !important; padding-bottom: var(--spacing-3xl) !important;}
    .pt-lg-3xl { padding-top: var(--spacing-3xl) !important; }
    .pe-lg-3xl { padding-right: var(--spacing-3xl) !important; }
    .pb-lg-3xl { padding-bottom: var(--spacing-3xl) !important; }
    .ps-lg-3xl { padding-left: var(--spacing-3xl) !important; }
    .p-lg-4xl { padding: var(--spacing-4xl) !important; }
    .px-lg-4xl { padding-left: var(--spacing-4xl) !important; padding-right: var(--spacing-4xl) !important;}
    .py-lg-4xl { padding-top: var(--spacing-4xl) !important; padding-bottom: var(--spacing-4xl) !important;}
    .pt-lg-4xl { padding-top: var(--spacing-4xl) !important; }
    .pe-lg-4xl { padding-right: var(--spacing-4xl) !important; }
    .pb-lg-4xl { padding-bottom: var(--spacing-4xl) !important; }
    .ps-lg-4xl { padding-left: var(--spacing-4xl) !important; }
    .p-lg-6xl { padding: var(--spacing-6xl) !important; }
    .px-lg-6xl { padding-left: var(--spacing-6xl) !important; padding-right: var(--spacing-6xl) !important;}
    .py-lg-6xl { padding-top: var(--spacing-6xl) !important; padding-bottom: var(--spacing-6xl) !important;}
    .pt-lg-6xl { padding-top: var(--spacing-6xl) !important; }
    .pe-lg-6xl { padding-right: var(--spacing-6xl) !important; }
    .pb-lg-6xl { padding-bottom: var(--spacing-6xl) !important; }
    .ps-lg-6xl { padding-left: var(--spacing-6xl) !important; }
    .p-lg-7xl { padding: var(--spacing-7xl) !important; }
    .px-lg-7xl { padding-left: var(--spacing-7xl) !important; padding-right: var(--spacing-7xl) !important;}
    .py-lg-7xl { padding-top: var(--spacing-7xl) !important; padding-bottom: var(--spacing-7xl) !important;}
    .pt-lg-7xl { padding-top: var(--spacing-7xl) !important; }
    .pe-lg-7xl { padding-right: var(--spacing-7xl) !important; }
    .pb-lg-7xl { padding-bottom: var(--spacing-7xl) !important; }
    .ps-lg-7xl { padding-left: var(--spacing-7xl) !important; }
    .p-lg-8xl { padding: var(--spacing-8xl) !important; }
    .px-lg-8xl { padding-left: var(--spacing-8xl) !important; padding-right: var(--spacing-8xl) !important;}
    .py-lg-8xl { padding-top: var(--spacing-8xl) !important; padding-bottom: var(--spacing-8xl) !important;}
    .pt-lg-8xl { padding-top: var(--spacing-8xl) !important; }
    .pe-lg-8xl { padding-right: var(--spacing-8xl) !important; }
    .pb-lg-8xl { padding-bottom: var(--spacing-8xl) !important; }
    .ps-lg-8xl { padding-left: var(--spacing-8xl) !important; }
    .p-lg-9xl { padding: var(--spacing-9xl) !important; }
    .px-lg-9xl { padding-left: var(--spacing-9xl) !important; padding-right: var(--spacing-9xl) !important;}
    .py-lg-9xl { padding-top: var(--spacing-9xl) !important; padding-bottom: var(--spacing-9xl) !important;}
    .pt-lg-9xl { padding-top: var(--spacing-9xl) !important; }
    .pe-lg-9xl { padding-right: var(--spacing-9xl) !important; }
    .pb-lg-9xl { padding-bottom: var(--spacing-9xl) !important; }
    .ps-lg-9xl { padding-left: var(--spacing-9xl) !important; }
    .p-lg-10xl { padding: var(--spacing-10xl) !important; }
    .px-lg-10xl { padding-left: var(--spacing-10xl) !important; padding-right: var(--spacing-10xl) !important;}
    .py-lg-10xl { padding-top: var(--spacing-10xl) !important; padding-bottom: var(--spacing-10xl) !important;}
    .pt-lg-10xl { padding-top: var(--spacing-10xl) !important; }
    .pe-lg-10xl { padding-right: var(--spacing-10xl) !important; }
    .pb-lg-10xl { padding-bottom: var(--spacing-10xl) !important; }
    .ps-lg-10xl { padding-left: var(--spacing-10xl) !important; }
    .p-lg-11xl { padding: var(--spacing-11xl) !important; }
    .px-lg-11xl { padding-left: var(--spacing-11xl) !important; padding-right: var(--spacing-11xl) !important;}
    .py-lg-11xl { padding-top: var(--spacing-11xl) !important; padding-bottom: var(--spacing-11xl) !important;}
    .pt-lg-11xl { padding-top: var(--spacing-11xl) !important; }
    .pe-lg-11xl { padding-right: var(--spacing-11xl) !important; }
    .pb-lg-11xl { padding-bottom: var(--spacing-11xl) !important; }
    .ps-lg-11xl { padding-left: var(--spacing-11xl) !important; }
    .p-lg-sm { padding: var(--spacing-sm) !important; }
    .px-lg-sm { padding-left: var(--spacing-sm) !important; padding-right: var(--spacing-sm) !important;}
    .py-lg-sm { padding-top: var(--spacing-sm) !important; padding-bottom: var(--spacing-sm) !important;}
    .pt-lg-sm { padding-top: var(--spacing-sm) !important; }
    .pe-lg-sm { padding-right: var(--spacing-sm) !important; }
    .pb-lg-sm { padding-bottom: var(--spacing-sm) !important; }
    .ps-lg-sm { padding-left: var(--spacing-sm) !important; }
    .p-lg-5xl { padding: var(--spacing-5xl) !important; }
    .px-lg-5xl { padding-left: var(--spacing-5xl) !important; padding-right: var(--spacing-5xl) !important;}
    .py-lg-5xl { padding-top: var(--spacing-5xl) !important; padding-bottom: var(--spacing-5xl) !important;}
    .pt-lg-5xl { padding-top: var(--spacing-5xl) !important; }
    .pe-lg-5xl { padding-right: var(--spacing-5xl) !important; }
    .pb-lg-5xl { padding-bottom: var(--spacing-5xl) !important; }
    .ps-lg-5xl { padding-left: var(--spacing-5xl) !important; }
  /* end::padding */



  /* start::line hight */
  /* text */
  .lht-lg-xs { line-height: var(--line-height-text-xs) !important;}
  .lht-lg-sm { line-height: var(--line-height-text-sm) !important;}
  .lht-lg-md { line-height: var(--line-height-text-md) !important;}
  .lht-lg-lg { line-height: var(--line-height-text-lg) !important;}
  .lht-lg-xl { line-height: var(--line-height-text-xl) !important;}
  .lhd-lg-2xl { line-height: var(--line-height-text-2xl) !important;}


  /* display */
  .lhd-lg-xs { line-height: var(--line-height-display-xs) !important;}
  .lhd-lg-sm { line-height: var(--line-height-display-sm) !important;}
  .lhd-lg-md { line-height: var(--line-height-display-md) !important;}
  .lhd-lg-lg { line-height: var(--line-height-display-lg) !important;}
  .lhd-lg-xl { line-height: var(--line-height-display-xl) !important;}
  .lhd-lg-2xl { line-height: var(--line-height-display-2xl) !important;}
  /* end::line hight */

  /* start::font size */
  /* text */
  .fst-lg-xs { font-size: var(--font-size-text-xs) !important;}
  .fst-lg-sm { font-size: var(--font-size-text-sm) !important;}
  .fst-lg-md { font-size: var(--font-size-text-md) !important;}
  .fst-lg-lg { font-size: var(--font-size-text-lg) !important;}
  .fst-lg-xl { font-size: var(--font-size-text-xl) !important;}

  /* display */
  .fsd-lg-xs { font-size: var(--font-size-display-xs) !important;}
  .fsd-lg-sm { font-size: var(--font-size-display-sm) !important;}
  .fsd-lg-md { font-size: var(--font-size-display-md) !important;}
  .fsd-lg-lg { font-size: var(--font-size-display-lg) !important;}
  .fsd-lg-xl { font-size: var(--font-size-display-xl) !important;}
  .fsd-lg-2xl { font-size: var(--font-size-display-2xl) !important;}
  /* end::font size */

  /* start::backgroud colors */
  .bg-lg-gray-25  { background-color: var(--colors-gray-light-mode-25) !important;}
  .bg-lg-gray-50  { background-color: var(--colors-gray-light-mode-50) !important;}
  .bg-lg-gray-100 { background-color: var(--colors-gray-light-mode-100) !important;}
  .bg-lg-gray-200 { background-color: var(--colors-gray-light-mode-200) !important;}
  .bg-lg-gray-300 { background-color: var(--colors-gray-light-mode-300) !important;}
  .bg-lg-gray-400 { background-color: var(--colors-gray-light-mode-400) !important;}
  .bg-lg-gray-500 { background-color: var(--colors-gray-light-mode-500) !important;}
  .bg-lg-gray-600 { background-color: var(--colors-gray-light-mode-600) !important;}
  .bg-lg-gray-700 { background-color: var(--colors-gray-light-mode-700) !important;}
  .bg-lg-gray-800 { background-color: var(--colors-gray-light-mode-800) !important;}
  .bg-lg-gray-900 { background-color: var(--colors-gray-light-mode-900) !important;}
  .bg-lg-gray-950 { background-color: var(--colors-gray-light-mode-950) !important;}
  /* end::backgroud colors */

  /* start::border radius */
  .radius-lg-none { border-radius: var(--radius-none) !important;}
  .radius-lg-xxs { border-radius: var(--radius-xxs) !important;}
  .radius-lg-xs { border-radius: var(--radius-xs) !important;}
  .radius-lg-sm { border-radius: var(--radius-sm) !important;}
  .radius-lg-md { border-radius: var(--radius-md) !important;}
  .radius-lg-xl { border-radius: var(--radius-xl) !important;}
  .radius-lg-2xl { border-radius: var(--radius-2xl) !important;}
  .radius-lg-4xl { border-radius: var(--radius-4xl) !important;}
  .radius-lg-full { border-radius: var(--radius-full) !important;}
  .radius-lg-lg { border-radius: var(--radius-lg) !important;}
  .radius-lg-3xl { border-radius: var(--radius-3xl) !important;}
  /* end::border radius */
}