/************ 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 Carousel
 		2.7 instagram
		2.8 cursor
		2.9 Modal
		2.10 nice select
		2.11 offcanvas
		2.12 Modal
		2.13 search
		2.14 Section Title
 		2.15 Tooltip CSS START

	-----------------
    03. HEADER CSS
	-----------------
		3.1 Header Style 1

    ---------------------------------
	04. MENU CSS
	---------------------------------
		4.1 menu css
		4.2 Mobile css
		4.3 menu css
		4.3 mobilemenu css

	---------------------------------
	05. BLOG CSS
	---------------------------------
		5.1 Blog css
		5.2 Postbox css

	---------------------------------
	06. FOOTER CSS
	---------------------------------
		6.1 Footer Style 1

	---------------------------------
	07. PAGES CSS
	---------------------------------
		7.1 about css
		7.2 award css
		7.3 banner css
		7.4 brands css
		7.5 cart css
		7.6 category css
		7.7 choose css
		7.8 contact css
		7.9 cta css
		7.10 feature css
		7.11 funfacts css
		7.12 help css
		7.13 hero css
		7.14 portfolio css
		7.15 pricing css
		7.16 progress css
		7.17 product-details css
		7.18 product css
		7.19 protect css
		7.20 service css
		7.21 shop css
		7.22 sidebar css
		7.23 subscribe css
		7.24 team css
		7.25 testimonial css
		7.26 video css
**********************************************/
/*----------------------------------------*/
/*  1.1 Theme Default
/*----------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Syncopate:wght@400;700&display=swap');
.tp-product-action, .tp-feature-icon::before, .tp-feature-icon::after, .tp-product-tooltip, .search__input, .search__input::after {
  -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;
}

.back-to-top-wrapper, 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;
}

.back-to-top-btn {
  -webkit-transition: transform 0.3s 0s ease-out;
  -moz-transition: transform 0.3s 0s ease-out;
  -ms-transition: transform 0.3s 0s ease-out;
  -o-transition: transform 0.3s 0s ease-out;
  transition: transform 0.3s 0s ease-out;
}

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

.tp-product-tooltip, .tp-all-font-roboto *:not(i) {
  font-family: var(--tp-ff-roboto);
}

/* transform */
:root {
  /**
  @font family declaration
  */
  --tp-ff-body: 'DM Sans', sans-serif;
  --tp-ff-heading: 'Syncopate', sans-serif;
  --tp-ff-common: 'Syncopate', sans-serif;
  --tp-ff-p: 'DM Sans', sans-serif;
  --tp-ff-fontawesome: "Font Awesome 6 Pro";
  /**
  @color declaration
  */
  --tp-common-white: #ffffff;
  --tp-common-black: #060607;
  --tp-common-bg: #fff0e0;
  --tp-common-bg2: #fe9e97;
  --tp-grey-1: #383535;
  --tp-grey-2: #bcbcbc;
  --tp-text-body: #fff7ef;
  --tp-theme-primary:#F25555;
}

@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-body);
  font-size: 16px;
  font-weight: normal;
  color: var(--tp-grey-1);
  background: var(--tp-common-white);
  line-height: 24px;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--tp-ff-heading);
  color: #1c1d21;
  margin-top: 0px;
  font-weight: 700;
  line-height: 1.2;
}

h1 {
  font-size: 80px;
}

h2 {
  font-size: 60px;
}

h3 {
  font-size: 28px;
}

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;
}

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;
}
[dir=rtl] input[type=text],
[dir=rtl] input[type=email],
[dir=rtl] input[type=tel],
[dir=rtl] input[type=number],
[dir=rtl] input[type=password],
[dir=rtl] input[type=url],
[dir=rtl] textarea {
  text-align: right;
}

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

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: #1c1d21;
  color: var(--tp-common-white);
  text-shadow: none;
}

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

::selection {
  background: #1c1d21;
  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-1720 {
    max-width: 1720px;
  }
}
/*---------------------------------
  1.1 Common Classes
---------------------------------*/
img {
  width:100%;
  max-width:100%;
  object-fit:cover;
}
.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-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;
  }
}

.demo {
  -webkit-transition: color 0.3s 0s linear;
  -moz-transition: color 0.3s 0s linear;
  -ms-transition: color 0.3s 0s linear;
  -o-transition: color 0.3s 0s linear;
  transition: color 0.3s 0s linear;
  -webkit-transition: color 0.3s linear, transform 0.2s ease;
  -moz-transition: color 0.3s linear, transform 0.2s ease;
  -ms-transition: color 0.3s linear, transform 0.2s ease;
  -o-transition: color 0.3s linear, transform 0.2s ease;
  transition: color 0.3s linear, transform 0.2s ease;
}
[dir=rtl] .demo {
  margin-left: 0;
  margin-right: 15px;
}
div.demo img {
  margin-left: 10px;
}

[tp-theme=tp-theme-dark] .demo {
  color: yellow;
}

.tp-top-border {
  border-top: 1px solid #e7d6c4;
}
.tp-top-border-2 {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

@media (max-width: 575px) {
  .d-xs-none {
    display: none;
  }
}

/* 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);
}

/* 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);
}

/* 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);
}

.tp-lft {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

/*---------------------------------
    1.2 Default Spacing
---------------------------------*/
.tp-section-spacing {
  padding: 0 85px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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-section-spacing {
    padding: 0;
  }
}

.tp-section-spacing-2 {
  padding: 0 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) {
  .tp-section-spacing-2 {
    padding: 0 15px;
  }
}

@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;
  }
}
.pb-90 {
  padding-bottom:70px;
}
.pt-90{
  padding-top:70px;
}
@media only screen and (max-width:991px){
  .pb-90 {
    padding-bottom: 50px;
  }
  .pt-90{
    padding-top: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 {
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  color: var(--tp-common-white);
  display: inline-block;
  background-color: var(--tp-theme-primary);
  padding: 22px 40px 21px 40px;
  transition: all 0.3s linear;
  line-height: 1;
  border-radius: 35px;
  position: relative !important;
  overflow: hidden;
  flex: 0 0 auto;
  perspective: 1000px;
  z-index: 2;
}
.tp-btn .explore-text {
  position: relative;
  display: inline-block;
  padding: 0;
  transition: transform 0.5s;
  transform-origin: 50% 0;
  transform-style: preserve-3d;
}
.tp-btn .explore-text::before {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  content: attr(data-text);
  transition: color 0.5s;
  transform: rotateX(-90deg);
  transform-origin: 50% 0;
  text-align: center;
  z-index: -1;
}
.tp-btn:hover {
  color: var(--tp-common-white);
}
.tp-btn:hover .explore-text {
  transform: rotateX(90deg) translateY(-12px);
  color: inherit;
}
.tp-btn-black {
  background: var(--tp-common-black);
}
.tp-btn-black:hover {
  color: var(--tp-common-white);
}
.tp-btn-round {
  width: 60px;
  height: 60px;
  display: inline-block;
  border: 1px solid #d9d9d9;
  border-radius: 50%;
  text-align: center;
  padding: 17px;
  transition: all 0.3s ease-in-out;
}
.tp-btn-round:hover {
  background-color: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
}
.tp-btn-icon {
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  display: inline-block;
}
.tp-btn-icon svg:nth-child(1) {
  display: inline-block;
  transition: transform 0.3s linear;
}
.tp-btn-icon svg + svg {
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-30px, 30px);
  transition: transform 0.3s linear;
}
.tp-btn-icon:hover svg + svg {
  transform: translate(0px, 6px);
}
.tp-btn-icon:hover svg:nth-child(1) {
  transform: translate(30px, -30px);
}
.tp-btn-icon-hover:hover svg + svg {
  transform: translate(0px, 6px);
}
.tp-btn-icon-hover:hover svg:nth-child(1) {
  transform: translate(30px, -30px);
}
.tp-btn-circle-dot {
  position: absolute;
  bottom: 0;
  left: 32px;
  width: 20px;
  height: 20px;
  -webkit-transition: all 0.6s ease-out;
  -moz-transition: all 0.6s ease-out;
  -ms-transition: all 0.6s ease-out;
  -o-transition: all 0.6s ease-out;
  transition: all 0.6s ease-out;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 50%;
  background-color: var(--tp-common-black);
  /* -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); */
  border: 1px solid transparent;
  z-index: -1;
}
.tp-btn-circle-dot-2 {
  background-color: var(--tp-common-white);
}
.tp-btn-rounded {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.tp-btn-rounded:hover .tp-btn-circle-dot {
  width:100%;
  height:100%;
  left:0;
}
.tp-btn-rounded:hover .tp-btn-circle-dot-2 {
  width: 420px;
  height: 420px;
}
.tp-btn-rounded:hover span {
  color: var(--tp-common-white);
}
.tp-btn-rounded-2 span {
  -webkit-transition: all 0.6s ease-out;
  -moz-transition: all 0.6s ease-out;
  -ms-transition: all 0.6s ease-out;
  -o-transition: all 0.6s ease-out;
  transition: all 0.6s ease-out;
}
.tp-btn-rounded-2:hover span {
  color: var(--tp-common-black);
}
.tp-btn-transparent {
  background: none;
  border: 1px solid #484444;
}

/*----------------------------------------*/
/*  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);
  }
}
.tp-arrow-angle {
  --qode-hover-move-x: 110%;
  --qode-hover-move-y: 100%;
}

.tp-arrow-svg-top-right {
  fill: currentColor;
  stroke: none;
}

.tp-arrow-angle path {
  transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-out;
}

.tp-arrow-angle path:nth-of-type(1) {
  transform: translateX(0) translateY(0);
  opacity: 1;
  transition-delay: 0.15s, 0.15s;
}

.tp-arrow-angle path:nth-of-type(2) {
  transform: translateX(calc(-1 * var(--qode-hover-move-x))) translateY(var(--qode-hover-move-y));
  opacity: 0.5;
  transition-delay: 0s, 0s;
}

.tp-left-right:hover .tp-arrow-angle path:nth-of-type(2) {
  transform: translateX(0) translateY(0);
  opacity: 1;
  transition-delay: 0.15s, 0.15s;
}

.tp-left-right:hover .tp-arrow-angle path:nth-of-type(1) {
  transform: translateX(var(--qode-hover-move-x)) translateY(calc(-1 * var(--qode-hover-move-y)));
  opacity: 0;
  transition-delay: 0s, 0s;
}

@keyframes pulse2 {
  50% {
    box-shadow: 0 0 0 0.3em rgba(255, 255, 255, 0.75);
  }
  100% {
    box-shadow: 0 0 0 0.6em rgba(255, 255, 255, 0);
  }
}
@keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }
  100% {
    margin-top: 0;
  }
}
@keyframes tpfadeUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(90px);
    transform: translateY(90px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
.tpfadeUp {
  -webkit-animation-name: tpfadeUp;
  animation-name: tpfadeUp;
}

/*----------------------------------------*/
/*  2.12 Modal
/*----------------------------------------*/

/*----------------------------------------*/
/*  2.2 background
/*----------------------------------------*/
.section-bg {
  background-color: var(--tp-theme-bg2);
}

.section-bg2 {
  background-color: var(--tp-common-bg);
}

.section-black {
  background-color: #1c1d21;
}

.section-orange {
  background-color: #fff0e0;
}

.section-orange-2 {
  background-color: var(--tp-text-body);
}

.section-dark {
  background-color: #1c1d21;
}

/*----------------------------------------*/
/*  2.6 Carousel
/*----------------------------------------*/
/* tp range slider css */
.tp-range-slider .inside-slider {
  text-align: center;
}

/*----------------------------------------*/
/*  2.10 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.11 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:15px;
  top:15px;
  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
/*----------------------------------------*/
@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-breadcrumb-list {
    margin-bottom: 10px;
  }
}
.tp-breadcrumb-list span {
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-common);
}
.tp-breadcrumb-title {
  font-weight: 700;
  font-size: 60px;
  text-transform: uppercase;
  color: var(--tp-common-black);
  font-family: var(--tp-ff-common);
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-breadcrumb-title {
    font-size: 50px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-breadcrumb-title {
    font-size: 44px;
  }
}
@media (max-width: 575px) {
  .tp-breadcrumb-title {
    font-size: 35px;
  }
}
.tp-breadcrumb-home a {
  position: relative;
  z-index: 1;
}
.tp-breadcrumb-home a::before {
  clip-path: polygon(0 0, 100% 0%, 77% 100%, 0% 100%);
  position: absolute;
  content: "";
  width: 65px;
  height: 30px;
  top: -9px;
  left: -14px;
  background-color: #ffc9b2;
  z-index: -1;
}
.tp-breadcrumb-shape-01 {
  top: 140px;
  left: 98px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-breadcrumb-shape-01 {
    left: 250px;
    top: 50px;
  }
}
.tp-breadcrumb-shape-02 {
  top: 154px;
  left: -75px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-breadcrumb-shape-02 {
    left: 76px;
  }
}
.tp-breadcrumb-shape-03 {
  right: 195px;
  top: 98px;
}
.tp-breadcrumb-shape-04 {
  right: -85px;
  bottom: 20px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-breadcrumb-shape-04 {
    right: 0;
  }
}
.tp-breadcrumb-social-wrap {
  padding-bottom: 35px;
  transform: rotate(-90deg);
  display: inline-block;
  top: 54%;
  position: absolute;
  left: -72px;
}
.tp-breadcrumb-social::before {
  position: absolute;
  content: "";
  background-color: #000;
  width: 410px;
  height: 1px;
  top: 60px;
  left: -63px;
}
.tp-breadcrumb-social span {
  margin: 0 15px;
}
.tp-breadcrumb-social a {
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--tp-grey-1);
}
.tp-breadcrumb-social a:hover {
  color: var(--tp-theme-primary);
}
.tp-breadcrumb-dvdr {
  margin: 0 4px;
}

