/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */

@layer properties;

@layer theme, base, components, utilities;

@layer theme {

  :root, :host {

    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",

      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",

      "Courier New", monospace;

    --color-red-500: oklch(63.7% 0.237 25.331);

    --color-blue-600: oklch(54.6% 0.245 262.881);

    --color-gray-200: oklch(92.8% 0.006 264.531);

    --color-gray-300: oklch(87.2% 0.01 258.338);

    --color-gray-400: oklch(70.7% 0.022 261.325);

    --color-gray-600: oklch(44.6% 0.03 256.802);

    --color-black: #000;

    --color-white: #fff;

    --spacing: 1px;

    --container-2xl: 42rem;

    --text-xs: 0.75rem;

    --text-xs--line-height: calc(1 / 0.75);

    --text-sm: 0.875rem;

    --text-sm--line-height: calc(1.25 / 0.875);

    --text-base: 1rem;

    --text-base--line-height: calc(1.5 / 1);

    --text-lg: 1.125rem;

    --text-lg--line-height: calc(1.75 / 1.125);

    --text-xl: 1.25rem;

    --text-xl--line-height: calc(1.75 / 1.25);

    --text-2xl: 24px;

    --text-2xl--line-height: calc(2 / 1.5);

    --text-3xl: 30px;

    --text-3xl--line-height: calc(2.25 / 1.875);

    --text-4xl: 35px;

    --text-4xl--line-height: calc(2.5 / 2.25);

    --text-5xl: 50px;

    --text-5xl--line-height: 1;

    --text-6xl: 60px;

    --text-6xl--line-height: 1;

    --text-7xl: 70px;

    --text-7xl--line-height: 1;

    --text-8xl: 6rem;

    --text-8xl--line-height: 1;

    --text-9xl: 120px;

    --font-weight-light: 300;

    --font-weight-normal: 400;

    --font-weight-medium: 500;

    --font-weight-semibold: 600;

    --font-weight-bold: 700;

    --font-weight-extrabold: 800;

    --font-weight-black: 900;

    --tracking-widest: 0.1em;

    --leading-relaxed: 1.625;

    --radius-sm: 0.25rem;

    --radius-md: 0.375rem;

    --radius-lg: 0.5rem;

    --radius-xl: 0.75rem;

    --radius-2xl: 20px;

    --radius-4xl: 30px;

    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

    --blur-2xl: 40px;

    --default-transition-duration: 150ms;

    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    --default-font-family: var(--font-sans);

    --default-mono-font-family: var(--font-mono);

    --radius: 3px;

    --font-title: "Inter";

    --font-display: "Red Hat Display";

    --font-display-2: "Paytone One";

    --z-index-1: 1;

    --z-index-2: 2;

    --z-index-4: 4;

    --z-index-9999: 9999;

    --z-index-99999: 99999;

    --color-primary: var(--primary);

    --color-secondary: var(--secondary);

    --color-bodyfg: var(--bodyfg);

    --color-bodybg: var(--bodybg);

    --color-bodytext: var(--bodytext);

    --color-card: var(--card);

    --color-gary: #F3F3F3;

    --color-lightbg: #FAFAFA;

    --color-social: #191B1D;

    --color-socialbox: #FF7836;

    --color-card-light: #191B1D;

    --color-textlight: #171717b3;

    --color-infobg: #D4FFF5;

    --color-darkinfo: #028f7b;

    --color-pich: #FFE4F0;

    --color-lightyellow: #F9FFE0;

    --color-lightgarybg: #F5F7F6;

    --color-titelgary: #77775B;

    --color-lightbackground: #F1F1F1;

    --color-yellow: #ffa808;

    --divider-gradient: 90deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%;

    --color-green: #17D551;

    --color-lightgreen: #EAF5E9;

    --color-bggreen: #73E371;

    --color-orange: #FF7836;

    --color-textgreen: #03454F;

    --color-banner3text: #BCC0C0;

    --color-banner3title: #5E6D6A;

    --color-banner3bgcolor: #F5F5F5;

    --color-banner3inputcolor: #999999;

    --color-experienceboxborder: #E8E8E8;

    --color-banner2bgcolor: #FFF3E6;

    --color-banner2bgsecond: #FFEDDA;

    --color-bglight: #F9F9F9;

    --text-2xs: 13px;

    --text-2sm: 15px;

    --text-xxl: 22px;

    --text-2\.5xl: 28px;

    --text-4\.5xl: 45px;

    --text-4\.3xl: 43px;

    --text-4\.75xl: 40px;

    --text-4\.8xl: 45px;

    --text-5\.5xl: 55px;

    --text-5\.2xl: 52px;

    --text-6\.5xl: 65px;

    --text-2xxl: 26px;

    --text-7xxl: 80px;

    --text-7\.7xl: 90px;

    --text-8\.5xl: 100px;

    --text-10xl: 160px;

    --animate-rotate: rotate 20s infinite linear;

    --animate-topshap: topshap 4s infinite;

    --animate-dzRing: dzRing 4s infinite;

    --animate-ScaleInOut: ScaleInOut 30s linear infinite;

    --animate-toTopFromBottom: toTopFromBottom 0.8s ease 0s 1 normal forwards running;

    --radius-2lg: 10px;

  }

}

@layer base {

  *, ::after, ::before, ::backdrop, ::file-selector-button {

    box-sizing: border-box;

    margin: 0;

    padding: 0;

    border: 0 solid;

  }

  html, :host {

    line-height: 1.5;

    -webkit-text-size-adjust: 100%;

    tab-size: 4;

    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");

    font-feature-settings: var(--default-font-feature-settings, normal);

    font-variation-settings: var(--default-font-variation-settings, normal);

    -webkit-tap-highlight-color: transparent;

  }

  hr {

    height: 0;

    color: inherit;

    border-top-width: 1px;

  }

  abbr:where([title]) {

    -webkit-text-decoration: underline dotted;

    text-decoration: underline dotted;

  }

  h1, h2, h3, h4, h5, h6 {

    font-size: inherit;

    font-weight: inherit;

  }

  a {

    color: inherit;

    -webkit-text-decoration: inherit;

    text-decoration: inherit;

  }

  b, strong {

    font-weight: bolder;

  }

  code, kbd, samp, pre {

    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);

    font-feature-settings: var(--default-mono-font-feature-settings, normal);

    font-variation-settings: var(--default-mono-font-variation-settings, normal);

    font-size: 1em;

  }

  small {

    font-size: 80%;

  }

  sub, sup {

    font-size: 75%;

    line-height: 0;

    position: relative;

    vertical-align: baseline;

  }

  sub {

    bottom: -0.25em;

  }

  sup {

    top: -0.5em;

  }

  table {

    text-indent: 0;

    border-color: inherit;

    border-collapse: collapse;

  }

  :-moz-focusring {

    outline: auto;

  }

  progress {

    vertical-align: baseline;

  }

  summary {

    display: list-item;

  }

  ol, ul, menu {

    list-style: none;

  }

  img, svg, video, canvas, audio, iframe, embed, object {

    display: block;

    vertical-align: middle;

  }

  img, video {

    max-width: 100%;

    height: auto;

  }

  button, input, select, optgroup, textarea, ::file-selector-button {

    font: inherit;

    font-feature-settings: inherit;

    font-variation-settings: inherit;

    letter-spacing: inherit;

    color: inherit;

    border-radius: 0;

    background-color: transparent;

    opacity: 1;

  }

  :where(select:is([multiple], [size])) optgroup {

    font-weight: bolder;

  }

  :where(select:is([multiple], [size])) optgroup option {

    padding-inline-start: 20px;

  }

  ::file-selector-button {

    margin-inline-end: 4px;

  }

  ::placeholder {

    opacity: 1;

  }

  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {

    ::placeholder {

      color: currentcolor;

      @supports (color: color-mix(in lab, red, red)) {

        color: color-mix(in oklab, currentcolor 50%, transparent);

      }

    }

  }

  textarea {

    resize: vertical;

  }

  ::-webkit-search-decoration {

    -webkit-appearance: none;

  }

  ::-webkit-date-and-time-value {

    min-height: 1lh;

    text-align: inherit;

  }

  ::-webkit-datetime-edit {

    display: inline-flex;

  }

  ::-webkit-datetime-edit-fields-wrapper {

    padding: 0;

  }

  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {

    padding-block: 0;

  }

  :-moz-ui-invalid {

    box-shadow: none;

  }

  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {

    appearance: button;

  }

  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {

    height: auto;

  }

  [hidden]:where(:not([hidden="until-found"])) {

    display: none !important;

  }

}

