@charset "UTF-8";



@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");



@import url("https://fonts.googleapis.com/css2?family=Alex+Brush&display=swap");



/* All Css Variables Start */

@font-face {

  font-family: "quentin";

  src: url("/assets/text-font/Quentin.otf") format("trueType");

  font-weight: normal;

  font-style: normal;

}



:root {

  --heading-font: "Josefin Sans", sans-serif;

  --body-font: "Poppins", sans-serif;

  --third--heading: "Alex Brush", cursive;

  --heading-one: clamp(1.5rem, 2.8vw + 1rem, 3.75rem);

  --heading-two: clamp(1.375rem, 1.7vw + 1rem, 2.5rem);

  --heading-three: clamp(1.25rem, 0.8vw + 1rem, 1.875rem);

  --heading-four: clamp(1.125rem, 0.5vw + 1rem, 1.5rem);

  --heading-five: clamp(1.0625rem, 0.3vw + 1rem, 1.25rem);

  --heading-six: 1.2rem;

  --heading-h: 216;

  --heading-s: 28%;

  --heading-l: 10%;

  --heading-color: var(--heading-h) var(--heading-s) var(--heading-l);

  --white: 0 0% 100%;

  --light-h: 0;

  --light-s: 0%;

  --light-l: 78%;

  --light: var(--light-h) var(--light-s) var(--light-l);

  --black-h: 0;

  --black-s: 0%;

  --black-l: 0%;

  --black: var(--black-h) var(--black-s) var(--black-l);

  --marque-bg: 224, 22%, 14%;

  --cards-bg: 240, 79%, 22%;

  --body-color: 0, 0%, 100%;

  --border-color: 240, 100%, 17%;

  --background: 0, 0%, 97%;

  --footer-bg: 36, 76%, 10%;

  --border-radius: 16px;

  --border-radius-sm: 4px;

  --lemon-light: 164, 60%, 90%;

  --lemon-dark: 148, 100%, 50%;

  --yellow-dark: 58, 100%, 50%;

  --pink-light: 281, 100%, 95%;

  --pink-dark: 295, 100%, 50%;

  --cyan-light: 203, 100%, 91%;

  --cyan-dark: 203, 100%, 91%;

  --blue-light: 221, 100%, 91%;

  --blue-dark: 221, 100%, 91%;

  --star-color: 45, 100%, 50%;

  --hero-bg: 221, 94%, 93%;

  --header-box-shadow: 0px -1px 15px 3px hsl(var(--black) / 0.3);

  --mobile-box-shadow: 0px -1px 5px 0px hsl(var(--black) / 0.92);

  --box-shadow: 0px 2px 15px hsl(var(--black) / 0.05);

  --gradient-bg: linear-gradient(95.26deg,

      hsl(var(--base)) 0%,

      hsl(var(--secondary)) 100%);

  --card-bg: hsl(240, 1%, 15%);

  --dark-bg: 240, 11%, 14%;

  --section-bg: 0, 0%, 98%;

  --header-bg: hsl(240, 1%, 15%);

  --header--bg: hsl(0, 0%, 11.8%);

  --base-light-h: 152;

  --base-light-s: 100%;

  --base-light-l: 50%;

  --base-light: var(--base-light-h) var(--base-light-s) var(--base-light-l);

  --base-component-h: 213;

  --base-component-s: 100%;

  --base-component-l: 17%;

  --base-component: var(--base-component-h) var(--base-component-s) var(--base-component-l);

  --base-h: 198;

  --base-s: 94%;

  --base-l: 60%;

  --base: var(--base-h) var(--base-s) var(--base-l);

  --base-d-100: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.1);

  --base-d-200: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.2);

  --base-d-300: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.3);

  --base-d-400: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.4);

  --base-d-500: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.5);

  --base-d-600: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.6);

  --base-d-700: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.7);

  --base-d-700: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.7);

  --base-d-800: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.8);

  --base-d-800: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.8);

  --base-d-900: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.9);

  --base-l-100: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.1);

  --base-l-200: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.2);

  --base-l-300: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.3);

  --base-l-400: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.4);

  --base-l-500: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.5);

  --base-l-600: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.6);

  --base-l-700: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.7);

  --base-l-800: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.8);

  --base-l-900: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.9);

  --base-two-h: 12;

  --base-two-s: 96%;

  --base-two-l: 59%;

  --base-two: var(--base-two-h) var(--base-two-s) var(--base-two-l);

  --secondary-h: 208;

  --secondary-s: 7%;

  --secondary-l: 46%;

  --secondary: var(--secondary-h) var(--secondary-s) var(--secondary-l);

  --secondary-d-100: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.1);

  --secondary-d-200: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.2);

  --secondary-d-300: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.3);

  --secondary-d-400: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.4);

  --secondary-d-500: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.5);

  --secondary-l-100: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.1);

  --secondary-l-200: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.2);

  --secondary-l-300: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.3);

  --secondary-l-400: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.4);

  --secondary-l-500: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.5);

  --background-gradient: linear-gradient(45deg,

      hsl(var(--base)),

      hsl(var(--base-two)));

  --dark-h: 210;

  --dark-s: 11%;

  --dark-l: 15%;

  --dark: var(--dark-h) var(--dark-s) var(--dark-l);

  --dark-d-100: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.1);

  --dark-d-200: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.2);

  --dark-d-300: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.3);

  --dark-d-400: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.4);

  --dark-d-500: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.5);

  --dark-l-100: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.1);

  --dark-l-200: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.2);

  --dark-l-300: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.3);

  --dark-l-400: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.4);

  --dark-l-500: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.5);

  --primary-h: 211;

  --primary-s: 100%;

  --primary-l: 50%;

  --primary: var(--primary-h) var(--primary-s) var(--primary-l);

  --primary-d-100: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.1);

  --primary-d-200: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.2);

  --primary-d-300: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.3);

  --primary-d-400: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.4);

  --primary-d-500: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.5);

  --primary-l-100: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.1);

  --primary-l-200: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.2);

  --primary-l-300: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.3);

  --primary-l-400: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.4);

  --primary-l-500: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.5);

  --success-h: 123;

  --success-s: 46%;

  --success-l: 34%;

  --success: var(--success-h) var(--success-s) var(--success-l);

  /*=== Success Darken ===*/

  --success-d-100: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.1);

  --success-d-200: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.2);

  --success-d-300: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.3);

  --success-d-400: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.4);

  --success-d-500: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.5);

  /*=== Success Lighten ===*/

  --success-l-100: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.1);

  --success-l-200: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.2);

  --success-l-300: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.3);

  --success-l-400: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.4);

  --success-l-500: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.5);

  --danger-h: 0;

  --danger-s: 65%;

  --danger-l: 51%;

  --danger: var(--danger-h) var(--danger-s) var(--danger-l);

  /*=== Danger Darken ===*/

  --danger-d-100: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.1);

  --danger-d-200: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.2);

  --danger-d-300: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.3);

  --danger-d-400: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.4);

  --danger-d-500: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.5);

  /*=== danger Lighten ===*/

  --danger-l-100: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.1);

  --danger-l-200: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.2);

  --danger-l-300: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.3);

  --danger-l-400: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.4);

  --danger-l-500: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.5);

  --warning-h: 27;

  --warning-s: 98%;

  --warning-l: 47%;

  --warning: var(--warning-h) var(--warning-s) var(--warning-l);

  /*=== Warning Darken ===*/

  --warning-d-100: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.1);

  --warning-d-200: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.2);

  --warning-d-300: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.3);

  --warning-d-400: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.4);

  --warning-d-500: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.5);

  /*===  Warning Lighten ===*/

  --warning-l-100: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.1);

  --warning-l-200: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.2);

  --warning-l-300: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.3);

  --warning-l-400: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.4);

  --warning-l-500: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.5);

  --info-h: 187;

  --info-s: 100%;

  --info-l: 42%;

  --info: var(--info-h) var(--info-s) var(--info-l);

  /*=== Info Darken ===*/

  --info-d-100: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.1);

  --info-d-200: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.2);

  --info-d-300: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.3);

  --info-d-400: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.4);

  --info-d-500: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.5);

  /*=== nfo Lighten ===*/

  --info-l-100: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.1);

  --info-l-200: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.2);

  --info-l-300: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.3);

  --info-l-400: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.4);

  --info-l-500: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.5);

  --violet-h: 251;

  --violet-s: 96%;

  --violet-l: 63%;

  --violet: var(--violet-h) var(--violet-s) var(--violet-l);

  /*=== Violet Darken ===*/

  --violet-d-100: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.1);

  --violet-d-200: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.2);

  --violet-d-300: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.3);

  --violet-d-400: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.4);

  --violet-d-500: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.5);

  /*=== Violet Lighten ===*/

  --violet-l-100: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.1);

  --violet-l-200: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.2);

  --violet-l-300: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.3);

  --violet-l-400: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.4);

  --violet-l-500: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.5);

  --yellow-h: 54;

  --yellow-s: 100%;

  --yellow-l: 62%;

  --yellow: var(--yellow-h) var(--yellow-s) var(--yellow-l);

  --yellow-d-100: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.1);

  --yellow-d-200: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.2);

  --yellow-d-300: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.3);

  --yellow-d-400: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.4);

  --yellow-d-500: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.5);

  --yellow-l-100: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.1);

  --yellow-l-200: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.2);

  --yellow-l-300: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.3);

  --yellow-l-400: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.4);

  --yellow-l-500: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.5);

  --dark-card-bg: rgba(148, 148, 148, 0.1);

  /* orange color */

  --orange-h: 36;

  --orange-s: 100%;

  --orange-l: 50%;

  --orange: var(--orange-h) var(--orange-s) var(--orange-l);

  /* grey color */

  --grey-h: 0;

  --grey-s: 0%;

  --grey-l: 62%;

  --grey: var(--grey-h) var(--grey-s) var(--grey-l);

  /* purple color */

  --purple-h: 291;

  --purple-s: 64%;

  --purple-l: 42%;

  --purple: var(--purple-h) var(--purple-s) var(--purple-l);

  /* blue color */

  --blue-h: 224;

  --blue-s: 98%;

  --blue-l: 52%;

  --blue: var(--blue-h) var(--blue-s) var(--blue-l);

  /* pink color */

  --pink-h: 340;

  --pink-s: 82%;

  --pink-l: 52%;

  --pink: var(--pink-h) var(--pink-s) var(--pink-l);

}



::-webkit-scrollbar {

  width: 6px;

}



::-webkit-scrollbar-track {

  box-shadow: inset 0 0 5px hsl(var(--base) / 0.2);

}



::-webkit-scrollbar-thumb {

  background: hsl(var(--base) / 0.7);

}



::-webkit-scrollbar-thumb:hover {

  background: hsl(var(--base));

}



.bg--img {

  background-size: cover !important;

  background-repeat: no-repeat !important;

  background-position: center !important;

}



.bg--img-2 {

  background-repeat: no-repeat !important;

  background-position: top !important;

  background-size: cover !important;

}



.bg--transparent {

  background: transparent !important;

}



.fit--img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.position--center {

  top: 50%;

  left: 50%;

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

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

}



.overflow--hidden {

  overflow: hidden;

}



.cursor-pointer {

  cursor: pointer;

}



.text--capitalize {

  text-transform: capitalize !important;

}



.container--wrap {

  padding: 0px 40px;

}



.tap--balance {

  display: flex;

  justify-content: flex-start;

  align-items: center;

  flex-direction: row;

  gap: 8px;

  background-color: hsl(var(--base) / 0.1);

  padding: 16px 12px 16px 8px;

  border-radius: 8px;

  width: 194px;

  transition: 3s ease;

  transition: flex-direction 0.3s ease;

  position: relative;

}



.tap--balance.goLeft .tap-circle--icon {

  -webkit-animation: leftRight 0.9s forwards;

  animation: leftRight 0.9s forwards;

}



.tap--balance.goRight .tap-circle--icon {

  -webkit-animation: rightLeft 0.9s forwards;

  animation: rightLeft 0.9s forwards;

}



.tap--balance .tap-circle--icon {

  width: 30px;

  height: 30px;

  border-radius: 50%;

  background-color: hsl(var(--base));

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

  display: flex;

  justify-content: center;

  align-items: center;

  flex-shrink: 0;

  position: absolute;

  z-index: 1;

  cursor: pointer;

}



@keyframes rightLeft {

  0% {

    right: 0%;

  }



  100% {

    right: 80%;

  }

}



@keyframes leftRight {

  0% {

    left: 0%;

  }



  100% {

    left: 80%;

  }

}



.tap--balance .op--0 {

  opacity: 0;

  transition: 0.1s linear;

}



.tap--balance .textt {

  font-size: 16px;

  font-weight: 500;

  cursor: pointer;

  text-align: center;

  margin-left: 26px;

}



.tap--balance .balance {

  font-size: 16px;

  font-weight: 500;

  cursor: pointer;

  text-align: center;

}



.transition-animation {

  animation-name: fadeInOut;

  animation-duration: 2s;

}



.refer-link--wrap {

  border: 1px dashed hsl(var(--base-two) / 0.7);

  padding: 8px 12px;

  padding-right: 50px;

  border-radius: 8px;

  position: relative;

}



.refer-link--wrap .text {

  font-size: 16px;

  font-weight: 400;

}



.refer-link--wrap .copy--btn {

  position: absolute;

  top: 4px;

  right: 10px;

  font-size: 18px;

  color: hsl(var(--base-two));

}



.fade-animation {

  animation-name: fadeInOut;

  animation-duration: 2s;

}



.circle--icon {

  width: 30px;

  height: 30px;

  border-radius: 50%;

  background-color: hsl(var(--base));

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

  display: flex;

  justify-content: center;

  align-items: center;

  flex-shrink: 0;

}



.filter--box {

  top: 120px;

}



@media (max-width: 1920px) and (min-width: 1799px) {

  .xxxl {

    flex: 0 0 auto;

    width: 16.66666667%;

  }

}



@media (max-width: 1800px) and (min-width: 1562px) {

  .xxxl {

    flex: 0 0 auto;

    width: 20%;

  }

}



@media (max-width: 1563px) and (min-width: 1440px) {

  .xxxl {

    width: 25% !important;

  }

}



.offcanvas {

  background: hsl(var(--white)) !important;

  width: 300px !important;

}



.offcanvas .offcanvas-header .btn-close {

  opacity: 1;

}



.offcanvas .offcanvas-header .logo {

  max-width: 50%;

}



.offcanvas .offcanvas-body {

  padding: 32px 0px;

}



.offcanvas .offcanvas-body .user-info {

  padding: 0px 16px;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  gap: 12px;

}



.offcanvas .offcanvas-body .user-info a h4 {

  margin: 0px;

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

}



.offcanvas .offcanvas-body .user-info .user-thumb {

  height: 80px;

  width: 80px;

  border-radius: 50%;

  z-index: 99;

}



.offcanvas .offcanvas-body .user-info .user-thumb img {

  height: 70px;

  width: 70px;

  border-radius: 50%;

  object-fit: cover;

}



.offcanvas .offcanvas-body .side-Nav {

  padding: 0px 24px;

}



.offcanvas .offcanvas-body .side-Nav li {

  position: relative;

  border-bottom: 1px solid hsl(var(--base) / 0.2);

}



.offcanvas .offcanvas-body .side-Nav li button {

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

  height: 50px;

}



.offcanvas .offcanvas-body .side-Nav li:last-child a {

  border-bottom: none !important;

}



.offcanvas .offcanvas-body .side-Nav li a {

  display: flex;

  align-items: center;

  font-size: 16px;

  gap: 16px;

  height: 50px;

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

}



.offcanvas .offcanvas-body .side-Nav li a p {

  font-size: 16px;

}



.offcanvas .offcanvas-body .side-Nav li .active {

  color: hsl(var(--base));

}



.offcanvas .search-box {

  padding: 24px 0px;

  display: flex;

  justify-content: center;

}



.offcanvas .search-box .form--control {

  font-weight: 500;

  outline: none;

  width: 70%;

  padding: 10px 44px;

  line-height: 1;

}



.offcanvas .search-box .search-btn {

  padding: 10px 20px;

}



@media (max-width: 770px) {

  .offcanvas .search-box {

    padding: 16px 12px;

    display: flex;

    justify-content: center;

  }



  .offcanvas .search-box .form--control {

    font-weight: 500;

    outline: none;

    width: 70%;

    padding: 10px !important;

    background-color: hsl(var(--body-color) / 0.1);

    border: 1px solid hsl(var(--base));

    padding-right: 0px !important;

    line-height: 1;

  }



  .offcanvas .search-box .search-btn {

    border: 1px solid hsl(var(--base));

    padding: 10px 10px !important;

    color: hsl(var(--base));

  }

}



.owner--profile .profile--banner {

  width: 100%;

  height: 368px;

}



.owner--profile .profile--info {

  margin-top: -100px;

}



.owner--profile .profile--info .thumb--wrap {

  border: 28px solid hsl(var(--body-color));

}



.owner--profile .profile--info .thumb--wrap img {

  width: 166px;

  height: 166px;

}



.section--border {

  position: relative;

  width: 64.5%;

  height: 1px;

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

  top: 50%;

  left: 50%;

  bottom: -100px;

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

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

}



.section--border::after {

  content: "";

  position: absolute;

  bottom: 10px;

  left: -30px;

  width: 127px;

  height: 1px;

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

}



.section--border::before {

  content: "";

  position: absolute;

  bottom: -10px;

  right: -30px;

  width: 127px;

  height: 1px;

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

}



.profile-menu--wrap {

  padding-bottom: 8px;

}



.profile-menu--wrap li a.active {

  color: hsl(var(--base));

  position: relative;

}



.profile-menu--wrap li a.active::after {

  content: "";

  position: absolute;

  left: 0px;

  bottom: -8px;

  width: 100%;

  height: 2px;

  background-color: hsl(var(--base));

}



.portfolio-item--wrap .thumb--wrap {

  width: 100%;

  height: 352px;

}



.lng--dropdown {

  left: -42px !important;

  min-width: 122px !important;

}



.lng--dropdown .flag--img {

  width: 23.467px;

  height: 23.467px;

  flex-shrink: 0;

  border-radius: 50%;

  margin-right: 4px;

}



.feature--section .bg--element {

  right: 0;

  bottom: 0;

}



.feature--section .bg--element img {

  opacity: 0.5;

}



.feature--section .bg--element-two {

  top: 0;

  left: 0;

}



.feature--section .bg--element-two img {

  opacity: 0.5;

}



.service-key--box .title {

  margin-bottom: -5px !important;

}



.service-key--box .description {

  margin-left: 30px;

}



.location--section .bg--element {

  top: 10%;

  left: 0;

}



.location--section .bg--element-two {

  bottom: 0;

  right: 0;

}



.location--section .bg--element-two img {

  opacity: 0.5;

}



.offer--section {

  overflow: hidden;

}



.offer--section .bg--element-two {

  top: 5%;

  left: 0%;

}



.offer--section .bg--element-two img {

  opacity: 0.5;

}



.testimonial-section .bg--element {

  bottom: 0;

  right: 0;

  z-index: -1;

}



.testimonial-section .bg--element img {

  opacity: 0.1;

}



.testimonial-section .bg--element-two {

  top: 0;

  left: 0;

}



.testimonial-section .bg--element-two img {

  opacity: 0.1;

}



.bg--white {

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

}



.bg--black {

  background-color: hsl(var(--black)) !important;

}



.bg--dark {

  background-color: hsl(var(--dark-bg)) !important;

}



.bg--base {

  background-color: hsl(var(--base)) !important;

}



.bg--base-two {

  background-color: hsl(var(--base-two)) !important;

}



.bg--primary {

  background-color: hsl(var(--primary)) !important;

}



.bg--secondary {

  background-color: hsl(var(--secondary)) !important;

}



.bg--success {

  background-color: hsl(var(--success)) !important;

}



.bg--danger {

  background-color: hsl(var(--danger)) !important;

}



.bg--warning {

  background-color: hsl(var(--warning)) !important;

}



.bg--info {

  background-color: hsl(var(--info)) !important;

}



.bg--violet {

  background-color: hsl(var(--violet)) !important;

}



.bg--yellow {

  background-color: hsl(var(--yellow)) !important;

}



.bg--orange {

  background-color: hsl(var(--orange)) !important;

}



.bg--grey {

  background-color: hsl(var(--grey)) !important;

}



.bg--purple {

  background-color: hsl(var(--purple)) !important;

}



.bg--blue {

  background-color: hsl(var(--blue)) !important;

}



.bg--pink {

  background-color: hsl(var(--pink)) !important;

}



.bg--transparent {

  background-color: transparent !important;

}



.section--bg {

  background-color: hsl(var(--section-bg)) !important;

}



.hover-bg--white:hover {

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

}



.hover-bg--black:hover {

  background-color: hsl(var(--black)) !important;

}



.hover-bg--base:hover {

  background-color: hsl(var(--base)) !important;

}



.hover-bg--primary:hover {

  background-color: hsl(var(--primary)) !important;

}



.hover-bg--secondary:hover {

  background-color: hsl(var(--secondary)) !important;

}



.hover-bg--success:hover {

  background-color: hsl(var(--success)) !important;

}



.hover-bg--danger:hover {

  background-color: hsl(var(--danger)) !important;

}



.hover-bg--warning:hover {

  background-color: hsl(var(--warning)) !important;

}



.hover-bg--info:hover {

  background-color: hsl(var(--info)) !important;

}



.hover-bg--violet:hover {

  background-color: hsl(var(--violet)) !important;

}



.hover-bg--yellow:hover {

  background-color: hsl(var(--yellow)) !important;

}



.hover-bg--teal:hover {

  background-color: hsl(var(--teal)) !important;

}



.hover-bg--orange:hover {

  background-color: hsl(var(--orange)) !important;

}



.hover-bg--grey:hover {

  background-color: hsl(var(--grey)) !important;

}



.hover-bg--purple:hover {

  background-color: hsl(var(--purple)) !important;

}



.hover-bg--blue:hover {

  background-color: hsl(var(--blue)) !important;

}



.hover-bg--pink:hover {

  background-color: hsl(var(--pink)) !important;

}



.card--bg {

  background-color: hsl(var(--cards-bg)) !important;

}



.bg--base1 {

  background-color: hsl(var(--base) / 0.1) !important;

}



.text--base {

  color: hsl(var(--base)) !important;

}



.text--base-two {

  color: hsl(var(--base-two)) !important;

}



.text--white {

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

}



.text--white7 {

  color: hsl(var(--white) / 0.7) !important;

}



.text--primary {

  color: hsl(var(--primary)) !important;

}



.text--secondary {

  color: hsl(var(--secondary)) !important;

}



.text--success {

  color: hsl(var(--success)) !important;

}



.text--danger {

  color: hsl(var(--danger)) !important;

}



.text--warning {

  color: hsl(var(--warning)) !important;

}



.text--info {

  color: hsl(var(--info)) !important;

}



.text--violet {

  color: hsl(var(--violet)) !important;

}



.text--yellow {

  color: hsl(var(--yellow)) !important;

}



.text--teal {

  color: hsl(var(--teal)) !important;

}



.text--orange {

  color: hsl(var(--orange)) !important;

}



.text--grey {

  color: hsl(var(--grey)) !important;

}



.text--purple {

  color: hsl(var(--purple)) !important;

}



.text--blue {

  color: hsl(var(--blue)) !important;

}



.text--pink {

  color: hsl(var(--pink)) !important;

}



.text--black {

  color: hsl(var(--black)) !important;

}



.text--black7 {

  color: hsl(var(--black) / 0.7) !important;

}



.text--black8 {

  color: hsl(var(--black) / 0.8) !important;

}



.my-120 {

  margin-top: 120px;

  margin-bottom: 120px;

}



.my-80 {

  margin-top: 40px;

  margin-bottom: 40px;

}



.my-60 {

  margin-top: 30px;

  margin-bottom: 30px;

}



.my-40 {

  margin-top: 30px;

  margin-bottom: 30px;

}



.mt-100 {

  margin-top: 100px;

}



.mt-120 {

  margin-top: 120px;

}



.mt-60 {

  margin-top: 60px;

}



.mt-25 {

  margin-top: 25px;

}



.mt-80 {

  margin-top: 80px;

}



.mt-40 {

  margin-top: 40px;

}



.mb-120 {

  margin-bottom: 120px;

}



.mb-110 {

  margin-bottom: 110px;

}



.mb-100 {

  margin-bottom: 100px;

}



.mb-80 {

  margin-bottom: 80px;

}



.mb-60 {

  margin-bottom: 60px;

}



.mb-50 {

  margin-bottom: 50px;

}



.mb-40 {

  margin-bottom: 40px;

}



.mb-30 {

  margin-bottom: 30px;

}



.mb-20 {

  margin-bottom: 20px;

}



@media (max-width: 992px) {

  .my-120 {

    margin-top: 60px;

    margin-bottom: 60px;

  }



  .mt-100 {

    margin-top: 0px;

  }



  .mt-120 {

    margin-top: 50px;

  }



  .mb-120 {

    margin-bottom: 80px;

  }



  .mb-100 {

    margin-bottom: 60px;

  }



  .mb-110 {

    margin-bottom: 70px;

  }



  .my-60 {

    margin-top: 40px;

    margin-bottom: 40px;

  }



  .mt-60 {

    margin-top: 40px;

  }



  .mt-25 {

    margin-top: 20px;

  }



  .mb-60 {

    margin-bottom: 40px;

  }



  .my-80 {

    margin-top: 60px;

    margin-bottom: 60px;

  }



  .mt-80 {

    margin-top: 60px;

  }



  .mb-80 {

    margin-bottom: 60px;

  }



  .my-40 {

    margin-top: 30px;

    margin-bottom: 30px;

  }



  .mt-40 {

    margin-top: 30px;

  }



  .mb-40 {

    margin-bottom: 30px;

  }



  .mb-20 {

    margin-bottom: 15px;

  }

}



/* Base Styles */

.py-30 {

  padding-top: 30px;

  padding-bottom: 30px;

}



.py-40 {

  padding-top: 40px;

  padding-bottom: 40px;

}



.py-50 {

  padding-top: 50px;

  padding-bottom: 50px;

}



.py-60 {

  padding-top: 60px;

  padding-bottom: 60px;

}



.py-70 {

  padding-top: 70px;

  padding-bottom: 70px;

}



.py-80 {

  padding-top: 80px;

  padding-bottom: 80px;

}



.py-100 {

  padding-top: 100px;

  padding-bottom: 100px;

}



.py-110 {

  padding-top: 110px;

  padding-bottom: 110px;

}



.py-115 {

  padding-top: 115px;

  padding-bottom: 115px;

}



.py-120 {

  padding-top: 120px;

  padding-bottom: 120px;

}



.py-155 {

  padding-top: 155px;

  padding-bottom: 155px;

}



.py-175 {

  padding-top: 175px;

  padding-bottom: 175px;

}



.py-180 {

  padding-top: 180px;

  padding-bottom: 180px;

}



.py-290 {

  padding-top: 290px;

  padding-bottom: 290px;

}



.pt-120 {

  padding-top: 120px;

}



.pt-80 {

  padding-top: 80px;

}



.pt-100 {

  padding-top: 100px !important;

}



.pt-60 {

  padding-top: 60px !important;

}



.pt-40 {

  padding-top: 40px;

}



.pt-30 {

  padding-top: 30px;

}



.pb-30 {

  padding-bottom: 30px;

}



.pb-40 {

  padding-bottom: 40px;

}



.pb-50 {

  padding-bottom: 50px;

}



.pb-60 {

  padding-bottom: 60px;

}



.pb-80 {

  padding-bottom: 80px;

}



.pb-100 {

  padding-bottom: 100px;

}



.pb-115 {

  padding-bottom: 115px;

}



.pb-120 {

  padding-bottom: 120px;

}



/* Media Queries */

@media (max-width: 1399px) {



  .py-100,

  .py-110,

  .py-115,

  .py-120,

  .py-155,

  .py-175,

  .py-180,

  .py-290 {

    padding-top: 80px;

    padding-bottom: 80px;

  }



  .py-175 {

    padding-top: 120px;

    padding-bottom: 120px;

  }



  .py-180 {

    padding-top: 130px;

    padding-bottom: 130px;

  }



  .py-290 {

    padding-top: 180px;

    padding-bottom: 180px;

  }



  .pb-100,

  .pb-115,

  .pb-120 {

    padding-bottom: 80px;

  }



  .pb-120 {

    padding-bottom: 100px;

  }



  .pb-40 {

    padding-bottom: 30px;

  }

}



