/*-----------------------------------------------------------------------------------

    Template Name: Housey - Resort and Hotel Booking HTML Template
    更多下载：https://www.bootstrapmb.com 
    Description: Housey - Resort and Hotel Booking HTML Template
    Version: 1.0

-----------------------------------------------------------------------------------

/************ TABLE OF CONTENTS ***************

	-----------------
    01. THEME CSS
	-----------------
		1.1 Common Classes
		1.2 Default Spacing
		1.3 Theme Default

	-----------------
    02. COMPONENTS css
	-----------------
		2.1 animetion
		2.2 background
		2.3 backtotop
		2.4 breadcrumb
		2.5 buttons 
 		2.6 instagram
		2.7 nice-select
		2.8 offcanvas
		2.9 pagenation
		2.10 preloader
		2.11 section-title
		2.12 sidebar

	---------------------------------
	03. BLOG CSS
	---------------------------------
		3.1 Blog css
		3.2 Postbox css

	---------------------------------
	04. FOOTER CSS
	---------------------------------
		4.1 Footer Style 1

	-----------------
  05. HEADER CSS
	-----------------
		5.1 Header Style 1

  ---------------------------------
	06. MENU CSS
	---------------------------------
		6.1 menu css
		6.2 Mobile css
		6.3 offcanvas css


	---------------------------------
	07. PAGES CSS
	---------------------------------
		7.1 about css
		7.2 adventures css
		7.3 banefit css
		7.4 banner css
		7.5 booking css
		7.6 brands css
		7.7 connected css
		7.8 contact css
		7.9 counter css
		7.10 cta css
		7.11 destinations css
		7.12 faq css
		7.13 feature css
		7.14 flatpicker css
		7.15 gallery css
		7.16 hero css
		7.17 offer css
		7.18 place css
		7.19 pricing css
		7.20 review css
		7.21 room-details css
		7.22 room css
		7.23 service css
		7.24 suites css
		7.25 team css
		7.26 testimonial css
		7.27 video css
**********************************************/
/*----------------------------------------*/
/*  1.1 Theme Default
/*----------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Amita:wght@400;700&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Onest:wght@100..900&family=Outfit:wght@100..900&family=Parisienne&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap");
.tp-offcanvas-area, .tp-offcanvas-social ul li a {
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

.tp-cart-checkout-shipping-option label::after, .tp-cart-checkout-shipping-option label::before, .tp-cart-plus,
.tp-cart-minus, .tp-pulse-border::after, .tp-pulse-border::before {
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

a,
button,
p,
input,
select,
textarea,
li,
.transition-3 {
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

.tp-cart-list tr td .tp-cart-action-btn svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}

/* transform */
:root {
  /**
  @font family declaration
  */
  --tp-ff-dm: 'DM Sans', sans-serif;
  --tp-ff-playfair: 'Playfair Display', serif;
  --tp-ff-amita: 'Amita', serif;
  --tp-ff-outfit: 'Outfit', sans-serif;
  --tp-ff-onest: 'Onest', sans-serif;
  --tp-ff-parisienne: 'Parisienne', system-ui;
  --tp-ff-fontawesome: "Font Awesome 6 Pro";
  /**
  @color declaration
  */
  --tp-common-white: #ffffff;
  --tp-common-white2: #faf5ef;
  --tp-common-black: #141414;
  --tp-common-yellow: #ffeb38;
  --tp-common-yellow2: #ffd084;
  --tp-common-black2: #19163c;
  --tp-common-black3: #180d06;
  --tp-common-black4: #2d1a0e;
  --tp-common-falured: #a05916;
  --tp-grey-1: #5A5859;
  --tp-grey-2: #c7c7c7;
  --tp-grey-3: #9d9d9d;
  --tp-grey-4: #595654;
  --tp-grey-5: #635c57;
  --tp-theme-primary: #B7124D;
  --tp-theme-1: #761f0e;
  --tp-theme-2: #d59020;
}

@media (min-width: 1400px) {
  .container-1750 {
    max-width: 1750px;
  }

  .custom-column-1 {
    width: 63%;
  }

  .custom-column-2 {
    width: 37%;
  }

  .custom-column-3 {
    width: 40.4%;
  }

  .custom-column-4 {
    width: 59.6%;
  }
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-family: var(--tp-ff-dm);
  font-size: 16px;
  font-weight: normal;
  color: var(--tp-common-black);
  background: var(--tp-common-white);
  line-height: 1.5;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--tp-ff-dm);
  color: var(--tp-common-black);
  font-weight: 800;
  line-height: 1.12;
}

h1 {
  font-size: 80px;
}

/* h2 {
  font-size: 50px;
} */

h3 {
  font-size: 30px;
}

h4 {
  font-size: 24px;
}

/* h5 {
  font-size: 20px;
} */

h6 {
  font-size: 16px;
}

ul {
  margin: 0px;
  padding: 0px;
}