@layer utilities {

  .pointer-events-none {

    pointer-events: none;

  }

  .invisible {

    visibility: hidden;

  }

  .visible {

    visibility: visible;

  }

  .\!absolute {

    position: absolute !important;

  }

  .\!relative {

    position: relative !important;

  }

  .\!sticky {

    position: sticky !important;

  }

  .absolute {

    position: absolute;

  }

  .fixed {

    position: fixed;

  }

  .relative {

    position: relative;

  }

  .static {

    position: static;

  }

  .sticky {

    position: sticky;

  }

  .inset-0 {

    inset: calc(var(--spacing) * 0);

  }

  .\!-top-0 {

    top: calc(var(--spacing) * -0) !important;

  }

  .\!top-0 {

    top: calc(var(--spacing) * 0) !important;

  }

  .\!top-1\/2 {

    top: calc(1/2 * 100%) !important;

  }

  .-top-10 {

    top: calc(var(--spacing) * -10);

  }

  .-top-50 {

    top: calc(var(--spacing) * -50);

  }

  .-top-190 {

    top: calc(var(--spacing) * -190);

  }

  .top-0 {

    top: calc(var(--spacing) * 0);

  }

  .top-1\/2 {

    top: calc(1/2 * 100%);

  }

  .top-10 {

    top: calc(var(--spacing) * 10);

  }

  .top-15 {

    top: calc(var(--spacing) * 15);

  }

  .top-18 {

    top: calc(var(--spacing) * 18);

  }

  .top-20 {

    top: calc(var(--spacing) * 20);

  }

  .top-40 {

    top: calc(var(--spacing) * 40);

  }

  .top-50 {

    top: calc(var(--spacing) * 50);

  }

  .top-97 {

    top: calc(var(--spacing) * 97);

  }

  .top-100 {

    top: calc(var(--spacing) * 100);

  }

  .top-120 {

    top: calc(var(--spacing) * 120);

  }

  .top-200 {

    top: calc(var(--spacing) * 200);

  }

  .top-330 {

    top: calc(var(--spacing) * 330);

  }

  .top-430 {

    top: calc(var(--spacing) * 430);

  }

  .top-665 {

    top: calc(var(--spacing) * 665);

  }

  .top-\[12\%\] {

    top: 12%;

  }

  .top-\[15\%\] {

    top: 15%;

  }

  .top-\[20\%\] {

    top: 20%;

  }

  .top-\[28\%\] {

    top: 28%;

  }

  .top-\[30\%\] {

    top: 30%;

  }

  .top-\[35\%\] {

    top: 35%;

  }

  .top-\[42\%\] {

    top: 42%;

  }

  .top-\[53\%\] {

    top: 53%;

  }

  .top-\[62\%\] {

    top: 62%;

  }

  .\!right-auto {

    right: auto !important;

  }

  .-right-10 {

    right: calc(var(--spacing) * -10);

  }

  .-right-20 {

    right: calc(var(--spacing) * -20);

  }

  .-right-50 {

    right: calc(var(--spacing) * -50);

  }

  .-right-60 {

    right: calc(var(--spacing) * -60);

  }

  .-right-150 {

    right: calc(var(--spacing) * -150);

  }

  .\[right\:calc\(calc\(100\%_-_1691px\)_\/_2\)\] {

    right: calc(calc(100% - 1691px) / 2);

  }

  .right-0 {

    right: calc(var(--spacing) * 0);

  }

  .right-1\/2 {

    right: calc(1/2 * 100%);

  }

  .right-10 {

    right: calc(var(--spacing) * 10);

  }

  .right-15 {

    right: calc(var(--spacing) * 15);

  }

  .right-20 {

    right: calc(var(--spacing) * 20);

  }

  .right-30 {

    right: calc(var(--spacing) * 30);

  }

  .right-50 {

    right: calc(var(--spacing) * 50);

  }

  .right-72 {

    right: calc(var(--spacing) * 72);

  }

  .right-78 {

    right: calc(var(--spacing) * 78);

  }

  .right-80 {

    right: calc(var(--spacing) * 80);

  }

  .right-380 {

    right: calc(var(--spacing) * 380);

  }

  .right-\[10\%\] {

    right: 10%;

  }

  .right-\[32\%\] {

    right: 32%;

  }

  .\!-bottom-0 {

    bottom: calc(var(--spacing) * -0) !important;

  }

  .\!bottom-auto {

    bottom: auto !important;

  }

  .-bottom-11 {

    bottom: calc(var(--spacing) * -11);

  }

  .-bottom-18 {

    bottom: calc(var(--spacing) * -18);

  }

  .-bottom-45 {

    bottom: calc(var(--spacing) * -45);

  }

  .-bottom-50 {

    bottom: calc(var(--spacing) * -50);

  }

  .-bottom-65 {

    bottom: calc(var(--spacing) * -65);

  }

  .-bottom-100 {

    bottom: calc(var(--spacing) * -100);

  }

  .bottom-0 {

    bottom: calc(var(--spacing) * 0);

  }

  .bottom-1\/2 {

    bottom: calc(1/2 * 100%);

  }

  .bottom-20 {

    bottom: calc(var(--spacing) * 20);

  }

  .bottom-30 {

    bottom: calc(var(--spacing) * 30);

  }

  .bottom-60 {

    bottom: calc(var(--spacing) * 60);

  }

  .bottom-\[3\%\] {

    bottom: 3%;

  }

  .bottom-full {

    bottom: 100%;

  }

  .\!left-30 {

    left: calc(var(--spacing) * 30) !important;

  }

  .\!left-auto {

    left: auto !important;

  }

  .-left-15 {

    left: calc(var(--spacing) * -15);

  }

  .-left-43 {

    left: calc(var(--spacing) * -43);

  }

  .-left-50 {

    left: calc(var(--spacing) * -50);

  }

  .-left-150 {

    left: calc(var(--spacing) * -150);

  }

  .-left-235 {

    left: calc(var(--spacing) * -235);

  }

  .-left-320 {

    left: calc(var(--spacing) * -320);

  }

  .left-0 {

    left: calc(var(--spacing) * 0);

  }

  .left-1\/2 {

    left: calc(1/2 * 100%);

  }

  .left-10 {

    left: calc(var(--spacing) * 10);

  }

  .left-20 {

    left: calc(var(--spacing) * 20);

  }

  .left-25 {

    left: calc(var(--spacing) * 25);

  }

  .left-30 {

    left: calc(var(--spacing) * 30);

  }

  .left-40 {

    left: calc(var(--spacing) * 40);

  }

  .left-165 {

    left: calc(var(--spacing) * 165);

  }

  .left-\[18\%\] {

    left: 18%;

  }

  .left-\[43\%\] {

    left: 43%;

  }

  .left-\[78\%\] {

    left: 78%;

  }

  .left-\[calc\(50\%_-_2302\.55px\/2\)\] {

    left: calc(50% - 2302.55px / 2);

  }

  .\!z-0 {

    z-index: 0 !important;

  }

  .-z-1 {

    z-index: calc(var(--z-index-1) * -1);

  }

  .-z-3 {

    z-index: calc(3 * -1);

  }

  .z-0 {

    z-index: 0;

  }

  .z-1 {

    z-index: var(--z-index-1);

  }

  .z-2 {

    z-index: var(--z-index-2);

  }

  .z-3 {

    z-index: 3;

  }

  .z-4 {

    z-index: var(--z-index-4);

  }

  .z-5 {

    z-index: 5;

  }

  .z-9 {

    z-index: 9;

  }

  .z-10 {

    z-index: 10;

  }

  .z-98 {

    z-index: 98;

  }

  .z-99 {

    z-index: 99;

  }

  .z-9999 {

    z-index: var(--z-index-9999);

  }

  .z-99999 {

    z-index: var(--z-index-99999);

  }

  .-order-1 {

    order: calc(1 * -1);

  }

  .order-1 {

    order: 1;

  }

  .order-2 {

    order: 2;

  }

  .col-span-6 {

    grid-column: span 6 / span 6;

  }

  .col-span-12 {

    grid-column: span 12 / span 12;

  }

  .float-left {

    float: left;

  }

  .\!container {

    width: 100% !important;

    @media (width >= 576px) {

      max-width: 576px !important;

    }

    @media (width >= 768px) {

      max-width: 768px !important;

    }

    @media (width >= 992px) {

      max-width: 992px !important;

    }

    @media (width >= 1024px) {

      max-width: 1024px !important;

    }

    @media (width >= 1200px) {

      max-width: 1200px !important;

    }

    @media (width >= 1400px) {

      max-width: 1400px !important;

    }

    @media (width >= 1600px) {

      max-width: 1600px !important;

    }

    @media (width >= 1700px) {

      max-width: 1700px !important;

    }

  }

  .container {

    width: 100%;

    @media (width >= 576px) {

      max-width: 576px;

    }

    @media (width >= 768px) {

      max-width: 768px;

    }

    @media (width >= 992px) {

      max-width: 992px;

    }

    @media (width >= 1024px) {

      max-width: 1024px;

    }

    @media (width >= 1200px) {

      max-width: 1200px;

    }

    @media (width >= 1400px) {

      max-width: 1400px;

    }

    @media (width >= 1600px) {

      max-width: 1600px;

    }

    @media (width >= 1700px) {

      max-width: 1700px;

    }

  }

  .m-auto {

    margin: auto;

  }

  .-mx-10 {

    margin-inline: calc(var(--spacing) * -10);

  }

  .mx-10 {

    margin-inline: calc(var(--spacing) * 10);

  }

  .mx-15 {

    margin-inline: calc(var(--spacing) * 15);

  }

  .mx-20 {

    margin-inline: calc(var(--spacing) * 20);

  }

  .mx-auto {

    margin-inline: auto;

  }

  .my-10 {

    margin-block: calc(var(--spacing) * 10);

  }

  .my-20 {

    margin-block: calc(var(--spacing) * 20);

  }

  .my-30 {

    margin-block: calc(var(--spacing) * 30);

  }

  .-ms-40 {

    margin-inline-start: calc(var(--spacing) * -40);

  }

  .ms-5 {

    margin-inline-start: calc(var(--spacing) * 5);

  }

  .ms-15 {

    margin-inline-start: calc(var(--spacing) * 15);

  }

  .ms-16 {

    margin-inline-start: calc(var(--spacing) * 16);

  }

  .ms-auto {

    margin-inline-start: auto;

  }

  .-me-13 {

    margin-inline-end: calc(var(--spacing) * -13);

  }

  .me-5 {

    margin-inline-end: calc(var(--spacing) * 5);

  }

  .me-10 {

    margin-inline-end: calc(var(--spacing) * 10);

  }

  .\!mt-0 {

    margin-top: calc(var(--spacing) * 0) !important;

  }

  .\!mt-20 {

    margin-top: calc(var(--spacing) * 20) !important;

  }

  .\!mt-40 {

    margin-top: calc(var(--spacing) * 40) !important;

  }

  .\!mt-auto {

    margin-top: auto !important;

  }

  .-mt-30 {

    margin-top: calc(var(--spacing) * -30);

  }

  .-mt-90 {

    margin-top: calc(var(--spacing) * -90);

  }

  .mt-8 {

    margin-top: calc(var(--spacing) * 8);

  }

  .mt-10 {

    margin-top: calc(var(--spacing) * 10);

  }

  .mt-15 {

    margin-top: calc(var(--spacing) * 15);

  }

  .mt-20 {

    margin-top: calc(var(--spacing) * 20);

  }

  .mt-25 {

    margin-top: calc(var(--spacing) * 25);

  }

  .mt-27 {

    margin-top: calc(var(--spacing) * 27);

  }

  .mt-30 {

    margin-top: calc(var(--spacing) * 30);

  }

  .mt-40 {

    margin-top: calc(var(--spacing) * 40);

  }

  .mt-50 {

    margin-top: calc(var(--spacing) * 50);

  }

  .mt-auto {

    margin-top: auto;

  }

  .mr-1 {

    margin-right: calc(var(--spacing) * 1);

  }

  .mr-2 {

    margin-right: calc(var(--spacing) * 2);

  }

  .mr-4 {

    margin-right: calc(var(--spacing) * 4);

  }

  .mr-5 {

    margin-right: calc(var(--spacing) * 5);

  }

  .mr-8 {

    margin-right: calc(var(--spacing) * 8);

  }

  .mr-10 {

    margin-right: calc(var(--spacing) * 10);

  }

  .mr-15 {

    margin-right: calc(var(--spacing) * 15);

  }

  .mr-16 {

    margin-right: calc(var(--spacing) * 16);

  }

  .mr-20 {

    margin-right: calc(var(--spacing) * 20);

  }

  .mr-30 {

    margin-right: calc(var(--spacing) * 30);

  }

  .mr-40 {

    margin-right: calc(var(--spacing) * 40);

  }

  .\!mb-15 {

    margin-bottom: calc(var(--spacing) * 15) !important;

  }

  .-mb-0\.5 {

    margin-bottom: calc(var(--spacing) * -0.5);

  }

  .-mb-15 {

    margin-bottom: calc(var(--spacing) * -15);

  }

  .mb-2 {

    margin-bottom: calc(var(--spacing) * 2);

  }

  .mb-4 {

    margin-bottom: calc(var(--spacing) * 4);

  }

  .mb-5 {

    margin-bottom: calc(var(--spacing) * 5);

  }

  .mb-8 {

    margin-bottom: calc(var(--spacing) * 8);

  }

  .mb-10 {

    margin-bottom: calc(var(--spacing) * 10);

  }

  .mb-12 {

    margin-bottom: calc(var(--spacing) * 12);

  }

  .mb-14 {

    margin-bottom: calc(var(--spacing) * 14);

  }

  .mb-14\.5 {

    margin-bottom: calc(var(--spacing) * 14.5);

  }

  .mb-15 {

    margin-bottom: calc(var(--spacing) * 15);

  }

  .mb-16 {

    margin-bottom: calc(var(--spacing) * 16);

  }

  .mb-20 {

    margin-bottom: calc(var(--spacing) * 20);

  }

  .mb-21 {

    margin-bottom: calc(var(--spacing) * 21);

  }

  .mb-24 {

    margin-bottom: calc(var(--spacing) * 24);

  }

  .mb-25 {

    margin-bottom: calc(var(--spacing) * 25);

  }

  .mb-26 {

    margin-bottom: calc(var(--spacing) * 26);

  }

  .mb-30 {

    margin-bottom: calc(var(--spacing) * 30);

  }

  .mb-35 {

    margin-bottom: calc(var(--spacing) * 35);

  }

  .mb-40 {

    margin-bottom: calc(var(--spacing) * 40);

  }

  .mb-45 {

    margin-bottom: calc(var(--spacing) * 45);

  }

  .mb-50 {

    margin-bottom: calc(var(--spacing) * 50);

  }

  .mb-70 {

    margin-bottom: calc(var(--spacing) * 70);

  }

  .mb-100 {

    margin-bottom: calc(var(--spacing) * 100);

  }

  .-ml-45 {

    margin-left: calc(var(--spacing) * -45);

  }

  .ml-9 {

    margin-left: calc(var(--spacing) * 9);

  }

  .ml-10 {

    margin-left: calc(var(--spacing) * 10);

  }

  .ml-18 {

    margin-left: calc(var(--spacing) * 18);

  }

  .ml-auto {

    margin-left: auto;

  }

  .\!block {

    display: block !important;

  }

  .\!flex {

    display: flex !important;

  }

  .block {

    display: block;

  }

  .contents {

    display: contents;

  }

  .flex {

    display: flex;

  }

  .grid {

    display: grid;

  }

  .hidden {

    display: none;

  }

  .inline {

    display: inline;

  }

  .inline-block {

    display: inline-block;

  }

  .inline-flex {

    display: inline-flex;

  }

  .table {

    display: table;

  }

  .table-column {

    display: table-column;

  }

  .table-row {

    display: table-row;

  }

  .\!size-20 {

    width: calc(var(--spacing) * 20) !important;

    height: calc(var(--spacing) * 20) !important;

  }

  .\!size-auto {

    width: auto !important;

    height: auto !important;

  }

  .size-5 {

    width: calc(var(--spacing) * 5);

    height: calc(var(--spacing) * 5);

  }

  .size-15 {

    width: calc(var(--spacing) * 15);

    height: calc(var(--spacing) * 15);

  }

  .size-16 {

    width: calc(var(--spacing) * 16);

    height: calc(var(--spacing) * 16);

  }

  .size-26 {

    width: calc(var(--spacing) * 26);

    height: calc(var(--spacing) * 26);

  }

  .size-30 {

    width: calc(var(--spacing) * 30);

    height: calc(var(--spacing) * 30);

  }

  .size-34 {

    width: calc(var(--spacing) * 34);

    height: calc(var(--spacing) * 34);

  }

  .size-35 {

    width: calc(var(--spacing) * 35);

    height: calc(var(--spacing) * 35);

  }

  .size-38 {

    width: calc(var(--spacing) * 38);

    height: calc(var(--spacing) * 38);

  }

  .size-40 {

    width: calc(var(--spacing) * 40);

    height: calc(var(--spacing) * 40);

  }

  .size-42 {

    width: calc(var(--spacing) * 42);

    height: calc(var(--spacing) * 42);

  }

  .size-44 {

    width: calc(var(--spacing) * 44);

    height: calc(var(--spacing) * 44);

  }

  .size-45 {

    width: calc(var(--spacing) * 45);

    height: calc(var(--spacing) * 45);

  }

  .size-50 {

    width: calc(var(--spacing) * 50);

    height: calc(var(--spacing) * 50);

  }

  .size-52 {

    width: calc(var(--spacing) * 52);

    height: calc(var(--spacing) * 52);

  }

  .size-55 {

    width: calc(var(--spacing) * 55);

    height: calc(var(--spacing) * 55);

  }

  .size-60 {

    width: calc(var(--spacing) * 60);

    height: calc(var(--spacing) * 60);

  }

  .size-65 {

    width: calc(var(--spacing) * 65);

    height: calc(var(--spacing) * 65);

  }

  .size-70 {

    width: calc(var(--spacing) * 70);

    height: calc(var(--spacing) * 70);

  }

  .size-77 {

    width: calc(var(--spacing) * 77);

    height: calc(var(--spacing) * 77);

  }

  .size-80 {

    width: calc(var(--spacing) * 80);

    height: calc(var(--spacing) * 80);

  }

  .size-85 {

    width: calc(var(--spacing) * 85);

    height: calc(var(--spacing) * 85);

  }

  .size-100 {

    width: calc(var(--spacing) * 100);

    height: calc(var(--spacing) * 100);

  }

  .size-110 {

    width: calc(var(--spacing) * 110);

    height: calc(var(--spacing) * 110);

  }

  .size-170 {

    width: calc(var(--spacing) * 170);

    height: calc(var(--spacing) * 170);

  }

  .size-176 {

    width: calc(var(--spacing) * 176);

    height: calc(var(--spacing) * 176);

  }

  .size-290 {

    width: calc(var(--spacing) * 290);

    height: calc(var(--spacing) * 290);

  }

  .size-full {

    width: 100%;

    height: 100%;

  }

  .\!h-1 {

    height: calc(var(--spacing) * 1) !important;

  }

  .\!h-auto {

    height: auto !important;

  }

  .\!h-full {

    height: 100% !important;

  }

  .h-20 {

    height: calc(var(--spacing) * 20);

  }

  .h-30 {

    height: calc(var(--spacing) * 30);

  }

  .h-40 {

    height: calc(var(--spacing) * 40);

  }

  .h-50 {

    height: calc(var(--spacing) * 50);

  }

  .h-150 {

    height: calc(var(--spacing) * 150);

  }

  .h-180 {

    height: calc(var(--spacing) * 180);

  }

  .h-250 {

    height: calc(var(--spacing) * 250);

  }

  .h-300 {

    height: calc(var(--spacing) * 300);

  }

  .h-350 {

    height: calc(var(--spacing) * 350);

  }

  .h-500 {

    height: calc(var(--spacing) * 500);

  }

  .h-720 {

    height: calc(var(--spacing) * 720);

  }

  .h-\[calc\(100vh-140px\)\] {

    height: calc(100vh - 140px);

  }

  .h-auto {

    height: auto;

  }

  .h-full {

    height: 100%;

  }

  .h-px {

    height: 1px;

  }

  .h-screen {

    height: 100vh;

  }

  .max-h-400 {

    max-height: calc(var(--spacing) * 400);

  }

  .max-h-500 {

    max-height: calc(var(--spacing) * 500);

  }

  .max-h-700 {

    max-height: calc(var(--spacing) * 700);

  }

  .max-h-800 {

    max-height: calc(var(--spacing) * 800);

  }

  .max-h-850 {

    max-height: calc(var(--spacing) * 850);

  }

  .max-h-999 {

    max-height: calc(var(--spacing) * 999);

  }

  .min-h-35 {

    min-height: calc(var(--spacing) * 35);

  }

  .min-h-115 {

    min-height: calc(var(--spacing) * 115);

  }

  .min-h-150 {

    min-height: calc(var(--spacing) * 150);

  }

  .min-h-270 {

    min-height: calc(var(--spacing) * 270);

  }

  .min-h-300 {

    min-height: calc(var(--spacing) * 300);

  }

  .min-h-400 {

    min-height: calc(var(--spacing) * 400);

  }

  .\!w-50 {

    width: calc(var(--spacing) * 50) !important;

  }

  .\!w-auto {

    width: auto !important;

  }

  .\!w-full {

    width: 100% !important;

  }

  .w-1\/2 {

    width: calc(1/2 * 100%);

  }

  .w-2\/3 {

    width: calc(2/3 * 100%);

  }

  .w-2\/5 {

    width: calc(2/5 * 100%);

  }

  .w-40 {

    width: calc(var(--spacing) * 40);

  }

  .w-42 {

    width: calc(var(--spacing) * 42);

  }

  .w-58 {

    width: calc(var(--spacing) * 58);

  }

  .w-100 {

    width: calc(var(--spacing) * 100);

  }

  .w-107 {

    width: calc(var(--spacing) * 107);

  }

  .w-110 {

    width: calc(var(--spacing) * 110);

  }

  .w-130 {

    width: calc(var(--spacing) * 130);

  }

  .w-300 {

    width: calc(var(--spacing) * 300);

  }

  .w-320 {

    width: calc(var(--spacing) * 320);

  }

  .w-350 {

    width: calc(var(--spacing) * 350);

  }

  .w-713 {

    width: calc(var(--spacing) * 713);

  }

  .w-\[1\%\] {

    width: 1%;

  }

  .w-\[70\%\] {

    width: 70%;

  }

  .w-full {

    width: 100%;

  }

  .w-max {

    width: max-content;

  }

  .max-w-2xl {

    max-width: var(--container-2xl);

  }

  .max-w-107 {

    max-width: calc(var(--spacing) * 107);

  }

  .max-w-140 {

    max-width: calc(var(--spacing) * 140);

  }

  .max-w-160 {

    max-width: calc(var(--spacing) * 160);

  }

  .max-w-170 {

    max-width: calc(var(--spacing) * 170);

  }

  .max-w-340 {

    max-width: calc(var(--spacing) * 340);

  }

  .max-w-450 {

    max-width: calc(var(--spacing) * 450);

  }

  .max-w-500 {

    max-width: calc(var(--spacing) * 500);

  }

  .max-w-514 {

    max-width: calc(var(--spacing) * 514);

  }

  .max-w-559 {

    max-width: calc(var(--spacing) * 559);

  }

  .max-w-560 {

    max-width: calc(var(--spacing) * 560);

  }

  .max-w-580 {

    max-width: calc(var(--spacing) * 580);

  }

  .max-w-600 {

    max-width: calc(var(--spacing) * 600);

  }

  .max-w-620 {

    max-width: calc(var(--spacing) * 620);

  }

  .max-w-666 {

    max-width: calc(var(--spacing) * 666);

  }

  .max-w-700 {

    max-width: calc(var(--spacing) * 700);

  }

  .max-w-800 {

    max-width: calc(var(--spacing) * 800);

  }

  .max-w-850 {

    max-width: calc(var(--spacing) * 850);

  }

  .max-w-887 {

    max-width: calc(var(--spacing) * 887);

  }

  .max-w-900 {

    max-width: calc(var(--spacing) * 900);

  }

  .max-w-1000 {

    max-width: calc(var(--spacing) * 1000);

  }

  .max-w-1200 {

    max-width: calc(var(--spacing) * 1200);

  }

  .max-w-1320 {

    max-width: calc(var(--spacing) * 1320);

  }

  .max-w-full {

    max-width: 100%;

  }

  .min-w-25 {

    min-width: calc(var(--spacing) * 25);

  }

  .min-w-35 {

    min-width: calc(var(--spacing) * 35);

  }

  .min-w-40 {

    min-width: calc(var(--spacing) * 40);

  }

  .min-w-50 {

    min-width: calc(var(--spacing) * 50);

  }

  .min-w-60 {

    min-width: calc(var(--spacing) * 60);

  }

  .min-w-70 {

    min-width: calc(var(--spacing) * 70);

  }

  .min-w-80 {

    min-width: calc(var(--spacing) * 80);

  }

  .min-w-90 {

    min-width: calc(var(--spacing) * 90);

  }

  .flex-1 {

    flex: 1;

  }

  .flex-auto {

    flex: auto;

  }

  .grow {

    flex-grow: 1;

  }

  .border-collapse {

    border-collapse: collapse;

  }

  .-translate-1\/2 {

    --tw-translate-x: calc(calc(1/2 * 100%) * -1);

    --tw-translate-y: calc(calc(1/2 * 100%) * -1);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .-translate-x-1\/2 {

    --tw-translate-x: calc(calc(1/2 * 100%) * -1);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .-translate-x-full {

    --tw-translate-x: -100%;

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .translate-x-1\/2 {

    --tw-translate-x: calc(1/2 * 100%);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .translate-x-30 {

    --tw-translate-x: calc(var(--spacing) * 30);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .translate-x-\[-130px\] {

    --tw-translate-x: -130px;

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .-translate-y-0\.5 {

    --tw-translate-y: calc(var(--spacing) * -0.5);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .-translate-y-1\/2 {

    --tw-translate-y: calc(calc(1/2 * 100%) * -1);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .-translate-y-16 {

    --tw-translate-y: calc(var(--spacing) * -16);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .translate-y-1\/2 {

    --tw-translate-y: calc(1/2 * 100%);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .translate-y-10 {

    --tw-translate-y: calc(var(--spacing) * 10);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .scale-\[0\.6\] {

    scale: 0.6;

  }

  .scale-\[0\.30\] {

    scale: 0.30;

  }

  .scale-\[0\.45\] {

    scale: 0.45;

  }

  .scale-\[0\.67\] {

    scale: 0.67;

  }

  .-rotate-90 {

    rotate: calc(90deg * -1);

  }

  .rotate-\[-6deg\] {

    rotate: -6deg;

  }

  .rotate-\[-360deg\] {

    rotate: -360deg;

  }

  .rotate-\[15deg\] {

    rotate: 15deg;

  }

  .rotate-\[35deg\] {

    rotate: 35deg;

  }

  .\[transform\:translate\(-20\%\,_-50\%\)\] {

    transform: translate(-20%, -50%);

  }

  .transform {

    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);

  }

  .animate-ScaleInOut {

    animation: var(--animate-ScaleInOut);

  }

  .animate-dzRing {

    animation: var(--animate-dzRing);

  }

  .animate-rotate {

    animation: var(--animate-rotate);

  }

  .animate-topshap {

    animation: var(--animate-topshap);

  }

  .cursor-default {

    cursor: default;

  }

  .cursor-move {

    cursor: move;

  }

  .cursor-pointer {

    cursor: pointer;

  }

  .cursor-text {

    cursor: text;

  }

  .resize {

    resize: both;

  }

  .grid-cols-12 {

    grid-template-columns: repeat(12, minmax(0, 1fr));

  }

  .flex-col {

    flex-direction: column;

  }

  .flex-row {

    flex-direction: row;

  }

  .flex-wrap {

    flex-wrap: wrap;

  }

  .items-baseline {

    align-items: baseline;

  }

  .items-center {

    align-items: center;

  }

  .items-end {

    align-items: flex-end;

  }

  .items-start {

    align-items: flex-start;

  }

  .items-stretch {

    align-items: stretch;

  }

  .justify-between {

    justify-content: space-between;

  }

  .justify-center {

    justify-content: center;

  }

  .justify-end {

    justify-content: flex-end;

  }

  .justify-start {

    justify-content: flex-start;

  }

  .gap-1 {

    gap: calc(var(--spacing) * 1);

  }

  .gap-4 {

    gap: calc(var(--spacing) * 4);

  }

  .gap-5 {

    gap: calc(var(--spacing) * 5);

  }

  .gap-6 {

    gap: calc(var(--spacing) * 6);

  }

  .gap-8 {

    gap: calc(var(--spacing) * 8);

  }

  .gap-10 {

    gap: calc(var(--spacing) * 10);

  }

  .gap-11 {

    gap: calc(var(--spacing) * 11);

  }

  .gap-12 {

    gap: calc(var(--spacing) * 12);

  }

  .gap-13 {

    gap: calc(var(--spacing) * 13);

  }

  .gap-14 {

    gap: calc(var(--spacing) * 14);

  }

  .gap-15 {

    gap: calc(var(--spacing) * 15);

  }

  .gap-17 {

    gap: calc(var(--spacing) * 17);

  }

  .gap-20 {

    gap: calc(var(--spacing) * 20);

  }

  .gap-25 {

    gap: calc(var(--spacing) * 25);

  }

  .gap-26 {

    gap: calc(var(--spacing) * 26);

  }

  .gap-30 {

    gap: calc(var(--spacing) * 30);

  }

  .gap-35 {

    gap: calc(var(--spacing) * 35);

  }

  .gap-37 {

    gap: calc(var(--spacing) * 37);

  }

  .gap-40 {

    gap: calc(var(--spacing) * 40);

  }

  .gap-41 {

    gap: calc(var(--spacing) * 41);

  }

  .gap-43 {

    gap: calc(var(--spacing) * 43);

  }

  .gap-45 {

    gap: calc(var(--spacing) * 45);

  }

  .gap-60 {

    gap: calc(var(--spacing) * 60);

  }

  .gap-x-16 {

    column-gap: calc(var(--spacing) * 16);

  }

  .gap-x-40 {

    column-gap: calc(var(--spacing) * 40);

  }

  .gap-y-6 {

    row-gap: calc(var(--spacing) * 6);

  }

  .gap-y-20 {

    row-gap: calc(var(--spacing) * 20);

  }

  .gap-y-30 {

    row-gap: calc(var(--spacing) * 30);

  }

  .gap-y-66 {

    row-gap: calc(var(--spacing) * 66);

  }

  .truncate {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }

  .overflow-auto {

    overflow: auto;

  }

  .overflow-hidden {

    overflow: hidden;

  }

  .overflow-x-auto {

    overflow-x: auto;

  }

  .overflow-y-auto {

    overflow-y: auto;

  }

  .\!rounded-none {

    border-radius: 0 !important;

  }

  .rounded {

    border-radius: var(--radius);

  }

  .rounded-2lg {

    border-radius: var(--radius-2lg);

  }

  .rounded-2xl {

    border-radius: var(--radius-2xl);

  }

  .rounded-full {

    border-radius: calc(infinity * 1px);

  }

  .rounded-lg {

    border-radius: var(--radius-lg);

  }

  .rounded-md {

    border-radius: var(--radius-md);

  }

  .rounded-none {

    border-radius: 0;

  }

  .rounded-sm {

    border-radius: var(--radius-sm);

  }

  .rounded-xl {

    border-radius: var(--radius-xl);

  }

  .rounded-tl-2lg {

    border-top-left-radius: var(--radius-2lg);

  }

  .rounded-tr-\[15px\] {

    border-top-right-radius: 15px;

  }

  .rounded-br-\[15px\] {

    border-bottom-right-radius: 15px;

  }

  .rounded-bl-2lg {

    border-bottom-left-radius: var(--radius-2lg);

  }

  .border {

    border-style: var(--tw-border-style);

    border-width: 1px;

  }

  .border-2 {

    border-style: var(--tw-border-style);

    border-width: 2px;

  }

  .border-5 {

    border-style: var(--tw-border-style);

    border-width: 5px;

  }

  .border-t {

    border-top-style: var(--tw-border-style);

    border-top-width: 1px;

  }

  .border-r {

    border-right-style: var(--tw-border-style);

    border-right-width: 1px;

  }

  .border-b {

    border-bottom-style: var(--tw-border-style);

    border-bottom-width: 1px;

  }

  .border-b-2 {

    border-bottom-style: var(--tw-border-style);

    border-bottom-width: 2px;

  }

  .\!border-none {

    --tw-border-style: none !important;

    border-style: none !important;

  }

  .border-none {

    --tw-border-style: none;

    border-style: none;

  }

  .border-\[\#383B3F\] {

    border-color: #383B3F;

  }

  .border-\[\#24262B\] {

    border-color: #24262B;

  }

  .border-\[\#D7D7D7\] {

    border-color: #D7D7D7;

  }

  .border-black {

    border-color: var(--color-black);

  }

  .border-black\/10 {

    border-color: color-mix(in srgb, #000 10%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-black) 10%, transparent);

    }

  }

  .border-black\/15 {

    border-color: color-mix(in srgb, #000 15%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-black) 15%, transparent);

    }

  }

  .border-black\/20 {

    border-color: color-mix(in srgb, #000 20%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-black) 20%, transparent);

    }

  }

  .border-black\/30 {

    border-color: color-mix(in srgb, #000 30%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-black) 30%, transparent);

    }

  }

  .border-bodytext\/30 {

    border-color: var(--color-bodytext);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-bodytext) 30%, transparent);

    }

  }

  .border-card {

    border-color: var(--color-card);

  }

  .border-experienceboxborder {

    border-color: var(--color-experienceboxborder);

  }

  .border-gray-200 {

    border-color: var(--color-gray-200);

  }

  .border-lightbg {

    border-color: var(--color-lightbg);

  }

  .border-primary {

    border-color: var(--color-primary);

  }

  .border-secondary {

    border-color: var(--color-secondary);

  }

  .border-secondary\/10 {

    border-color: var(--color-secondary);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-secondary) 10%, transparent);

    }

  }

  .border-transparent {

    border-color: transparent;

  }

  .border-white {

    border-color: var(--color-white);

  }

  .border-white\/20 {

    border-color: color-mix(in srgb, #fff 20%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-white) 20%, transparent);

    }

  }

  .\!bg-lightbg {

    background-color: var(--color-lightbg) !important;

  }

  .\!bg-transparent {

    background-color: transparent !important;

  }

  .bg-\[\#1D1F22\] {

    background-color: #1D1F22;

  }

  .bg-\[\#181D19\] {

    background-color: #181D19;

  }

  .bg-\[\#24262B\] {

    background-color: #24262B;

  }

  .bg-\[\#F9F9F9\] {

    background-color: #F9F9F9;

  }

  .bg-\[\#FFEDDA\] {

    background-color: #FFEDDA;

  }

  .bg-\[\#fff6ec\] {

    background-color: #fff6ec;

  }

  .bg-banner2bgcolor {

    background-color: var(--color-banner2bgcolor);

  }

  .bg-banner2bgsecond {

    background-color: var(--color-banner2bgsecond);

  }

  .bg-banner3bgcolor {

    background-color: var(--color-banner3bgcolor);

  }

  .bg-bggreen {

    background-color: var(--color-bggreen);

  }

  .bg-bglight {

    background-color: var(--color-bglight);

  }

  .bg-black {

    background-color: var(--color-black);

  }

  .bg-black\/5 {

    background-color: color-mix(in srgb, #000 5%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 5%, transparent);

    }

  }

  .bg-black\/10 {

    background-color: color-mix(in srgb, #000 10%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 10%, transparent);

    }

  }

  .bg-black\/20 {

    background-color: color-mix(in srgb, #000 20%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 20%, transparent);

    }

  }

  .bg-black\/40 {

    background-color: color-mix(in srgb, #000 40%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 40%, transparent);

    }

  }

  .bg-black\/50 {

    background-color: color-mix(in srgb, #000 50%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 50%, transparent);

    }

  }

  .bg-black\/80 {

    background-color: color-mix(in srgb, #000 80%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 80%, transparent);

    }

  }

  .bg-bodybg {

    background-color: var(--color-bodybg);

  }

  .bg-bodyfg {

    background-color: var(--color-bodyfg);

  }

  .bg-card {

    background-color: var(--color-card);

  }

  .bg-card-light {

    background-color: var(--color-card-light);

  }

  .bg-gray-300 {

    background-color: var(--color-gray-300);

  }

  .bg-infobg {

    background-color: var(--color-infobg);

  }

  .bg-lightbackground {

    background-color: var(--color-lightbackground);

  }

  .bg-lightbackground\/30 {

    background-color: color-mix(in srgb, #F1F1F1 30%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-lightbackground) 30%, transparent);

    }

  }

  .bg-lightbg {

    background-color: var(--color-lightbg);

  }

  .bg-lightgarybg {

    background-color: var(--color-lightgarybg);

  }

  .bg-lightgreen {

    background-color: var(--color-lightgreen);

  }

  .bg-lightyellow {

    background-color: var(--color-lightyellow);

  }

  .bg-orange {

    background-color: var(--color-orange);

  }

  .bg-pich {

    background-color: var(--color-pich);

  }

  .bg-primary {

    background-color: var(--color-primary);

  }

  .bg-secondary {

    background-color: var(--color-secondary);

  }

  .bg-secondary\/10 {

    background-color: var(--color-secondary);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-secondary) 10%, transparent);

    }

  }

  .bg-textgreen {

    background-color: var(--color-textgreen);

  }

  .bg-transparent {

    background-color: transparent;

  }

  .bg-white {

    background-color: var(--color-white);

  }

  .bg-gradient-to-b {

    --tw-gradient-position: to bottom in oklab;

    background-image: linear-gradient(var(--tw-gradient-stops));

  }

  .bg-\[url\(\'\.\.\/images\/404\.png\'\)\] {

    background-image: url('../images/404.png');

  }

  .bg-\[url\(\'\.\.\/images\/background\/pic1\.png\'\)\] {

    background-image: url('../images/background/pic1.png');

  }

  .bg-\[url\(\.\.\/images\/about-us\/img1\.png\)\] {

    background-image: url(../images/about-us/img1.png);

  }

  .bg-\[url\(\.\.\/images\/background\/bg1\.png\)\] {

    background-image: url(../images/background/bg1.png);

  }

  .bg-\[url\(\.\.\/images\/background\/bg2\.png\)\] {

    background-image: url(../images/background/bg2.png);

  }

  .bg-\[url\(\.\.\/images\/banner3\/background\/bg1\.png\)\] {

    background-image: url(../images/banner3/background/bg1.png);

  }

  .bg-\[url\(\.\.\/images\/blog\/details\/pic3\.png\)\] {

    background-image: url(../images/blog/details/pic3.png);

  }

  .bg-\[url\(\.\.\/images\/service-detail\/pic5\.png\)\] {

    background-image: url(../images/service-detail/pic5.png);

  }

  .from-\[\#FFFFFF\] {

    --tw-gradient-from: #FFFFFF;

    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));

  }

  .from-\[\#ffffff\] {

    --tw-gradient-from: #ffffff;

    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));

  }

  .to-\[\#F2FBF5\] {

    --tw-gradient-to: #F2FBF5;

    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));

  }

  .to-\[\#f2fbf5\] {

    --tw-gradient-to: #f2fbf5;

    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));

  }

  .bg-cover {

    background-size: cover;

  }

  .bg-fixed {

    background-attachment: fixed;

  }

  .bg-center {

    background-position: center;

  }

  .bg-no-repeat {

    background-repeat: no-repeat;

  }

  .fill-secondary {

    fill: var(--color-secondary);

  }

  .stroke-black {

    stroke: var(--color-black);

  }

  .stroke-secondary {

    stroke: var(--color-secondary);

  }

  .stroke-white {

    stroke: var(--color-white);

  }

  .object-contain {

    object-fit: contain;

  }

  .object-cover {

    object-fit: cover;

  }

  .object-center {

    object-position: center;

  }

  .object-top {

    object-position: top;

  }

  .\!p-0 {

    padding: calc(var(--spacing) * 0) !important;

  }

  .p-0 {

    padding: calc(var(--spacing) * 0);

  }

  .p-2 {

    padding: calc(var(--spacing) * 2);

  }

  .p-4 {

    padding: calc(var(--spacing) * 4);

  }

  .p-6 {

    padding: calc(var(--spacing) * 6);

  }

  .p-8 {

    padding: calc(var(--spacing) * 8);

  }

  .p-10 {

    padding: calc(var(--spacing) * 10);

  }

  .p-15 {

    padding: calc(var(--spacing) * 15);

  }

  .p-16 {

    padding: calc(var(--spacing) * 16);

  }

  .p-20 {

    padding: calc(var(--spacing) * 20);

  }

  .p-30 {

    padding: calc(var(--spacing) * 30);

  }

  .p-40 {

    padding: calc(var(--spacing) * 40);

  }

  .p-100 {

    padding: calc(var(--spacing) * 100);

  }

  .px-2\.5 {

    padding-inline: calc(var(--spacing) * 2.5);

  }

  .px-8 {

    padding-inline: calc(var(--spacing) * 8);

  }

  .px-10 {

    padding-inline: calc(var(--spacing) * 10);

  }

  .px-12 {

    padding-inline: calc(var(--spacing) * 12);

  }

  .px-15 {

    padding-inline: calc(var(--spacing) * 15);

  }

  .px-16 {

    padding-inline: calc(var(--spacing) * 16);

  }

  .px-20 {

    padding-inline: calc(var(--spacing) * 20);

  }

  .px-24 {

    padding-inline: calc(var(--spacing) * 24);

  }

  .px-25 {

    padding-inline: calc(var(--spacing) * 25);

  }

  .px-26 {

    padding-inline: calc(var(--spacing) * 26);

  }

  .px-30 {

    padding-inline: calc(var(--spacing) * 30);

  }

  .px-35 {

    padding-inline: calc(var(--spacing) * 35);

  }

  .px-40 {

    padding-inline: calc(var(--spacing) * 40);

  }

  .py-3 {

    padding-block: calc(var(--spacing) * 3);

  }

  .py-4\.5 {

    padding-block: calc(var(--spacing) * 4.5);

  }

  .py-5 {

    padding-block: calc(var(--spacing) * 5);

  }

  .py-6 {

    padding-block: calc(var(--spacing) * 6);

  }

  .py-7 {

    padding-block: calc(var(--spacing) * 7);

  }

  .py-8 {

    padding-block: calc(var(--spacing) * 8);

  }

  .py-10 {

    padding-block: calc(var(--spacing) * 10);

  }

  .py-11 {

    padding-block: calc(var(--spacing) * 11);

  }

  .py-12 {

    padding-block: calc(var(--spacing) * 12);

  }

  .py-13 {

    padding-block: calc(var(--spacing) * 13);

  }

  .py-14 {

    padding-block: calc(var(--spacing) * 14);

  }

  .py-15 {

    padding-block: calc(var(--spacing) * 15);

  }

  .py-15\.5 {

    padding-block: calc(var(--spacing) * 15.5);

  }

  .py-16 {

    padding-block: calc(var(--spacing) * 16);

  }

  .py-20 {

    padding-block: calc(var(--spacing) * 20);

  }

  .py-22 {

    padding-block: calc(var(--spacing) * 22);

  }

  .py-24 {

    padding-block: calc(var(--spacing) * 24);

  }

  .py-25 {

    padding-block: calc(var(--spacing) * 25);

  }

  .py-30 {

    padding-block: calc(var(--spacing) * 30);

  }

  .py-34 {

    padding-block: calc(var(--spacing) * 34);

  }

  .py-35 {

    padding-block: calc(var(--spacing) * 35);

  }

  .py-36 {

    padding-block: calc(var(--spacing) * 36);

  }

  .py-38 {

    padding-block: calc(var(--spacing) * 38);

  }

  .py-40 {

    padding-block: calc(var(--spacing) * 40);

  }

  .py-50 {

    padding-block: calc(var(--spacing) * 50);

  }

  .py-60 {

    padding-block: calc(var(--spacing) * 60);

  }

  .py-80 {

    padding-block: calc(var(--spacing) * 80);

  }

  .ps-5 {

    padding-inline-start: calc(var(--spacing) * 5);

  }

  .ps-8 {

    padding-inline-start: calc(var(--spacing) * 8);

  }

  .ps-15 {

    padding-inline-start: calc(var(--spacing) * 15);

  }

  .ps-20 {

    padding-inline-start: calc(var(--spacing) * 20);

  }

  .ps-30 {

    padding-inline-start: calc(var(--spacing) * 30);

  }

  .ps-35 {

    padding-inline-start: calc(var(--spacing) * 35);

  }

  .ps-38 {

    padding-inline-start: calc(var(--spacing) * 38);

  }

  .ps-40 {

    padding-inline-start: calc(var(--spacing) * 40);

  }

  .pe-10 {

    padding-inline-end: calc(var(--spacing) * 10);

  }

  .pe-14 {

    padding-inline-end: calc(var(--spacing) * 14);

  }

  .pe-20 {

    padding-inline-end: calc(var(--spacing) * 20);

  }

  .pe-30 {

    padding-inline-end: calc(var(--spacing) * 30);

  }

  .pe-40 {

    padding-inline-end: calc(var(--spacing) * 40);

  }

  .pe-130 {

    padding-inline-end: calc(var(--spacing) * 130);

  }

  .pt-2 {

    padding-top: calc(var(--spacing) * 2);

  }

  .pt-10 {

    padding-top: calc(var(--spacing) * 10);

  }

  .pt-15 {

    padding-top: calc(var(--spacing) * 15);

  }

  .pt-20 {

    padding-top: calc(var(--spacing) * 20);

  }

  .pt-25 {

    padding-top: calc(var(--spacing) * 25);

  }

  .pt-30 {

    padding-top: calc(var(--spacing) * 30);

  }

  .pt-35 {

    padding-top: calc(var(--spacing) * 35);

  }

  .pt-40 {

    padding-top: calc(var(--spacing) * 40);

  }

  .pt-50 {

    padding-top: calc(var(--spacing) * 50);

  }

  .pt-53 {

    padding-top: calc(var(--spacing) * 53);

  }

  .pt-60 {

    padding-top: calc(var(--spacing) * 60);

  }

  .pt-80 {

    padding-top: calc(var(--spacing) * 80);

  }

  .pt-90 {

    padding-top: calc(var(--spacing) * 90);

  }

  .pt-100 {

    padding-top: calc(var(--spacing) * 100);

  }

  .pt-109 {

    padding-top: calc(var(--spacing) * 109);

  }

  .pt-110 {

    padding-top: calc(var(--spacing) * 110);

  }

  .pt-115 {

    padding-top: calc(var(--spacing) * 115);

  }

  .pt-120 {

    padding-top: calc(var(--spacing) * 120);

  }

  .pt-128 {

    padding-top: calc(var(--spacing) * 128);

  }

  .pt-130 {

    padding-top: calc(var(--spacing) * 130);

  }

  .pt-138 {

    padding-top: calc(var(--spacing) * 138);

  }

  .pt-140 {

    padding-top: calc(var(--spacing) * 140);

  }

  .pt-155 {

    padding-top: calc(var(--spacing) * 155);

  }

  .pt-156 {

    padding-top: calc(var(--spacing) * 156);

  }

  .pt-160 {

    padding-top: calc(var(--spacing) * 160);

  }

  .pt-170 {

    padding-top: calc(var(--spacing) * 170);

  }

  .pb-0 {

    padding-bottom: calc(var(--spacing) * 0);

  }

  .pb-15 {

    padding-bottom: calc(var(--spacing) * 15);

  }

  .pb-20 {

    padding-bottom: calc(var(--spacing) * 20);

  }

  .pb-30 {

    padding-bottom: calc(var(--spacing) * 30);

  }

  .pb-36 {

    padding-bottom: calc(var(--spacing) * 36);

  }

  .pb-40 {

    padding-bottom: calc(var(--spacing) * 40);

  }

  .pb-50 {

    padding-bottom: calc(var(--spacing) * 50);

  }

  .pb-55 {

    padding-bottom: calc(var(--spacing) * 55);

  }

  .pb-60 {

    padding-bottom: calc(var(--spacing) * 60);

  }

  .pb-64 {

    padding-bottom: calc(var(--spacing) * 64);

  }

  .pb-70 {

    padding-bottom: calc(var(--spacing) * 70);

  }

  .pb-80 {

    padding-bottom: calc(var(--spacing) * 80);

  }

  .pb-90 {

    padding-bottom: calc(var(--spacing) * 90);

  }

  .pb-110 {

    padding-bottom: calc(var(--spacing) * 110);

  }

  .pb-120 {

    padding-bottom: calc(var(--spacing) * 120);

  }

  .pb-130 {

    padding-bottom: calc(var(--spacing) * 130);

  }

  .pb-160 {

    padding-bottom: calc(var(--spacing) * 160);

  }

  .pb-181 {

    padding-bottom: calc(var(--spacing) * 181);

  }

  .pl-20 {

    padding-left: calc(var(--spacing) * 20);

  }

  .pl-100 {

    padding-left: calc(var(--spacing) * 100);

  }

  .text-center {

    text-align: center;

  }

  .text-left {

    text-align: left;

  }

  .text-right {

    text-align: right;

  }

  .text-start {

    text-align: start;

  }

  .align-middle {

    vertical-align: middle;

  }

  .font-display {

    font-family: var(--font-display);

  }

  .font-display-2 {

    font-family: var(--font-display-2);

  }

  .font-title {

    font-family: var(--font-title);

  }

  .text-2\.5xl\/22 {

    font-size: var(--text-2\.5xl);

    line-height: calc(var(--spacing) * 22);

  }

  .text-2\.5xl\/28 {

    font-size: var(--text-2\.5xl);

    line-height: calc(var(--spacing) * 28);

  }

  .text-2\.5xl\/35 {

    font-size: var(--text-2\.5xl);

    line-height: calc(var(--spacing) * 35);

  }

  .text-2\.5xl\/65 {

    font-size: var(--text-2\.5xl);

    line-height: calc(var(--spacing) * 65);

  }

  .text-2sm\/35 {

    font-size: var(--text-2sm);

    line-height: calc(var(--spacing) * 35);

  }

  .text-2xl {

    font-size: var(--text-2xl);

    line-height: var(--tw-leading, var(--text-2xl--line-height));

  }

  .text-2xl\/28 {

    font-size: var(--text-2xl);

    line-height: calc(var(--spacing) * 28);

  }

  .text-2xl\/35 {

    font-size: var(--text-2xl);

    line-height: calc(var(--spacing) * 35);

  }

  .text-3xl {

    font-size: var(--text-3xl);

    line-height: var(--tw-leading, var(--text-3xl--line-height));

  }

  .text-3xl\/35 {

    font-size: var(--text-3xl);

    line-height: calc(var(--spacing) * 35);

  }

  .text-3xl\/40 {

    font-size: var(--text-3xl);

    line-height: calc(var(--spacing) * 40);

  }

  .text-4\.3xl\/50 {

    font-size: var(--text-4\.3xl);

    line-height: calc(var(--spacing) * 50);

  }

  .text-4\.8xl\/45 {

    font-size: var(--text-4\.8xl);

    line-height: calc(var(--spacing) * 45);

  }

  .text-4\.75xl\/40 {

    font-size: var(--text-4\.75xl);

    line-height: calc(var(--spacing) * 40);

  }

  .text-4\.75xl\/50 {

    font-size: var(--text-4\.75xl);

    line-height: calc(var(--spacing) * 50);

  }

  .text-4xl {

    font-size: var(--text-4xl);

    line-height: var(--tw-leading, var(--text-4xl--line-height));

  }

  .text-4xl\/44 {

    font-size: var(--text-4xl);

    line-height: calc(var(--spacing) * 44);

  }

  .text-4xl\/50 {

    font-size: var(--text-4xl);

    line-height: calc(var(--spacing) * 50);

  }

  .text-5\.5xl\/46 {

    font-size: var(--text-5\.5xl);

    line-height: calc(var(--spacing) * 46);

  }

  .text-5xl {

    font-size: var(--text-5xl);

    line-height: var(--tw-leading, var(--text-5xl--line-height));

  }

  .text-5xl\/50 {

    font-size: var(--text-5xl);

    line-height: calc(var(--spacing) * 50);

  }

  .text-6xl\/69 {

    font-size: var(--text-6xl);

    line-height: calc(var(--spacing) * 69);

  }

  .text-6xl\/\[1\] {

    font-size: var(--text-6xl);

    line-height: 1;

  }

  .text-7xxl\/\[1\] {

    font-size: var(--text-7xxl);

    line-height: 1;

  }

  .text-8xl {

    font-size: var(--text-8xl);

    line-height: var(--tw-leading, var(--text-8xl--line-height));

  }

  .text-\[11px\]\/13 {

    font-size: 11px;

    line-height: calc(var(--spacing) * 13);

  }

  .text-\[17px\]\/24 {

    font-size: 17px;

    line-height: calc(var(--spacing) * 24);

  }

  .text-\[19px\]\/35 {

    font-size: 19px;

    line-height: calc(var(--spacing) * 35);

  }

  .text-\[23px\]\/34 {

    font-size: 23px;

    line-height: calc(var(--spacing) * 34);

  }

  .text-\[48px\]\/65 {

    font-size: 48px;

    line-height: calc(var(--spacing) * 65);

  }

  .text-\[85px\]\/28 {

    font-size: 85px;

    line-height: calc(var(--spacing) * 28);

  }

  .text-base {

    font-size: var(--text-base);

    line-height: var(--tw-leading, var(--text-base--line-height));

  }

  .text-base\/16 {

    font-size: var(--text-base);

    line-height: calc(var(--spacing) * 16);

  }

  .text-base\/35 {

    font-size: var(--text-base);

    line-height: calc(var(--spacing) * 35);

  }

  .text-base\/40 {

    font-size: var(--text-base);

    line-height: calc(var(--spacing) * 40);

  }

  .text-lg {

    font-size: var(--text-lg);

    line-height: var(--tw-leading, var(--text-lg--line-height));

  }

  .text-lg\/18 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 18);

  }

  .text-lg\/22 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 22);

  }

  .text-lg\/24 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 24);

  }

  .text-lg\/26 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 26);

  }

  .text-lg\/28 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 28);

  }

  .text-lg\/30 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 30);

  }

  .text-lg\/35 {

    font-size: var(--text-lg);

    line-height: calc(var(--spacing) * 35);

  }

  .text-sm {

    font-size: var(--text-sm);

    line-height: var(--tw-leading, var(--text-sm--line-height));

  }

  .text-sm\/24 {

    font-size: var(--text-sm);

    line-height: calc(var(--spacing) * 24);

  }

  .text-sm\/35 {

    font-size: var(--text-sm);

    line-height: calc(var(--spacing) * 35);

  }

  .text-sm\/40 {

    font-size: var(--text-sm);

    line-height: calc(var(--spacing) * 40);

  }

  .text-xl {

    font-size: var(--text-xl);

    line-height: var(--tw-leading, var(--text-xl--line-height));

  }

  .text-xl\/28 {

    font-size: var(--text-xl);

    line-height: calc(var(--spacing) * 28);

  }

  .text-xl\/30 {

    font-size: var(--text-xl);

    line-height: calc(var(--spacing) * 30);

  }

  .text-xl\/35 {

    font-size: var(--text-xl);

    line-height: calc(var(--spacing) * 35);

  }

  .text-xs {

    font-size: var(--text-xs);

    line-height: var(--tw-leading, var(--text-xs--line-height));

  }

  .text-xs\/\[1\] {

    font-size: var(--text-xs);

    line-height: 1;

  }

  .text-xxl\/35 {

    font-size: var(--text-xxl);

    line-height: calc(var(--spacing) * 35);

  }

  .text-2\.5xl {

    font-size: var(--text-2\.5xl);

  }

  .text-2sm {

    font-size: var(--text-2sm);

  }

  .text-2xs {

    font-size: var(--text-2xs);

  }

  .text-2xxl {

    font-size: var(--text-2xxl);

  }

  .text-4\.3xl {

    font-size: var(--text-4\.3xl);

  }

  .text-4\.5xl {

    font-size: var(--text-4\.5xl);

  }

  .text-4\.8xl {

    font-size: var(--text-4\.8xl);

  }

  .text-4\.75xl {

    font-size: var(--text-4\.75xl);

  }

  .text-7xxl {

    font-size: var(--text-7xxl);

  }

  .text-\[13px\] {

    font-size: 13px;

  }

  .text-\[60px\] {

    font-size: 60px;

  }

  .text-xxl {

    font-size: var(--text-xxl);

  }

  .\!leading-36 {

    --tw-leading: calc(var(--spacing) * 36) !important;

    line-height: calc(var(--spacing) * 36) !important;

  }

  .leading-21 {

    --tw-leading: calc(var(--spacing) * 21);

    line-height: calc(var(--spacing) * 21);

  }

  .leading-34 {

    --tw-leading: calc(var(--spacing) * 34);

    line-height: calc(var(--spacing) * 34);

  }

  .leading-38 {

    --tw-leading: calc(var(--spacing) * 38);

    line-height: calc(var(--spacing) * 38);

  }

  .leading-40 {

    --tw-leading: calc(var(--spacing) * 40);

    line-height: calc(var(--spacing) * 40);

  }

  .leading-60 {

    --tw-leading: calc(var(--spacing) * 60);

    line-height: calc(var(--spacing) * 60);

  }

  .leading-\[1\.4\] {

    --tw-leading: 1.4;

    line-height: 1.4;

  }

  .leading-\[27px\] {

    --tw-leading: 27px;

    line-height: 27px;

  }

  .leading-none {

    --tw-leading: 1;

    line-height: 1;

  }

  .leading-relaxed {

    --tw-leading: var(--leading-relaxed);

    line-height: var(--leading-relaxed);

  }

  .font-bold {

    --tw-font-weight: var(--font-weight-bold);

    font-weight: var(--font-weight-bold);

  }

  .font-extrabold {

    --tw-font-weight: var(--font-weight-extrabold);

    font-weight: var(--font-weight-extrabold);

  }

  .font-light {

    --tw-font-weight: var(--font-weight-light);

    font-weight: var(--font-weight-light);

  }

  .font-medium {

    --tw-font-weight: var(--font-weight-medium);

    font-weight: var(--font-weight-medium);

  }

  .font-normal {

    --tw-font-weight: var(--font-weight-normal);

    font-weight: var(--font-weight-normal);

  }

  .font-semibold {

    --tw-font-weight: var(--font-weight-semibold);

    font-weight: var(--font-weight-semibold);

  }

  .tracking-widest {

    --tw-tracking: var(--tracking-widest);

    letter-spacing: var(--tracking-widest);

  }

  .whitespace-normal {

    white-space: normal;

  }

  .whitespace-nowrap {

    white-space: nowrap;

  }

  .\!text-white {

    color: var(--color-white) !important;

  }

  .text-\[\#333\] {

    color: #333;

  }

  .text-\[\#CEC1B4\] {

    color: #CEC1B4;

  }

  .text-banner3text {

    color: var(--color-banner3text);

  }

  .text-banner3title {

    color: var(--color-banner3title);

  }

  .text-bggreen {

    color: var(--color-bggreen);

  }

  .text-black {

    color: var(--color-black);

  }

  .text-black\/5 {

    color: color-mix(in srgb, #000 5%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-black) 5%, transparent);

    }

  }

  .text-bodyfg {

    color: var(--color-bodyfg);

  }

  .text-bodytext {

    color: var(--color-bodytext);

  }

  .text-bodytext\/60 {

    color: var(--color-bodytext);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-bodytext) 60%, transparent);

    }

  }

  .text-bodytext\/70 {

    color: var(--color-bodytext);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-bodytext) 70%, transparent);

    }

  }

  .text-darkinfo {

    color: var(--color-darkinfo);

  }

  .text-gray-200 {

    color: var(--color-gray-200);

  }

  .text-gray-300 {

    color: var(--color-gray-300);

  }

  .text-gray-400 {

    color: var(--color-gray-400);

  }

  .text-gray-600 {

    color: var(--color-gray-600);

  }

  .text-green {

    color: var(--color-green);

  }

  .text-orange {

    color: var(--color-orange);

  }

  .text-primary {

    color: var(--color-primary);

  }

  .text-secondary {

    color: var(--color-secondary);

  }

  .text-secondary\/70 {

    color: var(--color-secondary);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-secondary) 70%, transparent);

    }

  }

  .text-textgreen {

    color: var(--color-textgreen);

  }

  .text-textlight {

    color: var(--color-textlight);

  }

  .text-titelgary {

    color: var(--color-titelgary);

  }

  .text-white {

    color: var(--color-white);

  }

  .text-white\/30 {

    color: color-mix(in srgb, #fff 30%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-white) 30%, transparent);

    }

  }

  .text-white\/50 {

    color: color-mix(in srgb, #fff 50%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-white) 50%, transparent);

    }

  }

  .text-white\/60 {

    color: color-mix(in srgb, #fff 60%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-white) 60%, transparent);

    }

  }

  .text-white\/70 {

    color: color-mix(in srgb, #fff 70%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-white) 70%, transparent);

    }

  }

  .text-white\/80 {

    color: color-mix(in srgb, #fff 80%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-white) 80%, transparent);

    }

  }

  .text-yellow {

    color: var(--color-yellow);

  }

  .capitalize {

    text-transform: capitalize;

  }

  .uppercase {

    text-transform: uppercase;

  }

  .italic {

    font-style: italic;

  }

  .not-italic {

    font-style: normal;

  }

  .underline {

    text-decoration-line: underline;

  }

  .opacity-0 {

    opacity: 0%;

  }

  .opacity-20 {

    opacity: 20%;

  }

  .opacity-60 {

    opacity: 60%;

  }

  .bg-blend-multiply {

    background-blend-mode: multiply;

  }

  .shadow {

    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-\[0px_0px_5px_rgba\(0\,0\,0\,0\.1\)\] {

    --tw-shadow: 0px 0px 5px var(--tw-shadow-color, rgba(0,0,0,0.1));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-\[0px_0px_30px_var\(--primary\)\] {

    --tw-shadow: 0px 0px 30px var(--tw-shadow-color, var(--primary));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-banner3Experiencebox {

    --tw-shadow: 0px 2px 5px var(--tw-shadow-color, rgba(0, 0, 0, 0.04));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-banner3icon {

    --tw-shadow: 0px 10px 20px var(--tw-shadow-color, rgba(28, 75, 66, 0.08));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-box-shadow {

    --tw-shadow: 0 2 4px var(--tw-shadow-color, rgba(0, 0, 0, .3));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-emailbox-shadow {

    --tw-shadow: 0px 10px 40px var(--tw-shadow-color, rgba(24, 29, 25, 0.08));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-googal-card {

    --tw-shadow: 0 0 60px var(--tw-shadow-color, rgba(0, 0, 0, .1));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-nobtn-shadow {

    --tw-shadow: 0px 5px 10px var(--tw-shadow-color, rgba(255, 120, 54, 0.15));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .shadow-shadow-card {

    --tw-shadow: 0 15px 30px var(--tw-shadow-color, rgba(24, 29, 25, .05));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .ring {

    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  }

  .blur {

    --tw-blur: blur(8px);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .blur-\[52px\] {

    --tw-blur: blur(52px);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-1 {

    --tw-brightness: brightness(1%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-2 {

    --tw-brightness: brightness(2%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-3 {

    --tw-brightness: brightness(3%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-4 {

    --tw-brightness: brightness(4%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-5 {

    --tw-brightness: brightness(5%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-6 {

    --tw-brightness: brightness(6%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .brightness-7 {

    --tw-brightness: brightness(7%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .invert {

    --tw-invert: invert(100%);

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .filter {

    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);

  }

  .transition {

    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;

    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));

    transition-duration: var(--tw-duration, var(--default-transition-duration));

  }

  .duration-300 {

    --tw-duration: 300ms;

    transition-duration: 300ms;

  }

  .duration-500 {

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  .duration-\[0\.2s\] {

    --tw-duration: 0.2s;

    transition-duration: 0.2s;

  }

  .duration-\[all_400ms_cubic-bezier\(0\.39\,_0\.58\,_0\.57\,_1\)_0s\] {

    --tw-duration: all 400ms cubic-bezier(0.39, 0.58, 0.57, 1) 0s;

    transition-duration: all 400ms cubic-bezier(0.39, 0.58, 0.57, 1) 0s;

  }

  .ease-in-out {

    --tw-ease: var(--ease-in-out);

    transition-timing-function: var(--ease-in-out);

  }

  .outline-none {

    --tw-outline-style: none;

    outline-style: none;

  }

  .select-all {

    -webkit-user-select: all;

    user-select: all;

  }

  .select-none {

    -webkit-user-select: none;

    user-select: none;

  }

  .\[animation-direction\:reverse\] {

    animation-direction: reverse;

  }

  .\[hostname\:port\] {

    hostname: port;

  }

  .\[writing-mode\:sideways-rl\] {

    writing-mode: sideways-rl;

  }

  .\[writing-mode\:vertical-rl\] {

    writing-mode: vertical-rl;

  }

  .backface-hidden {

    backface-visibility: hidden;

  }

  .group-hover\:visible {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        visibility: visible;

      }

    }

  }

  .group-hover\:top-0 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        top: calc(var(--spacing) * 0);

      }

    }

  }

  .group-hover\:top-1\/2 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        top: calc(1/2 * 100%);

      }

    }

  }

  .group-hover\:top-50 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        top: calc(var(--spacing) * 50);

      }

    }

  }

  .group-hover\:right-15 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        right: calc(var(--spacing) * 15);

      }

    }

  }

  .group-hover\:right-50 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        right: calc(var(--spacing) * 50);

      }

    }

  }

  .group-hover\:bottom-23 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        bottom: calc(var(--spacing) * 23);

      }

    }

  }

  .group-hover\:bottom-25 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        bottom: calc(var(--spacing) * 25);

      }

    }

  }

  .group-hover\:bottom-\[40\%\] {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        bottom: 40%;

      }

    }

  }

  .group-hover\:left-55 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        left: calc(var(--spacing) * 55);

      }

    }

  }

  .group-hover\:translate-x-0 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        --tw-translate-x: calc(var(--spacing) * 0);

        translate: var(--tw-translate-x) var(--tw-translate-y);

      }

    }

  }

  .group-hover\:translate-x-3 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        --tw-translate-x: calc(var(--spacing) * 3);

        translate: var(--tw-translate-x) var(--tw-translate-y);

      }

    }

  }

  .group-hover\:translate-y-0 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        --tw-translate-y: calc(var(--spacing) * 0);

        translate: var(--tw-translate-x) var(--tw-translate-y);

      }

    }

  }

  .group-hover\:scale-110 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        --tw-scale-x: 110%;

        --tw-scale-y: 110%;

        --tw-scale-z: 110%;

        scale: var(--tw-scale-x) var(--tw-scale-y);

      }

    }

  }

  .group-hover\:scale-\[1\.03\] {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        scale: 1.03;

      }

    }

  }

  .group-hover\:rotate-0 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        rotate: 0deg;

      }

    }

  }

  .group-hover\:animate-toTopFromBottom {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        animation: var(--animate-toTopFromBottom);

      }

    }

  }

  .group-hover\:bg-primary {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        background-color: var(--color-primary);

      }

    }

  }

  .group-hover\:bg-textgreen {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        background-color: var(--color-textgreen);

      }

    }

  }

  .group-hover\:bg-white {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        background-color: var(--color-white);

      }

    }

  }

  .group-hover\:text-bodytext {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        color: var(--color-bodytext);

      }

    }

  }

  .group-hover\:text-secondary {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        color: var(--color-secondary);

      }

    }

  }

  .group-hover\:text-white {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        color: var(--color-white);

      }

    }

  }

  .group-hover\:\!opacity-100 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        opacity: 100% !important;

      }

    }

  }

  .group-hover\:opacity-100 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        opacity: 100%;

      }

    }

  }

  .group-hover\/second\:animate-toTopFromBottom {

    &:is(:where(.group\/second):hover *) {

      @media (hover: hover) {

        animation: var(--animate-toTopFromBottom);

      }

    }

  }

  .selection\:bg-orange {

    & *::selection {

      background-color: var(--color-orange);

    }

    &::selection {

      background-color: var(--color-orange);

    }

  }

  .selection\:bg-primary {

    & *::selection {

      background-color: var(--color-primary);

    }

    &::selection {

      background-color: var(--color-primary);

    }

  }

  .selection\:bg-textgreen {

    & *::selection {

      background-color: var(--color-textgreen);

    }

    &::selection {

      background-color: var(--color-textgreen);

    }

  }

  .selection\:text-white {

    & *::selection {

      color: var(--color-white);

    }

    &::selection {

      color: var(--color-white);

    }

  }

  .placeholder\:text-banner3inputcolor {

    &::placeholder {

      color: var(--color-banner3inputcolor);

    }

  }

  .placeholder\:text-bodytext {

    &::placeholder {

      color: var(--color-bodytext);

    }

  }

  .before\:pointer-events-none {

    &::before {

      content: var(--tw-content);

      pointer-events: none;

    }

  }

  .before\:absolute {

    &::before {

      content: var(--tw-content);

      position: absolute;

    }

  }

  .before\:inset-0 {

    &::before {

      content: var(--tw-content);

      inset: calc(var(--spacing) * 0);

    }

  }

  .before\:top-0 {

    &::before {

      content: var(--tw-content);

      top: calc(var(--spacing) * 0);

    }

  }

  .before\:top-1\/2 {

    &::before {

      content: var(--tw-content);

      top: calc(1/2 * 100%);

    }

  }

  .before\:top-20 {

    &::before {

      content: var(--tw-content);

      top: calc(var(--spacing) * 20);

    }

  }

  .before\:top-37 {

    &::before {

      content: var(--tw-content);

      top: calc(var(--spacing) * 37);

    }

  }

  .before\:-bottom-26 {

    &::before {

      content: var(--tw-content);

      bottom: calc(var(--spacing) * -26);

    }

  }

  .before\:-bottom-35 {

    &::before {

      content: var(--tw-content);

      bottom: calc(var(--spacing) * -35);

    }

  }

  .before\:-left-10 {

    &::before {

      content: var(--tw-content);

      left: calc(var(--spacing) * -10);

    }

  }

  .before\:-left-133 {

    &::before {

      content: var(--tw-content);

      left: calc(var(--spacing) * -133);

    }

  }

  .before\:left-0 {

    &::before {

      content: var(--tw-content);

      left: calc(var(--spacing) * 0);

    }

  }

  .before\:left-1\/2 {

    &::before {

      content: var(--tw-content);

      left: calc(1/2 * 100%);

    }

  }

  .before\:left-14 {

    &::before {

      content: var(--tw-content);

      left: calc(var(--spacing) * 14);

    }

  }

  .before\:left-\[30\%\] {

    &::before {

      content: var(--tw-content);

      left: 30%;

    }

  }

  .before\:-z-1 {

    &::before {

      content: var(--tw-content);

      z-index: calc(var(--z-index-1) * -1);

    }

  }

  .before\:-z-2 {

    &::before {

      content: var(--tw-content);

      z-index: calc(var(--z-index-2) * -1);

    }

  }

  .before\:z-0 {

    &::before {

      content: var(--tw-content);

      z-index: 0;

    }

  }

  .before\:z-1 {

    &::before {

      content: var(--tw-content);

      z-index: var(--z-index-1);

    }

  }

  .before\:z-2 {

    &::before {

      content: var(--tw-content);

      z-index: var(--z-index-2);

    }

  }

  .before\:-mt-1 {

    &::before {

      content: var(--tw-content);

      margin-top: calc(var(--spacing) * -1);

    }

  }

  .before\:block {

    &::before {

      content: var(--tw-content);

      display: block;

    }

  }

  .before\:hidden {

    &::before {

      content: var(--tw-content);

      display: none;

    }

  }

  .before\:size-6 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 6);

      height: calc(var(--spacing) * 6);

    }

  }

  .before\:size-20 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 20);

      height: calc(var(--spacing) * 20);

    }

  }

  .before\:size-24 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 24);

      height: calc(var(--spacing) * 24);

    }

  }

  .before\:size-60 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 60);

      height: calc(var(--spacing) * 60);

    }

  }

  .before\:size-946 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 946);

      height: calc(var(--spacing) * 946);

    }

  }

  .before\:size-full {

    &::before {

      content: var(--tw-content);

      width: 100%;

      height: 100%;

    }

  }

  .before\:h-1 {

    &::before {

      content: var(--tw-content);

      height: calc(var(--spacing) * 1);

    }

  }

  .before\:h-3 {

    &::before {

      content: var(--tw-content);

      height: calc(var(--spacing) * 3);

    }

  }

  .before\:h-full {

    &::before {

      content: var(--tw-content);

      height: 100%;

    }

  }

  .before\:w-10 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 10);

    }

  }

  .before\:w-20 {

    &::before {

      content: var(--tw-content);

      width: calc(var(--spacing) * 20);

    }

  }

  .before\:w-\[44\%\] {

    &::before {

      content: var(--tw-content);

      width: 44%;

    }

  }

  .before\:w-full {

    &::before {

      content: var(--tw-content);

      width: 100%;

    }

  }

  .before\:-translate-x-1\/2 {

    &::before {

      content: var(--tw-content);

      --tw-translate-x: calc(calc(1/2 * 100%) * -1);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .before\:-translate-x-\[calc\(100\%-40px\)\] {

    &::before {

      content: var(--tw-content);

      --tw-translate-x: calc(calc(100% - 40px) * -1);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .before\:-translate-y-1\/2 {

    &::before {

      content: var(--tw-content);

      --tw-translate-y: calc(calc(1/2 * 100%) * -1);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .before\:scale-\[0\.30\] {

    &::before {

      content: var(--tw-content);

      scale: 0.30;

    }

  }

  .before\:rotate-45 {

    &::before {

      content: var(--tw-content);

      rotate: 45deg;

    }

  }

  .before\:rotate-\[-50deg\] {

    &::before {

      content: var(--tw-content);

      rotate: -50deg;

    }

  }

  .before\:rotate-\[39deg\] {

    &::before {

      content: var(--tw-content);

      rotate: 39deg;

    }

  }

  .before\:rounded-full {

    &::before {

      content: var(--tw-content);

      border-radius: calc(infinity * 1px);

    }

  }

  .before\:border-2 {

    &::before {

      content: var(--tw-content);

      border-style: var(--tw-border-style);

      border-width: 2px;

    }

  }

  .before\:border-t {

    &::before {

      content: var(--tw-content);

      border-top-style: var(--tw-border-style);

      border-top-width: 1px;

    }

  }

  .before\:border-l {

    &::before {

      content: var(--tw-content);

      border-left-style: var(--tw-border-style);

      border-left-width: 1px;

    }

  }

  .before\:border-dashed {

    &::before {

      content: var(--tw-content);

      --tw-border-style: dashed;

      border-style: dashed;

    }

  }

  .before\:border-\[\#E4E4E4\] {

    &::before {

      content: var(--tw-content);

      border-color: #E4E4E4;

    }

  }

  .before\:border-bodytext\/30 {

    &::before {

      content: var(--tw-content);

      border-color: var(--color-bodytext);

      @supports (color: color-mix(in lab, red, red)) {

        border-color: color-mix(in oklab, var(--color-bodytext) 30%, transparent);

      }

    }

  }

  .before\:bg-black {

    &::before {

      content: var(--tw-content);

      background-color: var(--color-black);

    }

  }

  .before\:bg-black\/10 {

    &::before {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #000 10%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-black) 10%, transparent);

      }

    }

  }

  .before\:bg-black\/50 {

    &::before {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #000 50%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-black) 50%, transparent);

      }

    }

  }

  .before\:bg-bodytext {

    &::before {

      content: var(--tw-content);

      background-color: var(--color-bodytext);

    }

  }

  .before\:bg-lightgarybg {

    &::before {

      content: var(--tw-content);

      background-color: var(--color-lightgarybg);

    }

  }

  .before\:bg-primary {

    &::before {

      content: var(--tw-content);

      background-color: var(--color-primary);

    }

  }

  .before\:bg-textlight {

    &::before {

      content: var(--tw-content);

      background-color: var(--color-textlight);

    }

  }

  .before\:bg-white {

    &::before {

      content: var(--tw-content);

      background-color: var(--color-white);

    }

  }

  .before\:bg-white\/70 {

    &::before {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #fff 70%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-white) 70%, transparent);

      }

    }

  }

  .before\:text-center {

    &::before {

      content: var(--tw-content);

      text-align: center;

    }

  }

  .before\:font-\[\'Font_Awesome_6_Free\'\] {

    &::before {

      content: var(--tw-content);

      font-family: 'Font Awesome 6 Free';

    }

  }

  .before\:text-sm {

    &::before {

      content: var(--tw-content);

      font-size: var(--text-sm);

      line-height: var(--tw-leading, var(--text-sm--line-height));

    }

  }

  .before\:text-xs {

    &::before {

      content: var(--tw-content);

      font-size: var(--text-xs);

      line-height: var(--tw-leading, var(--text-xs--line-height));

    }

  }

  .before\:leading-20 {

    &::before {

      content: var(--tw-content);

      --tw-leading: calc(var(--spacing) * 20);

      line-height: calc(var(--spacing) * 20);

    }

  }

  .before\:leading-24 {

    &::before {

      content: var(--tw-content);

      --tw-leading: calc(var(--spacing) * 24);

      line-height: calc(var(--spacing) * 24);

    }

  }

  .before\:font-black {

    &::before {

      content: var(--tw-content);

      --tw-font-weight: var(--font-weight-black);

      font-weight: var(--font-weight-black);

    }

  }

  .before\:text-black {

    &::before {

      content: var(--tw-content);

      color: var(--color-black);

    }

  }

  .before\:text-secondary {

    &::before {

      content: var(--tw-content);

      color: var(--color-secondary);

    }

  }

  .before\:opacity-100 {

    &::before {

      content: var(--tw-content);

      opacity: 100%;

    }

  }

  .before\:backdrop-blur-\[120px\] {

    &::before {

      content: var(--tw-content);

      --tw-backdrop-blur: blur(120px);

      -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);

      backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);

    }

  }

  .before\:duration-200 {

    &::before {

      content: var(--tw-content);

      --tw-duration: 200ms;

      transition-duration: 200ms;

    }

  }

  .before\:content-\[\'\'\] {

    &::before {

      content: var(--tw-content);

      --tw-content: '';

      content: var(--tw-content);

    }

  }

  .before\:content-\[\'\/\'\] {

    &::before {

      content: var(--tw-content);

      --tw-content: '/';

      content: var(--tw-content);

    }

  }

  .before\:content-\[\'\\f00c\'\] {

    &::before {

      content: var(--tw-content);

      --tw-content: '\f00c';

      content: var(--tw-content);

    }

  }

  .group-hover\:before\:rotate-0 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        &::before {

          content: var(--tw-content);

          rotate: 0deg;

        }

      }

    }

  }

  .after\:pointer-events-none {

    &::after {

      content: var(--tw-content);

      pointer-events: none;

    }

  }

  .after\:invisible {

    &::after {

      content: var(--tw-content);

      visibility: hidden;

    }

  }

  .after\:absolute {

    &::after {

      content: var(--tw-content);

      position: absolute;

    }

  }

  .after\:inset-0 {

    &::after {

      content: var(--tw-content);

      inset: calc(var(--spacing) * 0);

    }

  }

  .after\:top-0 {

    &::after {

      content: var(--tw-content);

      top: calc(var(--spacing) * 0);

    }

  }

  .after\:top-1\/2 {

    &::after {

      content: var(--tw-content);

      top: calc(1/2 * 100%);

    }

  }

  .after\:top-87 {

    &::after {

      content: var(--tw-content);

      top: calc(var(--spacing) * 87);

    }

  }

  .after\:right-0 {

    &::after {

      content: var(--tw-content);

      right: calc(var(--spacing) * 0);

    }

  }

  .after\:bottom-0 {

    &::after {

      content: var(--tw-content);

      bottom: calc(var(--spacing) * 0);

    }

  }

  .after\:bottom-1\/2 {

    &::after {

      content: var(--tw-content);

      bottom: calc(1/2 * 100%);

    }

  }

  .after\:left-0 {

    &::after {

      content: var(--tw-content);

      left: calc(var(--spacing) * 0);

    }

  }

  .after\:left-1 {

    &::after {

      content: var(--tw-content);

      left: calc(var(--spacing) * 1);

    }

  }

  .after\:left-1\/2 {

    &::after {

      content: var(--tw-content);

      left: calc(1/2 * 100%);

    }

  }

  .after\:left-\[1\%\] {

    &::after {

      content: var(--tw-content);

      left: 1%;

    }

  }

  .after\:left-\[16\%\] {

    &::after {

      content: var(--tw-content);

      left: 16%;

    }

  }

  .after\:-z-1 {

    &::after {

      content: var(--tw-content);

      z-index: calc(var(--z-index-1) * -1);

    }

  }

  .after\:-z-2 {

    &::after {

      content: var(--tw-content);

      z-index: calc(var(--z-index-2) * -1);

    }

  }

  .after\:z-0 {

    &::after {

      content: var(--tw-content);

      z-index: 0;

    }

  }

  .after\:z-1 {

    &::after {

      content: var(--tw-content);

      z-index: var(--z-index-1);

    }

  }

  .after\:-mt-1 {

    &::after {

      content: var(--tw-content);

      margin-top: calc(var(--spacing) * -1);

    }

  }

  .after\:block {

    &::after {

      content: var(--tw-content);

      display: block;

    }

  }

  .after\:hidden {

    &::after {

      content: var(--tw-content);

      display: none;

    }

  }

  .after\:size-1015 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 1015);

      height: calc(var(--spacing) * 1015);

    }

  }

  .after\:size-full {

    &::after {

      content: var(--tw-content);

      width: 100%;

      height: 100%;

    }

  }

  .after\:h-0 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 0);

    }

  }

  .after\:h-1 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 1);

    }

  }

  .after\:h-2 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 2);

    }

  }

  .after\:h-3 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 3);

    }

  }

  .after\:h-4 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 4);

    }

  }

  .after\:h-450 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 450);

    }

  }

  .after\:h-796 {

    &::after {

      content: var(--tw-content);

      height: calc(var(--spacing) * 796);

    }

  }

  .after\:h-\[68\%\] {

    &::after {

      content: var(--tw-content);

      height: 68%;

    }

  }

  .after\:h-\[74\%\] {

    &::after {

      content: var(--tw-content);

      height: 74%;

    }

  }

  .after\:h-full {

    &::after {

      content: var(--tw-content);

      height: 100%;

    }

  }

  .after\:max-h-360 {

    &::after {

      content: var(--tw-content);

      max-height: calc(var(--spacing) * 360);

    }

  }

  .after\:w-0 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 0);

    }

  }

  .after\:w-1 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 1);

    }

  }

  .after\:w-20 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 20);

    }

  }

  .after\:w-24 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 24);

    }

  }

  .after\:w-295 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 295);

    }

  }

  .after\:w-630 {

    &::after {

      content: var(--tw-content);

      width: calc(var(--spacing) * 630);

    }

  }

  .after\:w-\[51\%\] {

    &::after {

      content: var(--tw-content);

      width: 51%;

    }

  }

  .after\:w-\[70\%\] {

    &::after {

      content: var(--tw-content);

      width: 70%;

    }

  }

  .after\:w-\[80\%\] {

    &::after {

      content: var(--tw-content);

      width: 80%;

    }

  }

  .after\:w-full {

    &::after {

      content: var(--tw-content);

      width: 100%;

    }

  }

  .after\:-translate-x-1\/2 {

    &::after {

      content: var(--tw-content);

      --tw-translate-x: calc(calc(1/2 * 100%) * -1);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .after\:-translate-y-1\/2 {

    &::after {

      content: var(--tw-content);

      --tw-translate-y: calc(calc(1/2 * 100%) * -1);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .after\:-rotate-45 {

    &::after {

      content: var(--tw-content);

      rotate: calc(45deg * -1);

    }

  }

  .after\:rotate-15 {

    &::after {

      content: var(--tw-content);

      rotate: 15deg;

    }

  }

  .after\:rounded-full {

    &::after {

      content: var(--tw-content);

      border-radius: calc(infinity * 1px);

    }

  }

  .after\:rounded-lg {

    &::after {

      content: var(--tw-content);

      border-radius: var(--radius-lg);

    }

  }

  .after\:rounded-t-full {

    &::after {

      content: var(--tw-content);

      border-top-left-radius: calc(infinity * 1px);

      border-top-right-radius: calc(infinity * 1px);

    }

  }

  .after\:rounded-tl-4xl {

    &::after {

      content: var(--tw-content);

      border-top-left-radius: var(--radius-4xl);

    }

  }

  .after\:rounded-tl-full {

    &::after {

      content: var(--tw-content);

      border-top-left-radius: calc(infinity * 1px);

    }

  }

  .after\:rounded-tr-4xl {

    &::after {

      content: var(--tw-content);

      border-top-right-radius: var(--radius-4xl);

    }

  }

  .after\:rounded-tr-full {

    &::after {

      content: var(--tw-content);

      border-top-right-radius: calc(infinity * 1px);

    }

  }

  .after\:border {

    &::after {

      content: var(--tw-content);

      border-style: var(--tw-border-style);

      border-width: 1px;

    }

  }

  .after\:border-black\/5 {

    &::after {

      content: var(--tw-content);

      border-color: color-mix(in srgb, #000 5%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        border-color: color-mix(in oklab, var(--color-black) 5%, transparent);

      }

    }

  }

  .after\:\!bg-secondary {

    &::after {

      content: var(--tw-content);

      background-color: var(--color-secondary) !important;

    }

  }

  .after\:bg-\[\#00102599\] {

    &::after {

      content: var(--tw-content);

      background-color: #00102599;

    }

  }

  .after\:bg-black {

    &::after {

      content: var(--tw-content);

      background-color: var(--color-black);

    }

  }

  .after\:bg-black\/10 {

    &::after {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #000 10%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-black) 10%, transparent);

      }

    }

  }

  .after\:bg-black\/50 {

    &::after {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #000 50%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-black) 50%, transparent);

      }

    }

  }

  .after\:bg-lightgarybg {

    &::after {

      content: var(--tw-content);

      background-color: var(--color-lightgarybg);

    }

  }

  .after\:bg-lightgreen {

    &::after {

      content: var(--tw-content);

      background-color: var(--color-lightgreen);

    }

  }

  .after\:bg-primary {

    &::after {

      content: var(--tw-content);

      background-color: var(--color-primary);

    }

  }

  .after\:bg-white {

    &::after {

      content: var(--tw-content);

      background-color: var(--color-white);

    }

  }

  .after\:bg-white\/5 {

    &::after {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #fff 5%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-white) 5%, transparent);

      }

    }

  }

  .after\:bg-white\/10 {

    &::after {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #fff 10%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-white) 10%, transparent);

      }

    }

  }

  .after\:bg-white\/50 {

    &::after {

      content: var(--tw-content);

      background-color: color-mix(in srgb, #fff 50%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        background-color: color-mix(in oklab, var(--color-white) 50%, transparent);

      }

    }

  }

  .after\:bg-linear-\(--divider-gradient\) {

    &::after {

      content: var(--tw-content);

      --tw-gradient-position: var(--divider-gradient);

      background-image: linear-gradient(var(--tw-gradient-stops,var(--divider-gradient)));

    }

  }

  .after\:bg-\[url\(\'\.\.\/images\/background\/bg3\.png\'\)\] {

    &::after {

      content: var(--tw-content);

      background-image: url('../images/background/bg3.png');

    }

  }

  .after\:bg-\[url\(\'\.\.\/images\/background\/bg5\.png\'\)\] {

    &::after {

      content: var(--tw-content);

      background-image: url('../images/background/bg5.png');

    }

  }

  .after\:bg-\[url\(\'\.\.\/images\/banner\/pic3\.png\'\)\] {

    &::after {

      content: var(--tw-content);

      background-image: url('../images/banner/pic3.png');

    }

  }

  .after\:bg-\[url\(\.\.\/images\/banner2\/background\/bg1\.png\)\] {

    &::after {

      content: var(--tw-content);

      background-image: url(../images/banner2/background/bg1.png);

    }

  }

  .after\:\[mask-image\:url\(\'\.\.\/images\/banner-mask\.png\'\)\] {

    &::after {

      content: var(--tw-content);

      mask-image: url('../images/banner-mask.png');

    }

  }

  .after\:bg-cover {

    &::after {

      content: var(--tw-content);

      background-size: cover;

    }

  }

  .after\:bg-center {

    &::after {

      content: var(--tw-content);

      background-position: center;

    }

  }

  .after\:bg-left-bottom {

    &::after {

      content: var(--tw-content);

      background-position: left bottom;

    }

  }

  .after\:bg-no-repeat {

    &::after {

      content: var(--tw-content);

      background-repeat: no-repeat;

    }

  }

  .after\:opacity-0 {

    &::after {

      content: var(--tw-content);

      opacity: 0%;

    }

  }

  .after\:opacity-30 {

    &::after {

      content: var(--tw-content);

      opacity: 30%;

    }

  }

  .after\:opacity-100 {

    &::after {

      content: var(--tw-content);

      opacity: 100%;

    }

  }

  .after\:mix-blend-multiply {

    &::after {

      content: var(--tw-content);

      mix-blend-mode: multiply;

    }

  }

  .after\:shadow-banner3imgbox {

    &::after {

      content: var(--tw-content);

      --tw-shadow: 0px -15px 30px var(--tw-shadow-color, rgba(166, 78, 28, 0.1));

      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

    }

  }

  .after\:backdrop-blur-2xl {

    &::after {

      content: var(--tw-content);

      --tw-backdrop-blur: blur(var(--blur-2xl));

      -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);

      backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);

    }

  }

  .after\:backdrop-blur-\[20px\] {

    &::after {

      content: var(--tw-content);

      --tw-backdrop-blur: blur(20px);

      -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);

      backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);

    }

  }

  .after\:duration-200 {

    &::after {

      content: var(--tw-content);

      --tw-duration: 200ms;

      transition-duration: 200ms;

    }

  }

  .after\:duration-500 {

    &::after {

      content: var(--tw-content);

      --tw-duration: 500ms;

      transition-duration: 500ms;

    }

  }

  .after\:duration-\[\.5s\] {

    &::after {

      content: var(--tw-content);

      --tw-duration: .5s;

      transition-duration: .5s;

    }

  }

  .after\:content-\[\'\'\] {

    &::after {

      content: var(--tw-content);

      --tw-content: '';

      content: var(--tw-content);

    }

  }

  .group-hover\:after\:rotate-0 {

    &:is(:where(.group):hover *) {

      @media (hover: hover) {

        &::after {

          content: var(--tw-content);

          rotate: 0deg;

        }

      }

    }

  }

  .first\:px-0 {

    &:first-child {

      padding-inline: calc(var(--spacing) * 0);

    }

  }

  .first\:ps-0 {

    &:first-child {

      padding-inline-start: calc(var(--spacing) * 0);

    }

  }

  .first\:before\:hidden {

    &:first-child {

      &::before {

        content: var(--tw-content);

        display: none;

      }

    }

  }

  .last\:me-0 {

    &:last-child {

      margin-inline-end: calc(var(--spacing) * 0);

    }

  }

  .last\:px-0 {

    &:last-child {

      padding-inline: calc(var(--spacing) * 0);

    }

  }

  .last\:pe-0 {

    &:last-child {

      padding-inline-end: calc(var(--spacing) * 0);

    }

  }

  .hover\:z-1 {

    &:hover {

      @media (hover: hover) {

        z-index: var(--z-index-1);

      }

    }

  }

  .hover\:\!border-social {

    &:hover {

      @media (hover: hover) {

        border-color: var(--color-social) !important;

      }

    }

  }

  .hover\:\!bg-social {

    &:hover {

      @media (hover: hover) {

        background-color: var(--color-social) !important;

      }

    }

  }

  .hover\:bg-bggreen {

    &:hover {

      @media (hover: hover) {

        background-color: var(--color-bggreen);

      }

    }

  }

  .hover\:bg-primary {

    &:hover {

      @media (hover: hover) {

        background-color: var(--color-primary);

      }

    }

  }

  .hover\:bg-secondary {

    &:hover {

      @media (hover: hover) {

        background-color: var(--color-secondary);

      }

    }

  }

  .hover\:bg-textgreen {

    &:hover {

      @media (hover: hover) {

        background-color: var(--color-textgreen);

      }

    }

  }

  .hover\:bg-white {

    &:hover {

      @media (hover: hover) {

        background-color: var(--color-white);

      }

    }

  }

  .hover\:\!text-white {

    &:hover {

      @media (hover: hover) {

        color: var(--color-white) !important;

      }

    }

  }

  .hover\:text-blue-600 {

    &:hover {

      @media (hover: hover) {

        color: var(--color-blue-600);

      }

    }

  }

  .hover\:text-lightgreen {

    &:hover {

      @media (hover: hover) {

        color: var(--color-lightgreen);

      }

    }

  }

  .hover\:text-orange {

    &:hover {

      @media (hover: hover) {

        color: var(--color-orange);

      }

    }

  }

  .hover\:text-primary {

    &:hover {

      @media (hover: hover) {

        color: var(--color-primary);

      }

    }

  }

  .hover\:text-red-500 {

    &:hover {

      @media (hover: hover) {

        color: var(--color-red-500);

      }

    }

  }

  .hover\:text-secondary {

    &:hover {

      @media (hover: hover) {

        color: var(--color-secondary);

      }

    }

  }

  .hover\:text-white {

    &:hover {

      @media (hover: hover) {

        color: var(--color-white);

      }

    }

  }

  .hover\:underline {

    &:hover {

      @media (hover: hover) {

        text-decoration-line: underline;

      }

    }

  }

  .hover\:opacity-100 {

    &:hover {

      @media (hover: hover) {

        opacity: 100%;

      }

    }

  }

  .hover\:after\:visible {

    &:hover {

      @media (hover: hover) {

        &::after {

          content: var(--tw-content);

          visibility: visible;

        }

      }

    }

  }

  .hover\:after\:h-full {

    &:hover {

      @media (hover: hover) {

        &::after {

          content: var(--tw-content);

          height: 100%;

        }

      }

    }

  }

  .hover\:after\:opacity-40 {

    &:hover {

      @media (hover: hover) {

        &::after {

          content: var(--tw-content);

          opacity: 40%;

        }

      }

    }

  }

  .hover\:after\:opacity-50 {

    &:hover {

      @media (hover: hover) {

        &::after {

          content: var(--tw-content);

          opacity: 50%;

        }

      }

    }

  }

  .hover\:after\:opacity-100 {

    &:hover {

      @media (hover: hover) {

        &::after {

          content: var(--tw-content);

          opacity: 100%;

        }

      }

    }

  }

  .focus\:border-secondary {

    &:focus {

      border-color: var(--color-secondary);

    }

  }

  .max-4xl\:right-5 {

    @media (width < 1700px) {

      right: calc(var(--spacing) * 5);

    }

  }

  .max-xxl\:hidden {

    @media (width < 1400px) {

      display: none;

    }

  }

  .max-xxl\:w-\[8\%\] {

    @media (width < 1400px) {

      width: 8%;

    }

  }

  .max-xxl\:w-\[15\%\] {

    @media (width < 1400px) {

      width: 15%;

    }

  }

  .max-xxl\:w-\[30\%\] {

    @media (width < 1400px) {

      width: 30%;

    }

  }

  .max-xxl\:overflow-hidden {

    @media (width < 1400px) {

      overflow: hidden;

    }

  }

  .max-xl\:-top-60 {

    @media (width < 1200px) {

      top: calc(var(--spacing) * -60);

    }

  }

  .max-xl\:-bottom-200 {

    @media (width < 1200px) {

      bottom: calc(var(--spacing) * -200);

    }

  }

  .max-xl\:mx-auto {

    @media (width < 1200px) {

      margin-inline: auto;

    }

  }

  .max-xl\:my-30 {

    @media (width < 1200px) {

      margin-block: calc(var(--spacing) * 30);

    }

  }

  .max-xl\:mt-40 {

    @media (width < 1200px) {

      margin-top: calc(var(--spacing) * 40);

    }

  }

  .max-xl\:hidden {

    @media (width < 1200px) {

      display: none;

    }

  }

  .max-xl\:size-150 {

    @media (width < 1200px) {

      width: calc(var(--spacing) * 150);

      height: calc(var(--spacing) * 150);

    }

  }

  .max-xl\:overflow-y-scroll {

    @media (width < 1200px) {

      overflow-y: scroll;

    }

  }

  .max-xl\:pt-40 {

    @media (width < 1200px) {

      padding-top: calc(var(--spacing) * 40);

    }

  }

  .max-xl\:after\:-translate-x-1\/2 {

    @media (width < 1200px) {

      &::after {

        content: var(--tw-content);

        --tw-translate-x: calc(calc(1/2 * 100%) * -1);

        translate: var(--tw-translate-x) var(--tw-translate-y);

      }

    }

  }

  .max-lg\:top-0 {

    @media (width < 992px) {

      top: calc(var(--spacing) * 0);

    }

  }

  .max-lg\:top-20 {

    @media (width < 992px) {

      top: calc(var(--spacing) * 20);

    }

  }

  .max-lg\:top-55 {

    @media (width < 992px) {

      top: calc(var(--spacing) * 55);

    }

  }

  .max-lg\:right-0 {

    @media (width < 992px) {

      right: calc(var(--spacing) * 0);

    }

  }

  .max-lg\:-bottom-65 {

    @media (width < 992px) {

      bottom: calc(var(--spacing) * -65);

    }

  }

  .max-lg\:order-1 {

    @media (width < 992px) {

      order: 1;

    }

  }

  .max-lg\:float-end {

    @media (width < 992px) {

      float: inline-end;

    }

  }

  .max-lg\:mx-20 {

    @media (width < 992px) {

      margin-inline: calc(var(--spacing) * 20);

    }

  }

  .max-lg\:-mt-30 {

    @media (width < 992px) {

      margin-top: calc(var(--spacing) * -30);

    }

  }

  .max-lg\:-mt-170 {

    @media (width < 992px) {

      margin-top: calc(var(--spacing) * -170);

    }

  }

  .max-lg\:mt-0 {

    @media (width < 992px) {

      margin-top: calc(var(--spacing) * 0);

    }

  }

  .max-lg\:mt-10 {

    @media (width < 992px) {

      margin-top: calc(var(--spacing) * 10);

    }

  }

  .max-lg\:mt-20 {

    @media (width < 992px) {

      margin-top: calc(var(--spacing) * 20);

    }

  }

  .max-lg\:mt-45 {

    @media (width < 992px) {

      margin-top: calc(var(--spacing) * 45);

    }

  }

  .max-lg\:mb-10 {

    @media (width < 992px) {

      margin-bottom: calc(var(--spacing) * 10);

    }

  }

  .max-lg\:mb-15 {

    @media (width < 992px) {

      margin-bottom: calc(var(--spacing) * 15);

    }

  }

  .max-lg\:hidden {

    @media (width < 992px) {

      display: none;

    }

  }

  .max-lg\:\!transform-none {

    @media (width < 992px) {

      transform: none !important;

    }

  }

  .max-lg\:justify-between {

    @media (width < 992px) {

      justify-content: space-between;

    }

  }

  .max-lg\:justify-center {

    @media (width < 992px) {

      justify-content: center;

    }

  }

  .max-lg\:border-social {

    @media (width < 992px) {

      border-color: var(--color-social);

    }

  }

  .max-lg\:pt-50 {

    @media (width < 992px) {

      padding-top: calc(var(--spacing) * 50);

    }

  }

  .max-lg\:text-social {

    @media (width < 992px) {

      color: var(--color-social);

    }

  }

  .max-lg\:opacity-0 {

    @media (width < 992px) {

      opacity: 0%;

    }

  }

  .max-lg\:group-hover\:\!border-social {

    @media (width < 992px) {

      &:is(:where(.group):hover *) {

        @media (hover: hover) {

          border-color: var(--color-social) !important;

        }

      }

    }

  }

  .max-lg\:group-hover\:\!bg-social {

    @media (width < 992px) {

      &:is(:where(.group):hover *) {

        @media (hover: hover) {

          background-color: var(--color-social) !important;

        }

      }

    }

  }

  .max-lg\:group-hover\:\!text-white {

    @media (width < 992px) {

      &:is(:where(.group):hover *) {

        @media (hover: hover) {

          color: var(--color-white) !important;

        }

      }

    }

  }

  .max-lg\:after\:hidden {

    @media (width < 992px) {

      &::after {

        content: var(--tw-content);

        display: none;

      }

    }

  }

  .max-lg\:after\:rounded-tl-full {

    @media (width < 992px) {

      &::after {

        content: var(--tw-content);

        border-top-left-radius: calc(infinity * 1px);

      }

    }

  }

  .max-lg\:after\:rounded-tr-full {

    @media (width < 992px) {

      &::after {

        content: var(--tw-content);

        border-top-right-radius: calc(infinity * 1px);

      }

    }

  }

  .max-md\:top-90 {

    @media (width < 768px) {

      top: calc(var(--spacing) * 90);

    }

  }

  .max-md\:top-180 {

    @media (width < 768px) {

      top: calc(var(--spacing) * 180);

    }

  }

  .max-md\:-left-5 {

    @media (width < 768px) {

      left: calc(var(--spacing) * -5);

    }

  }

  .max-md\:-mt-50 {

    @media (width < 768px) {

      margin-top: calc(var(--spacing) * -50);

    }

  }

  .max-md\:-mt-270 {

    @media (width < 768px) {

      margin-top: calc(var(--spacing) * -270);

    }

  }

  .max-md\:mt-20 {

    @media (width < 768px) {

      margin-top: calc(var(--spacing) * 20);

    }

  }

  .max-md\:hidden {

    @media (width < 768px) {

      display: none;

    }

  }

  .max-md\:size-20 {

    @media (width < 768px) {

      width: calc(var(--spacing) * 20);

      height: calc(var(--spacing) * 20);

    }

  }

  .max-md\:h-400 {

    @media (width < 768px) {

      height: calc(var(--spacing) * 400);

    }

  }

  .max-md\:w-532 {

    @media (width < 768px) {

      width: calc(var(--spacing) * 532);

    }

  }

  .max-md\:pt-103 {

    @media (width < 768px) {

      padding-top: calc(var(--spacing) * 103);

    }

  }

  .max-md\:text-center {

    @media (width < 768px) {

      text-align: center;

    }

  }

  .max-sm\:top-140 {

    @media (width < 576px) {

      top: calc(var(--spacing) * 140);

    }

  }

  .max-sm\:top-335 {

    @media (width < 576px) {

      top: calc(var(--spacing) * 335);

    }

  }

  .max-sm\:\!mt-0 {

    @media (width < 576px) {

      margin-top: calc(var(--spacing) * 0) !important;

    }

  }

  .max-sm\:-mt-430 {

    @media (width < 576px) {

      margin-top: calc(var(--spacing) * -430);

    }

  }

  .max-sm\:mb-10 {

    @media (width < 576px) {

      margin-bottom: calc(var(--spacing) * 10);

    }

  }

  .max-sm\:block {

    @media (width < 576px) {

      display: block;

    }

  }

  .max-sm\:hidden {

    @media (width < 576px) {

      display: none;

    }

  }

  .max-sm\:size-60 {

    @media (width < 576px) {

      width: calc(var(--spacing) * 60);

      height: calc(var(--spacing) * 60);

    }

  }

  .max-sm\:max-h-35 {

    @media (width < 576px) {

      max-height: calc(var(--spacing) * 35);

    }

  }

  .max-sm\:w-330 {

    @media (width < 576px) {

      width: calc(var(--spacing) * 330);

    }

  }

  .max-sm\:w-335 {

    @media (width < 576px) {

      width: calc(var(--spacing) * 335);

    }

  }

  .max-sm\:w-800 {

    @media (width < 576px) {

      width: calc(var(--spacing) * 800);

    }

  }

  .max-sm\:w-full {

    @media (width < 576px) {

      width: 100%;

    }

  }

  .max-sm\:scale-\[1\.5\] {

    @media (width < 576px) {

      scale: 1.5;

    }

  }

  .max-sm\:flex-wrap {

    @media (width < 576px) {

      flex-wrap: wrap;

    }

  }

  .max-sm\:p-10 {

    @media (width < 576px) {

      padding: calc(var(--spacing) * 10);

    }

  }

  .max-sm\:\!px-0 {

    @media (width < 576px) {

      padding-inline: calc(var(--spacing) * 0) !important;

    }

  }

  .max-sm\:py-15 {

    @media (width < 576px) {

      padding-block: calc(var(--spacing) * 15);

    }

  }

  .max-sm\:pt-0 {

    @media (width < 576px) {

      padding-top: calc(var(--spacing) * 0);

    }

  }

  .max-sm\:pt-25 {

    @media (width < 576px) {

      padding-top: calc(var(--spacing) * 25);

    }

  }

  .max-sm\:before\:hidden {

    @media (width < 576px) {

      &::before {

        content: var(--tw-content);

        display: none;

      }

    }

  }

  .sm\:absolute {

    @media (width >= 576px) {

      position: absolute;

    }

  }

  .sm\:-top-10 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * -10);

    }

  }

  .sm\:top-0 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 0);

    }

  }

  .sm\:top-36 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 36);

    }

  }

  .sm\:top-80 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 80);

    }

  }

  .sm\:top-120 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 120);

    }

  }

  .sm\:top-130 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 130);

    }

  }

  .sm\:top-248 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 248);

    }

  }

  .sm\:top-260 {

    @media (width >= 576px) {

      top: calc(var(--spacing) * 260);

    }

  }

  .sm\:-right-81 {

    @media (width >= 576px) {

      right: calc(var(--spacing) * -81);

    }

  }

  .sm\:right-50 {

    @media (width >= 576px) {

      right: calc(var(--spacing) * 50);

    }

  }

  .sm\:right-60 {

    @media (width >= 576px) {

      right: calc(var(--spacing) * 60);

    }

  }

  .sm\:-bottom-40 {

    @media (width >= 576px) {

      bottom: calc(var(--spacing) * -40);

    }

  }

  .sm\:bottom-0 {

    @media (width >= 576px) {

      bottom: calc(var(--spacing) * 0);

    }

  }

  .sm\:bottom-60 {

    @media (width >= 576px) {

      bottom: calc(var(--spacing) * 60);

    }

  }

  .sm\:bottom-78 {

    @media (width >= 576px) {

      bottom: calc(var(--spacing) * 78);

    }

  }

  .sm\:-left-66 {

    @media (width >= 576px) {

      left: calc(var(--spacing) * -66);

    }

  }

  .sm\:-left-81 {

    @media (width >= 576px) {

      left: calc(var(--spacing) * -81);

    }

  }

  .sm\:left-0 {

    @media (width >= 576px) {

      left: calc(var(--spacing) * 0);

    }

  }

  .sm\:left-10 {

    @media (width >= 576px) {

      left: calc(var(--spacing) * 10);

    }

  }

  .sm\:left-50 {

    @media (width >= 576px) {

      left: calc(var(--spacing) * 50);

    }

  }

  .sm\:left-204 {

    @media (width >= 576px) {

      left: calc(var(--spacing) * 204);

    }

  }

  .sm\:left-\[42\%\] {

    @media (width >= 576px) {

      left: 42%;

    }

  }

  .sm\:col-span-2 {

    @media (width >= 576px) {

      grid-column: span 2 / span 2;

    }

  }

  .sm\:col-span-3 {

    @media (width >= 576px) {

      grid-column: span 3 / span 3;

    }

  }

  .sm\:col-span-4 {

    @media (width >= 576px) {

      grid-column: span 4 / span 4;

    }

  }

  .sm\:col-span-6 {

    @media (width >= 576px) {

      grid-column: span 6 / span 6;

    }

  }

  .sm\:col-span-8 {

    @media (width >= 576px) {

      grid-column: span 8 / span 8;

    }

  }

  .sm\:col-span-10 {

    @media (width >= 576px) {

      grid-column: span 10 / span 10;

    }

  }

  .sm\:my-20 {

    @media (width >= 576px) {

      margin-block: calc(var(--spacing) * 20);

    }

  }

  .sm\:ms-0 {

    @media (width >= 576px) {

      margin-inline-start: calc(var(--spacing) * 0);

    }

  }

  .sm\:ms-auto {

    @media (width >= 576px) {

      margin-inline-start: auto;

    }

  }

  .sm\:-mt-100 {

    @media (width >= 576px) {

      margin-top: calc(var(--spacing) * -100);

    }

  }

  .sm\:-mt-180 {

    @media (width >= 576px) {

      margin-top: calc(var(--spacing) * -180);

    }

  }

  .sm\:mt-80 {

    @media (width >= 576px) {

      margin-top: calc(var(--spacing) * 80);

    }

  }

  .sm\:mr-15 {

    @media (width >= 576px) {

      margin-right: calc(var(--spacing) * 15);

    }

  }

  .sm\:mb-0 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 0);

    }

  }

  .sm\:mb-2 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 2);

    }

  }

  .sm\:mb-14 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 14);

    }

  }

  .sm\:mb-15 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 15);

    }

  }

  .sm\:mb-20 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 20);

    }

  }

  .sm\:mb-25 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 25);

    }

  }

  .sm\:mb-30 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 30);

    }

  }

  .sm\:mb-35 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 35);

    }

  }

  .sm\:mb-36 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 36);

    }

  }

  .sm\:mb-40 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 40);

    }

  }

  .sm\:mb-43 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 43);

    }

  }

  .sm\:mb-45 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 45);

    }

  }

  .sm\:mb-50 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 50);

    }

  }

  .sm\:mb-54 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 54);

    }

  }

  .sm\:mb-80 {

    @media (width >= 576px) {

      margin-bottom: calc(var(--spacing) * 80);

    }

  }

  .sm\:ml-25 {

    @media (width >= 576px) {

      margin-left: calc(var(--spacing) * 25);

    }

  }

  .sm\:ml-46 {

    @media (width >= 576px) {

      margin-left: calc(var(--spacing) * 46);

    }

  }

  .sm\:ml-63 {

    @media (width >= 576px) {

      margin-left: calc(var(--spacing) * 63);

    }

  }

  .sm\:ml-78 {

    @media (width >= 576px) {

      margin-left: calc(var(--spacing) * 78);

    }

  }

  .sm\:flex {

    @media (width >= 576px) {

      display: flex;

    }

  }

  .sm\:hidden {

    @media (width >= 576px) {

      display: none;

    }

  }

  .sm\:\!size-27 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 27) !important;

      height: calc(var(--spacing) * 27) !important;

    }

  }

  .sm\:size-45 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 45);

      height: calc(var(--spacing) * 45);

    }

  }

  .sm\:size-52 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 52);

      height: calc(var(--spacing) * 52);

    }

  }

  .sm\:size-60 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 60);

      height: calc(var(--spacing) * 60);

    }

  }

  .sm\:size-80 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 80);

      height: calc(var(--spacing) * 80);

    }

  }

  .sm\:size-100 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 100);

      height: calc(var(--spacing) * 100);

    }

  }

  .sm\:size-248 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 248);

      height: calc(var(--spacing) * 248);

    }

  }

  .sm\:size-340 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 340);

      height: calc(var(--spacing) * 340);

    }

  }

  .sm\:h-400 {

    @media (width >= 576px) {

      height: calc(var(--spacing) * 400);

    }

  }

  .sm\:h-500 {

    @media (width >= 576px) {

      height: calc(var(--spacing) * 500);

    }

  }

  .sm\:h-600 {

    @media (width >= 576px) {

      height: calc(var(--spacing) * 600);

    }

  }

  .sm\:h-full {

    @media (width >= 576px) {

      height: 100%;

    }

  }

  .sm\:max-h-342 {

    @media (width >= 576px) {

      max-height: calc(var(--spacing) * 342);

    }

  }

  .sm\:min-h-60 {

    @media (width >= 576px) {

      min-height: calc(var(--spacing) * 60);

    }

  }

  .sm\:\!w-79 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 79) !important;

    }

  }

  .sm\:w-1\/2 {

    @media (width >= 576px) {

      width: calc(1/2 * 100%);

    }

  }

  .sm\:w-1\/3 {

    @media (width >= 576px) {

      width: calc(1/3 * 100%);

    }

  }

  .sm\:w-62 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 62);

    }

  }

  .sm\:w-500 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 500);

    }

  }

  .sm\:w-538 {

    @media (width >= 576px) {

      width: calc(var(--spacing) * 538);

    }

  }

  .sm\:w-\[43\.65\%\] {

    @media (width >= 576px) {

      width: 43.65%;

    }

  }

  .sm\:w-auto {

    @media (width >= 576px) {

      width: auto;

    }

  }

  .sm\:max-w-200 {

    @media (width >= 576px) {

      max-width: calc(var(--spacing) * 200);

    }

  }

  .sm\:max-w-265 {

    @media (width >= 576px) {

      max-width: calc(var(--spacing) * 265);

    }

  }

  .sm\:max-w-290 {

    @media (width >= 576px) {

      max-width: calc(var(--spacing) * 290);

    }

  }

  .sm\:min-w-60 {

    @media (width >= 576px) {

      min-width: calc(var(--spacing) * 60);

    }

  }

  .sm\:min-w-100 {

    @media (width >= 576px) {

      min-width: calc(var(--spacing) * 100);

    }

  }

  .sm\:min-w-360 {

    @media (width >= 576px) {

      min-width: calc(var(--spacing) * 360);

    }

  }

  .sm\:scale-\[0\.5\] {

    @media (width >= 576px) {

      scale: 0.5;

    }

  }

  .sm\:scale-\[0\.50\] {

    @media (width >= 576px) {

      scale: 0.50;

    }

  }

  .sm\:scale-\[0\.73\] {

    @media (width >= 576px) {

      scale: 0.73;

    }

  }

  .sm\:scale-\[0\.79\] {

    @media (width >= 576px) {

      scale: 0.79;

    }

  }

  .sm\:flex-row {

    @media (width >= 576px) {

      flex-direction: row;

    }

  }

  .sm\:items-center {

    @media (width >= 576px) {

      align-items: center;

    }

  }

  .sm\:justify-end {

    @media (width >= 576px) {

      justify-content: flex-end;

    }

  }

  .sm\:justify-start {

    @media (width >= 576px) {

      justify-content: flex-start;

    }

  }

  .sm\:gap-10 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 10);

    }

  }

  .sm\:gap-20 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 20);

    }

  }

  .sm\:gap-28 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 28);

    }

  }

  .sm\:gap-30 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 30);

    }

  }

  .sm\:gap-40 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 40);

    }

  }

  .sm\:gap-50 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 50);

    }

  }

  .sm\:gap-80 {

    @media (width >= 576px) {

      gap: calc(var(--spacing) * 80);

    }

  }

  .sm\:gap-y-40 {

    @media (width >= 576px) {

      row-gap: calc(var(--spacing) * 40);

    }

  }

  .sm\:bg-size-\[100\%\] {

    @media (width >= 576px) {

      background-size: 100%;

    }

  }

  .sm\:p-15 {

    @media (width >= 576px) {

      padding: calc(var(--spacing) * 15);

    }

  }

  .sm\:p-50 {

    @media (width >= 576px) {

      padding: calc(var(--spacing) * 50);

    }

  }

  .sm\:p-60 {

    @media (width >= 576px) {

      padding: calc(var(--spacing) * 60);

    }

  }

  .sm\:px-13 {

    @media (width >= 576px) {

      padding-inline: calc(var(--spacing) * 13);

    }

  }

  .sm\:px-20 {

    @media (width >= 576px) {

      padding-inline: calc(var(--spacing) * 20);

    }

  }

  .sm\:px-30 {

    @media (width >= 576px) {

      padding-inline: calc(var(--spacing) * 30);

    }

  }

  .sm\:px-31 {

    @media (width >= 576px) {

      padding-inline: calc(var(--spacing) * 31);

    }

  }

  .sm\:px-34 {

    @media (width >= 576px) {

      padding-inline: calc(var(--spacing) * 34);

    }

  }

  .sm\:py-16 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 16);

    }

  }

  .sm\:py-20 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 20);

    }

  }

  .sm\:py-35 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 35);

    }

  }

  .sm\:py-52 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 52);

    }

  }

  .sm\:py-60 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 60);

    }

  }

  .sm\:py-80 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 80);

    }

  }

  .sm\:py-90 {

    @media (width >= 576px) {

      padding-block: calc(var(--spacing) * 90);

    }

  }

  .sm\:ps-60 {

    @media (width >= 576px) {

      padding-inline-start: calc(var(--spacing) * 60);

    }

  }

  .sm\:ps-100 {

    @media (width >= 576px) {

      padding-inline-start: calc(var(--spacing) * 100);

    }

  }

  .sm\:pe-50 {

    @media (width >= 576px) {

      padding-inline-end: calc(var(--spacing) * 50);

    }

  }

  .sm\:pt-20 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 20);

    }

  }

  .sm\:pt-37 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 37);

    }

  }

  .sm\:pt-40 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 40);

    }

  }

  .sm\:pt-60 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 60);

    }

  }

  .sm\:pt-80 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 80);

    }

  }

  .sm\:pt-90 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 90);

    }

  }

  .sm\:pt-100 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 100);

    }

  }

  .sm\:pt-128 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 128);

    }

  }

  .sm\:pt-130 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 130);

    }

  }

  .sm\:pt-133 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 133);

    }

  }

  .sm\:pt-145 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 145);

    }

  }

  .sm\:pt-160 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 160);

    }

  }

  .sm\:pt-180 {

    @media (width >= 576px) {

      padding-top: calc(var(--spacing) * 180);

    }

  }

  .sm\:pb-0 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 0);

    }

  }

  .sm\:pb-40 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 40);

    }

  }

  .sm\:pb-50 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 50);

    }

  }

  .sm\:pb-55 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 55);

    }

  }

  .sm\:pb-60 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 60);

    }

  }

  .sm\:pb-65 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 65);

    }

  }

  .sm\:pb-73 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 73);

    }

  }

  .sm\:pb-80 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 80);

    }

  }

  .sm\:pb-90 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 90);

    }

  }

  .sm\:pb-100 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 100);

    }

  }

  .sm\:pb-133 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 133);

    }

  }

  .sm\:pb-200 {

    @media (width >= 576px) {

      padding-bottom: calc(var(--spacing) * 200);

    }

  }

  .sm\:pl-34 {

    @media (width >= 576px) {

      padding-left: calc(var(--spacing) * 34);

    }

  }

  .sm\:pl-40 {

    @media (width >= 576px) {

      padding-left: calc(var(--spacing) * 40);

    }

  }

  .sm\:pl-50 {

    @media (width >= 576px) {

      padding-left: calc(var(--spacing) * 50);

    }

  }

  .sm\:pl-110 {

    @media (width >= 576px) {

      padding-left: calc(var(--spacing) * 110);

    }

  }

  .sm\:text-2xl {

    @media (width >= 576px) {

      font-size: var(--text-2xl);

      line-height: var(--tw-leading, var(--text-2xl--line-height));

    }

  }

  .sm\:text-2xl\/35 {

    @media (width >= 576px) {

      font-size: var(--text-2xl);

      line-height: calc(var(--spacing) * 35);

    }

  }

  .sm\:text-2xl\/45 {

    @media (width >= 576px) {

      font-size: var(--text-2xl);

      line-height: calc(var(--spacing) * 45);

    }

  }

  .sm\:text-3xl {

    @media (width >= 576px) {

      font-size: var(--text-3xl);

      line-height: var(--tw-leading, var(--text-3xl--line-height));

    }

  }

  .sm\:text-3xl\/50 {

    @media (width >= 576px) {

      font-size: var(--text-3xl);

      line-height: calc(var(--spacing) * 50);

    }

  }

  .sm\:text-4\.75xl\/53 {

    @media (width >= 576px) {

      font-size: var(--text-4\.75xl);

      line-height: calc(var(--spacing) * 53);

    }

  }

  .sm\:text-4\.75xl\/70 {

    @media (width >= 576px) {

      font-size: var(--text-4\.75xl);

      line-height: calc(var(--spacing) * 70);

    }

  }

  .sm\:text-4xl {

    @media (width >= 576px) {

      font-size: var(--text-4xl);

      line-height: var(--tw-leading, var(--text-4xl--line-height));

    }

  }

  .sm\:text-4xl\/52 {

    @media (width >= 576px) {

      font-size: var(--text-4xl);

      line-height: calc(var(--spacing) * 52);

    }

  }

  .sm\:text-5\.5xl\/55 {

    @media (width >= 576px) {

      font-size: var(--text-5\.5xl);

      line-height: calc(var(--spacing) * 55);

    }

  }

  .sm\:text-5\.5xl\/60 {

    @media (width >= 576px) {

      font-size: var(--text-5\.5xl);

      line-height: calc(var(--spacing) * 60);

    }

  }

  .sm\:text-5xl {

    @media (width >= 576px) {

      font-size: var(--text-5xl);

      line-height: var(--tw-leading, var(--text-5xl--line-height));

    }

  }

  .sm\:text-5xl\/50 {

    @media (width >= 576px) {

      font-size: var(--text-5xl);

      line-height: calc(var(--spacing) * 50);

    }

  }

  .sm\:text-6\.5xl\/65 {

    @media (width >= 576px) {

      font-size: var(--text-6\.5xl);

      line-height: calc(var(--spacing) * 65);

    }

  }

  .sm\:text-6xl {

    @media (width >= 576px) {

      font-size: var(--text-6xl);

      line-height: var(--tw-leading, var(--text-6xl--line-height));

    }

  }

  .sm\:text-6xl\/60 {

    @media (width >= 576px) {

      font-size: var(--text-6xl);

      line-height: calc(var(--spacing) * 60);

    }

  }

  .sm\:text-7xxl\/80 {

    @media (width >= 576px) {

      font-size: var(--text-7xxl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .sm\:text-\[17px\]\/24 {

    @media (width >= 576px) {

      font-size: 17px;

      line-height: calc(var(--spacing) * 24);

    }

  }

  .sm\:text-base {

    @media (width >= 576px) {

      font-size: var(--text-base);

      line-height: var(--tw-leading, var(--text-base--line-height));

    }

  }

  .sm\:text-lg {

    @media (width >= 576px) {

      font-size: var(--text-lg);

      line-height: var(--tw-leading, var(--text-lg--line-height));

    }

  }

  .sm\:text-xl {

    @media (width >= 576px) {

      font-size: var(--text-xl);

      line-height: var(--tw-leading, var(--text-xl--line-height));

    }

  }

  .sm\:text-xl\/30 {

    @media (width >= 576px) {

      font-size: var(--text-xl);

      line-height: calc(var(--spacing) * 30);

    }

  }

  .sm\:text-xl\/35 {

    @media (width >= 576px) {

      font-size: var(--text-xl);

      line-height: calc(var(--spacing) * 35);

    }

  }

  .sm\:text-2\.5xl {

    @media (width >= 576px) {

      font-size: var(--text-2\.5xl);

    }

  }

  .sm\:text-2xxl {

    @media (width >= 576px) {

      font-size: var(--text-2xxl);

    }

  }

  .sm\:text-4\.5xl {

    @media (width >= 576px) {

      font-size: var(--text-4\.5xl);

    }

  }

  .sm\:text-5\.5xl {

    @media (width >= 576px) {

      font-size: var(--text-5\.5xl);

    }

  }

  .sm\:text-\[46px\] {

    @media (width >= 576px) {

      font-size: 46px;

    }

  }

  .sm\:text-\[130px\] {

    @media (width >= 576px) {

      font-size: 130px;

    }

  }

  .sm\:opacity-0 {

    @media (width >= 576px) {

      opacity: 0%;

    }

  }

  .before\:sm\:scale-\[0\.50\] {

    &::before {

      content: var(--tw-content);

      @media (width >= 576px) {

        scale: 0.50;

      }

    }

  }

  .sm\:after\:top-200 {

    @media (width >= 576px) {

      &::after {

        content: var(--tw-content);

        top: calc(var(--spacing) * 200);

      }

    }

  }

  .sm\:after\:bottom-2 {

    @media (width >= 576px) {

      &::after {

        content: var(--tw-content);

        bottom: calc(var(--spacing) * 2);

      }

    }

  }

  .md\:-top-25 {

    @media (width >= 768px) {

      top: calc(var(--spacing) * -25);

    }

  }

  .md\:top-0 {

    @media (width >= 768px) {

      top: calc(var(--spacing) * 0);

    }

  }

  .md\:top-55 {

    @media (width >= 768px) {

      top: calc(var(--spacing) * 55);

    }

  }

  .md\:top-210 {

    @media (width >= 768px) {

      top: calc(var(--spacing) * 210);

    }

  }

  .md\:right-100 {

    @media (width >= 768px) {

      right: calc(var(--spacing) * 100);

    }

  }

  .md\:\!bottom-20 {

    @media (width >= 768px) {

      bottom: calc(var(--spacing) * 20) !important;

    }

  }

  .md\:\!left-50 {

    @media (width >= 768px) {

      left: calc(var(--spacing) * 50) !important;

    }

  }

  .md\:left-50 {

    @media (width >= 768px) {

      left: calc(var(--spacing) * 50);

    }

  }

  .md\:left-100 {

    @media (width >= 768px) {

      left: calc(var(--spacing) * 100);

    }

  }

  .md\:order-0 {

    @media (width >= 768px) {

      order: 0;

    }

  }

  .md\:col-span-4 {

    @media (width >= 768px) {

      grid-column: span 4 / span 4;

    }

  }

  .md\:col-span-6 {

    @media (width >= 768px) {

      grid-column: span 6 / span 6;

    }

  }

  .md\:\!mt-0 {

    @media (width >= 768px) {

      margin-top: calc(var(--spacing) * 0) !important;

    }

  }

  .md\:mt-0 {

    @media (width >= 768px) {

      margin-top: calc(var(--spacing) * 0);

    }

  }

  .md\:mt-13 {

    @media (width >= 768px) {

      margin-top: calc(var(--spacing) * 13);

    }

  }

  .md\:mt-15 {

    @media (width >= 768px) {

      margin-top: calc(var(--spacing) * 15);

    }

  }

  .md\:mt-77 {

    @media (width >= 768px) {

      margin-top: calc(var(--spacing) * 77);

    }

  }

  .md\:mr-30 {

    @media (width >= 768px) {

      margin-right: calc(var(--spacing) * 30);

    }

  }

  .md\:mb-20 {

    @media (width >= 768px) {

      margin-bottom: calc(var(--spacing) * 20);

    }

  }

  .md\:mb-30 {

    @media (width >= 768px) {

      margin-bottom: calc(var(--spacing) * 30);

    }

  }

  .md\:mb-40 {

    @media (width >= 768px) {

      margin-bottom: calc(var(--spacing) * 40);

    }

  }

  .md\:mb-50 {

    @media (width >= 768px) {

      margin-bottom: calc(var(--spacing) * 50);

    }

  }

  .md\:mb-56 {

    @media (width >= 768px) {

      margin-bottom: calc(var(--spacing) * 56);

    }

  }

  .md\:ml-50 {

    @media (width >= 768px) {

      margin-left: calc(var(--spacing) * 50);

    }

  }

  .md\:ml-auto {

    @media (width >= 768px) {

      margin-left: auto;

    }

  }

  .md\:block {

    @media (width >= 768px) {

      display: block;

    }

  }

  .md\:flex {

    @media (width >= 768px) {

      display: flex;

    }

  }

  .md\:hidden {

    @media (width >= 768px) {

      display: none;

    }

  }

  .md\:size-65 {

    @media (width >= 768px) {

      width: calc(var(--spacing) * 65);

      height: calc(var(--spacing) * 65);

    }

  }

  .md\:size-100 {

    @media (width >= 768px) {

      width: calc(var(--spacing) * 100);

      height: calc(var(--spacing) * 100);

    }

  }

  .md\:h-500 {

    @media (width >= 768px) {

      height: calc(var(--spacing) * 500);

    }

  }

  .md\:h-full {

    @media (width >= 768px) {

      height: 100%;

    }

  }

  .md\:max-h-full {

    @media (width >= 768px) {

      max-height: 100%;

    }

  }

  .md\:min-h-350 {

    @media (width >= 768px) {

      min-height: calc(var(--spacing) * 350);

    }

  }

  .md\:w-1\/2 {

    @media (width >= 768px) {

      width: calc(1/2 * 100%);

    }

  }

  .md\:w-1\/4 {

    @media (width >= 768px) {

      width: calc(1/4 * 100%);

    }

  }

  .md\:w-\[60\%\] {

    @media (width >= 768px) {

      width: 60%;

    }

  }

  .md\:w-\[70\%\] {

    @media (width >= 768px) {

      width: 70%;

    }

  }

  .md\:w-\[80\%\] {

    @media (width >= 768px) {

      width: 80%;

    }

  }

  .md\:min-w-340 {

    @media (width >= 768px) {

      min-width: calc(var(--spacing) * 340);

    }

  }

  .md\:scale-\[0\.65\] {

    @media (width >= 768px) {

      scale: 0.65;

    }

  }

  .md\:scale-\[0\.70\] {

    @media (width >= 768px) {

      scale: 0.70;

    }

  }

  .md\:scale-\[0\.80\] {

    @media (width >= 768px) {

      scale: 0.80;

    }

  }

  .md\:scale-\[0\.89\] {

    @media (width >= 768px) {

      scale: 0.89;

    }

  }

  .md\:flex-col {

    @media (width >= 768px) {

      flex-direction: column;

    }

  }

  .md\:flex-row {

    @media (width >= 768px) {

      flex-direction: row;

    }

  }

  .md\:gap-23 {

    @media (width >= 768px) {

      gap: calc(var(--spacing) * 23);

    }

  }

  .md\:gap-30 {

    @media (width >= 768px) {

      gap: calc(var(--spacing) * 30);

    }

  }

  .md\:gap-40 {

    @media (width >= 768px) {

      gap: calc(var(--spacing) * 40);

    }

  }

  .md\:gap-60 {

    @media (width >= 768px) {

      gap: calc(var(--spacing) * 60);

    }

  }

  .md\:rounded-tl-\[15px\] {

    @media (width >= 768px) {

      border-top-left-radius: 15px;

    }

  }

  .md\:p-10 {

    @media (width >= 768px) {

      padding: calc(var(--spacing) * 10);

    }

  }

  .md\:p-35 {

    @media (width >= 768px) {

      padding: calc(var(--spacing) * 35);

    }

  }

  .md\:p-50 {

    @media (width >= 768px) {

      padding: calc(var(--spacing) * 50);

    }

  }

  .md\:\!px-60 {

    @media (width >= 768px) {

      padding-inline: calc(var(--spacing) * 60) !important;

    }

  }

  .md\:px-30 {

    @media (width >= 768px) {

      padding-inline: calc(var(--spacing) * 30);

    }

  }

  .md\:px-45 {

    @media (width >= 768px) {

      padding-inline: calc(var(--spacing) * 45);

    }

  }

  .md\:px-100 {

    @media (width >= 768px) {

      padding-inline: calc(var(--spacing) * 100);

    }

  }

  .md\:py-13 {

    @media (width >= 768px) {

      padding-block: calc(var(--spacing) * 13);

    }

  }

  .md\:py-50 {

    @media (width >= 768px) {

      padding-block: calc(var(--spacing) * 50);

    }

  }

  .md\:py-80 {

    @media (width >= 768px) {

      padding-block: calc(var(--spacing) * 80);

    }

  }

  .md\:py-100 {

    @media (width >= 768px) {

      padding-block: calc(var(--spacing) * 100);

    }

  }

  .md\:py-120 {

    @media (width >= 768px) {

      padding-block: calc(var(--spacing) * 120);

    }

  }

  .md\:ps-40 {

    @media (width >= 768px) {

      padding-inline-start: calc(var(--spacing) * 40);

    }

  }

  .md\:pe-20 {

    @media (width >= 768px) {

      padding-inline-end: calc(var(--spacing) * 20);

    }

  }

  .md\:pt-20 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 20);

    }

  }

  .md\:pt-30 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 30);

    }

  }

  .md\:pt-45 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 45);

    }

  }

  .md\:pt-50 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 50);

    }

  }

  .md\:pt-65 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 65);

    }

  }

  .md\:pt-81 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 81);

    }

  }

  .md\:pt-120 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 120);

    }

  }

  .md\:pt-150 {

    @media (width >= 768px) {

      padding-top: calc(var(--spacing) * 150);

    }

  }

  .md\:pb-80 {

    @media (width >= 768px) {

      padding-bottom: calc(var(--spacing) * 80);

    }

  }

  .md\:pb-100 {

    @media (width >= 768px) {

      padding-bottom: calc(var(--spacing) * 100);

    }

  }

  .md\:pb-130 {

    @media (width >= 768px) {

      padding-bottom: calc(var(--spacing) * 130);

    }

  }

  .md\:pb-133 {

    @media (width >= 768px) {

      padding-bottom: calc(var(--spacing) * 133);

    }

  }

  .md\:pb-160 {

    @media (width >= 768px) {

      padding-bottom: calc(var(--spacing) * 160);

    }

  }

  .md\:text-start {

    @media (width >= 768px) {

      text-align: start;

    }

  }

  .md\:text-2xl {

    @media (width >= 768px) {

      font-size: var(--text-2xl);

      line-height: var(--tw-leading, var(--text-2xl--line-height));

    }

  }

  .md\:text-2xl\/28 {

    @media (width >= 768px) {

      font-size: var(--text-2xl);

      line-height: calc(var(--spacing) * 28);

    }

  }

  .md\:text-2xl\/35 {

    @media (width >= 768px) {

      font-size: var(--text-2xl);

      line-height: calc(var(--spacing) * 35);

    }

  }

  .md\:text-3xl\/40 {

    @media (width >= 768px) {

      font-size: var(--text-3xl);

      line-height: calc(var(--spacing) * 40);

    }

  }

  .md\:text-4\.5xl\/50 {

    @media (width >= 768px) {

      font-size: var(--text-4\.5xl);

      line-height: calc(var(--spacing) * 50);

    }

  }

  .md\:text-4\.8xl\/50 {

    @media (width >= 768px) {

      font-size: var(--text-4\.8xl);

      line-height: calc(var(--spacing) * 50);

    }

  }

  .md\:text-4xl\/41 {

    @media (width >= 768px) {

      font-size: var(--text-4xl);

      line-height: calc(var(--spacing) * 41);

    }

  }

  .md\:text-4xl\/52 {

    @media (width >= 768px) {

      font-size: var(--text-4xl);

      line-height: calc(var(--spacing) * 52);

    }

  }

  .md\:text-4xl\/55 {

    @media (width >= 768px) {

      font-size: var(--text-4xl);

      line-height: calc(var(--spacing) * 55);

    }

  }

  .md\:text-5xl {

    @media (width >= 768px) {

      font-size: var(--text-5xl);

      line-height: var(--tw-leading, var(--text-5xl--line-height));

    }

  }

  .md\:text-5xl\/65 {

    @media (width >= 768px) {

      font-size: var(--text-5xl);

      line-height: calc(var(--spacing) * 65);

    }

  }

  .md\:text-6\.5xl\/70 {

    @media (width >= 768px) {

      font-size: var(--text-6\.5xl);

      line-height: calc(var(--spacing) * 70);

    }

  }

  .md\:text-6\.5xl\/73 {

    @media (width >= 768px) {

      font-size: var(--text-6\.5xl);

      line-height: calc(var(--spacing) * 73);

    }

  }

  .md\:text-6xl {

    @media (width >= 768px) {

      font-size: var(--text-6xl);

      line-height: var(--tw-leading, var(--text-6xl--line-height));

    }

  }

  .md\:text-6xl\/69 {

    @media (width >= 768px) {

      font-size: var(--text-6xl);

      line-height: calc(var(--spacing) * 69);

    }

  }

  .md\:text-6xl\/70 {

    @media (width >= 768px) {

      font-size: var(--text-6xl);

      line-height: calc(var(--spacing) * 70);

    }

  }

  .md\:text-7xl {

    @media (width >= 768px) {

      font-size: var(--text-7xl);

      line-height: var(--tw-leading, var(--text-7xl--line-height));

    }

  }

  .md\:text-7xl\/70 {

    @media (width >= 768px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 70);

    }

  }

  .md\:text-7xxl\/60 {

    @media (width >= 768px) {

      font-size: var(--text-7xxl);

      line-height: calc(var(--spacing) * 60);

    }

  }

  .md\:text-8\.5xl\/80 {

    @media (width >= 768px) {

      font-size: var(--text-8\.5xl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .md\:text-8xl\/95 {

    @media (width >= 768px) {

      font-size: var(--text-8xl);

      line-height: calc(var(--spacing) * 95);

    }

  }

  .md\:text-\[75px\]\/\[75px\] {

    @media (width >= 768px) {

      font-size: 75px;

      line-height: 75px;

    }

  }

  .md\:text-\[85px\]\/85 {

    @media (width >= 768px) {

      font-size: 85px;

      line-height: calc(var(--spacing) * 85);

    }

  }

  .md\:text-\[190px\]\/\[1\] {

    @media (width >= 768px) {

      font-size: 190px;

      line-height: 1;

    }

  }

  .md\:text-lg {

    @media (width >= 768px) {

      font-size: var(--text-lg);

      line-height: var(--tw-leading, var(--text-lg--line-height));

    }

  }

  .md\:text-sm {

    @media (width >= 768px) {

      font-size: var(--text-sm);

      line-height: var(--tw-leading, var(--text-sm--line-height));

    }

  }

  .md\:text-xl {

    @media (width >= 768px) {

      font-size: var(--text-xl);

      line-height: var(--tw-leading, var(--text-xl--line-height));

    }

  }

  .md\:text-xxl\/35 {

    @media (width >= 768px) {

      font-size: var(--text-xxl);

      line-height: calc(var(--spacing) * 35);

    }

  }

  .md\:text-4\.75xl {

    @media (width >= 768px) {

      font-size: var(--text-4\.75xl);

    }

  }

  .md\:text-5\.2xl {

    @media (width >= 768px) {

      font-size: var(--text-5\.2xl);

    }

  }

  .md\:text-\[90px\] {

    @media (width >= 768px) {

      font-size: 90px;

    }

  }

  .md\:text-\[160px\] {

    @media (width >= 768px) {

      font-size: 160px;

    }

  }

  .before\:md\:scale-\[0\.70\] {

    &::before {

      content: var(--tw-content);

      @media (width >= 768px) {

        scale: 0.70;

      }

    }

  }

  .md\:after\:bottom-7 {

    @media (width >= 768px) {

      &::after {

        content: var(--tw-content);

        bottom: calc(var(--spacing) * 7);

      }

    }

  }

  .md\:after\:block {

    @media (width >= 768px) {

      &::after {

        content: var(--tw-content);

        display: block;

      }

    }

  }

  .lg\:invisible {

    @media (width >= 992px) {

      visibility: hidden;

    }

  }

  .lg\:absolute {

    @media (width >= 992px) {

      position: absolute;

    }

  }

  .lg\:sticky {

    @media (width >= 992px) {

      position: sticky;

    }

  }

  .lg\:top-0 {

    @media (width >= 992px) {

      top: calc(var(--spacing) * 0);

    }

  }

  .lg\:top-40 {

    @media (width >= 992px) {

      top: calc(var(--spacing) * 40);

    }

  }

  .lg\:top-145 {

    @media (width >= 992px) {

      top: calc(var(--spacing) * 145);

    }

  }

  .lg\:top-165 {

    @media (width >= 992px) {

      top: calc(var(--spacing) * 165);

    }

  }

  .lg\:right-50 {

    @media (width >= 992px) {

      right: calc(var(--spacing) * 50);

    }

  }

  .lg\:right-224 {

    @media (width >= 992px) {

      right: calc(var(--spacing) * 224);

    }

  }

  .lg\:right-\[27\%\] {

    @media (width >= 992px) {

      right: 27%;

    }

  }

  .lg\:-bottom-75 {

    @media (width >= 992px) {

      bottom: calc(var(--spacing) * -75);

    }

  }

  .lg\:left-224 {

    @media (width >= 992px) {

      left: calc(var(--spacing) * 224);

    }

  }

  .lg\:z-2 {

    @media (width >= 992px) {

      z-index: var(--z-index-2);

    }

  }

  .lg\:z-5 {

    @media (width >= 992px) {

      z-index: 5;

    }

  }

  .lg\:order-0 {

    @media (width >= 992px) {

      order: 0;

    }

  }

  .lg\:order-1 {

    @media (width >= 992px) {

      order: 1;

    }

  }

  .lg\:order-2 {

    @media (width >= 992px) {

      order: 2;

    }

  }

  .lg\:order-\[0\] {

    @media (width >= 992px) {

      order: 0;

    }

  }

  .lg\:col-span-3 {

    @media (width >= 992px) {

      grid-column: span 3 / span 3;

    }

  }

  .lg\:col-span-4 {

    @media (width >= 992px) {

      grid-column: span 4 / span 4;

    }

  }

  .lg\:col-span-5 {

    @media (width >= 992px) {

      grid-column: span 5 / span 5;

    }

  }

  .lg\:col-span-6 {

    @media (width >= 992px) {

      grid-column: span 6 / span 6;

    }

  }

  .lg\:col-span-7 {

    @media (width >= 992px) {

      grid-column: span 7 / span 7;

    }

  }

  .lg\:col-span-8 {

    @media (width >= 992px) {

      grid-column: span 8 / span 8;

    }

  }

  .lg\:col-span-9 {

    @media (width >= 992px) {

      grid-column: span 9 / span 9;

    }

  }

  .lg\:float-left {

    @media (width >= 992px) {

      float: left;

    }

  }

  .lg\:float-right {

    @media (width >= 992px) {

      float: right;

    }

  }

  .lg\:mx-0 {

    @media (width >= 992px) {

      margin-inline: calc(var(--spacing) * 0);

    }

  }

  .lg\:\!mt-70 {

    @media (width >= 992px) {

      margin-top: calc(var(--spacing) * 70) !important;

    }

  }

  .lg\:mt-90 {

    @media (width >= 992px) {

      margin-top: calc(var(--spacing) * 90);

    }

  }

  .lg\:mb-0 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 0);

    }

  }

  .lg\:mb-5 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 5);

    }

  }

  .lg\:mb-16 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 16);

    }

  }

  .lg\:mb-20 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 20);

    }

  }

  .lg\:mb-30 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 30);

    }

  }

  .lg\:mb-40 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 40);

    }

  }

  .lg\:mb-50 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 50);

    }

  }

  .lg\:mb-56 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 56);

    }

  }

  .lg\:mb-60 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 60);

    }

  }

  .lg\:mb-70 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 70);

    }

  }

  .lg\:mb-73 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 73);

    }

  }

  .lg\:mb-80 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 80);

    }

  }

  .lg\:mb-85 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 85);

    }

  }

  .lg\:mb-100 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 100);

    }

  }

  .lg\:mb-106 {

    @media (width >= 992px) {

      margin-bottom: calc(var(--spacing) * 106);

    }

  }

  .lg\:-ml-40 {

    @media (width >= 992px) {

      margin-left: calc(var(--spacing) * -40);

    }

  }

  .lg\:ml-50 {

    @media (width >= 992px) {

      margin-left: calc(var(--spacing) * 50);

    }

  }

  .lg\:ml-70 {

    @media (width >= 992px) {

      margin-left: calc(var(--spacing) * 70);

    }

  }

  .lg\:ml-160 {

    @media (width >= 992px) {

      margin-left: calc(var(--spacing) * 160);

    }

  }

  .lg\:block {

    @media (width >= 992px) {

      display: block;

    }

  }

  .lg\:flex {

    @media (width >= 992px) {

      display: flex;

    }

  }

  .lg\:size-129 {

    @media (width >= 992px) {

      width: calc(var(--spacing) * 129);

      height: calc(var(--spacing) * 129);

    }

  }

  .lg\:size-auto {

    @media (width >= 992px) {

      width: auto;

      height: auto;

    }

  }

  .lg\:h-800 {

    @media (width >= 992px) {

      height: calc(var(--spacing) * 800);

    }

  }

  .lg\:h-\[calc\(100px-130px\)\] {

    @media (width >= 992px) {

      height: calc(100px - 130px);

    }

  }

  .lg\:h-full {

    @media (width >= 992px) {

      height: 100%;

    }

  }

  .lg\:h-screen {

    @media (width >= 992px) {

      height: 100vh;

    }

  }

  .lg\:max-h-1200 {

    @media (width >= 992px) {

      max-height: calc(var(--spacing) * 1200);

    }

  }

  .lg\:w-1\/2 {

    @media (width >= 992px) {

      width: calc(1/2 * 100%);

    }

  }

  .lg\:w-1\/3 {

    @media (width >= 992px) {

      width: calc(1/3 * 100%);

    }

  }

  .lg\:w-2\/5 {

    @media (width >= 992px) {

      width: calc(2/5 * 100%);

    }

  }

  .lg\:w-585 {

    @media (width >= 992px) {

      width: calc(var(--spacing) * 585);

    }

  }

  .lg\:w-\[41\.65\%\] {

    @media (width >= 992px) {

      width: 41.65%;

    }

  }

  .lg\:w-\[42vw\] {

    @media (width >= 992px) {

      width: 42vw;

    }

  }

  .lg\:w-\[44\%\] {

    @media (width >= 992px) {

      width: 44%;

    }

  }

  .lg\:w-\[50vw\] {

    @media (width >= 992px) {

      width: 50vw;

    }

  }

  .lg\:w-\[56\%\] {

    @media (width >= 992px) {

      width: 56%;

    }

  }

  .lg\:w-\[68\%\] {

    @media (width >= 992px) {

      width: 68%;

    }

  }

  .lg\:w-\[80\%\] {

    @media (width >= 992px) {

      width: 80%;

    }

  }

  .lg\:w-auto {

    @media (width >= 992px) {

      width: auto;

    }

  }

  .lg\:w-full {

    @media (width >= 992px) {

      width: 100%;

    }

  }

  .lg\:max-w-540 {

    @media (width >= 992px) {

      max-width: calc(var(--spacing) * 540);

    }

  }

  .lg\:max-w-600 {

    @media (width >= 992px) {

      max-width: calc(var(--spacing) * 600);

    }

  }

  .lg\:min-w-129 {

    @media (width >= 992px) {

      min-width: calc(var(--spacing) * 129);

    }

  }

  .lg\:scale-\[0\.7\] {

    @media (width >= 992px) {

      scale: 0.7;

    }

  }

  .lg\:scale-none {

    @media (width >= 992px) {

      scale: none;

    }

  }

  .lg\:flex-row {

    @media (width >= 992px) {

      flex-direction: row;

    }

  }

  .lg\:items-center {

    @media (width >= 992px) {

      align-items: center;

    }

  }

  .lg\:justify-between {

    @media (width >= 992px) {

      justify-content: space-between;

    }

  }

  .lg\:gap-0 {

    @media (width >= 992px) {

      gap: calc(var(--spacing) * 0);

    }

  }

  .lg\:gap-15 {

    @media (width >= 992px) {

      gap: calc(var(--spacing) * 15);

    }

  }

  .lg\:gap-30 {

    @media (width >= 992px) {

      gap: calc(var(--spacing) * 30);

    }

  }

  .lg\:gap-50 {

    @media (width >= 992px) {

      gap: calc(var(--spacing) * 50);

    }

  }

  .lg\:gap-y-100 {

    @media (width >= 992px) {

      row-gap: calc(var(--spacing) * 100);

    }

  }

  .lg\:overflow-y-auto {

    @media (width >= 992px) {

      overflow-y: auto;

    }

  }

  .lg\:border-b-0 {

    @media (width >= 992px) {

      border-bottom-style: var(--tw-border-style);

      border-bottom-width: 0px;

    }

  }

  .lg\:border-social {

    @media (width >= 992px) {

      border-color: var(--color-social);

    }

  }

  .lg\:bg-black {

    @media (width >= 992px) {

      background-color: var(--color-black);

    }

  }

  .lg\:px-0 {

    @media (width >= 992px) {

      padding-inline: calc(var(--spacing) * 0);

    }

  }

  .lg\:px-5 {

    @media (width >= 992px) {

      padding-inline: calc(var(--spacing) * 5);

    }

  }

  .lg\:px-60 {

    @media (width >= 992px) {

      padding-inline: calc(var(--spacing) * 60);

    }

  }

  .lg\:py-0 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 0);

    }

  }

  .lg\:py-60 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 60);

    }

  }

  .lg\:py-80 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 80);

    }

  }

  .lg\:py-100 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 100);

    }

  }

  .lg\:py-120 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 120);

    }

  }

  .lg\:py-140 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 140);

    }

  }

  .lg\:py-150 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 150);

    }

  }

  .lg\:py-160 {

    @media (width >= 992px) {

      padding-block: calc(var(--spacing) * 160);

    }

  }

  .lg\:ps-70 {

    @media (width >= 992px) {

      padding-inline-start: calc(var(--spacing) * 70);

    }

  }

  .lg\:ps-80 {

    @media (width >= 992px) {

      padding-inline-start: calc(var(--spacing) * 80);

    }

  }

  .lg\:ps-100 {

    @media (width >= 992px) {

      padding-inline-start: calc(var(--spacing) * 100);

    }

  }

  .lg\:pe-30 {

    @media (width >= 992px) {

      padding-inline-end: calc(var(--spacing) * 30);

    }

  }

  .lg\:pe-50 {

    @media (width >= 992px) {

      padding-inline-end: calc(var(--spacing) * 50);

    }

  }

  .lg\:pe-60 {

    @media (width >= 992px) {

      padding-inline-end: calc(var(--spacing) * 60);

    }

  }

  .lg\:pe-90 {

    @media (width >= 992px) {

      padding-inline-end: calc(var(--spacing) * 90);

    }

  }

  .lg\:pt-0 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 0);

    }

  }

  .lg\:pt-50 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 50);

    }

  }

  .lg\:pt-65 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 65);

    }

  }

  .lg\:pt-75 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 75);

    }

  }

  .lg\:pt-85 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 85);

    }

  }

  .lg\:pt-100 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 100);

    }

  }

  .lg\:pt-126 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 126);

    }

  }

  .lg\:pt-130 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 130);

    }

  }

  .lg\:pt-133 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 133);

    }

  }

  .lg\:pt-200 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 200);

    }

  }

  .lg\:pt-210 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 210);

    }

  }

  .lg\:pt-239 {

    @media (width >= 992px) {

      padding-top: calc(var(--spacing) * 239);

    }

  }

  .lg\:pr-30 {

    @media (width >= 992px) {

      padding-right: calc(var(--spacing) * 30);

    }

  }

  .lg\:pb-0 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 0);

    }

  }

  .lg\:pb-60 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 60);

    }

  }

  .lg\:pb-100 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 100);

    }

  }

  .lg\:pb-120 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 120);

    }

  }

  .lg\:pb-140 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 140);

    }

  }

  .lg\:pb-150 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 150);

    }

  }

  .lg\:pb-160 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 160);

    }

  }

  .lg\:pb-173 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 173);

    }

  }

  .lg\:pb-180 {

    @media (width >= 992px) {

      padding-bottom: calc(var(--spacing) * 180);

    }

  }

  .lg\:text-center {

    @media (width >= 992px) {

      text-align: center;

    }

  }

  .lg\:text-end {

    @media (width >= 992px) {

      text-align: end;

    }

  }

  .lg\:text-2xl {

    @media (width >= 992px) {

      font-size: var(--text-2xl);

      line-height: var(--tw-leading, var(--text-2xl--line-height));

    }

  }

  .lg\:text-5xl {

    @media (width >= 992px) {

      font-size: var(--text-5xl);

      line-height: var(--tw-leading, var(--text-5xl--line-height));

    }

  }

  .lg\:text-6xl {

    @media (width >= 992px) {

      font-size: var(--text-6xl);

      line-height: var(--tw-leading, var(--text-6xl--line-height));

    }

  }

  .lg\:text-6xl\/65 {

    @media (width >= 992px) {

      font-size: var(--text-6xl);

      line-height: calc(var(--spacing) * 65);

    }

  }

  .lg\:text-7xl\/70 {

    @media (width >= 992px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 70);

    }

  }

  .lg\:text-7xl\/80 {

    @media (width >= 992px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .lg\:text-8\.5xl\/80 {

    @media (width >= 992px) {

      font-size: var(--text-8\.5xl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .lg\:text-8\.5xl\/100 {

    @media (width >= 992px) {

      font-size: var(--text-8\.5xl);

      line-height: calc(var(--spacing) * 100);

    }

  }

  .lg\:text-9xl\/\[1\] {

    @media (width >= 992px) {

      font-size: var(--text-9xl);

      line-height: 1;

    }

  }

  .lg\:text-\[138px\]\/138 {

    @media (width >= 992px) {

      font-size: 138px;

      line-height: calc(var(--spacing) * 138);

    }

  }

  .lg\:text-lg\/20 {

    @media (width >= 992px) {

      font-size: var(--text-lg);

      line-height: calc(var(--spacing) * 20);

    }

  }

  .lg\:text-social {

    @media (width >= 992px) {

      color: var(--color-social);

    }

  }

  .lg\:opacity-0 {

    @media (width >= 992px) {

      opacity: 0%;

    }

  }

  .lg\:before\:absolute {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        position: absolute;

      }

    }

  }

  .lg\:before\:top-310 {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        top: calc(var(--spacing) * 310);

      }

    }

  }

  .lg\:before\:left-0 {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        left: calc(var(--spacing) * 0);

      }

    }

  }

  .lg\:before\:block {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        display: block;

      }

    }

  }

  .lg\:before\:hidden {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        display: none;

      }

    }

  }

  .lg\:before\:h-2 {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        height: calc(var(--spacing) * 2);

      }

    }

  }

  .lg\:before\:w-1\/2 {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        width: calc(1/2 * 100%);

      }

    }

  }

  .lg\:before\:w-32 {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        width: calc(var(--spacing) * 32);

      }

    }

  }

  .lg\:before\:w-full {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        width: 100%;

      }

    }

  }

  .before\:lg\:scale-none {

    &::before {

      content: var(--tw-content);

      @media (width >= 992px) {

        scale: none;

      }

    }

  }

  .lg\:before\:bg-black {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        background-color: var(--color-black);

      }

    }

  }

  .lg\:before\:bg-white {

    @media (width >= 992px) {

      &::before {

        content: var(--tw-content);

        background-color: var(--color-white);

      }

    }

  }

  .lg\:after\:-left-108 {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        left: calc(var(--spacing) * -108);

      }

    }

  }

  .lg\:after\:left-\[calc\(calc\(100vw_-_916px\)_\/_-2\)\] {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        left: calc(calc(100vw - 916px) / -2);

      }

    }

  }

  .lg\:after\:size-450 {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 450);

        height: calc(var(--spacing) * 450);

      }

    }

  }

  .lg\:after\:h-514 {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        height: calc(var(--spacing) * 514);

      }

    }

  }

  .lg\:after\:w-32 {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 32);

      }

    }

  }

  .lg\:after\:w-400 {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 400);

      }

    }

  }

  .lg\:after\:w-screen {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        width: 100vw;

      }

    }

  }

  .lg\:after\:bg-white {

    @media (width >= 992px) {

      &::after {

        content: var(--tw-content);

        background-color: var(--color-white);

      }

    }

  }

  .xl\:sticky {

    @media (width >= 1200px) {

      position: sticky;

    }

  }

  .xl\:\!top-35 {

    @media (width >= 1200px) {

      top: calc(var(--spacing) * 35) !important;

    }

  }

  .xl\:top-0 {

    @media (width >= 1200px) {

      top: calc(var(--spacing) * 0);

    }

  }

  .xl\:top-70 {

    @media (width >= 1200px) {

      top: calc(var(--spacing) * 70);

    }

  }

  .xl\:top-\[4\%\] {

    @media (width >= 1200px) {

      top: 4%;

    }

  }

  .xl\:-right-95 {

    @media (width >= 1200px) {

      right: calc(var(--spacing) * -95);

    }

  }

  .xl\:right-25 {

    @media (width >= 1200px) {

      right: calc(var(--spacing) * 25);

    }

  }

  .xl\:right-\[15\%\] {

    @media (width >= 1200px) {

      right: 15%;

    }

  }

  .xl\:\!bottom-50 {

    @media (width >= 1200px) {

      bottom: calc(var(--spacing) * 50) !important;

    }

  }

  .xl\:left-0 {

    @media (width >= 1200px) {

      left: calc(var(--spacing) * 0);

    }

  }

  .xl\:left-\[30\%\] {

    @media (width >= 1200px) {

      left: 30%;

    }

  }

  .xl\:col-span-3 {

    @media (width >= 1200px) {

      grid-column: span 3 / span 3;

    }

  }

  .xl\:col-span-4 {

    @media (width >= 1200px) {

      grid-column: span 4 / span 4;

    }

  }

  .xl\:col-span-5 {

    @media (width >= 1200px) {

      grid-column: span 5 / span 5;

    }

  }

  .xl\:col-span-6 {

    @media (width >= 1200px) {

      grid-column: span 6 / span 6;

    }

  }

  .xl\:col-span-7 {

    @media (width >= 1200px) {

      grid-column: span 7 / span 7;

    }

  }

  .xl\:col-span-8 {

    @media (width >= 1200px) {

      grid-column: span 8 / span 8;

    }

  }

  .xl\:row-span-2 {

    @media (width >= 1200px) {

      grid-row: span 2 / span 2;

    }

  }

  .xl\:mx-auto {

    @media (width >= 1200px) {

      margin-inline: auto;

    }

  }

  .xl\:mt-2 {

    @media (width >= 1200px) {

      margin-top: calc(var(--spacing) * 2);

    }

  }

  .xl\:mt-119 {

    @media (width >= 1200px) {

      margin-top: calc(var(--spacing) * 119);

    }

  }

  .xl\:mr-30 {

    @media (width >= 1200px) {

      margin-right: calc(var(--spacing) * 30);

    }

  }

  .xl\:mb-0 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 0);

    }

  }

  .xl\:mb-10 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 10);

    }

  }

  .xl\:mb-20 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 20);

    }

  }

  .xl\:mb-44 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 44);

    }

  }

  .xl\:mb-50 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 50);

    }

  }

  .xl\:mb-60 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 60);

    }

  }

  .xl\:mb-66 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 66);

    }

  }

  .xl\:mb-70 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 70);

    }

  }

  .xl\:mb-77 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 77);

    }

  }

  .xl\:mb-100 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 100);

    }

  }

  .xl\:mb-150 {

    @media (width >= 1200px) {

      margin-bottom: calc(var(--spacing) * 150);

    }

  }

  .xl\:ml-20 {

    @media (width >= 1200px) {

      margin-left: calc(var(--spacing) * 20);

    }

  }

  .xl\:ml-40 {

    @media (width >= 1200px) {

      margin-left: calc(var(--spacing) * 40);

    }

  }

  .xl\:ml-50 {

    @media (width >= 1200px) {

      margin-left: calc(var(--spacing) * 50);

    }

  }

  .xl\:ml-80 {

    @media (width >= 1200px) {

      margin-left: calc(var(--spacing) * 80);

    }

  }

  .xl\:ml-94 {

    @media (width >= 1200px) {

      margin-left: calc(var(--spacing) * 94);

    }

  }

  .xl\:ml-170 {

    @media (width >= 1200px) {

      margin-left: calc(var(--spacing) * 170);

    }

  }

  .xl\:block {

    @media (width >= 1200px) {

      display: block;

    }

  }

  .xl\:flex {

    @media (width >= 1200px) {

      display: flex;

    }

  }

  .xl\:hidden {

    @media (width >= 1200px) {

      display: none;

    }

  }

  .xl\:size-76 {

    @media (width >= 1200px) {

      width: calc(var(--spacing) * 76);

      height: calc(var(--spacing) * 76);

    }

  }

  .xl\:h-650 {

    @media (width >= 1200px) {

      height: calc(var(--spacing) * 650);

    }

  }

  .xl\:h-auto {

    @media (width >= 1200px) {

      height: auto;

    }

  }

  .xl\:w-2\/5 {

    @media (width >= 1200px) {

      width: calc(2/5 * 100%);

    }

  }

  .xl\:w-3\/5 {

    @media (width >= 1200px) {

      width: calc(3/5 * 100%);

    }

  }

  .xl\:w-4\/5 {

    @media (width >= 1200px) {

      width: calc(4/5 * 100%);

    }

  }

  .xl\:w-150 {

    @media (width >= 1200px) {

      width: calc(var(--spacing) * 150);

    }

  }

  .xl\:w-\[20\%\] {

    @media (width >= 1200px) {

      width: 20%;

    }

  }

  .xl\:w-\[60\%\] {

    @media (width >= 1200px) {

      width: 60%;

    }

  }

  .xl\:w-\[63\%\] {

    @media (width >= 1200px) {

      width: 63%;

    }

  }

  .xl\:w-full {

    @media (width >= 1200px) {

      width: 100%;

    }

  }

  .xl\:max-w-200 {

    @media (width >= 1200px) {

      max-width: calc(var(--spacing) * 200);

    }

  }

  .xl\:max-w-420 {

    @media (width >= 1200px) {

      max-width: calc(var(--spacing) * 420);

    }

  }

  .xl\:max-w-700 {

    @media (width >= 1200px) {

      max-width: calc(var(--spacing) * 700);

    }

  }

  .xl\:-translate-x-full {

    @media (width >= 1200px) {

      --tw-translate-x: -100%;

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .xl\:translate-x-10 {

    @media (width >= 1200px) {

      --tw-translate-x: calc(var(--spacing) * 10);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .xl\:-translate-y-5 {

    @media (width >= 1200px) {

      --tw-translate-y: calc(var(--spacing) * -5);

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .xl\:rotate-\[-360deg\] {

    @media (width >= 1200px) {

      rotate: -360deg;

    }

  }

  .xl\:gap-20 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 20);

    }

  }

  .xl\:gap-30 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 30);

    }

  }

  .xl\:gap-35 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 35);

    }

  }

  .xl\:gap-40 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 40);

    }

  }

  .xl\:gap-54 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 54);

    }

  }

  .xl\:gap-60 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 60);

    }

  }

  .xl\:gap-63 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 63);

    }

  }

  .xl\:gap-88 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 88);

    }

  }

  .xl\:gap-100 {

    @media (width >= 1200px) {

      gap: calc(var(--spacing) * 100);

    }

  }

  .xl\:rounded-tr-none {

    @media (width >= 1200px) {

      border-top-right-radius: 0;

    }

  }

  .xl\:rounded-bl-\[15px\] {

    @media (width >= 1200px) {

      border-bottom-left-radius: 15px;

    }

  }

  .xl\:p-0 {

    @media (width >= 1200px) {

      padding: calc(var(--spacing) * 0);

    }

  }

  .xl\:p-20 {

    @media (width >= 1200px) {

      padding: calc(var(--spacing) * 20);

    }

  }

  .xl\:p-40 {

    @media (width >= 1200px) {

      padding: calc(var(--spacing) * 40);

    }

  }

  .xl\:p-80 {

    @media (width >= 1200px) {

      padding: calc(var(--spacing) * 80);

    }

  }

  .xl\:p-85 {

    @media (width >= 1200px) {

      padding: calc(var(--spacing) * 85);

    }

  }

  .xl\:px-40 {

    @media (width >= 1200px) {

      padding-inline: calc(var(--spacing) * 40);

    }

  }

  .xl\:px-110 {

    @media (width >= 1200px) {

      padding-inline: calc(var(--spacing) * 110);

    }

  }

  .xl\:py-20 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 20);

    }

  }

  .xl\:py-60 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 60);

    }

  }

  .xl\:py-126 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 126);

    }

  }

  .xl\:py-132 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 132);

    }

  }

  .xl\:py-144 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 144);

    }

  }

  .xl\:py-150 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 150);

    }

  }

  .xl\:py-200 {

    @media (width >= 1200px) {

      padding-block: calc(var(--spacing) * 200);

    }

  }

  .xl\:ps-20 {

    @media (width >= 1200px) {

      padding-inline-start: calc(var(--spacing) * 20);

    }

  }

  .xl\:ps-50 {

    @media (width >= 1200px) {

      padding-inline-start: calc(var(--spacing) * 50);

    }

  }

  .xl\:ps-60 {

    @media (width >= 1200px) {

      padding-inline-start: calc(var(--spacing) * 60);

    }

  }

  .xl\:pe-40 {

    @media (width >= 1200px) {

      padding-inline-end: calc(var(--spacing) * 40);

    }

  }

  .xl\:pe-50 {

    @media (width >= 1200px) {

      padding-inline-end: calc(var(--spacing) * 50);

    }

  }

  .xl\:pe-130 {

    @media (width >= 1200px) {

      padding-inline-end: calc(var(--spacing) * 130);

    }

  }

  .xl\:pt-50 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 50);

    }

  }

  .xl\:pt-70 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 70);

    }

  }

  .xl\:pt-106 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 106);

    }

  }

  .xl\:pt-141 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 141);

    }

  }

  .xl\:pt-150 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 150);

    }

  }

  .xl\:pt-153 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 153);

    }

  }

  .xl\:pt-170 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 170);

    }

  }

  .xl\:pt-180 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 180);

    }

  }

  .xl\:pt-200 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 200);

    }

  }

  .xl\:pt-205 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 205);

    }

  }

  .xl\:pt-232 {

    @media (width >= 1200px) {

      padding-top: calc(var(--spacing) * 232);

    }

  }

  .xl\:pb-68 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 68);

    }

  }

  .xl\:pb-74 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 74);

    }

  }

  .xl\:pb-116 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 116);

    }

  }

  .xl\:pb-118 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 118);

    }

  }

  .xl\:pb-120 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 120);

    }

  }

  .xl\:pb-124 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 124);

    }

  }

  .xl\:pb-132 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 132);

    }

  }

  .xl\:pb-150 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 150);

    }

  }

  .xl\:pb-170 {

    @media (width >= 1200px) {

      padding-bottom: calc(var(--spacing) * 170);

    }

  }

  .xl\:text-2\.5xl\/35 {

    @media (width >= 1200px) {

      font-size: var(--text-2\.5xl);

      line-height: calc(var(--spacing) * 35);

    }

  }

  .xl\:text-2\.5xl\/40 {

    @media (width >= 1200px) {

      font-size: var(--text-2\.5xl);

      line-height: calc(var(--spacing) * 40);

    }

  }

  .xl\:text-2\.5xl\/56 {

    @media (width >= 1200px) {

      font-size: var(--text-2\.5xl);

      line-height: calc(var(--spacing) * 56);

    }

  }

  .xl\:text-2xl {

    @media (width >= 1200px) {

      font-size: var(--text-2xl);

      line-height: var(--tw-leading, var(--text-2xl--line-height));

    }

  }

  .xl\:text-4\.75xl\/46 {

    @media (width >= 1200px) {

      font-size: var(--text-4\.75xl);

      line-height: calc(var(--spacing) * 46);

    }

  }

  .xl\:text-5xl\/65 {

    @media (width >= 1200px) {

      font-size: var(--text-5xl);

      line-height: calc(var(--spacing) * 65);

    }

  }

  .xl\:text-6xl {

    @media (width >= 1200px) {

      font-size: var(--text-6xl);

      line-height: var(--tw-leading, var(--text-6xl--line-height));

    }

  }

  .xl\:text-7xl {

    @media (width >= 1200px) {

      font-size: var(--text-7xl);

      line-height: var(--tw-leading, var(--text-7xl--line-height));

    }

  }

  .xl\:text-7xl\/70 {

    @media (width >= 1200px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 70);

    }

  }

  .xl\:text-7xl\/80 {

    @media (width >= 1200px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .xl\:text-7xxl\/80 {

    @media (width >= 1200px) {

      font-size: var(--text-7xxl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .xl\:text-8\.5xl\/100 {

    @media (width >= 1200px) {

      font-size: var(--text-8\.5xl);

      line-height: calc(var(--spacing) * 100);

    }

  }

  .xl\:text-10xl\/140 {

    @media (width >= 1200px) {

      font-size: var(--text-10xl);

      line-height: calc(var(--spacing) * 140);

    }

  }

  .xl\:text-\[140px\]\/90 {

    @media (width >= 1200px) {

      font-size: 140px;

      line-height: calc(var(--spacing) * 90);

    }

  }

  .xl\:text-\[140px\]\/140 {

    @media (width >= 1200px) {

      font-size: 140px;

      line-height: calc(var(--spacing) * 140);

    }

  }

  .xl\:text-base {

    @media (width >= 1200px) {

      font-size: var(--text-base);

      line-height: var(--tw-leading, var(--text-base--line-height));

    }

  }

  .xl\:text-lg {

    @media (width >= 1200px) {

      font-size: var(--text-lg);

      line-height: var(--tw-leading, var(--text-lg--line-height));

    }

  }

  .xl\:text-lg\/40 {

    @media (width >= 1200px) {

      font-size: var(--text-lg);

      line-height: calc(var(--spacing) * 40);

    }

  }

  .xl\:text-\[300px\] {

    @media (width >= 1200px) {

      font-size: 300px;

    }

  }

  .xl\:opacity-0 {

    @media (width >= 1200px) {

      opacity: 0%;

    }

  }

  .xl\:after\:left-0 {

    @media (width >= 1200px) {

      &::after {

        content: var(--tw-content);

        left: calc(var(--spacing) * 0);

      }

    }

  }

  .xl\:after\:w-384 {

    @media (width >= 1200px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 384);

      }

    }

  }

  .xl\:after\:w-450 {

    @media (width >= 1200px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 450);

      }

    }

  }

  .xl\:after\:w-590 {

    @media (width >= 1200px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 590);

      }

    }

  }

  .xxl\:top-0 {

    @media (width >= 1400px) {

      top: calc(var(--spacing) * 0);

    }

  }

  .xxl\:top-\[5\%\] {

    @media (width >= 1400px) {

      top: 5%;

    }

  }

  .xxl\:-right-71 {

    @media (width >= 1400px) {

      right: calc(var(--spacing) * -71);

    }

  }

  .xxl\:right-150 {

    @media (width >= 1400px) {

      right: calc(var(--spacing) * 150);

    }

  }

  .xxl\:right-\[3\%\] {

    @media (width >= 1400px) {

      right: 3%;

    }

  }

  .xxl\:left-260 {

    @media (width >= 1400px) {

      left: calc(var(--spacing) * 260);

    }

  }

  .xxl\:col-span-3 {

    @media (width >= 1400px) {

      grid-column: span 3 / span 3;

    }

  }

  .xxl\:mr-100 {

    @media (width >= 1400px) {

      margin-right: calc(var(--spacing) * 100);

    }

  }

  .xxl\:mb-30 {

    @media (width >= 1400px) {

      margin-bottom: calc(var(--spacing) * 30);

    }

  }

  .xxl\:-ml-0 {

    @media (width >= 1400px) {

      margin-left: calc(var(--spacing) * -0);

    }

  }

  .xxl\:ml-100 {

    @media (width >= 1400px) {

      margin-left: calc(var(--spacing) * 100);

    }

  }

  .xxl\:size-125 {

    @media (width >= 1400px) {

      width: calc(var(--spacing) * 125);

      height: calc(var(--spacing) * 125);

    }

  }

  .xxl\:size-313 {

    @media (width >= 1400px) {

      width: calc(var(--spacing) * 313);

      height: calc(var(--spacing) * 313);

    }

  }

  .xxl\:size-400 {

    @media (width >= 1400px) {

      width: calc(var(--spacing) * 400);

      height: calc(var(--spacing) * 400);

    }

  }

  .xxl\:min-h-940 {

    @media (width >= 1400px) {

      min-height: calc(var(--spacing) * 940);

    }

  }

  .xxl\:w-\[54\%\] {

    @media (width >= 1400px) {

      width: 54%;

    }

  }

  .xxl\:scale-none {

    @media (width >= 1400px) {

      scale: none;

    }

  }

  .xxl\:gap-35 {

    @media (width >= 1400px) {

      gap: calc(var(--spacing) * 35);

    }

  }

  .xxl\:gap-60 {

    @media (width >= 1400px) {

      gap: calc(var(--spacing) * 60);

    }

  }

  .xxl\:px-26 {

    @media (width >= 1400px) {

      padding-inline: calc(var(--spacing) * 26);

    }

  }

  .xxl\:px-100 {

    @media (width >= 1400px) {

      padding-inline: calc(var(--spacing) * 100);

    }

  }

  .xxl\:py-100 {

    @media (width >= 1400px) {

      padding-block: calc(var(--spacing) * 100);

    }

  }

  .xxl\:ps-120 {

    @media (width >= 1400px) {

      padding-inline-start: calc(var(--spacing) * 120);

    }

  }

  .xxl\:pe-90 {

    @media (width >= 1400px) {

      padding-inline-end: calc(var(--spacing) * 90);

    }

  }

  .xxl\:pt-184 {

    @media (width >= 1400px) {

      padding-top: calc(var(--spacing) * 184);

    }

  }

  .xxl\:pt-198 {

    @media (width >= 1400px) {

      padding-top: calc(var(--spacing) * 198);

    }

  }

  .xxl\:pb-120 {

    @media (width >= 1400px) {

      padding-bottom: calc(var(--spacing) * 120);

    }

  }

  .xxl\:text-2\.5xl\/35 {

    @media (width >= 1400px) {

      font-size: var(--text-2\.5xl);

      line-height: calc(var(--spacing) * 35);

    }

  }

  .xxl\:text-4xl {

    @media (width >= 1400px) {

      font-size: var(--text-4xl);

      line-height: var(--tw-leading, var(--text-4xl--line-height));

    }

  }

  .xxl\:text-6xl {

    @media (width >= 1400px) {

      font-size: var(--text-6xl);

      line-height: var(--tw-leading, var(--text-6xl--line-height));

    }

  }

  .xxl\:text-7\.7xl\/95 {

    @media (width >= 1400px) {

      font-size: var(--text-7\.7xl);

      line-height: calc(var(--spacing) * 95);

    }

  }

  .xxl\:text-7xl\/80 {

    @media (width >= 1400px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .xxl\:text-\[180px\]\/\[160px\] {

    @media (width >= 1400px) {

      font-size: 180px;

      line-height: 160px;

    }

  }

  .xxl\:text-sm {

    @media (width >= 1400px) {

      font-size: var(--text-sm);

      line-height: var(--tw-leading, var(--text-sm--line-height));

    }

  }

  .xxl\:text-xl {

    @media (width >= 1400px) {

      font-size: var(--text-xl);

      line-height: var(--tw-leading, var(--text-xl--line-height));

    }

  }

  .xxl\:after\:w-450 {

    @media (width >= 1400px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 450);

      }

    }

  }

  .xxl\:after\:w-600 {

    @media (width >= 1400px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 600);

      }

    }

  }

  .xxl\:after\:w-650 {

    @media (width >= 1400px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 650);

      }

    }

  }

  .\33 xl\:left-68 {

    @media (width >= 1600px) {

      left: calc(var(--spacing) * 68);

    }

  }

  .\33 xl\:-mt-110 {

    @media (width >= 1600px) {

      margin-top: calc(var(--spacing) * -110);

    }

  }

  .\33 xl\:-mt-150 {

    @media (width >= 1600px) {

      margin-top: calc(var(--spacing) * -150);

    }

  }

  .\33 xl\:mb-30 {

    @media (width >= 1600px) {

      margin-bottom: calc(var(--spacing) * 30);

    }

  }

  .\33 xl\:block {

    @media (width >= 1600px) {

      display: block;

    }

  }

  .\33 xl\:w-\[33vw\] {

    @media (width >= 1600px) {

      width: 33vw;

    }

  }

  .\33 xl\:px-80 {

    @media (width >= 1600px) {

      padding-inline: calc(var(--spacing) * 80);

    }

  }

  .\33 xl\:ps-112 {

    @media (width >= 1600px) {

      padding-inline-start: calc(var(--spacing) * 112);

    }

  }

  .\33 xl\:ps-170 {

    @media (width >= 1600px) {

      padding-inline-start: calc(var(--spacing) * 170);

    }

  }

  .\33 xl\:pe-260 {

    @media (width >= 1600px) {

      padding-inline-end: calc(var(--spacing) * 260);

    }

  }

  .\33 xl\:pe-282 {

    @media (width >= 1600px) {

      padding-inline-end: calc(var(--spacing) * 282);

    }

  }

  .\33 xl\:pt-106 {

    @media (width >= 1600px) {

      padding-top: calc(var(--spacing) * 106);

    }

  }

  .\33 xl\:pt-295 {

    @media (width >= 1600px) {

      padding-top: calc(var(--spacing) * 295);

    }

  }

  .\33 xl\:pb-50 {

    @media (width >= 1600px) {

      padding-bottom: calc(var(--spacing) * 50);

    }

  }

  .\33 xl\:pb-84 {

    @media (width >= 1600px) {

      padding-bottom: calc(var(--spacing) * 84);

    }

  }

  .\33 xl\:text-7xl\/80 {

    @media (width >= 1600px) {

      font-size: var(--text-7xl);

      line-height: calc(var(--spacing) * 80);

    }

  }

  .\33 xl\:text-10xl\/165 {

    @media (width >= 1600px) {

      font-size: var(--text-10xl);

      line-height: calc(var(--spacing) * 165);

    }

  }

  .\33 xl\:after\:w-650 {

    @media (width >= 1600px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 650);

      }

    }

  }

  .\34 xl\:right-0 {

    @media (width >= 1700px) {

      right: calc(var(--spacing) * 0);

    }

  }

  .\34 xl\:-bottom-0 {

    @media (width >= 1700px) {

      bottom: calc(var(--spacing) * -0);

    }

  }

  .\34 xl\:mb-200 {

    @media (width >= 1700px) {

      margin-bottom: calc(var(--spacing) * 200);

    }

  }

  .\34 xl\:translate-x-\[-213px\] {

    @media (width >= 1700px) {

      --tw-translate-x: -213px;

      translate: var(--tw-translate-x) var(--tw-translate-y);

    }

  }

  .\34 xl\:after\:w-613 {

    @media (width >= 1700px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 613);

      }

    }

  }

  .\34 xl\:after\:w-615 {

    @media (width >= 1700px) {

      &::after {

        content: var(--tw-content);

        width: calc(var(--spacing) * 615);

      }

    }

  }

}