@media (max-width: 1024px) {

  .py-290 {

    padding-top: 120px;

    padding-bottom: 120px;

  }



  .location__card .location__card-content .btn {

    opacity: 1 !important;

    visibility: visible !important;

  }

}



@media (max-width: 992px) {

  .py-40 {

    padding-top: 30px;

    padding-bottom: 30px;

  }



  .py-60 {

    padding-top: 100px;

    padding-bottom: 40px;

  }



  .py-80 {

    padding-top: 60px;

    padding-bottom: 60px;

  }



  .py-100,

  .py-290 {

    padding-top: 80px;

    padding-bottom: 80px;

  }



  .pt-120 {

    padding-top: 100px;

  }



  .pt-80 {

    padding-top: 60px;

  }



  .pt-100 {

    padding-top: 90px !important;

  }



  .pt-60 {

    padding-top: 50px;

  }



  .pt-40 {

    padding-top: 30px;

  }



  .pb-30 {

    padding-bottom: 25px;

  }



  .pb-60 {

    padding-bottom: 50px;

  }



  .pb-80 {

    padding-bottom: 60px;

  }

}



@media (max-width: 576px) {

  .py-40 {

    padding-top: 20px;

    padding-bottom: 20px;

  }



  .py-60 {

    padding-top: 90px;

    padding-bottom: 40px;

  }



  .py-80 {

    padding-top: 40px;

    padding-bottom: 40px;

  }



  .py-100,

  .py-110,

  .py-115,

  .py-120,

  .py-155,

  .py-175,

  .py-180,

  .py-290 {

    padding-top: 70px;

    padding-bottom: 70px;

  }



  .pt-120 {

    padding-top: 80px;

  }



  .pt-80 {

    padding-top: 50px;

  }



  .pt-100 {

    padding-top: 70px !important;

  }



  .pt-60 {

    padding-top: 40px;

  }



  .pt-40 {

    padding-top: 20px;

  }



  .pb-30 {

    padding-bottom: 20px;

  }



  .pb-40 {

    padding-bottom: 30px;

  }



  .pb-60 {

    padding-bottom: 40px;

  }



  .pb-80 {

    padding-bottom: 40px;

  }



  .pb-100 {

    padding-bottom: 70px;

  }



  .pb-115,

  .pb-120 {

    padding-bottom: 70px;

  }

}



body {

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

  color: hsl(var(--heading-color));

  word-break: break-word;

  background-color: hsl(var(--body-color));

  min-height: 100vh;

  display: flex;

  flex-direction: column;

  overflow-x: hidden;

}



p {

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

  font-size: 16px;

  margin: 0;

  font-weight: 400;

  word-break: break-word;

  color: hsl(var(--black) / 0.7);

}



h1,

h2,

h3,

h4,

h5,

h6 {

  margin: 0 0 15px 0;

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

  color: hsl(var(--heading-color));

  line-height: 1.1;

  word-break: break-word;

}



@media screen and (max-width: 770px) {



  h1,

  h2,

  h3,

  h4,

  h5,

  h6 {

    margin: 0 0 10px 0;

  }

}



h1 {

  font-size: var(--heading-one);

  font-weight: 700;

}



h2 {

  font-size: var(--heading-two);

  font-weight: 600;

  margin: 0px;

}



h3 {

  font-size: var(--heading-three);

  font-weight: 600;

}



h4 {

  font-size: var(--heading-four);

  font-weight: 500;

}



h5 {

  font-size: var(--heading-five);

  font-weight: 500;

}



h6 {

  font-size: 20px;

  font-weight: 500;

}



@media (max-width: 768px) {

  h6 {

    font-size: 14px !important;

  }

}



h1>a,

h2>a,

h3>a,

h4>a,

h5>a,

h6>a {

  font-weight: 400;

  transition: 0.2s linear;

  line-height: 1.4;

  word-break: break-word;

  color: hsl(var(--heading-color));

}



a {

  display: inline-block;

  transition: 0.2s linear;

  text-decoration: none;

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

  color: hsl(var(--heading-color));

}



a:hover {

  color: hsl(var(--base));

}



img {

  max-width: 100%;

  height: auto;

  vertical-align: middle;

}



select {

  cursor: pointer;

}



ul,

ol {

  padding: 0;

  margin: 0;

  list-style: none;

}



*:focus {

  outline: none;

}



button {

  cursor: pointer;

  border: none;

  background-color: transparent;

}



button:focus {

  outline: none;

}



.form-select:focus {

  outline: 0;

  box-shadow: none;

}



.text--upper {

  text-transform: uppercase;

}



.text--xsm {

  font-size: 8px !important;

}



.text--sm {

  font-size: 12px !important;

}



.fs--14 {

  font-size: 14px !important;

}



.fs--16 {

  font-size: 16px !important;

}



.fs--18 {

  font-size: 18px !important;

}



.fs--20 {

  font-size: 20px !important;

}



.fs--22 {

  font-size: 22px !important;

}



.fs--24 {

  font-size: 24px !important;

}



.fs--26 {

  font-size: 26px !important;

}



.fs--28 {

  font-size: 28px !important;

}



.fs--30 {

  font-size: 30px !important;

}



.fs--32 {

  font-size: 32px !important;

}



.fs--34 {

  font-size: 34px !important;

}



.fs--36 {

  font-size: 36px !important;

}



.fs--38 {

  font-size: 38px !important;

}



.fs--40 {

  font-size: 40px !important;

}



.fs--42 {

  font-size: 42px !important;

}



.fs--44 {

  font-size: 44px !important;

}



.fs--46 {

  font-size: 46px !important;

}



.fs--48 {

  font-size: 48px !important;

}



.fs--50 {

  font-size: 50px !important;

}



.fs--52 {

  font-size: 52px !important;

}



.fs--54 {

  font-size: 54px !important;

}



.fs--56 {

  font-size: 56px !important;

}



.fs--58 {

  font-size: 58px !important;

}



.fs--60 {

  font-size: 60px !important;

}



.fs--62 {

  font-size: 62px !important;

}



.fs--64 {

  font-size: 64px !important;

}



.fs--66 {

  font-size: 66px !important;

}



.fs--68 {

  font-size: 68px !important;

}



.fs--70 {

  font-size: 70px !important;

}



.fw--100 {

  font-weight: 300 !important;

}



.fw--200 {

  font-weight: 300 !important;

}



.fw--300 {

  font-weight: 300 !important;

}



.fw--400 {

  font-weight: 400 !important;

}



.fw--500 {

  font-weight: 500 !important;

}



.fw--600 {

  font-weight: 600 !important;

}



.fw--700 {

  font-weight: 700 !important;

}



.fw--800 {

  font-weight: 800 !important;

}



.fw--900 {

  font-weight: 900 !important;

}



.body--font {

  font-family: var(--body-font) !important;

}



.heading--font {

  font-family: var(--heading-font) !important;

}



.third--font {

  font-family: var(--third--heading) !important;

}



.text--underline {

  text-decoration: underline !important;

}



.digital--number-font {

  font-family: var(--digit-font) !important;

}



@media (max-width: 767px) {

  .fw--600 {

    font-weight: 500 !important;

  }



  .fw--700 {

    font-weight: 500 !important;

  }



  .fw--800 {

    font-weight: 500 !important;

  }



  .fw--900 {

    font-weight: 500 !important;

  }

}



@media (max-width: 575px) {

  .fs--32 {

    font-size: 26px !important;

  }

}



/* all gradient background here */

.gradient--bg-1 {

  background: var(--gradient-1);

}



.gradient--bg-2 {

  background: var(--gradient-2);

}



.gradient--bg-3 {

  background: var(--gradient-3);

}



.gradient--bg-4 {

  background: var(--gradient-4);

}



.gradient--bg-5 {

  background: var(--gradient-5);

}



.gradient--bg-6 {

  background: var(--gradient-6);

}



.gradient--bg-7 {

  background: var(--gradient-7);

}



.gradient--bg-8 {

  background: var(--gradient-8);

}



.gradient--bg-9 {

  background: var(--gradient-9);

}



.gradient--bg-10 {

  background: var(--gradient-10);

}



.gradient--bg-11 {

  background: var(--gradient-11);

}



.gradient--bg-12 {

  background: var(--gradient-12);

}



.gradient--bg-13 {

  background: var(--gradient-13);

}



.gradient--bg-14 {

  background: var(--gradient-14);

}



.gradient--bg-15 {

  background: var(--gradient-15);

}



.gradient--bg-16 {

  background: var(--gradient-16);

}



.gradient--bg-17 {

  background: var(--gradient-17);

}



.gradient--bg-18 {

  background: var(--gradient-18);

}



.gradient--bg-19 {

  background: var(--gradient-19);

}



.gradient--bg-20 {

  background: var(--gradient-20);

}



.gradient--bg-21 {

  background: var(--gradient-21);

}



.gradient--bg-22 {

  background: var(--gradient-22);

}



.gradient--bg-23 {

  background: var(--gradient-23);

}



.gradient--bg-24 {

  background: var(--gradient-24);

}



.gradient--bg-25 {

  background: var(--gradient-25);

}



.gradient--bg-26 {

  background: var(--gradient-26);

}



.gradient--bg-27 {

  background: var(--gradient-27);

}



.gradient--bg-28 {

  background: var(--gradient-28);

}



.gradient--bg-29 {

  background: var(--gradient-29);

}



.gradient--bg-30 {

  background: var(--gradient-30);

}



.gradient--bg-31 {

  background: var(--gradient-31);

}



.gradient--bg-32 {

  background: var(--gradient-32);

}



.gradient--bg-33 {

  background: var(--gradient-33);

}



.icon-gradient {

  background: -webkit-gradient(linear,

      left top,

      left bottom,

      from(hsl(var(--base))),

      to(hsl(var(--secondary))));

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  display: initial;

}



.base--radius {

  border-radius: 8px !important;

}



.radius--4 {

  border-radius: 4px !important;

}



.radius--8 {

  border-radius: 8px !important;

}



.radius--12 {

  border-radius: 12px !important;

}



.radius--16 {

  border-radius: 16px !important;

}



.radius--20 {

  border-radius: 20px !important;

}



.radius--24 {

  border-radius: 24px !important;

}



.radius--28 {

  border-radius: 28px !important;

}



.radius--30 {

  border-radius: 30px !important;

}



.radius--32 {

  border-radius: 32px !important;

}



.radius--50 {

  border-radius: 50% !important;

}



.radius--0 {

  border-radius: 0 !important;

}



.z--1 {

  z-index: 1;

}



.z--2 {

  z-index: 2;

}



.z--3 {

  z-index: 3;

}



.z--4 {

  z-index: 4;

}



.z--5 {

  z-index: 5;

}



.z--6 {

  z-index: 6;

}



.z--7 {

  z-index: 7;

}



.z--8 {

  z-index: 8;

}



.z--9 {

  z-index: 9;

}



.zm--1 {

  z-index: -1;

}



.zm--2 {

  z-index: -2;

}



.zm--3 {

  z-index: -3;

}



.zm--4 {

  z-index: -4;

}



.zm--5 {

  z-index: -5;

}



.zm--6 {

  z-index: -6;

}



.zm--7 {

  z-index: -7;

}



.zm--8 {

  z-index: -8;

}



.zm--9 {

  z-index: -9;

}



.w--10 {

  width: 10% !important;

}



.w--20 {

  width: 20% !important;

}



.w--30 {

  width: 30% !important;

}



.w--40 {

  width: 40% !important;

}



.w--50 {

  width: 50% !important;

}



.w--60 {

  width: 60% !important;

}



.w--70 {

  width: 70% !important;

}



.w--80 {

  width: 80% !important;

}



.w--90 {

  width: 90% !important;

}



.w--100 {

  width: 100% !important;

}



.h--10 {

  height: 10% !important;

}



.h--20 {

  height: 20% !important;

}



.h--30 {

  height: 30% !important;

}



.h--40 {

  height: 40% !important;

}



.h--50 {

  height: 50% !important;

}



.h--60 {

  height: 60% !important;

}



.h--70 {

  height: 70% !important;

}



.h--80 {

  height: 80% !important;

}



.h--90 {

  height: 90% !important;

}



.h--100 {

  height: 100% !important;

}



.border--base {

  border-color: hsl(var(--base)) !important;

}



.border--black {

  border-color: hsl(var(--black)) !important;

}



.border--black1 {

  border-color: hsl(var(--black) / 0.1) !important;

}



.border--black3 {

  border-color: hsl(var(--black) / 0.32) !important;

}



.border--primary {

  border-color: hsl(var(--primary)) !important;

}



.border--secondary {

  border-color: hsl(var(--secondary)) !important;

}



.border--success {

  border-color: hsl(var(--success)) !important;

}



.border--danger {

  border-color: hsl(var(--danger)) !important;

}



.border--warning {

  border-color: hsl(var(--warning)) !important;

}



.border--info {

  border-color: hsl(var(--info)) !important;

}



.border--violet {

  border-color: hsl(var(--violet)) !important;

}



.border--white {

  border: 1px solid hsl(var(--white)) !important;

}



.border-top--solid {

  border-top: 1px solid hsl(var(--black)) !important;

}



.border-top--dash {

  border-top: 1px dashed hsl(var(--black)) !important;

}



.border-right--solid {

  border-right: 1px solid hsl(var(--black)) !important;

}



.border-tight--dash {

  border-right: 1px dashed hsl(var(--black)) !important;

}



.border-left--solid {

  border-left: 1px solid hsl(var(--black)) !important;

}



.border-left--dashed {

  border-left: 1px dashed hsl(var(--black)) !important;

}



.border-bottom--solid {

  border-bottom: 1px solid hsl(var(--black)) !important;

}



.border-bottom--dashed {

  border-bottom: 1px dashed hsl(var(--black)) !important;

}



.border--solid1 {

  border: 1px solid hsl(var(--black) / 0.1) !important;

}



.border--dash1 {

  border: 1px solid hsl(var(--black) / 0.1) !important;

}



.border--solid2 {

  border: 1px solid hsl(var(--black) / 0.2) !important;

}



.border--dash2 {

  border: 1px solid hsl(var(--black) / 0.2) !important;

}



.border--solid3 {

  border: 1px solid hsl(var(--black) / 0.3) !important;

}



.border--dash3 {

  border: 1px solid hsl(var(--black) / 0.3) !important;

}



.border--solid4 {

  border: 1px solid hsl(var(--black) / 0.4) !important;

}



.border--dash4 {

  border: 1px solid hsl(var(--black) / 0.4) !important;

}



.border--solid5 {

  border: 1px solid hsl(var(--black) / 0.5) !important;

}



.border--dash5 {

  border: 1px solid hsl(var(--black) / 0.5) !important;

}



.border-top--solid1 {

  border-top: 1px solid hsl(var(--black) / 0.1) !important;

}



.border-top--dash1 {

  border-top: 1px dashed hsl(var(--black) / 0.1) !important;

}



.border-top--solid2 {

  border-top: 1px solid hsl(var(--black) / 0.2) !important;

}



.border-top--dash2 {

  border-top: 1px dashed hsl(var(--black) / 0.2) !important;

}



.border-top--solid3 {

  border-top: 1px solid hsl(var(--black) / 0.3) !important;

}



.border-top--dash3 {

  border-top: 1px dashed hsl(var(--black) / 0.3) !important;

}



.border-top--solid4 {

  border-top: 1px solid hsl(var(--black) / 0.4) !important;

}



.border-top--dash4 {

  border-top: 1px dashed hsl(var(--black) / 0.4) !important;

}



.border-top-solid5 {

  border-top: 1px solid hsl(var(--black) / 0.5) !important;

}



.border-top--dash5 {

  border-top: 1px dashed hsl(var(--black) / 0.5) !important;

}



.border-right--solid1 {

  border-right: 1px solid hsl(var(--black) / 0.1) !important;

}



.border-right--dash1 {

  border-right: 1px dashed hsl(var(--black) / 0.1) !important;

}



.border-right--solid2 {

  border-right: 1px solid hsl(var(--black) / 0.2) !important;

}



.border-right--dash2 {

  border-right: 1px dashed hsl(var(--black) / 0.2) !important;

}



.border-right--solid3 {

  border-right: 1px solid hsl(var(--black) / 0.3) !important;

}



.border-right--dash3 {

  border-right: 1px dashed hsl(var(--black) / 0.3) !important;

}



.border-right--solid4 {

  border-right: 1px solid hsl(var(--black) / 0.4) !important;

}



.border-right--dash4 {

  border-right: 1px dashed hsl(var(--black) / 0.4) !important;

}



.border-right-solid5 {

  border-right: 1px solid hsl(var(--black) / 0.5) !important;

}



.border-right--dash5 {

  border-right: 1px dashed hsl(var(--black) / 0.5) !important;

}



.border-bottom--solid1 {

  border-bottom: 1px solid hsl(var(--black) / 0.1) !important;

}



.border-bottom--dash1 {

  border-bottom: 1px dashed hsl(var(--black) / 0.1) !important;

}



.border-bottom--solid2 {

  border-bottom: 1px solid hsl(var(--black) / 0.2) !important;

}



.border-bottom--dash2 {

  border-bottom: 1px dashed hsl(var(--black) / 0.2) !important;

}



.border-bottom--solid3 {

  border-bottom: 1px solid hsl(var(--black) / 0.3) !important;

}



.border-bottom--dash3 {

  border-bottom: 1px dashed hsl(var(--black) / 0.3) !important;

}



.border-bottom--solid4 {

  border-bottom: 1px solid hsl(var(--black) / 0.4) !important;

}



.border-bottom--dash4 {

  border-bottom: 1px dashed hsl(var(--black) / 0.4) !important;

}



.border-bottom-solid5 {

  border-bottom: 1px solid hsl(var(--black) / 0.5) !important;

}



.border-bottom--dash5 {

  border-bottom: 1px dashed hsl(var(--black) / 0.5) !important;

}



.border-bottom-solid--white {

  border-bottom: 1px solid hsl(var(--white)) !important;

}



.border-bottom-solid--black3 {

  border-bottom: 1px solid hsl(var(--black) / 0.32) !important;

}



.border-bottom-solid--white5 {

  border-bottom: 1px solid hsl(var(--white) / 0.5) !important;

}



.border-left--solid1 {

  border-left: 1px solid hsl(var(--black) / 0.1) !important;

}



.border-left--dash1 {

  border-left: 1px dashed hsl(var(--black) / 1) !important;

}



.border-left--solid2 {

  border-left: 1px solid hsl(var(--black) / 0.2) !important;

}



.border-left--dash2 {

  border-left: 1px dashed hsl(var(--black) / 2) !important;

}



.border-left--solid3 {

  border-left: 1px solid hsl(var(--black) / 0.3) !important;

}



.border-left--dash3 {

  border-left: 1px dashed hsl(var(--black) / 3) !important;

}



.border-left--solid4 {

  border-left: 1px solid hsl(var(--black) / 0.4) !important;

}



.border-left--dash4 {

  border-left: 1px dashed hsl(var(--black) / 4) !important;

}



.border-left-solid5 {

  border-left: 1px solid hsl(var(--black) / 0.5) !important;

}



.border-left--dash5 {

  border-left: 1px dashed hsl(var(--black) / 5) !important;

}



.border--none {

  border: none !important;

}



.border-top--none {

  border-top: none !important;

}



.border-left--none {

  border-left: none !important;

}



.border-right--none {

  border-right: none !important;

}



.border-bottom--none {

  border-bottom: none !important;

}



.br-left--0 {

  border-top-left-radius: 0px !important;

  border-bottom-left-radius: 0px !important;

}



.br-btm--0 {

  border-bottom-left-radius: 0px !important;

  border-bottom-right-radius: 0px !important;

}



.shadow--1 {

  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;

}



.shadow--2 {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,

    rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;

}



.shadow--3 {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,

    rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;

}



.shadow--4 {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px,

    rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;

}



.shadow--5 {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px,

    rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;

}



.hover-shadow--1:hover {

  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;

  transition: 0.2s linear;

}



.hover-shadow--2:hover {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,

    rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;

  transition: 0.2s linear;

}



.hover-shadow--3:hover {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,

    rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;

  transition: 0.2s linear;

}



.hover-shadow--4:hover {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px,

    rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;

  transition: 0.2s linear;

}



.hover-shadow--5:hover {

  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px,

    rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;

  transition: 0.2s linear;

}



.gap--4 {

  gap: 4px !important;

}



.gap--8 {

  gap: 8px !important;

}



.gap--12 {

  gap: 12px !important;

}



.gap--16 {

  gap: 16px !important;

}



.gap--20 {

  gap: 20px !important;

}



.gap--24 {

  gap: 24px !important;

}



.gap--28 {

  gap: 28px !important;

}



.gap--32 {

  gap: 32px !important;

}



.gap--36 {

  gap: 36px !important;

}



.gap--40 {

  gap: 40px !important;

}



.gap--44 {

  gap: 44px !important;

}



.gap--48 {

  gap: 48px !important;

}



.gap--52 {

  gap: 52px !important;

}



.gap--56 {

  gap: 56px !important;

}



.gap--60 {

  gap: 60px !important;

}



.gap--64 {

  gap: 64px !important;

}



.gap--68 {

  gap: 68px !important;

}



.gap--72 {

  gap: 72px !important;

}



.gap--74 {

  gap: 74px !important;

}



.gap--76 {

  gap: 76px !important;

}



.gap--78 {

  gap: 78px !important;

}



.gap--80 {

  gap: 80px !important;

}



.gap--82 {

  gap: 82px !important;

}



.gap--84 {

  gap: 84px !important;

}



.gap--86 {

  gap: 86px !important;

}



.gap--88 {

  gap: 88px !important;

}



.custom--accordion .accordion-item {

  background-color: transparent !important;

  border: none;

  border-radius: 0;

}



.custom--accordion .accordion-item.active {

  position: relative;

}



.custom--accordion .accordion-item.active::after {

  content: "";

  position: absolute;

  top: 6px;

  left: 0px;

  height: 86%;

  width: 3px;

  background: hsl(var(--base));

}



.custom--accordion .accordion-item:not(:last-child) {

  margin-bottom: 20px;

}



.custom--accordion .accordion-item .accordion-header {

  display: flex;

  align-items: center;

  position: relative;

}



.custom--accordion .accordion-item .accordion-header .bar {

  position: absolute;

  top: 6px;

  left: 0px;

  width: 3px;

  height: 22px;

  background-color: hsl(var(--base) / 0.1);

}



.custom--accordion .accordion-body {

  color: hsl(var(--black) / 0.7);

}



.custom--accordion .accordion-body .text {

  max-width: 60%;

}



@media screen and (max-width: 575px) {

  .custom--accordion .accordion-body .text {

    max-width: 100%;

  }

}



.custom--accordion:first-of-type .accordion-button.collapsed {

  border-radius: 0px;

  font-weight: 600;

}



.custom--accordion:last-of-type .accordion-button.collapsed {

  border-radius: 0px;

  color: hsl(var(--body-color));

  background: hsl(var(--white) / 0.02);

}



.custom--accordion .accordion-button {

  color: hsl(var(--black)) !important;

  font-size: 20px;

  padding: 0px 20px;

  font-weight: 600;

}



@media screen and (max-width: 575px) {

  .custom--accordion .accordion-button {

    font-size: 18px;

    padding-right: 30px;

  }

}



.custom--accordion .accordion-button::after {

  background-image: none;

}



.custom--accordion .accordion-button:focus {

  box-shadow: none;

}



.custom--accordion .accordion-button:not(.collapsed) {

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

  background-color: hsl(var(--white) / 0.02) !important;

  box-shadow: none;

}



.custom--accordion .accordion-button:not(.collapsed)::after {

  transform: rotate(0deg);

  background-image: none;

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

}



.custom--accordion1 .accordion-item {

  background-color: transparent !important;

  border-radius: 12px;

  border: 1px solid hsl(var(--black) / 0.07) !important;

}



.custom--accordion1 .accordion-item:not(:last-child) {

  margin-bottom: 20px;

}



.custom--accordion1 .accordion-body {

  padding: 20px !important;

  background-color: transparent;

  color: hsl(var(--black) / 0.8);

}



.custom--accordion1 .accordion-body .text {

  max-width: 60%;

}



@media screen and (max-width: 575px) {

  .custom--accordion1 .accordion-body .text {

    max-width: 100%;

  }

}



.custom--accordion1:first-of-type .accordion-button.collapsed {

  border-radius: 0px;

  font-weight: 500;

}



.custom--accordion1:last-of-type .accordion-button.collapsed {

  border-radius: 0px;

  color: hsl(var(--body-color));

}



.custom--accordion1 .accordion-button {

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

  color: hsl(var(--heading-color)) !important;

  border: 0;

  font-size: 20px;

  padding: 18px 28px;

  font-weight: 500;

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

  border-radius: 12px !important;

  position: relative;

  z-index: auto !important;

}



@media screen and (max-width: 575px) {

  .custom--accordion1 .accordion-button {

    font-size: 18px;

    padding: 13px;

    padding-right: 30px;

  }

}



.custom--accordion1 .accordion-button::after {

  background-image: none;

}



.custom--accordion1 .accordion-button:focus {

  box-shadow: none;

  z-index: auto !important;

}



.custom--accordion1 .accordion-button:hover {

  z-index: auto !important;

}



.custom--accordion1 .accordion-button:not(.collapsed) {

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

  background-color: hsl(var(--base)) !important;

  box-shadow: none;

  font-weight: 500;

  border-radius: 16px 16px 0 0 !important;

}



.custom--accordion1 .accordion-button[aria-expanded="true"]::after,

.custom--accordion1 .accordion-button[aria-expanded="false"]::after {

  font-family: "Font Awesome 6 Free";

  font-weight: 600;

  content: "\f068";

  display: inline-block;

  position: relative;

  margin-left: auto;

  width: 0 !important;

  right: 16px;

  color: hsl(var(--heading-color)) !important;

  font-size: 16px;

}



.custom--accordion1 .accordion-button:not(.collapsed)::after {

  transform: rotate(0deg);

  background-image: none;

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

}



@media screen and (max-width: 575px) {



  .custom--accordion1 .accordion-button[aria-expanded="true"]::after,

  .custom--accordion1 .accordion-button[aria-expanded="false"]::after {

    right: -13px;

    font-size: 14px;

  }

}



.custom--accordion1 .accordion-button[aria-expanded="false"]::after {

  content: "+";

  color: hsl(var(--heading-color));

}



/* Button Style */

button {

  border: none;

  transition: 0.5s;

}



button:focus {

  outline: none;

  box-shadow: none;

}



.btn {

  border-radius: 14px;

  line-height: 1.2;

  position: relative;

}



.btn.pills {

  border-radius: 50px !important;

}



.btn:focus {

  outline: none;

  box-shadow: none;

}



@media screen and (max-width: 1025px) {

  .btn {

    padding: 6px 10px;

  }

}



@media screen and (max-width: 575px) {

  .btn {

    padding: 6px 7px;

  }

}



.btn:hover,

.btn:focus {

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

  border-color: transparent;

}



.btn--sm {

  padding: 4px 12px;

  font-size: 14px;

}



.btn--sm:hover,

.btn--sm:focus {

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

  border: 1px solid transparent;

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

}



@media screen and (max-width: 770px) {

  .btn--sm {

    padding: 5px 8px;

  }

}



.btn--md {

  padding: 13px 14px;

  font-size: 16px;

}



@media screen and (max-width: 770px) {

  .btn--md {

    padding: 6px 12px;

  }

}



.btn--lg {

  padding: 14px 26px;

  font-size: 16px !important;

}



@media screen and (max-width: 770px) {

  .btn--lg {

    padding: 10px 14px;

    font-size: 16px !important;

  }

}



