:root {
  /* my var */
  /*-------------*/
  --body-bg: var(--2-color);
  --body-color: var(--1-color);
  /*-------------*/
  --1-rem: 16px;
  --body-fw: 400;
  /*-------------*/
  --body-ff: 'Nexa', sans-serif;
  --2-ff: 'Realmost', sans-serif;
  /*-------------*/
  --body-lh: 1.6;
  /*-------------*/
  --text-left: left;
  --text-center: center;
  --text-right: right;
  /*-------------*/
  --0-ls: 0px;
  /*-------------*/
  --1-color: #001E2B;
  --1-color-rgb: 0 30 43;
  --2-color: #E8E4DD;
  --2-color-rgb: 232 228 221;
  --3-color: #EEF7F8;
  --3-color-rgb: 238 247 248;
  --4-color: #201D1D;
  --4-color-rgb: 32 29 29;
  --5-color: #CE784E;
  --5-color-rgb: 206 120 78;
  --6-color: #ADADAD;
  --6-color-rgb: 173 173 173;
  --7-color: #D7EBEF;
  --7-color-rgb: 215 235 239;
  --8-color: #72999D;
  --8-color-rgb: 114 153 157;
  --9-color: #C9D0C3;
  --9-color-rgb: 201 208 195;
  --10-color: #474C55; 
  --10-color-rgb: 71 76 85;
  --11-color: #D8CBB8;
  --11-color-rgb: 216 203 184;
  --12-color: #4A1E21;
  --12-color-rgb: 74 30 33;
  --13-color: #778A68;
  --13-color-rgb: 119 138 104;
  --14-color: #71989B;
  --15-color: #2F7F93;
  --15-color-rgb: 47 127 147;
  --16-color: #E7DED0;
  --16-color-rgb: 231 222 208;
  --black-color: #000000;
  --black-color-rgb: 0 0 0;
  --white-color: #FFFFFF;
  --white-color-rgb: 255 255 255;
  --light-text-color: #FFFFFF;
  --light-bg-color: #FFFFFF;
  --logo-color-1: var(--14-color);
  --logo-color-2: var(--5-color);
  /*-------------*/
  --heading-color: inherit;
  --heading-color-second: var(--heading-color);
  --heading-border: none;
  --link-color: inherit;
  --btn-main-color: var(--4-color);
  --btn-main-bg: var(--5-color);
  --btn-secondary-color: var(--white-color);
  --btn-secondary-bg: var(--1-color);
  --btn-simple-color: var(--2-color);
  --btn-simple-bg: var(--5-color);
  --btn-simple-second-color: var(--2-color);
  --btn-simple-second-bg: var(--1-color);
  --link-bg: none;
  --link-border: none;
  --zoom: 1;
  --button-outline: none;
  --contrast-2-color: var(--body-bg);
  /*-------------*/
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  /*-------------*/
  --banner_h: 64px;
  /*-------------*/
  --header-1-color: var(--body-color);
  --header-2-color: var(--body-bg);
  --header-3-color: transparent;
  /*-------------*/
  /* desktop vars */
  --header-1-hover: var(--body-color);
  --header-2-hover: var(--body-bg);
  /*------------------*/
  --height: 100%;
  --height-content: 100%;
  --header-banner-h: 34px;
  --header-height: 95px;
  /*--------------------*/
  --vh: 1vh;
  --vh-2: 1vh;
  --window-height: calc(var(--vh, 1vh) * 100);
  --window-height-mob: calc(var(--vh-2, 1vh) * 100);
  /*--------------------*/
  --animation-default: 0.25s ease-in-out;
  --animation-primary: 0.4s cubic-bezier(0.7, 0, 0.3, 1);
  --animation-fast: 0.3s cubic-bezier(0.7, 0, 0.3, 1);
  --animation-smooth: 0.6s cubic-bezier(0.7, 0, 0.3, 1);
  --animation-slow: 0.8s cubic-bezier(0.7, 0, 0.3, 1);
  --animation-power4Out: 1.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  --power4Out: cubic-bezier(0.165, 0.84, 0.44, 1);
  --fluid-padding-offset-x: 60px;
}
@media (min-width: 1900px) {
    :root {
    --header-banner-h: 36px;
    --header-height: 94px;
  }
}
@media (max-width: 1399.9px) {
  :root {
    --header-banner-h: 38px;
    --header-height: 84px;
  }
}
@media (max-width: 991.9px) {
  :root {
    --header-banner-h: 0;
  }
}
@media (max-width: 575.9px) {
  :root {
    --header-height: 55px;
    --1-rem: 15px;
  }
}