:root {

  --color-primary: #BFEBE5;

  --color-secondary: #181D19;

  --common-colour: #021935;

  --theme-colour: #5050f4;

  --color-lightgary: #cbd5e1;

  --color-yellow: #ffa808;

  --bodybg: #191B1D;

  --bodyfg: #fff;

  --bodytext: #666;

  --card: #292D32;

}

body {

  background-color: var(--color-white);

  font-family: var(--font-display);

  font-size: var(--text-base);

  line-height: var(--tw-leading, var(--text-base--line-height));

  --tw-font-weight: var(--font-weight-normal);

  font-weight: var(--font-weight-normal);

  color: #212529;

}

.link-hover {

  position: relative;

  &:hover {

    @media (hover: hover) {

      &::after {

        content: var(--tw-content);

        right: auto;

      }

    }

  }

  &:hover {

    @media (hover: hover) {

      &::after {

        content: var(--tw-content);

        left: calc(var(--spacing) * 0);

      }

    }

  }

  &:hover {

    @media (hover: hover) {

      &::after {

        content: var(--tw-content);

        width: 100%;

      }

    }

  }

}

.link-hover:after {

  position: absolute;

  right: calc(var(--spacing) * 0);

  bottom: calc(var(--spacing) * 0);

  height: calc(var(--spacing) * 1);

  width: calc(var(--spacing) * 0);

  background-color: var(--color-black);

  --tw-duration: 500ms;

  transition-duration: 500ms;

  --tw-content: '';

  content: var(--tw-content);

}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {

  -webkit-appearance: none;

  margin: 0;

}