.btn--base-two {

  background: hsl(var(--base-two));

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

  border: 1px solid transparent;

  font-weight: 600;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--base-two:hover,

.btn--base-two:active,

.btn--base-two:focus {

  background: hsl(var(--base-d-300)) !important;

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

  border: 1px solid transparent !important;

}



.btn--base-two.pill {

  border-radius: 35px;

}



.btn--base-circle {

  background-size: cover;

  background-repeat: no-repeat;

  color: hsl(var(--base));

  border-radius: 4px;

  position: relative;

  transition: 0.2s linear;

}



.btn--base-circle::after {

  content: "";

  position: absolute;

  top: 0px;

  left: 0px;

  background-color: hsl(var(--base) / 0.1);

  width: 35px;

  height: 35px;

  border-radius: 50%;

  transition: 0.2s linear;

  z-index: -1;

}



.btn--base-circle:hover,

.btn--base-circle:focus {

  background: hsl(var(--base));

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

}



.btn--base-circle:hover::after,

.btn--base-circle:focus::after {

  top: 0px;

  left: 0px;

  background-color: hsl(var(--base));

  width: 100%;

  height: 100%;

  border-radius: 4px;

  transition: 0.2s linear;

}



.btn--base {

  background: hsl(var(--base));

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

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

  border: 0px solid transparent !important;

  overflow: hidden;

  position: relative;

  z-index: 1;

}





.btn--base.pill {

  border-radius: 35px;

}



.btn--base:hover,

.btn--base:active,

.btn--base:focus {

  border: 0px !important;

}



.btn--base::before {

  content: "";

  width: 0px;

  height: 100%;

  position: absolute;

  top: 0px;

  left: -5%;

  background-color: hsl(var(--base-two));

  display: block;

  z-index: -1;

  border-radius: 30em;

  transition: 0.5s;

}



.btn--base:hover:before {

  width: 110%;

}



.btn--primary {

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

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

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--primary:hover,

.btn--primary:active,

.btn--primary:focus {

  background: hsl(var(--primary-d-100)) !important;

  color: hsl(var(--primary)) !important;

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--primary.pill {

  border-radius: 35px;

}



.btn--secondary {

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

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

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--secondary:hover,

.btn--secondary:active,

.btn--secondary:focus {

  background: hsl(var(--secondary-d-100)) !important;

  color: hsl(var(--secondary)) !important;

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--secondary.pill {

  border-radius: 35px;

}



.btn--success {

  background: hsl(var(--success));

  color: hsl(var(--success));

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--success:hover,

.btn--success:active,

.btn--success:focus {

  background: hsl(var(--success-d-100)) !important;

  color: hsl(var(--success)) !important;

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--success.pill {

  border-radius: 35px;

}



.btn--danger {

  background: hsl(var(--danger));

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

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--danger:hover,

.btn--danger:active,

.btn--danger:focus {

  background: hsl(var(--danger-d-100)) !important;

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

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--danger.pill {

  border-radius: 35px;

}



.btn--warning {

  background: hsl(var(--warning));

  color: hsl(var(--warning));

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--warning:hover,

.btn--warning:active,

.btn--warning:focus {

  background: hsl(var(--warning-d-100)) !important;

  color: hsl(var(--warning)) !important;

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--warning.pill {

  border-radius: 35px;

}



.btn--info {

  background: hsl(var(--info));

  color: hsl(var(--info));

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--info:hover,

.btn--info:active,

.btn--info:focus {

  background: hsl(var(--info-d-100)) !important;

  color: hsl(var(--info)) !important;

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--info.pill {

  border-radius: 35px;

}



.btn--violet {

  background: hsl(var(--violet));

  color: hsl(var(--violet));

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--violet:hover,

.btn--violet:active,

.btn--violet:focus {

  background: hsl(var(--violet-d-100)) !important;

  color: hsl(var(--violet)) !important;

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--violet.pill {

  border-radius: 35px;

}



.btn--dark {

  background: hsl(var(--dark));

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

  border: 1px solid transparent;

  font-weight: 500;

  font-size: 16px;

  text-align: center;

  text-transform: capitalize;

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

  transition: 0.2s linear;

}



.btn--dark:hover,

.btn--dark:active,

.btn--dark:focus {

  background: hsl(var(--dark-l-100)) !important;

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

  border: 1px solid transparent !important;

  box-shadow: 0px 7px 8px 0px hsl(var(--base) / 0.13);

}



.btn--dark.pill {

  border-radius: 35px;

}



.btn--dark::after {

  background-color: hsl(var(--white) / 0.3);

}



.btn--dark::before {

  background-color: hsl(var(--white) / 0.3);

}



.circle {

  border-radius: 50%;

  width: 50px;

  height: 50px;

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

  background-color: hsl(var(--base));

  display: flex;

  justify-content: center;

  align-items: center;

}



.circle i {

  rotate: 45deg;

}



.circle:hover {

  background-color: hsl(var(--base-d-200));

}



.pill {

  border-radius: 35px !important;

}



.btn-outline {

  background: transparent;

  border: none !important;

  border-radius: 8px;

}



.btn-outline:hover,

.btn-outline:focus {

  box-shadow: none !important;

}



.btn-outline--base {

  color: hsl(var(--base));

  border: 1px solid hsl(var(--base));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--base:hover,

.btn-outline--base:focus {

  background-color: hsl(var(--base) / 0.7) !important;

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

  border: 1px solid hsl(var(--base));

}



.btn-outline--base.pill {

  border-radius: 35px;

}



.btn-outline--base.active {

  background-color: hsl(var(--base)) !important;

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

  border: 1px solid hsl(var(--base));

}



.btn-outline--base.active:hover {

  background-color: hsl(var(--base) / 0.7) !important;

}



.btn-outline--base-two {

  color: hsl(var(--base-two));

  border: 1px solid hsl(var(--base-two));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--base-two:hover,

.btn-outline--base-two:focus {

  background-color: hsl(var(--base-two) / 0.7) !important;

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

  border: 1px solid hsl(var(--base-two));

}



.btn-outline--base-two.pill {

  border-radius: 35px;

}



.btn-outline--success {

  color: hsl(var(--success));

  border: 1px solid hsl(var(--success));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--success:hover,

.btn-outline--success:focus {

  background-color: hsl(var(--success) / 0.7) !important;

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

  border: 1px solid hsl(var(--success));

}



.btn-outline--success.pill {

  border-radius: 35px;

}



.btn-outline--danger {

  color: hsl(var(--danger));

  border: 1px solid hsl(var(--danger));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--danger:hover,

.btn-outline--danger:focus {

  background-color: hsl(var(--danger) / 0.7) !important;

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

  border: 1px solid hsl(var(--danger));

}



.btn-outline--danger.pill {

  border-radius: 35px;

}



.btn-outline--warning {

  color: hsl(var(--warning));

  border: 1px solid hsl(var(--warning));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--warning:hover,

.btn-outline--warning:focus {

  background-color: hsl(var(--warning) / 0.7) !important;

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

  border: 1px solid hsl(var(--warning));

}



.btn-outline--warning.pill {

  border-radius: 35px;

}



.btn-outline--info {

  color: hsl(var(--info));

  border: 1px solid hsl(var(--info));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--info:hover,

.btn-outline--info:focus {

  background-color: hsl(var(--info) / 0.7) !important;

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

  border: 1px solid hsl(var(--info));

}



.btn-outline--info.pill {

  border-radius: 35px;

}



.btn-outline--primary {

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

  border: 1px solid hsl(var(--primary));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--primary:hover,

.btn-outline--primary:focus {

  background-color: hsl(var(--primary) / 0.7) !important;

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

  border: 1px solid hsl(var(--primary));

}



.btn-outline--primary.pill {

  border-radius: 35px;

}



.btn-outline--secondary {

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

  border: 1px solid hsl(var(--secondary));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--secondary:hover,

.btn-outline--secondary:focus {

  background-color: hsl(var(--secondary) / 0.7) !important;

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

  border: 1px solid hsl(var(--secondary));

}



.btn-outline--secondary.pill {

  border-radius: 35px;

}



.btn-outline--dark {

  color: hsl(var(--dark));

  border: 1px solid hsl(var(--dark));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--dark:hover,

.btn-outline--dark:focus {

  background-color: hsl(var(--dark) / 0.7) !important;

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

  border: 1px solid hsl(var(--dark));

}



.btn-outline--dark.pill {

  border-radius: 35px;

}



.btn-outline--violet {

  color: hsl(var(--violet));

  border: 1px solid hsl(var(--violet));

  text-transform: capitalize;

  font-weight: 500;

}



.btn-outline--violet:hover,

.btn-outline--violet:focus {

  background-color: hsl(var(--violet) / 0.7) !important;

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

  border: 1px solid hsl(var(--violet));

}



.btn-outline--violet.pill {

  border-radius: 35px;

}



.btn-circle {

  border-radius: 50%;

  width: 139px;

  height: 139px;

  background: hsl(var(--base));

  display: flex;

  justify-content: center;

  align-items: center;

  font-size: 36px;

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

  rotate: -45deg;

  position: relative;

  border: 8px solid hsl(var(--white));

}



.btn-circle i {

  transition: all 0.3s ease-out;

}



.btn-circle::after {

  content: "";

  width: 100px;

  height: 100px;

  border-radius: 50%;

  position: absolute;

  top: 50%;

  left: 50%;

  border: 1px dashed hsl(var(--white));

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

}



.btn-circle:hover {

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

}



.btn-circle:hover i {

  rotate: 90deg;

  transition: all 0.3s ease-out;

}



.copytext {

  border-radius: 0px 14px 14px 0px !important;

}



@keyframes gradient {

  0% {

    background-position: 0% 50%;

  }



  50% {

    background-position: 100% 50%;

  }



  100% {

    background-position: 0% 50%;

  }

}



.grp-btn-wrap {

  display: flex;

  justify-content: end;

  align-items: center;

  gap: 12px;

}



/* END Button Style */

.blog-card {

  transition: 0.2s linear;

  padding: 20px;

  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);

}



.blog-card .bg--element {

  right: 0;

  bottom: 0;

}



.blog-card .bg--element img {

  opacity: 0.15;

  width: 200px;

}



.blog-card .thumb--wrap {

  .date--wrap {

    bottom: 0px;

    left: 0px;

    padding: 5px 18px;

    border-radius: 0px 0px 16px 16px;

    background: linear-gradient(180deg,

        hsla(0, 0%, 100%, 0) 35.5%,

        hsl(var(--black)) 100%);

    width: 100%;

    height: 80px;



    p {

      margin-top: 28px;

    }

  }

}



.blog-card .thumb {

  width: 100%;

  height: 297px;

  overflow: hidden;

  border-radius: 14px;

}



.blog-card .thumb img {

  transition: 0.2s linear;

}



.blog-card .blog-content {

  padding: 20px 0px 0 0;

  display: flex;

  justify-content: flex-start;

  flex-direction: column;

  position: relative;

  z-index: 1;

}



.blog-card .blog-content .date--wrap i {

  color: hsl(var(--base));

}



.blog-card .blog-content a:hover .title {

  transition: 0.2s linear;

  text-decoration: underline !important;

}



.blog-card:hover .thumb img {

  transform: scale(1.1);

}



.blog-card__btn-wrap a i {

  rotate: -45deg;

  transition: 0.2s linear;

}



.blog-card__btn-wrap a:hover {

  i {

    rotate: 0deg;

  }

}



.base--card {

  padding: 20px;

  border-radius: 20px;

  border: 1px solid hsl(var(--black) / 0.15);

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

}



.testimonial-card {

  position: relative;

  z-index: 1;

  filter: blur(2px);

}



.testimonial-card.slick-current {

  filter: blur(0px);

  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;

}



.testimonial-card .item--wrap {

  padding: 40px 30px 40px 30px !important;

}



.testimonial-card .description {

  line-height: 28px;

  font-style: italic;

  font-size: 15px;

}



.testimonial-card .icon {

  width: 60px;

  height: 60px;

  top: -30px;

  left: 40px;

}



.testimonial-card .user--thumb {

  width: 44px;

  height: 44px;

  border-radius: 50%;

  overflow: hidden;

}



.testimonial-card .description {

  margin-bottom: 24px;

}



.testimonial-card .bg--element {

  left: 0;

  bottom: 0;

}



.testimonial-card .bg--element img {

  opacity: 0.1;

}



.dashboard_profile-card {

  border-radius: 20px;

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

  position: relative;

}



.dashboard_profile-card::after {

  content: "";

  position: absolute;

  bottom: -8px;

  left: 0;

  width: 100%;

  height: 100%;

  border-radius: 32px;

  transition: 0.3sease;

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

  z-index: -1;

}



.dashboard_profile-card .dashboard_profile_wrap {

  position: relative;

}



.dashboard_profile-card .dashboard_profile_wrap .profile_photo img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.dashboard_profile-card .profile_photo::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  height: 100%;

  width: 100%;

  background: hsl(var(--dark));

  opacity: 0;

  transition: all 0.4s;

  visibility: hidden;

}



.dashboard_profile-card .profile_photo .photo_upload {

  display: inline-block;

  padding: 0px 0px 0px;

  position: absolute;

  top: 50%;

  left: 50%;

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

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

}



.dashboard_profile-card .profile_photo .photo_upload i {

  cursor: pointer;

  visibility: hidden;

  opacity: 0;

}



.dashboard_profile-card .contact-info {

  padding: 0px 20px;

  width: 100%;

}



.dashboard_profile-card .contact-info .info-wrap {

  padding: 20px 0px;

  border-bottom: 1px dashed hsl(var(--base-two) / 0.5);

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

}



.dashboard_profile-card .contact-info .info-wrap .info {

  display: flex;

  justify-content: flex-start;

  align-items: center;

  gap: 12px;

  margin-bottom: 8px;

}



.dashboard_profile-card .user-profile {

  position: relative;

  overflow: hidden;

  padding: 20px;

  background: hsl(var(--base));

  border-radius: 20px 20px 0px 0px;

}



.dashboard_profile-card .dashboard_profile_wrap {

  position: relative;

}



.dashboard_profile-card .dashboard_profile_wrap .profile-details ul li .user-name {

  font-weight: 700;

  font-size: 16px;

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

}



.dashboard_profile-card .dashboard_profile_wrap .profile_photo {

  height: 100px;

  width: 100px;

  border-radius: 50%;

  overflow: hidden;

  position: relative;

  left: 50%;

  transform: translateX(-50%);

}



.wizard-card {

  padding: 20px;

  border-radius: 20px;

  background-color: hsl(var(--section-bg));

  border: 1px solid hsl(var(--black) / 0.15);

}



.wizard-card .content-wrap .icon-wrap {

  width: 39px;

  height: 39px;

  border-radius: 6px;

  background-color: hsl(var(--base) / 0.07);

}



.wizard-card .content-wrap .icon-wrap::after {

  content: "";

  position: absolute;

  width: 40px;

  height: 40px;

  border-radius: 4px;

  background-color: hsl(var(--black) / 0.03);

  bottom: 0px;

  right: 0px;

  z-index: -1;

}



.wizard-card .content-wrap .icon-wrap i {

  color: hsl(var(--base));

}



.wizard-card .content-wrap .title {

  font-size: 18px;

}



.wizard-card .amount-wrap .amount {

  font-size: 20px;

  font-weight: 500;

}



.contact--box {

  border: 1px solid hsl(var(--black) / 0.05);

  padding: 28px 24px;

  width: 100%;

  overflow: hidden;

  position: relative;

  cursor: pointer;



  .content-wrap {

    position: relative;

    z-index: 1;

  }



  &::after {

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 52px;

    height: 52px;

    border-radius: 0px 20px 0px 20px;

    background-color: hsl(var(--base)/0.08);

    transition: 0.2s linear;

  }



  &:hover {

    &::after {

      width: 100%;

      height: 100%;

    }

  }

}



.contact--box .icon-wrap {

  width: 52px;

  height: 52px;

  flex-shrink: 0;

  top: 0px;

  right: 0px;

  color: hsl(var(--base));

  font-size: 24px;

  z-index: 1;

}



.contact--box .bar--wrap {

  position: absolute;

  top: 50%;

  left: 118%;

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

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

  font-size: 28px;

  color: hsl(var(--black) / 0.2);

}



.contact--box .content-wrap .number {

  font-size: 90px;

  -webkit-text-stroke-width: 1px;

  -webkit-text-stroke-color: hsl(var(--black) / 0.2);

  -webkit-text-fill-color: hsl(var(--white));

}



.location__card {

  width: 216px;

  height: 450px;

  transition: 0.3s ease-in-out;

  flex-shrink: 0;

}



.location__card.active {

  width: 350px;



  .custom-location {

    width: 250px;

    white-space: wrap;

  }

}



.location__card.active .location__card-content .btn {

  opacity: 1;

  visibility: visible;

}



.location__card .location__card-thumb::after {

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  content: "";

  background: linear-gradient(180deg,

      rgba(21, 20, 21, 0) 0%,

      rgba(21, 20, 21, 0.62) 100%);

}



.location__card .location__card-content {

  left: 0px;

  bottom: 0px;

  z-index: 2;

  padding: 20px;

}



.location__card .location__card-content .btn {

  position: absolute;

  right: 20px;

  opacity: 0;

  visibility: hidden;

  transition: 0.2s ease-in-out;

}



.location__card .location__card-content .title i {

  font-size: 18px;

  color: hsl(var(--base));

}



.tour-card {

  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);

  padding: 20px;

}



.tour-card .tour-card__thumb a {

  width: 100%;

  height: 100%;

}



.tour-card:hover .tour-card__thumb img {

  transform: scale(1.1);

}



.tour-card__tag {

  top: 35px;

  left: 35px;

  background-color: hsl(var(--base));

  padding: 3px 8px;

  border-radius: 6px;

  font-size: 12px;

}



.tour-card__favbtn {

  top: 35px;

  right: 35px;

  background: hsl(var(--black) / 0.3);

  width: 35px;

  height: 35px;

  border-radius: 50%;

}



.tour-card__favbtn i {

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

}



.tour-card__thumb {

  border-radius: 10px;

  width: 100%;

  height: 230px;

  overflow: hidden;

  margin-bottom: 18px;

}



.tour-card__thumb img {

  transition: 0.3s ease;

}



.tour-card__star {

  margin-bottom: 16px;

}



.tour-card__star i {

  font-size: 13px;

  color: hsl(var(--star-color));

}



.tour-card__title {

  margin-bottom: 16px;

  transition: 0.3s ease;

}



.tour-card__title:hover {

  color: hsl(var(--base));

}



.tour-card__location {

  margin-bottom: 10px;

}



.tour-card__btn-wrap a i {

  rotate: -45deg;

  transition: 0.2s linear;

}



.tour-card__btn-wrap a:hover {

  i {

    rotate: 0deg;

  }

}



.offer-card {

  height: 400px;

}



.offer-card__thumb {

  transition: 0.3s ease;

}



.offer-card__content {

  padding: 60px;

  top: 40px;

  left: 0;

  z-index: 5;

}



.offer-card__content .title {

  font-size: 50px !important;

}



.offer-card__content .sub--title {

  font-size: 24px;

}



.offer-card.card--one .offer-card__content .title {

  width: 350px;

}



.offer-card.card--two .offer-card__content {

  left: auto;

  right: 0;

  transform: translate(0%, 5%);

  width: 100%;

  top: -5px !important;

}



.offer-card.card--two .offer-card__content .title {

  font-size: 40px;

}



.offer-card:hover .offer-card__thumb {

  transform: scale(1.1);

}



.product--img__preview .product--thumb {

  position: relative;

  overflow: hidden;

  height: 591px;

}



.product--img__preview .product--thumb.thumb--small {

  height: 291px;

}



.product--img__preview .main--thumb__preview {

  position: relative;

  width: 100%;

  height: 100%;

  overflow: hidden;

}



.product--img__preview .main--thumb__preview img {

  transition: transform 0.1s ease-out;

  transform-origin: center center;

  will-change: transform;

}



.product--img__preview .more-images-overlay {

  position: absolute;

  top: 0;

  left: 0px;

  right: 0px;

  bottom: 0px;

  background: hsl(var(--black) / 0.5);

  color: hsl(var(--base));

  border-radius: 13px;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 50px;

}



.review-card {

  display: flex;

  flex-direction: column;

  gap: 6px;

}



.review-card .user-info {

  display: flex;

  align-items: center;

  gap: 12px;

}



.review-card .user-info .thumb-wrap {

  width: 49.51px;

  height: 49.51px;

  border-radius: 50%;

  overflow: hidden;

}



.review-card .user-info .user-name .rating-wrap {

  display: flex;

  align-items: center;

  gap: 4px;

}



.review-card .user-info .user-name .rating-wrap li i {

  color: hsl(var(--star-color));

}



.review-card .content {

  margin-left: 62px;

}



.input-group-text {

  border-radius: 14px;

  border: 0 !important;

  margin-left: 0px !important;

}



.with--text .input-group-text {

  border-radius: 50px 0px 0px 50px;

  border: 1px solid hsl(var(--black) / 0.2);

}



.with--text input {

  border-radius: 0px 50px 50px 0px !important;

}



/* Form Style */

.search-box .input--group .form--control {

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

  padding-right: 30px;

}



.search-box .form--control {

  color: hsl(var(--dark));

  padding-right: 40px;

}



.search-box .form--control::placeholder {

  color: hsl(var(--black) / 0.5);

}



.form--label {

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

  font-size: 14px;

  font-weight: 500;

  margin-bottom: 16px;

}



label.req {

  position: relative;

}



label.req::after {

  content: "*";

  position: absolute;

  top: 3px;

  right: -10px;

  color: hsl(var(--danger));

}



.form--control {

  font-weight: 500;

  outline: none;

  width: 100%;

  padding: 10px 16px;

  border-radius: 14px;

  background-color: transparent;

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

  line-height: 26px;

  border: 1px solid hsl(var(--black) / 0.2);

}



.form--control::placeholder {

  color: hsl(var(--black) / 0.5) !important;

  font-size: 16px;

}



.form--control:focus {

  color: hsl(var(--black)) !important;

  box-shadow: none;

  border: 1px solid hsl(var(--base-d-200));

  border-radius: 14px;

  background-color: transparent;

}



.form--control:disabled,

.form--control[readonly] {

  background-color: hsl(var(--black) / 0.05);

  opacity: 1;

  border: 0;

}



.form--control[type="password"] {

  color: hsl(var(--black) / 0.8);

}



.form--control[type="password"]:focus {

  color: hsl(var(--black) / 0.8);

}



.form--control[type="file"] {

  line-height: 45px;

  padding: 0;

  position: relative;

}



.form--control[type="file"]::file-selector-button {

  border: 1px solid hsl(var(--black) / 0.08);

  padding: 2px 6px;

  border-radius: 8px;

  background-color: hsl(var(--base) / 0.5);

  transition: 0.2s linear;

  line-height: 25px;

  position: relative;

  margin-left: 8px;

  color: hsl(var(--black) / 0.8);

  cursor: pointer;

}



.form--control[type="file"]::file-selector-button:hover {

  background-color: hsl(var(--base) / 0.8) !important;

  border: 1px solid hsl(var(--base));

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

}



.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {

  background-color: hsl(var(--base) / 0.7) !important;

}



.form--control.pills {

  border-radius: 50px !important;

}



.form--control:focus~.form--label,

.form--control:not(:placeholder-shown).form--control:not(:focus)~.form--label {

  top: -14px;

  left: 8px;

  font-size: 14px;

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

  z-index: 9;

}



textarea.form--control {

  height: 220px;

  padding: 15px;

}



input:-webkit-autofill,

input:-webkit-autofill:hover,

input:-webkit-autofill:focus,

input:-webkit-autofill:active {

  -webkit-transition: background-color 5000s ease-in-out 0s;

  transition: background-color 5000s ease-in-out 0s;

}



input:-webkit-autofill,

textarea:-webkit-autofill,

select:-webkit-autofill {

  -webkit-box-shadow: 0 0 0px 1000px transparent inset;

  -webkit-text-fill-color: hsl(var(--black)) !important;

}



.footer-subscribe-box .footer-input:-webkit-autofill {

  -webkit-text-fill-color: hsl(var(--black)) !important;

}



.search--input .search-btn {

  position: absolute;

  top: 10px;

  right: 10px;

  font-size: 18px;

  color: hsl(var(--base));

}



.search--input input {

  padding-right: 40px;

}



.input--icon {

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  color: hsl(var(--base));

}



.password-show-hide {

  position: absolute;

  right: 20px;

  z-index: 3;

  cursor: pointer;

  top: 50%;

  transform: translateY(-50%);

  color: hsl(var(--black) / 0.5);

}



#send-amount input[type="file"] {

  color: hsl(var(--base));

  cursor: pointer;

}



input #send-amount::file-selector-button {

  display: none;

}



input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

  -webkit-appearance: none;

}



input[type="number"] {

  -moz-appearance: textfield;

}



/*====== Country code ======*/

.input-group.country-code {

  position: relative;

  display: flex;

  flex-wrap: nowrap;

}



.input-group.country-code .input-group-text {

  background-color: hsl(var(--base) / 0.5);

  border: 1px solid hsl(var(--base) / 0.7);

}



.form--select option {

  background-color: hsl(var(--body-color));

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

}



.select {

  color: hsl(var(--dark) / 0.6);

}



.select:focus {

  border-color: hsl(var(--base));

}



.select option {

  background-color: hsl(var(--dark));

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

}



/* Custom Checkbox Design */

.form--check {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

}



.form--check a {

  display: inline;

}



.form--check .form-check-input {

  box-shadow: none;

  background-color: transparent;

  box-shadow: none !important;

  border: 0;

  position: relative;

  border-radius: 2px;

  width: 16px;

  height: 16px;

  border: 1px solid hsl(var(--black) / 0.7);

  margin-top: 0px !important;

}



.form--check .form-check-input:checked {

  background-color: hsl(var(--base)) !important;

  border-color: hsl(var(--base)) !important;

  box-shadow: none;

}



.form--check .form-check-input:checked[type="checkbox"] {

  background-image: none;

}



.form--check .form-check-input:checked::before {

  position: absolute;

  content: "\f00c";

  font-family: "Font Awesome 5 Free";

  font-weight: 900;

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

  font-size: 12px;

  top: 50%;

  left: 50%;

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

}



.form--check .form-check-label {

  width: calc(100% - 16px);

  padding-left: 12px;

  color: hsl(var(--black) / 0.7);

  font-size: 16px;

  font-weight: 400;

  line-height: 29px;

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

}



.form--check label {

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

}



@media screen and (max-width: 424px) {

  .form--check label {

    font-size: 15px;

  }

}



@media screen and (max-width: 424px) {

  .form--check a {

    font-size: 15px;

  }

}



/*  Custom Radio Design */

.form--radio {

  display: flex;

  align-items: center;

  gap: 6px;

}



.form--radio .form-radio-input {

  box-shadow: none;

  border: 2px solid hsl(var(--base));

  position: relative;

  margin: 0px;

  height: 16px;

  width: 16px;

}



.form--radio .form-radio-input:active {

  filter: brightness(100%);

}



.form--radio .form-radio-input:checked {

  background-color: transparent;

  border-color: hsl(var(--base));

}



.form--radio .form-radio-input:checked[type="radio"] {

  background-image: none;

}



.form--radio .form-radio-input:checked::before {

  position: absolute;

  content: "";

  top: 50%;

  left: 50%;

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

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

  width: 9px;

  height: 9px;

  background-color: hsl(var(--base));

  border-radius: 50%;

  z-index: 999;

}



.form--radio .form-radio-label {

  width: calc(100% - 16px);

  color: hsl(var(--black) / 0.7);

  font-size: 16px;

  font-weight: 400;

  line-height: 29px;

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

}



/*  Custom Switch Design */

.form--switch .form-check-input {

  width: unset;

  border-radius: 16px;

  background-image: none;

  position: relative;

  box-shadow: none;

  border: 0;

  background-color: hsl(var(--base)) !important;

  padding: 12px 30px !important;

  margin-left: 0;

  margin-bottom: 5px;

}



.form--switch .form-check-input:focus {

  width: unset;

  border-radius: 16px;

  background-image: none;

  position: relative;

  box-shadow: none;

  border: 0;

}



.form--switch .form-check-input::before {

  position: absolute;

  content: "";

  width: 17px;

  height: 17px;

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

  top: 50%;

  transform: translateY(-50%);

  border-radius: 50%;

  left: 5px;

  transition: 0.2s linear;

}



.form--switch .form-check-input:checked {

  background-color: hsl(var(--base));

}



.form--switch .form-check-input:checked::before {

  left: calc(100% - 20px);

}



.form--switch .form-check-label {

  margin-right: 10px;

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

  font-weight: 500;

  margin-bottom: 0;

  line-height: 2;

}



.form-check.form--switch {

  display: flex;

  flex-wrap: wrap;

  padding-left: 10px;

}



.form-check.form--switch .form-check-label {

  margin-right: 10px;

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

  font-weight: 500;

  margin-bottom: 0;

  line-height: 2;

}



/*  Custom Switch End Design */

::-webkit-calendar-picker-indicator {

  filter: invert(0.5);

}



::-webkit-calendar-picker-indicator {

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 24 24"><path fill="%23bbbbbb" d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"/></svg>');

}



.f-dropdown {

  --max-scroll: 3;

  position: relative;

  z-index: 2;

}



.f-dropdown::after {

  content: "";

  position: absolute;

  top: 16px;

  right: 0px;

  width: 1px;

  height: 24px;

  background-color: hsl(var(--black) / 0.1);

}



.f-dropdown select {

  display: none;

}



.f-dropdown>span {

  cursor: pointer;

  padding: 12px 12px;

  border-radius: 6px;

  display: flex;

  align-items: center;

  position: relative;

  border: 1px solid hsl(var(--black) / 0.1);

  border-right: none;

  border-top-right-radius: 0px;

  border-bottom-right-radius: 0px;

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

  transition: color 0.2s ease, border-color 0.2s ease;

}



.f-dropdown>span>span {

  black-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

  padding-right: 12px;

}



.f-dropdown>span img {

  width: 30px;

  margin-right: 10px;

}



.f-dropdown>span:before,

.f-dropdown>span:after {

  content: "";

  display: block;

  position: absolute;

  width: 8px;

  height: 2px;

  border-radius: 1px;

  top: 50%;

  right: 12px;

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

  transition: all 0.3s ease;

}



.f-dropdown>span:before {

  margin-right: 4px;

  transform: scale(0.96, 0.8) rotate(50deg);

}



.f-dropdown>span:after {

  transform: scale(0.96, 0.8) rotate(-50deg);

}



.f-dropdown ul {

  margin: 0;

  padding: 0;

  list-style: none;

  opacity: 0;

  visibility: hidden;

  position: absolute;

  max-height: calc(var(--max-scroll) * 46px);

  top: 40px;

  left: 0;

  z-index: 1;

  right: 0;

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

  border: 1px solid #ccc;

  border-radius: 6px;

  overflow-x: hidden;

  overflow-y: auto;

  transform-origin: 0 0;

  transition: opacity 0.2s ease, visibility 0.2s ease,

    transform 0.3s cubic-bezier(0.4, 0.6, 0.5, 1.32);

  transform: translate(0, 5px);

}



.f-dropdown ul li {

  padding: 0;

  margin: 0;

}



.f-dropdown ul li a {

  cursor: pointer;

  padding: 8px 12px;

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

  text-decoration: none;

  outline: none;

  position: relative;

  transition: all 0.2s ease;

  display: flex;

  flex-wrap: wrap;

  align-items: center;

}



.f-dropdown ul li a img {

  width: 30px;

  margin-right: 10px;

}



.f-dropdown ul li a:hover {

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

}



.f-dropdown ul li.active a {

  color: hsl(var(--black)) !important;

  background: hsl(var(--base));

}



.f-dropdown ul li.active a:before,

.f-dropdown ul li.active a:after {

  --scale: 0.6;

  content: "";

  display: block;

  width: 10px;

  height: 2px;

  position: absolute;

  right: 12px;

  top: 50%;

  opacity: 0;

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

  transition: all 0.2s ease;

}



.f-dropdown ul li.active a:before {

  transform: rotate(45deg) scale(var(--scale));

}



.f-dropdown ul li.active a:after {

  transform: rotate(-45deg) scale(var(--scale));

}



.f-dropdown ul li.active a:hover:before,

.f-dropdown ul li.active a:hover:after {

  --scale: 0.9;

  opacity: 1;

}



.f-dropdown ul li:first-child a {

  border-radius: 6px 6px 0 0;

}



.f-dropdown ul li:last-child a {

  border-radius: 0 0 6px 6px;

}



.f-dropdown.disabled {

  opacity: 0.7;

}



.f-dropdown.disabled>span {

  cursor: not-allowed;

}



.f-dropdown.filled>span {

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

}



.f-dropdown.open {

  z-index: 15;

}



.f-dropdown.open>span {

  border: 1px solid hsl(var(--base) / 0.3);

}



.f-dropdown.open>span:before,

.f-dropdown.open>span:after {

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

}



.f-dropdown.open>span:before {

  transform: scale(0.96, 0.8) rotate(-50deg);

}



.f-dropdown.open>span:after {

  transform: scale(0.96, 0.8) rotate(50deg);

}



.f-dropdown.open ul {

  opacity: 1;

  visibility: visible;

  transform: translate(0, 12px);

  transition: opacity 0.3s ease, visibility 0.3s ease,

    transform 0.3s cubic-bezier(0.4, 0.6, 0.5, 1.32);

}



.search-input {

  padding-right: 60px !important;

}



.placeholder--light::placeholder {

  color: hsl(var(--black) / 0.6) !important;

}



/* --------------------------- */

.modal--base .modal-dialog .modal-content {

  border-radius: 20px !important;

  border: 1px solid hsl(var(--black) / 0.8);

  padding: 24px;

  position: relative;

}



.modal--base .modal-dialog .modal-content::after {

  content: "";

  position: absolute;

  bottom: -8px;

  left: 0;

  width: 100%;

  height: 100%;

  border-radius: 32px;

  transition: 0.3s ease;

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

  z-index: -1;

}



.modal--base .modal-dialog .modal-header {

  justify-content: space-between;

  padding: 0px;

  padding-bottom: 16px;

  margin-bottom: 36px;

}



.modal--base .modal-dialog .modal-header .btn--close {

  width: 30px;

  height: 30px;

  border-radius: 8px;

  background-color: hsl(var(--black) / 0.06) !important;

}



.modal--base .modal-dialog .modal-body {

  padding: 0px;

}



.modal--base .modal-dialog .modal-footer {

  border: 0;

}



.pagination {

  flex-wrap: wrap;

  justify-content: center;

}



.pagination .page-item .page-link {

  border: 1px solid hsl(var(--base));

  margin: 0 5px;

  border-radius: 50%;

  height: 40px;

  width: 40px;

  display: flex;

  justify-content: center;

  align-items: center;

  background-color: transparent;

  font-weight: 500;

  padding: 0;

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

}



.pagination .page-item .page-link.active,

.pagination .page-item .page-link:hover {

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

  background-color: hsl(var(--base));

}



.pagination .page-item .page-link:focus {

  box-shadow: none;

}



.pagination .page-item.active .page-link {

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

  background-color: hsl(var(--base));

}



.table {

  margin: 0;

  font-size: 15px;

  border-collapse: separate;

  border-spacing: 0px 0px;

  border-radius: 10px;

}



.table thead tr th {

  background: hsl(var(--black) / 0.04);

  text-align: center;

  font-size: 16px;

  padding: 15px;

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

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

  font-weight: 500;

  max-width: 170px;

  white-space: nowrap;

  border: 0;

}



.table thead tr th:first-child {

  text-align: left;

  border-top-left-radius: 10px;

  border-bottom-left-radius: 10px;

}



.table thead tr th:last-child {

  border-top-right-radius: 10px;

  border-bottom-right-radius: 10px;

  text-align: right;

}



.table thead tr .tbl-text-right {

  text-align: right !important;

}



.table thead tr .tbl-text-center {

  text-align: center !important;

}



.table thead tr .tbl-text-left {

  text-align: left !important;

}



.table thead tr .tbl-text-center:last-child {

  text-align: center;

}



.table tbody {

  border: 0 !important;

  color: hsl(var(--black) / 0.8);

}



.table tbody tr:last-child td {

  border: 0;

}



.table tbody tr:last-child td:first-child {

  border-radius: 0 0 0px 5px;

}



.table tbody tr:last-child td:last-child {

  border-radius: 0 0 5px 0;

  border-left: 0;

}



.table tbody tr td {

  vertical-align: middle;

  border-width: 1px;

  border: 0;

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

  font-size: 14px;

  color: hsl(var(--black) / 0.8);

  max-width: 190px;

  font-weight: 400;

  text-align: left;

  padding: 16px 12px;

  text-align: center;

  border-bottom: 1px solid hsl(var(--black) / 0.08);

}



.table tbody tr td span {

  color: hsl(var(--black) / 0.8);

  font-weight: 500;

}



.table tbody tr td p {

  font-size: 14px;

}



.table tbody tr td .table--img {

  max-width: 32px;

  max-height: 32px;

  border-radius: 50%;

}



.table tbody tr td::before {

  content: attr(data-label);

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

  font-size: 15px;

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

  font-weight: 500;

  display: none;

  width: 50% !important;

  text-align: left;

}



.table tbody tr td:first-child {

  text-align: left;

}



.table tbody tr td:last-child {

  text-align: right;

}



.table tbody tr .tbl-text-right {

  text-align: right;

}



.table tbody tr .tbl-text-center {

  text-align: center;

}



.table tbody tr .tbl-text-left {

  text-align: left;

}



.table tbody tr .tbl-text-center:last-child {

  text-align: center !important;

}



.table> :not(caption)>*>* {

  background-color: transparent;

}



@media screen and (max-width: 770px) {

  .table--responsive--md thead {

    display: none;

  }



  .table--responsive--md tbody tr {

    display: block;

  }



  .table--responsive--md tbody tr td {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;

    text-align: right;

    padding: 10px 15px;

    border: none;

    border-bottom: 1px solid hsl(var(--black) / 0.08);

    max-width: unset;

  }



  .table--responsive--md tbody tr td:last-child {

    border: none;

  }



  .table--responsive--md tbody tr td:first-child {

    text-align: right;

  }



  .table--responsive--md tbody tr td::before {

    display: block;

  }

}



@media screen and (max-width: 991px) {

  .table--responsive--lg thead {

    display: none;

  }



  .table--responsive--lg tbody tr {

    display: block;

  }



  .table--responsive--lg tbody tr td {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 0px;

    text-align: right;

    padding: 10px 15px;

    border: none;

    border-bottom: 1px solid hsl(var(--black) / 0.08) !important;

    max-width: unset;

    flex-wrap: wrap;

  }



  .table--responsive--lg tbody tr td:last-child {

    border: none !important;

  }



  .table--responsive--lg tbody tr td:first-child {

    text-align: right;

  }



  .table--responsive--lg tbody tr td::before {

    display: block;

  }

}



@media screen and (max-width: 1199px) {

  .table--responsive--xl thead {

    display: none;

  }



  .table--responsive--xl tbody tr {

    display: block;

  }



  .table--responsive--xl tbody tr td {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;

    text-align: right;

    padding: 10px 15px;

    border: none;

    border-bottom: 1px solid hsl(var(--black) / 0.08);

    max-width: unset;

  }



  .table--responsive--xl tbody tr td:last-child {

    border: none;

  }



  .table--responsive--xl tbody tr td:first-child {

    text-align: right;

  }



  .table--responsive--xl tbody tr td::before {

    display: block;

  }

}



@media screen and (max-width: 1199px) {

  .table--responsive--xl tbody tr td {

    border: 0;

  }

}



@media screen and (max-width: 1399px) {

  .table--responsive--xl thead {

    display: none;

  }



  .table--responsive--xl tbody tr {

    display: block;

  }



  .table--responsive--xl tbody tr td {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;

    text-align: right;

    padding: 10px 15px;

    border: none;

    border-bottom: 1px solid hsl(var(--black) / 0.08);

    max-width: unset;

  }



  .table--responsive--xl tbody tr td:last-child {

    border: none;

  }



  .table--responsive--xl tbody tr td:first-child {

    text-align: right;

  }



  .table--responsive--xl tbody tr td::before {

    display: block;

  }

}



@media screen and (max-width: 1399px) {

  .table--responsive--xl tbody tr td {

    border: 0;

  }

}



@media screen and (max-width: 991px) {

  .table-wrapper .table--responsive--lg tbody tr td {

    display: block;

  }

}



@media (max-width: 992px) {

  .table tbody tr:nth-child(even) {

    border-bottom: 1px solid hsl(var(--dark) / 0.03);

    background: hsl(var(--base) / 0.03);

  }

}



.table-item {

  display: flex;

  align-items: center;

}



.table-item__thumb {

  width: 65px;

  height: 65px;

  border-radius: 5px;

  margin-right: 10px;

}



.table-item__thumb img {

  height: 100% !important;

  width: 100% !important;

  object-fit: cover !important;

}



.table-item__content {

  width: calc(100% - 65px);

}



.table-item__content .title-two {

  font-size: 16px;

  line-height: 0;

  margin-bottom: 0;

}



.table-item__content .price {

  font-size: 18px;

  margin-bottom: 0;

}



.cart-total ul {

  border: 0px solid hsl(var(--black) / 0.1);

}



.cart-total ul li.total {

  font-size: 18px;

  font-weight: 500;

  color: hsl(var(--base));

}



.cart-total ul li {

  list-style: none;

  font-size: 15px;

  color: #6f7172;

  padding: 10px 0px;

  border-bottom: 1px solid hsl(var(--black) / 0.1);

  font-weight: 400;

  color: hsl(var(--black) / 0.9);

}



.cart-total ul li span {

  float: right;

}



.custom--tabs {

  padding: 12px 0px;

  border-radius: 12px;

}



.custom--tabs li {

  margin: 0px 8px 8px 0px;

}



.custom--tabs li .btn {

  color: hsl(var(--base)) !important;

  border: 1px solid hsl(var(--base) / 0.8) !important;

  padding: 8px 16px;

  outline: none !important;

}



.custom--tabs li .btn-check:active+.btn,

.custom--tabs li .btn-check:checked+.btn,

.custom--tabs li .btn.active,

.custom--tabs li .btn.show,

.custom--tabs li .btn:active {

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

  background: hsl(var(--base)) !important;

  font-weight: 600;

  border: 1px solid hsl(var(--white) / 0.1) !important;

}



.custom--tabs.nav-tabs {

  border-bottom: 1px solid hsl(var(--white) / 0.1) !important;

  border-radius: 0px;

  margin-bottom: 36px !important;

}



/* Badge Color and style */

.badge {

  border-radius: 6px;

  padding: 0px 8px;

  font-size: 12px;

  line-height: 24px;

  font-weight: 400 !important;

}



.badge--base {

  color: hsl(var(--base)) !important;

  background-color: hsl(var(--base) / 0.1) !important;

}



.badge--primary {

  color: hsl(var(--primary)) !important;

  background-color: hsl(var(--primary) / 0.1) !important;

}



.badge--secondary {

  color: hsl(var(--secondary)) !important;

  background-color: hsl(var(--secondary) / 0.1) !important;

}



.badge--success {

  color: hsl(var(--success)) !important;

  background-color: hsl(var(--success) / 0.1) !important;

}



.badge--danger {

  color: hsl(var(--danger)) !important;

  background-color: hsl(var(--danger) / 0.1) !important;

}



.badge--warning {

  color: hsl(var(--warning)) !important;

  background-color: hsl(var(--warning) / 0.1) !important;

}



.badge--info {

  color: hsl(var(--info)) !important;

  background-color: hsl(var(--info) / 0.1) !important;

}



.badge--violet {

  color: hsl(var(--violet)) !important;

  background-color: hsl(var(--violet) / 0.1) !important;

}



@keyframes swing {

  20% {

    transform: rotate3d(0, 0, 1, 15deg);

  }



  40% {

    transform: rotate3d(0, 0, 1, -10deg);

  }



  60% {

    transform: rotate3d(0, 0, 1, 5deg);

  }



  80% {

    transform: rotate3d(0, 0, 1, -5deg);

  }



  to {

    transform: rotate3d(0, 0, 1, 0deg);

  }

}



.swing {

  transform-origin: top center;

  animation-name: swing;

}



.tada {

  animation: tada 5s ease-in-out infinite;

}



@-webkit-keyframes tada {

  0% {

    -webkit-transform: scaleX(1);

    transform: scaleX(1);

  }



  10%,

  20% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);

    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);

  }



  30%,

  50%,

  70%,

  90% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);

    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);

  }



  40%,

  60%,

  80% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);

    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);

  }



  to {

    -webkit-transform: scaleX(1);

    transform: scaleX(1);

  }

}



@keyframes fadeIn {

  from {

    opacity: 0;

  }



  to {

    opacity: 1;

  }

}



.fadeIn {

  animation-name: fadeIn;

}



@keyframes slide-down {

  0% {

    opacity: 0;

    transform: translateY(-150%);

  }



  100% {

    opacity: 1;

    transform: translateY(0);

  }

}



.top_image_bounce {

  -webkit-animation: top-image-bounce 3s infinite ease-in-out;

  animation: top-image-bounce 3s infinite ease-in-out;

}



.top_image_bounce_2 {

  -webkit-animation: top-image-bounce-2 6s infinite ease-in-out;

  animation: top-image-bounce-2 6s infinite ease-in-out;

}



.left_image_bounce {

  -webkit-animation: left-image-bounce 3s infinite ease-in-out;

  animation: left-image-bounce 3s infinite ease-in-out;

}



.left_image_bounce-1 {

  -webkit-animation: left-image-bounce 6s infinite ease-in-out;

  animation: left-image-bounce 6s infinite ease-in-out;

}



.left_image_bounce-2 {

  -webkit-animation: left-image-bounce 3s infinite ease-in-out;

  animation: left-image-bounce 3s infinite ease-in-out;

}



.right_image_bounce {

  -webkit-animation: right-image-bounce 3s infinite ease-in-out;

  animation: right-image-bounce 3s infinite ease-in-out;

}



.spin_image {

  -webkit-animation: spin 3s infinite ease-in-out;

  animation: spin 3s infinite ease-in-out;

}



@keyframes top-image-bounce {

  0% {

    -webkit-transform: translateY(-8px);

    transform: translateY(-8px);

  }



  50% {

    -webkit-transform: translateY(12px);

    transform: translateY(12px);

  }



  100% {

    -webkit-transform: translateY(-8px);

    transform: translateY(-8px);

  }

}



@keyframes top-image-bounce {

  0% {

    -webkit-transform: translateY(-8px);

    transform: translateY(-8px);

  }



  50% {

    -webkit-transform: translateY(12px);

    transform: translateY(12px);

  }



  100% {

    -webkit-transform: translateY(-8px);

    transform: translateY(-8px);

  }

}



@keyframes top-image-bounce-2 {

  0% {

    -webkit-transform: translateY(-4px);

    transform: translateY(-4px);

  }



  50% {

    -webkit-transform: translateY(15px);

    transform: translateY(8px);

  }



  100% {

    -webkit-transform: translateY(-4px);

    transform: translateY(-4px);

  }

}



@keyframes left-image-bounce {

  0% {

    -webkit-transform: translateX(-5px);

    transform: translateX(-5px);

  }



  50% {

    -webkit-transform: translateX(10px);

    transform: translateX(10px);

  }



  100% {

    -webkit-transform: translateX(-5px);

    transform: translateX(-5px);

  }

}



@-webkit-keyframes spin {

  100% {

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg);

    -webkit-transform-origin: 50%;

    transform-origin: 50%;

  }

}



@keyframes spin {

  100% {

    -webkit-transform: rotate(360deg);

    transform: rotate(360deg);

    -webkit-transform-origin: 50%;

    transform-origin: 50%;

  }

}



.square {

  display: inline-block;

  width: 100px;

  height: 100px;

  border-radius: 20px;

  background: whiteSmoke;

  box-shadow: 4px -40px 60px 5px rgb(26, 117, 206) inset;

}



.pulse {

  animation: pulse 1s infinite ease-in-out alternate;

}



@keyframes pulse {

  from {

    transform: scale(0.8);

  }



  to {

    transform: scale(1.2);

  }

}



.flash {

  animation: flash 500ms ease infinite alternate;

}



@keyframes flash {

  from {

    opacity: 1;

  }



  to {

    opacity: 0;

  }

}



.fade-in {

  animation: fade-in 3s linear infinite;

}



@keyframes fade-in {

  0% {

    opacity: 0;

  }



  100% {

    opacity: 1;

  }

}



.fade-out {

  animation: fade-out 2s linear infinite;

}



@keyframes fade-out {

  from {

    opacity: 1;

  }



  to {

    opacity: 0;

  }

}



.swing {

  transform-origin: top center;

  animation: swing 2s ease infinite;

}



@keyframes swing {

  20% {

    transform: rotate(15deg);

  }



  40% {

    transform: rotate(-10deg);

  }



  60% {

    transform: rotate(5deg);

  }



  80% {

    transform: rotate(-5deg);

  }



  100% {

    transform: rotate(0deg);

  }

}



.splite-text .whitespace {

  width: 8px;

}



.splite-text.animated .char {

  -webkit-animation: fadeInRight 0.4s cubic-bezier(0.3, 0, 0.7, 1) both;

  animation: fadeInRight 0.4s cubic-bezier(0.3, 0, 0.7, 1) both;

  -webkit-animation-delay: calc(30ms * var(--char-index));

  animation-delay: calc(30ms * var(--char-index));

}



@keyframes waves {

  0% {

    -webkit-transform: scale(0.2, 0.2);

    transform: scale(0.2, 0.2);

    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

  }



  50% {

    opacity: 0.9;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";

  }



  100% {

    -webkit-transform: scale(0.9, 0.9);

    transform: scale(0.9, 0.9);

    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

  }

}



.fa-play:before {

  content: "\f04b";

}



@-webkit-keyframes circle {

  0% {

    opacity: 1;

  }



  40% {

    opacity: 1;

  }



  100% {

    width: 200%;

    height: 200%;

    opacity: 0;

  }

}



@keyframes circle {

  0% {

    opacity: 1;

  }



  40% {

    opacity: 1;

  }



  100% {

    width: 200%;

    height: 200%;

    opacity: 5;

  }

}



@keyframes fadeInOut {

  0% {

    opacity: 0;

  }



  50% {

    opacity: 1;

  }



  100% {

    opacity: 0;

  }

}



@keyframes move {

  0% {

    transform: scale(1) translate(0, 0) rotate(0);

    fill: hsl(var(--base) / 0.7);

    filter: drop-shadow(20px 14px 10px rgba(0, 0, 0, 0.1));

  }



  25% {

    transform: scale(0.8) translate(20px, 30px) rotate(55deg);

    fill: hsl(var(--base) / 0.9);

    filter: drop-shadow(14px 14px 6px rgba(0, 0, 0, 0.1));

  }



  50% {

    transform: scale(0.6) translate(40px, 45px) rotate(180deg);

    fill: hsl(var(--base-two) / 0.4);

    filter: drop-shadow(-16px -16px 16px rgba(0, 0, 0, 0.1));

  }



  75% {

    transform: scale(0.8) translate(70px, 80px) rotate(55deg);

    fill: hsl(var(--base-two));

    filter: drop-shadow(14px 14px 6px rgba(0, 0, 0, 0.1));

  }



  100% {

    transform: scale(1) translate(0, 0) rotate(0);

    fill: hsl(var(--base));

    filter: drop-shadow(20px 14px 10px rgba(0, 0, 0, 0.1));

  }

}



@keyframes lineDownAnimate {

  0% {

    transform-origin: left;

    transform: scaleX(0);

  }



  50% {

    transform-origin: left;

    transform: scaleX(1);

  }



  51% {

    transform-origin: right;

    transform: scaleX(1);

  }



  100% {

    transform-origin: right;

    transform: scaleX(0);

  }

}



.zoomInOut {

  animation: zoomInOut 3s linear infinite;

}



@keyframes zoomInOut {

  0% {

    transform: scale(1.4);

  }



  50% {

    transform: scale(0.8);

  }



  100% {

    transform: scale(1.4);

  }

}



@keyframes gelatine {



  from,

  to {

    transform: scale(1, 1);

  }



  25% {

    transform: scale(0.9, 1.1);

  }



  50% {

    transform: scale(1.1, 0.9);

  }



  75% {

    transform: scale(0.95, 1.05);

  }

}



@keyframes shake1 {

  0% {

    transform: rotate(-5deg);

  }



  100% {

    transform: rotate(-10deg);

  }

}



.tree-view {

  list-style: none;

  margin-top: 20px;

}



.tree-view li {

  margin-left: 30px;

  padding: 12px 0px;

}



.tree-view .ref-name {

  position: relative;

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

}



.tree-view .ref-name::after {

  content: "";

  top: 19px;

  left: -14px;

  position: absolute;

  height: 8px;

  width: 8px;

  border-radius: 50%;

  background: hsl(var(--base-two));

}



.tree-view:first-child {

  border-left: none;

}



#ul {

  margin: 0;

  padding: 0;

}



.caret {

  cursor: pointer;

  user-select: none;

  position: relative;

  color: hsl(var(--base-two));

}



.caret::after {

  content: none !important;

}



.caret::before {

  position: absolute;

  content: "▶";

  top: 0;

  left: -20px;

  color: hsl(var(--base-two));

  display: inline-block;

}



.caret-down::before {

  transform: rotate(90deg);

}



.nested {

  display: none;

  border-left: 2px dashed hsl(var(--base-two) / 0.1);

}



.slick-initialized.slick-slider {

  margin: 0;

}



.slick-initialized.slick-slider .slick-track {

  display: flex;

  gap: 26px;

  padding: 20px 0px;

}



.slick-initialized.slick-slider .slick-slide {

  height: auto;

  padding: 0px 0px 0px 0px;

}



.slick-arrow {

  position: absolute;

  z-index: 1;

  top: 50%;

  right: 0px;

  transform: translateY(-50%);

  border: 1px solid hsl(var(--white));

  width: 50px;

  height: 50px;

  border-radius: 50%;

  display: flex;

  justify-content: center;

  align-items: center;

  transition: 0.2s linear;

  background-color: hsl(var(--base));

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

  font-size: 20px;

  margin: 0px;

}



@media screen and (max-width: 991px) {

  .slick-arrow {

    top: 50%;

  }

}



@media screen and (max-width: 991px) {

  .slick-arrow {

    width: 35px;

    height: 35px;

    font-size: 14px;

  }

}



@media screen and (max-width: 575px) {

  .slick-arrow {

    width: 30px;

    height: 30px;

  }

}



.slick-arrow:hover {

  border-color: hsl(var(--base));

  background-color: hsl(var(--base));

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

}



.slick-next {

  right: -70px;

  background-color: hsl(var(--base-two));

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

  border: 1px solid hsl(var(--white));

}



.slick-prev {

  left: -70px;

}



.slick-slide img {

  display: inline-block;

}



.slick-dots {

  text-align: center;

  position: absolute;

  left: 50%;

  transform: translateX(-50%);

  bottom: -70px;

}



.slick-dots li {

  display: inline-block;

}



.slick-dots li button {

  border: 1px solid transparent;

  background-color: hsl(var(--base) / 0.1);

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

  margin: 0 6px;

  width: 5px;

  height: 14px;

  border-radius: 50%;

  text-indent: -9999px;

  display: block;

}



.slick-dots li.slick-active button {

  background-color: hsl(var(--base));

}



.banner-slider .slick-prev {

  top: 40%;

  right: -70px;

  left: auto !important;

}



.banner-slider .slick-next {

  top: 55%;

}



@media (max-width: 1299px) {

  .banner-slider .slick-prev {

    right: -20px;

  }



  .slick-prev {

    left: -20px !important;

  }



  .slick-next {

    right: -20px;

  }

}



/* Magnific Popup button style */

button.mfp-close {

  top: -15px;

  font-size: 21px;

  font-weight: 800;

  height: 42px;

  background: transparent !important;

  border: 1px solid hsl(var(--base)) !important;

  line-height: 32px;

  padding: 0;

  opacity: 1;

  border-radius: 50%;

  cursor: pointer !important;

}



.mfp-image-holder .mfp-close,

.mfp-iframe-holder .mfp-close {

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

  right: 0px;

  text-align: right;

  padding-bottom: 2px;

  padding-right: 13px;

  width: 42px;

}



.massenger {

  margin-top: 40px;

  height: 78vh;

  overflow: hidden;

}



.message-list-box {

  box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px,

    rgba(17, 17, 26, 0.1) 0px 0px 8px;

}



.message-list-box .massenger-header {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  padding: 20px;

  box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;

  height: 140px;

}



.message-list-box .massenger-header .logo {

  max-width: 120px;

}



.message-list-box .massenger-header .msg-serch-box {

  position: relative;

}



.message-list-box .massenger-header .msg-serch-box i {

  position: absolute;

  top: 30%;

  right: 26px;

}



.message-list-box .message-list {

  margin: 8px 0px 0px 0px;

  padding: 0px 14px;

  height: 70vh;

  overflow-y: scroll;

}



.message-list-box .message-list a {

  display: block;

}



.message-list-box .message-list .msguser-card {

  padding: 14px 6px;

  display: flex;

  align-items: center;

  gap: 10px;

  border-radius: 4px;

}



.message-list-box .message-list .msguser-card .user-thumb {

  height: 50px;

  width: 50px;

}



.message-list-box .message-list .msguser-card .user-thumb img {

  height: 100%;

  width: 100%;

  border-radius: 50%;

  object-fit: cover;

}



.message-list-box .message-list .msguser-card .user-name {

  font-size: 16px;

}



.message-list-box .message-list .msguser-card .user-name .active {

  color: hsl(var(--base));

}



.message-list-box .message-list .msguser-card .user-name i {

  font-size: 8px;

}



.message-list-box .message-list .msguser-card .present-msg {

  color: hsl(var(--black) / 0.5);

  font-size: 12px;

}



.message-list-box .message-list .msguser-card:hover {

  background: hsl(var(--base) / 0.1);

}



.message-list-box ::-webkit-scrollbar {

  width: 4px;

}



.message-list-box ::-webkit-scrollbar-track {

  box-shadow: inset 0 0 5px hsl(var(--base) / 0.2);

}



.message-list-box ::-webkit-scrollbar-thumb {

  background: hsl(var(--base) / 0.5);

}



.message-list-box ::-webkit-scrollbar-thumb:hover {

  background: hsl(var(--base));

}



.message-main-body {

  box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px,

    rgba(17, 17, 26, 0.1) 0px 0px 8px;

}



.message-main-body .message-body-header {

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  align-items: center;

  padding: 10px 40px;

  box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;

}



.message-main-body .message-body-header .user-profile {

  display: flex;

  align-items: center;

  gap: 10px;

}



.message-main-body .message-body-header .user-profile .user-thumb {

  height: 40px;

  width: 40px;

}



.message-main-body .message-body-header .user-profile .user-thumb img {

  position: relative;

  height: 100%;

  width: 100%;

  border-radius: 50%;

  object-fit: cover;

}



.message-main-body .message-body-header .user-profile .user-name {

  font-size: 14px;

}



.message-main-body .message-body-header .user-profile .user-status {

  font-size: 12px;

  color: hsl(var(--black) / 0.5);

}



.message-main-body .message-body-header .msg-chat-control {

  position: relative;

  display: flex;

  gap: 12px;

}



.message-main-body .message-body-header .msg-chat-control i {

  cursor: pointer;

}



.message-main-body .message-body-header .msg-chat-control .setting-dropdown {

  box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;

  position: absolute;

  padding: 14px;

  width: 120px;

  top: 28px;

  right: 0;

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

  display: none;

}



.message-main-body .message-body-header .msg-chat-control .setting-dropdown ul li a {

  display: inline-flex;

  justify-content: flex-start;

  align-items: center;

  gap: 12px;

}



.message-main-body .message-body-header .msg-chat-control .setting-dropdown ul li a i {

  width: 16px;

}



.message-main-body .msg-list-wraper {

  height: 70vh;

  overflow-y: scroll;

}



.message-main-body .msg-list-wraper .message-text {

  box-sizing: border-box;

  padding: 8px 16px;

  margin: 16px;

  background: #fff;

  border-radius: 4px 4px 4px 0;

  min-height: 32px;

  width: -webkit-fit-content;

  width: -moz-fit-content;

  width: fit-content;

  max-width: 66%;

  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

  font-size: 14px;

  line-height: 1.5;

  word-break: break-word;

  font-size: 14px !important;

}



.message-main-body .msg-list-wraper .message-text .text p {

  font-size: 14px;

}



.message-main-body .msg-list-wraper .message-text .text video {

  width: 400px;

}



.message-main-body .msg-list-wraper .message-text .msg-text-meta {

  padding: 4px 0px;

  display: flex;

  flex-direction: row;

  gap: 16px;

  font-size: 12px;

}



.message-main-body .msg-list-wraper .message-text .msg-text-meta .text-dt {

  color: #999;

}



.message-main-body .msg-list-wraper .message-text .msg-text-meta span i {

  color: hsl(var(--base));

}



.message-main-body .msg-list-wraper .odd {

  margin: 16px 16px 16px auto;

  border-radius: 4px 4px 0 4px;

  background: hsl(var(--base) / 0.05);

  text-align: left;

}



.message-main-body .msg-list-wraper .msg-time {

  font-size: 11.2px;

  background: #eee;

  padding: 0 16px;

  border-radius: 32px;

  color: #999;

  width: -webkit-fit-content;

  width: -moz-fit-content;

  width: fit-content;

  margin: 16px auto;

  line-height: 27px;

}



.message-main-body ::-webkit-scrollbar {

  width: 4px;

}



.message-main-body ::-webkit-scrollbar-track {

  box-shadow: inset 0 0 5px hsl(var(--base) / 0.2);

}



.message-main-body ::-webkit-scrollbar-thumb {

  background: hsl(var(--base) / 0.5);

}



.message-main-body ::-webkit-scrollbar-thumb:hover {

  background: hsl(var(--base));

}



.msg-setting-show .setting-dropdown {

  display: block !important;

}



.msg-btm {

  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

  padding: 0px 40px;

  border-radius: 0px 0px 8px 8px;

}



.msg-btm .msg-input {

  position: relative;

  padding: 10px 0px;

  width: 100%;

}



.msg-btm .msg-input form {

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  align-items: center;

  gap: 12px;

}



.msg-btm .msg-input form .attchment-input-box {

  position: relative;

}



.msg-btm .msg-input form .attchment-input-box i {

  cursor: pointer;

  font-size: 24px;

}



.msg-btm .msg-input form .attchment-input-box .att-file-name {

  position: absolute;

  width: 200px;

  left: 0;

  top: -70px;

  color: hsl(var(--base));

  font-size: 10px;

}



.msg-btm .msg-input form button {

  position: absolute;

  right: 20px;

  font-size: 24px;

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

}



.msg-btm .msg-input .emojionearea {

  border: 1px solid hsl(var(--black) / 0.6) !important;

  border-radius: 8px !important;

}



.msg-btm .msg-input .emojionearea .emojionearea-editor {

  min-height: 4em !important;

  max-height: 0em !important;

  border: 1px solid transparent !important;

  border-radius: 8px !important;

  padding: 17px 50px 6px 50px !important;

}



.msg-btm .msg-input .emojionearea .form-control {

  max-height: 6vh !important;

  border: 1px solid hsl(var(--base)) !important;

}



.msg-btm .msg-input .emojionearea .emojionearea-button {

  z-index: 5;

  position: absolute;

  left: 10px;

  top: 15px;

  width: 24px;

  height: 24px;

  opacity: 1;

  cursor: pointer;

  -moz-transition: opacity 0.3s ease-in-out;

  -o-transition: opacity 0.3s ease-in-out;

  -webkit-transition: opacity 0.3s ease-in-out;

  transition: opacity 0.3s ease-in-out;

}



.msg-btm .msg-input .emojionearea-picker .emojionearea-filters {

  background: hsl(var(--base) / 0.5);

}



.msg-btm .msg-input .emojionearea .emojionearea-picker.emojionearea-picker-position-top {

  left: 10px !important;

}



.msg-btm .msg-input .emojionearea .emojionearea-picker.emojionearea-filters-position-top.emojionearea-search-position-top .emojionearea-scroll-area {

  bottom: 0;

}



.msg-btm .msg-input ::after {

  left: 20px !important;

}



.open-message-list-btn {

  display: none;

}



@media (max-width: 991px) {

  .message-list-box {

    display: none;

  }



  .message-list-show .message-list-box {

    display: block !important;

    position: absolute;

    z-index: 9;

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

    max-width: 250px;

  }



  .message-list-show .message-list {

    height: 73.5vh !important;

  }



  .open-message-list-btn {

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

    display: block !important;

    position: absolute;

    top: 50%;

    left: 0px;

    z-index: 99 !important;

    padding: 12px;

    border-radius: 0px 50px 50px 0px;

  }



  .open-message-list-btn i {

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

  }

}



@media (max-width: 769px) {

  .massenger {

    margin-top: 65px;

    height: 91vh;

  }



  .massenger-section {

    height: 90vh;

  }



  .msg-list-wraper {

    height: 74vh !important;

  }

}



@media (max-width: 426px) {

  .msg-btm .msg-input .emojionearea .emojionearea-editor {

    min-height: 3em !important;

  }



  .msg-btm .msg-input .emojionearea .emojionearea-button {

    top: 8px;

  }



  .msg-btm .msg-input .emojionearea .emojionearea-picker.emojionearea-picker-position-top {

    left: -84px !important;

  }



  .msg-list-wraper {

    height: 66vh !important;

  }



  .message-list-show .message-list {

    height: 64vh !important;

  }



  .msg-btm .msg-input form button {

    font-size: 16px;

  }



  .msg-btm .msg-input form .attchment-input-box i {

    font-size: 16px;

  }



  .msg-btm .msg-input .emojionearea .emojionearea-editor {

    padding: 12px 50px 6px 50px !important;

  }

}



/* drag and drop box */

.photo_upload .drag_area {

  height: 400px;

  border-radius: 8px;

  border: 1px dashed hsl(var(--black) / 0.2);

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

  user-select: none;

  --webkit-user-select: none;

}



.photo_upload .drag_area .visible {

  font-size: 18px;

}



.photo_upload .select {

  cursor: pointer;

  transition: 0.4s;

}



.photo_upload .select:hover {

  opacity: 0.6;

}



.photo_upload .container_area {

  width: 100%;

  height: auto;

  display: flex;

  justify-content: flex-start;

  align-items: flex-start;

  flex-wrap: wrap;

  max-height: 200px;

  overflow-y: auto;

  margin-top: 30px;

}



.photo_upload .container_area .image {

  height: 75px;

  margin-left: 5px;

  width: 75px;

  position: relative;

  margin-bottom: 8px;

}



.photo_upload .container_area .image img {

  width: 100%;

  height: 100%;

  border-radius: 8px;

}



.photo_upload .container_area .image .delete {

  position: absolute;

  display: flex;

  justify-content: center;

  align-items: center;

  height: 24px;

  width: 24px;

  border-radius: 50%;

  background: hsl(var(--black) / 0.6);

  top: 0px;

  right: 0px;

  font-size: 12px;

  cursor: pointer;

  color: hsl(var(--base));

  z-index: 9;

}



.photo_upload input,

.photo_upload .drag_area .on-drop,

.photo_upload .drag_area.dragover .visible {

  display: none;

}



.drag_drop_content {

  display: flex;

  gap: 12px;

  flex-direction: column;

  justify-content: center;

  align-items: center;

}



.drag_drop_content .icon_wrap {

  width: 90px;

  height: 90px;

  border-radius: 50%;

  background: hsl(var(--black) / 0.06);

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

}



.drag_drop_content .icon_wrap i {

  font-size: 30px;

}



.select2-container .select2-selection--single {

  height: 48px;

}



.select2-container--default .select2-selection--single .select2-selection__rendered {

  color: #444;

  line-height: 46px;

}



.banner--filter__inputs .select2-container--default .select2-selection--single {

  border-radius: 50px;

}



.banner--filter__inputs .select2-container--default.select2-container--open.select2-container--below .select2-selection--single,

.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {

  border-bottom-left-radius: 50px;

  border-bottom-right-radius: 50px;

  border-color: hsl(var(--base));

}



.banner--filter__inputs .select2-container--default .select2-selection--single .select2-selection__arrow {

  top: 11px;

  right: 6px;

}



.banner--filter__inputs .select2-container .select2-selection--single .select2-selection__rendered {

  padding-left: 50px;

}



.banner--filter__inputs .select2-container--default .select2-selection--single {

  background-color: transparent;

  border: 1px solid hsl(var(--black) / 0.2);

}



.select2-container--open .select2-dropdown--below {

  border-top: 1px solid #aaa;

  border-radius: 10px;

  top: 6px;

}



.select2-container--default .select2-search--dropdown .select2-search__field {

  border: 1px solid #aaa;

  border-radius: 7px;

}



.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {

  background-color: hsl(var(--base));

  color: white;

}



.select2-container--default .select2-results__option--selected {

  background-color: hsl(var(--base) / 0.25);

}



#preloader {

  position: fixed;

  top: 0;

  left: 0;

  z-index: 1040;

  width: 100vw;

  height: 100vh;

  background-color: hsl(var(--dark));

  -webkit-backdrop-filter: blur(10px);

  backdrop-filter: blur(10px);

  display: -ms-grid;

  display: grid;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  border-bottom-left-radius: 0;

  border-bottom-right-radius: 0;

  -webkit-transition: height 0.5s, opacity 0.5s, border-radius 0.5s;

  -o-transition: height 0.5s, opacity 0.5s, border-radius 0.5s;

  transition: height 0.5s, opacity 0.5s, border-radius 0.5s;

}



#preloader #text {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 12px;

}



@media screen and (max-width: 767px) {

  #preloader #text {

    gap: 7px;

  }

}



#preloader #text p {

  color: hsl(var(--base));

  font-size: 3.625rem;

  font-weight: 800;

  margin: 0;

  opacity: 0;

  -webkit-animation: fadeIn 1.5s ease-in-out infinite;

  animation: fadeIn 1.5s ease-in-out infinite;

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

}



@media screen and (max-width: 1199px) {

  #preloader #text p {

    font-size: 3.75rem;

  }

}



@media screen and (max-width: 991px) {

  #preloader #text p {

    font-size: 3.625rem;

  }

}



@media screen and (max-width: 575px) {

  #preloader #text p {

    font-size: 3.563rem;

  }

}