p {
  margin-bottom: 15px;
  font-weight: 400;
  line-height: 1.56;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a:focus {
  text-decoration: none;
  color: inherit;
}

a:hover {
  color: inherit;
  text-decoration: none;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
}

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

.round-6 {
  border-radius: 6px;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password],
input[type=url],
textarea {
  outline: none;
  background-color: #fff;
  height: 56px;
  width: 100%;
  line-height: 56px;
  font-size: 14px;
  color: var(--tp-heading-1);
  padding-left: 26px;
  padding-right: 26px;
  border: 1px solid #E0E2E3;
}
input[type=text]::-webkit-input-placeholder,
input[type=email]::-webkit-input-placeholder,
input[type=tel]::-webkit-input-placeholder,
input[type=number]::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder,
input[type=url]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #95999D;
}
input[type=text]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=number]::-moz-placeholder,
input[type=password]::-moz-placeholder,
input[type=url]::-moz-placeholder,
textarea::-moz-placeholder {
  /* Firefox 19+ */
  color: #95999D;
}
input[type=text]:-moz-placeholder,
input[type=email]:-moz-placeholder,
input[type=tel]:-moz-placeholder,
input[type=number]:-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=url]:-moz-placeholder,
textarea:-moz-placeholder {
  /* Firefox 4-18 */
  color: #95999D;
}
input[type=text]:-ms-input-placeholder,
input[type=email]:-ms-input-placeholder,
input[type=tel]:-ms-input-placeholder,
input[type=number]:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
input[type=url]:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  /* IE 10+  Edge*/
  color: #95999D;
}
input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
input[type=number]::placeholder,
input[type=password]::placeholder,
input[type=url]::placeholder,
textarea::placeholder {
  /* MODERN BROWSER */
  color: #95999D;
}

textarea {
  line-height: 1.4;
  padding-top: 18px;
  padding-bottom: 17px;
}

input[type=color] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background: none;
  border: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  padding: 0;
  border-radius: 50%;
}

*::-moz-selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

::-moz-selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

::selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--tp-grey-1);
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: var(--tp-grey-1);
  font-size: 14px;
  opacity: 1;
}

@media (min-width: 1400px) {
  .container-1700 {
    max-width: 1700px;
  }
}
@media (min-width: 1400px) {
  .container-1430 {
    max-width: 1430px;
  }
}
/*---------------------------------
  1.1 Common Classes
---------------------------------*/
.w-img {
  width: 100%;
}

.m-img img {
  max-width: 100%;
}

.lineheight-1 {
  line-height: 1;
}

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

.f-right {
  float: right;
}

.z-index-0 {
  z-index: 0;
}

.z-index-1 {
  z-index: 1;
}

.z-index-11 {
  z-index: 11;
}

.text-right {
  text-align: right;
}

.overflow-y-visible {
  overflow-x: hidden;
  overflow-y: visible;
}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.bg-position {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .bg-position-md-left {
    background-position: left;
  }
}

/* dropcap */
.tp-dropcap::first-letter {
  font-size: 90px;
  font-weight: 500;
  float: left;
  text-align: center;
  color: var(--tp-common-black);
  margin-right: 5px;
  line-height: inherit;
  text-transform: capitalize;
}

.class {
  stroke-dasharray: 189px, 191px;
  stroke-dashoffset: 0px;
}