input[type=number] {

  -moz-appearance: textfield;

}

.leading-page-1 {

  position: absolute;

}

.dzSubscribeMsg .alert, .dzFormMsg .alert {

  position: relative;

  margin-bottom: calc(var(--spacing) * 4);

  border-radius: var(--radius);

  border-style: var(--tw-border-style);

  border-width: 2px;

  padding-inline: calc(var(--spacing) * 5);

  padding-block: calc(var(--spacing) * 3.75);

}

.alert-warning {

  border-color: #ffeeba;

  background-color: #fff3cd;

  color: #856404;

}

.alert-success {

  border-color: #c3e6cb;

  background-color: #d4edda;

  color: #155724;

}

.alert-info {

  border-color: #b8daff;

  background-color: #cce5ff;

  color: #004085;

}

.alert-danger {

  border-color: #f5c6cb;

  background-color: #f8d7da;

  color: #721c24;

}

.page-loaded .preloader {

  bottom: -100%;

}

.preloader {

  position: fixed;

  right: calc(var(--spacing) * 0);

  bottom: calc(var(--spacing) * 0);

  z-index: 9999999999999;

  display: flex;

  width: 100%;

  height: 100%;

  flex-wrap: wrap;

  align-items: center;

  background-color: var(--color-primary);

  --tw-duration: 2s;

  transition-duration: 2s;

}