@media screen and (max-width: 767px) {

  #preloader #text p {

    font-size: 2.375rem;

  }

}



@media screen and (max-width: 767px) and (max-width: 1199px) {

  #preloader #text p {

    font-size: 2.438rem;

  }

}



@media screen and (max-width: 767px) and (max-width: 991px) {

  #preloader #text p {

    font-size: 2.375rem;

  }

}



@media screen and (max-width: 767px) and (max-width: 575px) {

  #preloader #text p {

    font-size: 2.313rem;

  }

}



#preloader #text p:nth-child(1) {

  -webkit-animation-delay: 0s;

  animation-delay: 0s;

}



#preloader #text p:nth-child(2) {

  -webkit-animation-delay: 0.2s;

  animation-delay: 0.2s;

}



#preloader #text p:nth-child(3) {

  -webkit-animation-delay: 0.4s;

  animation-delay: 0.4s;

}



#preloader #text p:nth-child(4) {

  -webkit-animation-delay: 0.6s;

  animation-delay: 0.6s;

}



#preloader #text p:nth-child(5) {

  -webkit-animation-delay: 0.8s;

  animation-delay: 0.8s;

}



#preloader #text p:nth-child(6) {

  -webkit-animation-delay: 1s;

  animation-delay: 1s;

}



#preloader #text p:nth-child(7) {

  -webkit-animation-delay: 1.2s;

  animation-delay: 1.2s;

}