/* gutter for x axis */
.tp-gx-10 {
  --bs-gutter-x: 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-10 {
    --bs-gutter-x: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-10 {
    --bs-gutter-x: 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-10 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-10 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-10 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-12 {
  --bs-gutter-x: 12px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-12 {
    --bs-gutter-x: 12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-12 {
    --bs-gutter-x: 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-12 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-12 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-12 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/* gutter for x axis */
.tp-gx-15 {
  --bs-gutter-x: 15px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-15 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-15 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-15 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .tp-gx-15 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-15 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-20 {
  --bs-gutter-x: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-20 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-20 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-20 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .tp-gx-20 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-20 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-23 {
  --bs-gutter-x: 23px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-23 {
    --bs-gutter-x: 23px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-23 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-23 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .tp-gx-23 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-23 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/* gutter for x axis */
.tp-gx-30 {
  --bs-gutter-x: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-30 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-30 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-30 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .tp-gx-30 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-30 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/* gutter for x axis */
.tp-gx-40 {
  --bs-gutter-x: 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-40 {
    --bs-gutter-x: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-40 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-40 {
    --bs-gutter-x: 30px;
  }
}
@media (max-width: 575px) {
  .tp-gx-40 {
    --bs-gutter-x: 15px;
  }
}
.tp-gx-40 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/* gutter for x axis */
.tp-gx-50 {
  --bs-gutter-x: 50px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-gx-50 {
    --bs-gutter-x: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-50 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-50 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-50 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .tp-gx-50 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-50 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/* gutter for x axis */
.tp-gx-60 {
  --bs-gutter-x: 60px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-gx-60 {
    --bs-gutter-x: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-60 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-60 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-60 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .tp-gx-60 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-60 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/*---------------------------------
    1.2 Default Spacing
---------------------------------*/
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-170 {
    padding-top: 115px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-165 {
    padding-top: 110px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-160 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-155 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-150 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-145 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-140 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-135 {
    padding-top: 95px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-130 {
    padding-top: 90px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-125 {
    padding-top: 85px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-120 {
    padding-top: 80px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-115 {
    padding-top: 75px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-110 {
    padding-top: 70px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-105 {
    padding-top: 65px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pt-100 {
    padding-top: 60px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-170 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-165 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-160 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-155 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-150 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-145 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-140 {
    padding-bottom: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-135 {
    padding-bottom: 95px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-130 {
    padding-bottom: 90px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-125 {
    padding-bottom: 85px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-120 {
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-115 {
    padding-bottom: 75px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-110 {
    padding-bottom: 70px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-105 {
    padding-bottom: 65px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-100 {
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-95 {
    padding-bottom: 55px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pb-90 {
    padding-bottom: 50px;
  }
}

/*----------------------------------------*/
/*  2.3 backtotop
/*----------------------------------------*/
.back-to-top-wrapper {
  position: fixed;
  right: 20px;
  bottom: 0;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  border-radius: 50%;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
}
@media (max-width: 575px) {
  .back-to-top-wrapper {
    right: 20px;
    bottom: 20px;
  }
}
.back-to-top-wrapper.back-to-top-btn-show {
  visibility: visible;
  opacity: 1;
  bottom: 50px;
}

.back-to-top-btn {
  display: inline-block;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  background: var(--tp-theme-primary);
  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
  color: var(--tp-common-white);
  border-radius: 50%;
}
.back-to-top-btn svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.back-to-top-btn:hover {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
  transform: translateY(-4px);
}

/*----------------------------------------*/
/*  2.5 buttons 
/*----------------------------------------*/
.tp-btn {
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-radius: 30px;
  padding: 8px 29px;
  font-weight: 500;
  font-size: 16px;
  color: var(--tp-common-white);
  display: inline-block;
  transition: all 0.4s ease;
}
.tp-btn:hover {
  color: var(--tp-common-black);
  background: var(--tp-common-white);
  border-color: var(--tp-common-white);
}
.tp-btn-2 {
  font-weight: 600;
  font-size: 16px;
  letter-spacing: -0.02em;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: var(--tp-common-white);
  padding: 8px 18px;
  display: inline-block;
}
.tp-btn-2:hover {
  background: var(--tp-common-white);
}
.tp-btn-2 span {
  margin-right: 5px;
}
.tp-btn-3 {
  border: 1px solid var(--tp-theme-primary);
  color: var(--tp-theme-primary);
  padding: 9px 22px;
}
.tp-btn-3:hover {
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
}
.tp-btn-4 {
  background: var(--tp-theme-2);
  border: none;
  font-size: 16px;
  font-family: var(--tp-ff-onest);
  font-weight: 600;
  color: var(--tp-common-white2);
  padding: 15px 30px;
  display: inline-block;
}
.tp-btn-4 svg {
  margin-right: 3px;
  transform: translateY(-3px);
}
.tp-btn-4:hover {
  background: var(--tp-common-falured);
  color: var(--tp-common-white2);
}
.tp-btn-5 {
  background: var(--tp-common-white);
  color: var(--tp-common-black4);
}
.tp-btn-square {
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--tp-common-black);
  border: 1px solid var(--tp-common-black);
  padding: 8px 18px;
  display: inline-block;
}
.tp-btn-square:hover {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
}
.tp-btn-square-yellow:hover {
  background: var(--tp-theme-2);
  border: 1px solid var(--tp-theme-2);
}
.tp-btn-square-red {
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
  border: none;
}
.tp-btn-square-red:hover {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
}
.tp-btn-banner {
  border-radius: 6px;
  background: #e7256b;
  border: none;
  color: var(--tp-common-white);
}
.tp-btn-banner-white {
  background: var(--tp-common-white);
  color: var(--tp-common-black);
}
.tp-btn-banner-white:hover {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
}
.tp-btn-banner:hover {
  background: var(--tp-theme-primary);
}
.tp-btn-sm {
  border: 1px solid var(--tp-common-black);
  border-radius: 100px;
  padding: 8px 24px;
  font-weight: 500;
  font-size: 14px;
  color: var(--tp-common-black);
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.tp-btn-sm svg {
  margin-left: 7px;
  transform: translateY(-2px);
}
.tp-btn-sm:hover {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  border: 1px solid var(--tp-common-black);
}
.tp-btn-border-black {
  backdrop-filter: blur(6px);
  background: #2d1a0e;
  font-family: var(--tp-ff-onest);
  font-weight: 600;
  color: var(--tp-common-white);
  width: 100%;
  padding: 13px 15px;
  transition: all 0.4s ease;
  display: block;
}
.tp-btn-border-black:hover {
  background: var(--tp-common-falured);
}
.tp-btn-falured {
  background: var(--tp-common-falured);
  font-family: var(--tp-ff-onest);
  font-weight: 600;
  color: var(--tp-common-white2);
  width: 100%;
  padding: 13px 15px;
  transition: all 0.4s ease;
  display: block;
}
.tp-btn-falured:hover {
  background: var(--tp-theme-2);
}
.tp-btn-white {
  font-family: var(--tp-ff-onest);
  font-weight: 500;
  font-size: 15px;
  color: var(--tp-common-black4);
  border: 1px solid #fff;
  padding: 8px 21px;
  backdrop-filter: blur(20px);
  box-shadow: 0 1px 2px 0 rgba(45, 26, 14, 0.18);
  background: rgba(255, 255, 255, 0.8);
  display: inline-block;
}
.tp-btn-white:hover {
  background: var(--tp-theme-2);
  color: var(--tp-common-white);
  border-color: var(--tp-theme-2);
}
.tp-btn-white-2 {
  background: var(--tp-common-white);
  color: var(--tp-common-black);
  border-radius: 6px;
}
.tp-btn-white-2:hover {
  background: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
}
.tp-btn-large {
  border-radius: 8px;
  padding: 13px 33px;
  font-family: var(--tp-ff-onest);
  font-weight: 600;
  font-size: 16px;
  color: var(--tp-common-white);
  display: inline-block;
  background: var(--tp-theme-primary);
}
.tp-btn-large:hover {
  background: var(--tp-common-black);
}
.tp-btn-xxl {
  display: inline-block;
  font-weight: 700;
  color: var(--tp-common-white);
  background: var(--tp-common-black);
  text-align: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  letter-spacing: -0.02em;
  font-size: 18px;
  padding: 17px 30px;
}
.tp-btn-xxl:hover {
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
}

.pulse-btn {
  display: inline-block;
  width: 80px;
  height: 80px;
  line-height: 80px;
  text-align: center;
  background-color: var(--tp-common-white);
  border-radius: 50%;
  color: var(--tp-common-black);
  animation: pulse 2s infinite;
}
.pulse-btn:hover {
  background-color: var(--tp-common-black);
  color: var(--tp-common-black);
}

.tp-demo-btn {
  border-radius: 20px;
  padding: 12px 22px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
  background: var(--tp-theme-primary);
  flex: 0 0 auto;
  padding: 8px 23px;
  display: inline-block;
}
.tp-demo-btn:hover {
  color: var(--tp-common-black);
  background: var(--tp-common-white);
}
.tp-demo-btn-black {
  background: var(--tp-common-black);
}
.tp-demo-btn-black:hover {
  color: var(--tp-common-black);
  background: var(--tp-common-white);
}

/*----------------------------------------*/
/*  2.1 animetion
/*----------------------------------------*/
@keyframes bar_anim {
  0%, 100% {
    -webkit-clip-path: inset(-2px 0);
    clip-path: inset(-2px 0);
  }
  42% {
    -webkit-clip-path: inset(-2px 0 -2px 100%);
    clip-path: inset(-2px 0 -2px 100%);
  }
  43% {
    -webkit-clip-path: inset(-2px 100% -2px 0);
    clip-path: inset(-2px 100% -2px 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }
  70% {
    -moz-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }
  100% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@-webkit-keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
@-moz-keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
@-ms-keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
@keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}
.rotate-infinite {
  -webkit-animation: rotate-infinite 15s linear infinite;
  animation: rotate-infinite 15s linear infinite;
}

@-webkit-keyframes rotate-infinite-2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-moz-keyframes rotate-infinite-2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-ms-keyframes rotate-infinite-2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-infinite-2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.rotate-infinite-2 {
  -webkit-animation: rotate-infinite-2 15s linear infinite;
  animation: rotate-infinite-2 15s linear infinite;
}

@-webkit-keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  60% {
    opacity: 0.5;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.9);
    opacity: 0;
  }
}
@-moz-keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  60% {
    opacity: 0.5;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.9);
    opacity: 0;
  }
}
@-ms-keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  60% {
    opacity: 0.5;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.9);
    opacity: 0;
  }
}
@keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  60% {
    opacity: 0.5;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.9);
    opacity: 0;
  }
}
@keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }
  100% {
    margin-top: 0;
  }
}
@keyframes img-anim-right {
  0% {
    transform: translateX(5%);
    clip-path: inset(0 0 0 100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
.img-custom-anim-left {
  animation: img-anim-left 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
  opacity: 0;
}

.img-custom-anim-right {
  animation: img-anim-right 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s;
  opacity: 0;
}

@keyframes img-anim-left {
  0% {
    transform: translateX(-5%);
    clip-path: inset(0 100% 0 0);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
.img-custom-anim-top {
  animation: img-anim-top 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1);
  opacity: 0;
}

@keyframes img-anim-top {
  0% {
    transform: translateY(-5%);
    clip-path: inset(0 0 100% 0);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
.img-custom-anim-bottom {
  animation: img-anim-bottom 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1);
  opacity: 0;
}

@keyframes img-anim-bottom {
  0% {
    transform: translateY(5%);
    clip-path: inset(100% 0 0 0);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes zoom {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes tpswing {
  0% {
    transform: rotate(3deg);
  }
  100% {
    transform: rotate(-3deg);
  }
}
@-webkit-keyframes tpswing {
  0% {
    transform: rotate(3deg);
  }
  100% {
    transform: rotate(-3deg);
  }
}
@keyframes tpswings {
  0% {
    transform: translateY(0) rotate(0deg);
  }
  100% {
    transform: translateY(-20px) rotate(-10deg);
  }
}
.tpswings {
  animation: tpswing 3s ease-in-out 0.1s forwards infinite alternate;
  transform-origin: bottom left;
}

@keyframes hero-bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}
/*----------------------------------------*/
/*  2.10 Modal
/*----------------------------------------*/
/*----------------------------------------*/
/*  2.9 pagenation
/*----------------------------------------*/
#loading {
  background-color: var(--tp-common-falured);
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 999;
  margin-top: 0px;
  top: 0px;
}

.loading {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  left: -100px;
  display: block;
  margin: 15px auto;
  position: relative;
  box-sizing: border-box;
  animation: shadowRolling 2s linear infinite;
  top: 50%;
  transform: translateY(-50%);
}

@keyframes shadowRolling {
  0% {
    box-shadow: 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
  }
  12% {
    box-shadow: 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
  }
  25% {
    box-shadow: 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
  }
  36% {
    box-shadow: 120px 0 white, 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0);
  }
  50% {
    box-shadow: 130px 0 white, 120px 0 white, 110px 0 white, 100px 0 white;
  }
  62% {
    box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white, 110px 0 white;
  }
  75% {
    box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white;
  }
  87% {
    box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white;
  }
  100% {
    box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0);
  }
}
/*----------------------------------------*/
/*  2.2 background
/*----------------------------------------*/
.tp-section-black {
  background: var(--tp-common-black);
}

.tp-bg-gray {
  background: #f9f9f9;
}

.tp-bg-gray-2 {
  background: #f8f8f8;
}

.tp-bg-gray-3 {
  background: #f6f6f6;
}

.tp-bg-gray-4 {
  background: #f6efe7;
}

.tp-pink-bg {
  background: #44343a;
}

.tp-yellow-bg {
  background: #ffd084;
}

.tp-falured-bg {
  background: #761f0e;
}

.tp-falured-bg-2 {
  background: var(--tp-common-black4);
}

.tp-home-3-bg {
  background: #faf5ef;
}

/*----------------------------------------*/
/*  2.7 nice select
/*----------------------------------------*/
.nice-select {
  -webkit-tap-highlight-color: transparent;
  background-color: #fff;
  border: 1px solid #D9D9D9;
  box-sizing: border-box;
  clear: both;
  cursor: pointer;
  display: block;
  float: left;
  font-family: inherit;
  font-size: 15px;
  font-weight: normal;
  line-height: 58px;
  outline: none;
  padding-left: 30px;
  padding-right: 30px;
  position: relative;
  text-align: left !important;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
  width: auto;
  width: 100%;
  text-transform: uppercase;
  height: 60px;
  color: var(--tp-grey-1);
}
.nice-select:hover {
  border-color: #dbdbdb;
}
.nice-select .current {
  font-size: 15px;
}
.nice-select:active, .nice-select.open, .nice-select:focus {
  border-color: var(--tp-theme-primary);
}
.nice-select::after {
  position: absolute;
  content: "\f107";
  top: 50%;
  right: 20px;
  font-size: 18px;
  font-family: var(--tp-ff-fontawesome);
  color: var(--tp-common-black);
  font-weight: 500;
  pointer-events: none;
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  margin-top: 0;
  transform-origin: center;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.nice-select.open::after {
  -webkit-transform: translateY(-50%) rotate(-180deg);
  -moz-transform: translateY(-50%) rotate(-180deg);
  -ms-transform: translateY(-50%) rotate(-180deg);
  -o-transform: translateY(-50%) rotate(-180deg);
  transform: translateY(-50%) rotate(-180deg);
}
.nice-select.open .list {
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: scale(1) translateY(0);
  -ms-transform: scale(1) translateY(0);
  transform: scale(1) translateY(0);
}
.nice-select.disabled {
  border-color: #ededed;
  color: #999;
  pointer-events: none;
}
.nice-select.disabled::after {
  border-color: #cccccc;
}
.nice-select.wide {
  width: 100%;
}
.nice-select.wide .list {
  left: 0 !important;
  right: 0 !important;
}
.nice-select.right {
  float: right;
}
.nice-select.right .list {
  left: auto;
  right: 0;
}
.nice-select.small {
  font-size: 12px;
  height: 36px;
  line-height: 34px;
}
.nice-select.small::after {
  height: 4px;
  width: 4px;
}
.nice-select.small .option {
  line-height: 34px;
  min-height: 34px;
}
.nice-select .list {
  background-color: #fff;
  box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11);
  box-sizing: border-box;
  margin-top: 4px;
  opacity: 0;
  overflow: hidden;
  padding: 0;
  pointer-events: none;
  position: absolute;
  top: 100%;
  left: 0;
  -webkit-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transform: scale(0.75) translateY(-21px);
  -ms-transform: scale(0.75) translateY(-21px);
  transform: scale(0.75) translateY(-21px);
  -webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
  transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
  z-index: 9;
  width: 100%;
}
.nice-select .option {
  cursor: pointer;
  font-weight: 400;
  line-height: 40px;
  list-style: none;
  min-height: 40px;
  outline: none;
  padding-left: 18px;
  padding-right: 29px;
  text-align: left;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.nice-select .option.selected {
  font-weight: bold;
}
.nice-select .option.disabled {
  background-color: transparent;
  color: #999;
  cursor: default;
}

.no-csspointerevents .nice-select .list {
  display: none;
}

.no-csspointerevents .nice-select.open .list {
  display: block;
}

/*----------------------------------------*/
/*  2.8 offcanvas
/*----------------------------------------*/
.body-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 995;
  width: 100%;
  height: 100%;
  background: rgba(24, 24, 24, 0.4);
  visibility: hidden;
  opacity: 0;
  transition: 0.45s ease-in-out;
}
.body-overlay.apply {
  opacity: 1;
  visibility: visible;
}
.body-overlay.openeds {
  opacity: 1;
  visibility: visible;
}
.body-overlay.active {
  opacity: 1;
  visibility: visible;
}
.body-overlay:hover {
  cursor: url(../img/icon/cross-out.png), pointer;
}

.tpoffcanvas {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  right: -100%;
  width: 480px;
  bottom: 0;
  box-shadow: 0 16px -32px 0 rgba(0, 0, 0, 0.8);
  background-color: var(--tp-common-white);
  z-index: 997;
  padding: 50px;
  scrollbar-width: none;
  opacity: 0;
  visibility: hidden;
  transition: 0.45s ease-in-out;
  overflow-y: scroll;
}
.tpoffcanvas .homemenu {
  margin-bottom: 30px;
}
.tpoffcanvas .homemenu-title {
  color: var(--tp-common-white);
}
.tpoffcanvas .tp-main-menu-mobile {
  margin-bottom: 30px;
}
.tpoffcanvas.opened {
  opacity: 1;
  visibility: visible;
}
@media (max-width: 575px) {
  .tpoffcanvas {
    width: 100%;
    padding: 40px 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tpoffcanvas {
    width: 400px;
    padding: 40px;
  }
}
.tpoffcanvas.opened {
  right: 0;
  -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 0.6s;
  z-index: 999;
}
.tpoffcanvas-btn {
  padding: 22px 40px;
  background: var(--tp-theme-primary);
  display: inline-block;
  font-size: 15px;
  letter-spacing: 0px;
  line-height: 20px;
  color: var(--tp-common-white);
  font-weight: 700;
  position: relative;
  transition: all 0.3s linear;
  overflow: hidden;
  z-index: 1;
  line-height: 1;
  width: 100%;
  text-align: center;
  border-radius: 50px;
}
.tpoffcanvas-btn:hover {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
}
.tpoffcanvas__contact-title h5 {
  font-size: 14px;
  color: var(--tp-common-black);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 30px;
  display: inline-block;
}
.tpoffcanvas__contact-info {
  margin-bottom: 30px;
}
.tpoffcanvas__contact-info ul li {
  font-size: 16px;
  color: var(--tp-common-black);
  margin-bottom: 15px;
  list-style-type: none;
}
.tpoffcanvas__contact-info ul li i {
  width: 16px;
}
@media (max-width: 575px) {
  .tpoffcanvas__contact-info ul li {
    font-size: 14px;
  }
}
.tpoffcanvas__contact-info ul li:last-child {
  margin-bottom: 0;
}
.tpoffcanvas__contact-info ul li a {
  margin-left: 10px;
  transition: 0.3s;
}
.tpoffcanvas__contact-info ul li a:hover {
  color: var(--tp-theme-primary);
}
.tpoffcanvas__logo {
  margin-bottom: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tpoffcanvas__logo {
    padding-top: 0;
  }
}
@media (max-width: 575px) {
  .tpoffcanvas__logo {
    padding-top: 0;
  }
}
@media (max-width: 575px) {
  .tpoffcanvas__logo img {
    width: 150px;
  }
}
.tpoffcanvas__close-btn button {
  position: absolute;
  right: 30px;
  top: 37px;
  transition: 0.4s;
  -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 0.3s;
  height: 40px;
  width: 40px;
  line-height: 41px;
  border-radius: 50px;
  border: 1px solid var(--tp-theme-primary);
  color: var(--tp-theme-primary);
}
.tpoffcanvas__close-btn button:hover {
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
  border: 1px solid var(--tp-theme-primary);
}
.tpoffcanvas__close-btn button i {
  font-weight: 300;
  font-size: 20px;
  transition: 0.4s;
}
.tpoffcanvas__social {
  margin-top: 30px;
}
.tpoffcanvas__social .social-icon a {
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  border: 1px solid var(--tp-theme-primary);
  color: var(--tp-theme-primary);
  margin-right: 15px;
  transition: 0.3s;
  display: inline-block;
  border-radius: 50px;
}
@media (max-width: 575px) {
  .tpoffcanvas__social .social-icon a {
    margin-right: 3px;
    height: 50px;
    width: 50px;
    line-height: 53px;
    font-size: 15px;
  }
}
.tpoffcanvas__social .social-icon a:hover {
  background-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
}

/*----------------------------------------*/
/*  2.4 breadcrumb
/*----------------------------------------*/
.tp-breadcrumb-title {
  font-family: var(--tp-ff-playfair);
  font-weight: 700;
  font-size: 80px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-breadcrumb-title {
    font-size: 65px;
  }
}
@media (max-width: 575px) {
  .tp-breadcrumb-title {
    font-size: 42px;
  }
}
.tp-breadcrumb-title-blog {
  font-family: var(--tp-ff-onest);
  font-weight: 800;
  font-size: 60px;
  line-height: 1.33;
  letter-spacing: -0.02em;
}
.tp-breadcrumb-title-blog-2 {
  color: #2d1a0e;
  font-size: 70px;
  line-height: 1.11;
  font-family: var(--tp-ff-playfair);
}
.tp-breadcrumb-title-blog-3 {
  font-size: 67px;
  line-height: 1.11;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-breadcrumb-title-blog {
    font-size: 42px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-breadcrumb-title-blog {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .tp-breadcrumb-title-blog {
    font-size: 42px;
  }
}
.tp-breadcrumb-title-pre {
  font-size: 22px;
  line-height: 1.36;
  letter-spacing: -0.02em;
  color: #fafaf8;
  font-family: var(--tp-ff-amita);
  font-weight: 500;
}
.tp-breadcrumb-shape {
  position: absolute;
  top: -100px;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: -1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-breadcrumb-shape img {
    width: 100%;
  }
}
.tp-breadcrumb-para-blog {
  font-family: var(--tp-ff-onest);
  font-size: 18px;
  letter-spacing: -0.02em;
  color: #2f2c2d;
}
.tp-breadcrumb-para-3 {
  font-size: 17px;
  color: #2f2c2d;
}
.tp-breadcrumb-spacing {
  padding-top: 200px;
  padding-bottom: 125px;
}
.tp-breadcrumb-spacing-2 {
  padding-top: 93px;
  padding-bottom: 47px;
}
.tp-breadcrumb-spacing-3 {
  padding-top: 120px;
  padding-bottom: 28px;
}
.tp-breadcrumb-tag {
  font-family: var(--tp-ff-onest);
  font-size: 14px;
  padding: 5px 13px 3px 13px;
  background: #e8e8e8;
  margin-bottom: 7px;
  font-weight: 500;
  display: inline-block;
}
.tp-breadcrumb-tag-2 {
  color: var(--tp-common-falured);
  border: 1px solid #a05916;
  backdrop-filter: blur(6px);
  background: none;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 10px;
}
.tp-breadcrumb-blog-meta span {
  font-family: var(--tp-ff-onest);
  margin-right: 11px;
  padding-right: 14px;
  margin-bottom: 20px;
  display: inline-block;
  font-weight: 500;
}
.tp-breadcrumb-blog-meta span img {
  margin-right: 3px;
  border-radius: 50%;
}
.tp-breadcrumb-blog-meta span:not(:last-child) {
  position: relative;
}
.tp-breadcrumb-blog-meta span:not(:last-child)::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 24px;
  background: #d9d9d9;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
.tp-breadcrumb-blog-meta-2 span {
  color: #2d1a0e;
}
.tp-breadcrumb-faq-title {
  font-family: var(--tp-ff-playfair);
  font-weight: 600;
  font-size: 60px;
  letter-spacing: -0.01em;
  color: var(--tp-common-black4);
}
@media (max-width: 575px) {
  .tp-breadcrumb-faq-title {
    font-size: 50px;
  }
}
.tp-breadcrumb-faq-title-pre {
  font-family: var(--tp-ff-playfair);
  font-weight: 500;
  font-size: 18px;
  color: var(--tp-common-falured);
}
.tp-breadcrumb-faq-text {
  font-family: var(--tp-ff-onest);
  font-size: 18px;
  line-height: 28px;
  color: var(--tp-grey-5);
}
.tp-breadcrumb-list span {
  font-weight: 400;
  font-size: 16px;
  position: relative;
}
.tp-breadcrumb-list span a:hover {
  color: var(--tp-theme-primary);
}
.tp-breadcrumb-list span:not(:last-child) {
  padding-right: 12px;
  margin-right: 5px;
}
.tp-breadcrumb-list span:not(:last-child)::after {
  position: absolute;
  content: "";
  right: 0;
  top: 50%;
  width: 4px;
  height: 4px;
  background-color: #A8ACB0;
  border-radius: 50%;
}

/*----------------------------------------*/
/*  2.11 Section Title
/*----------------------------------------*/
.tp-section-title {
  font-size: 50px;
  color: var(--tp-common-black);
}
@media (max-width: 575px) {
  .tp-section-title {
    font-size: 40px;
  }
}
.tp-section-title-white {
  color: var(--tp-common-white);
}
.tp-section-title-para {
  font-weight: 300;
  font-size: 20px;
  color: var(--tp-grey-1);
}
.tp-section-title-pre {
  font-weight: 500;
  font-size: 20px;
  letter-spacing: -0.02em;
  color: var(--tp-common-yellow);
}
.tp-section-title-pre-red {
  color: var(--tp-theme-primary);
}
.tp-section-title-content {
  color: var(--tp-grey-2);
}
.tp-section-title-small {
  font-size: 36px;
}
.tp-section-title-two {
  font-family: var(--tp-ff-onest);
  font-weight: 700;
  font-size: 36px;
  letter-spacing: -0.01em;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-section-title-two br {
    display: none;
  }
}
.tp-section-title-two img {
  transform: translateY(-4px);
}
.tp-section-title-two-pre {
  font-family: var(--tp-ff-amita);
  font-weight: 400;
  font-size: 20px;
  color: var(--tp-theme-primary);
  margin-bottom: 4px;
}
.tp-section-title-cta {
  font-family: var(--tp-ff-amita);
  font-weight: 700;
  font-size: 90px;
  line-height: 89%;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}
@media (max-width: 575px) {
  .tp-section-title-cta {
    font-size: 65px;
  }
}
.tp-section-title-cta-pre {
  font-family: var(--tp-ff-onest);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 0.2em;
  color: var(--tp-theme-primary);
}
.tp-section-two-title {
  font-family: var(--tp-ff-onest);
  font-weight: 700;
  font-size: 66px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
@media (max-width: 575px) {
  .tp-section-two-title {
    font-size: 44px;
  }
}
.tp-section-two-title-pre {
  font-family: var(--tp-ff-amita);
  font-weight: 700;
  font-size: 66px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  margin-bottom: 0;
}
@media (max-width: 575px) {
  .tp-section-two-title-pre {
    font-size: 45px;
  }
}
.tp-section-three-title {
  font-family: var(--tp-ff-playfair);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #2d1a0e;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-three-title {
    font-size: 46px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-section-three-title {
    font-size: 34px;
  }
  .tp-section-three-title br {
    display: none;
  }
}
.tp-section-three-title-pre {
  font-weight: 400;
  font-size: 22px;
  letter-spacing: 0.02em;
  line-height: 1.3;
  color: var(--tp-theme-1);
  font-family: var(--tp-ff-amita);
}

.lh-115 {
  line-height: 115%;
}

.fs-40 {
  font-size: 40px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .fs-40 {
    font-size: 36px;
  }
}

.fs-15 {
  font-size: 15px;
}

/*----------------------------------------*/
/*  2.6 instagram
/*----------------------------------------*/
.tp-instagram-icon {
  top: 50%;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 2;
  transform: translateY(-50%);
}
.tp-instagram-icon span {
  color: var(--tp-common-white);
  font-size: 26px;
  position: relative;
  opacity: 0;
  visibility: hidden;
  transform: scale(0);
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.tp-instagram-icon span::before {
  position: absolute;
  content: "";
  width: 60px;
  height: 60px;
  border: 1px solid var(--tp-common-white);
  left: -18px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}
.tp-instagram-thumb {
  overflow: hidden;
  position: relative;
}
.tp-instagram-thumb a {
  display: block;
  position: relative;
}
.tp-instagram-thumb a::after {
  background: linear-gradient(180deg, rgba(20, 20, 20, 0) 0%, rgba(20, 20, 20, 0.8) 100%);
  position: absolute;
  content: "";
  width: 105%;
  height: 100%;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: all 0.4s ease;
}
.tp-instagram-thumb img {
  transition: all 0.4s ease;
}
.tp-instagram-thumb:hover a::after {
  opacity: 1;
}
.tp-instagram-thumb:hover span {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.tp-instagram-thumb:hover img {
  transform: scale(1.1);
}

/*----------------------------------------*/