/*----------------------------------------*/
/*  2.14 Section Title
/*----------------------------------------*/
.tp-section-title {
  line-height: 1.15;
  text-transform: uppercase;
}
@media (max-width: 575px) {
  .tp-section-title span {
    margin-left: 0;
  }
}
.tp-section-title-2 {
  font-size: 49px;
  line-height: 1.2;
  text-transform: capitalize;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title-2 br {
    display: none;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-section-title-2 {
    font-size: 41px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title-2 {
    font-size: 40px;
  }
}
@media (max-width: 575px) {
  .tp-section-title-2 {
    font-size: 30px;
  }
}
.tp-section-title-badge {
  font-family: var(--tp-ff-p);
  font-weight: 600;
  font-size: 14px;
  text-transform: capitalize;
  color: var(--tp-common-white);
  background: var(--tp-theme-primary);
  padding: 9px 12px;
  display: inline-block;
  border-radius: 20px;
  transform: translateY(-13px);
  margin-right: 20px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section-title {
    font-size: 50px;
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title {
    font-size: 45px;
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-title {
    font-size: 40px;
  }
}
@media (max-width: 575px) {
  .tp-section-title {
    font-size: 30px;
  }
}
.tp-section-title-white {
  color: var(--tp-common-white);
}
.tp-section-title-white2 {
  color: var(--tp-common-white);
  text-transform: capitalize;
}
.tp-section-subtitle {
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  font-family: var(--tp-ff-common);
  display: inline-block;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-section-subtitle {
    margin-bottom: 20px;
    display: inline-block;
  }
}
.tp-section-subtitle-orange {
  color: var(--tp-theme-primary);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section-content p {
    font-size: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .tp-section-content p {
    font-size: 15px;
  }
}
@media (max-width: 575px) {
  .tp-section-content p {
    font-size: 14px;
  }
}
.tp-section-content-gray {
  color: #bcbcbc;
}
@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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section-content {
    margin: 0;
  }
}

/*----------------------------------------*/
/*  2.13 search
/*----------------------------------------*/
.search__popup {
  padding-top: 70px;
  padding-bottom: 100px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 380px;
  background-color: var(--tp-common-white);
  z-index: 9999;
  -webkit-transform: translateY(calc(-100% - 80px));
  -moz-transform: translateY(calc(-100% - 80px));
  -ms-transform: translateY(calc(-100% - 80px));
  -o-transform: translateY(calc(-100% - 80px));
  transform: translateY(calc(-100% - 80px));
  transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  transition-delay: 0.4s;
}
.search__popup.active {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -ms-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  transition-delay: 0s;
}
.search__popup.active .search__input {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
  opacity: 1;
  transition-delay: 0.3s;
}
.search__popup.active .search__input::after {
  width: 100%;
  transition-delay: 0.5s;
}
.search-form-toggle.active .search__input {
  transform: translateY(0px);
  opacity: 1;
  transition-delay: 0.3s;
}
.search-form-toggle.active .search__input::after {
  width: 100%;
  transition-delay: 0.5s;
}
.search__input {
  position: relative;
  height: 80px;
  -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -o-transform: translateY(-40px);
  transform: translateY(-40px);
  transition-delay: 0.7s;
  opacity: 0;
}
.search__input::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 0%;
  height: 1px;
  background-color: rgba(66, 51, 51, 0.3);
  transition-delay: 0.3s;
}
.search__input input {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: 0;
  outline: 0;
  font-size: 24px;
  color: var(--tp-common-black);
  border-bottom: 1px solid transparent;
  padding: 0;
  padding-right: 30px;
}
.search__input input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: var(--tp-common-black);
  font-size: 24px;
}
.search__input input::-moz-placeholder {
  /* Firefox 19+ */
  color: var(--tp-common-black);
  font-size: 24px;
}
.search__input input:-moz-placeholder {
  /* Firefox 4-18 */
  color: var(--tp-common-black);
  font-size: 24px;
}
.search__input input:-ms-input-placeholder {
  /* IE 10+  Edge*/
  color: var(--tp-common-black);
  font-size: 24px;
}
.search__input input::placeholder {
  /* MODERN BROWSER */
  color: var(--tp-common-black);
  font-size: 24px;
}
.search__input button {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 18px;
  color: var(--tp-common-black);
}
.search__input button:hover {
  color: var(--tp-theme-primary);
}
.search__input .search-input-field ~ .search-focus-border {
  position: absolute;
  bottom: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 2px;
  background-color: var(--tp-theme-primary);
  transition: all 0.15s ease;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.search__input .search-input-field:focus ~ .search-focus-border {
  width: 100%;
  left: 0;
  right: auto;
  transition: all 0.15s ease;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}

.search__close-btn {
  font-size: 25px;
  color: var(--tp-common-black);
}
.search__close-btn:hover {
  color: var(--tp-theme-primary);
}

/*----------------------------------------*/
/*  2.7 instagram
/*----------------------------------------*/
.tp-instagram-wrap {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  row-gap: 10px;
  column-gap: 10px;
}
.tp-instagram-link a {
  position: relative;
  display: block;
}
.tp-instagram-link a i {
  position: absolute;
  font-size: 18px;
  text-align: center;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  transition: all 0.4s ease;
}
.tp-instagram-link a::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--tp-theme-primary);
  opacity: 0.902;
  transform: scale(0);
  transition: all 0.4s ease;
}
.tp-instagram-link a:hover i {
  opacity: 1;
  transform: rotate(-90deg);
  color: var(--tp-common-white);
  line-height: 0;
}
.tp-instagram-link a:hover::before {
  transform: scale(1);
}
.tp-instagram-link img {
  width: 100%;
}
.tp-instagram-link-2 {
  width: 100%;
}
.tp-instagram-link-2 img {
  width: 100%;
}
.tp-instagram-title {
  font-size: 16px;
  color: var(--tp-common-black);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 25px;
  display: block;
}
.tp-instagram-mrg-icon a {
  font-size: 24px;
  color: var(--tp-heading-6);
  width: 80px;
  height: 80px;
  border-radius: 40px;
  background-color: var(--tp-common-white);
  display: inline-block;
  line-height: 90px;
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  transform: scale(0);
  transition: all 0.4s linear;
}
.tp-instagram-mrg-icon a:hover {
  color: var(--tp-theme-13);
}
.tp-instagram-mrg-thumb img {
  transition: all 0.4s linear;
}
.tp-instagram-mrg-thumb:hover .tp-instagram-mrg-bg {
  left: 0;
  right: 0;
  opacity: 0;
  transition: all 0.4s linear;
}
.tp-instagram-mrg-thumb:hover img {
  transform: scale(1.2) rotate(-2deg);
}
.tp-instagram-mrg-thumb:hover .tp-instagram-mrg-icon a {
  transform: scale(1);
}
.tp-instagram-mrg-bg {
  background: rgba(255, 255, 255, 0.3);
  opacity: 0.651;
  bottom: 0;
  left: 50%;
  position: absolute;
  right: 51%;
  top: 0;
  opacity: 1;
  pointer-events: none;
  transition: all 0.4s linear;
  z-index: 1;
}
.tp-instagram-mrg-pd {
  height: 180px;
  width: 100%;
  background-color: #f8e7d6;
  display: block;
  position: relative;
  z-index: 1;
  margin-bottom: -180px;
}
.tp-instagram-thumb-2 {
  position: relative;
}
.tp-instagram-thumb-2::before {
  background: rgba(28, 29, 33, 0.2);
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 2;
  -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-thumb-2 a {
  position: absolute;
  bottom: 40%;
  -webkit-transform: transalteY(-50%);
  -moz-transform: transalteY(-50%);
  -ms-transform: transalteY(-50%);
  -o-transform: transalteY(-50%);
  transform: transalteY(-50%);
  left: 0;
  right: 0;
  width: 60px;
  height: 60px;
  font-size: 24px;
  background-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
  text-align: center;
  line-height: 60px;
  border-radius: 50%;
  margin: 0 auto;
  opacity: 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;
  visibility: hidden;
  z-index: 3;
}
.tp-instagram-thumb-2 img {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.7s ease;
  -moz-transition: all 0.7s ease;
  -ms-transition: all 0.7s ease;
  -o-transition: all 0.7s ease;
  transition: all 0.7s ease;
}
.tp-instagram-thumb-2:hover::before {
  opacity: 1;
}
.tp-instagram-thumb-2:hover img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}
.tp-instagram-thumb-2:hover a {
  opacity: 1;
  visibility: visible;
  bottom: 42%;
}

/*----------------------------------------*/
/*  2.15 Tooltip CSS START
/*----------------------------------------*/
.tp-product-tooltip {
  position: absolute;
  top: -15px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
  left: 0;
  font-weight: 500;
  font-size: 12px;
  color: var(--tp-common-white);
  background-color: var(--tp-common-black);
  display: inline-block;
  width: max-content;
  line-height: 1;
  padding: 4px 6px;
  border-radius: 4px;
  visibility: hidden;
  opacity: 0;
  z-index: 1;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  -moz-transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  -ms-transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  -o-transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
}
.tp-product-tooltip::before {
  -webkit-transform: translateY(-65%);
  -moz-transform: translateY(-65%);
  -ms-transform: translateY(-65%);
  -o-transform: translateY(-65%);
  transform: translateY(-65%);
  position: absolute;
  content: "";
  right: 0;
  top: 103%;
  width: 0;
  height: 0;
  border-left: 8px solid var(--tp-common-black);
  border-bottom: 8px solid transparent;
  left: 0;
  margin: 0 auto;
}
.tp-product-tooltip-right {
  left: 100%;
  right: auto;
}
.tp-product-tooltip-right::before {
  left: -4px;
  right: auto;
  border-left: 0;
  border-right: 8px solid var(--tp-common-black);
}

/*----------------------------------------*/
/*  2.9 Modal
/*----------------------------------------*/
.modal .modal-dialog {
  width: 100%;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

.modal-wrapper {
  position: relative;
  z-index: 999999999;
}

.modal {
  overflow-y: scroll;
  overflow-x: hidden;
  --bs-modal-border-width: 0;
  --bs-modal-border-radius: 0;
}

.btn-close {
  position: absolute;
  top: 35px;
  right: 35px;
  z-index: 99999;
  padding: 0;
  margin: 0;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  color: var(--tp-common-black);
  background-color: #fff !important;
  border: 1px solid rgba(25, 25, 26, 0.2);
  opacity: 1;
  transition: 0.3s;
}
.btn-close:hover {
  border-color: var(--tp-common-black) !important;
  transform: rotate(180deg);
}

.btn-close:focus {
  outline: 0;
  box-shadow: none;
  opacity: 1;
}

.modal-body {
  padding: 0;
}

.modal-header {
  padding: 0;
  border-bottom: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.tp-product-modal .modal-dialog {
  width: 1320px;
}
.tp-product-modal .modal-content {
  padding: 50px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-product-modal .modal-content {
    padding: 50px 0;
  }
}
.tp-product-modal .tp-product-modal-close-btn {
  position: absolute;
  right: 30px;
  top: 30px;
  font-size: 30px;
}

.tp-product-nav-link {
  padding: 0;
  margin-bottom: 20px !important;
  border-radius: 0;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-product-nav-link {
    width: 100px;
    margin-right: 10px;
  }
}
@media (max-width: 575px) {
  .tp-product-nav-link {
    width: 80px;
    margin-right: 10px;
  }
}
.tp-product-nav-link img {
  border: 1px solid #D9D9D9;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-product-nav-link img {
    width: 100%;
  }
}
.tp-product-nav-tabs {
  margin-right: 20px;
  border: 0;
}
.tp-product-modal .nav-tabs .nav-link:focus, .tp-product-modal .nav-tabs .nav-link:hover {
  border: 1px solid #525252;
}
.tp-product-modal .nav-tabs .nav-item.show .nav-link, .tp-product-modal .nav-tabs .nav-link.active {
  background: none;
  border: 1px solid #525252;
}

/*----------------------------------------*/
/*  2.8 cursor
/*----------------------------------------*/
body.tp-magic-cursor #magic-cursor {
  display: block;
}

#magic-cursor {
  position: absolute;
  display: none;
  width: 10px;
  height: 10px;
  pointer-events: none;
  z-index: 99999;
  opacity: 0;
}