#preloader #text p:nth-child(8) {

  -webkit-animation-delay: 1.4s;

  animation-delay: 1.4s;

}



#preloader #text p:nth-child(9) {

  -webkit-animation-delay: 1.6s;

  animation-delay: 1.6s;

}



#preloader #text p:nth-child(10) {

  -webkit-animation-delay: 1.8s;

  animation-delay: 1.8s;

}



.hero {

  padding: 140px 0px 80px 0px;

  position: relative;

  overflow: hidden;

  z-index: 1;

  height: 90vh;

  display: flex;

  flex-direction: column;

  justify-content: end;

}

@media screen and (max-width: 575px) {
  .hero {
    height: 100% !important;
    padding-bottom: 0px !important;
  }

}



.hero .hero--content .title {

  font-size: 60px;

  text-transform: capitalize;

  line-height: 1.25;

  margin-bottom: 0px;

}



.hero .hero--content .subtitle {

  margin-bottom: 20px;

}



.hero .banner--filter__wrap {

  margin: 0px 0px 30px 0px;

  padding: 15px 15px 15px 15px;

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

  border-radius: 50px 50px 50px 50px;

  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;

}



.hero .banner--filter__wrap .banner--filter__inputs {

  display: grid;

  align-items: center;

  flex-grow: 1;

  gap: 14px;

  grid-template-columns: repeat(4, 1fr);

}



.hero .banner--filter__wrap .banner--filter__inputs .icon--wrap {

  top: 10px;

  left: 25px;

}



.hero .banner--filter__wrap .banner--filter__inputs .form--control {

  padding-left: 50px !important;

  border: 1px solid hsl(var(--black) / 0.2);

}



.hero .gallery--grid__thumb {

  background-color: hsl(var(--black) / 0.1);

  width: 100%;

  border-radius: 20px;

  overflow: hidden;

}



.hero .gallery--grid__thumb.full {

  height: 400px;

}



.hero .gallery--grid__thumb.small {

  height: 192px;

}



.hero .gallery--grid__thumb.x-small {

  height: 145px;

}



.hero .gallery--grid__thumb a:hover .gallery--overlay {

  opacity: 1;

  visibility: visible;

  width: 100%;

  height: 100%;

}



.hero .gallery--grid__thumb .gallery--overlay {

  top: 50%;

  left: 50%;

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

  display: flex;

  justify-content: center;

  align-items: center;

  width: 80%;

  height: 80%;

  background-color: hsl(var(--base) / 0.7);

  font-size: 20px;

  color: hsl(var(--base));

  transition: 0.3s linear;

  opacity: 0;

  visibility: hidden;

  border-radius: 12px;

}



.hero .gallery--grid__thumb .gallery--overlay i {

  z-index: 9;

}



.hero .gallery--grid__thumb .gallery--overlay::after {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

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

  width: 70px;

  height: 70px;

  border-radius: 12px;

  background-color: hsl(var(--dark));

}



.hero .gallery--grid__thumb .gallery--overlay::before {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

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

  width: 90px;

  height: 90px;

  border-radius: 16px;

  background-color: hsl(var(--dark) / 0.3);

}



.hero .hero--element__wrap .fly--image__wrap {

  position: absolute;

  right: 2%;

  bottom: 0%;

  width: 307.548px;

  height: 244.415px;

}



.hero .hero--element__wrap .fly--image__wrap .fly--thumb {

  position: absolute;

  width: 50px;

  height: 50px;

  pointer-events: none;

}



.hero .hero--element__wrap .tree--wrap__one {

  position: absolute;

  bottom: 0;

  left: -3px;

  animation: shake1 1s linear infinite alternate;

}



.hero .hero--element__wrap .map--wrap {

  position: absolute;

  top: 45%;

  left: 50%;

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

}



.hero .hero--element__wrap .map--wrap .map {

  width: 1100px;

  height: auto;

}



.hero .hero--element__wrap .map--wrap .map path {

  fill: hsl(var(--base) / 0.1);

}



.hero .hero--element__wrap .airplane--two .thumb--wrap {

  position: absolute;

  bottom: 0px;

  animation: plane-fly-two 20s linear infinite;

  opacity: 0.5;

}



@keyframes plane-fly-two {

  0% {

    left: 0;

    bottom: 0px;

    rotate: 10deg;

  }



  80% {

    left: 30%;

    rotate: -10deg;

    rotate: -5deg;

  }



  100% {

    bottom: 1100px;

    left: 35%;

    rotate: -10deg;

    rotate: 0deg;

  }

}



.svg-stroke--animation {

  stroke: hsl(var(--black)) !important;

  stroke-width: 1px !important;

}



@keyframes draw {

  0% {

    stroke-dasharray: 2000;

    stroke-dashoffset: 2000;

  }



  100% {

    stroke-dasharray: 2000;

    stroke-dashoffset: 0;

  }

}



.svg-fill--base {

  fill: hsl(var(--base));

}



.svg-stroke--base-two {

  stroke: hsl(var(--base-two) / 0.6);

}



.footer-area {

  position: relative;

  background-color: transparent;

}



.footer-area .bg--element {

  top: 0;

  right: 0;

}



.footer-area .bg--element img {

  opacity: 0.3;

}



.footer-area .bg--element-three {

  bottom: 0;

  right: 25%;

  width: 200px;

}



.footer-area .bg--element-three img {

  opacity: 0.3;

}



.footer-area .airplane--two .thumb--wrap {

  position: absolute;

  bottom: 0px;

  animation: ballon-fly 15s linear infinite;

  opacity: 0.5;

}



@keyframes ballon-fly {

  0% {

    left: 0;

    bottom: 0px;

    rotate: 10deg;

  }



  25% {

    rotate: -10deg;

  }



  50% {

    rotate: 10deg;

  }



  75% {

    rotate: -10deg;

  }



  80% {

    left: 15%;

    rotate: 10deg;

  }



  100% {

    bottom: 110%;

    left: 20%;

    rotate: 0deg;

  }

}



.footer-area .cloud--group__one {

  top: 10%;

  left: 5%;

}



.footer-area .cloud--group__one .cloud-one {

  top: 0px;

  right: 0;

}



.footer-area .cloud--group__one .cloud-two {

  top: 14px;

  right: -90px;

}



.footer-area .cloud--group__one .cloud-three {

  top: 29px;

  right: 115px;

}



.footer-area .cloud--group__one .cloud-four {

  top: 66px;

  right: 105px;

}



.footer-area .cloud--group__one .cloud-five {

  top: 36px;

  right: 6px;

}



.footer-item .latest-blog__title a {

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

}



.footer-item .latest-blog {

  padding-bottom: 15px;

  margin-bottom: 15px;

  border-bottom: 1px solid hsl(var(--black) / 0.1);

}



.footer-item span.latest-blog__date {

  color: hsl(var(--black) / 0.6);

}



.footer-item--desc {

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

  margin-bottom: 36px;

  width: 100%;

}



.footer-item--logo {

  margin-bottom: 20px;

}



.footer-item--logo a img {

  width: 100%;

  height: 100%;

  max-width: 160px;

  max-height: 64px;

  filter: brightness(1);

}



.footer-item--title {

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

  position: relative;

  font-weight: 500;

  font-size: 20px;

  margin-bottom: 20px;

}



.footer-item .social-list {

  margin-top: 10px;

  display: flex;

  gap: 12px;

}



@media screen and (max-width: 991px) {

  .footer-item .social-list {

    margin-top: 20px;

  }

}



@media screen and (max-width: 575px) {

  .footer-item .social-list {

    margin-top: 15px;

  }

}



.footer-item .social-list--item .social-list__link {

  font-size: 20px;

  border: 0px;

  color: hsl(var(--base));

}



.footer-item .social-list--item .social-list__link:hover {

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

}



.icon-wrapper .icon {

  background: transparent;

  transition: 0.2s linear;

  border: 1px solid hsl(var(--black) / 0.2);



  &.active {

    background: hsl(var(--base));

    transition: 0.2s linear;

    border: 1px transparent;



    i {

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

    }

  }

}



.icon-wrapper .icon i {

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

  transition: 0.2s linear;

  font-size: 16px;

}



.icon-wrapper .icon:hover {

  background: hsl(var(--base));

  transition: 0.2s linear;

  border: 1px transparent;

}



.icon-wrapper .icon:hover i {

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

  transition: 0.2s linear;

}



.icon-wrapper div {

  width: 44px;

  height: 44px;

  border-radius: 50%;

  display: flex;

  justify-content: center;

  align-items: center;

}



.menu {

  display: flex;

  flex-direction: column;

  gap: 8px;

  margin: -5px 0;

}



.menu--item {

  display: block;

  padding: 8px 0;

}



.menu--link {

  position: relative;

  color: hsl(var(--black) / 0.8);

  display: flex;

  align-items: center;

  gap: 8px;

}



.menu--link i {

  font-size: 14px;

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

  rotate: -45deg;

  transition: 0.3s linear;

}



.menu--link:hover {

  color: hsl(var(--base));

  margin-left: 4px;

}



.menu--link:hover i {

  rotate: 0deg;

  color: hsl(var(--base));

}



.footer-contact-menu {

  margin: -6px 0;

}



.footer-contact-menu__item {

  display: flex;

  padding: 1px 0;

}



.footer-contact-menu__item p {

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

}



.footer-contact-menu__item-icon {

  width: 15px;

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

  font-size: 15px;

}



.footer-contact-menu__item-content {

  width: calc(100% - 15px);

  padding-left: 15px;

}



.bottom-footer {

  position: relative;

  background-color: hsl(var(--black) / 0.02);

}



.bottom-footer .bottom-footer-text {

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

}



@media screen and (max-width: 991px) {

  .bottom-footer .bottom-footer-text {

    text-align: center;

  }

}



@media screen and (max-width: 424px) {

  .bottom-footer .bottom-footer-text {

    font-size: 14px;

  }

}



.subscribe-box {

  position: relative;

}



.subscribe-box form {

  display: flex;

  justify-content: space-around;

  align-items: center;

  position: relative;

}



.subscribe-box input {

  background-color: hsl(var(--base) / 0.1);

  border: 1px solid hsl(var(--base) / 0.1);

  outline: none;

  padding-right: 72px;

  color: hsl(var(--black)) !important;

}



.subscribe-box input::placeholder {

  color: hsl(var(--black) / 0.8) !important;

}



.subscribe-box input:focus {

  border: 1px solid hsl(var(--base) / 0.3);

  background-color: hsl(var(--white) / 0.1);

}



.subscribe-box .sub-btn {

  position: absolute;

  right: 6px;

  padding: 6px 16px;

  border-radius: 10px;

  background-color: hsl(var(--base));

}



.subscribe-box .sub-btn i {

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

}



.footer-contact-info p {

  color: hsl(var(--black) / 0.8);

  width: 100%;

}



.footer-contact-info p a {

  color: hsl(var(--black) / 0.8);

}



.footer-contact-info i {

  font-size: 20px;

  color: hsl(var(--base));

}



.footer-logo-dark {

  display: none;

}



.breadcrumb {

  position: relative;

  padding: 145px 0px 80px 0px;

  z-index: 1;

  overflow: hidden;

}



.breadcrumb .bg--thumb-one {

  top: 50%;

  left: 0;

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

}



.breadcrumb .bg--thumb-two {

  top: 50%;

  right: 0;

  transform: translate(0%, 0%);

}



.breadcrumb .bg--thumb-two img {

  opacity: 0.3;

}



@media screen and (max-width: 991px) {

  .breadcrumb {

    padding: 100px 0px 40px 0px;

  }

}



@media screen and (max-width: 770px) {

  .breadcrumb {

    padding: 100px 0px 30px 0px;

  }

}



.breadcrumb .content--wrap {

  background-color: hsl(var(--black) / 0.1);

  border-radius: 18px 18px 0px 0px;

  padding: 12px 12px 0px 12px;

}



.breadcrumb .content--wrap .content {

  background-color: hsl(var(--hero-bg));

  border-radius: 18px 18px 0px 0px;

  padding: 80px 60px 0px 60px;

}



.breadcrumb .breadcrumb-bg--img {

  position: absolute;

  top: -60px;

  left: 0px;

}



.breadcrumb--wrapper {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  align-items: center;

  gap: 8px;

  width: 100%;

}



.breadcrumb--title {

  font-size: 48px;

  margin: 0px !important;

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

  text-align: center;

  line-height: 1.25;

  font-weight: 700;

  flex-shrink: 0;

}



.breadcrumb--list {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  width: 100%;

  gap: 12px;

}



.breadcrumb--item {

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

  padding-right: 4px;

  font-weight: 400;

  font-size: 18px;

}



@media screen and (max-width: 575px) {

  .breadcrumb--item {

    font-size: 15px;

  }

}



.breadcrumb--item--text {

  color: hsl(var(--base));

}



.breadcrumb--icon {

  color: hsl(var(--base));

  line-height: 28px;

  font-size: 12px;

}



.breadcrumb--link {

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

  font-weight: 600;

}



.breadcrumb--link:hover {

  color: hsl(var(--base));

}



.animate--thumb .element1 {

  position: absolute;

  top: -28%;

  left: 35%;

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

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

}



.animate--thumb .element2 {

  position: absolute;

  top: -10%;

  left: 35%;

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

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

}



.count-card {

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

}



.count-card .count-number-wraper {

  display: flex;

  align-items: center;

}



.count-card .count-number-wraper .amount {

  font-size: 56px;

  font-weight: 600;

  line-height: 1.55;

  margin: 0px;

}



.count-card .subtitle {

  font-size: 14px;

  font-weight: 500;

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

  text-transform: uppercase;

}



.scroll-top {

  position: fixed;

  right: 30px;

  bottom: 42px;

  height: 50px;

  width: 50px;

  cursor: pointer;

  display: block;

  border-radius: 50px;

  z-index: 10000;

  opacity: 1;

  visibility: hidden;

  -webkit-transform: translateY(45px);

  -ms-transform: translateY(45px);

  transform: translateY(45px);

  -webkit-transition: all 300ms linear;

  transition: all 300ms linear;

}



.scroll-top svg {

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

  border-radius: 50%;

  background: hsl(var(--dark));

}



.scroll-top svg path {

  fill: none;

}



.scroll-top::after {

  content: "\f062";

  font-family: FontAwesome;

  position: absolute;

  text-align: center;

  line-height: 50px;

  font-size: 20px;

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

  left: 0;

  top: 0;

  height: 50px;

  width: 50px;

  cursor: pointer;

  display: block;

  z-index: 1;

  border: 2px solid hsl(var(--white));

  box-shadow: none;

  border-radius: 50%;

}



