/****** FONT START ******/
/* PRIMARY START */
@font-face {
  font-family: "NunitoSans";
  font-display: swap;
  src: url("fonts/NunitoSans/NunitoSans-ExtraLight.ttf") format("truetype");
  font-weight: 200;
}

@font-face {
  font-family: "NunitoSans";
  font-display: swap;
  src: url("fonts/NunitoSans/NunitoSans-Light.ttf") format("truetype");
  font-weight: 300;
}

@font-face {
  font-family: "NunitoSans";
  font-display: swap;
  src: url("fonts/NunitoSans/NunitoSans-Regular.ttf") format("truetype");
  font-weight: 400;
}

@font-face {
  font-family: "NunitoSans";
  font-display: swap;
  src: url("fonts/NunitoSans/NunitoSans-Medium.ttf") format("truetype");
  font-weight: 500;
}

@font-face {
  font-family: "NunitoSans";
  font-display: swap;
  src: url("fonts/NunitoSans/NunitoSans-SemiBold.ttf") format("truetype");
  font-weight: 600;
}

@font-face {
  font-family: "NunitoSans";
  font-display: swap;
  src: url("fonts/NunitoSans/NunitoSans-Bold.ttf") format("truetype");
  font-weight: 700;
}

/* PRIMARY END */

/* SECONDARY START */
@font-face {
  font-family: "Cormorant";
  font-display: swap;
  src: url("fonts/Cormorant/Cormorant-Light.ttf") format("truetype");
  font-weight: 300;
}

@font-face {
  font-family: "Cormorant";
  font-display: swap;
  src: url("fonts/Cormorant/Cormorant-Regular.ttf") format("truetype");
  font-weight: 400;
}

@font-face {
  font-family: "Cormorant";
  font-display: swap;
  src: url("fonts/Cormorant/Cormorant-Medium.ttf") format("truetype");
  font-weight: 500;
}

@font-face {
  font-family: "Cormorant";
  font-display: swap;
  src: url("fonts/Cormorant/Cormorant-SemiBold.ttf") format("truetype");
  font-weight: 600;
}

@font-face {
  font-family: "Cormorant";
  font-display: swap;
  src: url("fonts/Cormorant/Cormorant-Bold.ttf") format("truetype");
  font-weight: 700;
}

@font-face {
  font-family: "Cormorant";
  font-display: swap;
  src: url("fonts/Cormorant/Cormorant-ExtraBold.ttf") format("truetype");
  font-weight: 800;
}

/* SECONDARY END */
/****** FONT END ******/

/****** ROOT START ******/
:root {
  /* FONT START */
  --font-text: 16px;
  --line-height: 30px;
  --font-text-mobile: 15px;
  /* FONT END */

  /* FONT FAMILY START */
  --font-family: "NunitoSans", sans-serif;
  --font-weight: 200;
  /* FONT FAMILY END */

  /* BACKGROUND COLOR START */
  --primary: #41ca7b;
  --primary-light: ;
  --primary-lighter: ;
  --primary-dark: ;
  --primary-darker: ;

  --secondary: #000000;
  --secondary-light: ;
  --secondary-lighter: ;
  --secondary-dark: ;
  --secondary-darker: ;

  --tertiary: #b5aba1;
  --tertiary-light: #eeece9;
  --tertiary-lighter: #fbfaf9;
  --tertiary-dark: ;
  --tertiary-darker: ;

  --gray: ;
  --gray-light: #ffffffde;
  --gray-lighter: ;
  --gray-dark: ;
  --gray-darker: ;

  --white: #ffffff;
  --black: #000000;
  --red: #ff0000;
  /* BACKGROUND COLOR END */

  /* TEXT COLOR START */
  --text-primary: #0f0f0fa6;
  --text-primary-light: ;
  --text-primary-lighter: ;
  --text-primary-dark: ;
  --text-primary-darker: ;

  --text-secondary: #41ca7b;
  --text-secondary-light: ;
  --text-secondary-lighter: ;
  --text-secondary-dark: ;
  --text-secondary-darker: ;

  --text-tertiary: ;
  --text-tertiary-light: ;
  --text-tertiary-lighter: ;
  --text-tertiary-dark: ;
  --text-tertiary-darker: ;

  --text-gray: #ffffffa6;
  --text-gray-light: #fbfaf9;
  --text-gray-lighter: ;
  --text-gray-dark: ;
  --text-gray-darker: ;

  --text-white: #ffffff;
  --text-black: #000000;
  --text-red: #ff0000;
  /* TEXT COLOR END */

  /* BORDER COLOR START */
  --border-primary: blue;
  --border-primary-light: ;
  --border-primary-lighter: #b5494c;
  --border-primary-dark: ;
  --border-primary-darker: ;

  --border-secondary: ;
  --border-secondary-light: ;
  --border-secondary-lighter: ;
  --border-secondary-dark: ;
  --border-secondary-darker: ;

  --border-tertiary: #b5aba1;
  --border-tertiary-light: #b5aba186;
  --border-tertiary-lighter: ;
  --border-tertiary-dark: ;
  --border-tertiary-darker: ;

  --border-gray: ;
  --border-gray-light: #fbfaf9;
  --border-gray-lighter: #888888a6;
  --border-gray-lighter-2: #88888826;
  --border-gray-dark: ;
  --border-gray-darker: ;

  --border-white: #ffffff;
  --border-black: #000000;
  --border-red: #ff0000;
  /* BORDER COLOR END */

  /* FILTER START */
  --filter-primary: grayscale(100%) brightness(0);
  --filter-secondary: ;
  --filter-tertiary: invert(80%) sepia(14%) saturate(210%) hue-rotate(349deg)
    brightness(83%) contrast(94%);
  --filter-gray: invert(90%) sepia(1%) saturate(1) hue-rotate(93deg)
    brightness(94%) contrast(1);
  --filter-white: invert(100%);
  --filter-black: invert(0%);
  /* FILTER END */

  /* TRANSITION START */
  --transition-all: all 0.3s ease-out;
  --transition-color: color 0.3s ease-out;
  --transition-margin: margin 0.3s ease-out;
  --transition-transform: transform 0.5s ease-out;
  --transition-height: height 0.3s ease-out;
  /* TRANSITION END */

  /* MARGIN TOP START */
  --margin-top: 85px;
  --margin-top-fixed: 85px;
  --margin-top-mobile: 85px;
  --margin-top-mobile-fixed: 85px;
  /* MARGIN TOP END */

  /* BOX SHADOW START */
  --box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
  --box-shadow-bottom: rgb(0 0 0 / 12%) 0px 1px 5px;
  /* BOX SHADOW END */

  /* ROUNDED START */
  --rounded-1: 3px;
  --rounded-2: 6px;
  --rounded-3: 9px;
  --rounded-4: 12px;
  --rounded-5: 15px;
  --rounded-6: 18px;
  --rounded-7: 21px;
  --rounded-8: 24px;
  --rounded-9: 27px;
  /* ROUNDED END */

  --overlay: rgba(0, 0, 0, 0.65);
}

/****** ROOT END ******/

/****** DEFAULT START ******/
html {
  font-size: var(--font-text);
  line-height: var(--line-height);
  overscroll-behavior: none;
}

/* uvek zadrži gutter bez skoka, ali kroz klasu (ne diramo html{}) */
html.gutter-stable {
  overflow-y: auto;
  scrollbar-gutter: stable;
}

/* kad je meni otvoren: zadrži vidljiv skroler */
html.menu-opened {
  overflow-y: scroll;
}

/* kad je meni otvoren: zaključa se skrol tela bez skoka pozicije */
body.menu-opened {
  position: fixed;
  width: 100%;
  top: var(--menu-lock-top, 0);
  left: 0;
  right: 0;
}

body {
  color: var(--text-primary);
  font-family: var(--font-family);
  font-weight: var(--font-weight);
  line-height: 1.3;
  letter-spacing: 1px;
}

body .bg-load {
  background-color: var(--secondary);
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
  position: fixed;
  width: 100svw;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10000000;
  height: 100svh;
}

body.loaded .bg-load {
  opacity: 0;
  user-select: none;
  pointer-events: none;
}

img {
  max-width: 100%;
  width: 100%;
  height: auto;
}