#ball {
  position: fixed;
  display: flex;
  align-items: center;
  pointer-events: none;
  background-color: var(--tp-common-black);
  border-radius: 50%;
  justify-content: center;
  mix-blend-mode: difference;
  color: transparent;
}

/* Ball view 
============= */
#ball .ball-view {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  padding: 0 5px;
  line-height: 1.3;
  text-align: center;
  transform: scale(0);
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  color: #fff;
}

/* Ball drag 
============= */
#ball .ball-drag {
  position: absolute;
  display: block;
  width: 100%;
  padding: 0 5px;
  font-size: 15px;
  font-weight: 600;
  color: #000;
  line-height: 1.2;
  text-align: center;
  transition: all 0.3s;
}

#ball .ball-drag::before,
#ball .ball-drag::after {
  position: absolute;
  top: 50%;
  margin-top: -5px;
  font-size: 19px;
  color: #FFF;
  height: 10px;
  line-height: 10px;
  font-family: "Font Awesome 6 Pro";
  font-weight: 900;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

#ball .ball-drag::before {
  content: "\f104";
  /* Font Awesome */
  left: 0;
  transform: translate3d(-30px, 0, 0);
  transition: all 0.25s;
}

#ball .ball-drag::after {
  content: "\f105";
  /* Font Awesome */
  right: 0;
  transform: translate3d(30px, 0, 0);
  transition: all 0.25s;
}

#ball.with-blur {
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

/* Ball close 
============== */
#ball.ball-close-enabled {
  opacity: 1 !important;
}

#ball .ball-close {
  position: absolute;
  padding: 0 5px;
  font-size: 14px;
  font-weight: 600;
  color: #000;
  line-height: 1;
  text-align: center;
}

.tp-magnetic-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}

/*----------------------------------------*/
/*  3.1 Header Style 1
/*----------------------------------------*/
.tp-header-bar button:hover span {
  animation: bar-anim 0.8s cubic-bezier(0.44, 1.1, 0.53, 0.99) 1 forwards;
  -webkit-animation: bar-anim 0.8s cubic-bezier(0.44, 1.1, 0.53, 0.99) 1 forwards;
  background-color: var(--tp-theme-primary);
}
.tp-header-bar button:hover span:nth-child(2) {
  animation-delay: 0.1s;
}
.tp-header-bar button:hover span:nth-child(3) {
  animation-delay: 0.2s;
}
.tp-header-bar button span {
  height: 2px;
  width: 28px;
  background-color: #1c1d21;
  display: block;
  margin: 5px 0;
  transition: all 0.4s ease;
}
.tp-header-bar button span:nth-child(3) {
  width: 14px;
}
.tp-header-bar-two button span {
  background-color: var(--tp-common-white);
}
.tp-header-bar-two::before {
  background-color: #bbbfc2 !important;
}
.tp-header-contact a {
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 15px;
  line-height: 1.67;
  color: #1c1d21;
}
.tp-header-contact a:hover {
  color: var(--tp-theme-primary);
}
.tp-header-dvdr {
  position: relative;
  padding-left: 43px;
  line-height: 1;
  display:none;
}
.tp-header-dvdr::before {
  position: absolute;
  content: "";
  height: 23px;
  width: 1px;
  background-color: var(--tp-grey-1);
  left: 23px;
  top: 2px;
}
@media only screen and (max-width: 991px) {
  .tp-header-dvdr {
    display:block;
    padding-left:20px;
  }
  .tp-header-dvdr::before {
    display: none;
  }
}
@media only screen and (max-width: 480px) {
  .tp-header-dvdr {
    padding-left:0;
    text-align:right;
    width:100%;
  }
  .tp-header-bar button span {
    width:42px;
  }
}
.header-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  opacity: 1;
  width: 100%;
  z-index: 999;
  visibility: visible;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0px 1px 3px 0px rgba(18, 20, 32, 0.14);
  -webkit-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
}
.header-sticky::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backdrop-filter: blur(10px);
  z-index: -1;
}
.tp-header-action .action-button{
  font-family: var(--tp-ff-p);
  font-weight: 600;
  font-size: 14px;
  text-transform: capitalize;
  color: var(--tp-common-white);
  background: var(--tp-theme-primary);
  padding: 9px 12px;
  display: inline-block;
  border-radius: 20px;
  z-index:1;
}
.tp-header-action .action-button:before{
  content:"";
  background-color: var(--tp-common-black);
  width:0;
  height:100%;
  position:absolute;
  border-radius: 20px;
  top:0;
  left:0;
  z-index:-1;
  transition: all 0.4s ease;
}
.tp-header-action .action-button:hover:before{
  width:100%;
  transition: all 0.4s ease;
}
.tp-header-action .call-button {
  color: var(--tp-common-white);
  display: flex;
  align-items: center;
  transition: all 0.4s ease;
  border-radius: 100%;
  width: 45px;
  height: 45px;
  background: var(--tp-theme-primary);
  justify-content: center;
}
.tp-header-action .call-button:hover{
  transform:translateX(-5px);
}
.tp-header-action button {
  color: #1C1D21;
}
.tp-header-action button:hover {
  color: var(--tp-theme-primary);
}

/* HEADER CSS */
/*----------------------------------------*/
/*  4.1 menu css
/*----------------------------------------*/
.tp-main-menu nav ul li {
  display: inline-block;
  margin-right: 35px;
  position: relative;
}
.tp-main-menu nav ul li > a {
  padding:25px 0;
  display: inline-block;
  color: #1c1d21;
  font-size: 14px;
  font-weight: 700;
}
.tp-main-menu nav ul li > a:hover {
  color: var(--tp-theme-primary);
}
.tp-main-menu nav ul li > a.active {
  color: var(--tp-theme-primary);
}
.tp-main-menu nav ul li > a i {
  font-weight: 700;
  font-size: 12px;
}
@media only screen and (max-width:1219px){
  .tp-main-menu nav ul li {
    margin-right:20px;
  }
}
@media only screen and (max-width:1040px){
  .tp-main-menu nav ul li {
    margin-right:10px;
  }
}
@media only screen and (max-width:991px){
  .tp-main-menu-mobile {
    position: fixed;
    top: 0;
    right:-350px;
    width:350px;
    bottom: 0;
    box-shadow: 16px -32px 0 rgba(0, 0, 0, 0.8);
    background-color: var(--tp-common-white);
    z-index: 999;
    padding: 50px;
    scrollbar-width: none;
    transition: 0.45s ease-in-out;
    overflow-y: scroll;
  }
  .tp-main-menu-mobile.opened{
    right: 0;
    transition: 0.45s ease-in-out;
  }
  .tp-main-menu-content ul li a {
  padding: 10px;
  border: 1px solid var(--tp-common-black);
  margin-bottom: 20px;
  display: block;
  transition: 0.45s ease-in-out;
  position: relative;
}
.tp-main-menu-content ul li a:before {
  content: "";
  background-color:var(--tp-theme-primary);
  position: absolute;
  left: 0;
  top: 0;
  width:0;
  height: 100%;
  z-index: -1;
  transition: 0.45s ease-in-out;
}
.tp-main-menu-content ul li a:hover{
  color:var(--tp-common-white);
  border-color:var(--tp-theme-primary);
}
.tp-main-menu-content ul li a:hover:before{
  width:100%;
}
}