.scroll-top .progress-circle path {

  stroke: hsl(var(--base));

  stroke-width: 10px;

  box-sizing: border-box;

  -webkit-transition: all 400ms linear;

  transition: all 400ms linear;

}



.show {

  opacity: 1;

  visibility: visible;

  -webkit-transform: translateY(0);

  -ms-transform: translateY(0);

  transform: translateY(0);

}



@media (max-width: 430px) {

  .scroll-top {

    right: 20px;

    bottom: 70px;

  }

}



/* dashboard Sidebar Menu Start */

.dashboard_profile .sidebar-menu-list__link {

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

}



.dashboard_profile .sidebar-menu-list__link:hover {

  background: hsl(var(--base) / 0.1);

}



.sidebar-menu-list__link.active {

  position: relative;

  background: hsl(var(--base) / 0.05);

}



.sidebar-menu-list__link.active .icon {

  color: hsl(var(--base));

}



/* .sidebar-menu-list__link.active .text {

    color: hsl(var(--base));

} */



.sidebar-menu {

  padding: 0px 0px 10px 0px;

  transition: 0.2s linear;

  border-radius: 20px;

  border: 1px solid hsl(var(--black) / 0.15);

  background: hsl(var(--section-bg));

  position: fixed;

  top: 22px;

  left: 22px;

  z-index: 99;

  width: 277px;

}



.sidebar-menu .logo-wrapper {

  padding: 24px 0px;

  display: flex;

  justify-content: center;

  align-items: center;

}



.sidebar-menu.show-sidebar {

  transform: translateX(0);

}



@media screen and (max-width: 1199px) {

  .sidebar-menu {

    position: fixed;

    left: 0;

    top: 0;

    min-width: 320px;

    transform: translateX(-100%);

    z-index: 9992;

    border-radius: 0;

  }

}



.sidebar-menu__close {

  position: absolute;

  top: 12px;

  right: 12px;

  color: hsl(var(--base));

  border: 1px solid hsl(var(--base));

  width: 35px;

  height: 35px;

  line-height: 35px;

  text-align: center;

  font-size: 18px;

  transition: 0.2s linear;

  cursor: pointer;

  display: none;

  z-index: 9;

  border-radius: 3px;

}



@media screen and (max-width: 1199px) {

  .sidebar-menu__close {

    display: block;

  }

}



.sidebar-menu__close:hover,

.sidebar-menu__close:focus {

  background-color: hsl(var(--base));

  border-color: hsl(var(--base));

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

}



.sidebar-menu-list {

  height: 84.5vh;

  overflow-y: auto;

  padding: 0px 0px 120px 0px;

  position: relative;

}



.sidebar-menu-list__item {

  margin: 0px 20px 8px 20px;

}



.sidebar-menu-list__item.has-dropdown.active {

  border-radius: 4px;

}



.sidebar-menu-list__item.has-dropdown.active>.sidebar-menu-list__link {

  background: hsl(var(--base) / 0.05) !important;

}



.sidebar-menu-list__item.has-dropdown.active>a:after {

  transform: rotate(90deg);

  margin-left: 14px;

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

}



.sidebar-menu-list__item.has-dropdown>a:after {

  font-family: "Font Awesome 5 Free";

  font-weight: 900;

  content: "\f105";

  position: absolute;

  top: 20px;

  right: 20px;

  transition: 0.1s linear;

  margin-left: 14px;

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

}



.sidebar-menu-list__link {

  display: flex;

  align-items: center;

  text-decoration: none;

  gap: 12px;

  position: relative;

  padding: 16px 20px 16px 20px;

  width: 100%;

  color: hsl(var(--black)) !important;

  border-radius: 12px;

}



.sidebar-menu-list__link:hover {

  background: hsl(var(--base) / 0.05);

  color: hsl(var(--base));

}



.sidebar-menu-list__link .icon {

  display: block;

  width: 30px;

  height: 30px;

  background-color: hsl(var(--base) / 0.05);

  display: flex;

  justify-content: center;

  align-items: center;

  font-size: 16px;

  border-radius: 4px;

  animation: swing ease-in-out 0.5s 1 alternate;

  color: hsl(var(--base));

}



/*=============== Sidebar Submenu Start ===============*/

.sidebar-submenu {

  display: none;

  position: relative;

}



.sidebar-submenu.open-submenu {

  display: block;

}



.sidebar-submenu-list {

  padding: 5px 0;

}



.sidebar-submenu-list__item {

  position: relative;

}



.sidebar-submenu-list__item.active::before {

  background: hsl(var(--base)) !important;

}



.sidebar-submenu-list__item.active>a {

  color: hsl(var(--base));

}



.sidebar-submenu-list__link {

  margin: 0px 20px 8px 24px !important;

  padding: 12px 0px 12px 16px;

  display: block;

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

  border-bottom: 1px solid transparent;

  border-radius: 8px;

}



.sidebar-submenu-list__link:hover {

  border-bottom: 1px solid hsl(var(--base)) !important;

  border-radius: 8px;

}



.sidebar-submenu-list__link.active {

  border-bottom: 1px solid hsl(var(--base)) !important;

  border-radius: 8px;

}



.sidebar-submenu-list__link.active:hover {

  background: transparent !important;

}



@keyframes swing {

  0% {

    transform: rotate(0deg);

  }



  10% {

    transform: rotate(10deg);

  }



  30% {

    transform: rotate(0deg);

  }



  40% {

    transform: rotate(-10deg);

  }



  50% {

    transform: rotate(0deg);

  }



  60% {

    transform: rotate(5deg);

  }



  70% {

    transform: rotate(0deg);

  }



  80% {

    transform: rotate(-5deg);

  }



  100% {

    transform: rotate(0deg);

  }

}



/*========  responsive sidebar menu  =======*/

.sidebar-menu-wrapper {

  width: 300px;

  height: 100vh;

  background-color: hsl(var(--dark));

  position: fixed;

  z-index: 15;

  left: -320px;

  transition: all 0.4s ease-in-out;

}



.sidebar-menu-wrapper.show {

  left: 0;

}



.sidebar-menu-wrapper .top-close {

  margin-top: 21px;

  text-align: end;

  margin-right: 24px;

}



.sidebar-menu-wrapper .top-close i {

  font-size: 22px;

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

}



.sidebar-menu-wrapper .header-wrapper .logo-wrapper img {

  width: 130px;

  margin-left: 6px;

}



@media screen and (max-width: 991px) {

  .sidebar-menu-wrapper .header-wrapper .logo-wrapper img {

    margin-left: 15px;

  }

}



@media screen and (max-width: 575px) {

  .sidebar-menu-wrapper .header-wrapper .logo-wrapper img {

    margin-left: 6px;

  }

}



.sidebar-menu-list__item .btn.btn--base {

  border: 1px solid hsl(var(--black));

}



.sidebar-menu-list__item a span {

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

}



.header {

  /* position: absolute; */

  z-index: 5;

  padding: 0px;

  width: 100%;

}



@media screen and (max-width: 991px) {

  .header {

    top: 0px;

    padding: 18px 36px;

    /* position: absolute; */

    left: 0;

    right: 0;

    z-index: 7;

  }



  .header::-webkit-scrollbar {

    width: 5px;

    height: 5px;

  }



  .header::-webkit-scrollbar-thumb {

    border-radius: 0px;

  }

}



@media screen and (max-width: 575px) {

  .header {

    padding: 12px 0px;

  }

}



.header.fixed-header {

  background-color: hsl(var(--body-color));

  position: fixed;

  top: 0px;

  animation: slide-down 0.8s;

  width: 100%;

  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16);

  -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16);

  -moz-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16);

  padding: 0px;

  z-index: 99;

  border-bottom: 1px solid hsl(var(--white) / 0.1);

}



.header.fixed-header .header-wrapper {

  padding: 22px 0px;

}



.header.fixed-header .header-wrapper .main-menu li a {

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

}



.header.fixed-header .login--btn {

  border: 1px solid hsl(var(--white));

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

}



.header.fixed-header .language-box .select {

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

}



.header.fixed-header .language-box i {

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

}



.header-main-area .container-fluid {

  padding: 0 100px;

}



@media screen and (max-width: 1399px) {

  .header-main-area .container-fluid {

    padding: 0 60px;

  }

}



@media screen and (max-width: 575px) {

  .header-main-area .container-fluid {

    padding: 0 25px;

  }

}



.scrolled {

  display: none !important;

}



.header-wrapper {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 24px 0px;

}



@media screen and (max-width: 991px) {

  .header-wrapper {

    padding: 0px 0;

  }

}



@media screen and (max-width: 575px) {

  .header-wrapper {

    padding: 10px 15px !important;

  }

}



.header-wrapper .ham__menu {

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

  display: none;

}



@media screen and (max-width: 991px) {

  .header-wrapper .ham__menu {

    display: block !important;

  }

}



.header-wrapper .logo-wrapper img {

  max-width: 200px;

  filter: brightness(1);

}



@media screen and (max-width: 991px) {

  .header-wrapper .logo-wrapper img {

    width: 160px;

  }

}



@media screen and (max-width: 424px) {

  .header-wrapper .logo-wrapper img {

    width: 112px;

  }

}



.header-wrapper .main-menu {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 12px;

}



@media screen and (max-width: 991px) {

  .header-wrapper .main-menu {

    display: none !important;

  }

}



@media screen and (max-width: 1199px) {

  .header-wrapper .main-menu {

    margin-left: 0px;

  }

}



.header-wrapper .main-menu li {

  transition: all 0.4s;

}



.header-wrapper .main-menu a {

  font-size: 16px;

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

  font-weight: 600;

  position: relative;

  text-transform: uppercase;

  margin-right: 22px;

}



.header-wrapper .main-menu a:hover {

  color: hsl(var(--base));

}



.header-wrapper .main-menu a:before {

  position: absolute;

  bottom: -6px;

  content: "";

  width: 90%;

  height: 3px;

  background: hsl(var(--base));

  transform: translateX(-100%);

  opacity: 0;

}



.header-wrapper .main-menu a.active {

  color: hsl(var(--base));

}



.header-wrapper .main-menu a.active:before {

  opacity: 1;

  transform: translateX(0);

}



@media screen and (max-width: 1399px) {

  .header-wrapper .main-menu a {

    font-size: 14px;

  }

}



@media screen and (max-width: 1199px) {

  .header-wrapper .main-menu a {

    padding: 0px;

    font-size: 14px;

  }

}



.header-wrapper .main-menu a:hover:before {

  opacity: 1;

  transition: 0.5s transform ease, 0.8s opacity ease;

  transform: translateX(0);

}



@media (max-width: 770px) {

  .header-wrapper .menu-list-wrapper {

    display: block !important;

  }



  .header-wrapper .menu-list-wrapper ul {

    gap: 0px;

  }

}



@media (max-width: 620px) {

  .header-wrapper .menu-list-wrapper ul:last-child {

    display: none;

  }

}



.header-wrapper .count-item {

  position: absolute;

  height: 19px;

  width: 19px;

  background: hsl(var(--base));

  text-align: center;

  border-radius: 50%;

  font-size: 13px;

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

  top: -7px;

  right: 7px;

  font-weight: 600;

  line-height: 19px;

}



@media screen and (max-width: 991px) {

  .header-wrapper .count-item {

    top: -4px;

  }

}



.header.fixed-header .header-wrapper .main-menu a {

  color: hsl(var(--base));

}



.header.fixed-header .header-wrapper .main-menu a:hover {

  color: hsl(var(--base));

}



.header.fixed-header .header-wrapper .main-menu a.active {

  color: hsl(var(--base));

}



.header.fixed-header .light-dark-btn-wrap .mon-icon {

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

}



.header.fixed-header .menu-search-wrap .menu-search-wrap--search-icon i {

  font-size: 17px;

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

}



.language-box {

  display: flex;

  align-items: center;

  position: relative;



  button {

    img {

      width: 22px;

      height: 22px;

      border-radius: 50%;

      margin-right: 4px;

    }

  }

}



.language-box i {

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

  font-size: 17px;

  margin-right: 5px;

}



.language-box .select {

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

  background-color: transparent;

  border: 1px solid transparent;

  padding: 3px 0px;

  font-size: 16px;

}



.language-box .select option {

  background-color: hsl(var(--dark));

}



.login--btn {

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

  font-weight: 600;

  padding: 10px 18px;

  border-radius: 5px;

  border: 1px solid hsl(var(--black));

}



.login--btn:hover {

  background-color: hsl(var(--base));

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

}



.login-lng li .cart--btn {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 40px;

  height: 40px;

  border-radius: 50%;

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

  border: 1px solid hsl(var(--base));

}



.login-lng li .count--item {

  top: -10px;

  right: -10px;

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

  background: hsl(var(--base));

  border-radius: 20px;

  font-size: 9px;

  font-weight: 700;

  padding: 2px 4px;

  border: 1px solid hsl(var(--white));

  width: 78%;

  text-align: center;

}



.section-content .title-wrap .title {

  line-height: 1.18;

}



.section-content .heading--wrap {

  position: relative;

  z-index: 1;

}



.section-content .heading--wrap::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: 14px;

  width: 100%;

  height: 10px;

  border-radius: 20px;

  background-color: hsl(var(--base));

  z-index: -1;

}



.section-content .heading--wrap .heading {

  text-transform: uppercase;

  position: relative;

}



.section-content-2 .title-wrap {

  display: flex;

  justify-content: space-between;

}



.section-content-2 .title-wrap .title {

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

  font-size: 24px !important;

  font-weight: 700;

  line-height: 1.16;

  margin: 0px;

}



.section-content-3 .title {

  font-size: 36px !important;

  font-weight: 700;

  margin: 0px;

}



.section-content-4 .strok--heading {

  position: absolute;

  top: -10px;

  left: -30px;

  color: transparent;

  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.1);

  font-family: Poppins;

  font-size: 60px;

  font-weight: 700;

  line-height: 28px;

  z-index: -1;

}



.section-content-4 .strok--heading::after {

  content: "";

  position: absolute;

  bottom: -9px;

  left: 0;

  width: 100%;

  height: 40px;

  background: linear-gradient(180deg,

      rgba(255, 128, 0, 0) -20%,

      hsl(var(--body-color)) 100%);

  opacity: 1;

}



.section-content-4 .title {

  text-align: center;

  line-height: 1.25;

  position: relative;

}



.section-content-4 .subtitle {

  font-size: 18px;

  font-weight: 400;

  line-height: 24px;

  text-align: center;

}



.section-content-5 {

  display: flex;

  justify-content: center;

  align-items: center;

}



.section-content-5 .title {

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

  text-align: center;

  font-size: 36px !important;

  font-weight: 700;

  line-height: 1.16;

  margin: 0px;

}



.section-content-6 .heading--wrap {

  position: relative;

}



.section-content-6 .heading--wrap::after {

  content: "";

  position: absolute;

  left: -16px;

  top: 2px;

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

  width: 4px;

  height: 13px;

}



.section-content-6 .heading--wrap::before {

  content: "";

  position: absolute;

  left: -10px;

  top: 2px;

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

  width: 4px;

  height: 13px;

}



.section-content-6 .heading--wrap .heading {

  text-transform: uppercase;

  letter-spacing: 3.96px;

  position: relative;

}



.section-content-6 .heading--wrap .heading::after {

  content: "";

  position: absolute;

  right: -16px;

  top: 2px;

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

  width: 4px;

  height: 13px;

}



.section-content-6 .heading--wrap .heading::before {

  content: "";

  position: absolute;

  right: -10px;

  top: 2px;

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

  width: 4px;

  height: 13px;

}



.section-content-6 .title {

  text-align: center;

  line-height: 54px;

}



.section-content-6 .subtitle {

  font-size: 18px;

  font-weight: 400;

  line-height: 24px;

  text-align: center;

}



.how-work--right .bg--thumb {

  width: 100%;

  height: 498px;

  background-color: hsl(var(--base) / 0.1);

}



.how-work--right .thumb--wrap {

  right: 0px;

  bottom: 0px;

}



.popup-video-wrap {

  position: absolute;

  top: 50%;

  left: 50%;

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

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

}



.popup-video-wrap .play-video {

  position: absolute;

  top: 50%;

  left: 50%;

  z-index: 9;

}



.popup-video-wrap .play-video:hover {

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

}



.popup-video-wrap .play-video i {

  font-size: 24px;

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

}



.waves {

  position: absolute;

  width: 96px;

  height: 96px;

  background: hsl(var(--base));

  border-radius: 50%;

  opacity: 0;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

  top: -37px;

  left: -41px;

  z-index: 1;

  -webkit-animation: waves 3s ease-in-out infinite;

  animation: waves 3s ease-in-out infinite;

}



.wave-1 {

  -webkit-animation-delay: 0s;

  animation-delay: 0s;

}



.wave-2 {

  -webkit-animation-delay: 1s;

  animation-delay: 1s;

}



.wave-3 {

  -webkit-animation-delay: 2s;

  animation-delay: 2s;

}



.login-section {

  z-index: 1;

  padding: 100px 0px;

  position: relative;

  min-height: 100vh;

}



.login-section .bg--thumb-one {

  top: 0;

  left: 0;

  opacity: 0.3;

}



.login-section .bg--thumb-two {

  bottom: 0;

  right: 0;

  opacity: 0.3;

}



.sign-up_box {

  padding: 20px 0px;

  border-radius: 4px;

}



.sign-up_box .title {

  margin-bottom: 40px;

}



.sign-up_box .input-group {

  display: flex;

  flex-direction: row;

  flex-wrap: nowrap;

}



.sign-up_box .input-group .input-group-text {

  border-radius: 4px;

  border: 1px solid hsl(var(--base) / 0.5);

  background: hsl(var(--base));

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

}



.sign-up_box .login-meta {

  display: flex;

  justify-content: space-between;

  font-size: 14px;

}



.sign-up_box .login-meta p {

  font-size: 14px;

}



.login-box {

  border-radius: 16px;

  padding: 72px 46px 40px 46px;

  transition: all 0.4s ease-in-out;

  position: relative;

  height: 100%;

  border: 1px solid transparent;

  background-color: hsl(var(--section-bg));

  z-index: 1;

  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;

  border: 1px solid hsl(var(--black) / 0.1);

  border-top: 0;



  .login-user--tab {

    top: 0;

    left: 0px;









    .user.btn--base {

      border-radius: 16px 0px 16px 0px !important;

      border-bottom: 1px solid #dfdfdf !important;

      border-right: 1px solid #dfdfdf !important;

      box-shadow: -4px -5px 7px -5px rgb(49 49 49 / 12%) inset;

      background: linear-gradient(to bottom,

          hsl(var(--base) / 0.1),

          hsl(var(--section-bg)));

      color: hsl(var(--base));



      &::before {

        content: none;

      }



    }



    .agency.btn--base {

      border-radius: 0px 16px 0px 16px !important;



      box-shadow: 4px -5px 6px -5px rgb(49 49 49 / 12%) inset;

      background: linear-gradient(to bottom,

          hsl(var(--base-two) / 0.1),

          hsl(var(--section-bg)));

      border-bottom: 1px solid #ececec !important;

      color: hsl(var(--base-two));

      border: 0 !important;

      border-bottom: 1px solid #dfdfdf !important;

      border-left: 1px solid #dfdfdf !important;



      &::before {

        content: none;

      }

    }



  }

}



a.btn.btn--base.btn--lg.pills.user.active {

  box-shadow: 0px -3px 1px -6px rgba(49, 49, 49, 0.322);

  border: 0 !important;

  background: linear-gradient(to bottom,

      hsl(var(--base) / 0.1),

      hsl(var(--section-bg)));



  color: hsl(var(--base));

  border-top: 1px solid #dfdfdf !important;





  &:hover {

    border: 1 transparent !important;

  }

}



a.btn.btn--base.btn--lg.pills.agency.active {







  background: linear-gradient(to bottom,

      hsl(var(--base-two) / 0.1),

      hsl(var(--section-bg)));



  color: hsl(var(--base-two));

  border-bottom: 0 !important;

  box-shadow: 0px -3px 1px -6px rgba(49, 49, 49, 0.322);

  border-top: 1px solid #dfdfdf !important;

  border-left: 0 !important;

  position: relative;

  overflow: visible !important;



  &:hover {

    border: 1 transparent !important;

  }

}



.login-box .home--btn {

  position: absolute;

  top: 10px;

  right: 10px;

  width: 60px;

  height: 60px;

  background-color: hsl(var(--white) / 0.1);

  border-radius: 50%;

  border: 1px solid hsl(var(--white) / 0.1);

  display: none;

  color: hsl(var(--base));

}



.login-box .icon-wrap {

  display: flex;

  justify-content: center;

  align-items: center;

  margin-bottom: 24px;

}



.login-box .icon-wrap .icon {

  width: 84px;

  height: 84px;

  border-radius: 50%;

  background-color: hsl(var(--base));

  display: flex;

  justify-content: center;

  align-items: center;

}



.login-box .icon-wrap .icon i {

  font-size: 50px;

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

}



.login-box .logo--wrap {

  margin-bottom: 24px;

}



.login-box .title {

  font-size: 30px;

  font-weight: 700;

  line-height: 1.3;

  text-align: center;

}



.login-box .condition-text {

  margin-left: 8px;

}



.login-box .condition-text a {

  color: hsl(var(--base));

}



.login-box .condition-text p {

  font-size: 16px;

}



.login-box .condition-text p a {

  color: hsl(var(--base)) !important;

}



.login-box .req--box {

  height: 123px;

}



.login-box .form--wrap {

  padding: 0px 14px 50px 14px;

}



.login-box--wrap {

  position: absolute;

  top: 164px;

  width: 100%;

  height: 73vh;

  overflow: hidden;

}



.login-box--wrap .close--btn {

  width: 60px;

  height: 60px;

  border-radius: 50%;

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

  font-size: 18px;

  background: hsl(var(--black) / 0.09);

  position: absolute;

  left: 50%;

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

  display: block;

}



.login-box--wrap .close--btn .wrap {

  width: 100%;

  height: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

}



.login-thumb--wrap {

  position: relative;

}



.login-thumb--wrap::after {

  content: "";

  position: absolute;

  top: 0px;

  left: 0px;

  background-color: hsl(var(--base) / 0.5);

  z-index: 1;

  width: 100%;

  height: 100%;

}



.login-thumb--wrap img {

  width: 100%;

}



.login-container {

  padding: 0px !important;

  margin: 0px !important;

}



.login-left-section {

  height: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  background: hsl(var(--base));

}



.login-left-section::after {

  content: "";

  position: absolute;

  top: 0px;

  left: 0px;

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.72);

}



.login-left-section .content-wrap {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  text-align: center;

  position: absolute;

  top: 50%;

  left: 50%;

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

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

  z-index: 9;

  width: 80%;

}



.login-left-section .content-wrap .title {

  line-height: 70px;

}



.login-left-section .marque1 {

  rotate: 30deg;

  position: relative;

  top: -132px;

}



.login-left-section .marque2 {

  rotate: 30deg;

  position: relative;

  top: -46px;

}



.login-left-section .marque3 {

  rotate: 30deg;

  position: relative;

  top: 44px;

}



.login-left-section .marque4 {

  rotate: 30deg;

  position: relative;

  top: 130px;

}



.login-img--card {

  width: 100%;

  height: 341.348px;

}



@media (max-width: 769px) {

  .signup-section .signup-thumb {

    display: none !important;

  }

}



.product-details .user--info .thumb--wrap {

  width: 63px;

  height: 63px;

}



.product-details .user--info .content--wrap .following {

  background-color: hsl(var(--base));

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

  padding: 4px 6px;

  border-radius: 8px;

  font-size: 14px;

}



.product-details .main--thumb {

  width: 100%;

  height: 652px;

}



.product-details .rel--thumb {

  width: 100%;

  height: 212px;

}



.product-details .related-product-thumb--wrap {

  width: 105.267px;

  height: 105.267px;

}



.product-details .item--wrap .product--menu li a.active {

  color: hsl(var(--base));

  position: relative;

}



.product-details .item--wrap .product--menu li a.active::after {

  content: "";

  position: absolute;

  left: 0px;

  bottom: -19px;

  width: 78px;

  height: 2px;

  background-color: hsl(var(--base));

}



.product-details .details--right {

  position: sticky;

  top: 120px;

}



.product-details .details-wrap {

  border: 1px solid hsl(var(--white) / 0.05);

}



.product-details .details-wrap .auth-profile--wrap .thumb--wrap {

  width: 46px;

  height: 46px;

  border-radius: 50%;

  overflow: hidden;

}



.product-details .timer--wrap {

  padding: 32px 54px;

  border: 1px solid hsl(var(--white) / 0.05);

}



.product-details .timer--wrap .digit {

  background-color: hsl(var(--body-color));

  padding: 18px 12px 12px 12px;

  border-radius: 5px;

  border: 1px solid hsl(var(--white) / 0.06);

  text-align: center;

}



.product-details .timer--wrap .number {

  line-height: 50px;

}



.product-details .ticket--wrap {

  padding: 24px;

  border: 1px solid hsl(var(--white) / 0.05);

}



.product-details .ticket--wrap .ticket--info {

  border-bottom: 1px solid hsl(var(--white) / 0.1);

  padding-bottom: 30px;

  margin-bottom: 32px;

}



.product-details .ticket--description {

  padding: 24px;

  border: 1px solid hsl(var(--white) / 0.05);

}



.product-details .wining--list li {

  padding: 12px;

}



.product-details .wining--list li:nth-child(odd) {

  background-color: hsl(var(--white) / 0.1);

}



.btm--bar {

  display: block;

  width: 100%;

  height: 2px;

  background-color: hsl(var(--white) / 0.1);

  position: relative;

}



.btm--bar::after {

  content: "";

  position: absolute;

  top: 0px;

  left: 0px;

  width: 78px;

  height: 2px;

  background-color: hsl(var(--base));

}



.star--wrap li i {

  color: hsl(var(--star-color));

  font-size: 12px;

}



.product--info__wrap {

  top: 100px;

}



.product--info__wrap .product--info__item {

  padding-bottom: 30px;

  margin-bottom: 30px;

  border-bottom: 1px solid hsl(var(--black) / 0.1);

}



.product--info__wrap .product--info__item:last-child {

  margin: 0;

  padding: 0;

  border: 0;

}



.product--info__wrap .product--info__item .creator--info .thumb--wrap {

  width: 44px;

  height: 44px;

}



.details__key-item {

  border: 1px solid hsl(var(--black) / 0.1);

  padding: 16px;

  border-radius: 12px;

}



.details__key-item .icon--wrap {

  width: 32px;

  height: 32px;

  border-radius: 6px;

  background-color: hsl(var(--base) / 0.1);

}



.details__key-item .content--wrap {

  margin-left: 43px;

}



.details__key-item i {

  color: hsl(var(--base));

}



.why-choose {

  background-color: hsl(var(--black) / 0.02);

  overflow: hidden;

}



.why-choose .bg--element {

  top: 20%;

  left: -300px;

  height: 500px;

}



.why-choose .bg--element img {

  height: 100%;

  opacity: 0.5;

}



.why-choose .element {

  right: 0px;

  top: 0;

  opacity: 0.3;

}



.why-choose .element--two {

  right: 0;

  bottom: 0;

  animation: shake1 3s linear infinite alternate;

}



.why-choose .element--three {

  left: 48%;

  bottom: 0;

  opacity: 0.5;

}



.why-choose .element--four {

  top: 0;

  left: 0;

}



.why-choose .right--thumb__wrap .thumb-3 {

  top: 50px;

  left: 50px;

}



.why-choose .right--thumb__wrap .thumb-1 {

  width: 450px;

  height: 500px;

}



.why-choose .right--thumb__wrap .thumb-2 {

  width: 270px;

  height: 300px;

  top: 30%;

  left: 0;

}



.why-choose .service-key--box .icon--wrap {

  width: 20px;

  height: 20px;

}



.about--us {

  background-color: hsl(var(--black) / 0.02);

  overflow: hidden;

}



.about--us .airplane--two .thumb--wrap {

  position: absolute;

  bottom: 0px;

  animation: ballon-fly-two 15s linear infinite;

  opacity: 0.5;

}



@keyframes ballon-fly-two {

  0% {

    right: 0;

    bottom: 0px;

    rotate: 10deg;

  }



  25% {

    rotate: -10deg;

  }



  50% {

    rotate: 10deg;

  }



  75% {

    rotate: -10deg;

  }



  80% {

    right: 15%;

    rotate: 10deg;

  }



  100% {

    bottom: 110%;

    right: 20%;

    rotate: 0deg;

  }

}