#videoContainer iframe {

  @media (width < 768px) {

    height: calc(var(--spacing) * 400) !important;

  }

}

#scrollProgress.active {

  opacity: 1;

  pointer-events: auto;

}

#loader:before {

  position: absolute;

  top: calc(1/2 * 100%);

  right: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  margin-inline: auto;

  margin-top: calc(var(--spacing) * 30);

  margin-bottom: calc(var(--spacing) * 0);

  width: 100%;

  text-align: center;

  font-size: var(--text-sm);

  line-height: var(--tw-leading, var(--text-sm--line-height));

  --tw-font-weight: var(--font-weight-semibold);

  font-weight: var(--font-weight-semibold);

  color: var(--color-white);

  --tw-content: 'Loading';

  content: var(--tw-content);

}

#loader:after {

  position: absolute;

  top: calc(1/2 * 100%);

  left: calc(1/2 * 100%);

  margin-top: calc(var(--spacing) * -38);

  margin-left: calc(var(--spacing) * -40);

  width: calc(var(--spacing) * 70);

  height: calc(var(--spacing) * 70);

  background-image: url(../img/preloader.png);

  background-position: center;

  background-repeat: no-repeat;

  --tw-content: '';

  content: var(--tw-content);

}

#loader:after {

  animation: fa-spin 10s infinite linear;

}