/*----------------------------------------*/
/*  6.1 Footer Style 1
/*----------------------------------------*/
.tp-footer-area {
  padding:3rem 0;
}
.tp-footer-widget-title {
  font-size: 21px;
  line-height: 1.5;
}
.tp-footer-widget-link ul .email a {
  text-transform: lowercase;
}
.tp-footer-widget-link ul li {
  list-style: none;
}
.tp-footer-widget-link ul li a {
  font-weight: 500;
  line-height: 1.67;
  text-transform: capitalize;
  color: var(--tp-grey-1);
}
.tp-footer-widget-link ul li a:hover {
  color: var(--tp-theme-primary);
}
.tp-footer-widget-contact ul li {
  margin-bottom: 7px;
}
.tp-footer-widget-two {
  padding-left: 70px;
}
@media 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-footer-widget-two {
    padding-left: 0;
  }
}
.tp-footer-widget-3 .tp-footer-widget-title {
  color: var(--tp-common-white);
}
.tp-footer-widget-3 .tp-footer-widget-link ul li a {
  color: #bcbcbc;
}
.tp-footer-widget-3 .tp-footer-widget-link ul li a:hover {
  color: var(--tp-theme-primary);
}
.tp-footer-border ul li a {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-footer-border ul li a:hover {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 100% 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  color: var(--tp-theme-primary);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-footer-input input {
  background: none;
  border: none;
  border-bottom: 1px solid #1c1d21;
  padding: 0 0;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  color: #525252;
  height: 46px;
  padding-right: 20px;
}
.tp-footer-input input:focus {
  border-color: var(--tp-theme-primary);
}
.tp-footer-input input::placeholder {
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
  text-transform: uppercase;
  color: #525252;
}
.tp-footer-input-btn {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.tp-footer-input-btn i {
  font-size: 17px;
  transform: rotate(-35deg) translateY(3px);
}
.tp-footer-check input {
  margin-right: 5px;
  display: none;
}
.tp-footer-check input:checked ~ label::before {
  visibility: visible;
  opacity: 1;
}
.tp-footer-check input:checked ~ label::after {
  background-color: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
}
.tp-footer-check label {
  position: relative;
  padding-left: 22px;
  font-family: var(--tp-ff-p);
  cursor: pointer;
  transition: all 0.3s;
  border-radius: 2px;
  font-size: 15px;
  line-height: 167%;
  color: var(--tp-grey-1);
}
.tp-footer-check label:before {
  position: absolute;
  content: url(../img/login/check.svg);
  top: 3px;
  left: 0;
  width: 15px;
  height: 15px;
  line-height: 15px;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  color: var(--tp-common-white);
  -ms-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
  z-index: 1;
  border-radius: 2px;
}
.tp-footer-check label:after {
  position: absolute;
  content: "";
  top: 4px;
  left: 0;
  width: 15px;
  height: 15px;
  line-height: 15px;
  text-align: center;
  border: 1px solid #2b2a2a;
  transition: all 0.2s ease-out 0s;
  border-radius: 0;
  border-radius: 2px;
}
.tp-footer-social-link a {
  font-weight: 500;
  font-size: 15px;
  text-transform: uppercase;
}
.tp-footer-social-link a:hover {
  color: var(--tp-theme-primary);
}
.tp-footer-mr {
  margin-left: -30px;
}
@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-footer-mr {
    margin-left: 0px;
  }
}
.tp-footer-bottom {
  background-color: #fff7ef;
  padding: 36px 0;
  padding-bottom: 6px;
}
.tp-footer-bottom-2 {
  padding:20px 0;
}
.tp-footer-copyright p {
  line-height: 1.56;
}
.tp-footer-copyright p a {
  color: #1c1d21;
  font-weight: 500;
}
.tp-footer-copyright p a:hover {
  color: var(--tp-theme-primary);
}
.tp-footer-copyright-3 p {
  color: #bcbcbc;
}
.tp-footer-copyright-3 p a {
  color: var(--tp-theme-primary);
}
@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-footer-copyright-social {
    float: left;
  }
}
.tp-footer-copyright-social a {
  font-weight: 500;
  font-size: 15px;
  text-transform: uppercase;
}
.tp-footer-copyright-social a:hover {
  color: var(--tp-theme-primary);
}
.tp-footer-copyright-social span {
  margin: 0 25px;
}
@media (max-width: 575px) {
  .tp-footer-copyright-social span {
    margin: 0 8px;
  }
}
.tp-footer-copyright-social-3 a {
  color: #bcbcbc;
}
.tp-footer-copyright-social-3 span {
  color: #bcbcbc;
}
.tp-footer-title h4 {
  font-size:35px;
  line-height: 120%;
  text-transform: capitalize;
}
@media only screen and (max-width: 1200px), 
only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-title h4 {
    font-size:32px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-title h4 {
    font-size: 30px;
  }
}
.tp-footer-title-3 h4 {
  color: var(--tp-common-white);
}
.tp-footer-input2 {
  width: 100%;
}
.tp-footer-input2 input {
  width: 100%;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 14px;
  color: #525252;
  border: 1px solid #525252;
  padding-right: 50px;
}
.tp-footer-input2 input:focus {
  border-color: var(--tp-theme-primary);
}
.tp-footer-input2 input::placeholder {
  text-transform: uppercase;
  font-weight: 500;
  font-size: 14px;
  color: #525252;
}
.tp-footer-subscribe {
  border: 1px solid #525252;
}
.tp-footer-subscribe button {
  top: 48%;
  transform: translateY(-50%);
  position: absolute;
  right: 38px;
}
.tp-footer-subscribe button:hover {
  color: var(--tp-theme-primary);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-subscribe button {
    top: 65%;
  }
}
.tp-footer-subscribe form {
  display: flex;
  align-items: center;
  position: relative;
  padding: 10px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-subscribe form {
    flex-direction: column;
  }
}
.tp-footer-subscribe form h6 {
  font-size: 21px;
  flex: 0 0 auto;
  margin-bottom: 0;
  padding: 0 70px 0 30px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-subscribe form h6 {
    padding: 10px 0;
  }
}
.tp-footer-subscribe-3 form h6 {
  color: var(--tp-common-white);
}

/*----------------------------------------*/
/* 7.13 hero css
/*----------------------------------------*/
.tp-hero-title {
  font-size: 90px;
}
.tp-hero-title-4 {
  font-size: 80px;
  line-height: 1.1;
  text-transform: uppercase;
  margin-bottom: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-title-4 {
    font-size: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-title-4 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-title-4 {
    font-size:45px;
    margin-bottom:0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-title-4 {
    font-size: 38px;
    margin-bottom: 40px;
  }
  .tp-hero-title-4 br {
    display: none;
  }
}
@media (max-width: 575px) {
  .tp-hero-title-4 {
    font-size: 34px;
    margin-bottom: 40px;
  }
  .tp-hero-title-4 br {
    display: none;
  }
}
.tp-hero-title-4 span {
  color: var(--tp-theme-primary);
}
.tp-hero-title-4 b {
  font-weight: 700;
  font-size: 20px;
  line-height: 1.5;
  display: inline-block;
  margin-bottom: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-title {
    font-size: 75px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-title {
    font-size: 55px;
  }
}
@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-hero-title {
    font-size: 60px;
    letter-spacing: -3px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-title {
    font-size: 55px;
  }
}
@media (max-width: 575px) {
  .tp-hero-title {
    font-size: 34px;
    margin-bottom: 20px;
  }
}
.tp-hero-title span {
  align-items: center;
  display: flex;
}
.tp-hero-title a {
  border: 1px solid #525252;
  border-radius: 50px;
  padding: 25px 25px;
  display: inline-block;
  background-color: var(--tp-common-white);
  font-weight: 400;
  font-size: 40px;
  line-height: 1.2;
  margin-left: 20px;
  margin-bottom: 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-title a {
    padding: 11px 25px;
    font-size: 26px;
  }
}
@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-hero-title a {
    padding: 8px 20px;
    font-size: 20px;
    letter-spacing: 1px;
  }
}
@media (max-width: 575px) {
  .tp-hero-title a {
    padding: 5px 11px;
    font-size: 16px;
  }
}
.tp-hero-ptb {
  padding-top: 305px;
  padding-bottom: 225px;
}
@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) {
  .tp-hero-ptb {
    padding-top: 240px;
    padding-bottom: 150px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-ptb {
    padding-top: 200px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-ptb {
    padding-top: 200px;
    padding-bottom: 150px;
  }
}
@media (max-width: 575px) {
  .tp-hero-ptb {
    padding-top: 148px;
    padding-bottom: 94px;
  }
}
.tp-hero-link {
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 12px;
  line-height: 2.08;
  color: #1c1d21;
  padding-left: 116px;
  position: relative;
  overflow: hidden;
  text-transform: uppercase;
}
@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-hero-link {
    padding-left: 0;
  }
}
.tp-hero-link:hover {
  color: var(--tp-theme-primary);
}
.tp-hero-link i {
  font-size: 18px;
  font-weight: 800;
}
.tp-hero-link::before {
  position: absolute;
  content: "";
  width: 100px;
  height: 1px;
  top: 5px;
  left: 0;
  background-color: #1c1d21;
}
@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-hero-link::before {
    display: none;
  }
}
.tp-hero-shape {
  top: 20%;
  position: absolute;
  left: 224px;
  z-index: -1;
}
.tp-hero-shape-2 {
  position: absolute;
  top: 0;
  left: 0;
  bottom: -230px;
  z-index: -1;
}
.tp-hero-shape-3 {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.tp-hero-social {
  position: absolute;
  top: 41%;
  right: 100px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-social {
    right: 30px;
    top: 20%;
  }
}
.tp-hero-social ul li {
  list-style: none;
  display: flex;
  flex-direction: column;
}
.tp-hero-social ul li a {
  font-size: 23px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-social ul li a {
    color: var(--tp-theme-primary);
  }
}
.tp-hero-social ul li a:hover {
  color: var(--tp-theme-primary);
}
.tp-hero-social ul li a:not(:last-child) {
  margin-bottom: 50px;
  position: relative;
}
.tp-hero-social ul li a:not(:last-child)::before {
  position: absolute;
  content: "";
  height: 30px;
  width: 1px;
  top: 33px;
  background-color: var(--tp-grey-1);
  left: 11px;
}
.tp-hero-award {
  top: 10px;
  right: -44px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-award {
    top: -38px;
    right: -121px;
  }
}
.tp-hero-award h3 {
  font-size: 30px;
  line-height: 1.33;
  color: var(--tp-common-white);
}
.tp-hero-award h5 {
  font-size: 14px;
  line-height: 1.5;
  color: var(--tp-common-white);
  text-transform: uppercase;
}
.tp-hero-two-thumb img {
  width: 100%;
  padding-right: 170px;
  border-radius: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-two-thumb img {
    padding-right: 123px;
  }
}
@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-hero-two-thumb img {
    padding-right: 0;
  }
}
.tp-hero-two-thumb-big {
  border: 1.5px solid #5e5b5b;
  border-radius: 338px;
  margin: 20px 30px 0 20px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-two-thumb-big {
    margin: 20px 0 0 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-two-thumb-big {
    margin-right: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-two-thumb-big {
    margin: 0;
  }
}
.tp-hero-two-thumb-big img {
  width: 100%;
  padding: 24px 0;
  border-radius: 43%;
}
.tp-hero-two-link a {
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--tp-common-white);
  display: flex;
  align-items: center;
  transition: all 0.4s ease;
  border-radius: 62px;
  width: 125px;
  height: 125px;
  background: var(--tp-theme-primary);
  justify-content: center;
  position: relative;
}
.tp-hero-two-link-4 {
  margin-left: -10px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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-hero-two-link-4 {
    margin-left: 0;
  }
}
.tp-hero-two-link span {
  margin-left: 8px;
}
.tp-hero-two-para {
  color: var(--tp-grey-2);
}
.tp-hero-two-right {
  margin-right: -182px;
  margin-left: 160px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-two-right {
    margin-left: 45px;
    margin-right: -38px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-two-right {
    margin-left: 0;
    margin-right: 0;
  }
}
@media (max-width: 575px) {
  .tp-hero-two-right {
    margin-left: 0;
    margin-right: 0;
  }
}
.tp-hero-two-right-thumb img {
  width: 250px;
  border-radius: 130px;
}
.tp-hero-two-exp {
  bottom: 308px;
  transform: rotate(-90deg);
  left: -34px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-two-exp {
    left: -84px;
  }
}
.tp-hero-two-exp h4 {
  font-size: 20px;
  line-height: 1.5;
  color: var(--tp-common-white);
  text-transform: uppercase;
}
.tp-hero-two-exp img {
  transform: rotate(90deg);
  position: absolute;
  bottom: -22px;
  left: -100px;
}
.tp-hero-two-title {
  position: absolute;
  bottom: 160px;
  left: 200px;
}
@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-hero-two-title {
    position: inherit;
  }
}
.tp-hero-two-title h2 {
  font-size: 120px;
  line-height: 100%;
  color: var(--tp-common-white);
  text-transform: uppercase;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-two-title h2 {
    font-size: 90px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-two-title h2 {
    font-size: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-two-title h2 {
    font-size: 60px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-two-title h2 {
    font-size: 50px;
  }
}
.tp-hero-two-social {
  position: absolute;
  transform: rotate(-90deg);
  top: 49%;
  left: -106px;
  z-index: 2;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-two-social {
    left: -156px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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-hero-two-social {
    display: none;
  }
}
.tp-hero-two-social-link {
  position: relative;
  padding: 0 70px;
  display: inline-block;
}
.tp-hero-two-social-link::before {
  position: absolute;
  content: "";
  width: 60px;
  height: 1px;
  background-color: var(--tp-grey-2);
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}
.tp-hero-two-social-link::after {
  position: absolute;
  content: "";
  width: 60px;
  height: 1px;
  background-color: var(--tp-grey-2);
  top: 50%;
  transform: translateY(-50%);
  right: 0;
}
.tp-hero-two-social-link a {
  font-weight: 700;
  font-size: 14px;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--tp-grey-2);
}
.tp-hero-two-social-link a:hover {
  color: var(--tp-theme-primary);
}
.tp-hero-two-social-link span {
  font-weight: 700;
  color: var(--tp-grey-2);
  margin: 0 15px;
}
.tp-hero-three-subtitle {
  font-size: 14px;
  line-height: 1;
  text-transform: uppercase;
  color: var(--tp-grey-1);
  font-family: var(--tp-ff-heading);
  margin-top: 0px;
  font-weight: 700;
}
.tp-hero-three-subtitle div {
  display: block;
  overflow: hidden;
}
.tp-hero-three-subtitle div span {
  position: relative;
  display: block;
  opacity: 0;
  transform: translateY(200px);
  -webkit-transform: translateY(200px);
  transition: 1s;
  display: flex;
  align-items: center;
}
.tp-hero-three-subtitle b {
  font-size: 30px;
  text-transform: uppercase;
  color: var(--tp-common-white);
  border-radius: 25px;
  display: inline-block;
  background: var(--tp-theme-primary);
  padding: 11px 22px 9px 22px;
  line-height: 1;
  margin-left: 7px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-three-subtitle b {
    font-size: 20px;
  }
}
.tp-hero-three-title {
  font-size: 120px;
  line-height: 1;
  text-transform: uppercase;
  font-family: var(--tp-ff-heading);
  color: #1c1d21;
  margin-top: 0px;
  font-weight: 700;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-three-title {
    font-size: 90px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-three-title {
    font-size: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-three-title {
    font-size: 70px;
  }
}
@media (max-width: 575px) {
  .tp-hero-three-title {
    font-size: 60px;
  }
}
.tp-hero-three-title div {
  display: inline-block;
  overflow: hidden;
  margin-top: -27px;
}
.tp-hero-three-title div span {
  position: relative;
  display: inline-block;
  opacity: 0;
  transform: translateY(200px);
  -webkit-transform: translateY(200px);
  transition: 1s;
}
.tp-hero-three-spacing {
  padding-top: 300px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-three-spacing {
    padding-top: 230px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-three-spacing {
    padding-top: 200px;
  }
}
.tp-hero-three-social a {
  color: var(--tp-grey-1);
}
.tp-hero-three-social span {
  color: var(--tp-grey-1);
}
.tp-hero-three-btn {
  background: none;
  border: 1px solid #525252;
  color: var(--tp-common-black);
}
.tp-hero-three-btn:hover {
  color: var(--tp-common-black);
}
.tp-hero-button-wrapper a {
  opacity: 0;
  overflow: hidden;
  transform: translateY(200px);
  -webkit-transform: translateY(200px);
  transition: 1s;
}
.swiper-pagination {
  position:static;
  padding:1rem;
}
.swiper-pagination-bullet{
  opacity:1;
  background:var(--tp-common-black);
}
.swiper-pagination-bullet-active {
  background:var(--tp-theme-primary);
}
.tp-hero-slider .swiper-slide-active .tp-hero-three-subtitle div span {
  opacity: 1;
  transform: translateY(0px);
  -webkit-transform: translateY(0px);
}
.tp-hero-slider .swiper-slide-active div span {
  opacity: 1;
  transform: translateY(0px);
  -webkit-transform: translateY(0px);
}
.tp-hero-slider .swiper-slide-active .tp-hero-button-wrapper a {
  opacity: 1;
  transform: translateY(0px);
  -webkit-transform: translateY(0px);
}
.tp-hero-slider #showcase-slider-holder {
  width: 100%;
  height: 940px;
  position: absolute;
  overflow: hidden;
  opacity: 1;
  z-index: 2;
}
@media 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-hero-slider #showcase-slider-holder {
    height: 750px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-slider #showcase-slider-holder {
    height: 650px;
  }
}
.tp-hero-slider #canvas-slider {
  width: 100%;
  height: 100%;
  position: relative;
  top: 0;
  right: 0;
  overflow: hidden;
  -webkit-transition: width 0.5s ease-in-out 0;
  transition: width 0.5s ease-in-out 0s;
  z-index: 1;
}
.tp-hero-slider #canvas-slider .slider-img {
  position: absolute;
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-color: #222;
  visibility: hidden;
  top: 0;
  left: 0;
  z-index: 0;
  opacity: 0;
  -webkit-transform: scale(1.01);
  transform: scale(1.01);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.tp-hero-slider .parallax-slider-active .swiper-slide {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 940px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-slider .parallax-slider-active .swiper-slide {
    height: 750px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-slider .parallax-slider-active .swiper-slide {
    height: 650px;
  }
}
.tp-hero-slider .tp-showcase-arrow-box {
  position: absolute;
  top: 60%;
  right: 100px;
  z-index: 2;
  transform: translateY(-55%);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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-hero-slider .tp-showcase-arrow-box {
    right: 25px;
  }
}
@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-hero-slider .tp-showcase-arrow-box {
    top: inherit;
    bottom: 0;
    display: flex;
    left: 0;
    right: 0;
    justify-content: center;
  }
}
@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-hero-slider .tp-showcase-arrow-box {
    bottom: -30px;
  }
}
.tp-hero-slider .tp-showcase-arrow-box button {
  display: block;
  margin-bottom: 15px;
  height: 60px;
  width: 60px;
  font-size: 20px;
  transform: translateY(-50%);
  border-radius: 50%;
  border: 1px solid var(--tp-grey-1);
  color: var(--tp-grey-1);
  z-index: 2;
}
@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-hero-slider .tp-showcase-arrow-box button {
    margin-bottom: 0;
    margin: 0 10px;
  }
}
.tp-hero-slider .tp-showcase-arrow-box button:hover {
  background: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
}
@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-hero-overlay {
    background-color: #ffffff3b;
    position: absolute;
    width: 100%;
    height: 100%;
  }
}
.tp-hero-apparments {
  background: var(--tp-common-white);
  display: inline-block;
  padding: 10px 45px 10px 10px;
  border-radius: 50px;
}
.tp-hero-apparments img {
  border-radius: 50%;
  margin-right: 15px;
}
.tp-hero-apparments-content h6 {
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 0;
  text-transform: capitalize;
}
.tp-hero-apparments-content span {
  font-size: 14px;
  line-height: 1.7;
  text-transform: capitalize;
  color: var(--tp-grey-1);
}
.tp-hero-spacing-4 {
  padding-top: 470px;
  padding-bottom: 100px;
}
@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-hero-spacing-4 {
    padding-top: 270px;
  }
}
.tp-hero-text-slider-single {
  background: var(--tp-common-black);
  font-weight: 700;
  font-size: 36px;
  line-height: 50;
  text-transform: uppercase;
  color: var(--tp-common-white);
  padding: 11px 0;
  width: 973px;
}
@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-hero-text-slider-single {
    font-size: 20px;
  }
}
.tp-hero-text-slider-single-2 {
  background: var(--tp-common-white);
  color: var(--tp-common-black);
}
.tp-hero-text-slider-content p {
  margin-bottom: 0;
}
.tp-hero-text-slider-wrap {
  position: absolute;
  top: 0;
  right: -222px;
  transform: rotate(45deg);
}
@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-hero-text-slider-wrap {
    right: -380px;
  }
}
.tp-hero-text-slide-active .swiper-slide {
  width: auto;
}
.tp-hero-four-spacing {
  padding-top: 120px;
  padding-bottom: 105px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), 