.about--us .bg--element {

  top: 20%;

  left: -300px;

  height: 500px;

}



.about--us .bg--element img {

  height: 100%;

  opacity: 0.5;

}



.about--us .element {

  right: 0px;

  top: 0;

  opacity: 0.3;

}



.about--us .element--two {

  right: 0;

  bottom: 0;

  animation: shake1 3s linear infinite alternate;

}



.about--us .element--three {

  left: 48%;

  bottom: 0;

  opacity: 0.5;

}



.about--us .element--four {

  top: 0;

  left: 0;

}



.about--us .right--thumb__wrap .thumb-3 {

  bottom: 50px;

  right: -80px;

  width: 180px;

  height: 200px;

  border: 5px solid hsl(var(--white));

}



.about--us .right--thumb__wrap .thumb-1 {

  width: 500px;

  height: 550px;

}



.about--us .right--thumb__wrap .thumb-2 {

  width: 200px;

  height: 200px;

  border: 5px solid hsl(var(--white));

  top: 10%;

  left: 0;

}



.about--us .service-key--box .icon--wrap {

  width: 20px;

  height: 20px;

}



.how-work--box .icon-wrap {

  width: 100px;

  height: 100px;

  border-radius: 50%;

  border: 1px dashed hsl(var(--base));

  margin-bottom: 40px;

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

}



.how-work--box .icon-wrap img {

  width: 80px;

  height: 80px;

}



.how-work--box .icon-wrap i {

  font-size: 36px;

}



.how-work--box .icon-wrap .steps {

  background-color: hsl(var(--base));

  padding: 4px 12px;

  border-radius: 20px;

  bottom: -20px;

}



.how-it--work .air--line {

  top: -46px;

  left: 0;

  width: 100%;

}



.how-it--work .air--line img {

  opacity: 0.3;

}



.marque--section {

  position: relative;

  z-index: 1;

  background-color: hsl(var(--white) / 0.1);

}



.marque--section .marque---wrap {

  overflow: hidden;

  position: relative;

  background-color: hsl(var(--marque-bg));

  transform: rotate(-1deg);

  top: 0px;

}



.marque--section .marque---wrap .marque--slider {

  display: flex;

  position: relative;

  padding: 10px 0px;

}



.marque--section .marque---wrap .marque--slider .marquee--item {

  display: flex;

  align-items: center;

}



.marque--section .marque---wrap .marque--slider .marquee--item li {

  display: flex;

  align-items: center;

  gap: 12px;

  width: 336px;

  position: relative;

}



.marque--section .marque---wrap .marque--slider .marquee--item li img {

  max-width: 24px;

  max-height: 24px;

}



.marque--section .marque---wrap .marque--slider .marquee--item li::after {

  content: "";

  position: absolute;

  top: 4px;

  right: 26px;

  height: 20px;

  width: 1px;

  background-color: hsl(var(--white) / 0.3);

}



.marque--section .marque---wrap .marque--slider .marquee--item li .text {

  margin-bottom: 0px;

  font-size: 16px;

  font-weight: 400;

}



.left-marq {

  animation: moveLeft 50s linear infinite;

}



.right-marq {

  animation: moveRight 60s linear infinite;

}



@keyframes moveLeft {

  0% {

    transform: translateX(47%);

  }



  100% {

    transform: translateX(-50%);

  }

}



@keyframes moveRight {

  0% {

    transform: translateX(-550px);

  }



  100% {

    transform: translateX(0%);

  }

}



@-webkit-keyframes slide-har {

  0% {

    -webkit-transform: translateX(0%);

    transform: translateX(0%);

  }



  100% {

    -webkit-transform: translateX(-100%);

    transform: translateX(-100%);

  }

}



@keyframes slide-har {

  0% {

    -webkit-transform: translateX(0%);

    transform: translateX(0%);

  }



  100% {

    -webkit-transform: translateX(-100%);

    transform: translateX(-100%);

  }

}



.about-us .thumb-wrap {

  width: 100%;

  height: 100%;

}



.about-us .thumb-wrap .year--ball {

  top: 70%;

  left: 0px;

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

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

  width: 181px;

  height: 181px;

  background-color: hsl(var(--base));

}



.about-us .thumb-wrap .thumb--one {

  width: 479px;

  height: 540px;

  position: relative;

  top: 0px;

  left: 0px;

}



.about-us .thumb-wrap .thumb--one .bar1 {

  position: absolute;

  top: 80%;

  left: -10%;

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

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

}



.about-us .thumb-wrap .thumb--one .bar1::before {

  content: "";

  position: absolute;

  bottom: 0;

  left: 0;

  width: 490px;

  height: 20px;

  background: linear-gradient(90deg,

      rgba(255, 128, 0, 0) 0%,

      hsl(var(--base-two)) 100%);

  animation: lineDownAnimate 2s linear infinite;

}



.about-us .thumb-wrap .thumb--one .bar2 {

  position: absolute;

  top: 0%;

  right: 35%;

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

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

  rotate: 90deg;

}



.about-us .thumb-wrap .thumb--one .bar2::before {

  content: "";

  position: absolute;

  bottom: 0;

  left: 0;

  width: 550px;

  height: 20px;

  background: linear-gradient(90deg,

      rgba(255, 128, 0, 0) 0%,

      hsl(var(--base)) 100%);

  animation: lineDownAnimate 2s linear infinite;

}



.about-us .thumb-wrap .thumb--two {

  top: 70%;

  right: 0px;

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

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

  width: 321px;

  height: 236px;

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

}



.about-us .thumb-wrap .thumb--two .video--wrap {

  width: 300px;

  height: 216px;

  border-radius: 24px;

  overflow: hidden;

}



.about-us .thumb-wrap .thumb--two .video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.about-us2 {

  padding-top: 100px;

}



.about-us2 .thumb-wrap {

  width: 100%;

  height: 100%;

}



.about-us2 .thumb-wrap .thumb-1 {

  position: absolute;

  width: 280px;

  height: 420px;

  top: 18%;

  left: 0px;

}



.about-us2 .thumb-wrap .thumb-2 {

  position: absolute;

  width: 276px;

  height: 340px;

  top: 0px;

  right: 43px;

}



.about-us2 .thumb-wrap .thumb-3 {

  position: absolute;

  width: 174px;

  height: 216px;

  bottom: 0px;

  left: 50%;

}



.browse--section {

  padding-bottom: 400px;

}



.browse--section .content--wrap {

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

  padding: 30px;

  position: absolute;

  width: 100%;

  left: 0px;

  bottom: -716px;

}



.browse--section .table--wrap {

  padding: 22px;

  border: 2px solid hsl(var(--base) / 0.1);

  background-color: hsl(var(--base) / 0.02);

}



.counter-section {

  margin: 15px 0;

}



.counter-section::after {

  content: "";

  position: absolute;

  top: -15px;

  left: 0;

  width: 100%;

  height: 20px;

  background-color: hsl(var(--section-bg));

  z-index: -2;

}



.counter-section::before {

  content: "";

  position: absolute;

  bottom: -15px;

  left: 0;

  width: 100%;

  height: 20px;

  background-color: hsl(var(--section-bg));

  z-index: -2;

}



.counter-section .bg--rotate {

  position: absolute;

  top: 0px;

  left: -2px;

  background-color: hsl(var(--base-two));

  z-index: -1;

  transform: rotate(0.864deg);

  width: 101%;

  height: 100%;

}



.counter-section .bg--element-one {

  bottom: 20%;

  left: 5%;

}



.counter-section .bg--element-two {

  top: 10%;

  right: 10%;

}



.counter-section .bg--element-three {

  bottom: 5%;

  right: 5%;

}



.faq-thumb--wrap .thumb--one {

  width: 535px;

  height: 535px;

}



.faq-thumb--wrap .tumb--two {

  top: 40%;

  left: -20%;

  width: 174px;

  height: 168px;

}



.faq-thumb--wrap .tumb--two img {

  width: 164px;

  height: 152px;

}



.faq-thumb--wrap .thumb--three {

  bottom: -15%;

  right: 30%;

  width: 155px;

  height: 151px;

}



.faq-thumb--wrap .thumb--three img {

  width: 139px;

  height: 135px;

}



.newslatter-section .element--thumb {

  right: 10%;

  bottom: -20%;

}



.stay-tune-box {

  position: relative;

  border: 1px solid transparent;

}



.stay-tune-box .tune-box-title {

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

}



.stay-tune-box .tune-box-subtitle {

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

}



.footer-subscribe-box form {

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  position: relative;

}



.footer-subscribe-box .footer-input {

  width: 376px;

  border: 1px solid hsl(var(--base));

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

  color: hsl(var(--black)) !important;

  padding: 17px;

  padding-right: 170px;

}



.footer-subscribe-box .footer-input::placeholder {

  color: hsl(var(--black) / 0.7) !important;

  font-size: 14px;

}



.footer-subscribe-box .search-btn {

  padding: 12px 20px;

  border-radius: 4px;

  position: absolute;

  top: 6px;

  right: 6px;

}



/*Blog Details */

.blog-details {

  overflow: hidden;

  margin-right: 50px;

}



@media screen and (max-width: 991px) {

  .blog-details {

    margin-right: 0px;

  }

}



.blog-details .blog-item--content {

  padding: 35px 0px;

  margin-top: 10px;

}



.blog-details .blog-item--content {

  background-color: transparent;

}



.blog-details .blog-item {

  box-shadow: none;

}



.blog-details .blog-item--thumb {

  height: 450px;

  max-height: 100%;

}



@media screen and (max-width: 991px) {

  .blog-details .blog-item--thumb {

    height: 350px;

  }

}



@media screen and (max-width: 770px) {

  .blog-details .blog-item--thumb {

    height: 300px;

  }

}



.blog-details .blog-item--thumb img {

  border-radius: 12px;

}



.blog-details .blog-item--content {

  padding-bottom: 0;

}



.blog-details .blog-item--content2 {

  bottom: 0px;

  left: 0px;

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

  padding: 38px;

}



.blog-details .blog-item--content2 .date--wrap {

  padding-bottom: 16px;

}



.blog-details .blog-item--content2 .date--wrap .icon {

  width: 48px;

  height: 48px;

  background-color: hsl(var(--base));

  border-radius: 50%;

}



.blog-details .blog-item--content2 .date--wrap .icon i {

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

}



.blog-details .blog-item--content2 .text-list {

  padding-top: 16px;

}



.blog-details--content {

  padding: 20px 0px;



  p {

    margin-bottom: 20px;

  }

  blockquote {

    background-color: hsl(var(--base) / 0.07);

    padding: 20px;

    border-radius: 6px;

    border-left: 3px solid hsl(var(--base));

    position: relative;

    margin: 20px 0px;



    &::after {

      content: "\f10e";

      font-family: FontAwesome;

      position: absolute;

      top: -35px;

      right: 9px;

      font-size: 48px;

      color: hsl(var(--base));

    }

  }



  ul {

    margin: 15px 20px;



    li {

      list-style: inside !important;

      color: hsl(var(--black) / 0.7);

    }

  }



}



.blog-details--content .blog-rel--thumb {

  width: 100%;

  height: 302px;

}



.blog-details--title {

  margin-bottom: 15px;

  line-height: 42px;

}



.blog-details--desc {

  margin-bottom: 15px;

}



.blog-details .blog-bottom-wrap {

  border-top: 0;

  padding: 20px 25px 0px;

}



.blog-details--share ul li {

  list-style: none !important;

}



.blog-details--share ul li a {

  width: 44px;

  height: 44px;

  border-radius: 50%;

  background: transparent;

  transition: 0.2s linear;

  border: 1px solid hsl(var(--black) / 0.2);

}



.blog-details--share ul li a i {

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

}



.blog-details--share ul li a:hover {

  background: hsl(var(--base));

}



.blog-details--share ul li a:hover i {

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

}



.blog-details--quote1 {

  background-color: hsl(var(--base) / 0.1);

  padding: 40px;

  border-radius: 4px;

  margin-bottom: 20px;

  font-size: 22px;

  font-weight: 500;

  margin-top: 30px;

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

}



.blog-details--quote2 {

  background-color: hsl(var(--base) / 0.1);

  padding: 40px;

  border-radius: 4px;

  margin-bottom: 20px;

  font-size: 22px;

  font-weight: 500;

  margin-top: 30px;

  color: hsl(var(--black) / 0.7);

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

  text-align: center;

  position: relative;

}



.blog-details--quote2::before {

  content: "\f10d";

  position: absolute;

  font-family: FontAwesome;

  font-weight: 900;

  font-size: 80px;

  bottom: -12px;

  left: 0px;

  z-index: -1;

  opacity: 0.4;

  transform: translateX(39%);

}



.blog-details--quote2::after {

  content: "\f10e";

  position: absolute;

  font-family: FontAwesome;

  font-weight: 900;

  font-size: 120px;

  top: -24px;

  right: 10%;

  z-index: -1;

  opacity: 0.1;

  transform: translateX(39%);

  color: hsl(var(--base-two));

}



.blog-sidebar-wrapper {

  position: sticky;

  top: 120px;

}



.social-list__item .social-list__link {

  border: 0px !important;

  color: hsl(var(--dark));

}



.social-list__item .social-list__link:hover {

  color: hsl(var(--base)) !important;

}



.blog-sidebar {

  margin-bottom: 30px;

}



.blog-sidebar:last-of-type {

  margin-bottom: 0;

}



@media screen and (max-width: 575px) {

  .blog-sidebar {

    padding: 20px 15px;

  }

}



.blog-sidebar--title {

  margin-bottom: 40px;

}



.blog-sidebar--title::after {

  content: "";

  position: absolute;

  top: 40px;

  left: 0;

  width: 100%;

  height: 2px;

  background: linear-gradient(90deg,

      hsl(var(--base)) 0.01%,

      hsl(var(--body-color)) 80.99%);

}



.blog-sidebar .categorie--list li a .title:hover {

  color: hsl(var(--base));

  text-decoration: underline;

}



.latest-blog {

  padding-bottom: 20px;

  margin-bottom: 20px;

  border-bottom: 1px solid hsl(var(--black) / 0.1);

}



.latest-blog:last-of-type {

  padding-bottom: 0px;

  margin-bottom: 0px;

  border-bottom: 0;

}



.latest-blog--thumb {

  width: 80px;

  max-height: 80px;

  display: flex;

  border-radius: 5px;

  overflow: hidden;

}



@media screen and (max-width: 424px) {

  .latest-blog--thumb {

    width: 60px;

  }

}



.latest-blog--thumb a {

  display: block;

  height: 100%;

  width: 100%;

}



.latest-blog--thumb img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  border-radius: 5px;

}



.latest-blog--content {

  width: calc(100% - 80px);

  padding-left: 15px;

}



@media screen and (max-width: 424px) {

  .latest-blog--content {

    width: calc(100% - 60px);

  }

}



.latest-blog--title {

  margin-bottom: 5px;

}



.latest-blog--title:hover {

  color: hsl(var(--base));

  text-decoration: underline;

}



.contact-card {

  border: 1px solid hsl(var(--black) / 0.05);

  padding: 35px;

  position: relative;

  overflow: hidden;

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

}



.contact-card::after {

  content: "";

  position: absolute;

  top: -70px;

  right: -70px;

  width: 190px;

  height: 190px;

  border-radius: 50%;

  background-color: hsl(var(--base) / 0.08);

}



.contact-card::before {

  content: "";

  position: absolute;

  top: 40px;

  right: 40px;

  width: 97px;

  height: 97px;

  border-radius: 50%;

  background-color: hsl(var(--base) / 0.08);

}



.map-section .map-box {

  height: 686px;

  overflow: hidden;

}



.map-section .map-box iframe {

  width: 100%;

  height: 100%;

}



.sign-up_box {

  padding: 20px 0px;

  border-radius: 4px;

}



.sign-up_box .title {

  margin-bottom: 40px;

}



.sign-up_box .input-group {

  display: flex;

  flex-direction: row;

  flex-wrap: nowrap;

}



.sign-up_box .input-group .input-group-text {

  border-radius: 4px;

  border: 1px solid hsl(var(--base) / 0.5);

  background: hsl(var(--base));

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

}



.sign-up_box .login-meta {

  display: flex;

  justify-content: space-between;

  font-size: 14px;

}



.sign-up_box .login-meta p {

  font-size: 14px;

}



.signin-box {

  padding: 40px;

  transition: all 0.4s ease-in-out;

  position: relative;

}



.signin-box .home--btn {

  position: absolute;

  top: 10px;

  right: 10px;

  width: 50px;

  height: 50px;

  background-color: hsl(var(--white) / 0.1);

  border-radius: 50%;

  border: 1px solid hsl(var(--white) / 0.1);

  display: none;

  color: hsl(var(--base));

}



.signin-box .icon-wrap {

  display: flex;

  justify-content: center;

  align-items: center;

  margin-bottom: 24px;

}



.signin-box .icon-wrap .icon {

  width: 74px;

  height: 74px;

  border-radius: 50%;

  background-color: hsl(var(--base));

  display: flex;

  justify-content: center;

  align-items: center;

}



.signin-box .icon-wrap .icon i {

  font-size: 50px;

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

}



.signin-box .title {

  font-size: 30px;

  font-weight: 700;

  line-height: 1.3;

  margin-bottom: 30px;

  text-align: center;

}



.signin-box .condition-text {

  margin-left: 8px;

}



.signin-box .condition-text a {

  color: hsl(var(--base));

}



.signin-box .condition-text p {

  font-size: 16px;

}



.signin-box .condition-text p a {

  color: hsl(var(--base)) !important;

}



.signin-box .social-option {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  padding-top: 24px;

}



.signin-box .social-option .text {

  display: inline-flex;

  align-items: center;

}



.signin-box .social-option .text h6 {

  margin: 0px 10px;

  font-size: 24px;

  font-weight: 700;

  line-height: 1.29;

}



.signin-box .social-option .text::before {

  content: "";

  width: 170px;

  height: 1px;

  border: 1px dashed hsl(var(--white) / 0.6);

}



.signin-box .social-option .text::after {

  content: "";

  width: 170px;

  height: 1px;

  border: 1px dashed hsl(var(--white) / 0.6);

}



.signin-box .social-option ul {

  display: flex;

  margin: 20px 0px;

  gap: 12px;

}



.signin-box .social-option ul li a {

  display: flex;

  justify-content: center;

  align-items: center;

}



.signin-box .social-option p {

  margin-top: 8px;

}



.signin-box .social-option p a {

  color: hsl(var(--base));

}



.signin-box .req--box {

  height: 123px;

}



.signin-box--wrap {

  position: absolute;

  top: 164px;

  width: 100%;

  height: 73vh;

  overflow: hidden;

}



.signin-box--wrap .close--btn {

  width: 60px;

  height: 60px;

  border-radius: 50%;

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

  font-size: 18px;

  background: hsl(var(--black) / 0.09);

  position: absolute;

  left: 50%;

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

  display: block;

}



.signin-box--wrap .close--btn .wrap {

  width: 100%;

  height: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

}



.signin-thumb--wrap {

  position: relative;

}



.signin-thumb--wrap::after {

  content: "";

  position: absolute;

  top: 0px;

  left: 0px;

  background-color: hsl(var(--base) / 0.5);

  z-index: 1;

  width: 100%;

  height: 100%;

}



.signin-thumb--wrap img {

  width: 100%;

}



.signin-section {

  position: relative;

  overflow: hidden;

}



.signin-container {

  padding: 0px !important;

  margin: 0px !important;

}



.signin-right-section {

  background-color: hsl(var(--base));

  height: 100vh;

  width: 100%;

}



.signin-left-section {

  height: 100vh;

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

}



.signin-left-section .login-left-section .content-wrap {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  text-align: center;

}



@media (max-width: 769px) {

  .signup-section .signup-thumb {

    display: none !important;

  }

}



.dashboard {

  background: hsl(var(--black) / 0.06);

  height: 100%;

  min-height: 100vh;

  padding: 12px;

}



.dashboard_profile_wrap .profile_photo:hover::before {

  visibility: visible;

  opacity: 0.7;

}



.dashboard_profile_wrap .profile_photo:hover .photo_upload i {

  visibility: visible;

  opacity: 1;

}



.dashboard_profile__details ul li a {

  display: block;

  font-size: 17px;

  transition: all 0.3s ease-in-out;

}



.dashboard_profile__details ul li a i {

  margin-right: 10px;

}



.dashboard_profile__details ul li a:hover {

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

}



.dashboard_profile__details ul li a.active {

  color: hsl(var(--base));

}



.dashboard-body {

  position: relative;

}



.dashboard-body__bar {

  display: none;

}



@media screen and (max-width: 1199px) {

  .dashboard-body__bar {

    display: block;

  }

}



.dashboard-body__bar-icon {

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

  font-size: 25px;

  margin-bottom: 10px;

  cursor: pointer;

  width: 50px;

  height: 40px;

  background-color: hsl(var(--base));

  text-align: center;

  padding: 2px 8px;

  border-radius: 3px;

}



.dashboard-header {

  padding: 20px;

  border-radius: 0px;

  background-color: hsl(var(--section-bg));

  border: 1px solid hsl(var(--black) / 0.15);

  margin-top: 10px;

}



.dashboard-header .user-thumb {

  width: 37px;

  height: 37px;

  border-radius: 50%;

  overflow: hidden;

}



.dashboard-header .user-thumb img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.dashboard-header .name {

  font-size: 14px;

}



.dashboard-header .user--name i {

  color: hsl(var(--base));

}



.dashboard-header .user--name i:hover {

  color: hsl(var(--base));

}



.dashboard-header .user-info--wrap .dropdown-menu {

  padding: 0;

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

  border: 1px solid hsl(var(--black) / 0.2);

  border-radius: 16px !important;

  overflow: hidden;

  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);

}



.dashboard-header .user-info--wrap .dropdown-menu .dropdown-item {

  padding: 8px 12px;

  border-bottom: 1px solid hsl(var(--black) / 0.15);

}



.dashboard-header .user-info--wrap .dropdown-menu .dropdown-item:hover {

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

  background-color: hsl(var(--base));

}



.dashboard-header .dropdown-toggle::after {

  display: none;

}



.navigator-text {

  position: relative;

  gap: 12px;

}



.navigator-text h6 {

  margin: 0px;

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

}



.navigator-text h6::after {

  position: absolute;

  content: "";

  left: 0;

  bottom: -8px;

  width: 60px;

  height: 2px;

  background: hsl(var(--base));

}



.dashboard-container-wrap {

  margin-left: 298px;

}



.about-us {

  position: relative;

  overflow: hidden;

}



.about-us .shape-bg1 {

  position: absolute;

  top: 0px;

  left: 0px;

  z-index: -1;

}



.about-us .shape-bg2 {

  width: 624px;

  height: 637px;

  position: absolute;

  bottom: 0%;

  right: -20%;

  z-index: -1;

}



.about-us .shape-bg2 img {

  max-width: 100%;

  max-height: 100%;

  object-fit: cover;

}



.about-us .thumb-wrap {

  position: relative;

}



.about-us .thumb-wrap .circle-btn--wrap {

  position: absolute;

  left: 0px;

  top: 3%;

}



.about-us .thumb-wrap .thumb img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.about-us .thumb-wrap .trust-card {

  position: absolute;

  bottom: 10%;

  right: 0px;

  padding: 16px 20px;

}



.about-us .thumb-wrap .trust-card .icon {

  width: 44px;

  height: 44px;

}



.about-us .thumb-wrap .trust-card .content .sub-title {

  font-size: 15px;

}



.circle--bg {

  width: 300px;

  height: 300px;

  border-radius: 50%;

  position: absolute;

  top: 50%;

  right: 0%;

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

  background-color: hsl(var(--base));

  filter: blur(130px);

  z-index: -1;

}



.cookie-section {

  overflow: hidden;

}



.cookie-section .coockie-wrap h6 {

  font-weight: 600;

}



.cookie-section .coockie-wrap p span {

  color: hsl(var(--base-two));

  font-weight: 600;

  padding-right: 6px;

}



.cookie-section .coockie-wrap .ul-wrap {

  display: flex;

  padding: 20px;

  gap: 40px;

}



.cookie-section .coockie-wrap .ul-wrap ul li {

  color: hsl(var(--base-two));

  list-style: disc;

  margin-bottom: 20px;

}



.cookie-box {

  padding: 32px;

  border-radius: 4px;

  border: 1px solid hsl(var(--base));

}



.cookie-box .title--wrap {

  position: relative;

  margin-bottom: 26px;

}



.cookie-box .title--wrap::after {

  content: "";

  top: 0px;

  left: -16px;

  position: absolute;

  width: 3px;

  height: 24px;

  background-color: hsl(var(--base));

}



.cookie-box .title--wrap .title {

  color: hsl(var(--base));

  font-size: 16px;

  font-weight: 900;

}



.cookie-box .item--wrap {

  display: flex;

  justify-content: flex-start;

  flex-direction: column;

  align-items: flex-start;

  gap: 20px;

  padding-left: 12px;

  position: relative;

}



.cookie-box .item--wrap::after {

  content: "";

  position: absolute;

  top: 0px;

  left: -16px;

  width: 2px;

  height: 100%;

  background: hsl(var(--white) / 0.1);

}



.cookie-box .item--wrap li {

  position: relative;

}



.cookie-box .item--wrap li::after {

  content: "";

  position: absolute;

  top: 9px;

  left: -14px;

  width: 7px;

  height: 7px;

  border-radius: 50%;

  background: hsl(var(--white) / 0.4);

}



.cookie-box .item--wrap .active::after {

  background: hsl(var(--base));

}



@media (max-width: 1630px) {

  .header-two--wrap .menu-list--wrapper .main-menu {

    gap: 8px;

  }

}



@media (max-width: 1500px) {

  .social-option .text::before {

    content: "";

    width: 120px !important;

  }



  .social-option .text::after {

    content: "";

    width: 120px !important;

  }

}



@media (max-width: 1699px) {

  .login-box {

    padding: 70px 20px;

  }



  .signin-box {

    padding: 40px 20px;

  }

}



@media (max-width: 1440px) {

  .about--us .bg--element img {

    display: none;

  }



  .why-choose .bg--element {

    display: none;

  }



  .why-choose .element--two {

    display: none;

  }



  .footer-area .airplane--two .thumb--wrap {

    width: 70px;

  }



  .footer-area .bg--element-two {

    width: 120px;

  }



  .footer-area .cloud--group__one {

    top: 2%;

    left: 7%;

  }



  .footer-area .bg--element {

    display: none;

  }



  .about--us .right--thumb__wrap .thumb-3 {

    right: 0px;

  }

}



@media (max-width: 1399px) {

  .why-choose .bg--element img {

    display: none;

  }



  .footer-area .bg--element img {

    display: none;

  }



  .footer-area .airplane--two .thumb--wrap {

    display: none;

  }



  .why-choose .element--three {

    display: none;

  }



  .footer-area .bg--element-two {

    display: none;

  }



  .footer-area .cloud--group__one {

    display: none;

  }



  .why-choose .element--two {

    display: none;

  }



  .collection--card .collection-item--wrap .item---thumb {

    width: 66px;

    height: 66px;

    border-radius: 6px;

  }



  .collection--card {

    width: 100%;

  }



  .collection--card .thumb--wrap .banner--thumb {

    height: 164px;

  }



  .collection--card .thumb--wrap .profile--thumb {

    top: 30%;

    left: 50%;

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

  }



  .collection--card .thumb--wrap {

    margin-bottom: 52px;

  }



  .collection--card .content--wrap .title {

    font-size: 16px !important;

  }



  .why-choose .thumb-wrap .thumb-2 {

    width: 450px;

  }



  .why-choose .thumb-wrap .thumb-1 {

    bottom: 0%;

    left: 13px;

  }



  .hero .hero--content .title {

    font-size: 46px !important;

  }



  .login-section .login--bg2 {

    left: 27%;

    width: 538px;

    height: 390px;

  }



  .testimonial-card .item--wrap {

    padding: 40px;

  }

}



@media (max-width: 1366px) {

  .offer--content {

    display: none !important;

  }



  .location__card {

    width: 171px;

    height: 395px;

  }

}