@keyframes spinner {

  0% {

    stroke-dashoffset: 33px;

    transform: rotatey(0deg) rotate(0deg);

  }

  24.9999% {

    stroke-dashoffset: 11px;

    transform: rotatey(0deg) rotate(0deg);

  }

  25% {

    stroke-dashoffset: 11px;

    transform: rotatey(180deg) rotate(270deg);

  }

  49.9999% {

    stroke-dashoffset: 33px;

    transform: rotatey(180deg) rotate(270deg);

  }

  50% {

    stroke-dashoffset: 33px;

    transform: rotatey(0deg) rotate(180deg);

  }

  74.9999% {

    stroke-dashoffset: 11px;

    transform: rotatey(0deg) rotate(180deg);

  }

  75% {

    stroke-dashoffset: 11px;

    transform: rotatey(180deg) rotate(90deg);

  }

  100% {

    stroke-dashoffset: 33px;

    transform: rotatey(180deg) rotate(90deg);

  }

}

@-webkit-keyframes rotation {

  0% {

    -webkit-transform: rotate(0deg);

  }

  50% {

    -webkit-transform: rotate(180deg);

  }

  100% {

    -webkit-transform: rotate(360deg);

  }

}

@keyframes rotation {

  0% {

    transform: rotate(0deg);

  }

  50% {

    transform: rotate(180deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

#pointer-ring {

  left: 0;

  top: 0;

  width: 40px;

  height: 40px;

  display: block;

  border: 1px solid #038371 !important;

  position: fixed;

  border-radius: 100px;

  z-index: 999999;

  pointer-events: none;

  transition: width 0.3s, height 0.3s;

}

#pointer-ring.active {

  width: 60px;

  height: 60px;

  opacity: 0.5;

  background-color: var(--color-primary);

  border: 0 !important;

}

#videoContainer iframe, #videoContainer video {

  width: 100%;

  height: 676px;

  border: none;

  border-radius: 8px;

}

.container {

  max-width: 1320px;

  --bs-gutter-x: 30px;

  --bs-gutter-y: 0;

  padding-right: calc(var(--bs-gutter-x) * .5);

  padding-left: calc(var(--bs-gutter-x) * .5);

  margin-right: auto;

  margin-left: auto;

}

@layer components {

  .container-lg {

    max-width: 1540px;

    --bs-gutter-x: 30px;

    --bs-gutter-y: 0;

    padding-right: calc(var(--bs-gutter-x) * .5);

    padding-left: calc(var(--bs-gutter-x) * .5);

    margin-right: auto;

    margin-left: auto;

  }

  .custom-container {

    max-width: 1700px;

    --bs-gutter-x: 30px;

    --bs-gutter-y: 0;

    padding-right: calc(var(--bs-gutter-x) * .5);

    padding-left: calc(var(--bs-gutter-x) * .5);

    margin-right: auto;

    margin-left: auto;

  }

  .container-md {

    max-width: 1600px;

    --bs-gutter-x: 30px;

    --bs-gutter-y: 0;

    padding-right: calc(var(--bs-gutter-x) * .5);

    padding-left: calc(var(--bs-gutter-x) * .5);

    margin-right: auto;

    margin-left: auto;

  }

  .container-sm {

    max-width: 946px;

    --bs-gutter-x: 30px;

    --bs-gutter-y: 0;

    padding-right: calc(var(--bs-gutter-x) * .5);

    padding-left: calc(var(--bs-gutter-x) * .5);

    margin-right: auto;

    margin-left: auto;

  }

  .row {

    display: flex;

    flex-wrap: wrap;

    --bs-gutter-x: 1.5rem;

    --bs-gutter-y: 0;

    margin-top: calc(-1 * var(--bs-gutter-y));

    margin-right: calc(-.5* var(--bs-gutter-x));

    margin-left: calc(-.5* var(--bs-gutter-x));

  }

  .row>* {

    --bs-gutter-x: 1.5rem;

    padding-right: calc(var(--bs-gutter-x)* .5);

    padding-left: calc(var(--bs-gutter-x)* .5);

  }

  .container-fluid {

    --bs-gutter-x: 1.5rem;

    --bs-gutter-y: 0;

    max-width: 1780px;

    padding-right: calc(var(--bs-gutter-x) * 0.5);

    padding-left: calc(var(--bs-gutter-x) * 0.5);

    margin-right: auto;

    margin-left: auto;

  }

  .card {

    display: flex;

    flex-direction: column;

    border-radius: var(--radius-lg);

    background-color: var(--color-card);

  }

}

@keyframes move {

  0% {

    transform: translate(0);

  }

  25% {

    transform: translate(-15px, -15px);

  }

  75% {

    transform: translate(-15px, 8px);

  }

  100% {

    transform: translate(0);

  }

}

@keyframes rotate {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

@keyframes ticker {

  0% {

    transform: translate(0);

  }

  100% {

    transform: translate(-100%);

  }

}

@keyframes toTopFromBottom {

  49% {

    -webkit-transform: translate(100%, -100%);

  }

  50% {

    opacity: 0;

    -webkit-transform: translate(-100%, 100%);

  }

  51% {

    opacity: 1;

  }

}

@keyframes clipRightIn {

  0% {

    -webkit-clip-path: inset(0 100% 0 0);

    clip-path: inset(0 100% 0 0);

  }

  to {

    -webkit-clip-path: inset(0);

    clip-path: inset(0);

  }

}

@keyframes clipLeftIn {

  0% {

    -webkit-clip-path: inset(0 0 0 100%);

    clip-path: inset(0 0 0 100%);

  }

  to {

    -webkit-clip-path: inset(0);

    clip-path: inset(0);

  }

}

@keyframes ScaleInOut {

  0% {

    -webkit-transform: scale(1);

    transform: scale(1);

  }

  50% {

    -webkit-transform: scale(1.3);

    transform: scale(1.3);

  }

  100% {

    -webkit-transform: scale(1);

    transform: scale(1);

  }

}

@keyframes bounceShake {

  0%,100% {

    transform: translateY(0)rotate(0);

  }

  25% {

    transform: translateY(-20px)rotate(-10deg);

  }

  50% {

    transform: translateY(0)rotate(10deg);

  }

  75% {

    transform: translateY(-10px)rotate(-5deg);

  }

}

@keyframes sk-rotate {

  100% {

    transform: rotate(360deg);

    -webkit-transform: rotate(360deg);

  }

}

@keyframes reverse-rotate {

  100% {

    transform: rotate(-360deg);

    -webkit-transform: rotate(-360deg);

  }

}

@keyframes sk-bounce {

  0%,100% {

    transform: scale(0);

    -webkit-transform: scale(0);

  }

  50% {

    transform: scale(1);

    -webkit-transform: scale(1);

  }

}

@keyframes headerSlideDown {

  0% {

    margin-top: -150px;

  }

  100% {

    margin-top: 0;

  }

}

@keyframes topshap {

  0% {

    transform: translateY(0px);

  }

  50% {

    transform: translateY(10px);

  }

  100% {

    transform: translateY(0px);

  }

}

@keyframes dzRing {

  0% {

    -webkit-transform: rotate(0) scale(1) skew(1deg);

    transform: rotate(0) scale(1) skew(1deg);

  }

  10% {

    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);

    transform: rotate(-25deg) scale(1) skew(1deg);

  }

  20% {

    -webkit-transform: rotate(25deg) scale(1) skew(1deg);

    transform: rotate(25deg) scale(1) skew(1deg);

  }

  30% {

    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);

    transform: rotate(-25deg) scale(1) skew(1deg);

  }

  40% {

    -webkit-transform: rotate(25deg) scale(1) skew(1deg);

    transform: rotate(25deg) scale(1) skew(1deg);

  }

  50% {

    -webkit-transform: rotate(0) scale(1) skew(1deg);

    transform: rotate(0) scale(1) skew(1deg);

  }

  100% {

    -webkit-transform: rotate(0) scale(1) skew(1deg);

    transform: rotate(0) scale(1) skew(1deg);

  }

}

.pxl-loader {

  background: white;

  height: 100vh;

  position: fixed;

  width: 100%;

  z-index: 999999;

  top: 0;

  left: 0;

  -webkit-transition: all 300ms cubic-bezier(.4,0,1,1);

  -khtml-transition: all 300ms cubic-bezier(.4,0,1,1);

  -moz-transition: all 300ms cubic-bezier(.4,0,1,1);

  -ms-transition: all 300ms cubic-bezier(.4,0,1,1);

  -o-transition: all 300ms cubic-bezier(.4,0,1,1);

  transition: all 300ms cubic-bezier(.4,0,1,1);

}

.pxl-loader.style-2 .loading-spinner {

  margin: -20px auto 0;

  width: 40px;

  height: 40px;

  top: 50%;

  position: relative;

  text-align: center;

  -webkit-animation: sk-rotate 2s infinite linear;

  animation: sk-rotate 2s infinite linear;

}

.pxl-loader.style-2 .loading-dot1,.pxl-loader.style-2 .loading-dot2 {

  width: 60%;

  height: 60%;

  display: inline-block;

  position: absolute;

  top: 0;

  border-radius: 100%;

  -webkit-animation: sk-bounce 2s infinite ease-in-out;

  animation: sk-bounce 2s infinite ease-in-out;

}

.pxl-loader.style-2 .loading-dot1 {

  background-color: var(--color-primary);

}

.pxl-loader.style-2 .loading-dot2 {

  top: auto;

  bottom: 0;

  -webkit-animation-delay: -1s;

  animation-delay: -1s;

  background-color: var(--color-secondary);

}