only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-four-spacing {
    padding-top: 160px;
    padding-bottom: 135px;
  }
}
@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-hero-four-spacing {
    padding-bottom:58px;
  }
}
.tp-hero-border {
  border-bottom: 1px solid #fff;
}

.slide-transtion {
  -webkit-transition-timing-function: linear;
  transition-timing-function: linear;
}

.tp-hero-five-bg {
  padding-top: 350px;
  padding-bottom: 240px;
  overflow: hidden;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-five-bg {
    padding-top: 250px;
    padding-bottom: 150px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-five-bg {
    padding-top: 200px;
    padding-bottom: 140px;
  }
}
@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-hero-five-bg {
    padding-top: 170px;
    padding-bottom: 140px;
  }
}
.tp-hero-five-thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: opacity 2500ms ease-in, -webkit-transform 10000ms ease;
  transition: opacity 2500ms ease-in, -webkit-transform 10000ms ease;
  transition: transform 10000ms ease, opacity 2500ms ease-in;
  transition: transform 10000ms ease, opacity 2500ms ease-in, -webkit-transform 10000ms ease;
}
.tp-hero-five-title {
  font-size: 120px;
  line-height: 1;
  text-transform: uppercase;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-five-title {
    font-size: 108px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-five-title {
    font-size: 77px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-five-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .tp-hero-five-title {
    font-size: 38px;
  }
}
.tp-hero-five-arrow-box button {
  width: 70px;
  height: 70px;
  line-height: 72px;
  text-align: center;
  top: 50%;
  z-index: 99;
  left: 100px;
  position: absolute;
  transform: translateY(-50%);
  font-size: 30px;
  color: var(--tp-common-black);
  background: var(--tp-common-white);
  border-radius: 50%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-five-arrow-box button {
    left: 15px;
  }
}
@media (max-width: 575px) {
  .tp-hero-five-arrow-box button {
    width: 50px;
    height: 50px;
    line-height: 52px;
  }
}
.tp-hero-five-arrow-box button:hover {
  color: rgba(245, 245, 245, 0.7);
  background: var(--tp-theme-primary);
}
@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-hero-five-arrow-box button {
    top: auto;
    transform: translateY(0);
    bottom: 50px;
    right: 120px;
  }
}
.tp-hero-five-arrow-box button.tp-hero5-prev {
  left: auto;
  right: 100px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-five-arrow-box button.tp-hero5-prev {
    right: 15px;
  }
}
.tp-hero-five-title-box {
  opacity: 0;
  transform: translateY(-150px);
}
.tp-hero-five-btn-box {
  opacity: 0;
  transform: translateY(150px);
}
.tp-hero-five-active .swiper-slide.swiper-slide-active .tp-hero-five-thumb {
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
.tp-hero-five-active .swiper-slide.swiper-slide-active .tp-hero-five-title-box {
  opacity: 1;
  transform: translatey(0px);
  transition: all 2500ms ease;
}
.tp-hero-five-active .swiper-slide.swiper-slide-active .tp-hero-five-btn-box {
  opacity: 1;
  transform: translatey(0px);
  transition: all 2500ms ease;
}
/*----------------------------------------*/
/* 7.1 about css
/*----------------------------------------*/
.tp-about-link {
  font-weight: 700;
  font-size: 12px;
  line-height: 2.08;
  text-transform: uppercase;
  color: #1c1d21;
  font-family: var(--tp-ff-common);
}
.tp-about-link:hover {
  color: var(--tp-theme-primary);
}
.tp-about-link i {
  font-size: 18px;
  font-weight: 800;
}
.tp-about-content-wrap {
  margin: 0;
}
@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-about-content-wrap {
    margin-bottom: 60px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-content-wrapper {
    margin: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-content-wrapper {
    margin-bottom: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-content-wrapper-2 {
    margin-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-content-wrapper-2 {
    margin-top: 0;
  }
}
.tp-about-shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-title-wrapper-2 {
    margin-top: 0;
  }
}
.tp-about-title-para {
  margin-right: 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-title-para {
    margin-right: 0;
  }
}
.tp-about-title-para-2 {
  margin-right: 50px;
}
@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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-title-para-2 {
    margin-right: 0;
  }
}
.tp-about-transparent {
  padding-right: 52px;
  margin-top: -165px;
  z-index: -1;
  position: relative;
}
@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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-transparent {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-transparent {
    padding-right: 0;
  }
}
.tp-about-transparent-bg {
  position: absolute;
  top: -1px;
  right: 52px;
  width: inherit;
}
.tp-about-two-thumb img {
  padding-left: 58px;
  width: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-two-thumb img {
    padding-left: 0;
    padding-bottom: 30px;
  }
}
.tp-about-two-more {
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  color: var(--tp-common-black);
}
.tp-about-two-more:hover {
  color: var(--tp-theme-primary);
}
.tp-about-drem-title {
  font-size: 50px;
  line-height: 1.2;
  text-transform: capitalize;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-drem-title {
    font-size: 40px;
    padding-top:50px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-drem-title {
    font-size: 33px;
  }
}
@media (max-width: 575px) {
  .tp-about-drem-title {
    font-size: 30px;
  }
}
.tp-about-drem-title-2 {
  font-size: 30px;
}
.tp-about-drem-content p {
  font-weight: 400;
  line-height: 1.5;
  margin-right: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-drem-content p {
    margin-right: 0;
  }
}
@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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-drem-content {
    margin-top: 0;
  }
}
.tp-about-progress-thumb {
  position: absolute;
  height: 100%;
  margin-left: -300px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-progress-thumb {
    margin-left: -388px;
  }
}
@media 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-about-progress-thumb {
    position: inherit;
    margin-left: 0;
  }
}
.tp-about-progress-thumb img {
  width: 100%;
}
.tp-about-progress-title {
  font-family: var(--tp-ff-p);
  font-weight: 500;
  font-size: 14px;
  margin-bottom: 12px;
  text-transform: uppercase;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-progress-content {
    margin-right: 0;
  }
}
.tp-about-progress-inner {
  background: #d9d9d9;
  width: 100%;
  height: 5px;
  position: relative;
}
.tp-about-progress-bar {
  overflow: visible;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 5px;
  text-align: center;
  white-space: nowrap;
  background-color: var(--tp-theme-primary);
  transition: 0.6s ease;
  position: relative;
}
.tp-about-progress-bar::before {
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 8.1px 5.5px 0 5.5px;
  border-color: var(--tp-theme-primary) transparent transparent transparent;
  transform: rotate(-180deg);
  content: "";
  position: absolute;
  right: 12px;
  top: -8px;
  margin: auto;
}
.tp-about-progress-counter {
  font-family: var(--tp-ff-p);
  margin-top: -29px;
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  position: absolute;
  top: 0;
  right: 0;
}
.tp-about-list-five ul li {
  list-style: none;
  display: flex;
  margin-bottom: 10px;
}
.tp-about-list-five ul li span {
  color: var(--tp-theme-primary);
  margin-right: 8px;
}
.tp-about-list-five ul li h6 {
  font-size: 16px;
  line-height: 2;
  text-transform: capitalize;
  margin-bottom: 0;
}
@media (max-width: 575px) {
  .tp-about-btn-1 {
    margin-bottom: 20px;
  }
}
@media (max-width: 575px) {
  .tp-about-btn-wrap {
    flex-direction: column;
    align-items: self-start !important;
  }
}
.tp-about-thumb.height-1 {
  width: 100%;
  height: 537px;
}
@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-about-thumb.height-1 {
    height: auto;
  }
}
.tp-about-thumb.height-2 {
  width: 100%;
  height: 786px;
}
@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-about-thumb.height-2 {
    height: auto;
  }
}
@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-about-thumb-wrap {
    margin-right: 0;
  }
}

.img-cover {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  object-fit: cover;
}