/****** DEFAULT END ******/

/* Firefox */
.scrollbar-alt {
  scrollbar-width: thin;
  /* thumb (crn), track (bg-t-lighter) */
  scrollbar-color: #000 var(--bg-t-lighter);
}

/* WebKit */
.scrollbar-alt::-webkit-scrollbar {
  width: 12px;
}
.scrollbar-alt::-webkit-scrollbar-track {
  background: var(--bg-t-lighter); /* bg-t-lighter */
}
.scrollbar-alt::-webkit-scrollbar-thumb {
  background: #000; /* crni skrol */
  border-radius: 10px;
  border: 3px solid var(--bg-t-lighter); /* prsten u istoj boji tracka */
}
.scrollbar-alt::-webkit-scrollbar-thumb:hover {
  background: #111;
}

/****** WEBKIT START ******/
.webkit {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.webkit-1 {
  -webkit-line-clamp: 1;
}

.webkit-2 {
  -webkit-line-clamp: 2;
}

.webkit-3 {
  -webkit-line-clamp: 3;
}

.webkit-4 {
  -webkit-line-clamp: 4;
}

.webkit-5 {
  -webkit-line-clamp: 5;
}

.webkit-6 {
  -webkit-line-clamp: 6;
}

.webkit-7 {
  -webkit-line-clamp: 7;
}

.webkit-8 {
  -webkit-line-clamp: 8;
}

/****** WEBKIT END ******/

/****** CUSTOM CLASSES START ******/
.m-top {
  margin-top: var(--margin-top);
  transition: var(--transition-margin);
}

.m-top.fixed {
  margin-top: var(--margin-top-fixed);
  transition: var(--transition-margin);
}

.bg-none {
  background: none !important;
}

.link-in-text a {
  transition: var(--transition-all);
  color: var(--white);
  font-weight: 500;
  border-bottom: 1px solid white;
}

.link-in-text a:hover {
  color: var(--text-secondary);
  border-color: var(--text-secondary);
}

.ls-none {
  list-style: none;
}

.ls-dist {
  list-style-type: disc;
}

.border-divider {
  background-color: var(--border-gray-lighter);
  width: 100%;
  height: 1px;
}

.text-not-last p:last-child {
  margin-bottom: 0 !important;
}

.text-align-last-center {
  text-align-last: center !important;
}

.text-justify {
  text-align: justify;
}

.w-fit {
  width: fit-content;
}

.white-normal {
  white-space: normal;
}

.white-nowrap {
  white-space: nowrap;
}

.user-select-none {
  user-select: none;
}

.max-w-unset {
  max-width: unset !important;
}

.cursor-pointer {
  cursor: pointer !important;
}

.cursor-default {
  cursor: default !important;
}

.pointer-none {
  pointer-events: none !important;
}

/* .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--overlay);
} */

.letter-2px {
  letter-spacing: 2px;
}

.object-contain {
  object-fit: contain !important;
}

.object-cover {
  object-fit: cover !important;
}

/****** CUSTOM CLASSES END ******/

/****** FONT FAMILY START ******/
/* PRIMARY START */
.ff-p-extra-light {
  font-family: "NunitoSans", sans-serif;
  font-weight: 200;
}

.ff-p-light {
  font-family: "NunitoSans", sans-serif;
  font-weight: 300;
}

.ff-p-regular {
  font-family: "NunitoSans", sans-serif;
  font-weight: 400;
}

.ff-p-medium {
  font-family: "NunitoSans", sans-serif;
  font-weight: 500;
}

.ff-p-semi {
  font-family: "NunitoSans", sans-serif;
  font-weight: 600;
}

.ff-p-bold {
  font-family: "NunitoSans", sans-serif;
  font-weight: 700;
}

/* PRIMARY END */

/* SECONDARY START */
.ff-s-light {
  font-family: "Cormorant", sans-serif;
  font-weight: 300;
}

.ff-s-regular {
  font-family: "Cormorant", sans-serif;
  font-weight: 400;
}

.ff-s-medium {
  font-family: "Cormorant", sans-serif;
  font-weight: 500;
}

.ff-s-semi {
  font-family: "Cormorant", sans-serif;
  font-weight: 600;
}

.ff-s-bold {
  font-family: "Cormorant", sans-serif;
  font-weight: 700;
}

.ff-s-extra {
  font-family: "Cormorant", sans-serif;
  font-weight: 800;
}

/* SECONDARY END */
/****** FONT FAMILY END ******/

/****** FONT SIZE START ******/

/* 10–12px */
.fs-xxxsm {
  font-size: clamp(0.625rem, 0.7161vw, 0.75rem);
  line-height: 1.7;
}

/* 12–14px */
.fs-xxsm {
  font-size: clamp(0.75rem, 0.8464vw, 0.875rem);
  line-height: 1.7;
}

/* 14–16px */
.fs-xsm {
  font-size: clamp(0.875rem, 0.9766vw, 1rem);
  line-height: 1.7;
}

/* 16–18px */
.fs-sm {
  font-size: clamp(1rem, 1.1068vw, 1.125rem);
  line-height: 1.6;
}

/* 18–20px */
.fs-md {
  font-size: clamp(1.125rem, 1.237vw, 1.25rem);
  line-height: 1.6;
}

/* 20–22px */
.fs-lg {
  font-size: clamp(1.25rem, 1.3672vw, 1.375rem);
  line-height: 1.4;
}

/* 24–30px */
.fs-1xl {
  font-size: clamp(1.5rem, 1.7578vw, 1.875rem);
  line-height: 1.35;
}

/* 28–36px */
.fs-2xl {
  font-size: clamp(1.75rem, 2.0833vw, 2.25rem);
  line-height: 1.35;
}

/* 32–42px */
.fs-3xl {
  font-size: clamp(2rem, 2.4089vw, 2.625rem);
  line-height: 1.3;
}

/* 36–48px */
.fs-4xl {
  font-size: clamp(2.25rem, 2.7344vw, 3rem);
  line-height: 1.3;
}

/* 40–54px */
.fs-5xl {
  font-size: clamp(2.5rem, 3.0599vw, 3.375rem);
  line-height: 1.1;
}

/* 44–60px */
.fs-6xl {
  font-size: clamp(2.75rem, 3.3854vw, 3.75rem);
  line-height: 1.25;
}

/* 48–66px */
.fs-7xl {
  font-size: clamp(2.55rem, 3.7109vw, 4.125rem);
  line-height: 1.25;
}

/* 52–72px */
.fs-8xl {
  font-size: clamp(3.25rem, 4.0365vw, 4.5rem);
  line-height: 1.2;
}

/* 56–78px */
.fs-9xl {
  font-size: clamp(2.75rem, 4.362vw, 4.875rem);
  line-height: 1.2;
}

/* 60–84px */
.fs-10xl {
  font-size: clamp(3.75rem, 4.6875vw, 5.25rem);
  line-height: 1.2;
}

/* 64–90px */
.fs-11xl {
  font-size: clamp(4rem, 5.013vw, 5.625rem);
  line-height: 1.2;
}

/* 68–96px */
.fs-12xl {
  font-size: clamp(4.25rem, 5.3385vw, 6rem);
  line-height: 1.15;
}

/* 72–102px */
.fs-13xl {
  font-size: clamp(4.5rem, 5.6641vw, 6.375rem);
  line-height: 1.15;
}

/* 76–108px */
.fs-14xl {
  font-size: clamp(4.75rem, 5.9896vw, 6.75rem);
  line-height: 1.15;
}

/* 80–114px */
.fs-15xl {
  font-size: clamp(5rem, 6.3151vw, 7.125rem);
  line-height: 1.15;
}

/* 84–120px */
.fs-16xl {
  font-size: clamp(5.25rem, 6.6406vw, 7.5rem);
  line-height: 1.1;
}

/* 88–126px */
.fs-17xl {
  font-size: clamp(5.5rem, 6.9661vw, 7.875rem);
  line-height: 1.1;
}

/* 92–132px */
.fs-18xl {
  font-size: clamp(5.75rem, 7.2917vw, 8.25rem);
  line-height: 1.1;
}

/* 96–138px */
.fs-19xl {
  font-size: clamp(6rem, 7.6172vw, 8.625rem);
  line-height: 1.1;
}

/* 100–144px */
.fs-20xl {
  font-size: clamp(6.25rem, 7.9427vw, 9rem);
  line-height: 1.1;
}

/****** FONT SIZE END ******/

/****** BACKGROUND COLOR START ******/
/* PRIMARY START */
.bg-p {
  background-color: var(--primary) !important;
}

.bg-p-light {
  background-color: var(--primary-light) !important;
}

.bg-p-lighter {
  background-color: var(--primary-lighter) !important;
}

.bg-p-dark {
  background-color: var(--primary-dark) !important;
}

.bg-p-darker {
  background-color: var(--primary-darker) !important;
}

/* PRIMARY END */

/* SECONDARY START */
.bg-s {
  background-color: var(--secondary) !important;
}

.bg-s-light {
  background-color: var(--secondary-light) !important;
}

.bg-s-lighter {
  background-color: var(--secondary-lighter) !important;
}

.bg-s-dark {
  background-color: var(--secondary-dark) !important;
}

.bg-s-darker {
  background-color: var(--secondary-darker) !important;
}

/* SECONDARY END */

/* TERTIARY START */
.bg-t {
  background-color: var(--tertiary) !important;
}

.bg-t-light {
  background-color: var(--tertiary-light) !important;
}

.bg-t-lighter {
  background-color: var(--tertiary-lighter) !important;
}

.bg-t-lighter-to-light:hover {
  transition: var(--transition-all);
  background-color: var(--tertiary-light) !important;
}

.bg-t-dark {
  background-color: var(--tertiary-dark) !important;
}

.bg-t-darker {
  background-color: var(--tertiary-darker) !important;
}

/* TERTIARY END */

/* GRAY START */
.bg-g {
  background-color: var(--gray) !important;
}

.bg-g-light {
  background-color: var(--gray-light) !important;
}

.bg-g-lighter {
  background-color: var(--gray-lighter) !important;
}

.bg-g-dark {
  background-color: var(--gray-dark) !important;
}

.bg-g-darker {
  background-color: var(--gray-darker) !important;
}

/* GRAY END */

/* SPECIAL COLORS START */
.bg-w {
  background-color: var(--white) !important;
}

.bg-b {
  background-color: var(--black) !important;
}

.bg-r {
  background-color: var(--red) !important;
}

/* SPECIAL COLORS END */
/****** BACKGROUND COLOR END ******/

/****** BACKGROUND COLOR HOVER START ******/
/* PRIMARY TO OTHER COLORS */
.bg-p-to-s {
  background-color: var(--primary) !important;
}

.bg-p-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-p-to-t {
  background-color: var(--primary) !important;
}

.bg-p-to-t:hover {
  background-color: var(--tertiary) !important;
}

.bg-p-to-g {
  background-color: var(--primary) !important;
}

.bg-p-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-p-to-w {
  background-color: var(--primary) !important;
}

.bg-p-to-w:hover {
  background-color: var(--white) !important;
}

.bg-p-to-b {
  background-color: var(--primary) !important;
}

.bg-p-to-b:hover {
  background-color: var(--black) !important;
}

.bg-p-to-r {
  background-color: var(--primary) !important;
}

.bg-p-to-r:hover {
  background-color: var(--red) !important;
}

/* SECONDARY TO OTHER COLORS */
.bg-s-to-p {
  background-color: var(--secondary) !important;
}

.bg-s-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-s-to-t {
  background-color: var(--secondary) !important;
}

.bg-s-to-t:hover {
  background-color: var(--tertiary) !important;
}

.bg-s-to-g {
  background-color: var(--secondary) !important;
}

.bg-s-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-s-to-w {
  background-color: var(--secondary) !important;
}

.bg-s-to-w:hover {
  background-color: var(--white) !important;
}

.bg-s-to-b {
  background-color: var(--secondary) !important;
}

.bg-s-to-b:hover {
  background-color: var(--black) !important;
}

.bg-s-to-r {
  background-color: var(--secondary) !important;
}

.bg-s-to-r:hover {
  background-color: var(--red) !important;
}

.bg-transparent {
  background-color: transparent !important;
}

.bg-transparent-hover:hover {
  background-color: rgba(0, 0, 0, 0.397) !important;
}

/* TERTIARY TO OTHER COLORS */
.bg-t-to-p {
  background-color: var(--tertiary) !important;
}

.bg-t-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-t-to-s {
  background-color: var(--tertiary) !important;
}

.bg-t-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-t-to-g {
  background-color: var(--tertiary) !important;
}

.bg-t-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-t-to-w {
  background-color: var(--tertiary) !important;
}

.bg-t-to-w:hover {
  background-color: var(--white) !important;
}

.bg-t-to-b {
  background-color: var(--tertiary) !important;
}

.bg-t-to-b:hover {
  background-color: var(--black) !important;
}

.bg-t-to-r {
  background-color: var(--tertiary) !important;
}

.bg-t-to-r:hover {
  background-color: var(--red) !important;
}

/* Transparent to other colors */
.bg-tp-to-p {
  background-color: transparent !important;
}

.bg-tp-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-tp-to-s {
  background-color: transparent !important;
}

.bg-tp-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-tp-to-g {
  background-color: transparent !important;
}

.bg-tp-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-tp-to-w {
  background-color: transparent !important;
}

.bg-tp-to-w:hover {
  background-color: var(--white) !important;
}

.bg-tp-to-b {
  background-color: transparent !important;
}

.bg-tp-to-b:hover {
  background-color: var(--black) !important;
}

.bg-tp-to-r {
  background-color: transparent !important;
}

.bg-tp-to-r:hover {
  background-color: var(--red) !important;
}

/* GRAY TO OTHER COLORS */
.bg-g-to-p {
  background-color: var(--gray) !important;
}

.bg-g-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-g-to-s {
  background-color: var(--gray) !important;
}

.bg-g-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-g-to-t {
  background-color: var(--gray) !important;
}

.bg-g-to-t:hover {
  background-color: var(--tertiary) !important;
}

.bg-g-to-w {
  background-color: var(--gray) !important;
}

.bg-g-to-w:hover {
  background-color: var(--white) !important;
}

.bg-g-to-b {
  background-color: var(--gray) !important;
}

.bg-g-to-b:hover {
  background-color: var(--black) !important;
}

.bg-g-to-r {
  background-color: var(--gray) !important;
}

.bg-g-to-r:hover {
  background-color: var(--red) !important;
}

/* WHITE TO OTHER COLORS */
.bg-w-to-p {
  background-color: var(--white) !important;
}

.bg-w-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-w-to-s {
  background-color: var(--white) !important;
}

.bg-w-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-w-to-t {
  background-color: var(--white) !important;
}

.bg-w-to-t:hover {
  background-color: var(--tertiary) !important;
}

.bg-w-to-g {
  background-color: var(--white) !important;
}

.bg-w-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-w-to-b {
  background-color: var(--white) !important;
}

.bg-w-to-b:hover {
  background-color: var(--black) !important;
}

.bg-w-to-r {
  background-color: var(--white) !important;
}

.bg-w-to-r:hover {
  background-color: var(--red) !important;
}

/* BLACK TO OTHER COLORS */
.bg-b-to-p {
  background-color: var(--black) !important;
}

.bg-b-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-b-to-s {
  background-color: var(--black) !important;
}

.bg-b-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-b-to-t {
  background-color: var(--black) !important;
}

.bg-b-to-t:hover {
  background-color: var(--tertiary) !important;
}

.bg-b-to-g {
  background-color: var(--black) !important;
}

.bg-b-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-b-to-w {
  background-color: var(--black) !important;
}

.bg-b-to-w:hover {
  background-color: var(--white) !important;
}

.bg-b-to-r {
  background-color: var(--black) !important;
}

.bg-b-to-r:hover {
  background-color: var(--red) !important;
}

/* RED TO OTHER COLORS */
.bg-r-to-p {
  background-color: var(--red) !important;
}

.bg-r-to-p:hover {
  background-color: var(--primary) !important;
}

.bg-r-to-s {
  background-color: var(--red) !important;
}

.bg-r-to-s:hover {
  background-color: var(--secondary) !important;
}

.bg-r-to-t {
  background-color: var(--red) !important;
}

.bg-r-to-t:hover {
  background-color: var(--tertiary) !important;
}

.bg-r-to-g {
  background-color: var(--red) !important;
}

.bg-r-to-g:hover {
  background-color: var(--gray) !important;
}

.bg-r-to-w {
  background-color: var(--red) !important;
}

.bg-r-to-w:hover {
  background-color: var(--white) !important;
}

.bg-r-to-b {
  background-color: var(--red) !important;
}

.bg-r-to-b:hover {
  background-color: var(--black) !important;
}

/****** BACKGROUND COLOR HOVER END ******/

/****** TEXT COLOR START ******/
/* PRIMARY START */
.text-p {
  color: var(--text-primary) !important;
}

.text-p-light {
  color: var(--text-primary-light) !important;
}

.text-p-lighter {
  color: var(--text-primary-lighter) !important;
}

.text-p-dark {
  color: var(--text-primary-dark) !important;
}

.text-p-darker {
  color: var(--text-primary-darker) !important;
}

/* PRIMARY END */

/* SECONDARY START */
.text-s {
  color: var(--text-secondary) !important;
}

.text-s-light {
  color: var(--text-secondary-light) !important;
}

.text-s-lighter {
  color: var(--text-secondary-lighter) !important;
}

.text-s-dark {
  color: var(--text-secondary-dark) !important;
}

.text-s-darker {
  color: var(--text-secondary-darker) !important;
}

/* SECONDARY END */

/* TERTIARY START */
.text-t {
  color: var(--text-tertiary) !important;
}

.text-t-light {
  color: var(--text-tertiary-light) !important;
}

.text-t-lighter {
  color: var(--text-tertiary-lighter) !important;
}

.text-t-dark {
  color: var(--text-tertiary-dark) !important;
}

.text-t-darker {
  color: var(--text-tertiary-darker) !important;
}

/* TERTIARY END */

/* GRAY START */
.text-g {
  color: var(--text-gray) !important;
}

.text-g-light {
  color: var(--text-gray-light) !important;
}

.text-g-lighter {
  color: var(--text-gray-lighter) !important;
}

.text-g-dark {
  color: var(--text-gray-dark) !important;
}

.text-g-darker {
  color: var(--text-gray-darker) !important;
}

/* GRAY END */

/* SPECIAL COLORS START */
.text-w {
  color: var(--text-white) !important;
}

.text-b {
  color: var(--text-black) !important;
}

.text-r {
  color: var(--text-red) !important;
}

/* SPECIAL COLORS END */
/****** TEXT COLOR END ******/

/****** TEXT COLOR HOVER START ******/
/* PRIMARY TO OTHER COLORS */
.text-p-to-s {
  color: var(--text-primary) !important;
}

.text-p-to-s:hover {
  color: var(--text-secondary) !important;
}

.text-p-to-t {
  color: var(--text-primary) !important;
}

.text-p-to-t:hover {
  color: var(--text-tertiary) !important;
}

.text-p-to-g {
  color: var(--text-primary) !important;
}

.text-p-to-g:hover {
  color: var(--text-gray) !important;
}

.text-p-to-w {
  color: var(--text-primary) !important;
}

.text-p-to-w:hover {
  color: var(--text-white) !important;
}

.text-p-to-b {
  color: var(--text-primary) !important;
}

.text-p-to-b:hover {
  color: var(--text-black) !important;
}

.text-p-to-r {
  color: var(--text-primary) !important;
}

.text-p-to-r:hover {
  color: var(--text-red) !important;
}

/* SECONDARY TO OTHER COLORS */
.text-s-to-p {
  color: var(--text-secondary) !important;
}

.text-s-to-p:hover {
  color: var(--text-primary) !important;
}

.text-s-to-t {
  color: var(--text-secondary) !important;
}

.text-s-to-t:hover {
  color: var(--text-tertiary) !important;
}

.text-s-to-g {
  color: var(--text-secondary) !important;
}

.text-s-to-g:hover {
  color: var(--text-gray) !important;
}

.text-s-to-w {
  color: var(--text-secondary) !important;
}

.text-s-to-w:hover {
  color: var(--text-white) !important;
}

.text-s-to-b {
  color: var(--text-secondary) !important;
}

.text-s-to-b:hover {
  color: var(--text-black) !important;
}

.text-s-to-r {
  color: var(--text-secondary) !important;
}

.text-s-to-r:hover {
  color: var(--text-red) !important;
}

/* TERTIARY TO OTHER COLORS */
.text-t-to-p {
  color: var(--text-tertiary) !important;
}

.text-t-to-p:hover {
  color: var(--text-primary) !important;
}

.text-t-to-s {
  color: var(--text-tertiary) !important;
}

.text-t-to-s:hover {
  color: var(--text-secondary) !important;
}

.text-t-to-g {
  color: var(--text-tertiary) !important;
}

.text-t-to-g:hover {
  color: var(--text-gray) !important;
}

.text-t-to-w {
  color: var(--text-tertiary) !important;
}

.text-t-to-w:hover {
  color: var(--text-white) !important;
}

.text-t-to-b {
  color: var(--text-tertiary) !important;
}

.text-t-to-b:hover {
  color: var(--text-black) !important;
}

.text-t-to-r {
  color: var(--text-tertiary) !important;
}

.text-t-to-r:hover {
  color: var(--text-red) !important;
}

/* GRAY TO OTHER COLORS */
.text-g-to-p {
  color: var(--text-gray) !important;
}

.text-g-to-p:hover {
  color: var(--text-primary) !important;
}

.text-g-to-s {
  color: var(--text-gray) !important;
}

.text-g-to-s:hover {
  color: var(--text-secondary) !important;
}

.text-g-to-t {
  color: var(--text-gray) !important;
}

.text-g-to-t:hover {
  color: var(--text-tertiary) !important;
}

.text-g-to-w {
  color: var(--text-gray) !important;
}

.text-g-to-w:hover {
  color: var(--text-white) !important;
}

.text-g-to-b {
  color: var(--text-gray) !important;
}

.text-g-to-b:hover {
  color: var(--text-black) !important;
}

.text-g-to-r {
  color: var(--text-gray) !important;
}

.text-g-to-r:hover {
  color: var(--text-red) !important;
}

/* WHITE TO OTHER COLORS */
.text-w-to-p {
  color: var(--text-white) !important;
}

.text-w-to-p:hover {
  color: var(--text-primary) !important;
}

.text-w-to-s {
  color: var(--text-white) !important;
}

.text-w-to-s:hover {
  color: var(--text-secondary) !important;
}

.text-w-to-t {
  color: var(--text-white) !important;
}

.text-w-to-t:hover {
  color: var(--text-tertiary) !important;
}

.text-w-to-g {
  color: var(--text-white) !important;
}

.text-w-to-g:hover {
  color: var(--text-gray) !important;
}

.text-w-to-b {
  color: var(--text-white) !important;
}

.text-w-to-b:hover {
  color: var(--text-black) !important;
}

.text-w-to-r {
  color: var(--text-white) !important;
}

.text-w-to-r:hover {
  color: var(--text-red) !important;
}

/* BLACK TO OTHER COLORS */
.text-b-to-p {
  color: var(--text-black) !important;
}

.text-b-to-p:hover {
  color: var(--text-primary) !important;
}

.text-b-to-s {
  color: var(--text-black) !important;
}

.text-b-to-s:hover {
  color: var(--text-secondary) !important;
}

.text-b-to-t {
  color: var(--text-black) !important;
}

.text-b-to-t:hover {
  color: var(--text-tertiary) !important;
}

.text-b-to-g {
  color: var(--text-black) !important;
}

.text-b-to-g:hover {
  color: var(--text-gray) !important;
}

.text-b-to-w {
  color: var(--text-black) !important;
}

.text-b-to-w:hover {
  color: var(--text-white) !important;
}

.text-b-to-r {
  color: var(--text-black) !important;
}

.text-b-to-r:hover {
  color: var(--text-red) !important;
}

/* RED TO OTHER COLORS */
.text-r-to-p {
  color: var(--text-red) !important;
}

.text-r-to-p:hover {
  color: var(--text-primary) !important;
}

.text-r-to-s {
  color: var(--text-red) !important;
}

.text-r-to-s:hover {
  color: var(--text-secondary) !important;
}

.text-r-to-t {
  color: var(--text-red) !important;
}

.text-r-to-t:hover {
  color: var(--text-tertiary) !important;
}

.text-r-to-g {
  color: var(--text-red) !important;
}

.text-r-to-g:hover {
  color: var(--text-gray) !important;
}

.text-r-to-w {
  color: var(--text-red) !important;
}

.text-r-to-w:hover {
  color: var(--text-white) !important;
}

.text-r-to-b {
  color: var(--text-red) !important;
}

.text-r-to-b:hover {
  color: var(--text-black) !important;
}

/****** TEXT COLOR HOVER END ******/

/****** BORDER COLOR START ******/
/* PRIMARY START */
.border-color-p {
  border-color: var(--border-primary) !important;
}

.border-color-p-light {
  border-color: var(--border-primary-light) !important;
}

.border-color-p-lighter {
  border-color: var(--border-primary-lighter) !important;
}

.border-color-p-dark {
  border-color: var(--border-primary-dark) !important;
}

.border-color-p-darker {
  border-color: var(--border-primary-darker) !important;
}

/* PRIMARY END */

/* SECONDARY START */
.border-color-s {
  border-color: var(--border-secondary) !important;
}

.border-color-s-light {
  border-color: var(--border-secondary-light) !important;
}

.border-color-s-lighter {
  border-color: var(--border-secondary-lighter) !important;
}

.border-color-s-dark {
  border-color: var(--border-secondary-dark) !important;
}

.border-color-s-darker {
  border-color: var(--border-secondary-darker) !important;
}

/* SECONDARY END */

/* TERTIARY START */
.border-color-t {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-light {
  border-color: var(--border-tertiary-light) !important;
}

.border-color-t-lighter {
  border-color: var(--border-tertiary-lighter) !important;
}

.border-color-t-dark {
  border-color: var(--border-tertiary-dark) !important;
}

.border-color-t-darker {
  border-color: var(--border-tertiary-darker) !important;
}

/* TERTIARY END */

/* GRAY START */
.border-color-g {
  border-color: var(--border-gray) !important;
}

.border-color-g-light {
  border-color: var(--border-gray-light) !important;
}

.border-color-g-lighter {
  border-color: var(--border-gray-lighter) !important;
}

.border-color-g-lighter-2 {
  border-color: var(--border-gray-lighter-2) !important;
}

.border-color-g-dark {
  border-color: var(--border-gray-dark) !important;
}

.border-color-g-darker {
  border-color: var(--border-gray-darker) !important;
}

/* GRAY END */

/* SPECIAL COLORS START */
.border-color-w {
  border-color: var(--border-white) !important;
}

.border-color-b {
  border-color: var(--border-black) !important;
}

.border-color-r {
  border-color: var(--border-red) !important;
}

/* SPECIAL COLORS END */
/****** BORDER COLOR END ******/

/****** BORDER COLOR HOVER START ******/
/* PRIMARY TO OTHER COLORS */
.border-color-p-to-s,
.border-color-p-to-s-parent {
  border-color: var(--border-primary) !important;
}

.border-color-p-to-s:hover,
.border-color-p-to-s-parent:hover span {
  border-color: var(--border-secondary) !important;
}

.border-color-p-to-t,
.border-color-p-to-t-parent {
  border-color: var(--border-primary) !important;
}

.border-color-p-to-t:hover,
.border-color-p-to-t-parent:hover span {
  border-color: var(--border-tertiary) !important;
}

.border-color-p-to-g,
.border-color-p-to-g-parent {
  border-color: var(--border-primary) !important;
}

.border-color-p-to-g:hover,
.border-color-p-to-g-parent:hover span {
  border-color: var(--border-gray) !important;
}

.border-color-p-to-w,
.border-color-p-to-w-parent {
  border-color: var(--border-primary) !important;
}

.border-color-p-to-w:hover,
.border-color-p-to-w-parent:hover span {
  border-color: var(--border-white) !important;
}

.border-color-p-to-b,
.border-color-p-to-b-parent {
  border-color: var(--border-primary) !important;
}

.border-color-p-to-b:hover,
.border-color-p-to-b-parent:hover span {
  border-color: var(--border-black) !important;
}

.border-color-p-to-r,
.border-color-p-to-r-parent {
  border-color: var(--border-primary) !important;
}

.border-color-p-to-r:hover,
.border-color-p-to-r-parent:hover span {
  border-color: var(--border-red) !important;
}

/* SECONDARY TO OTHER COLORS */
.border-color-s-to-p,
.border-color-s-to-p-parent {
  border-color: var(--border-secondary) !important;
}

.border-color-s-to-p:hover,
.border-color-s-to-p-parent:hover span {
  border-color: var(--border-primary) !important;
}

.border-color-s-to-t,
.border-color-s-to-t-parent {
  border-color: var(--border-secondary) !important;
}

.border-color-s-to-t:hover,
.border-color-s-to-t-parent:hover span {
  border-color: var(--border-tertiary) !important;
}

.border-color-s-to-g,
.border-color-s-to-g-parent {
  border-color: var(--border-secondary) !important;
}

.border-color-s-to-g:hover,
.border-color-s-to-g-parent:hover span {
  border-color: var(--border-gray) !important;
}

.border-color-s-to-w,
.border-color-s-to-w-parent {
  border-color: var(--border-secondary) !important;
}

.border-color-s-to-w:hover,
.border-color-s-to-w-parent:hover span {
  border-color: var(--border-white) !important;
}

.border-color-s-to-b,
.border-color-s-to-b-parent {
  border-color: var(--border-secondary) !important;
}

.border-color-s-to-b:hover,
.border-color-s-to-b-parent:hover span {
  border-color: var(--border-black) !important;
}

.border-color-s-to-r,
.border-color-s-to-r-parent {
  border-color: var(--border-secondary) !important;
}

.border-color-s-to-r:hover,
.border-color-s-to-r-parent:hover span {
  border-color: var(--border-red) !important;
}

/* TERTIARY TO OTHER COLORS */
.border-color-t-to-p,
.border-color-t-to-p-parent {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-to-p:hover,
.border-color-t-to-p-parent:hover span {
  border-color: var(--border-primary) !important;
}

.border-color-t-to-s,
.border-color-t-to-s-parent {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-to-s:hover,
.border-color-t-to-s-parent:hover span {
  border-color: var(--border-secondary) !important;
}

.border-color-t-to-g,
.border-color-t-to-g-parent {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-to-g:hover,
.border-color-t-to-g-parent:hover span {
  border-color: var(--border-gray) !important;
}

.border-color-t-to-w,
.border-color-t-to-w-parent {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-to-w:hover,
.border-color-t-to-w-parent:hover span {
  border-color: var(--border-white) !important;
}

.border-color-t-to-b,
.border-color-t-to-b-parent {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-to-b:hover,
.border-color-t-to-b-parent:hover span {
  border-color: var(--border-black) !important;
}

.border-color-t-to-r,
.border-color-t-to-r-parent {
  border-color: var(--border-tertiary) !important;
}

.border-color-t-to-r:hover,
.border-color-t-to-r-parent:hover span {
  border-color: var(--border-red) !important;
}

/* GRAY TO OTHER COLORS */
.border-color-g-to-p,
.border-color-g-to-p-parent {
  border-color: var(--border-gray) !important;
}

.border-color-g-to-p:hover,
.border-color-g-to-p-parent:hover span {
  border-color: var(--border-primary) !important;
}

.border-color-g-to-s,
.border-color-g-to-s-parent {
  border-color: var(--border-gray) !important;
}

.border-color-g-to-s:hover,
.border-color-g-to-s-parent:hover span {
  border-color: var(--border-secondary) !important;
}

.border-color-g-to-t,
.border-color-g-to-t-parent {
  border-color: var(--border-gray) !important;
}

.border-color-g-to-t:hover,
.border-color-g-to-t-parent:hover span {
  border-color: var(--border-tertiary) !important;
}

.border-color-g-to-w,
.border-color-g-to-w-parent {
  border-color: var(--border-gray) !important;
}

.border-color-g-to-w:hover,
.border-color-g-to-w-parent:hover span {
  border-color: var(--border-white) !important;
}

.border-color-g-to-b,
.border-color-g-to-b-parent {
  border-color: var(--border-gray) !important;
}

.border-color-g-to-b:hover,
.border-color-g-to-b-parent:hover span {
  border-color: var(--border-black) !important;
}

.border-color-g-to-r,
.border-color-g-to-r-parent {
  border-color: var(--border-gray) !important;
}

.border-color-g-to-r:hover,
.border-color-g-to-r-parent:hover span {
  border-color: var(--border-red) !important;
}

/* WHITE TO OTHER COLORS */
.border-color-w-to-p,
.border-color-w-to-p-parent {
  border-color: var(--border-white) !important;
}

.border-color-w-to-p:hover,
.border-color-w-to-p-parent:hover span {
  border-color: var(--border-primary) !important;
}

.border-color-w-to-s,
.border-color-w-to-s-parent {
  border-color: var(--border-white) !important;
}

.border-color-w-to-s:hover,
.border-color-w-to-s-parent:hover span {
  border-color: var(--border-secondary) !important;
}

.border-color-w-to-t,
.border-color-w-to-t-parent {
  border-color: var(--border-white) !important;
}

.border-color-w-to-t:hover,
.border-color-w-to-t-parent:hover span {
  border-color: var(--border-tertiary) !important;
}

.border-color-w-to-g,
.border-color-w-to-g-parent {
  border-color: var(--border-white) !important;
}

.border-color-w-to-g:hover,
.border-color-w-to-g-parent:hover span {
  border-color: var(--border-gray) !important;
}

.border-color-w-to-b,
.border-color-w-to-b-parent {
  border-color: var(--border-white) !important;
}

.border-color-w-to-b:hover,
.border-color-w-to-b-parent:hover span {
  border-color: var(--border-black) !important;
}

.border-color-w-to-r,
.border-color-w-to-r-parent {
  border-color: var(--border-white) !important;
}

.border-color-w-to-r:hover,
.border-color-w-to-r-parent:hover span {
  border-color: var(--border-red) !important;
}

/* BLACK TO OTHER COLORS */
.border-color-b-to-p,
.border-color-b-to-p-parent {
  border-color: var(--border-black) !important;
}

.border-color-b-to-p:hover,
.border-color-b-to-p-parent:hover span {
  border-color: var(--border-primary) !important;
}

.border-color-b-to-s,
.border-color-b-to-s-parent {
  border-color: var(--border-black) !important;
}

.border-color-b-to-s:hover,
.border-color-b-to-s-parent:hover span {
  border-color: var(--border-secondary) !important;
}

.border-color-b-to-t,
.border-color-b-to-t-parent {
  border-color: var(--border-black) !important;
}

.border-color-b-to-t:hover,
.border-color-b-to-t-parent:hover span {
  border-color: var(--border-tertiary) !important;
}

.border-color-b-to-g,
.border-color-b-to-g-parent {
  border-color: var(--border-black) !important;
}

.border-color-b-to-g:hover,
.border-color-b-to-g-parent:hover span {
  border-color: var(--border-gray) !important;
}

.border-color-b-to-w,
.border-color-b-to-w-parent {
  border-color: var(--border-black) !important;
}

.border-color-b-to-w:hover,
.border-color-b-to-w-parent:hover span {
  border-color: var(--border-white) !important;
}

.border-color-b-to-r,
.border-color-b-to-r-parent {
  border-color: var(--border-black) !important;
}

.border-color-b-to-r:hover,
.border-color-b-to-r-parent:hover span {
  border-color: var(--border-red) !important;
}

/* RED TO OTHER COLORS */
.border-color-r-to-p,
.border-color-r-to-p-parent {
  border-color: var(--border-red) !important;
}

.border-color-r-to-p:hover,
.border-color-r-to-p-parent:hover span {
  border-color: var(--border-primary) !important;
}

.border-color-r-to-s,
.border-color-r-to-s-parent {
  border-color: var(--border-red) !important;
}

.border-color-r-to-s:hover,
.border-color-r-to-s-parent:hover span {
  border-color: var(--border-secondary) !important;
}

.border-color-r-to-t,
.border-color-r-to-t-parent {
  border-color: var(--border-red) !important;
}

.border-color-r-to-t:hover,
.border-color-r-to-t-parent:hover span {
  border-color: var(--border-tertiary) !important;
}

.border-color-r-to-g,
.border-color-r-to-g-parent {
  border-color: var(--border-red) !important;
}

.border-color-r-to-g:hover,
.border-color-r-to-g-parent:hover span {
  border-color: var(--border-gray) !important;
}

.border-color-r-to-w,
.border-color-r-to-w-parent {
  border-color: var(--border-red) !important;
}

.border-color-r-to-w:hover,
.border-color-r-to-w-parent:hover span {
  border-color: var(--border-white) !important;
}

.border-color-r-to-b,
.border-color-r-to-b-parent {
  border-color: var(--border-red) !important;
}

.border-color-r-to-b:hover,
.border-color-r-to-b-parent:hover span {
  border-color: var(--border-black) !important;
}

/****** BORDER RADIUS START  ******/
.rounded-1 {
  border-radius: var(--rounded-1) !important;
}

.rounded-2 {
  border-radius: var(--rounded-2) !important;
}

.rounded-3 {
  border-radius: var(--rounded-3) !important;
}

.rounded-4 {
  border-radius: var(--rounded-4) !important;
}

.rounded-5 {
  border-radius: var(--rounded-5) !important;
}

.rounded-6 {
  border-radius: var(--rounded-6) !important;
}

.rounded-7 {
  border-radius: var(--rounded-7) !important;
}

.rounded-8 {
  border-radius: var(--rounded-8) !important;
}

.rounded-9 {
  border-radius: var(--rounded-9) !important;
}

/****** BORDER RADIUS END  ******/

/****** BORDER SIZE START  ******/
.border-t {
  border-top: 1px solid;
}

.border-e {
  border-right: 1px solid;
}

.border-b {
  border-bottom: 1px solid;
}

.border-s {
  border-left: 1px solid;
}

/****** BORDER SIZE END  ******/

/****** ICON SIZE START ******/
/* 10px */
.icon-xxxs {
  width: 0.625rem !important;
}

/* 12px */
.icon-xxs {
  width: 0.75rem !important;
}

/* 14px */
.icon-xs {
  width: 0.875rem !important;
}

/* 16px */
.icon-sm {
  width: 1rem !important;
}

/* 18px */
.icon-md {
  width: 1.125rem !important;
}

/* 20px */
.icon-lg {
  width: 1.25rem !important;
}

/* 24px */
.icon-xl {
  width: 1.5rem !important;
}

/* 28px */
.icon-2xl {
  width: 1.75rem !important;
}

/* 32px */
.icon-3xl {
  width: 2rem !important;
}

/* 38px */
.icon-4xl {
  width: 2.375rem !important;
}

/* 46px */
.icon-5xl {
  width: 2.875rem !important;
}

/* 54px */
.icon-6xl {
  width: 3.375rem !important;
}

/* 64px */
.icon-7xl {
  width: 4rem !important;
}

/* 80px */
.icon-8xl {
  width: 5rem !important;
}

/* 96px */
.icon-9xl {
  width: 6rem !important;
}

/* 112px */
.icon-10xl {
  width: 7rem !important;
}

/* 128px */
.icon-11xl {
  width: 8rem !important;
}

/* 144px */
.icon-12xl {
  width: 9rem !important;
}

/* 160px */
.icon-13xl {
  width: 10rem !important;
}

/* 160px */
.icon-14xl {
  width: 13rem !important;
}

/* 304px */
.icon-15xl {
  width: 19rem !important;
}

/* 304px */
.icon-16xl {
  width: 25rem !important;
}

/****** ICON SIZE END ******/

/****** ICON HOVER START ******/
.icon-hover {
  transition: var(--transition-transform);
  transform: scale(1) translateZ(0);
}

.icon-hover-minus:hover {
  transform: scale(0.95) translateZ(0);
}

.icon-hover-plus:hover {
  transform: scale(1.05) translateZ(0);
}

/****** ICON HOVER END ******/

/****** ROTATION START ******/
.rotate-0 {
  transform: rotate(0deg) !important;
}

.rotate-plus-90 {
  transform: rotate(90deg) !important;
}

.rotate-plus-180 {
  transform: rotate(180deg) !important;
}

.rotate-plus-270 {
  transform: rotate(270deg) !important;
}

.rotate-minus-90 {
  transform: rotate(-90deg) !important;
}

.rotate-minus-180 {
  transform: rotate(-180deg) !important;
}

.rotate-minus-270 {
  transform: rotate(-270deg) !important;
}

/****** ROTATION END ******/

/****** LINK BORDER START ******/
.link-border,
.link-border-parent span {
  display: inline-block;
}

.link-border:after,
.link-border-parent span:after {
  content: "";
  display: block;
  border-bottom: solid 1px;
  transform: scaleX(0);
  transition: var(--transition-transform);
}

.link-border:after,
.link-border-parent span:after {
  transform-origin: 100% 50%;
}

.link-border:hover:after,
.link-border-parent:hover span:after {
  transform: scaleX(1);
  transform-origin: 0% 50%;
}

/* Primary Text Color */
.link-border-p:after,
.link-border-p-parent span:after {
  border-color: var(--text-primary) !important;
}

.link-border-p-light:after,
.link-border-p-light-parent span:after {
  border-color: var(--text-primary-light) !important;
}

.link-border-p-lighter:after,
.link-border-p-lighter-parent span:after {
  border-color: var(--text-primary-lighter) !important;
}

.link-border-p-dark:after,
.link-border-p-dark-parent span:after {
  border-color: var(--text-primary-dark) !important;
}

.link-border-p-darker:after,
.link-border-p-darker-parent span:after {
  border-color: var(--text-primary-darker) !important;
}

/* Secondary Text Color */
.link-border-s:after,
.link-border-s-parent span:after {
  border-color: var(--text-secondary) !important;
}

.link-border-s-light:after,
.link-border-s-light-parent span:after {
  border-color: var(--text-secondary-light) !important;
}

.link-border-s-lighter:after,
.link-border-s-lighter-parent span:after {
  border-color: var(--text-secondary-lighter) !important;
}

.link-border-s-dark:after,
.link-border-s-dark-parent span:after {
  border-color: var(--text-secondary-dark) !important;
}

.link-border-s-darker:after,
.link-border-s-darker-parent span:after {
  border-color: var(--text-secondary-darker) !important;
}

/* Tertiary Text Color */
.link-border-t:after,
.link-border-t-parent span:after {
  border-color: var(--text-tertiary) !important;
}

.link-border-t-light:after,
.link-border-t-light-parent span:after {
  border-color: var(--text-tertiary-light) !important;
}

.link-border-t-lighter:after,
.link-border-t-lighter-parent span:after {
  border-color: var(--text-tertiary-lighter) !important;
}

.link-border-t-dark:after,
.link-border-t-dark-parent span:after {
  border-color: var(--text-tertiary-dark) !important;
}

.link-border-t-darker:after,
.link-border-t-darker-parent span:after {
  border-color: var(--text-tertiary-darker) !important;
}

/* Gray Text Color */
.link-border-g:after,
.link-border-g-parent span:after {
  border-color: var(--text-gray) !important;
}

.link-border-g-light:after,
.link-border-g-light-parent span:after {
  border-color: var(--text-gray-light) !important;
}

.link-border-g-lighter:after,
.link-border-g-lighter-parent span:after {
  border-color: var(--text-gray-lighter) !important;
}

.link-border-g-dark:after,
.link-border-g-dark-parent span:after {
  border-color: var(--text-gray-dark) !important;
}

.link-border-g-darker:after,
.link-border-g-darker-parent span:after {
  border-color: var(--text-gray-darker) !important;
}

/* White Color */
.link-border-w:after,
.link-border-w-parent span:after {
  border-color: var(--white) !important;
}

/* Black Color */
.link-border-b:after,
.link-border-b-parent span:after {
  border-color: var(--black) !important;
}

/* Red Color */
.link-border-r:after,
.link-border-r-parent span:after {
  border-color: var(--red) !important;
}

/****** LINK BORDER END ******/

/****** FILTER START ******/
/* Primary Filter */
.filter-p {
  filter: var(--filter-primary) !important;
}

.filter-p-to-s {
  filter: var(--filter-primary) !important;
}

.filter-p-to-s:hover {
  filter: var(--filter-secondary) !important;
}

.filter-p-to-t {
  filter: var(--filter-primary) !important;
}

.filter-p-to-t:hover {
  filter: var(--filter-tertiary) !important;
}

.filter-p-to-g {
  filter: var(--filter-primary) !important;
}

.filter-p-to-g:hover {
  filter: var(--filter-gray) !important;
}

.filter-p-to-w {
  filter: var(--filter-primary) !important;
}

.filter-p-to-w:hover {
  filter: var(--filter-white) !important;
}

.filter-p-to-b {
  filter: var(--filter-primary) !important;
}

.filter-p-to-b:hover {
  filter: var(--filter-black) !important;
}

/* Secondary Filter */
.filter-s {
  filter: var(--filter-secondary) !important;
}

.filter-s-to-p {
  filter: var(--filter-secondary) !important;
}

.filter-s-to-p:hover {
  filter: var(--filter-primary) !important;
}

.filter-s-to-t {
  filter: var(--filter-secondary) !important;
}

.filter-s-to-t:hover {
  filter: var(--filter-tertiary) !important;
}

.filter-s-to-g {
  filter: var(--filter-secondary) !important;
}

.filter-s-to-g:hover {
  filter: var(--filter-gray) !important;
}

.filter-s-to-w {
  filter: var(--filter-secondary) !important;
}

.filter-s-to-w:hover {
  filter: var(--filter-white) !important;
}

.filter-s-to-b {
  filter: var(--filter-secondary) !important;
}

.filter-s-to-b:hover {
  filter: var(--filter-black) !important;
}

/* Tertiary Filter */
.filter-t {
  filter: var(--filter-tertiary) !important;
}

.filter-t-to-p {
  filter: var(--filter-tertiary) !important;
}

.filter-t-to-p:hover {
  filter: var(--filter-primary) !important;
}

.filter-t-to-s {
  filter: var(--filter-tertiary) !important;
}

.filter-t-to-s:hover {
  filter: var(--filter-secondary) !important;
}

.filter-t-to-g {
  filter: var(--filter-tertiary) !important;
}

.filter-t-to-g:hover {
  filter: var(--filter-gray) !important;
}

.filter-t-to-w {
  filter: var(--filter-tertiary) !important;
}

.filter-t-to-w:hover {
  filter: var(--filter-white) !important;
}

.filter-t-to-b {
  filter: var(--filter-tertiary) !important;
}

.filter-t-to-b:hover {
  filter: var(--filter-black) !important;
}

/* Gray Filter */
.filter-g {
  filter: var(--filter-gray) !important;
}

.filter-g-to-p {
  filter: var(--filter-gray) !important;
}

.filter-g-to-p:hover {
  filter: var(--filter-primary) !important;
}

.filter-g-to-s {
  filter: var(--filter-gray) !important;
}

.filter-g-to-s:hover {
  filter: var(--filter-secondary) !important;
}

.filter-g-to-t {
  filter: var(--filter-gray) !important;
}

.filter-g-to-t:hover {
  filter: var(--filter-tertiary) !important;
}

.filter-g-to-w {
  filter: var(--filter-gray) !important;
}

.filter-g-to-w:hover {
  filter: var(--filter-white) !important;
}

.filter-g-to-b {
  filter: var(--filter-gray) !important;
}

.filter-g-to-b:hover {
  filter: var(--filter-black) !important;
}

/* Gray Filter */
.filter-w {
  filter: var(--filter-white) !important;
}

.filter-w-to-p {
  filter: var(--filter-white) !important;
}

.filter-w-to-p:hover {
  filter: var(--filter-primary) !important;
}

.filter-w-to-s {
  filter: var(--filter-white) !important;
}

.filter-w-to-s:hover {
  filter: var(--filter-secondary) !important;
}

.filter-w-to-t {
  filter: var(--filter-white) !important;
}

.filter-w-to-t:hover {
  filter: var(--filter-tertiary) !important;
}

.filter-w-to-w {
  filter: var(--filter-white) !important;
}

.filter-w-to-w:hover {
  filter: var(--filter-white) !important;
}

.filter-w-to-b {
  filter: var(--filter-white) !important;
}

.filter-w-to-b:hover {
  filter: var(--filter-black) !important;
}

/* White Filter */
.filter-w {
  filter: var(--filter-white) !important;
}

/* Black Filter */
.filter-b {
  filter: var(--filter-black) !important;
}

/****** FILTER END ******/

/****** BOX SHADOW START ******/
.box-shadow {
  box-shadow: var(--box-shadow);
}

.box-shadow-b {
  box-shadow: var(--box-shadow-bottom);
}

.box-shadow-none {
  box-shadow: none !important;
}

/****** BOX SHADOW END ******/

/****** Z-INDEX START ******/
.z-1 {
  z-index: 1 !important;
}

.z-2 {
  z-index: 2 !important;
}

.z-3 {
  z-index: 3 !important;
}

.z-4 {
  z-index: 4 !important;
}

.z-5 {
  z-index: 5 !important;
}

.z-6 {
  z-index: 6 !important;
}

.z-7 {
  z-index: 7 !important;
}

.z-8 {
  z-index: 8 !important;
}

.z-9 {
  z-index: 9 !important;
}

.z-10 {
  z-index: 10 !important;
}

.z-100 {
  z-index: 100 !important;
}

.z-200 {
  z-index: 200 !important;
}

.z-300 {
  z-index: 300 !important;
}

.z-400 {
  z-index: 400 !important;
}

.z-500 {
  z-index: 500 !important;
}

.z-600 {
  z-index: 600 !important;
}

.z-700 {
  z-index: 700 !important;
}

.z-800 {
  z-index: 800 !important;
}

.z-900 {
  z-index: 900 !important;
}

.z-1000 {
  z-index: 1000 !important;
}

.z-1100 {
  z-index: 1100 !important;
}

.z-1200 {
  z-index: 1200 !important;
}

.z-1300 {
  z-index: 1300 !important;
}

.z-1400 {
  z-index: 1400 !important;
}

.z-1500 {
  z-index: 1500 !important;
}

.z-1600 {
  z-index: 1600 !important;
}

.z-1700 {
  z-index: 1700 !important;
}

.z-1800 {
  z-index: 1800 !important;
}

.z-1900 {
  z-index: 1900 !important;
}

.z-2000 {
  z-index: 2000 !important;
}

/****** Z-INDEX END ******/

/****** TRANSITION START ******/
/* Transition All */
.transition-all {
  transition: var(--transition-all) !important;
}

/* Transition Color */
.transition-color {
  transition: var(--transition-color) !important;
}

/* Transition Margin */
.transition-margin {
  transition: var(--transition-margin) !important;
}

/* Transition Transform */
.transition-transform {
  transition: var(--transition-transform) !important;
}

/* Transition Height */
.transition-height {
  transition: var(--transition-height) !important;
}

/****** TRANSITION END ******/

.lh-1 {
  line-height: 1 !important;
}

.white-no-wrap {
  white-space: nowrap !important;
}

/* STYLE CUSTOM */
.pb-1px {
  padding-bottom: 1px;
}

.toast {
  display: flex !important;
  justify-content: space-between;
  align-items: start;
  min-width: fit-content;
}

.toast-success .toast-icon-warning,
.toast-success .toast-close-warning,
.toast-success .toast-para-warning {
  display: none;
}

.toast-warning .toast-icon-success,
.toast-warning .toast-close-success,
.toast-warning .toast-para-success {
  display: none;
}

.toast.show {
  right: 30px !important;
  bottom: 30px !important;
}

.toast .btn-close {
  background: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  opacity: 1;
}

.toast .toast-icon {
  width: 40px;
}

.toast .toast-close {
  width: 12px;
}

@media (max-width: 500px) {
  .toast.show {
    right: calc(1.5rem * 0.75) !important;
    bottom: calc(1.5rem * 0.75) !important;
    max-width: 320px;
    left: unset !important;
  }
}

/****** FORM START ******/
.invalid-feedback {
  margin-top: 0.25rem !important;
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
  margin-bottom: 0 !important;
}

.form-control {
  margin-bottom: 0;
  outline: unset !important;
  border: 1px solid #888888a6 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transition: all 0.3s ease-in-out;
  height: 55px;
}

.form-control.bottom {
  border-top: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;
  height: 30px !important;
}

textarea.form-control {
  height: 155px;
}

.form-control:hover,
.form-control:focus {
  border-color: var(--black) !important;
}

/****** FORM END ******/

/****** HEADER START ******/
.header * {
  user-select: none !important;
}

.header {
  transition: var(--transition-all);
  background-color: transparent;
  height: var(--margin-top);
  display: flex;
  align-items: center;
}

.header.box-shadow-none {
  box-shadow: none !important;
}

.header.box-shadow-none.fixed,
.header.white,
.header.fixed {
  box-shadow: var(--box-shadow-bottom);
  background-color: var(--white) !important;
}

.header.menu-opened .filter-w,
.header.white .filter-w,
.header.fixed .filter-w {
  filter: var(--filter-black) !important;
}

.header.white .text-w,
.header.fixed .text-w {
  color: var(--text-black) !important;
}

.header.white .link-border-w:after,
.header.white .link-border-w-parent span:after,
.header.fixed .link-border-w:after,
.header.fixed .link-border-w-parent span:after {
  border-color: var(--text-black) !important;
}

.dropdown-toggle:after {
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  margin: 0 !important;
}

/****** HEADER END ******/

/* body {
    opacity: 0;
    transition: opacity .5s ease-in-out;
}

body.loaded {
    opacity: 1;
    overflow: auto;
} */

/* HEROS START */
/* HEROS END */

/****** MAP START ******/
#map {
  height: 700px;
  min-height: 600px;
}

#map.smaller {
  height: 500px;
}

.map {
  height: 700px;
  overflow: hidden;
}

.gm-style .gm-style-iw {
  font-size: 14px !important;
}

.gm-style .gm-style-iw-c {
  padding: 0 !important;
  background-color: var(--white) !important;
  border-radius: 0 !important;
}

.gm-style .gm-style-iw-d {
  overflow: hidden !important;
  padding: calc(2rem - 25px) 2rem 2rem;
  background-color: var(--white) !important;
}

.gm-ui-hover-effect {
  top: 0px;
  right: 0px;
  width: 35px !important;
  height: 35px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.gm-style .gm-style-iw-tc::after {
  background-color: var(--white) !important;
}

.gm-style .gm-style-iw-tc {
  filter: unset !important;
}

.gm-ui-hover-effect > span {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
}

/****** MAP END ******/

/* BUTTON START */
.button {
  width: 210px;
  height: 43px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: var(--transition-all);
  border-radius: 50rem;
}

.button.small {
  min-width: 130px !important;
  max-width: 130px !important;
  height: 30px !important;
}

.button-primary {
  background: transparent;
  text-transform: uppercase;
  border: 1px solid var(--white);
  color: var(--text-white);
}

.button-primary:hover {
  background: var(--tertiary);
  border: 1px solid var(--tertiary);
  color: var(--text-white);
}

.button-secondary {
  background: transparent;
  text-transform: uppercase;
  border: 1px solid var(--text-primary);
  color: var(--text-primary);
}

.button-secondary:hover {
  background: var(--tertiary);
  border: 1px solid var(--tertiary);
  color: var(--text-white);
}

.button-tertiary {
  background: var(--tertiary);
  text-transform: uppercase;
  border: 1px solid var(--tertiary);
  color: var(--text-white);
}

.button-tertiary:hover {
  background: transparent;
  border: 1px solid var(--text-primary);
  color: var(--text-primary);
}

.button-outline {
  text-transform: uppercase;
  letter-spacing: 2px;
  transition: var(--transition-all);
}

.button-outline:hover {
  color: var(--tertiary) !important;
  border-color: var(--tertiary) !important;
}

/* BUTTON END */

/****** SWIPER START ******/

/****** SWIPER END ******/

/* CARD START */

/* CARD END */

/* STYLE CUSTOM */

.bg-img {
  background-image: url("/images/body-bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.visibility-hidden {
  visibility: hidden;
}