@layer components {

  .btn {

    position: relative;

    z-index: 0;

    display: inline-flex;

    cursor: pointer;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    background-color: var(--color-primary);

    padding-inline: calc(var(--spacing) * 30);

    padding-block: calc(var(--spacing) * 14);

    font-family: var(--font-display);

    font-size: var(--text-base);

    line-height: var(--tw-leading, var(--text-base--line-height));

    --tw-font-weight: var(--font-weight-semibold);

    font-weight: var(--font-weight-semibold);

    color: var(--color-secondary);

    text-transform: capitalize;

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  .bars-icon {

    display: flex;

    width: calc(var(--spacing) * 50);

    height: calc(var(--spacing) * 50);

    cursor: pointer;

    align-items: center;

    justify-content: center;

    border-radius: calc(infinity * 1px);

    background-color: var(--color-gary);

    font-family: var(--font-display);

    text-transform: capitalize;

  }

  .btn-outline {

    border-style: var(--tw-border-style);

    border-width: 1px;

    border-color: color-mix(in srgb, #000 10%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-black) 10%, transparent);

    }

    background-color: transparent;

    color: var(--color-secondary);

  }

  .btn-sm {

    border-radius: var(--radius);

    border-radius: 4px;

    background-color: color-mix(in srgb, #000 5%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-black) 5%, transparent);

    }

    padding-inline: calc(var(--spacing) * 8);

    padding-inline: calc(var(--spacing) * 10);

    padding-block: calc(var(--spacing) * 1);

    padding-block: calc(var(--spacing) * 5);

    font-family: var(--font-display);

    font-size: var(--text-sm);

    line-height: var(--tw-leading, var(--text-sm--line-height));

    --tw-font-weight: var(--font-weight-medium);

    font-weight: var(--font-weight-medium);

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  .btn-sm:hover {

    background-color: var(--color-primary);

    color: var(--color-secondary);

  }

  .skillsbtn {

    border-radius: var(--radius-lg);

    background-color: var(--color-white);

    padding-inline: calc(var(--spacing) * 20);

    padding-block: calc(var(--spacing) * 10);

    font-size: var(--text-sm);

    line-height: var(--tw-leading, var(--text-sm--line-height));

    --tw-font-weight: var(--font-weight-bold);

    font-weight: var(--font-weight-bold);

    text-transform: capitalize;

  }

  .skillsbtn:hover {

    background-color: var(--color-orange);

    color: var(--color-white);

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  .skillsbtn:hover i {

    color: var(--color-white) !important;

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  .btn-secondary:after {

    position: absolute;

    top: calc(var(--spacing) * 0);

    left: calc(var(--spacing) * 0);

    z-index: var(--z-index-1);

    width: 100%;

    height: 100%;

    --tw-translate-x: -105%;

    translate: var(--tw-translate-x) var(--tw-translate-y);

    border-right-style: var(--tw-border-style);

    border-right-width: 2px;

    border-color: var(--color-white);

    background-color: color-mix(in srgb, #fff 50%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      background-color: color-mix(in oklab, var(--color-white) 50%, transparent);

    }

    opacity: 80%;

    --tw-duration: 500ms;

    transition-duration: 500ms;

    --tw-content: '';

    content: var(--tw-content);

  }

  .btn-secondary:hover:after {

    --tw-translate-x: calc(var(--spacing) * 0);

    translate: var(--tw-translate-x) var(--tw-translate-y);

    --tw-translate-y: calc(var(--spacing) * 0);

    translate: var(--tw-translate-x) var(--tw-translate-y);

    opacity: 0%;

  }

  .btn-secondary {

    position: relative;

    z-index: var(--z-index-1);

    overflow: hidden;

  }

}

.style-1.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {

  width: calc(var(--spacing) * 30);

  border-radius: var(--radius-md);

  background-color: var(--color-primary);

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {

  display: none;

}

.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {

  display: none;

}

.swiper-button-next.testimonial-button-next svg:hover g {

  stroke: var(--color-black);

  opacity: 100%;

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.swiper-button-prev.testimonial-button-prev svg:hover g {

  stroke: var(--color-black);

  opacity: 100%;

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.blog-swiper .blog-card {

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.blog-swiper .swiper-slide:nth-child(even) .blog-card {

  @media (width >= 576px) {

    padding-top: calc(var(--spacing) * 70);

  }

}

.pxl-swiper-slider:not(.pxl-swiper-initialized) {

  .pxl-swiper-slider-wrap {

    display: none;

  }

}

a {

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.product-detail-thumbs .swiper-pagination .swiper-pagination-bullet {

  position: relative;

  width: calc(var(--spacing) * 6) !important;

  height: calc(var(--spacing) * 6) !important;

  background-color: color-mix(in srgb, #fff 30%, transparent) !important;

  @supports (color: color-mix(in lab, red, red)) {

    background-color: color-mix(in oklab, var(--color-white) 30%, transparent) !important;

  }

  opacity: 100% !important;

  --tw-duration: 200ms;

  transition-duration: 200ms;

  &::after {

    content: var(--tw-content);

    position: absolute;

  }

  &::after {

    content: var(--tw-content);

    top: calc(1/2 * 100%);

  }

  &::after {

    content: var(--tw-content);

    left: calc(1/2 * 100%);

  }

  &::after {

    content: var(--tw-content);

    width: calc(var(--spacing) * 18);

    height: calc(var(--spacing) * 18);

  }

  &::after {

    content: var(--tw-content);

    --tw-translate-x: calc(calc(1/2 * 100%) * -1);

    --tw-translate-y: calc(calc(1/2 * 100%) * -1);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  &::after {

    content: var(--tw-content);

    border-radius: calc(infinity * 1px);

  }

  &::after {

    content: var(--tw-content);

    border-style: var(--tw-border-style);

    border-width: 1px;

  }

  &::after {

    content: var(--tw-content);

    border-color: transparent;

  }

  &::after {

    content: var(--tw-content);

    --tw-content: '';

    content: var(--tw-content);

  }

}

.product-detail-thumbs .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {

  background-color: var(--color-white) !important;

  &::after {

    content: var(--tw-content);

    border-color: var(--color-white);

  }

}

.reviewtwo-slider .swiper-button .swiper-button-next, .swiper-button .swiper-button-prev {

  display: flex;

  width: calc(var(--spacing) * 48);

  height: calc(var(--spacing) * 48);

  align-items: center;

  justify-content: center;

  border-radius: calc(infinity * 1px);

  background-color: var(--color-bggreen);

}

.reviewtwo-slider .swiper-button {

  position: absolute;

  bottom: calc(var(--spacing) * 30);

  left: calc(var(--spacing) * 60);

  z-index: 10 !important;

}

.footer-1 .form-control {

  height: calc(var(--spacing) * 53);

  width: 100%;

  border-bottom-style: var(--tw-border-style);

  border-bottom-width: 1px;

  border-color: color-mix(in srgb, #fff 20%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    border-color: color-mix(in oklab, var(--color-white) 20%, transparent);

  }

  background-color: transparent;

  padding-block: calc(var(--spacing) * 15);

  text-align: left;

  font-family: var(--font-display);

  font-size: var(--text-lg);

  line-height: var(--tw-leading, var(--text-lg--line-height));

  --tw-font-weight: var(--font-weight-medium);

  font-weight: var(--font-weight-medium);

  color: color-mix(in srgb, #fff 90%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    color: color-mix(in oklab, var(--color-white) 90%, transparent);

  }

  --tw-outline-style: none;

  outline-style: none;

}

.footer-1 .hover-box:hover .form-control {

  color: var(--color-white);

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.floating-underline .form-control {

  height: calc(var(--spacing) * 140);

}

.footer-bottom .widget a {

  font-family: var(--font-display);

  font-size: var(--text-xl);

  line-height: var(--tw-leading, var(--text-xl--line-height));

  --tw-font-weight: var(--font-weight-medium);

  font-weight: var(--font-weight-medium);

  color: var(--color-white);

  text-transform: capitalize;

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.footer-bottom .widget .list-hover1 span:hover {

  color: var(--color-primary);

}

.footer-bottom .social-icon a {

  font-family: var(--font-display);

  font-size: var(--text-xl);

  line-height: var(--tw-leading, var(--text-xl--line-height));

  --tw-font-weight: var(--font-weight-medium);

  font-weight: var(--font-weight-medium);

  color: var(--color-white);

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.list-hover1>li>a>span:after {

  position: absolute;

  right: -1px;

  bottom: calc(var(--spacing) * 0);

  height: 1px;

  width: calc(var(--spacing) * 0);

  background-color: var(--color-primary);

  --tw-duration: .3s;

  transition-duration: .3s;

  --tw-content: '';

  content: var(--tw-content);

}

footer .widget_services ul li a {

  display: block;

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.footer-bottom .widget_services .list-hover1 li a span {

  color: var(--color-white);

}

.list-hover1>li>a>span {

  position: relative;

  font-family: var(--font-display);

  font-size: var(--text-xl);

  line-height: var(--tw-leading, var(--text-xl--line-height));

  --tw-font-weight: var(--font-weight-medium);

  font-weight: var(--font-weight-medium);

  color: var(--color-white);

  text-transform: capitalize;

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

@media (max-width:	1200px) {

  .list-hover1>li>a>span {

    font-size: var(--text-base);

    line-height: var(--tw-leading, var(--text-base--line-height));

  }

}

.list-hover1>li>a.active>span:after, .list-hover1>li>a:hover>span:after {

  right: auto;

  left: calc(var(--spacing) * 0);

  width: 100%;

}

.list-hover1.social-icon a:hover {

  color: var(--color-primary);

}

.form-check span:after {

  position: absolute;

  top: calc(1/2 * 100%);

  left: calc(1/2 * 100%);

  z-index: calc(var(--z-index-1) * -1);

  width: calc(var(--spacing) * 24);

  height: calc(var(--spacing) * 24);

  border-radius: calc(infinity * 1px);

  border-style: var(--tw-border-style);

  border-width: 1px;

  border-color: var(--color-secondary);

  background-color: transparent;

  opacity: 20%;

  --tw-duration: 500ms;

  transition-duration: 500ms;

  --tw-content: '';

  content: var(--tw-content);

}

.form-check span::after {

  transform: translate(-50%, -50%) scale(0);

}

.form-check .form-check-input:checked + span::after {

  transform: translate(-50%, -50%) scale(1);

}

.product-size .btn-check:checked + label {

  background-color: var(--color-secondary) !important;

  color: var(--color-white);

}

.shop-list .product-size .btn-check:checked + label {

  background-color: transparent !important;

  color: var(--color-black);

}

.bookmark-btn .form-check-input:checked + .form-check-label {

  background-color: var(--color-primary);

}

.form-check-input {

  margin: calc(var(--spacing) * 3);

  width: calc(var(--spacing) * 18);

  height: calc(var(--spacing) * 18);

  appearance: none;

  border-style: var(--tw-border-style);

  border-width: 2px;

  border-color: #D7D7D7;

  background-position: center;

  background-repeat: no-repeat;

  vertical-align: top;

}

.form-check-input {

  background-image: var(--tw-form-check-bg-image);

  background-size: contain;

}

.form-check-input {

  -webkit-appearance: none;

  -moz-appearance: none;

}

.form-check-input:checked[type="checkbox"] {

  --tw-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");

}

.form-check-input:checked {

  border-color: var(--color-primary);

  background-color: var(--color-primary);

}

.show-pass.active::after {

  opacity: 0%;

}

.dz-marquee.style-1 {

  position: relative;

  z-index: var(--z-index-1);

  padding: calc(var(--spacing) * 30);

}

.dz-marquee.style-1 .marquee-list {

  margin-bottom: calc(var(--spacing) * 0);

  display: flex;

  flex-wrap: nowrap;

  align-items: center;

  gap: calc(var(--spacing) * 80);

}

.dz-marquee.style-1 .marquee-list .item {

  position: relative;

  z-index: var(--z-index-1);

  margin: calc(var(--spacing) * 0);

  display: flex;

  align-items: center;

  justify-content: center;

  font-family: var(--font-display);

  font-size: 300px;

  --tw-font-weight: var(--font-weight-bold);

  font-weight: var(--font-weight-bold);

  color: var(--color-black);

  text-transform: capitalize;

}

.dz-marquee.style-1 .marquee-list .item .color {

  color: #f1f1f1;

}

.dz-marquee.style-1:after {

  position: absolute;

  top: calc(1/2 * 100%);

  left: calc(1/2 * 100%);

  z-index: calc(var(--z-index-1) * -1);

  width: calc(var(--spacing) * 650);

  height: calc(var(--spacing) * 650);

  transform: translate(-50%,-50%) scale(1);

  border-radius: calc(infinity * 1px);

  background-color: var(--color-primary);

  --tw-content: '';

  content: var(--tw-content);

}

@media (max-width: 1200px) {

  .dz-marquee.style-1:after {

    width: calc(var(--spacing) * 400);

    height: calc(var(--spacing) * 400);

    transform: translate(-50%,-50%) scale(1);

  }

}

@media (max-width: 768px) {

  .dz-marquee.style-1:after {

    width: calc(var(--spacing) * 300);

    height: calc(var(--spacing) * 300);

    transform: translate(-50%,-45%) scale(1);

  }

}

@media (max-width: 575px) {

  .dz-marquee.style-1:after {

    width: calc(var(--spacing) * 180);

    height: calc(var(--spacing) * 180);

    transform: translate(-50%,-35%) scale(1);

  }

}

.gsapanimate {

  position: relative;

  z-index: var(--z-index-1);

  margin-inline: auto;

  margin-block: calc(var(--spacing) * 0);

  display: gird;

  width: 100%;

  height: 100%;

  min-height: 150vh;

  grid-template-columns: repeat(20,3%);

  align-items: center;

  justify-content: center;

  object-fit: cover;

}

.gsapanimate .content__slide-item {

  position: relative;

  width: 100%;

  height: 100%;

}

.gsapanimate img:nth-child(1) {

  grid-area: 9/1/12/10;

}

.gsapanimate img:nth-child(2) {

  grid-area: 7/11/8/21;

}

.gsapanimate img:nth-child(3) {

  grid-area: 9/21/35/12;

}

.gsapanimate img:nth-child(4) {

  grid-area: 30/1/20/11;

}

.gsapanimate img:nth-child(5) {

  grid-area: 16/12/20/19;

}

.gsapanimate img:nth-child(6) {

  grid-area: 20/2/25/9;

}

.gsapanimate img:nth-child(7) {

  grid-area: 22/11/24/20;

}

.gsapanimate img:nth-child(8) {

  grid-area: 26/5/30/15;

}

.dz-meta li:not(:first-child):after {

  position: absolute;

  top: calc(1/2 * 100%);

  left: calc(var(--spacing) * -25);

  z-index: var(--z-index-1);

  width: calc(var(--spacing) * 7);

  height: calc(var(--spacing) * 7);

  --tw-translate-y: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  border-radius: calc(infinity * 1px);

  background-color: color-mix(in srgb, #000 40%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    background-color: color-mix(in oklab, var(--color-black) 40%, transparent);

  }

  --tw-content: '';

  content: var(--tw-content);

}

#Experience .dz-meta li:not(:first-child):after {

  background-color: color-mix(in srgb, #03454F 20%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    background-color: color-mix(in oklab, var(--color-textgreen) 20%, transparent);

  }

}

.cardafter:after {

  position: absolute;

  bottom: calc(var(--spacing) * -40);

  left: calc(1/2 * 100%);

  z-index: calc(var(--z-index-1) * -1);

  height: calc(var(--spacing) * 40);

  width: calc(var(--spacing) * 2);

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  background-color: var(--color-black);

  --tw-content: '';

  content: var(--tw-content);

}

.cardafter:before {

  position: absolute;

  bottom: calc(var(--spacing) * -50);

  left: 50%;

  z-index: var(--z-index-1);

  width: calc(var(--spacing) * 20);

  height: calc(var(--spacing) * 20);

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  border-radius: 50%;

  border-style: var(--tw-border-style);

  border-width: 2px;

  border-color: var(--color-secondary);

  background-color: var(--color-primary);

  --tw-content: '';

  content: var(--tw-content);

}

@media (max-width: 991px) {

  .cardafter:after {

    display: none;

  }

  .cardafter:before {

    display: none;

  }

}

.cardafter.bottom:after {

  top: calc(var(--spacing) * -40);

  bottom: auto;

}

.cardafter.bottom:before {

  top: calc(var(--spacing) * -50);

  bottom: auto;

}

.cardafter.bottom {

  margin-bottom: calc(var(--spacing) * 20);

  @media (width >= 576px) {

    margin-bottom: calc(var(--spacing) * 0);

  }

  @media (width >= 1200px) {

    margin-top: calc(var(--spacing) * 40);

  }

}

.text-char {

  position: absolute;

  top: calc(var(--spacing) * 0);

  left: calc(50% - 90px);

  display: block;

  width: calc(var(--spacing) * 180);

  height: calc(var(--spacing) * 180);

  transform-origin: center;

  rotate: var(--char-rotate);

  padding-top: calc(var(--spacing) * 8);

  text-align: center;

  font-family: var(--font-title);

  font-size: var(--text-base);

  line-height: var(--tw-leading, var(--text-base--line-height));

  --tw-font-weight: var(--font-weight-medium);

  font-weight: var(--font-weight-medium);

  text-transform: uppercase;

}

.word-rotate-box .text-char {

  width: calc(var(--spacing) * 180);

  height: calc(var(--spacing) * 180);

  font-family: var(--font-title);

  font-size: var(--text-sm);

  line-height: var(--tw-leading, var(--text-sm--line-height));

  --tw-font-weight: var(--font-weight-normal);

  font-weight: var(--font-weight-normal);

  color: var(--color-black);

}

.hero-banner .word-rotate-box .text-char {

  width: calc(var(--spacing) * 190);

  height: calc(var(--spacing) * 190);

}

@media (max-width: 1200px) {

  .word-rotate-box .text-char {

    left: calc(50% - 75px);

    width: calc(var(--spacing) * 150);

    height: calc(var(--spacing) * 150);

  }

}

.hero-banner.style-1 .item5 {

  position: absolute;

  right: calc(var(--spacing) * 0);

  bottom: calc(var(--spacing) * 532);

  z-index: 3;

}

.hero-banner.style-1 .item5 .popup-youtube {

  position: relative;

  z-index: var(--z-index-1);

}

.hero-banner.style-1 .item5 .counter {

  position: absolute;

  top: calc(1/2 * 100%);

  left: calc(1/2 * 100%);

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  --tw-translate-y: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  font-family: var(--font-title);

  font-size: 85px;

  --tw-font-weight: var(--font-weight-extrabold);

  font-weight: var(--font-weight-extrabold);

  color: #181D19;

  text-transform: uppercase;

}

.word-rotate-box {

  position: relative;

  z-index: 10;

  display: flex;

  width: calc(var(--spacing) * 180);

  height: calc(var(--spacing) * 180);

  align-items: center;

  justify-content: center;

  border-radius: calc(infinity * 1px);

  background-color: var(--color-primary);

  padding: calc(var(--spacing) * 15);

  text-align: center;

}

@media (max-width: 1200px) {

  .word-rotate-box {

    width: calc(var(--spacing) * 150);

    height: calc(var(--spacing) * 150);

  }

}

.top-gradient:after {

  position: absolute;

  top: calc(var(--spacing) * 0);

  right: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  z-index: calc(var(--z-index-1) * -1);

  height: calc(var(--spacing) * 458);

  width: 100%;

  --tw-content: '';

  content: var(--tw-content);

}

.tech-item {

  position: absolute;

  bottom: calc(var(--spacing) * 175);

  left: 47%;

  width: calc(var(--spacing) * 60);

  height: calc(var(--spacing) * 60);

  border-radius: calc(infinity * 1px);

}

.tech-item {

  --angle: calc(180deg / (var(--total) - 1));

  transform: rotate(calc(var(--angle) * var(--i))) translateX(0px) rotate(calc(90deg - var(--angle) * var(--i)));

  transition: transform 0.8s ease-in-out;

}

.scale-black {

  scale: 1.05;

  color: var(--color-black);

  --tw-duration: 0.2s;

  transition-duration: 0.2s;

}

.tech-item img {

  --tw-duration: 0.3s;

  transition-duration: 0.3s;

}

.tech-item img.zoomed {

  scale: 1.1;

}

#pointer-ring.title-active {

  width: calc(var(--spacing) * 136);

  height: calc(var(--spacing) * 136);

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  --tw-translate-y: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  border-radius: calc(infinity * 1px);

  border-color: var(--color-primary);

  background-color: var(--color-primary);

  mix-blend-mode: exclusion;

}

.pxl-heading-scroll-effect {

  --heading-color-1: rgba(0, 0, 0, 0.5);

}

.pxl-heading-scroll-effect .heading-text div {

  background-clip: text;

  color: transparent;

  background: linear-gradient(to right, var(--fxl-heading) 50%, var(--heading-color-1) 50%) no-repeat;

  -webkit-background-clip: text;

  background-clip: text;

  background-size: 200% 100%;

  background-position-x: 100%;

  transition: background-size cubic-bezier(0.1, 0.5, 0.5, 1) 0.75s;

}

.pxl-heading-scroll-effect .heading-text div {

  --fxl-heading: black;

}

.tech-wrapper.active .tech-item {

  transform: rotate(calc(var(--angle) * var(--i))) translateX(-470px) rotate(calc(90deg - var(--angle) * var(--i)));

}

.socialiconbox:hover {

  background-color: var(--color-socialbox);

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.socialiconbox:hover svg >path {

  stroke: var(--color-white);

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.widget-timeline .timeline:before {

  position: absolute;

  top: calc(var(--spacing) * 0);

  bottom: calc(var(--spacing) * -0);

  left: calc(var(--spacing) * 46);

  width: 2.04px;

  border-right-style: var(--tw-border-style);

  border-right-width: 2px;

  border-color: var(--color-orange);

  --tw-content: '';

  content: var(--tw-content);

}

@media (max-width: 575px) {

  .widget-timeline .timeline:before {

    display: none;

  }

}

.widget-timeline .timeline .timeline-box:after {

  position: relative;

  top: calc(var(--spacing) * -200);

  display: block;

  width: calc(var(--spacing) * 14);

  height: calc(var(--spacing) * 14);

  border-radius: calc(infinity * 1px);

  border-style: var(--tw-border-style);

  border-width: 3px;

  border-color: var(--color-orange);

  background-color: var(--color-white);

  --tw-content: '';

  content: var(--tw-content);

}

@media (max-width: 575px) {

  .widget-timeline .timeline .timeline-box:after {

    display: none;

  }

}

.workbox:after {

  visibility: hidden;

  position: absolute;

  top: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  z-index: var(--z-index-1);

  width: 100%;

  height: 100%;

  background-image: linear-gradient(180deg,rgba(255,120,54,0.4) 0%,#FF7836 100%);

  opacity: 0%;

  --tw-duration: 500ms;

  transition-duration: 500ms;

  --tw-content: '';

  content: var(--tw-content);

}

.workbox:hover:after {

  visibility: visible;

  opacity: 100%;

}

.plusicon {

  visibility: hidden;

  display: flex;

  width: calc(var(--spacing) * 50);

  height: calc(var(--spacing) * 50);

  cursor: pointer;

  align-items: center;

  justify-content: center;

  border-radius: calc(infinity * 1px);

  background-color: var(--color-orange);

  color: var(--color-white);

  opacity: 0%;

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

.workbox:hover .plusicon {

  visibility: visible;

  opacity: 100%;

}

.group:hover .plusicon:after {

  visibility: visible;

  scale: 1.8;

  opacity: 100%;

}

.group:hover .plusicon:before {

  visibility: visible;

  scale: 2.6;

  opacity: 100%;

}

.plusicon:after {

  visibility: hidden;

  position: absolute;

  top: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  z-index: calc(var(--z-index-1) * -1);

  width: 100%;

  height: 100%;

  border-radius: calc(infinity * 1px);

  border-style: var(--tw-border-style);

  border-width: 1px;

  border-color: color-mix(in srgb, #fff 50%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    border-color: color-mix(in oklab, var(--color-white) 50%, transparent);

  }

  opacity: 0%;

  --tw-duration: 300ms;

  transition-duration: 300ms;

  --tw-content: '';

  content: var(--tw-content);

}

.plusicon:before {

  visibility: hidden;

  position: absolute;

  top: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  z-index: calc(var(--z-index-1) * -1);

  width: 100%;

  height: 100%;

  border-radius: calc(infinity * 1px);

  border-style: var(--tw-border-style);

  border-width: 1px;

  border-color: color-mix(in srgb, #fff 20%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    border-color: color-mix(in oklab, var(--color-white) 20%, transparent);

  }

  opacity: 0%;

  --tw-duration: 300ms;

  transition-duration: 300ms;

  --tw-content: '';

  content: var(--tw-content);

}

.hero-banner3 .word-rotate-box .text-char {

  width: calc(var(--spacing) * 200) !important;

  height: calc(var(--spacing) * 200) !important;

}

.circle {

  position: relative;

  z-index: var(--z-index-1);

  margin-inline: auto;

  margin-top: calc(var(--spacing) * 10);

  display: inline-block;

  width: calc(var(--spacing) * 150);

  height: calc(var(--spacing) * 150);

  text-align: center;

}

.progressbar .circle canvas {

  rotate: -30deg;

}

.site-filters .filters li.active {

  --tw-font-weight: var(--font-weight-bold);

  font-weight: var(--font-weight-bold);

  color: var(--color-orange);

}

.site-filters .filters li.active:hover {

  position: relative;

  &:hover {

    @media (hover: hover) {

      &::after {

        content: var(--tw-content);

        right: auto;

      }

    }

  }

  &:hover {

    @media (hover: hover) {

      &::after {

        content: var(--tw-content);

        left: calc(var(--spacing) * 0);

      }

    }

  }

  &:hover {

    @media (hover: hover) {

      &::after {

        content: var(--tw-content);

        width: 100%;

      }

    }

  }

}

.site-filters .filters li:after {

  position: absolute;

  right: calc(var(--spacing) * 0);

  bottom: calc(var(--spacing) * 0);

  height: calc(var(--spacing) * 1);

  width: calc(var(--spacing) * 0);

  background-color: var(--color-orange);

  --tw-duration: 500ms;

  transition-duration: 500ms;

  --tw-content: '';

  content: var(--tw-content);

}

.side-menu a.active {

  background-color: var(--color-orange);

}

.side-menu a.active svg path {

  stroke: var(--color-white);

}

.sidebar-right a.active {

  background-color: var(--color-white);

}

.sticky-header.is-fixed a.active svg path {

  stroke: var(--color-white);

}

.sticky-header.is-fixed a.active span {

  color: var(--color-white);

}

.sticky-header.is-fixed .active {

  background-color: var(--color-green);

}

.lg-backdrop {

  z-index: var(--z-index-9999);

}

.lg-outer {

  z-index: var(--z-index-99999);

}

.header-2.sidebar {

  position: fixed;

  top: calc(var(--spacing) * 0);

  right: calc(var(--spacing) * -381);

  z-index: 99;

  height: 100%;

  width: calc(var(--spacing) * 380);

  background-color: var(--color-white);

  padding-inline: calc(var(--spacing) * 20);

  padding-block: calc(var(--spacing) * 30);

  --tw-shadow: 0px 0px 5px var(--tw-shadow-color, rgba(0,0,0,0.1));

  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

  --tw-duration: 500ms;

  transition-duration: 500ms;

}

@media (max-width: 575px) {

  .header-2.sidebar {

    width: calc(var(--spacing) * 360);

  }

}

.header-2.sidebar.show {

  right: calc(var(--spacing) * 0);

}

.pxl-history-carousel.layout-1 {

  position: relative;

  -webkit-user-select: none;

  user-select: none;

}

.pxl-history-carousel.layout-1 .content-item {

  text-align: center;

}

.pxl-history-carousel.layout-1 .item-title {

  margin-bottom: calc(var(--spacing) * 12);

  font-size: var(--text-2\.5xl);

  --tw-font-weight: var(--font-weight-semibold);

  font-weight: var(--font-weight-semibold);

}

@media (max-width: 575px) {

  .pxl-history-carousel.layout-1 .item-title {

    font-size: var(--text-2xl);

    line-height: var(--tw-leading, var(--text-2xl--line-height));

  }

}

.pxl-history-carousel.layout-1 .item-des,.pxl-history-carousel.layout-1 .item-des > * {

  margin-inline: auto;

  overflow: hidden;

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 6;

  max-width: calc(var(--spacing) * 378);

  overflow: hidden;

  font-size: var(--text-lg);

  line-height: var(--tw-leading, var(--text-lg--line-height));

  --tw-leading: calc(var(--spacing) * 24);

  line-height: calc(var(--spacing) * 24);

  --tw-font-weight: var(--font-weight-normal);

  font-weight: var(--font-weight-normal);

  text-overflow: ellipsis;

}

@media (max-width: 575px) {

  .pxl-history-carousel.layout-1 .item-des {

    max-width: calc(var(--spacing) * 330);

    font-size: var(--text-base);

    line-height: var(--tw-leading, var(--text-base--line-height));

    --tw-leading: calc(var(--spacing) * 22);

    line-height: calc(var(--spacing) * 22);

  }

}

.pxl-history-carousel.layout-1 .pxl-button-more {

  margin-top: calc(var(--spacing) * 52);

}

@media (max-width: 575px) {

  .pxl-history-carousel.layout-1 .pxl-button-more {

    margin-top: calc(var(--spacing) * 35);

  }

}

.pxl-history-carousel.layout-1 .pxl-button-more .pxl-icon {

  display: flex;

  overflow: hidden;

}

.pxl-history-carousel.layout-1 .pxl-button-more .btn-primary {

  gap: calc(var(--spacing) * 5);

}

.pxl-history-carousel.layout-1 .pxl-button-more .btn-primary:hover i {

  animation: toTopFromBottom 0.4s forwards;

}

.pxl-history-carousel.layout-1 .item-inner {

  display: flex;

  flex-direction: column;

  align-items: center;

}

.pxl-history-carousel.layout-1 .pxl-swiper-container {

  padding-inline: calc(var(--spacing) * 24);

  padding-block: calc(var(--spacing) * 35);

}

.pxl-history-carousel.layout-1 .item-slide {

  position: absolute;

  top: 64.5%;

  left: calc(1/2 * 100%);

  display: flex;

  height: auto;

  width: calc(var(--spacing) * 460);

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  --tw-translate-y: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);

  align-items: center;

  justify-content: center;

  overflow: hidden;

  padding: calc(var(--spacing) * 0);

  transition-property: width,height;

  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));

  transition-duration: var(--tw-duration, var(--default-transition-duration));

  --tw-duration: 1000ms;

  transition-duration: 1000ms;

}

.pxl-swiper-wrapper {

  position: relative;

  z-index: var(--z-index-1);

  box-sizing: content-box;

  display: flex;

  width: 100%;

  height: 100%;

  --tw-duration: 400ms;

  transition-duration: 400ms;

}

.align-items-center {

  align-items: center;

}

.elementor *, .elementor :after, .elementor :before {

  box-sizing: border-box;

}

.pxl-history-carousel.layout-1 .pxl-swiper-wrapper {

  position: relative;

  top: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  z-index: var(--z-index-2);

  margin-bottom: calc(var(--spacing) * -927);

  height: calc(var(--spacing) * 1580);

  overflow: visible;

}

@media (max-width: 1199px) {

  .pxl-history-carousel.layout-1 .pxl-swiper-wrapper {

    margin-bottom: calc(var(--spacing) * -966);

  }

}

@media (max-width: 991px) {

  .pxl-history-carousel.layout-1 .pxl-swiper-wrapper {

    margin-bottom: calc(var(--spacing) * -986);

  }

}

@media (max-width: 767px) {

  .pxl-history-carousel.layout-1 .pxl-swiper-wrapper {

    margin-bottom: calc(var(--spacing) * -1050);

    height: calc(var(--spacing) * 1500);

  }

  .pxl-history-carousel.layout-1 .pxl-swiper-wrapper .item-slide:nth-child(even) .item-image {

    opacity: 0 !important;

    transition: all 300ms ease-in-out 0s;

  }

}

.pxl-history-carousel.layout-1 .box-pev-next {

  position: absolute;

  bottom: calc(var(--spacing) * 146);

  left: calc(1/2 * 100%);

  z-index: 10;

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);

  text-align: center;

}

@media (max-width: 767px) {

  .pxl-history-carousel.layout-1 .box-pev-next {

    bottom: calc(var(--spacing) * 0);

  }

}

.pxl-history-carousel.layout-1 .box-pev-next .text-pev-next {

  position: relative;

  display: inline-block;

  border-radius: var(--radius);

  background-color: var(--color-white);

  padding-inline: calc(var(--spacing) * 6);

  font-size: var(--text-xs);

  line-height: var(--tw-leading, var(--text-xs--line-height));

  --tw-leading: 2;

  line-height: 2;

  --tw-font-weight: var(--font-weight-medium);

  font-weight: var(--font-weight-medium);

  text-transform: uppercase;

}

.pxl-history-carousel.layout-1 .box-pev-next .text-pev-next::after {

  position: absolute;

  top: calc(1/2 * 100%);

  left: calc(1/2 * 100%);

  z-index: calc(var(--z-index-1) * -1);

  height: 1px;

  width: calc(var(--spacing) * 158);

  transform: translate(-50%,0);

  --tw-content: '';

  content: var(--tw-content);

}

.pxl-history-carousel.layout-1 .box-pev-next .text-pev-next::after {

  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50.5%, rgba(255, 255, 255, 0) 100%);

}

.pxl-history-carousel.layout-1 .pxl-swiper-dots {

  margin-top: calc(var(--spacing) * 20);

  display: flex;

  justify-content: center;

}

.pxl-history-carousel.layout-1 .thumb-item {

  width: auto;

  --tw-scale-x: 100%;

  --tw-scale-y: 100%;

  --tw-scale-z: 100%;

  scale: var(--tw-scale-x) var(--tw-scale-y);

  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);

  opacity: 60%;

}

.pxl-history-carousel.layout-1 .thumb-item .item-year {

  font-size: var(--text-lg);

  line-height: var(--tw-leading, var(--text-lg--line-height));

  --tw-leading: calc(var(--spacing) * 30);

  line-height: calc(var(--spacing) * 30);

  color: color-mix(in srgb, #000 60%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    color: color-mix(in oklab, var(--color-black) 60%, transparent);

  }

}

@media (max-width: 575px) {

  .pxl-history-carousel.layout-1 .thumb-item .item-year {

    font-size: var(--text-base);

    line-height: var(--tw-leading, var(--text-base--line-height));

  }

}

.pxl-history-carousel.layout-1 .thumb-item.active {

  --tw-scale-x: 100%;

  --tw-scale-y: 100%;

  --tw-scale-z: 100%;

  scale: var(--tw-scale-x) var(--tw-scale-y);

  opacity: 100%;

}

.pxl-history-carousel.layout-1 .thumb-item.active .item-year {

  font-size: var(--text-2\.5xl);

  color: var(--color-secondary);

}

@media (max-width: 575px) {

  .pxl-history-carousel.layout-1 .thumb-item.active .item-year {

    font-size: var(--text-2xl);

    line-height: var(--tw-leading, var(--text-2xl--line-height));

  }

}

.pxl-history-carousel.layout-1 .pxl-thumbs-wrapper {

  gap: calc(var(--spacing) * 25);

}

.pxl-history-carousel.layout-1 .pxl-swiper-thumbs {

  max-width: calc(var(--spacing) * 210);

}

.pxl-history-carousel.layout-1 .pxl-swiper-slider-thumbs {

  margin-top: calc(var(--spacing) * 14);

}

.pxl-history-carousel.layout-1 .pxl-carousel-inner {

  padding-top: calc(var(--spacing) * 78);

}

@media (max-width: 991px) {

  .pxl-history-carousel.layout-1 .pxl-carousel-inner {

    padding-top: calc(var(--spacing) * 30);

  }

}

@media (max-width: 575px) {

  .pxl-history-carousel.layout-1 .pxl-carousel-inner {

    padding-top: calc(var(--spacing) * 0);

  }

}

.pxl-team-list .project::before, .pxl-team-list .project::after {

  pointer-events: none;

  position: absolute;

  left: calc(1/2 * 100%);

  z-index: var(--z-index-1);

  display: none;

  height: calc(var(--spacing) * 0);

  width: 100%;

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  background-repeat: no-repeat;

  --tw-content: '';

  content: var(--tw-content);

  @media (width >= 576px) {

    display: block;

  }

  transition: height 0.35s cubic-bezier(0.785, 0.135, 0.15, 0.86);

}

.pxl-team-list .project::before {

  bottom: calc(1/2 * 100%);

  background-color: var(--color-primary);

}

.pxl-team-list .project::after {

  top: calc(1/2 * 100%);

  background-color: var(--color-primary);

}

.pxl-team-list .project:hover::before, .pxl-team-list .project:hover::after {

  height: 51%;

  @media (width >= 576px) {

    height: calc(1/2 * 100%);

  }

}

.project .project-title h3 {

  color: var(--color-secondary);

}

.project .project-title .post {

  color: color-mix(in srgb, #000 70%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    color: color-mix(in oklab, var(--color-black) 70%, transparent);

  }

}

.project:hover .project-title h3 {

  @media (width >= 576px) {

    color: var(--color-black);

  }

}

.project:hover .project-title .post {

  @media (width >= 576px) {

    color: color-mix(in srgb, #000 70%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      color: color-mix(in oklab, var(--color-black) 70%, transparent);

    }

  }

}

.project .project-categ a {

  color: color-mix(in srgb, #000 70%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    color: color-mix(in oklab, var(--color-black) 70%, transparent);

  }

}

.project:hover .project-categ a {

  @media (width >= 576px) {

    color: var(--color-secondary);

  }

}

.tab-title.tab-underline.active a::after , .tab-title.tab-underline.active button::after {

  width: 100%;

}

.tab-title.tab-underline.active a {

  color: var(--color-black);

}

.tab-content {

  display: none;

}

.tab-content.active {

  display: block;

}

.shop-tab .tab-title.active {

  background-color: var(--color-primary);

}

.custom-accordion.style-1 .accordion-item {

  margin-bottom: calc(var(--spacing) * 20);

  cursor: pointer;

}

.custom-accordion.style-1 .accordion-item .accordion-header {

  display: flex;

  width: 100%;

  cursor: pointer !important;

  align-items: center;

  justify-content: space-between;

  border-radius: var(--radius);

  padding-inline: calc(var(--spacing) * 15);

  padding-block: calc(var(--spacing) * 20);

  text-align: start;

  color: var(--color-bodyfg);

  --tw-duration: 300ms;

  transition-duration: 300ms;

  @media (width >= 576px) {

    padding-inline: calc(var(--spacing) * 35);

  }

}

.custom-accordion.style-1 .accordion-item .accordion-header.open {

  background-color: var(--color-primary);

  color: var(--color-secondary);

}

.custom-accordion.style-1 .accordion-item .accordion-header .arrow {

  width: calc(var(--spacing) * 30);

  height: calc(var(--spacing) * 30);

  min-width: calc(var(--spacing) * 30);

  border-radius: calc(infinity * 1px);

  background-color: var(--color-primary);

  text-align: center;

  --tw-leading: calc(var(--spacing) * 30);

  line-height: calc(var(--spacing) * 30);

  color: var(--color-secondary);

  --tw-duration: 300ms;

  transition-duration: 300ms;

}

.custom-accordion.style-1 .accordion-item .accordion-header.open .arrow {

  background-color: var(--color-secondary);

  color: var(--color-bodyfg);

}

.custom-accordion.style-1 .accordion-item .accordion-header.open .arrow.active i {

  rotate: 180deg;

}

.custom-accordion.style-1 .accordion-item .accordion-content .content-inner {

  padding-inline: calc(var(--spacing) * 15);

  padding-block: calc(var(--spacing) * 14);

  font-family: var(--font-display);

  font-size: var(--text-base);

  line-height: var(--tw-leading, var(--text-base--line-height));

  color: var(--color-bodytext);

  @media (width >= 576px) {

    padding-inline: calc(var(--spacing) * 35);

  }

  @media (width >= 1200px) {

    font-size: var(--text-xl);

    line-height: var(--tw-leading, var(--text-xl--line-height));

  }

}

.custom-accordion.style-2 .accordion-item .accordion-header {

  display: flex;

  width: 100%;

  cursor: pointer;

  align-items: center;

  justify-content: space-between;

  border-bottom-style: var(--tw-border-style);

  border-bottom-width: 1px;

  border-color: color-mix(in srgb, #000 10%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    border-color: color-mix(in oklab, var(--color-black) 10%, transparent);

  }

  padding-block: calc(var(--spacing) * 20);

  text-align: start;

  color: var(--color-secondary);

  --tw-duration: 300ms;

  transition-duration: 300ms;

}

.custom-accordion.style-2 .accordion-item .accordion-content .content-inner {

  border-bottom-style: var(--tw-border-style);

  border-bottom-width: 1px;

  border-color: color-mix(in srgb, #000 10%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    border-color: color-mix(in oklab, var(--color-black) 10%, transparent);

  }

  padding-block: calc(var(--spacing) * 26);

  font-family: var(--font-display);

  font-size: var(--text-base);

  line-height: var(--tw-leading, var(--text-base--line-height));

  --tw-font-weight: var(--font-weight-light);

  font-weight: var(--font-weight-light);

  color: var(--color-bodytext);

  @media (width >= 1200px) {

    font-size: var(--text-2xl);

    line-height: var(--tw-leading, var(--text-2xl--line-height));

  }

}

.custom-accordion.style-2 .accordion-item .accordion-header .arrow {

  width: calc(var(--spacing) * 30);

  height: calc(var(--spacing) * 30);

}

.custom-accordion.style-2 .accordion-item .accordion-header .arrow .fa-plus {

  display: block;

  font-size: var(--text-xl);

  line-height: var(--tw-leading, var(--text-xl--line-height));

  color: color-mix(in srgb, #000 60%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    color: color-mix(in oklab, var(--color-black) 60%, transparent);

  }

  @media (width >= 576px) {

    font-size: var(--text-2xl);

    line-height: var(--tw-leading, var(--text-2xl--line-height));

  }

}

.custom-accordion.style-2 .accordion-item .accordion-header .arrow .fa-minus {

  display: none;

  font-size: var(--text-2xl);

  line-height: var(--tw-leading, var(--text-2xl--line-height));

}

.custom-accordion.style-2 .accordion-item .accordion-header.open .arrow.active .fa-minus {

  display: block;

}

.custom-accordion.style-2 .accordion-item .accordion-header.open .arrow.active .fa-plus {

  display: none;

}

.accordion-content {

  max-height: 0;

  overflow: hidden;

  transition: max-height 0.3s ease;

}

.arrow.rotate {

  transform: rotate(90deg);

  transition: transform 0.3s ease;

}

.gl-star-rating--stars span {

  --gl-star-size: 20px;

}

.clip-right-animation {

  animation-name: clipRightIn;

  animation-timing-function: cubic-bezier(0,0.57,0.55,1);

}

.clip-left-animation {

  animation-name: clipLeftIn;

  animation-timing-function: cubic-bezier(0,0.57,0.55,1);

}

.dlab-img-overlay1:before {

  position: absolute;

  top: calc(var(--spacing) * 0);

  left: calc(var(--spacing) * 0);

  z-index: var(--z-index-1);

  width: 100%;

  height: 100%;

  border-radius: var(--radius-2lg);

  background-color: var(--color-black);

  opacity: 0%;

  --tw-duration: 0.3s;

  transition-duration: 0.3s;

  --tw-content: '';

  content: var(--tw-content);

}

.dlab-img-overlay1:hover:before {

  opacity: 20%;

}

.grid-wrapper > div {

  display: flex;

  align-items: center;

  justify-content: center;

}

.custom-select {

  position: relative;

}

.custom-select.right .select-items {

  right: auto;

  left: calc(var(--spacing) * 0);

}

.select-selected {

  position: relative;

  display: flex;

  cursor: pointer;

  align-items: center;

  padding-block: calc(var(--spacing) * 2);

  padding-right: calc(var(--spacing) * 35);

  padding-left: calc(var(--spacing) * 15);

  font-size: var(--text-sm);

  line-height: var(--tw-leading, var(--text-sm--line-height));

  -webkit-user-select: none;

  user-select: none;

}

.select-selected {

  color: var(--color-black);

}

.select-selected span {

  display: none;

}

.select-selected:after {

  border-top-style: var(--tw-border-style);

  border-top-width: 1px;

  border-right-style: var(--tw-border-style);

  border-right-width: 1px;

  border-color: var(--color-black);

}

.select-selected:after {

  position: absolute;

  right: calc(var(--spacing) * 15);

  margin-top: calc(var(--spacing) * -4);

  width: calc(var(--spacing) * 8);

  height: calc(var(--spacing) * 8);

  rotate: 135deg;

  --tw-duration: .3s;

  transition-duration: .3s;

  --tw-content: '';

  content: var(--tw-content);

}

.select-selected.select-active:after {

  margin-top: calc(var(--spacing) * 4);

  rotate: -45deg;

}

.select-items {

  background-color: var(--color-white);

  color: var(--color-black);

}

.select-items {

  visibility: visible;

  position: absolute;

  right: calc(var(--spacing) * 0);

  z-index: 99;

  display: block;

  max-height: calc(var(--spacing) * 320);

  width: calc(var(--spacing) * 200);

  --tw-translate-y: calc(var(--spacing) * 0);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  overflow-y: auto;

  padding-inline: calc(var(--spacing) * 0);

  padding-block: calc(var(--spacing) * 10);

  opacity: 100%;

  --tw-shadow-color: rgba(17,12,46,0.15);

  @supports (color: color-mix(in lab, red, red)) {

    --tw-shadow-color: color-mix(in oklab, rgba(17,12,46,0.15) 0px 48px 100px 0px var(--tw-shadow-alpha), transparent);

  }

  --tw-duration: .3s;

  transition-duration: .3s;

  scrollbar-width: thin;

}

.select-item {

  cursor: pointer;

  padding-inline: calc(var(--spacing) * 20);

  padding-block: calc(var(--spacing) * 5);

  font-size: var(--text-sm);

  line-height: var(--tw-leading, var(--text-sm--line-height));

  -webkit-user-select: none;

  user-select: none;

}

.select-item.active {

  background-color: var(--color-primary);

  color: var(--color-black);

}

.select-item:hover {

  background-color: var(--color-primary);

  color: var(--color-black);

}

.select-items.select-hide {

  display: none;

  --tw-translate-y: 15px;

  translate: var(--tw-translate-x) var(--tw-translate-y);

  opacity: 0%;

}

.lang-select .custom-select .select-selected {

  padding: calc(var(--spacing) * 0);

  padding-right: calc(var(--spacing) * 41);

  font-size: var(--text-lg);

  line-height: var(--tw-leading, var(--text-lg--line-height));

  --tw-font-weight: var(--font-weight-semibold);

  font-weight: var(--font-weight-semibold);

  color: var(--color-secondary);

  text-transform: capitalize;

  @media (width < 992px) {

    display: none;

  }

}

.header-white .lang-select .custom-select .select-selected {

  color: var(--color-white);

}

.header-white .nobox .lang-select .custom-select .select-selected {

  color: var(--color-secondary);

}

.lang-select .custom-select .select-selected:after {

  right: calc(var(--spacing) * 25);

}

.header-white .select-selected:after {

  border-color: var(--color-white);

}

.header-white .nobox .select-selected:after {

  border-color: var(--color-secondary);

}

.lang-select .custom-select .select-item:hover , .lang-select .custom-select .select-item.active {

  background-color: #bfebe57d;

}

.noUi-horizontal {

  height: calc(var(--spacing) * 4) !important;

}

.noUi-connect {

  background-color: var(--color-secondary) !important;

}

.noUi-target {

  border-radius: 0 !important;

  border-style: var(--tw-border-style) !important;

  border-width: 0px !important;

  background-color: color-mix(in srgb, #000 15%, transparent) !important;

  @supports (color: color-mix(in lab, red, red)) {

    background-color: color-mix(in oklab, var(--color-black) 15%, transparent) !important;

  }

  --tw-shadow: 0 0 #0000 !important;

  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;

}

.noUi-horizontal .noUi-handle {

  width: calc(var(--spacing) * 9) !important;

  height: calc(var(--spacing) * 9) !important;

  border-radius: 1px !important;

  border-style: var(--tw-border-style) !important;

  border-width: 0px !important;

  outline-style: var(--tw-outline-style);

  outline-width: 3px;

  outline-color: var(--color-black);

  &::before {

    content: var(--tw-content);

    display: none;

  }

  &::after {

    content: var(--tw-content);

    display: none;

  }

}

.noUi-touch-area {

  background-color: var(--color-white);

}

.noUi-tooltip {

  display: none;

}

.noUi-horizontal .noUi-handle {

  top: calc(var(--spacing) * -3);

  right: calc(var(--spacing) * -9);

}

@layer components {

  .main-bar {

    position: relative;

    width: 100%;

    padding-inline: calc(var(--spacing) * 80);

    padding-block: calc(var(--spacing) * 20);

    --tw-duration: 0.5s;

    transition-duration: 0.5s;

  }

  @media (max-width: 1400px) {

    .main-bar {

      padding-inline: calc(var(--spacing) * 20);

    }

  }

  .is-fixed:not(.sticky-no) .main-bar {

    position: fixed;

    top: calc(var(--spacing) * 0);

    left: calc(var(--spacing) * 0);

    background-color: var(--color-white);

    padding-block: calc(var(--spacing) * 10);

    --tw-shadow: 0 0 50px 0 var(--tw-shadow-color, rgba(0,0,0,.1));

    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

    --tw-duration: 0.5s;

    transition-duration: 0.5s;

  }

  .header-white.is-fixed:not(.sticky-no) .main-bar {

    background-color: var(--color-black);

  }

  .header-3.is-fixed .lang-select .custom-select .select-selected {

    color: var(--color-white) !important;

  }

  .header-3.is-fixed .lang-select .custom-select .select-selected:after {

    border-color: var(--color-white) !important;

  }

  .header-3.is-fixed .nobox .text-color {

    color: var(--color-white) !important;

  }

  .full-sidenav {

    pointer-events: none;

    position: fixed;

    top: calc(var(--spacing) * 0);

    left: -100%;

    z-index: 99;

    display: flex;

    height: 100vh;

    width: 100%;

    overflow-y: scroll;

    background-color: var(--color-bodyfg);

    --tw-duration: 500ms;

    transition-duration: 500ms;

    --tw-duration: 700ms;

    transition-duration: 700ms;

  }

  @media (min-width: 992px) {

    .full-sidenav.show {

      visibility: visible;

      display: flex;

      width: 100%;

      align-items: center;

      overflow: hidden;

      opacity: 100%;

    }

  }

  .full-sidenav.show {

    pointer-events: auto;

    left: calc(var(--spacing) * 0);

  }

  .flsbg {

    position: absolute;

    top: calc(var(--spacing) * 0);

    left: calc(var(--spacing) * 0);

    z-index: calc(10 * -1);

    display: none;

    height: 100%;

    width: 100%;

    @media (width >= 992px) {

      display: flex;

    }

  }

  .flsbg .bg-wrap {

    pointer-events: none;

    position: relative;

    margin: -1px;

    box-sizing: content-box;

    display: block;

    width: 11%;

    --tw-translate-y: -100%;

    translate: var(--tw-translate-x) var(--tw-translate-y);

    overflow: hidden;

    border-style: var(--tw-border-style);

    border-width: 1px;

    border-color: color-mix(in srgb, #000 5%, transparent);

    @supports (color: color-mix(in lab, red, red)) {

      border-color: color-mix(in oklab, var(--color-black) 5%, transparent);

    }

    background-color: var(--color-white);

    @media (prefers-color-scheme: dark) {

      border-color: color-mix(in srgb, #fff 5%, transparent);

      @supports (color: color-mix(in lab, red, red)) {

        border-color: color-mix(in oklab, var(--color-white) 5%, transparent);

      }

    }

    @media (prefers-color-scheme: dark) {

      background-color: #0C0C0B;

    }

  }

  .flsbg .bg-wrap:nth-child(1) {

    transition: 0.1s;

  }

  .flsbg .bg-wrap:nth-child(2) {

    transition: 0.2s;

  }

  .flsbg .bg-wrap:nth-child(3) {

    transition: 0.3s;

  }

  .flsbg .bg-wrap:nth-child(4) {

    transition: 0.4s;

  }

  .flsbg .bg-wrap:nth-child(5) {

    transition: 0.5s;

  }

  .flsbg .bg-wrap:nth-child(6) {

    transition: 0.6s;

  }

  .flsbg .bg-wrap:nth-child(7) {

    transition: 0.7s;

  }

  .flsbg .bg-wrap:nth-child(8) {

    transition: 0.8s;

  }

  .flsbg .bg-wrap:nth-child(9) {

    transition: 0.9s;

  }

  .flsbg .bg-wrap:nth-child(10) {

    transition: 1s;

  }

  .flsbg .bg-wrap:nth-child(11) {

    transition: 1.1s;

  }

  .full-sidenav.show .flsbg .bg-wrap {

    --tw-translate-y: calc(var(--spacing) * 0);

    translate: var(--tw-translate-x) var(--tw-translate-y);

  }

  .flsbg .bg-wrap span {

    position: absolute;

    top: calc(var(--spacing) * 0);

    left: calc(var(--spacing) * 0);

    height: 100%;

    width: 100%;

  }

  .site-header .nav > li > a {

    position: relative;

    display: block;

    width: 100%;

    padding-inline: calc(var(--spacing) * 10);

    font-family: var(--font-display);

    font-size: var(--text-2xl);

    line-height: calc(var(--spacing) * 35);

    --tw-font-weight: var(--font-weight-bold);

    font-weight: var(--font-weight-bold);

    color: var(--color-black);

  }

  @media (min-width: 992px) {

    .site-header .nav > li > a {

      font-size: 39px;

      line-height: 50px;

    }

  }

  @media (min-width: 992px) {

    .site-header .nav > li > a {

      padding-inline: calc(var(--spacing) * 0);

    }

  }

  @media (max-width: 576px) {

    .site-header .nav > li > a {

      padding-inline: calc(var(--spacing) * 20);

    }

  }

  @media (min-width: 992px) {

    .site-header .nav .sub-menu-down > a:after {

      font-size: var(--text-2xl);

      line-height: 35px;

    }

  }

  @media (min-width: 992px) {

    .site-header .nav .sub-menu-down > a:after {

      right: calc(var(--spacing) * 0);

    }

  }

  .site-header .nav .sub-menu-down > a:after {

    position: absolute;

    top: calc(1/2 * 100%);

    right: calc(var(--spacing) * 20);

    --tw-translate-y: calc(calc(1/2 * 100%) * -1);

    translate: var(--tw-translate-x) var(--tw-translate-y);

    font-family: 'Line Awesome Free';

    font-size: var(--text-lg);

    line-height: var(--tw-leading, var(--text-lg--line-height));

    --tw-font-weight: var(--font-weight-black);

    font-weight: var(--font-weight-black);

    opacity: 50%;

    --tw-content: '\f107';

    content: var(--tw-content);

    @media (width >= 992px) {

      right: calc(var(--spacing) * 0);

    }

    @media (width >= 992px) {

      font-size: var(--text-2xl);

      line-height: var(--tw-leading, var(--text-2xl--line-height));

    }

  }

  .full-sidenav.header-nav .nav > li .sub-menu {

    opacity: 100%;

  }

  @media (min-width: 992px) {

    .full-sidenav .navbar-nav > li .sub-menu {

      visibility: visible;

      position: relative;

      margin: calc(var(--spacing) * 0);

      display: block;

      width: 100%;

      opacity: 100%;

      --tw-shadow: 0 0 #0000;

      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

      --tw-duration: 500ms;

      transition-duration: 500ms;

    }

  }

  .sub-menu, .mega-menu {

    max-height: calc(var(--spacing) * 0);

    overflow: hidden;

    transition: max-height 0.3s ease;

  }

  @media (min-width: 992px) {

    .full-sidenav .navbar-nav > li .sub-menu li a {

      padding-inline: calc(var(--spacing) * 20);

    }

  }

  @media (max-width: 576px) {

    .full-sidenav .navbar-nav > li .sub-menu li a {

      padding-inline: calc(var(--spacing) * 40);

    }

  }

  .full-sidenav .navbar-nav > li .sub-menu li a {

    display: block;

    padding-inline: calc(var(--spacing) * 20);

    padding-block: calc(var(--spacing) * 5);

    font-family: var(--font-display);

    font-size: var(--text-lg);

    line-height: 28px;

    color: var(--color-black);

  }

  .site-header .nav > li > a:hover {

    color: var(--color-primary);

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  .full-sidenav .navbar-nav > li .sub-menu li a:hover {

    color: var(--color-primary);

    --tw-duration: 500ms;

    transition-duration: 500ms;

  }

  @media (min-width: 992px) {

    .full-sidenav {

      visibility: hidden;

      left: calc(var(--spacing) * 0);

      width: 100%;

      overflow: hidden;

      opacity: 0%;

    }

  }

  body.menu-btn-open {

    height: 100vh !important;

    overflow: hidden;

  }

  .select-items {

    width: calc(var(--spacing) * 60) !important;

  }

}

.tooltip-arrow:before {

  position: absolute;

  top: auto;

  right: calc(1/2 * 100%);

  bottom: calc(var(--spacing) * -14);

  z-index: 10;

  margin-bottom: calc(var(--spacing) * 0);

  --tw-translate-x: calc(1/2 * 100%);

  translate: var(--tw-translate-x) var(--tw-translate-y);

  border-style: var(--tw-border-style);

  border-width: 7px;

  border-color: transparent;

  border-top-color: var(--color-card-light);

  --tw-content: '';

  content: var(--tw-content);

  background: 0 0;

}

.group:hover .tooltip-arrow::before {

  border-top-color: var(--color-primary);

}

.ct:hover .content {

  opacity: 100%;

}

.service-card {

  position: relative;

  width: 100%;

  overflow: hidden;

  --tw-duration: 500ms;

  transition-duration: 500ms;

  @media (width >= 992px) {

    width: 37.8%;

  }

}

.service-card.active {

  @media (width >= 992px) {

    width: 62.2%;

  }

}

.service-card.active .service-img::after {

  opacity: 60%;

}

.service-card.active .content {

  left: calc(1/2 * 100%);

  --tw-translate-x: calc(calc(1/2 * 100%) * -1);

  translate: var(--tw-translate-x) var(--tw-translate-y);

}

.service-card.active .service-text {

  left: -20%;

  --tw-translate-x: -100%;

  translate: var(--tw-translate-x) var(--tw-translate-y);

}

.pricing-wrapper {

  &::after {

    content: var(--tw-content);

    position: absolute;

  }

  &::after {

    content: var(--tw-content);

    top: calc(var(--spacing) * 0);

  }

  &::after {

    content: var(--tw-content);

    right: calc(var(--spacing) * 0);

  }

  &::after {

    content: var(--tw-content);

    z-index: calc(var(--z-index-1) * -1);

  }

  &::after {

    content: var(--tw-content);

    width: 100%;

    height: 100%;

  }

  &::after {

    content: var(--tw-content);

    background-image: url('../images/background/bg4.png');

  }

  &::after {

    content: var(--tw-content);

    background-position: right;

  }

  &::after {

    content: var(--tw-content);

    background-repeat: no-repeat;

  }

  &::after {

    content: var(--tw-content);

    opacity: 0%;

  }

  &::after {

    content: var(--tw-content);

    --tw-duration: 300ms;

    transition-duration: 300ms;

  }

  &::after {

    content: var(--tw-content);

    --tw-content: '';

    content: var(--tw-content);

  }

}

.pricing-wrapper.active {

  background-color: var(--color-primary);

  --tw-duration: 300ms;

  transition-duration: 300ms;

  &::after {

    content: var(--tw-content);

    opacity: 100%;

  }

}

.pricing-wrapper.active .badge {

  display: inline-block;

}

.pricing-wrapper.active .title, .pricing-wrapper.active .title span {

  color: var(--color-secondary);

}

.pricing-wrapper.active p, .pricing-wrapper.active h4 {

  color: var(--color-secondary);

}

.pricing-wrapper.active .list-items li {

  color: var(--color-secondary);

}

.pricing-wrapper.active .list-items li::before {

  background-color: color-mix(in srgb, #000 10%, transparent);

  @supports (color: color-mix(in lab, red, red)) {

    background-color: color-mix(in oklab, var(--color-black) 10%, transparent);

  }

  background-image: none;

  color: var(--color-secondary);

}

.pricing-wrapper.active .btn {

  background-color: var(--color-secondary);

  background-image: none;

  color: var(--color-white);

}

.product-gallery-swiper .swiper-slide.swiper-slide-thumb-active img {

  border-color: var(--color-black);

}

.pxl-loader {

  background: white;

  height: 100vh;

  position: fixed;

  width: 100%;

  z-index: 999999;

  top: 0;

  left: 0;

  -webkit-transition: all 300ms cubic-bezier(.4,0,1,1);

  -khtml-transition: all 300ms cubic-bezier(.4,0,1,1);

  -moz-transition: all 300ms cubic-bezier(.4,0,1,1);

  -ms-transition: all 300ms cubic-bezier(.4,0,1,1);

  -o-transition: all 300ms cubic-bezier(.4,0,1,1);

  transition: all 300ms cubic-bezier(.4,0,1,1);

}

.pxl-loader.style-2 .loading-spinner {

  margin: -20px auto 0;

  width: 40px;

  height: 40px;

  top: 50%;

  position: relative;

  text-align: center;

  -webkit-animation: sk-rotate 2s infinite linear;

  animation: sk-rotate 2s infinite linear;

}

.pxl-loader.style-2 .loading-dot1,.pxl-loader.style-2 .loading-dot2 {

  width: 60%;

  height: 60%;

  display: inline-block;

  position: absolute;

  top: 0;

  border-radius: 100%;

  -webkit-animation: sk-bounce 2s infinite ease-in-out;

  animation: sk-bounce 2s infinite ease-in-out;

}

.pxl-loader.style-2 .loading-dot1 {

  background-color: var(--color-primary);

}

.pxl-loader.style-2 .loading-dot2 {

  top: auto;

  bottom: 0;

  -webkit-animation-delay: -1s;

  animation-delay: -1s;

  background-color: var(--color-secondary);

}

@property --tw-translate-x {

  syntax: "*";

  inherits: false;

  initial-value: 0;

}

@property --tw-translate-y {

  syntax: "*";

  inherits: false;

  initial-value: 0;

}

@property --tw-translate-z {

  syntax: "*";

  inherits: false;

  initial-value: 0;

}

@property --tw-rotate-x {

  syntax: "*";

  inherits: false;

}

@property --tw-rotate-y {

  syntax: "*";

  inherits: false;

}

@property --tw-rotate-z {

  syntax: "*";

  inherits: false;

}

@property --tw-skew-x {

  syntax: "*";

  inherits: false;

}

@property --tw-skew-y {

  syntax: "*";

  inherits: false;

}

@property --tw-border-style {

  syntax: "*";

  inherits: false;

  initial-value: solid;

}

@property --tw-gradient-position {

  syntax: "*";

  inherits: false;

}

@property --tw-gradient-from {

  syntax: "<color>";

  inherits: false;

  initial-value: #0000;

}

@property --tw-gradient-via {

  syntax: "<color>";

  inherits: false;

  initial-value: #0000;

}

@property --tw-gradient-to {

  syntax: "<color>";

  inherits: false;

  initial-value: #0000;

}

@property --tw-gradient-stops {

  syntax: "*";

  inherits: false;

}

@property --tw-gradient-via-stops {

  syntax: "*";

  inherits: false;

}

@property --tw-gradient-from-position {

  syntax: "<length-percentage>";

  inherits: false;

  initial-value: 0%;

}

@property --tw-gradient-via-position {

  syntax: "<length-percentage>";

  inherits: false;

  initial-value: 50%;

}

@property --tw-gradient-to-position {

  syntax: "<length-percentage>";

  inherits: false;

  initial-value: 100%;

}

@property --tw-leading {

  syntax: "*";

  inherits: false;

}

@property --tw-font-weight {

  syntax: "*";

  inherits: false;

}

@property --tw-tracking {

  syntax: "*";

  inherits: false;

}

@property --tw-shadow {

  syntax: "*";

  inherits: false;

  initial-value: 0 0 #0000;

}

@property --tw-shadow-color {

  syntax: "*";

  inherits: false;

}

@property --tw-shadow-alpha {

  syntax: "<percentage>";

  inherits: false;

  initial-value: 100%;

}

@property --tw-inset-shadow {

  syntax: "*";

  inherits: false;

  initial-value: 0 0 #0000;

}

@property --tw-inset-shadow-color {

  syntax: "*";

  inherits: false;

}

@property --tw-inset-shadow-alpha {

  syntax: "<percentage>";

  inherits: false;

  initial-value: 100%;

}

@property --tw-ring-color {

  syntax: "*";

  inherits: false;

}

@property --tw-ring-shadow {

  syntax: "*";

  inherits: false;

  initial-value: 0 0 #0000;

}

@property --tw-inset-ring-color {

  syntax: "*";

  inherits: false;

}

@property --tw-inset-ring-shadow {

  syntax: "*";

  inherits: false;

  initial-value: 0 0 #0000;

}

@property --tw-ring-inset {

  syntax: "*";

  inherits: false;

}

@property --tw-ring-offset-width {

  syntax: "<length>";

  inherits: false;

  initial-value: 0px;

}

@property --tw-ring-offset-color {

  syntax: "*";

  inherits: false;

  initial-value: #fff;

}

@property --tw-ring-offset-shadow {

  syntax: "*";

  inherits: false;

  initial-value: 0 0 #0000;

}

@property --tw-blur {

  syntax: "*";

  inherits: false;

}

@property --tw-brightness {

  syntax: "*";

  inherits: false;

}

@property --tw-contrast {

  syntax: "*";

  inherits: false;

}

@property --tw-grayscale {

  syntax: "*";

  inherits: false;

}

@property --tw-hue-rotate {

  syntax: "*";

  inherits: false;

}

@property --tw-invert {

  syntax: "*";

  inherits: false;

}

@property --tw-opacity {

  syntax: "*";

  inherits: false;

}

@property --tw-saturate {

  syntax: "*";

  inherits: false;

}

@property --tw-sepia {

  syntax: "*";

  inherits: false;

}

@property --tw-drop-shadow {

  syntax: "*";

  inherits: false;

}

@property --tw-drop-shadow-color {

  syntax: "*";

  inherits: false;

}

@property --tw-drop-shadow-alpha {

  syntax: "<percentage>";

  inherits: false;

  initial-value: 100%;

}

@property --tw-drop-shadow-size {

  syntax: "*";

  inherits: false;

}

@property --tw-duration {

  syntax: "*";

  inherits: false;

}

@property --tw-ease {

  syntax: "*";

  inherits: false;

}

@property --tw-scale-x {

  syntax: "*";

  inherits: false;

  initial-value: 1;

}

@property --tw-scale-y {

  syntax: "*";

  inherits: false;

  initial-value: 1;

}

@property --tw-scale-z {

  syntax: "*";

  inherits: false;

  initial-value: 1;

}

@property --tw-content {

  syntax: "*";

  initial-value: "";

  inherits: false;

}

@property --tw-backdrop-blur {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-brightness {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-contrast {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-grayscale {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-hue-rotate {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-invert {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-opacity {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-saturate {

  syntax: "*";

  inherits: false;

}

@property --tw-backdrop-sepia {

  syntax: "*";

  inherits: false;

}

@property --tw-outline-style {

  syntax: "*";

  inherits: false;

  initial-value: solid;

}

/* Fix menú overlay desktop: evitar fondo oscuro en modo dark del sistema */
.flsbg .bg-wrap {
  background-color: #ffffff !important;
}

@media (prefers-color-scheme: dark) {
  .flsbg .bg-wrap {
    background-color: #ffffff !important;
  }
}

@layer properties {

  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {

    *, ::before, ::after, ::backdrop {

      --tw-translate-x: 0;

      --tw-translate-y: 0;

      --tw-translate-z: 0;

      --tw-rotate-x: initial;

      --tw-rotate-y: initial;

      --tw-rotate-z: initial;

      --tw-skew-x: initial;

      --tw-skew-y: initial;

      --tw-border-style: solid;

      --tw-gradient-position: initial;

      --tw-gradient-from: #0000;

      --tw-gradient-via: #0000;

      --tw-gradient-to: #0000;

      --tw-gradient-stops: initial;

      --tw-gradient-via-stops: initial;

      --tw-gradient-from-position: 0%;

      --tw-gradient-via-position: 50%;

      --tw-gradient-to-position: 100%;

      --tw-leading: initial;

      --tw-font-weight: initial;

      --tw-tracking: initial;

      --tw-shadow: 0 0 #0000;

      --tw-shadow-color: initial;

      --tw-shadow-alpha: 100%;

      --tw-inset-shadow: 0 0 #0000;

      --tw-inset-shadow-color: initial;

      --tw-inset-shadow-alpha: 100%;

      --tw-ring-color: initial;

      --tw-ring-shadow: 0 0 #0000;

      --tw-inset-ring-color: initial;

      --tw-inset-ring-shadow: 0 0 #0000;

      --tw-ring-inset: initial;

      --tw-ring-offset-width: 0px;

      --tw-ring-offset-color: #fff;

      --tw-ring-offset-shadow: 0 0 #0000;

      --tw-blur: initial;

      --tw-brightness: initial;

      --tw-contrast: initial;

      --tw-grayscale: initial;

      --tw-hue-rotate: initial;

      --tw-invert: initial;

      --tw-opacity: initial;

      --tw-saturate: initial;

      --tw-sepia: initial;

      --tw-drop-shadow: initial;

      --tw-drop-shadow-color: initial;

      --tw-drop-shadow-alpha: 100%;

      --tw-drop-shadow-size: initial;

      --tw-duration: initial;

      --tw-ease: initial;

      --tw-scale-x: 1;

      --tw-scale-y: 1;

      --tw-scale-z: 1;

      --tw-content: "";

      --tw-backdrop-blur: initial;

      --tw-backdrop-brightness: initial;

      --tw-backdrop-contrast: initial;

      --tw-backdrop-grayscale: initial;

      --tw-backdrop-hue-rotate: initial;

      --tw-backdrop-invert: initial;

      --tw-backdrop-opacity: initial;

      --tw-backdrop-saturate: initial;

      --tw-backdrop-sepia: initial;

      --tw-outline-style: solid;

    }

  }

}