/*----------------------------------------*/
/* 7.25 testimonial css
/*----------------------------------------*/
.tp-testimonial-content {
  font-size: 30px;
  line-height: 1.5;
}
@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) {
  .tp-testimonial-content {
    font-size: 20px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-testimonial-content {
    font-size: 22px;
  }
}
.tp-testimonial-content-wrap {
  margin-left: 60px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-testimonial-content-wrap {
    margin-left: 0;
  }
}
.tp-testimonial-author span {
  font-weight: 500;
  font-size: 15px;
  line-height: 1.67;
  text-transform: uppercase;
  margin-bottom: 10px;
  display: inline-block;
}
.tp-testimonial-author h6 {
  font-size: 20px;
  line-height: 1.5;
  text-transform: capitalize;
}
.tp-testimonial-navigate {
  position: absolute;
  top: 50%;
  right: -60px;
  transform: translateY(-50%);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-testimonial-navigate {
    top: 0;
    right: 0;
    flex-direction: row-reverse;
    display: flex;
    transform: translateY(0);
  }
}
.tp-testimonial-navigate div {
  width: 60px;
  height: 60px;
  display: block;
  border: 1px solid #D9D9D9;
  border-radius: 50%;
  text-align: center;
  line-height: 60px;
  transition: all 0.3s ease;
  margin-bottom: 15px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-testimonial-navigate div {
    margin-left: 20px;
  }
}
.tp-testimonial-navigate div:hover {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  border: 1px solid var(--tp-common-black);
}
.tp-testimonial-five-thumb {
  margin-right: -30px;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 1700px) and (max-width: 1800px), only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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-testimonial-five-thumb {
    margin-right: 0;
  }
}
@media only screen and (min-width: 1700px) and (max-width: 1800px), only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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-testimonial-five-thumb img {
    object-fit: cover;
  }
}
.tp-testimonial-five-content p {
  font-weight: 400;
  font-size: 22px;
  line-height: 1.6;
  color: var(--tp-common-black);
}
@media only screen and (min-width: 1700px) and (max-width: 1800px), only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-testimonial-five-content p br {
    display: none;
  }
}
.tp-testimonial-five-content-wrap {
  padding: 150px 350px 150px 170px;
}
@media only screen and (min-width: 1700px) and (max-width: 1800px), only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-testimonial-five-content-wrap {
    padding: 150px 100px 150px 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-testimonial-five-content-wrap {
    padding: 100px 100px 100px 100px;
  }
}
@media 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-testimonial-five-content-wrap {
    padding: 100px 30px 100px 50px;
  }
}
@media (max-width: 575px) {
  .tp-testimonial-five-content-wrap {
    padding: 100px 15px 100px 15px;
  }
}
.tp-testimonial-five-name h6 {
  font-size: 20px;
  margin-bottom: 4px;
}
.tp-testimonial-five-pagination span {
  height: 10px;
  width: 10px;
  background: var(--tp-common-black);
  opacity: 1;
  position: relative;
  margin: 0px 10px;
  display: inline-block;
}
.tp-testimonial-five-pagination span::before {
  position: absolute;
  content: "";
  width: 30px;
  height: 30px;
  border: 1px solid var(--tp-theme-primary);
  border-radius: 50%;
  top: -11px;
  right: -11px;
  transform: scale(0);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.tp-testimonial-five-pagination .swiper-pagination-bullet-active {
  background: var(--tp-theme-primary);
  border: 1px solid var(--tp-theme-primary);
}
.tp-testimonial-five-pagination .swiper-pagination-bullet-active::before {
  transform: scale(1);
}
@media (max-width: 575px) {
  .tp-testimonial-five-author img {
    width: 60px;
  }
}

/*----------------------------------------*/
/*  7.9 cta css
/*----------------------------------------*/
@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-cta-btn {
    float: left;
  }
}
.tp-cta-btn-2 .tp-btn {
  border: 1.5px solid #525252;
  background: none;
  color: var(--tp-common-black);
}
@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-cta-btn-wrap {
    text-align: left;
  }
}
@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-cta-para {
    margin-top: 20px;
    display: inline-block;
  }
}
.tp-cta-subtitle {
  font-weight: 700;
  display: inline-block;
  font-size: 14px;
  line-height: 1.7;
  text-transform: capitalize;
  color: var(--tp-gray-1);
  font-family: var(--tp-ff-common);
}
.tp-cta-subtitle-4 {
  color: var(--tp-common-white);
  margin-bottom: 0;
  font-size: 24px;
}
@media only screen and (max-width:576px) {
  .tp-cta-subtitle-4 {
    font-size:20px;
  }
}
.tp-cta-title-2 {
  line-height: 1.1;
}
@media 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-cta-title-2 {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .tp-cta-title-2 {
    font-size: 35px;
  }
}
.tp-cta-title-4 {
  font-size: 90px;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-cta-title-4 {
    font-size: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-cta-title-4 {
    font-size: 65px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-cta-title-4 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-cta-title-4 {
    font-size:30px;
  }
}
.tp-cta-contact-content {
  padding-top: 100px;
  padding-left: 84px;
}
@media 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-cta-contact-content {
    padding-left: 30px;
  }
}
@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-cta-contact-content {
    padding-bottom: 100px;
  }
}
.tp-cta-btn-4 {
  width: 108px;
  height: 108px;
  display: inline-block;
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
  text-align: center;
  line-height: 108px;
  border-radius: 50%;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-cta-btn-4 {
    width: 80px;
    height: 80px;
    line-height: 80px;
  }
}
.tp-cta-btn-4:hover {
  color: var(--tp-common-white);
}
.tp-cta-border-4 {
  height: 1px;
  width: 100%;
  display: block;
  background: var(--tp-common-white);
  margin-bottom: 0;
}

@media 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-product-details-action-item-wrapper {
    flex-direction: column;
    align-items: flex-start !important;
  }
}
/*----------------------------------------*/
/*  7.8 contact css
/*----------------------------------------*/
.tp-contact-content h4 {
  font-size: 18px;
  text-transform: capitalize;
}
.tp-contact-content a {
  font-size: 18px;
  line-height: 1.5;
  display: block;
  margin-bottom: 10px;
}
.tp-contact-content a:hover {
  color: var(--tp-theme-primary);
}
.tp-contact-map-box {
  line-height: 0;
}
.tp-contact-map-box iframe {
  height: 650px;
  width: 100%;
  filter: saturate(0);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-contact-map-box iframe {
    height: 450px;
  }
}

.tp-contact-lucation {
  border: 1px solid #d9d9d9;
  padding-bottom: 30px;
  margin: 0px -1px 0 0px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-contact-lucation {
    border: none;
  }
}