@media (max-width: 1299px) {

  .header-wrapper .search--bar__wrap .form--control {

    width: 265px;

  }



  .about-us .thumb-wrap .thumb--two {

    top: 88%;

    right: 0px;

    -ms-transform: translate(-3%, -50%);

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

  }



  .hero-thumb-wrap .thumb-3 {

    bottom: 80px;

    right: -6px;

  }



  .hero-thumb-wrap .thumb-2 {

    right: 18px;

  }



  .hero-thumb-wrap .thumb-1 {

    top: 54px;

    left: -50px;

  }



  .footer-area::after {

    left: 6%;

    width: 312px;

  }



  .footer-area .bg-thumb {

    top: 68px;

    left: 5%;

  }



  .hero-left-content .hero-subtitle {

    width: 90%;

  }



  .menu--right {

    display: none !important;

  }

}



@media (max-width: 1199px) {

  .location__card {

    width: 146px;

    height: 370px;

  }



  .location__card.active {

    width: 270px;

  }



  .location__card .location__card-content {

    padding: 16px;



    .title {

      font-size: 20px !important;

    }

  }



  .footer-area .bg--element-three img {

    display: none;

  }



  .hero .hero--element__wrap .tree--wrap__one {

    display: none;

  }



  .why-choose .right--thumb__wrap .thumb-1 {

    width: 314px;

    height: 500px;

  }



  .why-choose .right--thumb__wrap .thumb-2 {

    width: 230px;

    height: 251px;

    top: 40%;

    left: 0;

  }



  .why-choose .right--thumb__wrap .thumb-3 {

    top: 126px;

    left: 50px;

  }



  .hero {

    padding: 140px 0px 80px 0px;

  }



  .header-wrapper .search--bar__wrap {

    display: none;

  }



  .faq-thumb--wrap .thumb--one {

    width: 100%;

    height: 535px;

  }



  .faq-thumb--wrap .tumb--two {

    left: -19%;

  }



  .faq-thumb--wrap .thumb--three {

    bottom: -15%;

    right: 10%;

  }



  .testimonial-card .item--wrap {

    padding: 34px 20px 0px 20px !important;

  }



  .testimonial-card .user--info {

    margin-bottom: 10px;

  }



  .testimonial-card .user--thumb {

    margin-bottom: 0px;

  }



  .plan--card .header--wrap {

    width: 160px;

    height: 160px;

  }



  .plan--card .header--wrap .title--wrap .fs--62 {

    font-size: 30px !important;

  }



  .plan--card .header--wrap .content--wrap .fs--18 {

    font-size: 14px !important;

  }



  .about-us .thumb-wrap .thumb--two {

    top: 88%;

    right: 0px;

    -ms-transform: translate(8%, -50%);

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

  }



  .about-us .thumb-wrap .year--ball {

    top: 8%;

    left: 45px;

  }



  .plan--card .info--wrap {

    gap: 12px !important;

  }



  .plan--card .info--wrap li {

    padding-bottom: 14px;

  }



  .plan--card .info--wrap li .fs--20 {

    font-size: 16px !important;

  }



  .whychoose--card {

    padding: 28px;

  }



  .product-details .timer--wrap .number {

    font-size: 38px !important;

    line-height: 40px;

  }



  .product-details .timer--wrap {

    padding: 20px;

  }



  .hero .hero--content .title .text::before {

    width: 220px;

  }



  .signin-box .home--btn {

    display: flex;

    justify-content: center;

    align-items: center;

  }



  .login-box .home--btn {

    display: flex;

    justify-content: center;

    align-items: center;

  }



  .why-choose .thumb-wrap .thumb-2 {

    width: 332px;

    height: 432px;

  }



  .why-choose .thumb-wrap .bg--elements {

    height: 332px;

  }



  .why-choose .thumb-wrap .bg--elements::after {

    left: 22px;

  }



  .header-wrapper .main-menu {

    gap: 0px;

  }



  .about-thumb-wrap {

    width: 100%;

    height: 300px;

  }



  .login-section .login--bg2 {

    left: 26%;

    width: 450px;

    height: 329px;

  }



  .footer-area::after {

    display: none;

  }



  .footer-area .bg-thumb {

    display: none;

  }



  .dashboard-container-wrap {

    margin-left: 0px;

  }



  .header-wrapper .search-box-wrap {

    width: 500px;

  }

}



@media (max-width: 1025px) {

  .btn--base-circle::after {

    top: 6px;

  }

}



@media (max-width: 1024px) {

  .location__card {

    width: 48%;

    height: 346px;

  }



  .location__card.active {

    width: 48%;

  }



  .breadcrumb {

    padding: 110px 0px 60px 0px;

  }



  .login-box .form--wrap {

    padding: 0px 14px 14px 14px;

  }



  .about-us .thumb-wrap .thumb-1 {

    width: 100%;

  }



  .about-us .thumb-wrap .bar1::before {

    width: 380px;

  }



  .product-details .timer--wrap .number {

    font-size: 36px !important;

  }



  .winner--card .number--wrap {

    width: 65px;

    height: 65px;

  }



  .winner--card .number--wrap .number {

    font-size: 24px !important;

  }



  .statistics--card {

    margin-top: 26px;

  }



  .hero .content--wrap .content {

    padding: 60px 60px;

  }



  .login-left-section .content-wrap .title {

    line-height: 52px;

    font-size: 38px !important;

  }



  .header-two--wrap .menu-list--wrapper .main-menu {

    gap: 5px;

  }



  .owner--profile {

    padding: 15px;

  }



  .menu-btm .sub-menu {

    display: inline-flex;

    gap: 50px;

    padding: 0px 20px 0px 20px;

  }



  .product-card .thumb--wrap {

    width: 100%;

    height: 190px;

  }



  .btn-circle {

    width: 100px;

    height: 100px;

  }



  .btn-circle::after {

    width: 70px;

    height: 70px;

  }



  .container--wrap {

    padding: 0px;

  }



  .breadcrumb--title {

    font-size: 28px;

  }

}



@media (max-width: 1023px) {

  .custom--accordion:last-of-type .accordion-button.collapsed {

    flex-direction: column;

    align-items: flex-start;

  }



  .custom--accordion .accordion-button[aria-expanded="false"]::after {

    content: none;

  }



  .custom--accordion .accordion-button[aria-expanded="true"]::after,

  .custom--accordion .accordion-button[aria-expanded="false"]::after {

    content: none;

  }



  .custom--accordion .accordion-button:not(.collapsed) {

    flex-direction: column;

    align-items: flex-start;

  }

}



@media (max-width: 998px) {

  .header-two--wrap {

    display: none;

  }

}



@media (max-width: 992px) {

  .breadcrumb .content--wrap .content {

    padding: 80px 60px 30px 60px;

  }



  .hero .thumb--wrap .thumb-2 {

    display: none;

  }



  .header-wrapper .search-box-wrap {

    display: none;

  }



  .header-wrapper-2 {

    display: none;

  }



  .browse--section .content--wrap {

    top: 0px;

    bottom: 0px;

    position: relative;

  }



  .browse--section {

    padding-bottom: 80px;

  }



  .counter-section {

    padding: 80px 0px;

  }

}



@media (max-width: 991px) {

  .filter--box {

    display: none;

  }



  .product--img__preview .product--thumb.thumb--small {

    height: 213px;

  }



  .product--img__preview .product--thumb {

    position: relative;

    overflow: hidden;

    height: 435px;

  }



  .feature--section .bg--element-two {

    display: none;

  }



  .how-it--work .air--line img {

    display: none;

  }



  .why-choose .right--thumb__wrap .thumb-1 {

    width: 83%;

    height: 500px;

  }



  .hero .hero--element__wrap .map--wrap {

    top: 22%;

  }



  .feature--card .thumb--wrap {

    top: 70px;

  }



  .hero .banner--filter__wrap .banner--filter__inputs {

    grid-template-columns: repeat(2, 1fr);

  }



  .hero .banner--filter__wrap {

    flex-direction: column;

  }



  .banner--filter__btn .btn {

    width: 100%;

  }



  .hero .banner--filter__wrap {

    border-radius: 30px;

  }



  .feature--card {

    height: 272px;

  }



  .hero .ws-icon---container {

    left: -2%;

    bottom: 25%;

  }



  .about-us .thumb-wrap .bar1::before {

    width: 530px;

  }



  .contact-right-side .client--support {

    position: relative;

  }



  .contact-right-side {

    padding: 20px !important;

  }



  .hero .hero-thumb--wrap .thumb1 {

    right: 25%;

  }



  .hero .hero-thumb--wrap .thumb2 {

    right: 38%;

  }



  .hero .hero-thumb--wrap .thumb3 {

    right: 30%;

  }



  .hero .hero-thumb--wrap .thumb4 {

    right: 5%;

  }



  .testimonial-section .slider--wrap {

    position: relative !important;

  }



  .news-section {

    padding-top: 80px;

  }



  .hero .hero-thumb--wrap {

    position: relative !important;

    bottom: -18%;

  }



  .hero .hero--content {

    width: 80%;

  }



  .custom--tabs.buy-sell {

    position: relative !important;

    top: -10px;

  }



  .converter-section .table--wrap {

    padding: 0px;

  }



  .browse--section .table--wrap {

    padding: 0px;

  }



  .browse--section .content--wrap {

    padding: 0px;

  }



  .about-us {

    padding-top: 80px;

  }



  .hero .currency-calculator--box {

    position: relative;

    bottom: -67px;

  }



  .about-thumb-wrap {

    width: 100%;

    height: 656px;

  }



  .about-content-box1 {

    justify-content: flex-start;

    align-items: flex-start;

  }



  .about-content-box1 .title {

    text-align: left !important;

  }



  .about-content-box1 .sub-title {

    text-align: left !important;

  }



  .filter-btn--wrap {

    display: block;

  }



  .product-details .main--thumb {

    width: 100%;

    height: 400px;

  }



  .login-section .login--bg2 {

    display: none;

  }



  .header-two .header-bg--img {

    display: none;

  }



  .header-two .header::after {

    display: none;

  }



  .login-logo--dark {

    display: block !important;

  }



  .login-logo--light {

    display: none;

  }



  .flex-md-col--revers {

    flex-direction: column-reverse;

  }



  .section-content-4 .heading {

    margin-bottom: 20px;

  }



  .hero-thumb-wrap .thumb-3 {

    display: none;

  }



  .hero-thumb-wrap .thumb-1 {

    display: none;

  }



  .hero::after {

    display: none;

  }



  .hero-thumb-wrap .user--wrap {

    display: none;

  }



  .category-section {

    top: 0px;

  }



  .testimonial-section .bg--thumb1 {

    display: none;

  }



  .testimonial-section .bg--thumb3 {

    display: none;

  }



  .faq-right {

    display: none;

  }



  .faq-thumb--wrap {

    top: 0px;

    justify-content: center;

  }



  .benefit-content--box1 {

    justify-content: flex-start;

    align-items: flex-start;

  }



  .benefit-content--box1 .title {

    text-align: left !important;

  }



  .benefit-content--box1 .sub-title {

    text-align: left !important;

  }



  .hero {

    padding-top: 120px;

  }



  .section-content .title-wrap .title {

    font-size: 38px !important;

  }



  .section-content .title-wrap .title-2 {

    font-size: 26px !important;

  }



  .section-content-2 .title-wrap .title {

    font-size: 38px !important;

  }



  .section-content-3 .title {

    font-size: 26px !important;

  }



  .section-content-4 {

    margin-bottom: 40px;

  }



  .section-content-4 .title {

    font-size: 38px !important;

  }



  .section-content-5 .title {

    font-size: 26px !important;

  }



  .header-two .header.fixed-header .login--btn {

    border: 1px solid hsl(var(--base));

    color: hsl(var(--base));

  }



  .testimonial-card .title {

    line-height: 25px;

    font-style: italic;

    margin-bottom: 14px;

    color: hsl(var(--black) / 0.6);

    font-size: 14px !important;

  }



  .testimonial-card .thumb--wrap {

    width: 250px;

    height: 356px;

  }



  .testimonial-card .item--wrap {

    padding: 35px;

  }

}



@media (max-width: 768px) {

  .why-choose .right--thumb__wrap .thumb-1 {

    width: 76%;

  }



  .offer-card.card--two .offer-card__content {

    top: 67px !important;

  }



  .login-section .bg--thumb-two {

    display: none;

  }



  .section-content .title-wrap .title {

    font-size: 32px !important;

  }



  .offer-card.card--one {

    .offer-card__content {

      top: 55px;

    }

  }



  .loin-btn--wrap {

    display: none;

  }



  .location--section .bg--element {

    display: none;

  }



  .header-menu-wrapper.align-items-center.d-flex.gap--32 {

    margin-left: auto;

    margin-right: auto;

  }



  .header-wrapper .logo-wrapper img {

    width: 140px;

  }



  .blog-details--title {

    line-height: 32px;

  }



  .about-us .thumb-wrap .year--ball {

    display: none !important;

  }



  .about-us .thumb-wrap .bar1::before {

    width: 434px;

  }



  .paper-plane {

    display: none;

  }



  .breadcrumb .content--wrap .content {

    padding: 30px;

  }



  .how-work--right .bg--thumb {

    height: 100%;

  }



  .counter--wrap {

    display: none;

  }



  .hero {

    padding-top: 120px;

  }



  .dashboard-header ul .search {

    display: none;

  }



  .dashboard-header ul .settings {

    display: none;

  }



  .ham__menu {

    display: block !important;

  }



  .language-dropdown {

    width: 90px;

    position: fixed;

    top: 44px;

    right: 74px !important;

  }



  .faq-thumb--wrap::after {

    left: 24%;

    width: 190px;

    height: 190px;

  }



  .hero .hero--content .heading {

    margin-bottom: 12px;

  }



  .hero .hero--content .title {

    font-size: 40px !important;

  }



  .testimonial-card .title {

    line-height: 30px;

  }



  .login-box {

    padding: 60px 14px;

  }



  .testimonial-card .item--wrap .icon-thumb {

    margin-bottom: 12px;

  }



  .testimonial-card .item--wrap .icon-thumb img {

    width: 44px;

  }



  .testimonial-card .item--wrap .content-wrap .name {

    font-size: 16px !important;

  }



  .testimonial-card .item--wrap .content-wrap .city {

    font-size: 14px !important;

  }

}



@media (max-width: 767px) {

  .hero .gallery--grid__thumb.full {

    height: 192px;

  }



  .newslatter-section .content--wrap .title {

    font-size: 30px !important;

    width: 100% !important;

  }



  .clone--wrap {

    display: none;

  }



  .hero .hero--content {

    width: 100%;

  }



  .lottery--card .bg--thumb img {

    width: 100%;

    height: 100%;

  }



  .item--wrap .product--menu {

    gap: 8px !important;

  }



  .hero .content--wrap .content {

    padding: 60px 24px;

  }



  .product-details .item--wrap .product--menu li a.active::after {

    content: "";

    position: absolute;

    left: 0px;

    bottom: -55px;

    width: 78px;

    height: 2px;

    background-color: hsl(var(--base));

  }



  .testimonial-card .thumb--wrap {

    display: none;

  }



  .testimonial-card .item--wrap {

    margin-bottom: 20px;

  }

}



@media (max-width: 740px) {

  .offer--coutdown .timer {

    display: none !important;

  }

}



@media (max-width: 700px) {

  .testimonial-section .bg--thumb7 {

    display: none;

  }



  .testimonial-section .bg--thumb2 {

    display: none;

  }



  .hero-left-content .hero-grp-btn {

    margin-bottom: 20px;

  }

}



@media (max-width: 630px) {

  .hero .hero--content .heading {

    letter-spacing: 2px;

  }



  .hero .hero-thumb--wrap {

    display: none !important;

  }



  .hero .item--card2 {

    top: 28%;

    right: 14%;

  }

}



@media (max-width: 530px) {

  .login-lng .loin-btn--wrap {

    display: none !important;

  }



  .error--page .error-wrap .title {

    font-size: 40px !important;

  }



  .hero .hero--content .title {

    font-size: 40px !important;

    text-transform: capitalize;

  }



  .dashboard-header {

    padding: 12px;

  }



  .dashboard-header ul {

    gap: 8px;

    margin-left: 8px;

  }



  .dashboard-header ul .language {

    display: none;

  }



  .dashboard-header ul .home-btn-1 {

    display: none;

  }



  .dashboard-header ul .home-btn-2 {

    display: block !important;

    margin: 0px 16px 0px 16px;

  }



  .dashboard-header ul .home-btn-2 i {

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

    font-size: 22px;

  }



  .dashboard-header .home-mobile {

    display: block;

  }



  .dashboard-header .home-2 {

    display: none;

  }

}



@media (max-width: 575px) {

  .why-choose .element {

    display: none;

  }



  .offer--section .bg--element-two {

    display: none;

  }



  .slick-next {

    right: -8px !important;

  }



  .slick-prev {

    left: -8px !important;

  }



  .breadcrumb .bg--thumb-one {

    width: 100px;

  }



  .breadcrumb .bg--thumb-two {

    width: 120px;

  }



  .product--img__preview .product--thumb {

    height: 370px;

  }



  .product--img__preview .item-gallery__image-wrapper .thumb {

    width: 70px;

    height: 70px;

  }



  .faq-thumb--wrap .tumb--two {

    display: none !important;

  }



  .about-us .thumb-wrap .thumb--two {

    width: 221px;

    height: 136px;

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

  }



  .about-us .thumb-wrap .thumb--one {

    width: 100%;

    height: 338px;

  }



  .faq-thumb--wrap .thumb--one {

    width: 100%;

    height: 406px;

  }



  .about-us .thumb-wrap .thumb--two .video--wrap {

    width: 203px;

    height: 127px;

  }



  .btn--base-circle::after {

    top: 0px;

  }



  .descover--section .discover--box {

    padding: 20px;

  }



  .marketing--section .marketing--box {

    padding: 20px;

  }



  .descover--section .discover--box .content--wrap .title {

    font-size: 30px !important;

  }



  .marketing--section .marketing--box .content--wrap .title {

    font-size: 30px !important;

  }

}



@media (max-width: 525px) {

  .location__card {

    width: 100%;

  }



  .location__card.active {

    width: 100%;

  }

}



@media (max-width: 480px) {

  .slick-next {

    right: 0px !important;

  }



  .slick-prev {

    left: 0px !important;

  }



  li.login-registration-list__item {

    display: none;

  }



  .menu--wrap {

    gap: 0px !important;

  }



  .menu-wrapper {

    display: none;

  }



  .about-us .thumb-wrap .bar1::before {

    width: 280px;

  }



  .about-us .thumb-wrap .bar2 {

    right: 50%;

  }



  .offer-card__content .title {

    font-size: 35px !important;

  }



  .offer-card__content {

    padding: 24px;

    top: auto !important;

    bottom: 20px !important;

  }



  .offer-card {

    height: 302px;

  }

}



@media (max-width: 425px) {

  .location__card.active {

    .custom-location {

      width: 180px;

    }

  }



  .base--card {

    padding: 12px;

  }



  .contact-card {

    padding: 20px;

  }



  .blog-card .thumb {

    height: 194px;

  }



  .offer-card.card--two .offer-card__content {

    top: 30px !important;

  }



  .hero .hero--element__wrap .airplane--two .thumb--wrap {

    display: none;

  }



  .why-choose .right--thumb__wrap .thumb-1 {

    height: 363px;

  }



  .why-choose .right--thumb__wrap .thumb-3 {

    top: 70px;

  }



  .header-wrapper .logo-wrapper img {

    width: 95px;

  }



  .hero .banner--filter__wrap .banner--filter__inputs {

    grid-template-columns: 1fr;

  }



  .hero .hero--content .banner--element {

    display: none;

  }



  .hero .thumb--wrap .thumb--one {

    width: 100%;

    height: 340px;

  }



  .hero .hero--content .title .text::before {

    width: 145px;

    height: 3px;

  }



  .contact-right-side .client--support .icon--wrap {

    width: 40px;

    height: 40px;

  }



  .product-details .timer--wrap {

    gap: 30px !important;

  }



  .product-details .timer--wrap .day--wrap {

    gap: 16px !important;

  }



  .footer-subscribe-box .search-btn {

    padding: 8px;

  }



  .footer-subscribe-box .footer-input {

    width: 100%;

    padding: 14px 12px;

    padding-right: 138px;

  }



  .hero .hero--content .heading {

    font-size: 16px !important;

  }



  .hero .hero--content .title {

    font-size: 28px !important;

    margin-bottom: 20px;

  }



  .hero .hero--content .subtitle {

    margin-bottom: 24px;

  }



  .hot--sell {

    font-size: 14px !important;

  }



  .w-sm--100 {

    width: 100%;

  }



  .section-content .title-wrap .title {

    font-size: 28px !important;

  }



  .section-content .title-wrap .title-2 {

    font-size: 26px !important;

  }



  .section-content-2 .title-wrap .title {

    font-size: 28px !important;

  }



  .section-content-3 .title {

    font-size: 26px !important;

  }



  .section-content-4 {

    margin-bottom: 40px;

  }



  .section-content-4 .title {

    font-size: 28px !important;

    line-height: 40px;

    margin-bottom: 12px;

  }



  .section-content {

    margin-bottom: 40px;

  }



  .section-content .title {

    font-size: 28px !important;

    line-height: 40px;

    margin-bottom: 12px;

  }



  .section-content-6 .title {

    font-size: 28px !important;

    line-height: 40px;

    margin-bottom: 12px;

  }



  .section-content-5 .title {

    font-size: 28px !important;

  }



  .product-details .main--thumb {

    width: 100%;

    height: 215px;

  }



  .hero-left-content .hero-grp-btn {

    margin-bottom: 0px;

  }



  .key-card .title {

    margin-bottom: 12px;

  }



  .hero-left-content .hero-title {

    font-size: 34px;

    line-height: 50px;

  }



  .hero {

    padding-top: 120px;

    padding-bottom: 60px;

  }



  .section-content-4 {

    margin-top: 0px;

  }



  .signin-box {

    width: 100%;

  }



  .login-box .title {

    font-size: 25px;

  }



  .social-option .text h6 {

    margin: 0px 7px !important;

  }



  .social-option .text::before {

    width: 100px !important;

  }



  .social-option .text::after {

    width: 100px !important;

  }



  .section-content-4 .heading {

    text-align: center;

  }

}



@media (max-width: 426px) {

  .transaction-card {

    padding: 20px 8px;

  }



  .footer-subscribe-box .footer-input {

    border: 1px solid hsl(var(--base));

  }



  .footer-subscribe-box .footer-input::placeholder {

    color: hsl(var(--white) / 0.7) !important;

    font-size: 14px;

  }



  .footer-item__title {

    padding-bottom: 0px;

    margin-bottom: 10px;

  }

}



@media (max-width: 376px) {

  .footer-subscribe-box .footer-input {

    width: 100%;

  }



  .product-details .timer--wrap {

    gap: 10px !important;

  }

}



@media (max-width: 375px) {

  .hero .hero-btn--wrap {

    gap: 12px !important;

  }

}



@media (max-width: 320px) {

  .offer-card.card--two .offer-card__content {

    top: 5px !important;

  }



  .contact-right-side .client--support .content--wrap .mobile {

    font-size: 20px !important;

  }



  .language-dropdown {

    right: 52px !important;

  }

}



.error--page {

  padding: 130px 0px;

  min-height: 100vh;

  position: relative;



  .bgg--element {

    right: 0;

    bottom: 0;

    img {

      opacity: 0.1;

    }

  }



  .bg--element-two {

    top: 0;

    left: 0;



    img {

      opacity: 0.1;

    }

  }

}



.error--page .error-wrap .error--text span {

  font-size: 80px;

  font-weight: 700;

  text-align: center;

}



.error--page .error-wrap .error--text {

  text-align: center;

}



.error--page .error-wrap .error--text span:nth-child(1) {

  color: hsl(var(--base));

}



.error--page .error-wrap .error--text span:nth-child(2) {

  color: hsl(var(--base));

}



.error--page .error-wrap .error--text span:nth-child(3) {

  color: hsl(var(--base));

}



.error--page .error-wrap .title {

  font-size: 80px;

  font-weight: 700;

}



.error--page .error-wrap .desc a {

  text-decoration: underline;

  color: hsl(var(--base));

}



/* *========= Cookies Css ========*/

.cookies-card {

  position: fixed;

  bottom: 16px;

  padding: 10px;

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

  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

  border: 2px solid hsl(var(--base));

  border-radius: 12px;

  z-index: 555;

}



.cookies-card__btn .btn.btn-base {

  width: 124px;

}



@media (max-width: 1400px) {

  .cookies-card {

    width: 95%;

  }

}



@media (max-width: 767px) {

  .cookies-card {

    flex-direction: column;

  }



  .cookies-card__btn {

    margin-top: 7px;

  }

}



.cookies-card.hide {

  bottom: -500px !important;

}



.radius--10px {

  border-radius: 10px;

}



/* end cookie */



.wyg h1,

.wyg h2,

.wyg h3,

.wyg h4 {

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

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

}



.wyg p {

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

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

  font-size: 17px;

}



.wyg p span {

  color: hsl(var(--black)) !important;

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

}



.wyg ul {

  margin: 14px 35px 20px;

}



.wyg ul li {

  list-style-type: disc;

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

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

  margin-bottom: 8px;

  font-size: 17px;

}



.wyg ul li strong {

  color: hsl(var(--black) / 0.9);

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

  font-size: 16px;

}



.wyg ol {

  margin: 35px;

}



.wyg ol li {

  list-style-type: decimal;

  color: hsl(var(--black) / 0.8);

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

}



.wyg ol li strong {

  color: hsl(var(--black) / 0.8);

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

}



.iconpicker-popover {

  opacity: 1 !important;

}



.profile-container {

  text-align: center;

}



.profile-label {

  display: inline-block;

  width: 100px;

  height: 100px;

  border-radius: 50%;

  overflow: hidden;

  border: 2px solid #ccc;

  cursor: pointer;

  position: relative;

}



.profile-label img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



.file-input {

  display: none;

}



.profile-label:hover {

  border-color: #007bff;

}



.rating--search label i {

  color: hsl(var(--star-color));

  font-size: 14px;

}



.star--color {

  color: hsl(var(--star-color));

}



.ticket--replay {

  background-color: hsl(var(--black) / 0.03);

  padding: 20px;

}



.details--page__datepicker {

  .datepicker {

    width: 100% !important;

    border-radius: 14px;



    .datepicker--nav {

      padding: 10px 14px;

    }



    .datepicker--cell {

      height: 44px;

      border-radius: 12px;

    }



    .datepicker--cell.-current- {

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

      background-color: hsl(var(--base));

    }

  }

}



.cookie-section {

  .bg--thumb.one {

    bottom: 0;

    right: 0;



    img {

      opacity: 0.1;

    }

  }

}



.custom-location {

  display: block;

  width: 120px;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}



/* Full text style */

.full-text {

  white-space: normal;

  overflow: visible;

  text-overflow: unset;

  transition: all 0.3s ease;

}



.action--btn {

  border-radius: 6px !important;

  padding: 4px 7px 3px !important;



  &::before {

    border-radius: 6px;

  }

}



.filter-btn--wrap {

  button {

    cursor: text;

  }

}



/* range */



.range-slider {

  position: relative;

  user-select: none;

  clear: both;



  .label {

    height: 50px;

    line-height: 50px;

    cursor: pointer;

    color: #111;

    font-size: 17px;



    span {

      float: left;

      display: inline-block;

    }

  }

}



.range-slider-box .sliderr {

  height: 6px;

  background-color: hsl(var(--base) / 0.2);

  position: relative;

}



.range-slider-box .sliderr .progresss {

  height: 100%;

  position: absolute;

  left: 5%;

  right: 0%;

  background-color: hsl(var(--base));

}



.range-slider-box .range-input {

  position: relative;

}



.range-slider-box .range-input input {

  position: absolute;

  top: -5px;

  height: 4px;

  width: 100%;

  background: none;

  -webkit-appearance: none;

  -moz-appearance: none;

  pointer-events: none;

  border-radius: 0px !important;

}

.range-input input::-webkit-slider-thumb {

  pointer-events: all;

  width: 20px;

  height: 20px;

  border-radius: 50%;

  background: hsl(var(--base));

  border: 1px solid hsl(var(--black) / 0.5);

  cursor: pointer;

  -webkit-appearance: none;

  -moz-appearance: auto;

  appearance: none;

}

.range-slider-box .range-input input[type=range]::-webkit-slider-thumb {

  -webkit-appearance: none;

  pointer-events: auto;

  z-index: 1;

}

.range-slider-box .range-input input[type=range]::-moz-range-thumb {

  -moz-appearance: none;

  pointer-events: auto;

  z-index: 1;

}

.bg--element,
.airplane--two,
.cloud--group__one,
.bg--element-two,
.bg--element-three,
.element,
.element--two,
.element--three {
  display: none;
}