.tp-contact-wrap .row [class*=col-]:nth-child(2n+1) .tp-contact-lucation {
  padding-right: 50px;
  border-left: 1px solid transparent;
  border-top: 1px solid transparent;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-contact-wrap .row [class*=col-]:nth-child(2n+1) .tp-contact-lucation {
    padding-right: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-contact-wrap .row [class*=col-]:nth-child(2n+1) .tp-contact-lucation {
    padding-right: 0;
  }
}
.tp-contact-wrap .row [class*=col-]:nth-child(2n) .tp-contact-lucation {
  padding-left: 50px;
  border-right: 1px solid transparent;
  border-top: 1px solid transparent;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-contact-wrap .row [class*=col-]:nth-child(2n) .tp-contact-lucation {
    padding-left: 15px;
    padding-top: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-contact-wrap .row [class*=col-]:nth-child(2n) .tp-contact-lucation {
    padding-left: 0;
  }
}
.tp-contact-wrap .row [class*=col-]:nth-child(3) .tp-contact-lucation {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-contact-wrap .row [class*=col-]:nth-child(3) .tp-contact-lucation {
    padding-top: 0;
  }
}
.tp-contact-wrap .row [class*=col-]:nth-child(3) .not-space {
  margin-bottom: 0;
}
.tp-contact-wrap .row [class*=col-]:last-child .tp-contact-lucation {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}
.tp-contact-wrap .row [class*=col-]:last-child .not-space {
  margin-bottom: 0;
}

/*----------------------------------------*/
/* 7.20 service css
/*----------------------------------------*/
.tp-service-wrapper:hover .tp-service-icon {
  color: var(--tp-theme-primary);
}
.tp-service-wrapper:hover .tp-service-link {
  color: var(--tp-theme-primary);
}
.tp-service-2-title-wrapper h2 {
  font-size: 50px;
  text-transform: capitalize;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-service-2-title-wrapper h2 {
    font-size: 45px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-service-2-title-wrapper h2 {
    font-size: 35px;
  }
}
.tp-service-title {
  font-size: 24px;
  line-height: 1.42;
}
.tp-service-title a {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-service-title a:hover {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 100% 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  color: var(--tp-theme-primary);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-service-link {
  color: #BCBCBC;
}
.tp-service-icon {
  color: var(--tp-common-black);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-service-details-title {
  font-size: 30px;
  line-height: 1.3;
}
.tp-service-details-faq-para {
  padding: 0;
  margin-top: 20px;
}
.tp-service-details-faq-para p {
  margin-bottom: 0;
}
.tp-service-details-accordion .accordion {
  --bs-accordion-border-width: 0;
  --bs-accordion-btn-icon: none;
  --bs-accordion-btn-active-icon: none;
}
.tp-service-faq-btn {
  background: none;
  padding: 0;
  border-radius: 0;
  font-weight: 700;
  font-size: 14px;
  line-height: 2;
  color: var(--tp-common-black);
  transition: all 0.4s ease;
  z-index: 1;
}
.tp-service-faq-btn:not(.collapsed) .accordion-btn {
  background: var(--tp-theme-primary);
  z-index: -1;
}
.tp-service-faq-btn:not(.collapsed) .accordion-btn::before {
  transform: translateX(-50%) rotate(90deg);
  background: var(--tp-common-white);
}
.tp-service-faq-btn:not(.collapsed) .accordion-btn::after {
  background: var(--tp-common-white);
}
.tp-service-faq-btn .accordion-btn {
  position: absolute;
  top: 50%;
  right: -63px;
  transform: translateY(-50%);
  display: inline-block;
  width: 50px;
  height: 50px;
  background: #f3f3f3;
}
.tp-service-faq-btn .accordion-btn:not(.collapsed)::after {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.tp-service-faq-btn .accordion-btn::before {
  position: absolute;
  content: "";
  width: 2px;
  height: 18px;
  left: 50%;
  top: 14px;
  background-color: var(--tp-common-black);
  opacity: 0.5;
  transform: translateX(-50%);
  border-radius: 2px;
  transition: all 0.4s ease;
  z-index: 2;
}
.tp-service-faq-btn .accordion-btn::after {
  position: absolute;
  content: "";
  width: 18px;
  height: 2px;
  left: 16px;
  top: 43%;
  transform: translateY(-50%);
  background-color: var(--tp-common-black);
  opacity: 0.5;
  border-radius: 2px;
  transition: all 0.4s ease;
  z-index: 2;
}
.tp-service-faq-btn:focus {
  box-shadow: none;
  border: none;
}
.tp-service-faq-btn.accordion-button:not(.collapsed) {
  color: var(--tp-common-black);
  background: none;
  box-shadow: none;
}
.tp-service-faq-btn:last-of-type .accordion-button.collapsed {
  border-radius: inherit !important;
}
.tp-service-faq-list {
  border: 1px solid #d9d9d9;
  width: 100%;
  border-radius: inherit !important;
  padding: 18px 70px 18px 25px;
}
.tp-service-faq-list:not(:first-of-type) {
  border-top: 1px solid #d9d9d9;
}
.tp-service-five-transparent {
  margin-top: -134px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-service-five-transparent {
    margin-top: -80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-service-five-transparent {
    margin-top: -30px;
  }
}
.tp-service-five-item {
  box-shadow: 0 2px 60px 0 rgba(27, 16, 57, 0.06);
  background: var(--tp-common-white);
  padding: 50px 50px 60px 50px;
  -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;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .tp-service-five-item {
    padding: 25px;
  }
}
.tp-service-five-item:hover {
  background: var(--tp-common-black);
}
.tp-service-five-item:hover .tp-service-five-title {
  color: var(--tp-common-white);
}
.tp-service-five-item:hover .tp-service-five-icon span {
  background: var(--tp-common-white);
  color: var(--tp-common-black);
}
.tp-service-five-item:hover .tp-service-five-btn a {
  color: var(--tp-common-white);
}
.tp-service-five-item:hover .tp-service-five-content p {
  color: var(--tp-grey-2);
}
.tp-service-five-item-active {
  background: var(--tp-common-black);
}
.tp-service-five-item-active .tp-service-five-title {
  color: var(--tp-common-white);
}
.tp-service-five-item-active .tp-service-five-icon span {
  background: var(--tp-common-white);
  color: var(--tp-common-black);
}
.tp-service-five-item-active .tp-service-five-btn a {
  color: var(--tp-common-white);
}
.tp-service-five-item-active .tp-service-five-content p {
  color: var(--tp-grey-2);
}
.tp-service-five-title {
  line-height: 1.4;
  -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-service-five-link {
  align-items: end;
}
.tp-service-five-icon span {
  width: 80px;
  height: 80px;
  background-color: var(--tp-common-black);
  display: inline-block;
  text-align: center;
  line-height: 80px;
  color: var(--tp-common-white);
  -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;
}

/*----------------------------------------*/
/* 7.26 video css
/*----------------------------------------*/
.tp-video-title {
  line-height: 1.17;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-video-title {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-video-title {
    font-size: 45px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-video-title {
    font-size: 37px;
  }
}
.tp-video-title span {
  color: var(--tp-theme-primary);
}
.tp-video-play-2 {
  width: 100%;
  object-fit: cover;
  height: 610px;
  filter: drop-shadow(0 0 30.5px rgba(3, 5, 45, 0.08));
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-video-play-2 {
    height: 310px;
  }
}
.tp-video-play-4 {
  background: #fff0e0;
  padding: 190px 0;
}
@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-video-play-4 {
    padding: 115px 0;
  }
}
.tp-video-play-5 {
  width: 140px;
  height: 140px;
  line-height: 140px;
  border-radius: 0;
  border: 1px solid var(--tp-common-white);
  background: none;
  position: relative;
  display: inline-block;
}
.tp-video-play-5::before {
  position: absolute;
  content: "";
  width: 100%;
  animation: pulse2 0.8s ease-out infinite;
  height: 100%;
  border: 1px solid var(--tp-common-white);
  left: 0;
  top: 0;
}
.tp-video-play-5 i {
  color: var(--tp-common-white);
  font-size: 20px;
}
.tp-video-play-title {
  font-size: 30px;
  line-height: 1.3;
  text-transform: capitalize;
}
.tp-video-space-4 {
  margin-right: 290px !important;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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-video-space-4 {
    margin-right: 0 !important;
  }
}
.tp-video-wrap {
  line-height: 0;
  position: relative;
  background-position: center;
  background-size: cover;
  margin: 0 auto;
  height: 850px;
  width: calc(100% - 30px);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-video-wrap {
    height: 700px;
    margin-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-video-wrap {
    margin-bottom: 100px;
    height: 600px;
  }
}
@media (max-width: 575px) {
  .tp-video-wrap {
    margin: 0;
    margin-bottom: 40px;
    height: 500px;
    width: 100%;
  }
}
.tp-video-wrap-2 {
  background-position: top center;
  background-size: cover;
  object-fit: cover;
  width: 1320px;
  height: 890px;
  margin: 0 auto;
  overflow: hidden;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-video-wrap-2 {
    height: 700px;
  }
}
@media (max-width: 575px) {
  .tp-video-wrap-2 {
    height: 500px;
  }
}
.tp-video-wrap-2 video {
  height: 100%;
  width: 100%;
  margin: 0 auto;
  background-position: center center;
  background-size: cover;
  object-fit: cover;
}
.tp-video-wrap .play-video {
  height: 100%;
  width: 100%;
  object-fit: cover;
  background-position: center;
  background-size: cover;
  margin: 0 auto;
}
.tp-video-trans-text {
  margin: 0;
  font-size: 120px;
  line-height: 1;
  text-transform: uppercase;
  color: #edd8c1;
  bottom: -49px;
  left: -37px;
  margin-bottom: 0;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-video-trans-text {
    font-size: 80px;
    bottom: -34px;
  }
}
.tp-video-spacing-5 {
  padding-top: 230px;
  padding-bottom: 240px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-video-spacing-5 {
    padding-top: 130px;
    padding-bottom: 140px;
  }
}

/*----------------------------------------*/
/*  7.23 subscribe css
/*----------------------------------------*/
.tp-subscribe-area {
  background: #f7f7f7;
  padding-top: 85px;
  padding-bottom: 40px;
}
.tp-subscribe-title h3 {
  font-size: 30px;
  line-height: 1.33;
}
.tp-subscribe-btn {
  top: 50%;
  right: 0;
  color: var(--tp-grey-1);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.tp-subscribe-btn .tp-arrow-angle svg {
  width: 13px;
  height: 13px;
}
.tp-subscribe-btn:hover {
  color: var(--tp-theme-primary);
}
.tp-subscribe-input input {
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-grey-1);
  border: none;
  background: no-repeat;
  border-bottom: 1px solid var(--tp-common-black);
  padding: 0;
  height: 50px;
  padding-right: 30px;
}
.tp-subscribe-input input:focus {
  border-bottom: 1px solid var(--tp-theme-primary);
}
.tp-subscribe-input input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-grey-1);
}
.tp-subscribe-input input::-moz-placeholder {
  /* Firefox 19+ */
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-grey-1);
}
.tp-subscribe-input input:-moz-placeholder {
  /* Firefox 4-18 */
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-grey-1);
}
.tp-subscribe-input input:-ms-input-placeholder {
  /* IE 10+  Edge*/
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-grey-1);
}
.tp-subscribe-input input::placeholder {
  /* MODERN BROWSER */
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--tp-grey-1);
}
.tp-subscribe-checkbox input {
  margin-right: 5px;
  display: none;
}
.tp-subscribe-checkbox input:checked ~ label::before {
  visibility: visible;
  opacity: 1;
}
.tp-subscribe-checkbox input:checked ~ label::after {
  background-color: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
}
.tp-subscribe-checkbox label {
  font-size: 15px;
  line-height: 1.6;
  position: relative;
  color: var(--tp-grey-1);
  padding-left: 22px;
  cursor: pointer;
}
.tp-subscribe-checkbox label:before {
  position: absolute;
  content: url(../img/login/check.svg);
  top: 4px;
  left: 0;
  width: 15px;
  height: 15px;
  line-height: 15px;
  text-align: center;
  visibility: hidden;
  opacity: 1;
  color: var(--tp-common-white);
  -webkit-transition: all 0.2s ease-out 0s;
  -moz-transition: all 0.2s ease-out 0s;
  -ms-transition: all 0.2s ease-out 0s;
  -o-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
  z-index: 1;
}
.tp-subscribe-checkbox label:after {
  position: absolute;
  content: "";
  top: 4px;
  left: 0;
  width: 15px;
  height: 15px;
  line-height: 15px;
  text-align: center;
  border: 1px solid #525252;
  -webkit-transition: all 0.2s ease-out 0s;
  -moz-transition: all 0.2s ease-out 0s;
  -ms-transition: all 0.2s ease-out 0s;
  -o-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
  border-radius: 2px;
}

/*----------------------------------------*/
/* 7.24 team css
/*----------------------------------------*/
.tp-team-title {
  font-size: 21px;
  line-height: 1.5;
}
@media (max-width: 575px) {
  .tp-team-title {
    font-size: 17px;
  }
}
.tp-team-title a {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-team-title a:hover {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 100% 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  color: var(--tp-theme-primary);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-team-content span {
  line-height: 1.56;
}
.tp-team-social {
  position: absolute;
  bottom: 30px;
  left: -1px;
  display: flex;
  align-items: center;
}
.tp-team-social-2 {
  position: absolute;
  right: -30px;
  bottom: -1px;
  background: var(--tp-common-white);
  display: inline-block;
  padding: 12px 15px;
  border-radius: 50px 0px 0px 50px;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  opacity: 0;
  visibility: hidden;
}
.tp-team-social span {
  width: 50px;
  height: 56px;
  display: inline-block;
  font-size: 20px;
  text-align: center;
  line-height: 56px;
  background: var(--tp-common-white);
  border-radius: 0 50px 50px 0;
  margin-right: 10px;
  margin-left: -2px;
  z-index: 1;
}
.tp-team-social span:hover {
  color: var(--tp-theme-primary);
}
.tp-team-social-link {
  margin-left: -80px;
  opacity: 0;
  transition: all 0.4s ease;
}
.tp-team-social-link-2 a {
  font-size: 20px;
  color: var(--tp-gray-1);
  margin: 0 5px;
}
.tp-team-social-link-2 a:hover {
  color: var(--tp-theme-primary);
}
.tp-team-social-link a {
  width: 49px;
  height: 50px;
  display: inline-block;
  background: var(--tp-common-white);
  text-align: center;
  line-height: 50px;
  color: var(--tp-gray-1);
  font-size: 20px;
  border-radius: 50%;
  margin-right: 5px;
}
@media (max-width: 575px) {
  .tp-team-social-link a {
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
}
.tp-team-social-link a:hover {
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
}
.tp-team-item:hover .tp-team-social-link {
  margin-left: 0;
  opacity: 1;
}
.tp-team-item:hover .tp-team-social-2 {
  right: -1px;
  opacity: 1;
  visibility: visible;
}
.tp-team-item:hover img {
  transform: scale(1.2);
}
.tp-team-item img {
  width: 100%;
  transition: 0.7s;
  transform: scale(1);
  object-fit: cover;
}
.tp-team-ml {
  margin-left: 300px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-ml {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-ml {
    margin-right: 30px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-ml {
    flex-direction: column;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-progress-thumb {
    margin-right: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-team-pagenation {
    padding-left: 50px;
  }
}
.tp-team-pagenation div {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  border: 1px solid #d9d9d9;
  color: #525252;
  text-align: center;
  line-height: 60px;
  font-size: 24px;
  transition: all 0.4s ease;
  cursor: pointer;
}
.tp-team-pagenation div:hover {
  background-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
  border-color: var(--tp-theme-primary);
}
.tp-team-btn {
  background: none;
  border: 1.5px solid white;
}
.tp-team-btn:hover {
  border-color: #FED497;
}
.tp-team-banner-subtitle {
  font-size: 14px;
  line-height: 1.71;
  text-transform: capitalize;
  color: var(--tp-common-white);
}
.tp-team-banner-title {
  font-size: 60px;
  line-height: 1.17;
  text-transform: capitalize;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-banner-title {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .tp-team-banner-title {
    font-size: 40px;
  }
}
.tp-team-slider-active {
  margin-left: -100px;
}
.tp-team-right-thumb {
  padding-top: 90px;
  padding-left: 76px;
  padding-bottom: 263px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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) {
  .tp-team-right-thumb {
    padding-left: 22px;
    padding-bottom: 213px;
  }
}
@media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-right-thumb {
    padding-left: 30px;
    padding-bottom: 100px;
  }
}

/*----------------------------------------*/
/* 7.4 brands css
/*----------------------------------------*/
.tp-brands-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 133%;
  text-align: center;
}
.tp-brands-item-two svg {
  color: #7B7974;
  transition: all 0.4s ease;
}
.tp-brands-item-two:hover svg {
  color: var(--tp-common-white);
}
.tp-brands-slider .swiper-slide.swiper-slide-active .tp-brands-item-two svg {
  color: var(--tp-common-white);
}
.tp-brands-top-spacing {
  padding-top: 610px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-brands-top-spacing {
    padding-top: 450px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-brands-top-spacing {
    padding-top: 80px;
  }
}
.tp-slider-text-title h2 {
  font-size: 90px;
  line-height: 1.3;
  text-transform: uppercase;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-slider-text-title h2 {
    font-size: 70px;
  }
}
@media (max-width: 575px) {
  .tp-slider-text-title h2 {
    font-size: 40px;
  }
}
.tp-slider-text-title h2 span {
  background: #ff824d;
  width: 40px;
  height: 40px;
  display: inline-block;
  border-radius: 50%;
}
.tp-slider-shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 100px;
  height: 100%;
  z-index: 99;
}
.tp-slider-shape-2 {
  position: absolute;
  top: 0;
  right: -1px;
  width: 100px;
  height: 100%;
  z-index: 99;
}

/*----------------------------------------*/
/*  7.14 portfolio css
/*----------------------------------------*/
@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-portfolio-content {
    margin-left: 0;
  }
}
@media 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-portfolio-content {
    margin-top: 0;
  }
}
.tp-portfolio-content span {
  display: inline-block;
}
.tp-portfolio-wrapper-2 img {
  transition: 0.9s;
}
.tp-portfolio-wrapper-2:hover img {
  -webkit-transform: scale(1.1) rotate(-2deg);
  -moz-transform: scale(1.1) rotate(-2deg);
  -ms-transform: scale(1.1) rotate(-2deg);
  -o-transform: scale(1.1) rotate(-2deg);
  transform: scale(1.1) rotate(-2deg);
}
.tp-portfolio-title {
  font-size: 30px;
  line-height: 1.33;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-portfolio-title {
    font-size: 27px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-portfolio-title {
    font-size: 24px;
  }
}
.tp-portfolio-title a {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-portfolio-title a:hover {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 100% 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  color: var(--tp-theme-primary);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-portfolio-btn-title {
  font-size: 21px;
  line-height: 150%;
  text-transform: capitalize;
}
.tp-portfolio-filter-btn {
  text-align: center;
}
.tp-portfolio-filter-btn button {
  font-weight: 700;
  font-size: 15px;
  line-height: 1.6;
  text-transform: uppercase;
  color: var(--tp-grey-1);
  padding: 15px 20px;
  transition: all 0.3s ease;
}
.tp-portfolio-filter-btn button.active {
  color: var(--tp-theme-primary);
  text-decoration: underline;
}
.tp-portfolio-filter-btn button:hover {
  color: var(--tp-theme-primary);
  text-decoration: underline;
}
.tp-portfolio-video-thumb {
  text-align: center;
}
.tp-portfolio-video-content h6 {
  font-size: 14px;
  line-height: 1.7;
  text-transform: uppercase;
  color: var(--tp-common-white);
}
.tp-portfolio-video-title {
  font-size: 50px;
  line-height: 1.2;
  color: var(--tp-common-white);
}
@media (max-width: 575px) {
  .tp-portfolio-video-title {
    font-size: 35px;
  }
  .tp-portfolio-video-title br {
    display: none;
  }
}
.tp-portfolio-video-area {
  padding-top: 225px;
  padding-bottom: 215px;
}
@media (max-width: 575px) {
  .tp-portfolio-video-area {
    padding-top: 150px;
    padding-bottom: 150px;
  }
}
.tp-portfolio-play {
  display: inline-block;
}
.tp-portfolio-play span:nth-child(1) {
  animation-delay: 100ms;
}
.tp-portfolio-play .play-btn svg {
  width: 100px;
  height: 100px;
  background: var(--tp-common-white);
  border-radius: 50%;
}
.tp-portfolio-play .play-btn svg .tp-stroke-solid {
  stroke-dashoffset: 300;
  stroke-dasharray: 150;
  stroke-width: 14px;
  transition: stroke-dashoffset 1s ease, opacity 1s ease;
  color: var(--tp-theme-primary);
}
.tp-portfolio-play .play-btn svg .tp-stroke {
  opacity: 0;
}
.tp-portfolio-play .play-btn svg .tp-stroke-icon {
  transform: translate(-9px, -13px);
  color: #1C1D21;
}
.tp-portfolio-play:hover .tp-stroke-solid {
  stroke-dashoffset: 0 !important;
  stroke-dasharray: 300;
}
.tp-portfolio-details-info ul {
  display: flex;
  border: 1px solid #d9d9d9;
  padding: 24px 30px 10px 30px;
  flex-wrap: wrap;
}
.tp-portfolio-details-info ul li {
  list-style: none;
  flex: 0 0 auto;
  position: relative;
}
.tp-portfolio-details-info ul li:not(:last-child) {
  margin-right: 20px;
  padding-right: 20px;
}
.tp-portfolio-details-info ul li:not(:last-child)::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 45px;
  background: #c7c4be;
  right: 0;
  top: 5px;
}
@media (max-width: 575px) {
  .tp-portfolio-details-info ul li::before {
    display: none;
  }
}
.tp-portfolio-details-info ul li span {
  font-weight: 500;
  font-size: 14px;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--tp-grey-1);
  margin-bottom: 5px;
  display: inline-block;
}
.tp-portfolio-details-info ul li h4 {
  font-weight: 700;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 20px;
}
/*----------------------------------------*/
/*  7.19 project css
/*----------------------------------------*/
.tp-project-title-wrapper {
  margin-right: 260px;
  padding-bottom: 220px;
}
.tp-project-title-sm {
  font-size: 24px;
  line-height: 1.42;
  position: relative;
  z-index: 2;
}
.tp-project-title-sm a {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.tp-project-title-sm a:hover {
  background-image: linear-gradient(#FF824D, #FF824D), linear-gradient(#FF824D, #FF824D);
  background-size: 0 1px, 100% 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  color: var(--tp-theme-primary);
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media (max-width: 575px) {
  .tp-project-title-sm {
    font-size: 22px;
  }
}
.tp-project-meta h5 {
  font-size: 14px;
  line-height: 1.71;
  text-decoration: underline;
  color: #323232;
}
.tp-project-icon {
  padding-left: 450px;
  position: relative;
  transform: translateY(-24px);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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-project-icon {
    padding-left: 0;
    float: right;
  }
}
@media (max-width: 575px) {
  .tp-project-icon {
    padding-top: 12px;
  }
}
.tp-project-icon::before {
  position: absolute;
  content: "";
  height: 1px;
  width: 450px;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  background-color: #cecac4;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-project-icon::before {
    left: inherit;
    right: 59px;
    width: 648%;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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-project-icon::before {
    display: none;
  }
}
.tp-project-icon a {
  border: 1px solid #cecac4;
  width: 60px;
  height: 60px;
  display: block;
  border-radius: 50%;
  text-align: center;
  color: #1c1d21;
  transition: all 0.4s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tp-project-icon a .tp-arrow-angle svg {
  width: 13px;
  height: 13px;
}
.tp-project-icon a:hover {
  background-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
  border-color: var(--tp-theme-primary);
}
.tp-project-content span {
  line-height: 1.56;
  transform: translateY(-44px);
  display: inline-block;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), 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-project-content span {
    transform: inherit;
    margin-top: 18px;
  }
}
@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-project-content span {
    margin-top: 5px;
  }
}
.tp-project-content-2 {
  padding-left: 370px;
  padding-top: 40px;
}
.tp-project-col-trans {
  transform: translateY(-350px);
}
@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-project-para-4 {
    padding-right: 0;
  }
}
.tp-project-para-4 p {
  color: #94969f;
}
.tp-project-list ul {
  margin-left: 188px;
}
@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-project-list ul {
    margin-left: 0;
  }
}
.tp-project-list ul li {
  list-style: none;
}
.tp-project-list ul li span {
  font-weight: 600;
  font-size: 18px;
  text-transform: capitalize;
  color: var(--tp-common-white);
  padding: 9px 16px;
  border: 1px solid #404248;
  display: inline-block;
  border-radius: 30px;
  margin-bottom: 20px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-project-slider {
    padding: 0;
    padding-bottom: 60px;
  }
}
.tp-project-slider-text .tp-hero-text-slider-single {
  width: 100%;
}
.tp-project-slider-text .tp-hero-text-slider-single h2 {
  font-size: 120px;
  line-height: 1;
  text-transform: uppercase;
  color: #2b2c2f;
}
@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-project-slider-text .tp-hero-text-slider-single h2 {
    font-size: 80px;
  }
}
.tp-project-list-thumb-wrap {
  height: 100%;
  width: 100%;
}
@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-project-list-thumb-wrap {
    height: 300px;
  }
}
.tp-project-list-thumb-1, .tp-project-list-thumb-2, .tp-project-list-thumb-3, .tp-project-list-thumb-4, .tp-project-list-thumb-5, .tp-project-list-thumb-6 {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  visibility: hidden;
  position: absolute;
}
.tp-project-list-wrap {
  padding: 120px 0px;
}
@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-project-list-wrap {
    padding: 0px;
    padding-bottom: 50px;
  }
}
.tp-project-list-item {
  padding-bottom: 21px;
  padding-top: 21px;
  border-bottom: 1px solid var(--tp-border-1);
  position: relative;
  cursor: pointer;
}
@media (max-width: 575px) {
  .tp-project-list-item {
    padding-bottom: 10px;
    padding-top: 10px;
  }
}
.tp-project-list-item h4 {
  font-size: 32px;
  text-transform: capitalize;
  color: var(--tp-grey-2);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  margin-bottom: 0;
}
.tp-project-list-item::after {
  position: absolute;
  content: "";
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  left: 0;
  width: 0%;
  height: 2px;
  background-color: var(--tp-theme-primary);
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-out 0s;
}
.tp-project-list-item:hover::after {
  opacity: 1;
  visibility: visible;
  width: 40px;
  left: 0;
  right: 0;
}
.tp-project-list-item:hover .tp-project-five-title {
  color: var(--tp-common-black);
  margin-left: 50px;
}
.tp-project-list-item.active .tp-project-five-title {
  color: var(--tp-common-black);
  margin-left: 50px;
}
.tp-project-list-item.active::after {
  opacity: 1;
  visibility: visible;
  width: 40px;
  left: 0;
  right: 0;
}
@media (max-width: 575px) {
  .tp-project-list-content-left h4 {
    font-size: 22px;
  }
}
.tp-project-five-shape {
  top: 0;
  right: 0;
  width: 34%;
}

.m-mn {
  margin-top: -1px;
}

#tp-project-thumb.tp-project-list-thumb-1 .tp-project-list-thumb-1 {
  opacity: 1;
  visibility: visible;
}
#tp-project-thumb.tp-project-list-thumb-2 .tp-project-list-thumb-2 {
  opacity: 1;
  visibility: visible;
}
#tp-project-thumb.tp-project-list-thumb-3 .tp-project-list-thumb-3 {
  opacity: 1;
  visibility: visible;
}
#tp-project-thumb.tp-project-list-thumb-4 .tp-project-list-thumb-4 {
  opacity: 1;
  visibility: visible;
}

/*----------------------------------------*/
/*  7.3 banner css
/*----------------------------------------*/
.tp-banner-year span {
  font-family: var(--tp-ff-common);
  font-weight: 700;
  font-size: 30px;
  line-height: 1.3;
  text-transform: uppercase;
  color: var(--tp-theme-primary);
}
.tp-banner-year p {
  font-weight: 700;
  font-size: 15px;
  text-transform: uppercase;
}
.tp-banner-title {
  font-size: 85px;
  line-height: 1.06;
}
@media 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) {
  .tp-banner-title {
    font-size: 72px;
  }
}
@media (max-width: 575px) {
  .tp-banner-title {
    font-size: 50px;
  }
}
.tp-banner-shape-top {
  display: inline-block;
}
.tp-banner-shape-bottom {
  float: right;
  margin-right: -32px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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-banner-shape-bottom {
    margin-right: 0;
  }
}
.tp-banner-shape-main {
  top: 50px;
  right: 175px;
  z-index: -1;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), 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-banner-shape-main {
    right: 0;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-banner-shape-main {
    width: 50%;
  }
}
@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-banner-shape-main {
    width: 100%;
    top: 0;
  }
}
#message {
  height: 150px;
}
.contact-info-content h2,
.contact-content h2 {
  font-size: 25px;
}
.contact-info-items .content  h3 {
  font-size: 16px;
}
.contact-info-items .content h6 {
  font-size: 12px;
  font-weight: normal;
}
.contact-cta .tp-cta-btn-4 {
  width: 32px;
  height: 32px;
  line-height: 32px;
}
@media only screen and (max-width:1100px) {
  .tp-process-title {
    font-size: 20px;
  } 
}
.tp-footer-social-icon a {
  padding: 0 0 0 20px;
}
.tp-footer-social-icon a:first-child{
  padding-left:0;
}
.section-caption {
  font-size: 16px;
  font-weight: normal;
}
.alt-features-title {
  margin: 15px 0 15px 0;
  font-size: 16px;
}
.alt-features-item {
  border-left: 1px solid var(--tp-grey-2);
  padding-left: 30px;
}
@media only screen and (max-width:767px){
.alt-features-item {
  border-left:none;
  padding-left: 0;
} 
}
.accordion-button:focus {
  z-index: 3;
  border-color: transparent;
  outline: 0;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}
.accordion-button:not(.collapsed) {
  color:var(--tp-common-black);
  background-color: transparent;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}
.team-desc .name {
  font-weight: bold;
}
.srvc-image img {
  height: 250px;
  object-fit: cover;
}
@media only screen and (max-width:767px){
  .srvc-row2 .srvc-image,
  .srvc-row4 .srvc-image {
    order: 1;
  }
  .srvc-row2 .srvc-details,
  .srvc-row4 .srvc-details {
    order: 2;
  }
}
.modal {
  display: none;
  position: fixed;
  z-index: 999;
  padding-top: 50px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.8);
}
.modal-content {
  margin: auto;
  display: block;
  max-width: 90%;
  max-height: 80%;
}
.close {
  position: absolute;
  top: 20px;
  right: 35px;
  color: #fff;
  font-size: 40px;
  font-weight: bold;
  cursor: pointer;
}
.gallery-sec img {
  width: 500px;
  height: 270px;
  object-fit: cover;
}