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

    Template Name: Teach House
    Author: Theme_Dox
    Support: basictheme400@gmail.com
    Description: Teach House - Building People, Building Systems
    Version: 1.0

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

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

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

	-----------------
    02. COMPONENTS css
	-----------------
		2.1 animetion
		2.2 bg-stylees
		2.3 backtotop
		2.4 breadcrumb
		2.5 buttons 
		2.6 nice select
		2.7 offcanvas
		2.8 pagenation
		2.9 preloader
		2.10 Section Title

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

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


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

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

	---------------------------------
	07. PAGES CSS
	---------------------------------
		7.1 about css
		7.2 award css
		7.3 brands css
		7.4 business css
		7.5 chose css
		7.6 contact css
		7.7 counter
		7.8 cta css
		7.9 error css start
		7.10 expreance css
		7.11 faq css
		7.12 hero css
		7.13 history css
		7.14 map css
		7.15 panel css
		7.16 portfolio css
		7.17 pricing css
		7.18 service css
		7.19 subscribe css
		7.20 team-details css
		7.21 team css
		7.22 testimonial css
		7.23 video css
		7.24 work css

**********************************************/
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=Manrope:wght@200..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
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;
}

.td-all-font-roboto *:not(i) {
  font-family: var(--td-ff-roboto);
}

/* transform */
.td-portfolio-5-content, .td-portfolio-5-thumb img, .td-portfolio-5-thumb span, .td-pulse-border::after, .td-pulse-border::before, .td-service-details-accordion-item .accordion-btn, .td-service-details-accordion-item .accordion-btn::after, .td-service-details-accordion-item .accordion-btn::before {
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

:root {
  /**
  @font family declaration
  */
  --td-ff-manrope: 'Manrope', sans-serif;
  --td-ff-poppins: 'Poppins', sans-serif;
  --td-ff-inter: 'Inter', sans-serif;
  --td-ff-fontawesome: "Font Awesome 6 Pro";
  /**
  @color declaration
  */
  --td-common-white: #fff;
  --td-common-bg: #4B4F58;
  --td-common-line: #e6e6e6;
  --td-grey-1: #f5f9ff;
  --td-grey-2: #666;
  --td-grey-3: #8b9aa4;
  --td-grey-4: #999;
  --td-theme-primary: #2FC1FF;
  /**
  @theme surfaces — these are what the dark theme swaps.
  --td-common-white stays pure white because 126 rules use it for white TEXT
  on dark panels; only page/card BACKGROUNDS are routed through --td-surface.
  */
  --td-page: #fff;
  --td-surface: #fff;
  --td-surface-2: var(--td-grey-1);
  --td-ink: #20282d;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-family: var(--td-ff-manrope);
  font-size: 16px;
  font-weight: normal;
  color: var(--td-ink);
  background: var(--td-page);
  line-height: 1.6;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--td-ink);
  font-weight: 800;
  font-family: var(--td-ff-manrope);
  line-height: 1.12;
}

h1 {
  font-size: 80px;
}

h2 {
  font-size: 50px;
}

h3 {
  font-size: 30px;
}

h4 {
  font-size: 24px;
}

h5 {
  font-size: 20px;
}

h6 {
  font-size: 16px;
}

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

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

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

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

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

.border-bottom {
  border-bottom: 1px solid #d3d3d3 !important;
}

.border-bottom-2 {
  border-bottom: 1px solid var(--td-theme-primary);
}

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

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

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

*::-moz-selection {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
  text-shadow: none;
}

::-moz-selection {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
  text-shadow: none;
}

::selection {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
  text-shadow: none;
}

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

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

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

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

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

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

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

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

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

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

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

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

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

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

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

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

/* gutter for x axis */
.td-gx-10 {
  --bs-gutter-x: 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-10 {
    --bs-gutter-x: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-10 {
    --bs-gutter-x: 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-10 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .td-gx-10 {
    --bs-gutter-x: 10px;
  }
}
.td-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 */
.td-gx-15 {
  --bs-gutter-x: 15px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-15 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-15 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-15 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .td-gx-15 {
    --bs-gutter-x: 10px;
  }
}
.td-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);
}

.td-gx-20 {
  --bs-gutter-x: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-20 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-20 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-20 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .td-gx-20 {
    --bs-gutter-x: 10px;
  }
}
.td-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 */
.td-gx-30 {
  --bs-gutter-x: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-30 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-30 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-30 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .td-gx-30 {
    --bs-gutter-x: 10px;
  }
}
.td-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 */
.td-gx-40 {
  --bs-gutter-x: 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-40 {
    --bs-gutter-x: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-40 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-40 {
    --bs-gutter-x: 30px;
  }
}
@media (max-width: 575px) {
  .td-gx-40 {
    --bs-gutter-x: 15px;
  }
}
.td-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 */
.td-gx-50 {
  --bs-gutter-x: 50px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-gx-50 {
    --bs-gutter-x: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-50 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-50 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-50 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .td-gx-50 {
    --bs-gutter-x: 10px;
  }
}
.td-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 */
.td-gx-60 {
  --bs-gutter-x: 60px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-gx-60 {
    --bs-gutter-x: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-gx-60 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-gx-60 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-gx-60 {
    --bs-gutter-x: 15px;
  }
}
@media (max-width: 575px) {
  .td-gx-60 {
    --bs-gutter-x: 10px;
  }
}
.td-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);
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.back-to-top-btn {
  display: inline-block;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  background: var(--td-theme-primary);
  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
  color: var(--td-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 
/*----------------------------------------*/
.td-btn {
  padding: 19px 24px;
  background: var(--td-theme-primary);
  display: inline-block;
  color: var(--td-common-white);
  font-weight: 600;
  font-size: 14px;
  line-height: 100%;
}
.td-btn:hover {
  color: var(--td-common-white);
}
.td-btn-2 {
  background: var(--td-surface);
  color: var(--td-theme-primary);
}
.td-btn-2:hover {
  color: var(--td-theme-primary);
}
.td-btn-3 {
  background: none;
  border: 1px solid var(--td-common-line);
  color: var(--td-theme-primary);
}
.td-btn-3:hover {
  color: var(--td-theme-primary);
}
.td-btn-4 {
  font-size: 12px;
  line-height: 100%;
  color: var(--td-theme-primary);
  border: 1px solid var(--td-common-line);
  border-radius: 30px;
  padding: 3px 10px;
}
.td-btn-5 {
  border-radius: 14px;
  padding: 12px 20px;
}
.td-btn-6 {
  border-radius: 14px;
}
.td-btn-7 {
  color: var(--td-theme-primary);
  background: var(--td-surface);
  padding: 13px 20px;
}
.td-btn-7:hover {
  color: var(--td-theme-primary);
  background: var(--td-surface);
}

.td-arrow-angle {
  --qode-hover-move-x: 110%;
  --qode-hover-move-y: 100%;
}

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

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

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

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

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

.td-left-right:hover .td-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;
}

.tp-panel-content-inner {
  padding: 30px 30px 30px 30px;
}

/*----------------------------------------*/
/*  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);
  }
}
@-webkit-keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}
@-moz-keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}
@-ms-keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}
@keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}
@-webkit-keyframes tpleftright {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}
@-moz-keyframes tpleftright {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}
@-ms-keyframes tpleftright {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}
@keyframes tpleftright {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}
.tpleftright {
  -webkit-animation: tpleftright 1s infinite alternate;
  animation: tpleftright 1s infinite alternate;
}

@-webkit-keyframes tpswing {
  0% {
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  100% {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -ms-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    transform: rotate(-6deg);
  }
}
@-moz-keyframes tpswing {
  0% {
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  100% {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -ms-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    transform: rotate(-6deg);
  }
}
@-ms-keyframes tpswing {
  0% {
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  100% {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -ms-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    transform: rotate(-6deg);
  }
}
@keyframes tpswing {
  0% {
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  100% {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -ms-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    transform: rotate(-6deg);
  }
}
.tpswing {
  -moz-animation: tpswing 1s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tpswing 1s ease-in-out 1s forwards infinite alternate;
  animation: tpswing 1s ease-in-out 1s forwards infinite alternate;
  transform-origin: left center;
}

@-webkit-keyframes tpupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}
@-moz-keyframes tpupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}
@-ms-keyframes tpupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}
@keyframes tpupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}
.tpupdown {
  -moz-animation: tpupdown 1s ease-in-out 1s forwards infinite alternate;
  -webkit-animation: tpupdown 1s ease-in-out 1s forwards infinite alternate;
  animation: tpupdown 1s ease-in-out 1s forwards infinite alternate;
}

@-webkit-keyframes tdshake {
  10% {
    transform: translateY(-10px);
  }
  50% {
    transform: skew(15deg);
  }
  80% {
    transform: rotate(10deg);
  }
  100% {
    transform: translate(0);
  }
}
@-moz-keyframes tdshake {
  10% {
    transform: translateY(-10px);
  }
  50% {
    transform: skew(15deg);
  }
  80% {
    transform: rotate(10deg);
  }
  100% {
    transform: translate(0);
  }
}
@-ms-keyframes tdshake {
  10% {
    transform: translateY(-10px);
  }
  50% {
    transform: skew(15deg);
  }
  80% {
    transform: rotate(10deg);
  }
  100% {
    transform: translate(0);
  }
}
@keyframes tdshake {
  10% {
    transform: translateY(-10px);
  }
  50% {
    transform: skew(15deg);
  }
  80% {
    transform: rotate(10deg);
  }
  100% {
    transform: translate(0);
  }
}
@-webkit-keyframes hero-text {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@-moz-keyframes hero-text {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@-ms-keyframes hero-text {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes hero-text {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes treeMove {
  0% {
    -webkit-transform: rotate(0deg) translateX(0);
    transform: rotate(0deg) translateX(0);
  }
  75% {
    -webkit-transform: rotate(5deg) translateX(10px);
    transform: rotate(5deg) translateX(10px);
  }
  50% {
    -webkit-transform: rotate(10deg) translateX(20px);
    transform: rotate(10deg) translateX(20px);
  }
  100% {
    -webkit-transform: rotate(0deg) translateX(0);
    transform: rotate(0deg) translateX(0);
  }
}
.tree-move {
  animation-name: treeMove;
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

/*----------------------------------------*/
/*  2.9 preloader
/*----------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--td-surface);
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
}

#loader {
  position: relative;
  width: 75px;
  height: 100px;
  background-repeat: no-repeat;
  background-image: linear-gradient(var(--td-ink) 50px, transparent 0), linear-gradient(var(--td-ink) 50px, transparent 0), linear-gradient(var(--td-ink) 50px, transparent 0), linear-gradient(var(--td-ink) 50px, transparent 0), linear-gradient(var(--td-ink) 50px, transparent 0);
  background-size: 8px 100%;
  background-position: 0px 90px, 15px 78px, 30px 66px, 45px 58px, 60px 50px;
  animation: pillerPushUp 4s linear infinite;
}

#loader:after {
  content: "";
  position: absolute;
  bottom: 10px;
  left: 0;
  width: 10px;
  height: 10px;
  background: var(--td-theme-primary);
  border-radius: 50%;
  animation: ballStepUp 4s linear infinite;
}

@keyframes pillerPushUp {
  0%, 40%, 100% {
    background-position: 0px 90px, 15px 78px, 30px 66px, 45px 58px, 60px 50px;
  }
  50%, 90% {
    background-position: 0px 50px, 15px 58px, 30px 66px, 45px 78px, 60px 90px;
  }
}
@keyframes ballStepUp {
  0% {
    transform: translate(0, 0);
  }
  5% {
    transform: translate(8px, -14px);
  }
  10% {
    transform: translate(15px, -10px);
  }
  17% {
    transform: translate(23px, -24px);
  }
  20% {
    transform: translate(30px, -20px);
  }
  27% {
    transform: translate(38px, -34px);
  }
  30% {
    transform: translate(45px, -30px);
  }
  37% {
    transform: translate(53px, -44px);
  }
  40% {
    transform: translate(60px, -40px);
  }
  50% {
    transform: translate(60px, 0);
  }
  57% {
    transform: translate(53px, -14px);
  }
  60% {
    transform: translate(45px, -10px);
  }
  67% {
    transform: translate(37px, -24px);
  }
  70% {
    transform: translate(30px, -20px);
  }
  77% {
    transform: translate(22px, -34px);
  }
  80% {
    transform: translate(15px, -30px);
  }
  87% {
    transform: translate(7px, -44px);
  }
  90% {
    transform: translate(0, -40px);
  }
  100% {
    transform: translate(0, 0);
  }
}
/*----------------------------------------*/
/*  2.2 bg-stylees
/*----------------------------------------*/
.td-grey-bg {
  background: var(--td-surface-2);
}

.td-grey-bg-2 {
  background: #eaf1fb;
}

.td-black-bg {
  background: #223035;
}

.td-black-bg-2 {
  background: #20282d;
}

/*----------------------------------------*/
/*  2.6 nice select
/*----------------------------------------*/
.nice-select {
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.04);
  background: var(--td-surface);
  border: 1px solid var(--td-common-line);
  box-sizing: border-box;
  clear: both;
  cursor: pointer;
  display: block;
  font-size: 15px;
  font-weight: normal;
  line-height: 50px;
  outline: none;
  padding-left: 20px;
  padding-right: 20px;
  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%;
  height: 52px;
  color: var(--td-theme-primary);
}
.nice-select .current {
  font-size: 16px;
}
.nice-select:active, .nice-select.open, .nice-select:focus {
  border-color: var(--td-theme-primary);
}
.nice-select::after {
  position: absolute;
  content: "\f107";
  top: 50%;
  right: 20px;
  font-size: 18px;
  font-family: var(--td-ff-fontawesome);
  color: var(--td-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: var(--td-surface);
  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.7 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;
}

.tdoffcanvas {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  right: -100%;
  bottom: 0;
  box-shadow: 0 16px -32px 0 rgba(0, 0, 0, 0.8);
  background-color: var(--td-surface);
  z-index: 997;
  padding: 50px;
  scrollbar-width: none;
  opacity: 0;
  visibility: hidden;
  transition: 0.45s ease-in-out;
  overflow-y: scroll;
  width: 500px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tdoffcanvas {
    width: 380px;
  }
}
.tdoffcanvas .homemenu {
  margin-bottom: 30px;
}
.tdoffcanvas .homemenu-title {
  color: var(--td-common-white);
}
.tdoffcanvas .td-main-menu-mobile {
  margin-bottom: 30px;
}
.tdoffcanvas.opened {
  opacity: 1;
  visibility: visible;
}
@media (max-width: 575px) {
  .tdoffcanvas {
    width: 100%;
    padding: 40px 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tdoffcanvas {
    width: 400px;
    padding: 40px;
  }
}
.tdoffcanvas.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;
}
.tdoffcanvas-btn {
  padding: 22px 40px;
  background: var(--td-theme-primary);
  display: inline-block;
  font-size: 15px;
  letter-spacing: 0px;
  line-height: 20px;
  color: var(--td-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;
  border: 1px solid transparent;
}
.tdoffcanvas-btn:hover {
  background: var(--td-surface);
  color: var(--td-theme-primary);
  border: 1px solid var(--td-theme-primary);
}
.tdoffcanvas__contact-info {
  margin-bottom: 20px;
}
.tdoffcanvas__contact-info ul li {
  font-size: 16px;
  color: var(--td-common-black);
  margin-bottom: 15px;
  list-style-type: none;
}
.tdoffcanvas__contact-info ul li i {
  width: 16px;
}
@media (max-width: 575px) {
  .tdoffcanvas__contact-info ul li {
    font-size: 14px;
  }
}
.tdoffcanvas__contact-info ul li:last-child {
  margin-bottom: 0;
}
.tdoffcanvas__contact-info ul li a {
  margin-left: 10px;
  transition: 0.3s;
}
.tdoffcanvas__contact-info ul li a:hover {
  color: var(--td-theme-primary);
}
.tdoffcanvas__logo {
  margin-bottom: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tdoffcanvas__logo {
    padding-top: 0;
  }
}
@media (max-width: 575px) {
  .tdoffcanvas__logo {
    padding-top: 0;
  }
}
@media (max-width: 575px) {
  .tdoffcanvas__logo img {
    width: 150px;
  }
}
.tdoffcanvas__close-btn button {
  position: absolute;
  right: 30px;
  top: 37px;
  transition: 0.4s;
  -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 0.3s;
  height: 40px;
  width: 40px;
  line-height: 41px;
  border-radius: 6px;
  border: 1px solid var(--td-theme-primary);
  color: var(--td-theme-primary);
}
.tdoffcanvas__close-btn button:hover {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
  border: 1px solid var(--td-theme-primary);
}
.tdoffcanvas__close-btn button i {
  font-weight: 300;
  font-size: 20px;
  transition: 0.4s;
}
.tdoffcanvas__social {
  margin-top: 30px;
}
.tdoffcanvas__social .social-icon a {
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  border: 1px solid var(--td-theme-primary);
  color: var(--td-theme-primary);
  margin-right: 15px;
  transition: 0.3s;
  display: inline-block;
  border-radius: 50px;
}
@media (max-width: 575px) {
  .tdoffcanvas__social .social-icon a {
    margin-right: 3px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 15px;
  }
}
.tdoffcanvas__social .social-icon a:hover {
  background-color: var(--td-theme-primary);
  color: var(--td-common-white);
}

.td-offcanvas-content p {
  color: var(--td-theme-primary);
  line-height: 1.62;
}

.td-offcanvas-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 10px;
}
.td-offcanvas-gallery .popup-image {
  position: relative;
}
.td-offcanvas-gallery .popup-image::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--td-theme-primary);
  top: 0;
  left: 0;
  opacity: 0.6;
  transform: scale(0);
  -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;
}
.td-offcanvas-gallery .popup-image:hover::after {
  transform: scale(1);
}

/*----------------------------------------*/
/*  2.4 breadcrumb
/*----------------------------------------*/
.td-breadcrumb-spacing {
  padding-top: 270px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-breadcrumb-spacing {
    padding-top: 200px;
  }
}
.td-breadcrumb-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 1.12;
  letter-spacing: -0.02em;
  text-transform: capitalize;
  color: var(--td-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) {
  .td-breadcrumb-title {
    font-size: 60px;
  }
}
.td-breadcrumb-big-text h2 {
  font-weight: 700;
  font-size: 200px;
  margin-bottom: -60px;
  line-height: 1;
  letter-spacing: -0.02em;
  text-align: center;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-common-white);
  -webkit-text-stroke-width: 1px;
  opacity: 0.6;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .td-breadcrumb-big-text h2 {
    font-size: 170px;
    margin-bottom: -40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-breadcrumb-big-text h2 {
    font-size: 150px;
    margin-bottom: -30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-breadcrumb-big-text h2 {
    font-size: 130px;
    margin-bottom: -30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-breadcrumb-big-text h2 {
    font-size: 100px;
    margin-bottom: -20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-breadcrumb-big-text h2 {
    font-size: 70px;
    margin-bottom: -10px;
  }
}
@media (max-width: 575px) {
  .td-breadcrumb-big-text h2 {
    font-size: 46px;
    margin-bottom: -9px;
  }
}
.td-breadcrumb-list {
  border: 2px solid rgba(255, 255, 255, 0.2);
  padding: 3px 16px;
  display: inline-block;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-breadcrumb-list {
    float: left !important;
  }
}
.td-breadcrumb-list span {
  font-weight: 600;
  line-height: 1;
  color: rgba(255, 255, 255, 0.7);
}
.td-breadcrumb-list span.page {
  color: var(--td-common-white);
}
.td-breadcrumb-list span.dvdr {
  margin: 0 10px;
}

.float-right {
  float: right;
}

/*----------------------------------------*/
/*  2.10 Section Title
/*----------------------------------------*/
.td-section-title {
  font-weight: 500;
  font-size: 64px;
  line-height: 1.16;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-section-title {
    font-size: 60px;
  }
}
@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) {
  .td-section-title {
    font-size: 50px;
  }
  .td-section-title br {
    display: none;
  }
}
@media (max-width: 575px) {
  .td-section-title {
    font-size: 40px;
  }
  .td-section-title br {
    display: none;
  }
}
.td-section-title-pre {
  color: var(--td-grey-2);
  display: inline-block;
}

.td-white {
  color: var(--td-common-white);
}

.td-gray {
  color: #bfccd1;
}

/*----------------------------------------*/
/*  2.8 pagenation
/*----------------------------------------*/
.td-pagenation nav ul li {
  list-style: none;
  display: inline-block;
  margin-right: 5px;
}
.td-pagenation nav ul li a {
  height: 44px;
  width: 44px;
  display: inline-block;
  border: 1px solid #e4e4e4;
  text-align: center;
  line-height: 44px;
  font-weight: 700;
  font-size: 14px;
  color: #000;
}
.td-pagenation nav ul li a:hover {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-pagenation nav ul li a.active {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}

/* HEADER CSS */
/*----------------------------------------*/
/*  5.1 Header Style 1
/*----------------------------------------*/
.td-header-sticky {
  position: fixed !important;
  left: 0;
  margin: auto;
  top: 0;
  width: 100%;
  box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
  z-index: 99;
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  -webkit-box-shadow: 0px 4px 10px rgba(3, 4, 28, 0.1);
  box-shadow: 0px 4px 10px rgba(3, 4, 28, 0.1) !important;
  background: var(--td-surface);
}
.td-header-sticky.td-header-sticky-black {
  background: #20282d;
}
.td-header-sticky .border-bottom-2 {
  border-bottom: 0;
}
@media (max-width: 575px) {
  .td-header-sticky .td-header-5-logo {
    margin-left: 25px;
  }
}
@media (max-width: 575px) {
  .td-header-sticky .td-header-5-menubar {
    padding-right: 15px;
  }
}
.td-header-top-menu ul li {
  list-style: none;
  display: inline-block;
  margin-right: 30px;
}
.td-header-top-menu ul li a {
  padding: 10px 0;
  display: inline-block;
}
.td-header-top-social ul li {
  list-style: none;
  display: inline-block;
  position: relative;
}
.td-header-top-social ul li:first-child {
  padding-right: 85px;
}
.td-header-top-social ul li:first-child::before {
  position: absolute;
  content: "";
  height: 1px;
  width: 40px;
  background: #E6E6E6;
  top: 14px;
  right: 18px;
}
.td-header-top-social ul li a {
  font-size: 14px;
  color: var(--td-theme-primary);
}
.td-header-top-social ul li a i {
  opacity: 0.4;
  margin-right: 3px;
  transform: translateY(-1px);
}
.td-header-bottom-2 {
  padding: 7px 25px;
}
.td-header-endeavos p {
  font-size: 14px;
  line-height: 100%;
  color: var(--td-grey-2);
  margin-bottom: 0;
}
.td-header-endeavos p a {
  font-weight: 700;
  color: var(--td-theme-primary);
}
.td-header-lang {
  display: inline-block;
}
.td-header-lang-toggle {
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
}
.td-header-lang-list {
  position: absolute;
  top: 120%;
  right: 0;
  background-color: var(--td-surface);
  z-index: 11;
  padding: 15px 15px;
  font-weight: 700;
  font-size: 14px;
  min-width: 100px;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s ease-out 0s;
  box-shadow: 0px 20px 30px rgba(3, 4, 28, 0.1);
}
.td-header-lang-list li {
  list-style: none;
  cursor: pointer;
  padding: 2px 0px;
}
.td-header-lang-list.td-lang-list-open {
  visibility: visible;
  opacity: 1;
  top: 100%;
}
.td-header-time {
  font-weight: 300;
  font-size: 14px;
}
.td-header-right-border {
  position: relative;
  padding-left: 60px;
}
.td-header-right-border::before {
  position: absolute;
  content: "";
  left: 19px;
  top: 13px;
  background: var(--td-common-line);
  width: 20px;
  height: 1px;
}
.td-header-search-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}
.td-header-input input {
  width: 250px;
  border: none;
  padding-left: 30px;
  font-size: 16px;
  background: none;
  font-weight: 400;
  opacity: 0.8;
}
@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) {
  .td-header-input input {
    width: 100%;
  }
}
.td-header-input input::placeholder {
  font-weight: 400;
  font-size: 16px;
  opacity: 0.8;
}
.td-header-input {
  position: relative;
}
.td-search-results {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  width: 320px;
  max-width: 90vw;
  background: var(--td-surface);
  border: 1px solid var(--td-common-line);
  border-radius: 6px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  z-index: 999;
  overflow: hidden;
}
.td-search-results a {
  display: block;
  padding: 12px 16px;
  font-size: 14px;
  color: var(--td-theme-primary, #20282d);
  border-bottom: 1px solid var(--td-common-line);
  text-decoration: none;
}
.td-search-results a:last-child {
  border-bottom: none;
}
.td-search-results a:hover {
  background: var(--td-grey-1, #f5f9ff);
  color: #2FC1FF;
}
.td-search-no-result {
  padding: 14px 16px;
  font-size: 14px;
  color: var(--td-grey-2, #666);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-header-logo {
    text-align: left !important;
    margin-right: 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) {
  .td-header-mobile-space {
    padding: 20px 0;
  }
}
.td-header-bar button span {
  height: 2px;
  width: 35px;
  background-color: var(--td-theme-primary);
  display: block;
  margin: 5px 0;
  transition: all 0.4s ease;
}
.td-header-bar button span:nth-child(2) {
  width: 30px;
}
.td-header-bar button span:nth-child(3) {
  width: 25px;
}
.td-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;
}
.td-header-bar button:hover span:nth-child(2) {
  animation-delay: 0.1s;
}
.td-header-bar button:hover span:nth-child(3) {
  animation-delay: 0.2s;
}
.td-header-bar-white button span {
  background: var(--td-surface);
}
.td-header-2-space {
  padding: 0px 25px;
}
@media (max-width: 575px) {
  .td-header-2-space {
    padding: 0;
  }
}
.td-header-3-content p {
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  color: var(--td-grey-3);
  margin-bottom: 0;
  text-align: center;
  padding: 13px 0px;
}
.td-header-3-content p a {
  color: var(--td-common-white);
}
.td-header-4-top-menu ul li a {
  color: var(--td-common-white);
  opacity: 0.6;
}
.td-header-4-top-menu ul li a:hover {
  opacity: 1;
}
.td-header-4-lang .td-header-lang-toggle {
  color: var(--td-common-white);
}
.td-header-4-time.td-header-right-border::before {
  color: var(--td-common-white);
  opacity: 0.6;
}
.td-header-4-time span {
  color: var(--td-common-white);
  opacity: 0.6;
}
.td-header-4-btn .td-btn-4 {
  border: 1px solid #455459;
  color: var(--td-common-white);
}
.td-header-4-email a {
  color: var(--td-common-white);
  height: 14px;
}
.td-header-4-email a:hover {
  opacity: 0.5;
}
.td-header-4-email a i {
  opacity: 0.5;
  margin-right: 10px;
}
.td-header-5-top {
  padding: 25px 0px 65px 0px;
}
.td-header-5-btn .td-btn {
  padding: 16px 24px;
}
.td-header-5-info-wrap ul {
  display: flex;
}
.td-header-5-info-wrap ul li {
  list-style: none;
}
.td-header-5-info-wrap ul li.borders {
  position: relative;
  margin-right: 30px;
  padding-right: 30px;
}
.td-header-5-info-wrap ul li.borders::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  background: var(--td-common-line);
  top: 0;
  right: 0;
}
.td-header-5-info-wrap ul li a {
  display: flex;
}
.td-header-5-info-wrap ul li a i {
  margin-right: 10px;
  color: var(--td-theme-primary);
  opacity: 0.4;
}
.td-header-5-info-wrap ul li a p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1;
  color: var(--td-theme-primary);
  margin-bottom: 0;
}
.td-header-5-info-wrap ul li a span {
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-2);
}
.td-header-5-menubar {
  padding: 27px 28px 27px 28px;
}
@media (max-width: 575px) {
  .td-header-5-menubar {
    padding-right: 0;
  }
}
@media (max-width: 575px) {
  .td-header-5-logo {
    margin-left: 0;
  }
}
.td-header-5-bottom {
  position: absolute;
  bottom: -40px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-header-5-bottom {
    position: inherit;
    bottom: 0;
  }
}
.td-header-5-bg {
  box-shadow: 0 -30px 60px 0 rgba(0, 0, 0, 0.04);
  background: var(--td-surface);
}
.td-header-5-right {
  display: flex;
  align-items: center;
  justify-content: end;
}
.td-header-5-search form input {
  padding-left: 58px;
  height: 80px;
  background: var(--td-surface-2);
  width: 240px;
}
.td-header-5-search form .td-header-search-btn {
  left: 30px;
}

.td-transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
}

/*----------------------------------------*/
/*  6.1 menu css
/*----------------------------------------*/
.td-main-menu {
  text-align: right;
}
@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) {
  .td-main-menu-01 nav ul li .submenu {
    left: inherit;
    right: 0;
  }
}
.td-main-menu nav ul li {
  list-style: none;
  display: inline-block;
  margin-left: 50px;
  position: relative;
}
@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) {
  .td-main-menu nav ul li {
    margin-left: 30px;
  }
}
.td-main-menu nav ul li:hover > .submenu {
  visibility: visible;
  opacity: 1;
  transform: scaleY(1);
}
@media (min-width: 992px) {
  .td-nav-desktop-nowrap {
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    align-items: center;
  }
}
.td-main-menu nav ul li a {
  font-weight: 600;
  padding: 34px 0;
  display: inline-block;
  text-transform: capitalize;
}
.td-main-menu nav ul li a:hover {
  opacity: 1;
  color: var(--td-ink);
}
.td-main-menu nav ul .submenu {
  text-align: left;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  background: var(--td-surface);
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transform-origin: top center;
  padding: 25px 0 5px;
  background: var(--td-surface);
  transform: scaleY(0);
  box-shadow: 0px 20px 30px rgba(3, 4, 28, 0.1);
  transition: all 0.3s ease-out 0s;
  padding-bottom: 13px;
}
.td-main-menu nav ul .submenu li {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  transform: translateY(-10px);
}
.td-main-menu nav ul .submenu li:hover > a {
  color: var(--td-theme-primary);
  padding-left: 43px;
}
.td-main-menu nav ul .submenu li:hover > a::before {
  width: 12px;
}
.td-main-menu nav ul .submenu li a {
  position: relative;
  z-index: 11;
  padding: 10px 25px;
  padding-bottom: 1px;
  width: 100%;
}
.td-main-menu nav ul .submenu li a::before {
  position: absolute;
  content: "";
  left: 25px;
  top: 61%;
  transform: translateY(-50%);
  transition: all 0.3s ease-out 0s;
  width: 0;
  height: 1px;
  background-color: var(--td-theme-primary);
}
.td-main-menu-2 nav ul li a {
  position: relative;
  padding: 28px 0;
}
.td-main-menu-2 nav ul li a::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 0;
  background: var(--td-theme-primary);
  bottom: 30px;
  left: 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;
}
.td-main-menu-2 nav ul li a:hover {
  color: var(--td-theme-primary);
  opacity: 1;
}
.td-main-menu-2 nav ul li a:hover::before {
  width: 100%;
}
.td-main-menu-3 {
  text-align: left;
  margin-left: 15px;
}
.td-main-menu-3 nav ul li {
  margin-left: 55px;
}
.td-main-menu-3 nav ul li a {
  position: relative;
  padding: 28px 0;
  color: var(--td-common-white);
  font-weight: 600;
  font-size: 16px;
  padding: 34px 0;
}
.td-main-menu-3 nav ul li a::before {
  position: absolute;
  content: "";
  height: 2px;
  width: 0;
  background: var(--td-common-line);
  bottom: 35px;
  left: 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;
  opacity: 0.6;
}
.td-main-menu-3 nav ul li a:hover {
  color: var(--td-common-white);
  opacity: 1;
}
.td-main-menu-3 nav ul li a:hover::before {
  width: 100%;
}
.td-main-menu-3 nav ul .submenu li a {
  color: var(--td-theme-primary);
}
.td-main-menu-4 {
  margin-right: 75px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-main-menu-4 {
    margin-right: 0;
  }
}
.td-main-menu-4 nav ul li a {
  color: var(--td-common-white);
}
.td-main-menu-4 nav ul li a::before {
  opacity: 0.2;
  background: var(--td-surface);
}
.td-main-menu-4 nav ul li a:hover {
  opacity: 0.6;
  color: var(--td-common-white);
}
.td-main-menu-4 nav ul .submenu li a {
  color: var(--td-theme-primary);
}
.td-main-menu-5 {
  text-align: left;
}
.td-main-menu-5 nav {
  margin-left: 40px;
}
.td-main-menu-5 nav ul li {
  margin-left: 0;
  margin-right: 50px;
}
.td-main-menu-5 nav ul li a {
  padding: 27px 0;
}

/*----------------------------------------*/
/* 6.2 Mobile css
/*----------------------------------------*/
.td-main-menu-mobile .td-submenu {
  display: none;
}
.td-main-menu-mobile .td-megamenu-active {
  display: none;
  overflow: hidden;
}
.td-main-menu-mobile .header-icon {
  display: none;
}
.td-main-menu-mobile ul {
  position: static;
  display: block;
  box-shadow: none;
}
.td-main-menu-mobile ul li {
  list-style: none;
  position: relative;
  width: 100%;
  padding: 0;
}
.td-main-menu-mobile ul li:not(:last-child) a {
  border-top: 1px solid rgba(6, 7, 40, 0.1);
  border-bottom: 1px solid rgba(6, 7, 40, 0.1);
  margin-top: -1px;
}
.td-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn {
  position: absolute;
  right: 0;
  top: 21%;
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
  font-size: 18px;
  color: #7F8387;
  font-family: "Font Awesome 5 Pro";
  transition: all 0.3s ease-in-out;
  z-index: 1;
  width: 30px;
  height: 30px;
  line-height: 22px;
  text-align: center;
  border: 1px solid rgba(66, 63, 63, 0.12);
  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
.td-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn i {
  transition: all 0.3s ease-in-out;
}
.td-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn.dropdown-opened i {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.td-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn:hover {
  background-color: var(--td-theme-primary);
  border-color: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-main-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn:hover i {
  color: var(--td-common-white);
}
.td-main-menu-mobile ul li.has-dropdown > a.expanded {
  color: var(--td-green-2);
}
.td-main-menu-mobile ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened {
  background-color: var(--td-theme-primary);
  border-color: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-main-menu-mobile ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened i {
  color: var(--td-common-white);
}
.td-main-menu-mobile ul li.has-dropdown:hover > a::after {
  color: var(--td-theme-primary);
}
.td-main-menu-mobile ul li:hover {
  color: var(--td-theme-primary);
}
.td-main-menu-mobile ul li:last-child a span {
  border-bottom: 0;
}
.td-main-menu-mobile ul li > a {
  display: block;
  font-size: 16px;
  color: var(--td-common-black);
  position: relative;
  padding: 10px 0;
  padding-right: 20px;
  text-transform: capitalize;
}
.td-main-menu-mobile ul li > a svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.td-main-menu-mobile ul li > a > i {
  display: none;
}
.td-main-menu-mobile ul li > a .menu-text {
  font-size: 16px;
  line-height: 11px;
  border-bottom: 1px solid #EAEBED;
  width: 82%;
  display: inline-block;
  padding: 19px 0 17px;
}
.td-main-menu-mobile ul li img {
  width: 100%;
}
.td-main-menu-mobile ul li ul {
  padding: 0;
}
.td-main-menu-mobile ul li ul li {
  padding: 0;
}
.td-main-menu-mobile ul li ul li a {
  margin-left: auto;
  width: 93%;
  padding: 10px 5%;
  text-shadow: none !important;
  visibility: visible;
  padding-left: 0;
  padding-right: 20px;
}
.td-main-menu-mobile ul li ul li li a {
  width: 88%;
  padding: 10px 7%;
  padding-left: 0;
  padding-right: 20px;
}
.td-main-menu-mobile ul li ul li li li a {
  width: 83%;
  padding: 10px 9%;
  padding-left: 0;
  padding-right: 20px;
}
.td-main-menu-mobile ul li ul li li li li a {
  width: 68%;
  padding: 10px 11%;
  padding-left: 0;
  padding-right: 20px;
}
.td-main-menu-mobile ul li:hover > a {
  color: var(--td-green-2);
}
.td-main-menu-mobile ul li:hover > a::after {
  color: var(--td-green-2);
}
.td-main-menu-mobile ul li:hover > a .dropdown-toggle-btn i {
  color: var(--td-green-2);
}
.td-main-menu-mobile ul li:hover .mega-menu {
  visibility: visible;
  opacity: 1;
  top: 0;
}
.td-main-menu-mobile ul li .mega-menu, .td-main-menu-mobile ul li .submenu {
  position: static;
  width: 100%;
  padding: 0;
  box-shadow: none;
  visibility: visible;
  opacity: 1;
}
.td-main-menu-mobile ul li .mega-menu li, .td-main-menu-mobile ul li .submenu li {
  float: none;
  display: block;
  width: 100%;
  padding: 0;
}
.td-main-menu-mobile ul li .mega-menu li:hover a .dropdown-toggle-btn, .td-main-menu-mobile ul li .submenu li:hover a .dropdown-toggle-btn {
  color: var(--td-theme-1);
}
.td-main-menu-mobile .td-main-menu-content ul li:not(:last-child) .home-menu-title a {
  border-bottom: none;
}
.td-main-menu-mobile * ul, .td-main-menu-mobile * li {
  transition: none !important;
}
.td-main-menu-mobile ul li .td-submenu .homemenu {
  padding: 0px 10px;
  position: relative;
  margin-bottom: 20px;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-thumb {
  position: relative;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-thumb::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  background: rgba(38, 34, 33, 0.7);
  transition: all 0.3s 0s ease-out;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-thumb:hover .homemenu-btn {
  opacity: 1;
  visibility: visible;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-thumb:hover .homemenu-btn .menu-btn.show-1 {
  transform: translateY(0);
}
.td-main-menu-mobile ul li .td-submenu .homemenu-thumb:hover .homemenu-btn .menu-btn.show-2 {
  transform: translateY(0);
}
.td-main-menu-mobile ul li .td-submenu .homemenu-thumb:hover::before {
  opacity: 1;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-title {
  font-size: 16px;
  font-weight: 600;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-title a {
  border: none;
  color: var(--td-common-black);
  font-family: var(--td-ff-p);
}
.td-main-menu-mobile ul li .td-submenu .homemenu-title a:hover {
  color: var(--td-theme-primary);
}
.td-main-menu-mobile ul li .td-submenu .homemenu-btn {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  opacity: 0;
  text-align: center;
  transform: translateY(-50%);
  visibility: hidden;
  transition: all 0.3s 0s ease-out;
}
.td-main-menu-mobile ul li .td-submenu .homemenu-btn .menu-btn {
  font-size: 14px;
  text-transform: uppercase;
  padding: 10px 15px;
  display: inline-block;
  width: 115px;
  background-size: 200% auto;
  overflow: hidden;
  border: none;
}
@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) {
  .td-main-menu-mobile ul li .td-submenu .homemenu-btn .menu-btn {
    width: 129px;
    font-size: 12px;
    padding: 6px 15px;
  }
}

/*----------------------------------------*/
/*  3.2 Postbox css
/*----------------------------------------*/
.td-postbox-wrapper-space {
  padding-right: 70px;
  border-right: 1px solid var(--td-common-line);
  margin-right: 10px;
}
.td-postbox-wrapper-space-2 {
  padding-right: 60px;
}
@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) {
  .td-postbox-wrapper-space-2 {
    padding-right: 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) {
  .td-postbox-wrapper-space {
    padding-right: 0;
    border-right: none;
    margin-right: 0;
  }
}
.td-postbox-title {
  font-weight: 700;
  font-size: 40px;
  line-height: 1.25;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-postbox-title {
    font-size: 34px;
  }
}
@media (max-width: 575px) {
  .td-postbox-title {
    font-size: 30px;
  }
}
.td-postbox-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-postbox-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-postbox-text {
  border-bottom: 1px solid var(--td-common-line);
}
.td-postbox-text p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-postbox-user img {
  width: 30px;
  margin-right: 14px;
}
.td-postbox-user a {
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  color: #ababab;
}
.td-postbox-user a span {
  color: var(--td-theme-primary);
  font-weight: 700;
}
.td-postbox-meta {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.td-postbox-meta-here span {
  font-size: 14px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-postbox-meta-here span:not(:first-child) {
  margin-left: 38px;
}
@media (max-width: 575px) {
  .td-postbox-meta-here span:not(:first-child) {
    margin-left: 0;
  }
}
@media (max-width: 575px) {
  .td-postbox-meta-here span {
    margin-right: 18px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-postbox-meta-here span {
    margin-top: 15px;
    display: inline-block;
  }
}
.td-postbox-meta-here span a:hover i {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-postbox-meta-here span i {
  height: 30px;
  width: 30px;
  border: 1px solid var(--td-common-line);
  text-align: center;
  line-height: 30px;
  margin-right: 10px;
  transition: all 0.4s ease;
  color: var(--td-theme-primary);
}
.td-postbox-badge {
  font-family: var(--td-ff-inter);
  font-weight: 600;
  color: var(--td-theme-primary);
  padding: 7px 18px;
  background: var(--td-surface);
  display: inline-block;
  position: absolute;
  top: 30px;
  z-index: 99;
  right: 20px;
}
@media (max-width: 575px) {
  .td-postbox-badge {
    right: 10px;
    top: 10px;
  }
}
.td-postbox-nav button {
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background-color: transparent;
  color: var(--td-common-white);
  position: absolute;
  top: 50%;
  left: 15px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
  font-size: 18px;
}
.td-postbox-nav button:hover {
  background-color: var(--td-surface);
  border-color: var(--td-common-white);
  color: var(--td-theme-primary);
}
.td-postbox-nav button.td-postbox-slider-button-next {
  right: 15px;
  left: auto;
}
.td-postbox-content-2 p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-postbox-comment-title {
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
}
.td-postbox-comment-title span {
  font-weight: 400;
}
.td-postbox-comment ul li {
  border-top: 1px solid var(--td-common-line);
  list-style: none;
  padding-top: 40px;
}
.td-postbox-comment-name h5 {
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  margin-bottom: 0;
  margin-right: 10px;
}
.td-postbox-comment-name .post-meta {
  font-weight: 400;
  color: var(--td-grey-2);
}
@media (max-width: 575px) {
  .td-postbox-comment-box {
    flex-direction: column;
  }
}
@media (max-width: 575px) {
  .td-postbox-comment-avatar {
    margin-bottom: 10px;
  }
}
.td-postbox-comment .children {
  margin-left: 110px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-postbox-comment .children {
    margin-left: 0;
  }
}
.td-postbox-comment-text p {
  font-size: 14px;
  line-height: 1.71;
  color: var(--td-grey-2);
}
.td-postbox-comment-reply a {
  font-size: 14px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-postbox-comment-reply a i {
  border: 1px solid #e4e4e4;
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  margin-right: 10px;
}
.td-postbox-comment-form-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.3;
}
.td-postbox-comment-form-content {
  border-bottom: 1px solid var(--td-common-line);
  padding-bottom: 10px;
}
@media (max-width: 575px) {
  .td-postbox-comment-form-content {
    flex-direction: column;
  }
}
.td-postbox-comment-form-rating ul li {
  list-style: none;
  display: inline-block;
}
.td-postbox-comment-form-rating ul li span {
  color: #cecece;
  font-size: 14px;
}
.td-postbox-comment-input input {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.14;
  color: var(--td-grey-4);
  background: var(--td-surface-2);
  border: 1px solid #d5dde9;
  height: 54px;
}
.td-postbox-comment-input input:focus {
  background: none;
  border-color: var(--td-theme-primary);
}
.td-postbox-comment-input input::placeholder {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.14;
  color: var(--td-grey-4);
}
.td-postbox-comment-textarea textarea {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.14;
  color: var(--td-grey-4);
  background: var(--td-surface-2);
  border: 1px solid #d5dde9;
  height: 180px;
  resize: none;
}
.td-postbox-comment-textarea textarea:focus {
  background: none;
  border-color: var(--td-theme-primary);
}
.td-postbox-comment-textarea textarea::placeholder {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.14;
  color: var(--td-grey-4);
}

/*----------------------------------------*/
/*  3.1 Blog css
/*----------------------------------------*/
.td-blog-qoute {
  color: var(--td-common-white);
  opacity: 0.3;
  position: absolute;
  top: 20px;
  right: 20px;
}
.td-blog-qoute-2 {
  opacity: 1;
}
.td-blog-qoute-2 svg {
  color: #E6EAEF;
}
.td-blog-qoute-meta {
  color: var(--td-common-white);
  opacity: 0.7;
  display: inline-block;
  margin-bottom: 10px;
  position: relative;
  z-index: 1;
}
.td-blog-qoute-meta-2 {
  color: var(--td-grey-2);
}
.td-blog-qoute-wrap {
  padding: 38px 42px 36px 40px;
}
@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) {
  .td-blog-qoute-wrap {
    padding: 32px 26px 32px 24px;
  }
}
.td-blog-qoute-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 150%;
  color: var(--td-common-white);
  position: relative;
  z-index: 1;
}
.td-blog-qoute-title a {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  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;
}
.td-blog-qoute-title a:hover {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  background-size: 0 1px, 100% 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;
}
.td-blog-qoute-title-2 {
  color: var(--td-theme-primary);
}
.td-blog-qoute-title-2 a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-blog-qoute-title-2 a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-blog-qoute-bg {
  background: var(--td-theme-primary);
}
.td-blog-qoute-bg-2 {
  background: var(--td-surface-2);
}
.td-blog-meta {
  line-height: 150%;
  color: var(--td-grey-2);
  display: inline-block;
}
.td-blog-meta-2 {
  display: inline-block;
}
.td-blog-meta-2 span {
  font-size: 14px;
  color: var(--td-grey-2);
}
.td-blog-meta-2 span.dvdr {
  margin: 0 5px;
  color: #d7d7d7;
}
.td-blog-2-tag {
  color: var(--td-theme-primary) !important;
}
.td-blog-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 150%;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-blog-title {
    margin-bottom: 30px;
  }
}
.td-blog-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-blog-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-blog-title-2 {
  font-size: 28px;
  line-height: 1.36;
}
.td-blog-btn {
  height: 40px;
  width: 40px;
  background-color: var(--td-surface-2);
  display: inline-block;
  border-radius: 50%;
  text-align: center;
  line-height: 38px;
}
.td-blog-btn:hover {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-blog-slider-active {
  margin-right: -350px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-blog-slider-active {
    margin-right: -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) {
  .td-blog-slider-active {
    margin-right: -170px;
  }
}
@media (max-width: 575px) {
  .td-blog-slider-active {
    margin-right: 0;
  }
}
.td-blog-5-qoute-meta span {
  line-height: 1;
  color: var(--td-grey-2);
}
.td-blog-5-qoute-meta span.designation {
  color: var(--td-theme-primary);
}
.td-blog-5-qoute-meta span.dvdr {
  color: #d7d7d7;
  margin: 0px 8px;
}
.td-blog-5-qoute-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  color: var(--td-theme-primary);
}
.td-blog-5-qoute-title-big {
  font-size: 28px;
  line-height: 1.36;
}
.td-blog-5-qoute-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
@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) {
  .td-blog-5-qoute-title a br {
    display: none;
  }
}
.td-blog-5-qoute-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-blog-sidebar-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.2;
  color: var(--td-theme-primary);
  border-bottom: 1px solid var(--td-common-line);
  padding-bottom: 17px;
}
.td-blog-sidebar-input {
  position: relative;
}
.td-blog-sidebar-input input {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.14;
  color: #999;
  background: #f5f5f5;
  border: 1px solid transparent;
  padding-left: 20px;
  padding-right: 60px;
}
.td-blog-sidebar-input input:focus {
  border-color: var(--td-common-line);
  background: none;
}
.td-blog-sidebar-input input::placeholder {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.14;
  color: #999;
}
.td-blog-sidebar-input button {
  width: 54px;
  height: 100%;
  background: var(--td-theme-primary);
  text-align: center;
  line-height: 54px;
  color: var(--td-common-white);
  position: absolute;
  top: 0;
  right: 0;
}
.td-blog-sidebar-widget-content ul li {
  list-style: none;
}
.td-blog-sidebar-widget-content ul li a {
  font-weight: 600;
  font-size: 14px;
  line-height: 2.86;
  color: var(--td-theme-primary);
  display: flex;
  justify-content: space-between;
  padding-left: 30px;
  position: relative;
}
.td-blog-sidebar-widget-content ul li a:hover::before {
  background: var(--td-theme-primary);
}
.td-blog-sidebar-widget-content ul li a::before {
  position: absolute;
  content: "";
  border: 1px solid var(--td-common-line);
  width: 16px;
  height: 16px;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.4s ease;
}
.td-blog-sidebar-widget-content ul li a span {
  color: var(--td-grey-2);
}
.td-blog-sidebar-ads-thumb::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(32, 40, 45, 0) 0%, #20282d 100%);
  bottom: 0;
  left: 0;
}
.td-blog-sidebar-ads-title {
  font-weight: 600;
  font-size: 24px;
  line-height: 1;
  text-align: center;
  color: var(--td-common-white);
  position: absolute;
  bottom: 20px;
  right: 0;
  left: 0;
}
.td-blog-sidebar-ads-transparent {
  font-weight: 700;
  font-size: 98px;
  line-height: 1;
  letter-spacing: -0.02em;
  opacity: 0.2;
  text-align: center;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-common-white);
  -webkit-text-stroke-width: 1px;
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0 auto;
  left: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-blog-sidebar-ads-transparent {
    font-size: 68px;
  }
}
@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) {
  .td-blog-sidebar-wrapper {
    margin-left: 0;
  }
}
.td-blog-post {
  display: flex;
  align-items: center;
}
.td-blog-post-thumb {
  margin-right: 20px;
}
.td-blog-post-title {
  font-weight: 600;
  font-size: 14px;
  line-height: 1.43;
}
.td-blog-post-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-blog-post-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-blog-post-meta {
  margin-bottom: 4px;
}
.td-blog-post-meta span {
  font-weight: 400;
  font-size: 12px;
  line-height: 1;
  text-transform: capitalize;
  color: var(--td-grey-2);
}
.td-blog-post-meta span i {
  color: var(--td-theme-primary);
}

/*----------------------------------------*/
/*  4.1 Footer Style 1
/*----------------------------------------*/
@media (max-width: 575px) {
  .td-footer-widget {
    text-align: left !important;
  }
}
.td-footer-widget-content ul li {
  list-style: none;
}
.td-footer-widget-content ul li a {
  font-weight: 500;
  font-size: 32px;
  line-height: 131%;
  color: var(--td-grey-2);
  margin-bottom: 17px;
  display: inline-block;
}
.td-footer-widget-content ul li a:hover {
  color: var(--td-theme-primary);
}
.td-footer-widget-content-2 ul li {
  list-style: none;
}
.td-footer-widget-content-2 ul li a {
  line-height: 150%;
  color: var(--td-grey-2);
  margin-bottom: 16px;
  display: inline-block;
}
.td-footer-widget-content-2 ul li a:hover {
  color: var(--td-theme-primary);
}
.td-footer-widget-para {
  font-size: 30px;
  line-height: 133%;
  color: var(--td-grey-2);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-widget-para {
    font-size: 26px;
  }
}
.td-footer-widget-title {
  font-weight: 500;
  font-size: 32px;
  line-height: 131%;
  color: var(--td-theme-primary);
}
.td-footer-col {
  position: relative;
}
@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) {
  .td-footer-col::before {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-col {
    padding-bottom: 0;
  }
}
.td-footer-col::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  background: #c2c9d4;
  top: 0;
  right: -22px;
}
.td-footer-col-2 {
  position: relative;
}
@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) {
  .td-footer-col-2::before {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-col-2 {
    padding-bottom: 0;
  }
}
.td-footer-col-2::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  background: #c2c9d4;
  top: 0;
  right: 56px;
}
.td-footer-bottom-border {
  border-top: 1px solid #c2c9d4;
}
@media (max-width: 575px) {
  .td-footer-bottom-social ul {
    margin-bottom: 15px;
  }
}
.td-footer-bottom-social ul li {
  list-style: none;
  display: inline-block;
  margin-right: 12px;
}
.td-footer-bottom-social ul li a {
  font-size: 24px;
  color: var(--td-theme-primary);
}
.td-footer-bottom-social ul li a:hover {
  color: var(--td-grey-2);
}
.td-footer-bottom-social ul li a:hover svg {
  fill: var(--td-grey-2);
}
.td-footer-bottom-social ul li a svg {
  width: 24px;
  fill: var(--td-theme-primary);
}
.td-footer-bottom-copyright p {
  line-height: 150%;
  color: var(--td-grey-2);
  margin-bottom: 0;
}
.td-footer-bottom-copyright a {
  color: var(--td-theme-primary);
  font-weight: 700;
}
.td-footer-bottom-title {
  font-weight: 600;
  font-size: 24px;
  line-height: 133%;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-bottom-location {
    margin-left: 0;
  }
}
.td-footer-bottom-location a {
  line-height: 162%;
  color: var(--td-grey-2);
}
.td-footer-bottom-location span {
  display: block;
  color: var(--td-grey-2);
}
.td-footer-bottom-phone {
  color: var(--td-theme-primary) !important;
}
.td-footer-top-border {
  border-top: 1px solid var(--td-common-line);
}
.td-footer-2-big-title {
  font-weight: 600;
  font-size: 160px;
  line-height: 1;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-theme-primary);
  -webkit-text-stroke-width: 1px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-2-big-title {
    font-size: 100px;
  }
}
@media (max-width: 575px) {
  .td-footer-2-big-title {
    font-size: 72px;
  }
}
.td-footer-2-bg {
  background: linear-gradient(180deg, rgba(245, 249, 255, 0) 0%, #f5f9ff 76.39%);
}
.td-footer-2-form-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.6;
}
.td-footer-2-input input {
  box-shadow: 0 40px 80px 0 rgba(0, 0, 0, 0.1);
  background: var(--td-surface);
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-grey-2);
  height: 50px;
  padding: 10px 70px 10px 20px;
  border: 1px solid #d5deeb;
}
.td-footer-2-input input:focus {
  border: 1px solid var(--td-theme-primary);
}
.td-footer-2-input input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-grey-2);
  opacity: 0.6;
}
.td-footer-2-input input::-moz-placeholder { /* Firefox 19+ */
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-grey-2);
  opacity: 0.6;
}
.td-footer-2-input input:-moz-placeholder { /* Firefox 4-18 */
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-grey-2);
  opacity: 0.6;
}
.td-footer-2-input input:-ms-input-placeholder { /* IE 10+  Edge*/
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-grey-2);
  opacity: 0.6;
}
.td-footer-2-input input::placeholder { /* MODERN BROWSER */
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-grey-2);
  opacity: 0.6;
}
.td-footer-2-input button {
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  color: var(--td-theme-primary);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  padding: 15px 20px;
  border-left: 1px solid #d5deeb;
  height: 100%;
}
.td-footer-2-info a {
  color: var(--td-theme-primary);
}
.td-footer-2-info a:hover {
  opacity: 0.8;
}
.td-footer-2-location a {
  color: var(--td-theme-primary);
  display: block;
  font-size: 16px;
}
.td-footer-2-location a:hover {
  opacity: 0.8;
}
@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) {
  .td-footer-2-widget {
    margin-left: 0;
    margin-right: 0;
  }
}
.td-footer-2-widget-space {
  margin-right: 295px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-footer-2-widget-space {
    margin-right: 200px;
  }
}
@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) {
  .td-footer-2-widget-space {
    margin-right: 0;
  }
}
.td-footer-2-widget-title {
  font-weight: 500;
  font-size: 20px;
}
.td-footer-2-bottom {
  background: #eff4fc;
  padding-top: 22px;
  padding-bottom: 2px;
}
.td-footer-2-bottom-menu ul {
  text-align: right;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-2-bottom-menu ul {
    text-align: left;
  }
}
.td-footer-2-bottom-menu ul li {
  list-style: none;
  display: inline-block;
  margin-left: 55px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-2-bottom-menu ul li {
    margin-left: 0;
    margin-right: 20px;
  }
}
.td-footer-2-bottom-menu ul li a {
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  color: var(--td-theme-primary);
}
@media (max-width: 575px) {
  .td-footer-3-top {
    padding-bottom: 0;
  }
}
.td-footer-3-top-content p {
  font-size: 32px;
  line-height: 1.44;
  color: rgba(255, 255, 255, 0.5);
  margin-bottom: 0;
}
@media (max-width: 575px) {
  .td-footer-3-top-content p {
    font-size: 27px;
  }
}
.td-footer-3-top-content p a {
  text-decoration: underline;
  text-decoration-skip-ink: none;
  color: var(--td-common-white);
}
.td-footer-3-link a {
  line-height: 1.62;
  color: #a3b0b8;
  display: block;
}
@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) {
  .td-footer-3-link a br {
    display: none;
  }
}
.td-footer-3-link a:hover {
  color: var(--td-common-white);
}
.td-footer-3-widget-big-title {
  font-weight: 500;
  font-size: 80px;
  line-height: 1.12;
  color: var(--td-common-white);
}
@media (max-width: 575px) {
  .td-footer-3-widget-big-title {
    font-size: 60px;
  }
}
.td-footer-3-widget-big-title span {
  color: rgba(255, 255, 255, 0.3);
}
.td-footer-3-widget-title {
  font-weight: 600;
  font-size: 24px;
  line-height: 1.33;
  color: var(--td-common-white);
}
.td-footer-3-widget ul li {
  list-style: none;
}
.td-footer-3-widget ul li a {
  line-height: 1.62;
  color: #a3b0b8;
  display: block;
  margin-bottom: 16px;
}
.td-footer-3-widget ul li a:hover {
  color: var(--td-common-white);
}
.td-footer-3-bottom-copyright p {
  line-height: 1;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 0;
}
.td-footer-3-bottom-copyright p a {
  color: var(--td-common-white);
}
@media (max-width: 575px) {
  .td-footer-3-bottom-social {
    text-align: left;
  }
}
.td-footer-3-bottom-social ul li {
  display: inline-block;
  margin-left: 16px;
}
@media (max-width: 575px) {
  .td-footer-3-bottom-social ul li {
    margin-left: 0;
    margin-right: 16px;
  }
}
.td-footer-3-bottom-social ul li a {
  font-size: 16px;
  color: #99a7af;
}
.td-footer-3-bottom-social ul li a:hover {
  color: var(--td-common-white);
}
.td-footer-3-bottom-social ul li a svg {
  width: 16px;
  fill: #99a7af;
  transition: all 0.4s ease;
}
.td-footer-3-bottom-social ul li a svg:hover {
  fill: var(--td-common-white);
}
.td-footer-3-bottom-border {
  border-top: 1px solid #3b464d;
}
.td-footer-3-bottom-spacing {
  padding: 28px 0px 7px 0px;
}
.td-footer-social-img {
  background: var(--td-surface);
  box-shadow: 0 40px 80px 0 rgba(0, 0, 0, 0.06);
  border: 1.4px solid #d5deeb;
  padding: 21px 40px;
  margin-right: -1px;
  margin-top: -1px;
}
.td-footer-4-para {
  opacity: 0.7;
  color: var(--td-common-white);
  line-height: 1.62;
}
@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) {
  .td-footer-4-para br {
    display: none;
  }
}
@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) {
  .td-footer-4-widget {
    margin-left: 0;
  }
}
.td-footer-4-widget ul li a {
  color: var(--td-common-white);
  opacity: 0.7;
  margin-bottom: 10px;
}
.td-footer-4-link a {
  color: var(--td-common-white);
  display: flex;
  margin-bottom: 16px;
  line-height: 1.62;
}
.td-footer-4-link a:hover {
  opacity: 0.7;
}
.td-footer-4-link a span {
  width: 35px;
  display: inline-block;
}
.td-footer-4-link a i {
  color: rgba(230, 230, 230, 0.3607843137);
  font-size: 21px;
  width: 35px;
  transform: translateY(3px);
  flex: 0 0 auto;
}
.td-footer-4-form-input input {
  font-weight: 400;
  font-size: 14px;
  color: #808c94;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5294117647);
  background: none;
  padding-left: 0;
  height: 45px;
}
.td-footer-4-form-input input:focus {
  border-bottom: 1px solid var(--td-common-white);
}
.td-footer-4-form-input input::placeholder {
  font-size: 14px;
  color: #808c94;
  font-weight: 400;
}
.td-footer-4-form-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
}
.td-footer-4-form-check input[type=checkbox], .td-footer-4-form-check input[type=radio] {
  display: none;
}
.td-footer-4-form-check input[type=checkbox]:checked ~ label::after, .td-footer-4-form-check input[type=radio]:checked ~ label::after {
  background-color: transparent;
  border-color: #424c52;
}
.td-footer-4-form-check input[type=checkbox]:checked ~ label::before, .td-footer-4-form-check input[type=radio]:checked ~ label::before {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  border: none;
}
.td-footer-4-form-check label {
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  color: var(--td-common-white);
  position: relative;
  padding-left: 30px;
}
.td-footer-4-form-check label::after, .td-footer-4-form-check label::before {
  position: absolute;
  content: "";
  left: 0;
  top: -2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: none;
  border: 1px solid #424c52;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.td-footer-4-form-check label::before {
  width: 14px;
  height: 14px;
  background-color: var(--td-surface);
  left: 3px;
  top: 1px;
  right: 3px;
  bottom: 3px;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}
.td-footer-4-form-check label:hover {
  cursor: pointer;
}
.td-footer-4-social ul li {
  margin-right: 18px;
  margin-left: 0;
}
.td-footer-4-social ul li a {
  opacity: 1;
  font-size: 20px;
  margin-bottom: 0;
}
.td-footer-4-social ul li a svg {
  fill: var(--td-common-white);
  width: 19px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-4-bottom-condition {
    text-align: left;
  }
}
.td-footer-4-bottom-condition ul li {
  display: inline-block;
  margin-left: 50px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-4-bottom-condition ul li {
    margin-left: 0;
    margin-right: 30px;
  }
}
.td-footer-4-bottom-condition ul li a {
  line-height: 1;
  color: var(--td-common-white);
}
.td-footer-4-bottom-condition ul li a:hover {
  opacity: 0.7;
}
.td-footer-4-bottom-spacing {
  padding: 23px 0px 7px 0px;
}
.td-footer-5-space {
  padding-top: 297px;
  padding-bottom: 95px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-footer-5-widget {
    margin-left: 0;
  }
}
.td-footer-5-widget-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  color: var(--td-common-white);
}
.td-footer-5-widget-content-link ul li {
  margin-bottom: 10px;
}
.td-footer-5-widget-content ul li {
  list-style: none;
}
.td-footer-5-widget-content ul li a {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.62;
  color: var(--td-common-white);
  opacity: 0.7;
  background-image: linear-gradient(#ffffff, #ffffff), linear-gradient(#ffffff, #ffffff);
  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;
}
.td-footer-5-widget-content ul li a:hover {
  background-image: linear-gradient(#ffffff, #ffffff), linear-gradient(#ffffff, #ffffff);
  background-size: 0 1px, 100% 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;
}
.td-footer-5-bottom-content {
  padding: 38px 0px;
}
.td-footer-5-bottom-content p {
  line-height: 1.5;
  color: var(--td-common-white);
  margin-bottom: 0;
}
.td-footer-5-bottom-content p a {
  font-weight: 700;
}

/*----------------------------------------*/
/* 7.12 hero css
/*----------------------------------------*/
.td-hero-cta-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 50px;
}
@media (max-width: 991px) {
  .td-hero-cta-grid {
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
  .td-hero-cta-grid .td-hero-expertise {
    flex-shrink: 0;
    max-width: 160px;
  }
  .td-hero-cta-grid .td-hero-expertise i {
    font-size: 18px;
    margin-right: 8px;
  }
  .td-hero-cta-grid .td-hero-expertise h5 {
    font-size: 13px;
    line-height: 140%;
  }
}
@media (max-width: 480px) {
  .td-hero-cta-grid {
    gap: 8px;
  }
  .td-hero-cta-grid .td-hero-expertise {
    max-width: 130px;
  }
  .td-hero-cta-grid .td-hero-expertise i {
    font-size: 16px;
    margin-right: 6px;
  }
  .td-hero-cta-grid .td-hero-expertise h5 {
    font-size: 11px;
  }
}
.td-hero-spacing {
  padding: 230px 0px 100px 0;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-spacing {
    padding: 100px 0px 30px 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) {
  .td-hero-text-slider {
    margin-bottom: 30px;
  }
}
.td-hero-text-slider-title {
  font-weight: 700;
  font-size: 350px;
  line-height: 1.5;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-hero-text-slider-title {
    font-size: 300px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .td-hero-text-slider-title {
    font-size: 220px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-text-slider-title {
    font-size: 120px;
  }
}
.td-hero-text-slider-active .swiper-slide {
  width: auto;
}
.td-hero-achive-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 112%;
  letter-spacing: -0.02em;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-achive-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .td-hero-achive-title {
    font-size: 40px;
  }
  .td-hero-achive-title svg {
    width: 30px;
  }
}
.td-hero-achive-title .td-title-border {
  position: relative;
  display: inline-block;
  z-index: 1;
}
.td-hero-achive-title .td-title-border::before {
  position: absolute;
  content: "";
  background: #d8d8d8;
  height: 10px;
  width: 100%;
  bottom: 9px;
  left: 0;
  z-index: -1;
}
@media (max-width: 575px) {
  .td-hero-achive-title .td-title-border::before {
    bottom: 0;
  }
}
.td-hero-expertise i {
  font-size: 34px;
  margin-right: 17px;
}
.td-hero-expertise h5 {
  font-weight: 400;
  font-size: 16px;
  line-height: 162%;
  margin-bottom: 0;
}
.td-hero-2-spacing {
  padding-top: 225px;
  padding-bottom: 210px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-2-spacing {
    padding-top: 150px;
    padding-bottom: 140px;
  }
}
.td-hero-2-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 112%;
  letter-spacing: -0.02em;
  color: var(--td-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) {
  .td-hero-2-title {
    font-size: 60px;
  }
  .td-hero-2-title br {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-2-title {
    font-size: 45px;
  }
}
@media (max-width: 575px) {
  .td-hero-2-title {
    font-size: 35px;
  }
}
.td-hero-2-title span {
  color: rgba(255, 255, 255, 0.5);
}
.td-hero-2-navebar {
  border-top: 1px solid rgba(255, 255, 255, 0.1803921569);
}
.td-hero-2-navebar-single {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 17px 30px;
  border-left: 1px solid rgba(255, 255, 255, 0.1098039216);
  width: 100%;
  -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: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-2-navebar-single {
    border: none;
  }
}
.td-hero-2-navebar-single.last {
  border-right: 1px solid rgba(255, 255, 255, 0.1098039216);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-2-navebar-single.last {
    border: none;
  }
}
.td-hero-2-navebar-single span {
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  color: var(--td-common-white);
}
.td-hero-2-navebar-single a {
  color: var(--td-common-white);
  margin-right: 40px;
  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;
}
.td-hero-2-navebar-single:hover {
  background: rgba(255, 255, 255, 0.1098039216);
}
.td-hero-2-navebar-single:hover a {
  opacity: 1;
  margin-right: 30px;
}
.td-hero-3-spacing {
  padding-top: 185px;
  padding-bottom: 470px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-hero-3-spacing {
    padding-bottom: 300px;
  }
}
@media (max-width: 575px) {
  .td-hero-3-spacing {
    padding-bottom: 200px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-3-bottom-btn {
    text-align: left;
    margin-top: 30px;
  }
}
.td-hero-3-title {
  font-weight: 700;
  font-size: 150px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--td-common-white);
  margin-left: 158px;
  margin-bottom: 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) {
  .td-hero-3-title {
    margin-left: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-hero-3-title {
    font-size: 100px;
  }
}
@media (max-width: 575px) {
  .td-hero-3-title {
    font-size: 70px;
  }
}
.td-hero-3-title .first {
  float: right;
  margin-right: 158px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-3-title .first {
    margin-right: 0;
  }
}
.td-hero-3-video-transparent {
  margin-top: -395px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-3-video-transparent {
    margin-top: -200px;
  }
}
@media (max-width: 575px) {
  .td-hero-3-video-transparent {
    margin-top: -100px;
  }
}
.td-hero-3-video-thumb {
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.06);
  border: 20px solid var(--td-common-white);
}
@media (max-width: 575px) {
  .td-hero-3-video-thumb {
    border: 5px solid var(--td-common-white);
  }
}
.td-hero-3-video-popup {
  top: 50%;
  transform: translateY(-50%);
  bottom: inherit !important;
  left: 232px !important;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-3-video-popup {
    left: 100px !important;
  }
}
.td-hero-3-video-play {
  background: var(--td-surface) !important;
  color: var(--td-theme-primary) !important;
}
.td-hero-3-video-play::after, .td-hero-3-video-play::before {
  border: 1px solid rgba(255, 255, 255, 0.4) !important;
}
.td-hero-3-bottom-content p {
  font-weight: 600;
  font-size: 24px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-hero-3-bottom-content p a {
  color: rgba(32, 40, 45, 0.4);
}
.td-hero-4-bg-home {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.td-hero-4-btn {
  animation-delay: 0.4s;
  animation-duration: 1s;
}
.td-hero-4-btn .td-btn {
  padding: 19px 24px;
}
@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) {
  .td-hero-4-singles {
    padding-bottom: 215px;
  }
}
@media (max-width: 575px) {
  .td-hero-4-singles {
    padding-top: 130px;
    padding-bottom: 230px;
  }
}
.td-hero-4-big-text h2 {
  font-weight: 800;
  font-size: 500px;
  line-height: 1;
  letter-spacing: -0.02em;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-common-white);
  -webkit-text-stroke-width: 1px;
  opacity: 0.2;
  margin-left: -35px;
}
@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) {
  .td-hero-4-big-text h2 {
    font-size: 330px;
    margin-left: 0;
  }
}
.td-hero-4-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: var(--td-common-white);
  animation-delay: 0.3s;
  animation-duration: 1s;
}
@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) {
  .td-hero-4-title {
    font-size: 70px;
  }
}
@media (max-width: 575px) {
  .td-hero-4-title {
    font-size: 44px;
  }
}
.td-hero-4-title span {
  color: rgba(255, 255, 255, 0.4);
}
.td-hero-4-title a {
  text-decoration: underline;
  text-decoration-skip-ink: none;
  text-decoration-thickness: 2px;
}
.td-hero-4-badge {
  position: absolute;
  top: 22px;
  left: -61px;
  -webkit-animation: rotate-infinite 15s linear infinite;
  animation: rotate-infinite 15s linear infinite;
}
@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) {
  .td-hero-4-badge {
    top: -75px;
  }
}
.td-hero-4-social {
  position: absolute;
  top: 50%;
  z-index: 2;
  left: 40px;
  transform: translateY(-50%);
}
.td-hero-4-social span {
  font-weight: 600;
  font-size: 16px;
  line-height: 1.62;
  color: var(--td-common-white);
  transform: rotate(-90deg);
  display: inline-block;
  margin-left: -20px;
  margin-top: 34px;
}
.td-hero-4-social ul li {
  list-style: none;
}
.td-hero-4-social ul li a {
  font-size: 14px;
  width: 40px;
  height: 40px;
  border: 2px solid rgba(255, 255, 255, 0.34);
  display: inline-block;
  text-align: center;
  line-height: 35px;
  border-radius: 50%;
  margin-bottom: 10px;
  color: var(--td-common-white);
}
.td-hero-4-social ul li a:hover {
  background: var(--td-theme-primary);
  border: 2px solid var(--td-theme-primary);
}
.td-hero-4-social ul li a svg {
  width: 14px;
  fill: var(--td-common-white);
}
.td-hero-4-dot {
  position: absolute;
  top: 52%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 55px;
  left: auto;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
  width: inherit !important;
  left: auto !important;
  z-index: 99;
}
@media (max-width: 575px) {
  .td-hero-4-dot {
    display: none;
  }
}
.td-hero-4-dot .swiper-pagination-bullet {
  margin: 17px 0 !important;
  display: inline-block;
  opacity: 1;
  height: 0;
  width: 1px;
  background-color: var(--td-surface);
  border-radius: 0;
  position: relative;
  -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;
}
.td-hero-4-dot .swiper-pagination-bullet button {
  position: absolute;
  top: -38px;
  left: -9px;
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  color: var(--td-common-white);
  margin: 7px 0;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  transition: all 0.2s ease;
  opacity: 0.4;
}
.td-hero-4-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  height: 60px;
  margin: 23px 0 !important;
}
.td-hero-4-dot .swiper-pagination-bullet.swiper-pagination-bullet-active button {
  left: -13px;
  -webkit-transform: rotate(90deg) translateY(-4px);
  -moz-transform: rotate(90deg) translateY(-4px);
  -ms-transform: rotate(90deg) translateY(-4px);
  -o-transform: rotate(90deg) translateY(-4px);
  transform: rotate(90deg) translateY(-4px);
  opacity: 1;
}
.td-hero-4-nav-slider {
  width: 500px;
  position: absolute;
  bottom: 0;
  right: 0;
}
@media (max-width: 575px) {
  .td-hero-4-nav-slider {
    width: 100%;
  }
}
.td-hero-4-nav-title {
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
  color: var(--td-common-white);
  margin-bottom: 0;
}
.td-hero-4-nav-thumb {
  height: 100%;
}
.td-hero-4-nav-thumb img {
  width: 100%;
  height: 100%;
}
.td-hero-4-nav-content {
  width: 310px;
  background: var(--td-common-bg);
  padding: 20px;
}
@media (max-width: 575px) {
  .td-hero-4-nav-content {
    width: 100%;
  }
}
.td-hero-4-nav-content span {
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  color: var(--td-common-white);
  opacity: 0.3;
  margin-bottom: 6px;
  display: inline-block;
}
.td-hero-4-navigation-wrapper {
  position: absolute;
  top: -50px;
  z-index: 99;
  left: 0;
}
.td-hero-4-navigation-wrapper button {
  width: 50px;
  height: 50px;
  background: var(--td-surface);
  color: var(--td-theme-primary);
  text-align: center;
  line-height: 50px;
}
.td-hero-4-navigation-wrapper button.td-hero-4-navigation-prev {
  border-left: 1px solid var(--td-theme-primary);
}
.td-hero-4-navigation-wrapper button:hover {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-hero-4-slider-active .swiper-slide-active .td-hero-4-title {
  animation-name: fadeInUp;
  animation-fill-mode: both;
}
.td-hero-4-slider-active .swiper-slide-active .td-hero-4-btn {
  animation-name: fadeInUp;
  animation-fill-mode: both;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-4-content {
    margin-top: 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) {
  .td-hero-4-text-slider {
    padding-bottom: 80px;
  }
}
.td-hero-5-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 1.12;
  letter-spacing: -0.02em;
}
@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) {
  .td-hero-5-title {
    font-size: 75px;
  }
}
@media (max-width: 575px) {
  .td-hero-5-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .td-hero-5-btn a {
    margin-bottom: 10px;
  }
}
.td-hero-5-content-wrap {
  margin-top: 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) {
  .td-hero-5-content-wrap {
    margin-top: 150px;
  }
}
.td-hero-5-bigtext {
  font-weight: 600;
  font-size: 300px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--td-common-white);
  opacity: 0.4;
  position: relative;
}
.td-hero-5-bigtext-wrap {
  position: absolute;
  top: 0;
  z-index: -1;
  left: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-hero-5-bigtext {
    font-size: 250px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-hero-5-bigtext {
    font-size: 170px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-hero-5-bigtext {
    font-size: 150px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-hero-5-bigtext {
    font-size: 110px;
  }
}
@media (max-width: 575px) {
  .td-hero-5-bigtext {
    font-size: 72px;
  }
}
.td-hero-5-bigtext::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  color: var(--td-theme-primary);
  overflow: hidden;
  width: 100%;
  -webkit-transition: 3s;
  -moz-transition: 3s;
  -ms-transition: 3s;
  -o-transition: 3s;
  transition: 3s;
  -moz-animation: hero-text 2s ease-in-out 1s forwards infinite alternate-reverse;
  -webkit-animation: hero-text 2s ease-in-out 1s forwards infinite alternate-reverse;
  animation: hero-text 2s ease-in-out 1s forwards infinite alternate-reverse;
}
.td-hero-5-thumb {
  margin-right: -40px;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-hero-5-thumb {
    margin-right: 0;
    margin-top: 120px;
  }
}
@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) {
  .td-hero-5-thumb {
    margin-right: 0;
    margin-top: 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) {
  .td-hero-5-thumb {
    margin-top: 0;
  }
}
.td-hero-5-shape {
  position: absolute;
  right: -150px;
  top: 100px;
  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) {
  .td-hero-5-shape {
    right: 0;
  }
}
@media (max-width: 575px) {
  .td-hero-5-shape {
    width: 100%;
  }
}
.td-hero-5-form-inner {
  background: var(--td-surface);
  box-shadow: 0 4px 80px 0 rgba(0, 0, 0, 0.04);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-5-form-inner {
    flex-direction: column;
  }
}
.td-hero-5-form-area {
  margin-top: -131px;
  position: relative;
  z-index: 99;
}
@media (max-width: 575px) {
  .td-hero-5-form-area {
    margin-top: 0;
  }
}
.td-hero-5-form-tab {
  padding: 45px 20px 30px 20px;
}
.td-hero-5-form-input {
  width: 240px;
  box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.04);
  background: var(--td-surface);
  border: 1px solid var(--td-common-line);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-hero-5-form-input {
    width: 225px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-hero-5-form-input {
    width: 100%;
    margin-right: 0;
  }
}
.td-hero-5-form-input input {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-theme-primary);
  opacity: 0.7;
  height: 52px;
  padding-left: 20px;
}
.td-hero-5-form-input input:focus {
  border: 1px solid var(--td-theme-primary);
}
.td-hero-5-form-input input::placeholder {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-theme-primary);
  opacity: 0.7;
}
.td-hero-5-form-input .nice-select .current {
  color: var(--td-theme-primary);
  opacity: 0.7;
}
.td-hero-5-tab-para P {
  font-size: 14px;
  line-height: 1;
  text-align: center;
  color: var(--td-grey-2);
  border-top: 1px solid var(--td-common-line);
  margin-bottom: 0;
  padding: 20px 20px;
}
.td-hero-5-tab-para P a {
  color: var(--td-theme-primary);
  font-weight: 600;
}
.td-hero-5-tab-btn-list {
  margin-bottom: 15px;
}
.td-hero-5-tab-btn-list .td-hero-5-tab-btn {
  font-weight: 600;
  color: var(--td-grey-2);
  margin-left: 25px;
  margin-right: 25px;
}
.td-hero-5-tab-btn-list .td-hero-5-tab-btn.active {
  color: var(--td-theme-primary);
}
.td-hero-5-tab-btn-list .td-hero-5-tab-btn.active i {
  color: var(--td-theme-primary);
}
.td-hero-5-tab-btn-list .td-hero-5-tab-btn:hover {
  color: var(--td-theme-primary);
}
.td-hero-5-tab-btn-list .td-hero-5-tab-btn:hover i {
  color: var(--td-theme-primary);
}
.td-hero-5-tab-btn-list .td-hero-5-tab-btn i {
  font-size: 16px;
  color: #c7c7c7;
  margin-right: 3px;
  -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;
}

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

.td-bg-none {
  fill: transparent;
}

/*----------------------------------------*/
/* 7.1 about css
/*----------------------------------------*/
.td-about-para {
  line-height: 150%;
  color: var(--td-grey-2);
  margin-bottom: 0;
}
.td-about-right-space {
  padding-bottom: 280px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-about-right-space {
    padding-bottom: 200px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-about-right-space {
    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) {
  .td-about-right-space {
    padding-bottom: 35px;
  }
}
@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) {
  .td-about-content-wrap {
    margin-left: 0;
  }
}
.td-about-text-big {
  position: absolute;
  right: -292px;
  z-index: -1;
  top: -200px;
}
.td-about-text-big-2 {
  top: -186px;
  right: -345px;
}
@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) {
  .td-about-text-big {
    right: 0;
  }
}
.td-about-thumb-1 {
  padding-right: 15px;
}
@media (max-width: 575px) {
  .td-about-thumb-1 {
    padding-right: 0;
  }
}
.td-about-thumb-2 {
  padding-right: 54px;
  padding-top: 110px;
}
@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) {
  .td-about-thumb-2 {
    padding-right: 0;
    padding-top: 100px;
  }
}
@media (max-width: 575px) {
  .td-about-thumb-2 {
    padding-top: 40px;
  }
}
.td-about-thumb-3 {
  padding-left: 123px;
  padding-right: 117px;
  margin-top: -220px;
}
@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) {
  .td-about-thumb-3 {
    padding-right: 62px;
    margin-top: -120px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-about-thumb-3 {
    margin-top: -60px;
  }
}
@media (max-width: 575px) {
  .td-about-thumb-3 {
    padding-right: 0;
  }
}
.td-about-2-shape {
  width: 81px;
  height: 81px;
  background: var(--td-surface-2);
  display: inline-block;
  position: absolute;
  top: 0;
  right: 90px;
}
.td-about-2-shape-2 {
  width: 572px;
  height: 252px;
  background: var(--td-surface-2);
  display: inline-block;
  position: absolute;
  bottom: 228px;
  left: 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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-about-2-shape-2 {
    width: 372px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-about-3-title-wrap .td-section-title {
    font-size: 50px;
  }
}
.td-about-3-space {
  padding-top: 215px;
}
@media (max-width: 575px) {
  .td-about-3-space {
    padding-top: 120px;
  }
}
.td-about-3-shape {
  position: absolute;
  top: -75px;
  right: -75px;
}
.td-about-3-shape-2 {
  position: absolute;
  top: 45%;
  left: 0;
  z-index: -1;
}
.td-about-3-list-border {
  border-bottom: 1px solid var(--td-common-line);
}
.td-about-3-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.td-about-3-order {
  color: #999;
  display: inline-block;
}
.td-about-3-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 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) {
  .td-about-3-content-wrap {
    margin-left: 0;
  }
}
@media (max-width: 575px) {
  .td-about-3-thumb {
    padding-top: 0;
  }
}
.td-about-4-thumb {
  margin-top: -175px;
  margin-right: 170px;
}
@media (max-width: 575px) {
  .td-about-4-thumb {
    margin-top: -91px;
    margin-right: 94px;
  }
}
.td-about-4-thumb img {
  box-shadow: 0 -40px 80px 0 rgba(0, 0, 0, 0.06);
  padding: 10px;
  background: var(--td-surface);
}
.td-about-4-thumb-2 {
  margin-right: 45px;
  text-align: right;
}
.td-about-4-thumb-shape img {
  position: absolute;
  bottom: 77px;
  right: -35px;
  z-index: -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) {
  .td-about-4-thumb-shape img {
    right: 0;
  }
}
.td-about-4-thumb-rotate {
  position: absolute;
  top: 0;
  left: 60px;
}
@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) {
  .td-about-4-thumb-rotate {
    left: 0;
  }
}
.td-about-4-content-wrap {
  margin-left: 45px;
}
@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) {
  .td-about-4-content-wrap {
    margin-left: 0;
  }
}
.td-about-4-contact-info-wrap {
  display: flex;
  align-items: center;
}
@media (max-width: 575px) {
  .td-about-4-contact-info-wrap {
    margin-bottom: 30px;
  }
}
.td-about-4-contact-info-wrap svg {
  margin-right: 16px;
}
.td-about-4-contact-info span {
  line-height: 1.87;
  color: var(--td-grey-2);
  display: block;
}
.td-about-4-contact-info a {
  font-weight: 600;
  font-size: 24px;
  color: var(--td-theme-primary);
  line-height: 1;
}
.td-about-4-contact-info a:hover {
  color: var(--td-grey-2);
}
.td-about-5-position {
  position: absolute;
  bottom: 65px;
  left: 0;
  right: 0;
  text-align: center;
}
@media (max-width: 575px) {
  .td-about-5-position {
    bottom: 20px;
  }
}

.td-impressions-shape {
  position: absolute;
  top: 0;
  left: 30px;
}

/*----------------------------------------*/
/* 7.22 testimonial css
/*----------------------------------------*/
.td-testimonial-bg-text h2 {
  font-weight: 800;
  font-size: 350px;
  line-height: 100%;
  background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .td-testimonial-bg-text h2 {
    font-size: 250px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-testimonial-bg-text h2 {
    font-size: 200px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-testimonial-bg-text h2 {
    font-size: 150px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-bg-text h2 {
    font-size: 100px;
  }
}
.td-testimonial-content p {
  font-weight: 500;
  line-height: 162%;
  color: var(--td-theme-primary);
}
.td-testimonial-qoute {
  -webkit-animation: rotate-infinite 15s linear infinite;
  animation: rotate-infinite 15s linear infinite;
}
.td-testimonial-qoute-2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
}
.td-testimonial-qoute-wrap {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  top: -80px;
}
.td-testimonial-qoute-thumb {
  display: inline-block;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-main {
    padding-top: 130px;
  }
}
.td-testimonial-avatar-title {
  font-weight: 500;
  line-height: 133%;
}
.td-testimonial-avatar-designation {
  color: var(--td-grey-2);
}
.td-testimonial-transparet {
  margin-top: -145px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-testimonial-transparet {
    margin-top: -55px;
  }
}
@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) {
  .td-testimonial-transparet {
    margin-top: 0;
  }
}
.td-testimonial-text-slider {
  margin-bottom: -17px;
}
.td-testimonial-slider-title {
  font-weight: 600;
  font-size: 160px;
  line-height: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-slider-title {
    font-size: 100px;
  }
}
.td-testimonial-slider-title-tr {
  font-weight: 600;
  font-size: 160px;
  line-height: 1;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-theme-primary);
  -webkit-text-stroke-width: 1px;
  margin-bottom: 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) {
  .td-testimonial-slider-title-tr {
    font-size: 100px;
  }
}
.td-testimonial-2-thumb {
  margin-top: -120px;
}
@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) {
  .td-testimonial-2-thumb {
    height: 100%;
  }
  .td-testimonial-2-thumb img {
    height: 100%;
    object-fit: cover;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-2-thumb {
    margin-top: 0;
  }
}
.td-testimonial-2-bottom {
  position: relative;
  z-index: 2;
}
.td-testimonial-2-qoute {
  position: absolute;
  top: 0;
  left: 0;
}
@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) {
  .td-testimonial-2-qoute {
    display: none;
  }
}
.td-testimonial-2-qoute-2 {
  position: absolute;
  bottom: 0;
  right: 90px;
}
.td-testimonial-2-space {
  padding-left: 300px;
  padding-top: 135px;
  padding-bottom: 107px;
}
@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) {
  .td-testimonial-2-space {
    padding-left: 30px;
  }
}
.td-testimonial-2-slider-wrap {
  background: var(--td-surface);
  padding: 45px 50px 50px 50px;
  margin-right: -130px;
  z-index: 4;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-2-slider-wrap {
    margin-right: 30px;
  }
}
@media (max-width: 575px) {
  .td-testimonial-2-slider-wrap {
    padding: 45px 20px 50px 20px;
  }
}
.td-testimonial-2-slider p {
  font-size: 20px;
  line-height: 2.1;
  color: var(--td-theme-primary);
  margin-bottom: 45px;
}
@media (max-width: 575px) {
  .td-testimonial-2-slider p {
    font-size: 14px;
  }
}
.td-testimonial-2-avater-thumb {
  margin-right: 15px;
}
.td-testimonial-2-avater-thumb img {
  border-radius: 50%;
}
.td-testimonial-2-avater-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 1;
  margin-bottom: 0;
}
.td-testimonial-2-avater-designation {
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  color: var(--td-grey-2);
}
.td-testimonial-video {
  position: absolute !important;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
  margin: 0 auto;
}
.td-testimonial-profile-slide .swiper-slide {
  width: 150px !important;
}
.td-testimonial-3-wrap {
  background: var(--td-surface);
  box-shadow: 0 40px 80px 0 rgba(0, 0, 0, 0.06);
  margin: 0 90px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-testimonial-3-wrap {
    margin: 0 40px;
  }
}
@media (max-width: 575px) {
  .td-testimonial-3-wrap {
    margin: 0;
  }
}
@media (max-width: 575px) {
  .td-testimonial-3-title-wrap {
    margin-bottom: 170px;
  }
}
.td-testimonial-3-ratngs span {
  font-weight: 400;
  color: var(--td-grey-2);
}
.td-testimonial-3-ratngs i {
  color: var(--td-theme-primary);
}
.td-testimonial-3-content {
  padding: 80px 140px 70px 140px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .td-testimonial-3-content {
    padding: 80px 80px 70px 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-3-content {
    padding: 60px 40px 60px 40px;
  }
}
.td-testimonial-3-content p {
  font-size: 24px;
  line-height: 1.75;
  color: var(--td-grey-2);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-3-content p {
    font-size: 16px;
  }
}
.td-testimonial-3-avater {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: left;
}
.td-testimonial-3-avater-thumb {
  margin-right: 16px;
}
.td-testimonial-3-avater-thumb img {
  border-radius: 50%;
}
.td-testimonial-3-avater-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
  color: var(--td-theme-primary);
  margin-bottom: 5px;
}
@media (max-width: 575px) {
  .td-testimonial-3-avater-title {
    font-size: 20px;
  }
}
.td-testimonial-3-avater-designation {
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-2);
}
.td-testimonial-3-profile {
  padding: 32px 40px 32px 40px;
  border-top: 1px solid var(--td-common-line);
  background: var(--td-surface);
}
.td-testimonial-3-profile-logo img {
  width: 100%;
  opacity: 0.3;
  transition: all 0.4s ease;
}
.td-testimonial-3-profile-logo img:hover {
  opacity: 1;
}
.td-testimonial-3-btn div {
  box-shadow: 0 4px 80px 0 rgba(0, 0, 0, 0.08);
  height: 100px;
  width: 100px;
  background: var(--td-surface);
  text-align: center;
  line-height: 100px;
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  top: 50%;
  z-index: 1;
  left: -50px;
  transform: translateY(-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) {
  .td-testimonial-3-btn div {
    height: 70px;
    width: 70px;
    line-height: 70px;
    left: -35px;
  }
}
@media (max-width: 575px) {
  .td-testimonial-3-btn div {
    top: -70px;
  }
}
@media (max-width: 575px) {
  .td-testimonial-3-btn div {
    left: 0;
  }
}
.td-testimonial-3-btn div.td-testimonial-next {
  left: auto;
  right: -50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-testimonial-3-btn div.td-testimonial-next {
    right: -35px;
  }
}
@media (max-width: 575px) {
  .td-testimonial-3-btn div.td-testimonial-next {
    right: auto;
    left: 100px;
  }
}
.td-testimonial-3-btn div i {
  opacity: 0.2;
  transition: all 0.4s ease;
}
.td-testimonial-3-btn div:hover i {
  opacity: 1;
}
.td-testimonial-3-shape {
  position: absolute;
  background: #ecf1f8;
  height: 130px;
  width: 95%;
  bottom: -28px;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: -1;
  box-shadow: 0 40px 80px 0 rgba(0, 0, 0, 0.06);
}
.td-testimonial-3-shape-2 {
  position: absolute;
  background: var(--td-surface);
  height: 130px;
  width: 90%;
  bottom: -56px;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: -2;
  box-shadow: 0 40px 80px 0 rgba(0, 0, 0, 0.06);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-4-btn {
    justify-content: flex-start !important;
    margin-bottom: 40px;
  }
}
.td-testimonial-4-btn-inner {
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: inline-block;
}
.td-testimonial-4-btn-inner div {
  color: var(--td-common-white);
  display: inline-block;
  padding: 18px 26px;
  cursor: pointer;
  -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;
}
.td-testimonial-4-btn-inner div:hover {
  background: var(--td-surface);
  color: var(--td-theme-primary);
}
.td-testimonial-4-content {
  position: relative;
  padding-left: 55px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-4-content {
    padding-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) {
  .td-testimonial-4-content img {
    width: 100%;
  }
}
.td-testimonial-4-content span {
  width: 1px;
  height: 100px;
  background: var(--td-surface);
  opacity: 0.2;
  bottom: 0;
  left: 0;
  position: absolute;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-4-content span {
    display: none;
  }
}
.td-testimonial-4-content p {
  font-weight: 400;
  font-size: 20px;
  line-height: 1.7;
  color: var(--td-common-white);
  margin-bottom: 0;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-4-content p {
    margin-top: 30px;
  }
}
.td-testimonial-4-border {
  border-bottom: 1px solid var(--td-common-line);
}
.td-testimonial-4-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  color: var(--td-common-white);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-4-bottom-btn {
    justify-content: flex-start !important;
  }
}
.td-testimonial-avater-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.4;
  color: var(--td-common-white);
  margin-bottom: 0;
}
.td-testimonial-avater-designation {
  font-size: 14px;
  line-height: 1;
  color: rgba(255, 255, 255, 0.7);
}
.td-testimonial-5-wrap {
  background: var(--td-surface);
  border: 1px solid var(--td-common-line);
  box-shadow: 0 40px 80px 0 rgba(0, 0, 0, 0.06);
  position: relative;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-5-wrap {
    padding: 20px;
  }
}
.td-testimonial-5-icon {
  position: absolute;
  top: 10px;
  left: 150px;
}
.td-testimonial-5-content {
  padding: 40px 30px 40px 0px;
}
.td-testimonial-5-content p {
  font-weight: 400;
  font-size: 20px;
  line-height: 150%;
  color: var(--td-grey-2);
  margin-bottom: 37px;
}
.td-testimonial-5-avatar {
  display: flex;
  align-items: center;
}
.td-testimonial-5-avatar-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  margin-bottom: 0;
  margin-right: 10px;
}
.td-testimonial-5-avatar-designation {
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  color: var(--td-grey-2);
}
.td-testimonial-5-slider-para {
  margin-top: 60px;
  margin-bottom: 72px;
}
.td-testimonial-5-slider-para p {
  text-align: center;
  color: var(--td-grey-2);
  margin-bottom: 0;
}
.td-testimonial-5-slider-para p a {
  font-weight: 600;
  color: var(--td-theme-primary);
  text-decoration: underline;
  text-decoration-skip-ink: none;
  text-decoration-color: var(--td-common-line);
}
.td-testimonial-5-brands {
  border-top: 1px solid var(--td-common-line);
  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) {
  .td-testimonial-5-thumb img {
    width: 30%;
    position: absolute;
    bottom: 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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-5-thumb img {
    width: 18%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-5-thumb img {
    width: 28%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-testimonial-5-thumb img {
    position: inherit;
  }
}

@-webkit-keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-moz-keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-ms-keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.td-testimonial-3-slider-active.swiper-container-fade .swiper-slide {
  background: var(--td-surface);
}

.testimonial__slider-9-thumb-nav {
  position: relative;
  height: 97px;
}

.testimonial__slider-9-thumb-nav .tp-border-loader {
  position: absolute;
  top: -3px;
  left: 0;
  right: 0;
  text-align: center;
}

.testimonial__slider-9-thumb-nav .tp-border-loader svg {
  width: 96px;
  height: 96px;
  overflow: visible;
  margin: 4px;
}

.tp-border-loader svg {
  transform: rotate(-90deg);
}

.testimonial__slider-9-thumb-nav .tp-border-loader svg circle {
  stroke: var(--td-theme-primary);
}

.tp-border-loader svg circle {
  stroke: rgba(255, 255, 255, 0.4);
}

.testimonial__slider-9 .slick-current.slick-active .tp-border-loader svg circle:last-child {
  animation: tp-border-loader 8s linear infinite;
  stroke-width: 6px;
}

.tp-border-loader svg circle:last-child {
  stroke-dashoffset: -356px;
  stroke-dasharray: 0px, 366px;
}

.testimonial__slider-9-thumb-nav img {
  width: 86px;
  height: 86px;
  border-radius: 50%;
  padding: 5px;
  position: absolute;
  left: 0;
  right: -2px;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50%);
}
@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) {
  .testimonial__slider-9-thumb-nav img {
    right: 0;
  }
}

.testimonial__slider-nav-9 {
  height: 130px;
}

@-webkit-keyframes tp-border-loader {
  0% {
    stroke-dashoffset: -356px;
    stroke-dasharray: 356px, 366px;
  }
  95% {
    stroke-dashoffset: 0;
    stroke-dasharray: 356px, 366px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 0, 366px;
  }
}
@-moz-keyframes tp-border-loader {
  0% {
    stroke-dashoffset: -356px;
    stroke-dasharray: 356px, 366px;
  }
  95% {
    stroke-dashoffset: 0;
    stroke-dasharray: 356px, 366px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 0, 366px;
  }
}
@-ms-keyframes tp-border-loader {
  0% {
    stroke-dashoffset: -356px;
    stroke-dasharray: 356px, 366px;
  }
  95% {
    stroke-dashoffset: 0;
    stroke-dasharray: 356px, 366px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 0, 366px;
  }
}
@keyframes tp-border-loader {
  0% {
    stroke-dashoffset: -356px;
    stroke-dasharray: 356px, 366px;
  }
  95% {
    stroke-dashoffset: 0;
    stroke-dasharray: 356px, 366px;
  }
  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 0, 366px;
  }
}
/*----------------------------------------*/
/*  7.8 cta css
/*----------------------------------------*/
.td-cta-bg-shape {
  position: absolute;
  top: 27px;
  height: 100%;
  left: 60px;
  right: 60px;
  width: 95%;
  margin: 0 auto;
  z-index: -1;
}
.td-cta-big-title {
  font-weight: 700;
  font-size: 300px;
  line-height: 1;
  letter-spacing: -0.02em;
  text-align: center;
  color: var(--td-common-white);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: var(--td-common-white);
  -webkit-text-stroke-color: var(--td-theme-primary);
  -webkit-text-stroke-width: 3px;
  text-shadow: 0 60px 120px rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-cta-big-title {
    font-size: 200px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-cta-big-title {
    font-size: 150px;
  }
}
@media (max-width: 575px) {
  .td-cta-big-title {
    font-size: 110px;
  }
}
.td-cta-count-2 {
  margin-left: 23px;
}
.td-cta-count-wrap {
  display: flex;
  align-items: center;
}
.td-cta-para p {
  line-height: 1.5;
  color: var(--td-grey-2);
  margin-bottom: 0;
  margin-right: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-cta-para p {
    margin-right: 0;
    margin-left: 20px;
  }
}
@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) {
  .td-cta-para p {
    margin-right: 0;
    margin-left: 0;
    margin-top: 20px;
  }
}
.td-cta-para-2 p {
  margin-right: 0;
}
.td-cta-icon {
  margin-right: 20px;
}
.td-cta-count-title {
  font-weight: 500;
  font-size: 64px;
  line-height: 1;
  color: var(--td-theme-primary);
  margin-bottom: 0;
}
.td-cta-count-title-pre {
  font-size: 40px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-cta-count-title-pre {
    font-size: 28px;
  }
}

/*----------------------------------------*/
/*  7.6 contact css
/*----------------------------------------*/
.td-contact-title {
  font-weight: 500;
  font-size: 48px;
  line-height: 1.21;
}
.td-contact-pre {
  line-height: 1.5;
  color: var(--td-theme-primary);
}
@media (max-width: 575px) {
  .td-contact-pre br {
    display: none;
  }
}
.td-contact-info-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.4;
}
.td-contact-info-link {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-contact-social-info a {
  font-size: 20px;
  color: var(--td-grey-2);
  margin-right: 25px;
}
.td-contact-form input {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
  border: none;
  border-bottom: 1px solid var(--td-common-line);
  padding: 13px 16px;
  height: auto;
}
.td-contact-form input:focus {
  border-bottom: 1px solid var(--td-theme-primary);
}
.td-contact-form input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form input::-moz-placeholder { /* Firefox 19+ */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form input:-moz-placeholder { /* Firefox 4-18 */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form input:-ms-input-placeholder { /* IE 10+  Edge*/
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form input::placeholder { /* MODERN BROWSER */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form textarea {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
  border: none;
  border-bottom: 1px solid var(--td-common-line);
  padding: 13px 16px;
  height: 150px !important;
  resize: none;
}
.td-contact-form textarea:focus {
  border-bottom: 1px solid var(--td-theme-primary);
}
.td-contact-form textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form textarea::-moz-placeholder { /* Firefox 19+ */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form textarea:-moz-placeholder { /* Firefox 4-18 */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form textarea:-ms-input-placeholder { /* IE 10+  Edge*/
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form textarea::placeholder { /* MODERN BROWSER */
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-contact-form button {
  font-weight: 700;
  font-size: 14px;
  line-height: 100%;
  text-align: center;
  color: var(--td-common-white);
  background: var(--td-theme-primary);
  display: block;
  padding: 23px 20px;
  width: 100%;
  -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;
}
.td-contact-form button:hover {
  background: rgba(32, 40, 45, 0.9019607843);
}
.td-contact-form-wrap {
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.06);
  background: var(--td-surface);
  padding: 51px 45px 40px 45px;
}
@media (max-width: 575px) {
  .td-contact-form-wrap {
    padding: 51px 20px 40px 20px;
  }
}
.td-contact-form-title {
  font-weight: 500;
  font-size: 32px;
  line-height: 1.31;
}
@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) {
  .td-contact-form-title br {
    display: none;
  }
}
.td-contact-form-title span {
  color: rgba(32, 40, 45, 0.4);
}
.td-contact-shape {
  position: absolute;
  top: -213px;
  left: -25px;
  z-index: -1;
}
.td-contact-3-content p {
  color: var(--td-theme-primary);
  line-height: 1.62;
}
.td-contact-3-input {
  position: relative;
}
.td-contact-3-input input {
  padding-right: 50px;
}
.td-contact-3-input textarea {
  padding: 20px 50px 30px 0px;
  min-height: 190px;
}
.td-contact-3-input img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
}
.td-contact-3-input img.envelope {
  top: 30px;
}
.td-contact-3-btn {
  text-align: right;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-contact-3-btn {
    text-align: left;
  }
}
.td-contact-3-btn button {
  width: 250px;
  height: 250px;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  color: var(--td-theme-primary);
  border: 1px solid var(--td-theme-primary);
  background: var(--td-surface-2);
  border-radius: 50%;
}
@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) {
  .td-contact-4-transparent {
    margin-left: 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) {
  .td-contact-4-transparent {
    margin-left: 0;
  }
}
.td-contact-4-transparent-title {
  font-weight: 700;
  font-size: 120px;
  line-height: 1;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-grey-2);
  -webkit-text-stroke-width: 1px;
  margin-bottom: -28px;
}
@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) {
  .td-contact-4-transparent-title {
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-contact-4-transparent-title {
    font-size: 80px;
  }
}
@media (max-width: 575px) {
  .td-contact-4-transparent-title {
    font-size: 60px;
  }
}
@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) {
  .td-contact-4-form {
    margin-left: 0;
  }
}
.td-contact-4-title {
  font-weight: 500;
  font-size: 40px;
  line-height: 1;
}
.td-contact-4-thumb {
  margin-right: 20px;
}
@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) {
  .td-contact-4-thumb {
    margin-right: 0;
  }
}
@media (max-width: 575px) {
  .td-contact-4-thumb {
    margin-bottom: 20px;
  }
}
.td-contact-4-content ul li {
  display: block;
  list-style: none;
}
.td-contact-4-content ul li a {
  line-height: 1.62;
  color: var(--td-grey-2);
  background-image: linear-gradient(#666, #666), linear-gradient(#666, #666);
  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;
}
.td-contact-4-content ul li a:hover {
  background-image: linear-gradient(#666, #666), linear-gradient(#666, #666);
  background-size: 0 1px, 100% 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;
}
.td-contact-4-pagenation {
  display: flex;
  position: absolute;
  top: 46%;
  transform: translateY(-50%);
  left: -40px;
  flex-direction: column;
  row-gap: 10px;
}
@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) {
  .td-contact-4-pagenation {
    top: auto;
    bottom: -55px;
    left: 0;
    right: 0;
    text-align: center;
    display: block;
  }
}
.td-contact-4-pagenation span {
  width: 4px;
  height: 4px;
  background: #d9d9d9;
  opacity: 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) {
  .td-contact-4-pagenation span {
    margin: 0 10px;
  }
}
.td-contact-4-pagenation span.swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--td-theme-primary);
}
.td-contact-map-box {
  line-height: 1;
}
.td-contact-map-box iframe {
  height: 750px;
  width: 100%;
  filter: saturate(0);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-contact-map-box iframe {
    height: 550px;
  }
}
@media (max-width: 575px) {
  .td-contact-map-box iframe {
    height: 450px;
  }
}
.td-contact-map-logo {
  position: absolute;
  top: 39%;
  transform: translateY(-50%);
  text-align: center;
  left: -86px;
  right: 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) {
  .td-contact-map-logo {
    left: 0;
  }
}
.td-contact-map-logo h3 {
  font-weight: 600;
  font-size: 36px;
  line-height: 1;
  letter-spacing: -0.02em;
  box-shadow: 0 30px 120px 0 rgba(0, 0, 0, 0.3);
  background: var(--td-surface);
  padding: 10px 14px;
  display: inline-block;
}

.td-btn-rounded {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.td-btn-rounded:hover {
  color: var(--td-common-white);
}
.td-btn-rounded:hover .td-btn-circle-dot {
  width: 520px;
  height: 520px;
}

.td-btn-circle-dot {
  position: absolute;
  bottom: 0;
  left: 32px;
  width: 0px;
  height: 0px;
  -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;
  line-height: 20px;
  border-radius: 50%;
  background-color: var(--td-theme-primary);
  -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;
}

/*----------------------------------------*/
/* 7.18 service css
/*----------------------------------------*/
.td-service-number {
  font-weight: 700;
  font-size: 150px;
  line-height: 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: rgba(249, 246, 246, 0.1);
  -webkit-text-stroke-width: 1px;
  opacity: 0.4;
  padding-bottom: 410px;
  transform: translateY(-60px);
  opacity: 0;
  visibility: hidden;
  -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: 1200px) and (max-width: 1399px) {
  .td-service-number {
    padding-bottom: 300px;
    font-size: 80px;
  }
}
@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) {
  .td-service-number {
    padding-bottom: 100px;
    font-size: 100px;
  }
}
.td-service-wrap {
  padding: 25px 40px 50px 40px;
}
@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) {
  .td-service-wrap {
    padding: 25px 20px 50px 20px;
  }
}
@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) {
  .td-service-wrap {
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }
}
.td-service-wrap:hover .td-service-content {
  transform: translateY(0);
}
.td-service-wrap:hover .td-service-content-inner {
  opacity: 1;
  visibility: visible;
}
.td-service-wrap:hover .td-service-number {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}
.td-service-content {
  transform: translateY(142px);
  -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;
}
.td-service-content-para {
  font-size: 16px;
  line-height: 150%;
  color: var(--td-common-white);
  opacity: 0.7;
}
.td-service-content-inner {
  opacity: 0;
  visibility: hidden;
  -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;
}
.td-service-title {
  font-weight: 500;
  font-size: 32px;
  line-height: 131%;
  color: var(--td-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) {
  .td-service-title {
    font-size: 22px;
  }
}
.td-service-title a {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  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;
}
.td-service-title a:hover {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  background-size: 0 1px, 100% 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;
}
.td-service-border {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  position: relative;
}
.td-service-border::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 0;
  background-color: var(--td-surface);
  bottom: 0;
  right: 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;
}
@media (max-width: 575px) {
  .td-service-border::before {
    display: none;
  }
}
.td-service-border:hover::before {
  height: 100%;
  bottom: inherit;
  top: 0;
}
.td-service-cetagory {
  font-weight: 700;
  font-size: 14px;
  color: var(--td-common-white);
  backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.1);
  display: inline-block;
  padding: 6px 11px;
  position: absolute;
  right: -26px;
  top: 50px;
  transform: rotate(90deg);
}
.td-service-cetagory-2 {
  right: -21px;
}
.td-service-cetagory-3 {
  right: -33px;
  top: 61px;
}
.td-service-cetagory-4 {
  right: -52px;
  top: 82px;
}
.td-service-cetagory-5 {
  right: -36px;
  top: 66px;
}
.td-service-2-title {
  font-weight: 500;
  font-size: 80px;
  line-height: 2.2;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-theme-primary);
  -webkit-text-stroke-width: 1px;
  margin-bottom: 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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-service-2-title {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-service-2-title {
    font-size: 42px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-service-2-title {
    line-height: 1.3;
    padding: 15px 0;
  }
}
.td-service-2-title span {
  -webkit-text-fill-color: var(--td-theme-primary);
}
.td-service-2-content {
  padding: 7px 0;
}
.td-service-2-content:hover .td-service-2-thumb {
  opacity: 1;
  visibility: visible;
  transform: translateX(60px);
}
.td-service-2-thumb {
  position: absolute;
  top: -110px;
  right: 0;
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  transform: translateX(0);
  -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;
  border-radius: 50%;
}
.td-service-2-thumb img {
  border-radius: 50%;
}
@media (max-width: 575px) {
  .td-service-2-thumb img {
    width: 150px;
  }
}
@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) {
  .td-service-2-thumb {
    top: -80px;
    right: 50px;
  }
}
@media (max-width: 575px) {
  .td-service-2-thumb {
    width: 200px;
    top: -30px;
  }
}
.td-service-2-transparent {
  margin-top: -55px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-service-2-transparent {
    margin-top: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-service-2-transparent {
    margin-top: 40px;
  }
}
.td-service-2-spacing {
  padding-bottom: 230px;
}
.td-service-2-sercile {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  bottom: -82px;
}
@media (max-width: 575px) {
  .td-service-2-sercile {
    bottom: -150px;
  }
}
.td-service-2-border {
  border-bottom: 1px solid #d9d9d9;
  z-index: 1;
}
.td-service-3-item {
  border: 1px solid var(--td-grey-2);
  padding: 50px 45px 315px 50px;
  position: relative;
  margin-left: -1px;
  margin-top: -1px;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-service-3-item {
    padding: 50px 25px 315px 25px;
  }
}
.td-service-3-item::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--td-surface);
  top: 0;
  left: 0;
  transition: all 0.5s ease;
}
.td-service-3-item:hover::before {
  width: 0;
  left: auto;
  right: 0;
}
.td-service-3-item:hover .td-service-3-thumb {
  opacity: 1;
}
.td-service-3-item:hover .td-service-3-para p {
  opacity: 0.8;
  visibility: visible;
}
.td-service-3-item:hover .td-service-3-title {
  color: var(--td-common-white);
}
.td-service-3-item:hover .td-service-3-title .grey {
  color: var(--td-common-white);
}
.td-service-3-item:hover .td-service-3-number h2 {
  -webkit-text-fill-color: var(--td-common-white);
  -webkit-text-stroke-color: var(--td-common-white);
}
.td-service-3-para p {
  font-weight: 400;
  font-size: 16px;
  line-height: 162%;
  color: var(--td-common-white);
  opacity: 0;
  visibility: hidden;
  -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;
}
.td-service-3-thumb {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  height: 100%;
  z-index: -1;
  opacity: 0;
  -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;
}
.td-service-3-thumb img {
  height: 100%;
  object-fit: cover;
}
.td-service-3-number h2 {
  font-weight: 500;
  font-size: 200px;
  line-height: 1;
  position: absolute;
  bottom: -12px;
  right: 0;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: rgb(0, 0, 0);
  -webkit-text-stroke-width: 1px;
  -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;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-service-3-number h2 {
    font-size: 150px;
  }
}
.td-service-3-title {
  font-weight: 600;
  font-size: 46px;
  line-height: 1.22;
  position: relative;
  z-index: 1;
  -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;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-service-3-title {
    font-size: 40px;
  }
}
.td-service-3-title .grey {
  color: rgba(32, 40, 45, 0.4);
}
.td-service-3-title span {
  display: block;
  -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;
}
.td-service-4-border {
  border-top: 1px solid var(--td-common-line);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-service-4-border {
    padding-bottom: 100px;
  }
}
.td-service-4-item {
  display: flex;
  align-items: 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) {
  .td-service-4-item {
    padding-bottom: 40px;
  }
}
@media (max-width: 575px) {
  .td-service-4-item {
    flex-direction: column;
    align-items: flex-start;
  }
}
.td-service-4-icon {
  margin-right: 43px;
}
@media (max-width: 575px) {
  .td-service-4-icon {
    margin-right: 0;
    margin-bottom: 20px;
  }
}
.td-service-4-logo {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: 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) {
  .td-service-4-logo {
    padding-bottom: 40px;
  }
}
.td-service-4-logo a {
  padding: 95px 56px;
}
.td-service-4-logo a .td-pulse-border::after, .td-service-4-logo a .td-pulse-border::before {
  border: 1px solid rgba(227, 227, 227, 0.2);
}
.td-service-4-content p {
  line-height: 1.62;
  color: var(--td-grey-2);
  margin-bottom: 0;
}
.td-service-4-title {
  font-weight: 500;
  font-size: 40px;
  line-height: 1.25;
  color: var(--td-theme-primary);
}
.td-service-4-title a:hover {
  opacity: 0.8;
}
.td-service-5-wrap {
  border-radius: 100%;
  background: var(--td-surface);
  box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.04);
  width: 278px;
  padding: 40px 40px 40px 40px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-service-5-wrap {
    width: 248px;
    padding: 30px 30px 30px 30px;
  }
}
.td-service-5-bottom-para p {
  line-height: 1;
  text-align: center;
  color: var(--td-grey-2);
}
.td-service-5-bottom-para p a {
  font-weight: 500;
  text-decoration: underline;
  text-decoration-skip-ink: none;
  color: var(--td-theme-primary);
}
.td-service-5-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-service-5-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-service-5-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-service-5-content p {
  font-size: 14px;
  line-height: 1.57;
  color: var(--td-grey-2);
  margin-bottom: 0;
}
.td-service-6-item {
  display: flex;
  border: 1px solid var(--td-common-line);
  padding: 50px 50px 25px 50px;
}
@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) {
  .td-service-6-item {
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-service-6-item {
    padding: 50px 20px 25px 20px;
  }
}
@media (max-width: 575px) {
  .td-service-6-item {
    flex-direction: column;
  }
}
.td-service-6-icon {
  margin-right: 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-service-6-icon {
    margin-right: 20px;
  }
}
@media (max-width: 575px) {
  .td-service-6-icon {
    margin-bottom: 15px;
  }
}
.td-service-6-title {
  font-weight: 500;
  font-size: 40px;
  line-height: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-service-6-title {
    font-size: 30px;
  }
}
.td-service-6-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-service-6-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-service-6-content p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-service-details-title {
  font-weight: 500;
  font-size: 36px;
  line-height: 1;
}
.td-service-details-content p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-service-details-pogress {
  margin-bottom: 20px;
  overflow: hidden;
}
.td-service-details-pogress-quality {
  margin-bottom: 47px;
}
.td-service-details-pogress .knob {
  font-weight: 600 !important;
  font-size: 40px !important;
  line-height: 1 !important;
  text-align: left !important;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-service-details-pogress-wrapper {
    display: flex;
    justify-content: space-around;
  }
}
.td-service-details-accordion {
  border-top: 1px solid var(--td-common-line);
}
.td-service-details-accordion-item {
  border: none;
  border-bottom: 1px solid var(--td-common-line);
}
.td-service-details-accordion-item:first-of-type {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.td-service-details-accordion-item:last-of-type {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.td-service-details-accordion-item .accordion-button {
  background: none;
  border: none;
  font-weight: 500;
  font-size: 18px;
  line-height: 1;
  color: var(--td-theme-primary);
  padding: 23px 10px;
  padding-left: 35px;
  position: relative;
  box-shadow: none;
}
.td-service-details-accordion-item .accordion-button::after {
  display: none;
}
.td-service-details-accordion-item .accordion-button:focus {
  box-shadow: none;
}
.td-service-details-accordion-item .accordion-button:not(.collapsed) {
  color: var(--td-theme-primary);
}
.td-service-details-accordion-item .accordion-button:not(.collapsed) .accordion-btn::before {
  -webkit-transform: translateX(-50%) rotate(90deg);
  -moz-transform: translateX(-50%) rotate(90deg);
  -ms-transform: translateX(-50%) rotate(90deg);
  -o-transform: translateX(-50%) rotate(90deg);
  transform: translateX(-50%) rotate(90deg);
  background-color: var(--td-theme-primary);
}
.td-service-details-accordion-item .accordion-button:not(.collapsed) .accordion-btn::after {
  background-color: var(--td-theme-primary);
}
.td-service-details-accordion-item .accordion-body {
  padding-left: 35px;
  padding-right: 0;
  padding-top: 5px;
}
.td-service-details-accordion-item .accordion-body p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-service-details-accordion-item .accordion-btn {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-block;
  width: 14px;
  height: 14px;
}
.td-service-details-accordion-item .accordion-btn::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 2px;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  background-color: #999;
  border-radius: 2px;
}
.td-service-details-accordion-item .accordion-btn::before {
  position: absolute;
  content: "";
  width: 2px;
  height: 100%;
  left: 50%;
  top: 0;
  background-color: #999;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 2px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-service-details-right {
    margin-left: 20px;
  }
}
@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) {
  .td-service-details-right {
    margin-left: 0;
  }
}
.td-service-quality-title {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  margin-left: 20px;
}
.td-service-widget-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
  border-bottom: 1px solid var(--td-common-line);
  padding-bottom: 20px;
  margin-bottom: 30px;
}
.td-service-widget-title-2 {
  border: none;
  padding-bottom: 0;
}
.td-service-widget-item {
  border: 1px solid var(--td-common-line);
  padding: 40px 30px 38px 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-service-widget-item {
    padding: 20px 10px 18px 20px;
  }
}
.td-service-widget-item ul li {
  list-style: none;
}
.td-service-widget-item ul li:not(:last-child) {
  margin-bottom: 20px;
}
.td-service-widget-item ul li a {
  font-weight: 500;
  line-height: 1;
  text-transform: capitalize;
  color: var(--td-theme-primary);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.td-service-widget-item ul li a:hover {
  color: var(--td-grey-2);
}
.td-service-widget-item ul li a i {
  color: var(--td-grey-4);
}
.td-service-widget-pdf ul li {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--td-surface-2);
  padding: 18px 30px;
}
.td-service-widget-pdf ul li:not(:last-child) {
  margin-bottom: 10px;
}
.td-service-widget-pdf ul li a {
  font-weight: 500;
  line-height: 1;
  text-transform: capitalize;
  color: var(--td-theme-primary);
  display: flex;
  align-items: center;
}
.td-service-widget-pdf ul li a i {
  font-size: 24px;
  margin-right: 20px;
}
.td-service-widget-pdf ul li span i {
  color: var(--td-grey-2);
  opacity: 0.3;
}
.td-service-widget-input {
  position: relative;
}
.td-service-widget-input input {
  height: 50px;
  width: 100%;
  border: 1px solid var(--td-common-line);
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-4);
  padding-left: 24px;
  padding-right: 60px;
}
.td-service-widget-input input:focus {
  border: 1px solid var(--td-theme-primary);
}
.td-service-widget-input input::placeholder {
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-4);
}
.td-service-widget-input label {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  width: 50px;
  right: 0;
  height: 100%;
  border-left: 1px solid var(--td-common-line);
  text-align: center;
  line-height: 50px;
}
.td-service-widget-textarea {
  position: relative;
}
.td-service-widget-textarea textarea {
  height: 140px;
  width: 100%;
  border: 1px solid var(--td-common-line);
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-4);
  padding-left: 24px;
  resize: none;
  padding-right: 60px;
}
.td-service-widget-textarea textarea:focus {
  border: 1px solid var(--td-theme-primary);
}
.td-service-widget-textarea textarea::placeholder {
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-4);
}
.td-service-widget-textarea label {
  position: absolute;
  top: 0;
  font-size: 14px;
  width: 50px;
  right: 0;
  height: 50px;
  border-left: 1px solid var(--td-common-line);
  border-bottom: 1px solid var(--td-common-line);
  text-align: center;
  line-height: 50px;
}

#service-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--tp-common-black-12);
}
#service-bg-img .service-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  visibility: hidden;
  opacity: 0;
  transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transform: scale(1.025);
  -moz-transform: scale(1.025);
  -ms-transform: scale(1.025);
  -o-transform: scale(1.025);
  transform: scale(1.025);
}
#service-bg-img .service-bg::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(32, 40, 45, 0.5);
}
#service-bg-img.service-img-1 .service-img-1 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-2 .service-img-2 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-3 .service-img-3 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-4 .service-img-4 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-5 .service-img-5 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-6 .service-img-6 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-7 .service-img-7 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-8 .service-img-8 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-9 .service-img-9 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-10 .service-img-10 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-11 .service-img-11 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-12 .service-img-12 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-13 .service-img-13 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-14 .service-img-14 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-15 .service-img-15 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-16 .service-img-16 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-17 .service-img-17 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-18 .service-img-18 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-19 .service-img-19 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-20 .service-img-20 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-21 .service-img-21 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-22 .service-img-22 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-23 .service-img-23 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
#service-bg-img.service-img-24 .service-img-24 {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

.td-transparent-title {
  font-weight: 800;
  font-size: 270px;
  line-height: 100%;
  background: linear-gradient(180deg, #fff 0%, rgba(15, 10, 48, 0) 120%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 -200px 200px rgba(0, 0, 0, 0.25);
  position: relative;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-transparent-title {
    font-size: 200px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-transparent-title {
    font-size: 150px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-transparent-title {
    font-size: 100px;
  }
}
@media (max-width: 575px) {
  .td-transparent-title {
    font-size: 70px;
  }
}

@media (max-width: 575px) {
  .sm-flex {
    display: flex;
    justify-content: center;
  }
}

/*----------------------------------------*/
/* 7.23 video css
/*----------------------------------------*/
.td-video-wrapper {
  margin-left: 315px;
}
@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) {
  .td-video-wrapper {
    margin-left: 30px;
  }
}
@media (max-width: 575px) {
  .td-video-wrapper {
    margin-left: 15px;
    margin-right: 15px;
  }
}
.td-video-title {
  font-weight: 500;
  font-size: 80px;
  line-height: 100%;
  position: relative;
  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) {
  .td-video-title {
    font-size: 50px;
    margin-bottom: 30px;
  }
}
@media (max-width: 575px) {
  .td-video-title {
    font-size: 40px;
  }
}
.td-video-title-spacing {
  margin-left: 436px;
  margin-bottom: 25px;
  display: inline-block;
}
@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) {
  .td-video-title-spacing {
    margin-left: 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) {
  .td-video-title-spacing {
    margin-bottom: 0;
  }
}
@media (max-width: 575px) {
  .td-video-title-spacing {
    margin-left: 0;
  }
}
.td-video-title-border {
  position: relative;
  display: inline-block;
}
.td-video-title-border::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 10px;
  background: #eacfc4;
  bottom: 5px;
  left: 0;
  z-index: -1;
}
.td-video-thumb {
  margin-left: 330px;
  margin-top: -86px;
}
@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) {
  .td-video-thumb {
    margin-left: 170px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-video-thumb {
    margin-left: 80px;
    margin-top: 0;
  }
}
@media (max-width: 575px) {
  .td-video-thumb {
    margin-left: 0;
  }
}
.td-video-popup {
  position: absolute;
  bottom: 60px;
  left: 60px;
}
.td-video-play {
  height: 100px;
  width: 100px;
  display: inline-block;
  background: rgba(32, 40, 45, 0.4196078431);
  border-radius: 50%;
  text-align: center;
  line-height: 97px;
  color: var(--td-common-white);
}
.td-video-play:hover {
  color: var(--td-common-white);
}
.td-video-page-icon {
  position: absolute;
  left: 0;
  color: var(--td-theme-primary);
  bottom: 100px;
}
@media (max-width: 575px) {
  .td-video-page-icon {
    bottom: -50px;
  }
}
.td-video-page-icon:hover {
  color: var(--td-grey-2);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), 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) {
  .td-video-text-slide-wrap {
    padding-bottom: 0;
  }
}
.td-video-3-slider-content .td-testimonial-slider-title-tr {
  line-height: 1.6;
}
.td-video-3-contact {
  width: 360px;
  position: absolute;
  top: 70px;
  right: 200px;
  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) {
  .td-video-3-contact {
    right: 50px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-video-3-contact {
    position: inherit;
    left: 26px;
  }
}
@media (max-width: 575px) {
  .td-video-3-contact {
    left: 15px;
    width: 320px;
  }
}
.td-video-3-contact-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 40px;
}
.td-video-3-contact-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 0;
}
.td-video-3-contact-icon {
  display: block;
  margin-bottom: 5px;
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  color: var(--td-common-white);
  opacity: 0.6;
}
.td-video-3-contact-item a {
  font-size: 20px;
  line-height: 1.5;
  color: var(--td-common-white);
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  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;
}
.td-video-3-contact-item a:hover {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  background-size: 0 1px, 100% 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;
}
.td-video-3-contact-content {
  padding: 40px;
}
.td-video-4-popup {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  left: 0;
  right: 0;
}
.td-video-4-big-title {
  font-weight: 600;
  font-size: 200px;
  line-height: 1;
  text-align: center;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-common-white);
  -webkit-text-stroke-width: 1px;
  position: absolute;
  bottom: -47px;
  left: 0;
  right: 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) {
  .td-video-4-big-title {
    font-size: 130px;
    bottom: -20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-video-4-logo .td-pulse-border::after, .td-video-4-logo .td-pulse-border::before {
    width: 41%;
    height: 39%;
  }
}
.td-video-5-title {
  font-weight: 500;
  font-size: 64px;
  line-height: 1.16;
  color: var(--td-common-white);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-video-5-title {
    font-size: 48px;
  }
}
@media (max-width: 575px) {
  .td-video-5-title {
    font-size: 41px;
  }
}
.td-video-5-space {
  padding-bottom: 250px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-video-5-space {
    padding-bottom: 140px;
  }
}
.td-video-5-btn .td-btn {
  padding: 19px 24px;
}
.td-video-5-play {
  background: var(--td-surface);
  color: var(--td-theme-primary);
}
.td-video-5-play.td-pulse-border::after {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 1px solid rgb(240, 243, 245);
}
.td-video-5-play.td-pulse-border::before {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 1px solid rgb(240, 243, 245);
}
.td-video-5-play:hover {
  color: var(--td-theme-primary);
}
.td-video-cta-wrap {
  background: var(--td-theme-primary);
  padding: 0px 30px 0px 30px;
  margin-top: -95px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-video-cta-wrap {
    margin-top: 0;
    margin-bottom: 40px;
  }
}
.td-video-cta-content {
  padding: 41px 0px 37px 0px;
}
.td-video-cta-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 1.42;
  color: var(--td-common-white);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-video-cta-title {
    font-size: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-video-cta-title {
    font-size: 16px;
  }
}
.td-video-cta-thumb {
  position: absolute;
  bottom: 0;
  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) {
  .td-video-cta-thumb {
    left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-video-cta-thumb {
    width: 40%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-video-cta-thumb {
    width: 32%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-video-cta-thumb {
    position: inherit;
    width: 50%;
  }
}
.td-video-cta-thumb-2 {
  left: auto;
  right: 30px;
}
@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) {
  .td-video-cta-thumb-2 {
    right: 0;
  }
}
.td-video-cta-thumb img {
  height: 100%;
}
.td-video-cta-btn a {
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  color: var(--td-common-white);
}
.td-video-7-popup {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
}

.td-pulse-border {
  border-radius: 50%;
  z-index: 1;
  position: relative;
}
.td-pulse-border::after, .td-pulse-border::before {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 120%;
  height: 120%;
  border-radius: 50%;
  border: 1px solid rgba(32, 40, 45, 0.4);
  animation: borderanimate2 2s linear infinite;
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  z-index: -1;
  z-index: -1;
}
.td-pulse-border::before {
  animation-delay: 0.7s;
}

/*----------------------------------------*/
/*  7.19 subscribe css
/*----------------------------------------*/
.td-subscribe-shape {
  position: absolute;
  bottom: -68px;
  left: -135px;
  -webkit-animation: rotate-infinite 15s linear infinite;
  animation: rotate-infinite 15s linear infinite;
}
.td-subscribe-title {
  font-weight: 500;
  font-size: 100px;
  line-height: 1.1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-subscribe-title {
    font-size: 80px;
  }
}
@media (max-width: 575px) {
  .td-subscribe-title {
    font-size: 60px;
  }
}
.td-subscribe-title span {
  margin-left: 155px;
}
@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) {
  .td-subscribe-title span {
    margin-left: 0;
  }
}
.td-subscribe-form form {
  position: relative;
}
.td-subscribe-form form input {
  background: none;
  border: none;
  border-bottom: 1px solid var(--td-theme-primary);
  padding-left: 0;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.71;
  color: var(--td-grey-2);
  padding-right: 70px;
}
.td-subscribe-form form input:focus {
  border-bottom: 1px solid var(--td-common-line);
}
.td-subscribe-form form input::placeholder {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.71;
  color: var(--td-grey-2);
}
.td-subscribe-form form button {
  font-weight: 600;
  font-size: 14px;
  color: var(--td-theme-primary);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
@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) {
  .td-subscribe-4-thumb {
    margin-right: 0;
  }
}
.td-subscribe-5-shape {
  position: absolute;
  top: 90px;
  left: 21%;
}
.td-subscribe-5-shape-2 {
  position: absolute;
  bottom: 56px;
  left: 58px;
}
.td-subscribe-5-shape-3 {
  position: absolute;
  top: 56px;
  right: 115px;
}
.td-subscribe-5-shape-4 {
  position: absolute;
  bottom: 50px;
  right: 93px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-subscribe-5-btn {
    margin-top: 20px;
  }
}
.td-subscribe-5-wrap {
  background: var(--td-surface-2);
  padding: 100px 50px 100px 50px;
  margin-bottom: -155px;
}
@media (max-width: 575px) {
  .td-subscribe-5-wrap {
    padding: 50px 20px 50px 20px;
  }
}
.td-subscribe-5-wrap p {
  line-height: 1;
  color: var(--td-grey-2);
  margin-bottom: 27px;
}
.td-subscribe-5-title {
  font-weight: 500;
  font-size: 40px;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--td-theme-primary);
  margin-bottom: 18px;
}
@media (max-width: 575px) {
  .td-subscribe-5-title {
    font-size: 30px;
  }
}
.td-subscribe-5-form {
  display: flex;
  justify-content: center;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-subscribe-5-form {
    flex-wrap: wrap;
  }
}
.td-subscribe-5-input {
  position: relative;
  width: 360px;
  margin-right: 20px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-subscribe-5-input {
    width: 100%;
  }
}
.td-subscribe-5-input input {
  width: 100%;
  height: 52px;
  padding-left: 45px;
  border: 1px solid transparent;
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.06);
}
.td-subscribe-5-input input:focus {
  border: 1px solid var(--td-theme-primary);
}
.td-subscribe-5-input label {
  position: absolute;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
}

/*----------------------------------------*/
/*  7.17 pricing css
/*----------------------------------------*/
.td-pricing-wrap {
  box-shadow: 0 4px 40px 0 rgba(0, 0, 0, 0.08);
  background: var(--td-surface);
  padding: 70px 40px 40px 40px;
}
.td-pricing-wrap-2 {
  background: var(--td-theme-primary);
}
.td-pricing-wrap-2 .td-pricing-tag h5 {
  color: var(--td-common-white);
}
.td-pricing-wrap-2 .td-pricing-tag span {
  color: var(--td-common-white);
}
.td-pricing-wrap-2 .td-pricing-price h2 {
  -webkit-text-fill-color: var(--td-common-white);
  -webkit-text-stroke-color: var(--td-common-white);
}
.td-pricing-wrap-2 .td-pricing-price P {
  color: var(--td-common-white);
}
.td-pricing-tag h5 {
  font-weight: 500;
  font-size: 32px;
  line-height: 1.31;
  color: var(--td-theme-primary);
}
.td-pricing-tag span {
  line-height: 1.6;
  color: var(--td-theme-primary);
  opacity: 0.6;
}
.td-pricing-price h2 {
  font-weight: 500;
  font-size: 80px;
  line-height: 1.12;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-theme-primary);
  -webkit-text-stroke-width: 1px;
}
.td-pricing-price P {
  line-height: 1.62;
  color: var(--td-grey-2);
}
@media (max-width: 575px) {
  .td-pricing-price P br {
    display: none;
  }
}
.td-pricing-btn a {
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  color: var(--td-theme-primary);
  border: 1px solid var(--td-common-line);
  padding: 21px;
  display: block;
  transition: all 0.4s ease;
  width: 100%;
  background: var(--td-surface);
}
.td-pricing-btn-2 a:hover {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-pricing-btn-line {
  position: absolute;
  top: -51px;
}
@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) {
  .td-pricing-btn-line {
    right: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-pricing-btn-line {
    right: 36%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-pricing-btn-line {
    right: 12%;
  }
}
.td-pricing-btn-offer-tag {
  position: absolute;
  top: -43px;
  right: -60px;
}
@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) {
  .td-pricing-btn-offer-tag {
    right: -20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-pricing-btn-offer-tag {
    right: 28%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-pricing-btn-offer-tag {
    right: 0;
  }
}
.td-pricing-btn-offer-tag span {
  border: 1px solid var(--td-theme-primary);
  border-radius: 99px;
  width: 60px;
  height: 60px;
  background: var(--td-surface);
  display: inline-block;
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-2);
  text-align: center;
  padding-top: 15px;
  position: relative;
}
.td-pricing-btn-offer-tag span::before {
  position: absolute;
  content: "";
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background: var(--td-theme-primary);
  bottom: -5px;
  right: -5px;
  z-index: -1;
}
.td-pricing-btn-offer-tag span b {
  color: var(--td-theme-primary);
}
.td-pricing-btn-bg {
  border: 1px solid #dfe7f2;
  border-radius: 40px;
  background: var(--td-surface-2);
  position: relative;
  display: inline-block;
}
.td-pricing-btn-bg button {
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  display: inline-block;
  color: var(--td-theme-primary);
  padding: 31px 51px;
  position: relative;
  z-index: 1;
}
@media (max-width: 575px) {
  .td-pricing-btn-bg button {
    padding: 31px 24px;
  }
}
.td-pricing-btn-bg button:hover {
  color: var(--td-theme-primary);
}
.td-pricing-btn-bg button.active {
  color: var(--td-theme-primary);
}
.td-pricing-btn-bg .test {
  position: absolute;
  transition: transform 0.2s ease-in-out;
  will-change: transform;
  width: 200px;
  height: calc(87% - 8px);
  position: absolute;
  left: 10px;
  top: 10px;
  display: block;
  content: "";
  background: var(--td-surface);
  box-shadow: 0px 2px 2px -1px rgba(89, 86, 233, 0.15), 0px 0px 1px rgba(89, 86, 233, 0.1);
  border-radius: 30px;
  transform: translateX(197px);
}
@media (max-width: 575px) {
  .td-pricing-btn-bg .test {
    width: 145px;
    transform: translateX(150px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-pricing-btn-box {
    justify-content: flex-start !important;
  }
}
.td-pricing-badge {
  font-weight: 500;
  line-height: 1;
  color: var(--td-common-white);
  background: rgba(255, 255, 255, 0.1);
  display: inline-block;
  padding: 10px 13px;
  position: absolute;
  top: 0;
  right: 0;
}

.td-pricing-btn-bg button.monthly.active ~ .test {
  transform: translateX(0px);
}

/*----------------------------------------*/
/* 7.21 team css
/*----------------------------------------*/
.td-team-thumb img {
  border-radius: 50%;
  mix-blend-mode: luminosity;
}
@media (max-width: 575px) {
  .td-team-wrapper {
    margin-right: 15px;
    margin-left: 15px;
  }
}
.td-team-social ul li {
  list-style: none;
  position: absolute;
  bottom: 18px;
  right: 13px;
}
.td-team-social ul li:nth-child(1) a {
  font-size: 22px;
}
.td-team-social ul li:nth-child(2) {
  bottom: 27%;
  right: -23px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  transform: scale(0.6);
  visibility: hidden;
  opacity: 0;
}
.td-team-social ul li:nth-child(3) {
  bottom: 51%;
  right: -25px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  transform: scale(0.5);
  visibility: hidden;
  opacity: 0;
}
.td-team-social ul li:nth-child(4) {
  bottom: 72%;
  right: 7px;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  transform: scale(0.3);
  visibility: hidden;
  opacity: 0;
}
.td-team-social ul li:nth-child(5) {
  bottom: 86%;
  right: 63px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  transform: scale(0.2);
  visibility: hidden;
  opacity: 0;
}
.td-team-social ul li a {
  font-size: 18px;
  width: 60px;
  height: 60px;
  background: var(--td-surface);
  display: inline-block;
  text-align: center;
  line-height: 60px;
  border-radius: 50%;
  box-shadow: 0 0px 18px 0 rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-team-social ul li a {
    width: 50px;
    height: 50px;
    line-height: 50px;
  }
}
.td-team-social ul li a:hover {
  color: var(--td-common-white);
  background: var(--td-theme-primary);
}
.td-team-social ul li a:hover svg {
  fill: var(--td-common-white);
}
.td-team-social ul li a svg {
  width: 18px;
}
.td-team-wrapper:hover .td-team-social ul li {
  list-style: none;
  position: absolute;
  bottom: 18px;
  right: 13px;
}
.td-team-wrapper:hover .td-team-social ul li:nth-child(1) a {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
}
.td-team-wrapper:hover .td-team-social ul li:nth-child(2) {
  bottom: 27%;
  right: -23px;
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
.td-team-wrapper:hover .td-team-social ul li:nth-child(3) {
  bottom: 51%;
  right: -25px;
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-team-wrapper:hover .td-team-social ul li:nth-child(3) {
    bottom: 53%;
  }
}
.td-team-wrapper:hover .td-team-social ul li:nth-child(4) {
  bottom: 72%;
  right: 7px;
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-team-wrapper:hover .td-team-social ul li:nth-child(4) {
    bottom: 73%;
  }
}
.td-team-wrapper:hover .td-team-social ul li:nth-child(5) {
  bottom: 86%;
  right: 63px;
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-team-wrapper:hover .td-team-social ul li:nth-child(5) {
    right: 53px;
  }
}
.td-team-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 117%;
  margin-bottom: 4px;
}
.td-team-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-team-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-team-designation {
  line-height: 100%;
  color: var(--td-grey-2);
}
.td-team-4-content {
  position: absolute;
  bottom: 0;
  left: 40px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-team-4-content {
    left: 20px;
  }
}
.td-team-4-content span {
  line-height: 1;
  color: var(--td-common-white);
  opacity: 0.7;
  display: inline-block;
  margin-bottom: 13px;
}
.td-team-4-thumb span {
  background: linear-gradient(180deg, rgba(32, 40, 45, 0) 0%, #20282d 100%);
  position: absolute;
  width: 100%;
  display: block;
  height: 0;
  left: 0;
  bottom: 0;
  transition: all 0.4s ease;
}
.td-team-4-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  color: var(--td-common-white);
}
.td-team-4-title a {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  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;
}
.td-team-4-title a:hover {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  background-size: 0 1px, 100% 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;
}
.td-team-4-social {
  position: absolute;
  top: 40px;
  right: 40px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-team-4-social {
    top: 15px;
    right: 15px;
  }
}
.td-team-4-social span {
  font-size: 16px;
  color: var(--td-theme-primary);
  background: var(--td-surface);
  height: 50px;
  width: 50px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  text-align: center;
  line-height: 49px;
  display: inline-block;
  border-radius: 50%;
  margin-bottom: 10px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .td-team-4-social span {
    height: 40px;
    width: 40px;
    line-height: 39px;
  }
}
.td-team-4-social ul li {
  list-style: none;
}
.td-team-4-social ul li:nth-child(1) {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  transform: scale(0.6);
  visibility: hidden;
  opacity: 0;
}
.td-team-4-social ul li:nth-child(2) {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  transform: scale(0.6);
  visibility: hidden;
  opacity: 0;
}
.td-team-4-social ul li:nth-child(3) {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  transform: scale(0.5);
  visibility: hidden;
  opacity: 0;
}
.td-team-4-social ul li:nth-child(4) {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  transform: scale(0.3);
  visibility: hidden;
  opacity: 0;
}
.td-team-4-social ul li a {
  font-size: 16px;
  color: var(--td-common-white);
  height: 50px;
  width: 50px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  text-align: center;
  line-height: 49px;
  display: inline-block;
  border-radius: 50%;
  margin-bottom: 10px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .td-team-4-social ul li a {
    height: 40px;
    width: 40px;
    line-height: 39px;
    margin-bottom: 4px;
  }
}
.td-team-4-social ul li a:hover {
  background: var(--td-surface);
  color: var(--td-theme-primary);
}
.td-team-4-social ul li a:hover svg {
  fill: var(--td-theme-primary);
}
.td-team-4-social ul li a svg {
  width: 16px;
  fill: var(--td-common-white);
}
.td-team-4-item:hover .td-team-4-social ul li:nth-child(1) {
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
.td-team-4-item:hover .td-team-4-social ul li:nth-child(2) {
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
.td-team-4-item:hover .td-team-4-social ul li:nth-child(3) {
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
.td-team-4-item:hover .td-team-4-social ul li:nth-child(4) {
  transform: scale(1);
  visibility: visible;
  opacity: 1;
}
.td-team-4-item:hover .td-team-4-content {
  visibility: visible;
  opacity: 1;
  bottom: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .td-team-4-item:hover .td-team-4-content {
    bottom: 10px;
  }
}
.td-team-4-item:hover .td-team-4-thumb span {
  height: 100%;
}
@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) {
  .td-team-4-title-wrap {
    margin-left: 15px;
  }
  .td-team-4-title-wrap .td-section-title {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-team-4-title-wrap {
    margin: 30px 15px;
  }
}
.td-team-4-top-social a {
  width: 52px;
  height: 52px;
  border: 1px solid var(--td-common-line);
  display: inline-block;
  text-align: center;
  line-height: 52px;
  color: var(--td-theme-primary);
  margin-right: 7px;
}
.td-team-4-top-social a:hover {
  color: var(--td-common-white);
  background: var(--td-theme-primary);
}
.td-team-5-border {
  border-top: 1px solid #d9d9d9;
}
@media (max-width: 575px) {
  .td-team-5-bottom-btn {
    text-align: left;
  }
}
.td-team-5-bottom-para p {
  margin-bottom: 0;
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-team-5-bottom-border {
  border-top: 1px solid #d9d9d9;
}
.td-team-5-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  color: var(--td-theme-primary);
}
@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) {
  .td-team-5-title {
    font-size: 28px;
  }
}
.td-team-5-position {
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-2);
}
.td-team-5-thumb {
  overflow: hidden;
}
.td-team-5-thumb img {
  -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;
}
.td-team-5-wrap:hover .td-team-5-social span::before {
  width: 100%;
  right: auto;
  left: 0;
}
.td-team-5-wrap:hover .td-team-5-thumb img {
  transform: scale(1.1);
}
.td-team-5-social span {
  height: 1px;
  width: 100%;
  display: inline-block;
  background: var(--td-common-line);
  margin-top: 30px;
  position: relative;
}
.td-team-5-social span::before {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  background: var(--td-theme-primary);
  transition: all 0.4s ease;
}
.td-team-5-social ul {
  margin-top: 10px;
}
.td-team-5-social ul li {
  list-style: none;
  display: inline-block;
  margin-right: 26px;
}
.td-team-5-social ul li a {
  font-size: 16px;
  color: var(--td-grey-2);
}
.td-team-5-social ul li a svg {
  width: 16px;
  fill: var(--td-grey-2);
}

/*----------------------------------------*/
/* 7.3 brands css
/*----------------------------------------*/
.td-brand-slide .swiper-slide {
  width: 262px !important;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-brand-slide .swiper-slide {
    width: 150px !important;
  }
}
.td-brand-slide .swiper-wrapper {
  padding-bottom: 90px;
  padding-top: 20px;
}
.td-brand-single-logo a {
  padding: 45px 10px;
  background: var(--td-surface);
  display: inline-block;
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.06);
  width: 100%;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-brand-single-logo a {
    padding: 25px 15px;
  }
  .td-brand-single-logo a img {
    width: 100%;
  }
}
.td-brand-map {
  position: absolute;
  top: 0;
  left: -47px;
  opacity: 0.1;
  z-index: -1;
  width: 100%;
}
.td-brand-logo-wrap-2 {
  padding: 135px 20px;
  height: 100%;
}
.td-brand-logo-wrap-space {
  padding: 92px 20px;
}
.td-brand-logo-border {
  border: 1px solid var(--td-common-line);
  margin-right: -1px;
  margin-top: -1px;
}
.td-brand-shape {
  position: absolute;
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 57px;
  background: var(--td-surface);
  z-index: 3;
}
.td-brand-shape-position {
  top: -23px;
  left: -25px;
}
.td-brand-shape-position-2 {
  top: -23px;
  right: -25px;
}
.td-brand-shape-position-3 {
  bottom: -27px;
  right: -25px;
}
.td-brand-shape-position-4 {
  bottom: -27px;
  left: -25px;
}
.td-brand-shape i {
  font-size: 30px;
  color: rgba(102, 102, 102, 0.2);
}
.td-brand-counter-pre {
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-2);
}
.td-brand-counter-title {
  font-weight: 500;
  font-size: 80px;
  line-height: 1.12;
  margin-bottom: 0;
}

/*----------------------------------------*/
/*  7.5 chose css
/*----------------------------------------*/
@media (max-width: 575px) {
  .td-chose-item {
    margin-left: 0;
  }
}
.td-chose-item:hover .td-chose-icon {
  animation-name: tdshake;
  animation-timing-function: ease-in-out;
  animation-duration: 0.4s;
  animation-iteration-count: 1;
  transition: all 0.4s ease;
}
.td-chose-top-border {
  border-top: 1px solid var(--td-theme-primary);
}
.td-chose-content p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-chose-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
}
.td-chose-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-chose-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}

/*----------------------------------------*/
/*  7.16 portfolio css
/*----------------------------------------*/
.td-portfolio-wrap:hover .td-poerfolio-thumb img {
  transform: scale(1.1);
}
.td-portfolio-cetagory span {
  display: inline-block;
  font-size: 14px;
  line-height: 143%;
  color: var(--td-theme-primary);
  border: 1px solid var(--td-common-line);
  border-radius: 96px;
  padding: 9px 19px;
  margin-right: 7px;
}
@media (max-width: 575px) {
  .td-portfolio-cetagory span {
    margin-bottom: 10px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-space {
    padding-bottom: 100px;
  }
}
.td-portfolio-title {
  font-weight: 500;
  font-size: 32px;
  line-height: 131%;
}
@media (max-width: 575px) {
  .td-portfolio-title {
    font-size: 26px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-title-wrap {
    margin-bottom: 40px;
  }
}
.td-portfolio-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-portfolio-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-portfolio-tab-btn {
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  color: var(--td-grey-2);
  padding: 0;
  margin-right: 40px;
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-portfolio-tab-btn {
    margin-right: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-portfolio-tab-btn {
    margin-bottom: 20px;
  }
}
.td-portfolio-tab-btn:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
  color: var(--td-theme-primary);
}
.td-portfolio-tab-btn.active {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
  color: var(--td-theme-primary);
}
.td-portfolio-slider-active {
  margin-right: -390px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-portfolio-slider-active {
    margin-right: -190px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-portfolio-slider-active {
    margin-right: 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) {
  .td-portfolio-right-btn {
    text-align: left !important;
  }
}
.td-portfolio-2-wrap:hover .td-portfolio-2-title::before {
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.td-portfolio-2-title {
  font-weight: 500;
  font-size: 80px;
  line-height: 1.12;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-portfolio-2-title {
    font-size: 55px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-portfolio-2-title {
    font-size: 44px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-2-title {
    font-size: 35px;
  }
}
.td-portfolio-2-title-pre {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.62;
  margin-right: 10px;
}
.td-portfolio-2-content {
  padding: 41px 0px;
}
.td-portfolio-2-content:hover {
  z-index: 3;
}
.td-portfolio-2-content:hover .td-portfolio-2-thumb-inner {
  opacity: 1;
  visibility: visible;
  transform: translateX(-20px);
}
.td-portfolio-2-icon {
  border-radius: 150px;
  width: 100px;
  height: 100px;
  background: var(--td-surface);
  position: absolute;
  right: 30px;
  top: 30px;
  text-align: center;
  line-height: 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) {
  .td-portfolio-2-icon {
    line-height: 60px;
    width: 60px;
    height: 60px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-2-icon {
    right: 10px;
    top: 10px;
  }
}
.td-portfolio-2-thumb img {
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.1);
  border: 4px solid var(--td-common-white);
}
@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) {
  .td-portfolio-2-thumb img {
    width: 350px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-2-thumb img {
    width: 200px;
  }
}
.td-portfolio-2-thumb-inner {
  position: absolute;
  top: -160px;
  right: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-80px);
  -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;
  z-index: -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) {
  .td-portfolio-2-thumb-inner {
    top: -60px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-2-thumb-inner {
    top: -10px;
  }
}
.td-portfolio-2-border {
  border-bottom: 1px solid var(--td-common-line);
}
.td-portfolio-4-tag a {
  border: 1px solid var(--td-common-line);
  padding: 5px 8px;
  background: var(--td-surface);
  font-family: var(--font-family);
  font-size: 14px;
  line-height: 1;
  text-transform: uppercase;
  display: inline-block;
  color: var(--td-theme-primary);
  margin-right: 5px;
}
.td-portfolio-4-title {
  font-weight: 500;
  font-size: 32px;
  line-height: 1.31;
  color: var(--td-theme-primary);
}
.td-portfolio-4-title a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-portfolio-4-title a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}
.td-portfolio-4-slider-active {
  overflow: visible;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-portfolio-5-tab-content {
    padding-top: 0;
  }
}
.td-portfolio-5-tab-content p {
  line-height: 1.5;
  color: var(--td-grey-2);
}
.td-portfolio-5-tab-list button {
  font-weight: 600;
}
.td-portfolio-5-content {
  position: absolute;
  bottom: 0;
  left: 40px;
  right: 40px;
  opacity: 0;
  visibility: hidden;
}
.td-portfolio-5-item:hover .td-portfolio-5-thumb img {
  transform: scale(1.1);
}
.td-portfolio-5-item:hover .td-portfolio-5-thumb span {
  visibility: visible;
  opacity: 1;
  -webkit-transform: perspective(600px) rotateY(0deg);
  -moz-transform: perspective(600px) rotateY(0deg);
  -ms-transform: perspective(600px) rotateY(0deg);
  -o-transform: perspective(600px) rotateY(0deg);
  transform: perspective(600px) rotateY(0deg);
}
.td-portfolio-5-item:hover .td-portfolio-5-content {
  bottom: 30px;
  opacity: 1;
  visibility: visible;
}
.td-portfolio-5-thumb {
  position: relative;
  overflow: hidden;
}
.td-portfolio-5-thumb img {
  width: 100%;
}
.td-portfolio-5-thumb span {
  position: absolute;
  background: linear-gradient(180deg, rgba(32, 40, 45, 0) 0%, #20282d 100%);
  opacity: 0.8;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-transform: perspective(500px) rotateY(20deg);
  -moz-transform: perspective(500px) rotateY(20deg);
  -ms-transform: perspective(500px) rotateY(20deg);
  -o-transform: perspective(500px) rotateY(20deg);
  transform: perspective(500px) rotateY(20deg);
  visibility: hidden;
}
.td-portfolio-5-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  color: var(--td-common-white);
}
@media (max-width: 575px) {
  .td-portfolio-5-title {
    font-size: 24px;
  }
}
.td-portfolio-5-title a {
  background-image: linear-gradient(white, white), linear-gradient(white, white);
  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;
}
.td-portfolio-5-title a:hover {
  background-image: linear-gradient(white, white), linear-gradient(white, white);
  background-size: 0 1px, 100% 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;
}
.td-portfolio-5-title-pre {
  font-size: 14px;
  line-height: 1;
  color: var(--td-common-white);
  opacity: 0.7;
  margin-bottom: 12px;
  display: inline-block;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-portfolio-wrap {
    margin-left: 0;
    margin-right: 0;
  }
}
.td-portfolio-details-title {
  font-weight: 500;
  font-size: 64px;
  line-height: 1.16;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-portfolio-details-title {
    font-size: 55px;
  }
}
@media (max-width: 575px) {
  .td-portfolio-details-title {
    font-size: 40px;
  }
}
@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) {
  .td-portfolio-details-text {
    margin-right: 0;
  }
}
.td-portfolio-details-text p {
  line-height: 1.62;
  color: var(--tp-grey-2);
}
.td-portfolio-details-tab .td-portfolio-tab-btn {
  font-weight: 500;
  font-size: 24px;
  line-height: 100%;
  color: #999;
  margin-bottom: 0;
  padding-bottom: 18px;
  margin-right: 10px;
  padding-right: 30px;
}
@media (max-width: 575px) {
  .td-portfolio-details-tab .td-portfolio-tab-btn {
    padding-right: 10px;
    padding-bottom: 5px;
    margin-bottom: 15px;
  }
}
.td-portfolio-details-tab .td-portfolio-tab-btn.active {
  color: var(--td-theme-primary);
}
.td-portfolio-details-tab-content p {
  line-height: 1.62;
  color: var(--td-grey-2);
  margin-bottom: 38px;
}
.td-portfolio-details-tab .td-portfolio-tab-btn-list {
  border-bottom: 1px solid #d9d9d9;
  margin-bottom: 37px;
}
.td-portfolio-navigation {
  border-top: 1px solid var(--td-common-line);
  padding-top: 40px;
}
.td-portfolio-more-icon {
  border: 1px solid var(--td-common-line);
  height: 36px;
  width: 36px;
  display: inline-block;
  text-align: center;
  line-height: 36px;
  color: var(--td-theme-primary);
  transition: all 0.4s ease;
}
.td-portfolio-more-icon:hover {
  color: var(--td-common-white);
  background: var(--td-theme-primary);
}
.td-portfolio-more-content {
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-portfolio-more-content:hover {
  color: var(--td-grey-2);
}
@media (max-width: 575px) {
  .td-portfolio-more-menu {
    text-align: left !important;
  }
}
@media (max-width: 575px) {
  .td-portfolio-more-left {
    text-align: left !important;
  }
}
.td-portfolio-case-details-wrap {
  background: var(--td-surface-2);
  padding: 50px 50px 40px 50px;
  margin-left: 10px;
}
@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) {
  .td-portfolio-case-details-wrap {
    margin-left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-portfolio-case-details-wrap {
    padding: 50px 30px 40px 30px;
  }
}
.td-portfolio-case-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
  border-bottom: 1px solid #d2dae7;
  padding-bottom: 20px;
}
.td-portfolio-case-info span {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  color: var(--td-theme-primary);
}
.td-portfolio-case-list-item {
  border-bottom: 1px solid #d2dae7;
  margin-bottom: 10px;
  padding-bottom: 10px;
}
.td-portfolio-case-social ul li {
  list-style: none;
  display: inline-block;
  margin-right: 6px;
}
.td-portfolio-case-social ul li a {
  font-size: 14px;
  color: var(--td-grey-2);
}
.td-portfolio-case-social ul li a:hover {
  color: var(--td-theme-primary);
}
.td-portfolio-case-social ul li a:hover svg {
  fill: var(--td-theme-primary);
}
.td-portfolio-case-social ul li a svg {
  width: 14px;
  fill: var(--td-grey-2);
  transition: all 0.4s ease;
  transform: translateY(-2px);
}
.td-portfolio-case-location span {
  font-weight: 500;
  line-height: 1;
  color: var(--td-grey-2);
}

.td-poerfolio-thumb {
  overflow: hidden;
  transition: all 0.4s ease;
}
.td-poerfolio-thumb img {
  transition: all 0.4s ease;
}

/*----------------------------------------*/
/*  7.9 error css start
/*----------------------------------------*/
.td-error-title {
  font-weight: 700;
  font-size: 300px;
  line-height: 1;
  letter-spacing: -0.02em;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-common-white);
  -webkit-text-stroke-width: 1px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-error-title {
    font-size: 200px;
  }
}
@media (max-width: 575px) {
  .td-error-title {
    font-size: 150px;
  }
}
.td-error-text {
  font-weight: 600;
  font-size: 48px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--td-common-white);
}
@media (max-width: 575px) {
  .td-error-text {
    font-size: 40px;
  }
}
.td-error-spacing {
  padding-top: 250px;
  padding-bottom: 258px;
}
@media (max-width: 575px) {
  .td-error-spacing {
    padding-top: 200px;
    padding-bottom: 170px;
  }
}

/*----------------------------------------*/
/* 7.11 faq css
/*----------------------------------------*/
.td-faq-badge {
  position: absolute;
  top: 60px;
  left: -80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-faq-badge {
    left: -40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-faq-badge {
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    top: -66px;
  }
}
.td-faq-shape {
  position: absolute;
  bottom: -78px;
  right: -85px;
  transform: rotate(95deg);
}
@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) {
  .td-faq-shape {
    right: -50px;
  }
}
.td-faq-para {
  padding: 0px 24px 8px 24px;
}
@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) {
  .td-faq-thumb {
    margin-right: 0;
  }
}
.td-faq-wrapper .accordion-button:not(.collapsed) {
  color: var(--td-theme-primary);
  background: none;
  border: none;
  box-shadow: none;
}
.td-faq-wrapper .accordion-item {
  border-top: 1px solid transparent;
}
.td-faq-wrapper .accordion-item:first-of-type {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.td-faq-wrapper .accordion-button::after {
  display: none;
}
.td-faq-wrapper .tp-pricing-accordion {
  border: none;
}
.td-faq-wrapper .accordion {
  --bs-accordion-border-width: 0;
  --bs-accordion-btn-icon: none;
  --bs-accordion-btn-active-icon: none;
  --bs-accordion-bg: none;
}
.td-faq-btn-2 {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  color: var(--td-theme-primary);
  padding: 18px 10px 18px 24px;
}
.td-faq-btn-2:focus {
  z-index: 3;
  box-shadow: none;
  border: none;
}
.td-faq-active {
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.1);
  background: var(--td-surface);
  border-top: 1px solid var(--td-theme-primary) !important;
  margin-bottom: 35px;
}
.td-faq-bg-pattern {
  position: absolute;
  bottom: -217px;
  left: 0;
  z-index: -1;
}
.td-faq-para p {
  line-height: 1.62;
  color: var(--td-theme-primary);
}
.td-faq-4-accordion {
  border-radius: 0;
  --bs-accordion-border-radius: 0;
  --bs-accordion-inner-border-radius: 0;
}
.td-faq-4-item {
  margin-bottom: 30px;
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.1);
  background: var(--td-surface);
}
.td-faq-4-item .td-faq-para {
  padding: 12px 40px 24px 40px;
}
.td-faq-4-item .td-faq-4-btn {
  border-top: 1px solid transparent;
  padding: 25px 65px 25px 40px;
  transition: all 0.4s ease;
}
@media (max-width: 575px) {
  .td-faq-4-item .td-faq-4-btn {
    padding: 25px 65px 25px 20px;
  }
}
.td-faq-4-item .td-faq-4-btn .accordion-btn {
  position: absolute;
  right: 0;
  top: 75%;
  transform: translateY(-50%);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-faq-4-item .td-faq-4-btn .accordion-btn {
    top: 67%;
  }
}
.td-faq-4-item .td-faq-4-btn .accordion-btn i {
  position: absolute;
  top: -10px;
  right: 31px;
}
.td-faq-4-item .td-faq-4-btn .accordion-btn .td-up {
  opacity: 1;
  transition: all 0.4s ease;
}
.td-faq-4-item .td-faq-4-btn .accordion-btn .td-down {
  opacity: 0;
  transition: all 0.4s ease;
}
.td-faq-4-item .td-faq-4-btn.collapsed .accordion-btn .td-down {
  color: var(--td-theme-primary);
  opacity: 0.2;
  transition: all 0.4s ease;
}
.td-faq-4-item .td-faq-4-btn.collapsed .accordion-btn .td-up {
  opacity: 0;
  color: var(--td-theme-primary);
  transition: all 0.4s ease;
}
.td-faq-5-thumb {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 43.6%;
}
@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) {
  .td-faq-5-thumb {
    width: 100%;
    height: 100%;
    position: inherit;
  }
}
.td-faq-5-thumb img {
  width: 100%;
  object-fit: cover;
}
@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) {
  .td-faq-5-thumb img {
    height: 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) {
  .td-faq-5-thumb {
    padding-bottom: 30px;
  }
}
.td-faq-5-item {
  margin-bottom: 0;
  box-shadow: none;
}
.td-faq-5-item .td-faq-para {
  padding: 0px;
  padding-right: 60px;
  padding-bottom: 10px;
}
@media (max-width: 575px) {
  .td-faq-5-item .td-faq-para {
    padding-right: 10px;
  }
}
.td-faq-5-wrapper {
  margin-left: 65px;
  margin-top: -150px;
}
@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) {
  .td-faq-5-wrapper {
    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) {
  .td-faq-5-wrapper {
    margin-top: 0;
  }
}
.td-faq-5-wrapper .td-faq-5-item {
  border-top: 0 0 !important;
  border: none;
  border-bottom: 1px solid var(--td-common-line);
}
.td-faq-5-wrapper .td-faq-5-item:focus {
  border: 0;
}
.td-faq-5-wrapper .td-faq-5-item.td-faq-active {
  border-top: 0 !important;
  border-bottom: 1px solid var(--td-theme-primary);
}
.td-faq-5-accordion {
  background: var(--td-surface);
  padding: 10px 40px 50px 40px;
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.06);
}
@media (max-width: 575px) {
  .td-faq-5-accordion {
    padding: 10px 20px 50px 20px;
  }
}
.td-faq-5-btn {
  border-top: 0 !important;
  padding: 30px 0 !important;
}
@media (max-width: 575px) {
  .td-faq-5-btn {
    padding-right: 20px !important;
  }
}
.td-faq-5-btn .accordion-btn i {
  right: -9px !important;
}

/*----------------------------------------*/
/* 7.15 panel css
/*----------------------------------------*/
.row-custom {
  display: flex;
  margin: 0 -15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .row-custom {
    padding: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .row-custom {
    flex-direction: column;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }
}

.col-custom {
  flex: 0.4;
  width: 80px;
  height: 760px;
  background-size: cover;
  margin: 0px 15px;
  background: var(--td-surface-2);
  padding: 23px 30px;
  transition: 0.5s;
  overflow: hidden;
  cursor: pointer;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .col-custom {
    height: 620px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .col-custom {
    height: 650px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .col-custom {
    padding: 40px 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .col-custom {
    padding: 40px 25px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .col-custom {
    width: 100%;
    padding: 40px 30px;
    margin-bottom: 30px;
    height: 100%;
  }
}
.col-custom.active {
  flex: 7;
  padding: 0;
}
.col-custom.active .td-panel-item {
  display: none;
}
.col-custom.active .td-panel-item-2 {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition-delay: 0.3s;
  transition: 0.3s;
}

.td-platform-inner .td-panel-title {
  color: var(--td-common-black);
}
.td-platform-inner .td-panel-content span {
  color: var(--td-common-black);
}
.td-platform-inner .td-panel-content-2 span {
  color: var(--td-common-black);
}
.td-platform-inner .td-panel-title-2 {
  color: var(--td-common-black);
}
.td-platform-inner .td-panel-content-2 p {
  color: var(--td-common-black);
}

.td-panel-title {
  width: 200px;
  font-weight: 500;
  line-height: 20px;
  color: var(--td-common-black);
  margin-bottom: 0;
  font-size: 24px;
}
.td-panel-title.child-one {
  transform: rotate(-90deg) translate(-462px, -94px);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-panel-title.child-one {
    transform: rotate(-90deg) translate(-342px, -94px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-panel-title.child-one {
    transform: rotate(-90deg) translate(-367px, -94px);
  }
}
.td-panel-title.child-two {
  transform: rotate(-90deg) translate(-469px, -94px);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-panel-title.child-two {
    transform: rotate(-90deg) translate(-350px, -94px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-panel-title.child-two {
    transform: rotate(-90deg) translate(-375px, -94px);
  }
}
.td-panel-title.child-three {
  transform: rotate(-90deg) translate(-452px, -94px);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-panel-title.child-three {
    transform: rotate(-90deg) translate(-332px, -94px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-panel-title.child-three {
    transform: rotate(-90deg) translate(-357px, -94px);
  }
}

.td-panel-content {
  text-align: center;
}
.td-panel-content span {
  line-height: 28px;
  margin-left: -7px;
  font-weight: 500;
  font-size: 32px;
  color: var(--td-theme-primary);
}

.td-panel-content-2 p {
  line-height: 150%;
  color: var(--td-grey-2);
}

.td-panel-title-2 {
  transform: translateY(5px);
  visibility: hidden;
  opacity: 0;
  transition-delay: 0.2s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.td-panel-btn {
  transform: translateY(5px);
  visibility: hidden;
  opacity: 0;
  transition-delay: 0.2s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.col-custom.active .td-panel-btn {
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
  transition-delay: 0.5s;
  display: inline-block;
}

.td-panel-shape {
  transform: translateY(5px);
  visibility: hidden;
  opacity: 0;
  transition-delay: 0.2s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.col-custom.active .td-panel-shape {
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
  transition-delay: 0.5s;
}

.td-panel-content-2 p {
  transform: translateY(5px);
  visibility: hidden;
  opacity: 0;
  transition-delay: 0.2s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.col-custom.active .td-panel-title-2 {
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
  transition-delay: 0.5s;
}

.col-custom.active .td-panel-content-2 p {
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
  transition-delay: 0.6s;
}
@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) {
  .col-custom.active .td-panel-content-2 p {
    margin-bottom: 50px;
  }
}

.td-panel-title-2 {
  font-weight: 500;
  font-size: 26px;
  line-height: 131%;
}
.td-panel-title-2 a {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-panel-title-2 a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
}

.td-panel-item-2 {
  opacity: 0;
  visibility: hidden;
  transform: scale(0.7);
}

.td-panel-shape {
  position: absolute;
  bottom: -14px;
  right: 0;
  font-weight: 700;
  font-size: 150px;
  line-height: 1;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: rgba(151, 151, 151, 0.1);
  -webkit-text-stroke-width: 1px;
  opacity: 0.4;
}
@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) {
  .td-panel-shape {
    font-size: 100px;
  }
}

.td-panel-content-inner {
  padding: 24px 30px 30px 30px;
}
@media (max-width: 575px) {
  .td-panel-content-inner {
    padding: 24px 15px 30px 15px;
  }
}

/*----------------------------------------*/
/*  7.2 awards css
/*----------------------------------------*/
.td-awards-content span {
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  color: var(--td-grey-2);
  margin-right: 100px;
}
@media (max-width: 575px) {
  .td-awards-content span {
    margin-right: 20px;
  }
}
.td-awards-btn {
  color: #D9D9D9;
}
.td-awards-title {
  font-weight: 500;
  font-size: 32px;
  line-height: 131%;
  color: var(--td-theme-primary);
  margin-bottom: 0;
}
@media (max-width: 575px) {
  .td-awards-title {
    font-size: 22px;
  }
}
.td-awards-wrapper {
  padding: 40px 0 20px 0px;
  border-bottom: 1px solid var(--td-common-line);
  position: relative;
}
.td-awards-wrapper::before {
  position: absolute;
  content: "";
  width: 0;
  height: 1px;
  bottom: 0;
  right: 0;
  background: var(--td-theme-primary);
  -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;
}
.td-awards-wrapper:hover::before {
  width: 100%;
  right: inherit;
  left: 0;
}
.td-awards-wrapper:hover .td-awards-thumb img {
  visibility: visible;
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.td-awards-wrapper:hover .td-awards-btn {
  color: var(--td-theme-primary);
}
.td-awards-thumb {
  display: inline-block;
  position: absolute;
  top: -34%;
  left: 600px;
  transform-origin: center;
  z-index: 9999999;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-awards-thumb {
    left: 450px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .td-awards-thumb {
    top: -45px;
    left: 324px;
    width: 200px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-awards-thumb {
    top: -14px;
    left: 324px;
    width: 200px;
  }
}
@media (max-width: 575px) {
  .td-awards-thumb {
    top: -14px;
    left: 156px;
    width: 153px;
  }
}
.td-awards-thumb img {
  border-radius: 6px;
  filter: drop-shadow(0px 30px 20px rgba(0, 6, 40, 0.16));
  visibility: hidden;
  transform: scale(0.6);
  opacity: 0;
  transition: all 0.4s ease;
}
.td-awards-meta span {
  color: var(--td-grey-2);
  display: flex;
}
.td-awards-meta i {
  color: var(--td-theme-primary);
  margin-right: 14px;
  transform: translateY(5px);
}

/*----------------------------------------*/
/*  7.7 counter
/*----------------------------------------*/
@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) {
  .td-counter-content {
    margin-right: 30px;
    margin-left: 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-counter-content {
    margin-right: 30px;
    margin-left: 30px;
    margin-top: 30px;
  }
}
@media (max-width: 575px) {
  .td-counter-content {
    margin-right: 15px;
    margin-left: 15px;
    margin-top: 30px;
  }
}
.td-counter-content p {
  font-weight: 500;
  font-size: 24px;
  line-height: 175%;
  color: var(--td-theme-primary);
}
@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) {
  .td-counter-content p {
    font-size: 18px;
  }
}
.td-counter-content p span {
  font-weight: 700;
}
.td-counter-single-border {
  position: relative;
  padding-bottom: 37px;
}
@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) {
  .td-counter-single-border {
    margin-right: 30px;
    margin-bottom: 0;
    padding: 0;
  }
  .td-counter-single-border::before {
    display: none;
  }
}
.td-counter-single-border::before {
  position: absolute;
  content: "";
  height: 1px;
  width: 190px;
  bottom: 0;
  background: var(--td-common-line);
  left: 0;
}
.td-counter-thumb {
  height: 100%;
}
.td-counter-thumb img {
  height: 100%;
  object-fit: cover;
}
@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) {
  .td-counter-thumb {
    margin-bottom: 40px;
  }
}
.td-counter-count {
  font-weight: 500;
  font-size: 64px;
  line-height: 116%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-counter-count-wrap {
    margin-top: 30px;
  }
}
@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) {
  .td-counter-count-wrap {
    margin-left: 30px;
    display: flex;
  }
}
@media (max-width: 575px) {
  .td-counter-count-wrap {
    margin-right: 15px;
    margin-left: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-counter-count-wrap-2 {
    margin-left: 0;
  }
}
.td-counter-count-para {
  line-height: 150%;
  color: var(--td-grey-2);
}
.td-counter-map {
  position: absolute;
  right: 0;
  bottom: 88px;
  z-index: -1;
}
.td-counter-logo {
  width: 100px;
  height: 100px;
  display: inline-block;
  background: var(--td-surface);
  position: absolute;
  right: -50px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  text-align: center;
  box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.1);
  z-index: 3;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-counter-logo {
    right: 0;
    left: 0;
    margin: 0 auto;
  }
}
.td-counter-logo h3 {
  font-weight: 700;
  font-size: 36px;
  line-height: 100%;
  margin-top: 30px;
}

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

/*----------------------------------------*/
/* 7.24 work css
/*----------------------------------------*/
.td-work-progress {
  padding-right: 70px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-work-progress {
    padding-right: 0;
  }
}
.td-work-progress-title {
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0px;
  color: var(--td-theme-primary);
  margin-bottom: 8px;
}
.td-work-progress-inner {
  background: var(--td-common-line);
  width: 100%;
  height: 2px;
  position: relative;
}
.td-work-progress-bar {
  overflow: visible;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 2px;
  text-align: center;
  white-space: nowrap;
  background-color: var(--td-theme-primary);
  transition: 0.6s ease;
  position: relative;
}
.td-work-progress-counter {
  letter-spacing: 0px;
  color: var(--td-theme-primary);
  font-weight: 600;
  font-size: 16px;
  position: absolute;
  top: -24px;
  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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-work-content {
    padding-left: 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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-work-thumb {
    padding-right: 0;
  }
}
.td-work-thumb img {
  height: 100%;
  object-fit: cover;
}
.td-work-area-border {
  position: relative;
  border-top: 1px solid var(--td-theme-primary);
  border-bottom: 1px solid var(--td-theme-primary);
}
.td-work-area-border::before {
  position: absolute;
  content: "";
  width: 0.2px;
  height: 100%;
  background: var(--td-theme-primary);
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

/*----------------------------------------*/
/* 7.10 expreance css
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-expreance-big-title svg {
    width: 500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-expreance-big-title svg {
    width: 300px;
    height: 400px;
  }
}
@media (max-width: 575px) {
  .td-expreance-big-title svg {
    width: 160px;
    height: 330px;
  }
}
.td-expreance-big-title svg path {
  fill: var(--td-common-white);
  stroke: var(--td-theme-primary);
}
.td-expreance-big-title-wrap {
  display: flex;
  align-items: flex-start;
}
.td-expreance-big-title-wrap span {
  font-weight: 500;
  font-size: 48px;
  line-height: 1.2;
  color: var(--td-theme-primary);
  margin-top: -10px;
  margin-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) {
  .td-expreance-big-title-wrap span {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-expreance-big-title-wrap span {
    font-size: 27px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-expreance-big-title-wrap span {
    margin-left: 20px;
  }
}
@media (max-width: 575px) {
  .td-expreance-big-title-wrap span {
    margin-left: 10px;
    transform: translateY(67px);
  }
}
.td-expreance-top {
  margin-bottom: -200px;
}
.td-expreance-main-title {
  font-weight: 500;
  font-size: 64px;
  line-height: 1.16;
  color: var(--td-common-white);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-expreance-main-title {
    font-size: 55px;
  }
}
@media (max-width: 575px) {
  .td-expreance-main-title {
    font-size: 50px;
    position: relative;
    z-index: 1;
  }
}
.td-expreance-main-title-pre p {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.62;
  color: var(--td-common-white);
  opacity: 0.7;
  margin-top: 63px;
}
.td-expreance-title {
  font-weight: 500;
  font-size: 40px;
  line-height: 1.25;
  color: var(--td-common-white);
  margin-bottom: 0;
  position: relative;
  z-index: 1;
  display: flex;
  align-items: end;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
  .td-expreance-title {
    font-size: 30px;
  }
}
.td-expreance-title span {
  font-family: var(--tp-ff-poppins);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: #6e8289;
  margin-right: 18px;
  -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;
  margin-bottom: 2px;
}
.td-expreance-title-pre {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.62;
  color: var(--td-common-white);
  margin-bottom: 0;
  margin-left: 37px;
  -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;
  opacity: 0;
  visibility: hidden;
}
.td-expreance-title-pre span {
  color: rgba(255, 255, 255, 0.2);
}
.td-expreance-thumb {
  position: absolute;
  top: 0;
  right: -25px;
  left: -25px;
  z-index: -1;
  height: 100%;
  -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;
  opacity: 0;
  visibility: hidden;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .td-expreance-thumb {
    right: 0;
    left: 0;
  }
}
.td-expreance-thumb img {
  height: 100%;
  object-fit: cover;
}
.td-expreance-item {
  padding: 27px 0px 10px 0px;
  border-top: 1px solid #3a4247;
  border-bottom: 1px solid #3a4247;
  margin-top: -1px;
  -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;
  position: relative;
}
@media (max-width: 575px) {
  .td-expreance-item {
    padding: 27px 10px 10px 10px;
  }
}
.td-expreance-item::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #222f35;
  top: 0;
  left: 0;
  transition: all 0.5s ease;
}
.td-expreance-item:hover::before {
  height: 0;
  top: auto;
  bottom: 0;
}
.td-expreance-btn a {
  color: var(--td-common-white);
  opacity: 0.2;
  -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;
  position: relative;
  z-index: 1;
}
.td-expreance-btn-wrap {
  display: flex;
  align-items: center;
}
.td-expreance-btn-wrap p {
  line-height: 1.62;
  color: var(--td-common-white);
  margin-right: 80px;
  margin-bottom: 0;
  margin-top: 14px;
  -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;
  opacity: 0;
  visibility: hidden;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .td-expreance-btn-wrap p {
    margin-left: 20px;
  }
}
@media (max-width: 575px) {
  .td-expreance-btn-wrap p {
    margin-right: 20px;
  }
}
.td-expreance-content-wrap {
  z-index: 1;
}
.td-expreance-content-wrap:hover .td-expreance-item {
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.td-expreance-content-wrap:hover .td-expreance-thumb {
  opacity: 1;
  visibility: visible;
}
.td-expreance-content-wrap:hover .td-expreance-title-pre {
  opacity: 1;
  visibility: visible;
}
.td-expreance-content-wrap:hover .td-expreance-btn a {
  opacity: 1;
}
.td-expreance-content-wrap:hover .td-expreance-btn-wrap p {
  opacity: 1;
  visibility: visible;
}
.td-expreance-content-wrap:hover .td-expreance-title span {
  color: var(--td-common-white);
}

/*----------------------------------------*/
/* 7.4 business css
/*----------------------------------------*/
.td-business-tag a {
  line-height: 1.62;
  color: #000;
}
.td-business-tag a:not(:last-child) {
  margin-right: 25px;
}
@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) {
  .td-business-tag a:not(:last-child) {
    margin-right: 8px;
  }
}
.td-business-tag a span {
  background: #d7dde7;
  width: 10px;
  height: 10px;
  border-radius: 20px;
  display: inline-block;
  margin-right: 3px;
}
.td-business-tag a span.enable-1 {
  background: #617076;
}
.td-business-tag a span.enable-2 {
  background: var(--td-common-bg);
}
.td-business-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 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) {
  .td-business-title {
    font-size: 28px;
  }
}
.td-business-para {
  line-height: 1.6;
  color: var(--td-theme-primary);
}
@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) {
  .td-business-wraper {
    padding-left: 0;
    padding-right: 0;
  }
}
.td-business-box {
  padding-right: 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) {
  .td-business-box {
    padding-right: 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) {
  .td-business-chat svg {
    width: 270px;
  }
}

/*----------------------------------------*/
/* 7.14 map css
/*----------------------------------------*/
.td-map-count-title {
  font-weight: 700;
  font-size: 120px;
  line-height: 1;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--td-theme-primary);
  -webkit-text-stroke-width: 1px;
}
@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) {
  .td-map-count-title {
    font-size: 80px;
  }
}
.td-map-para P {
  line-height: 1.62;
  margin-left: 35px;
  color: var(--td-grey-2);
  margin-bottom: 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) {
  .td-map-para P {
    margin-left: 0;
  }
}
.td-map-lucation-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--td-theme-primary);
}
.td-map-lucation-dot.td-pulse-border::after, .td-map-lucation-dot.td-pulse-border::before {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 180%;
  height: 180%;
}
.td-map-lucation-dot.one {
  position: absolute;
  top: 10%;
  left: 36%;
}
.td-map-lucation-dot.two {
  position: absolute;
  top: 31%;
  left: 27%;
}
.td-map-lucation-dot.three {
  position: absolute;
  top: 49%;
  left: 18%;
}
.td-map-lucation-dot.four {
  position: absolute;
  top: 55%;
  left: 48%;
}
.td-map-lucation-dot.five {
  position: absolute;
  top: 35%;
  right: 19%;
}
@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) {
  .td-map-thumb {
    margin-top: 40px;
  }
}

/*----------------------------------------*/
/* 7.20 team-details css
/*----------------------------------------*/
.td-team-details-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
}
.td-team-details-content {
  margin-left: 70px;
  margin-right: 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) {
  .td-team-details-content {
    margin-left: 0;
    margin-right: 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) {
  .td-team-details-thumb {
    margin-right: 0;
  }
}
.td-team-details-subtitle {
  font-size: 14px;
  line-height: 1;
  color: var(--td-grey-2);
  display: inline-block;
}
.td-team-details-social {
  border-top: 1px solid var(--td-common-line);
  border-bottom: 1px solid var(--td-common-line);
  padding: 14px 0px 10px 0px;
}
.td-team-details-social span {
  font-size: 16px;
  line-height: 1;
  color: var(--td-grey-2);
  margin-right: 40px;
  display: inline-block;
}
.td-team-details-social span a:hover {
  color: var(--td-theme-primary);
}
.td-team-details-social span i {
  color: var(--td-theme-primary);
  margin-right: 5px;
}
.td-team-details-social ul {
  display: inline-block;
}
.td-team-details-social ul li {
  list-style: none;
  font-size: 16px;
  color: var(--td-grey-2);
  display: inline-block;
  margin-left: 13px;
}
.td-team-details-social ul li:hover {
  color: var(--td-theme-primary);
}
.td-team-details-social ul li:hover svg {
  fill: var(--td-theme-primary);
}
.td-team-details-social ul li svg {
  width: 15px;
  fill: var(--td-grey-2);
  transition: all 0.4s ease;
}
.td-team-details-biography-title {
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
}
.td-team-details-biography p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-team-details-education ul li {
  list-style: none;
  font-family: var(--font-family);
  line-height: 2.25;
  color: var(--td-grey-2);
}
.td-team-details-skill ul li {
  list-style: none;
  display: inline-block;
}
.td-team-details-skill ul li a {
  line-height: 1;
  color: var(--td-grey-2);
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  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;
}
.td-team-details-skill ul li a:hover {
  background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  background-size: 0 1px, 100% 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;
  color: var(--td-theme-primary);
}
.td-team-details-skill ul li span {
  color: #cacaca;
  margin: 0 10px;
}

/*----------------------------------------*/
/* 7.13 history css
/*----------------------------------------*/
.td-history-year {
  font-weight: 500;
  font-size: 120px;
  line-height: 1;
}
@media (max-width: 575px) {
  .td-history-year {
    font-size: 100px;
  }
}
.td-history-title-wrap {
  position: sticky;
  top: 100px;
}
.td-history-title {
  font-weight: 500;
  font-size: 36px;
  line-height: 1;
  text-transform: capitalize;
}
.td-history-wrapper {
  padding-left: 110px;
  margin-left: 20px;
  border-left: 1px solid var(--td-common-line);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .td-history-wrapper {
    padding-left: 50px;
  }
}
@media (max-width: 575px) {
  .td-history-wrapper {
    padding-left: 0;
    margin-left: 0;
    border: none;
  }
}
.td-history-item {
  background: var(--td-surface-2);
  padding: 50px 50px 35px 50px;
}
@media (max-width: 575px) {
  .td-history-item {
    padding: 20px 20px 15px 20px;
  }
}
.td-history-item p {
  line-height: 1.62;
  color: var(--td-grey-2);
}
.td-history-navebar {
  height: 100%;
  position: absolute;
  left: -18px;
}
.td-history-navebar ul {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  height: 100%;
}
.td-history-navebar ul li {
  list-style: none;
  height: 25%;
  position: relative;
  display: flex;
  align-items: center;
}
.td-history-navebar ul li.current span {
  height: 100%;
  bottom: auto;
  top: 0;
}
.td-history-navebar ul li.current a {
  background: var(--td-theme-primary);
  color: var(--td-common-white);
  border: 1px solid var(--td-theme-primary);
}
.td-history-navebar ul li span {
  position: absolute;
  width: 1px;
  height: 0;
  background: var(--td-theme-primary);
  left: 17px;
  bottom: 0;
  transition: all 0.4s ease;
}
.td-history-navebar ul li a {
  width: 37px;
  height: 36px;
  line-height: 36px;
  background: var(--td-surface);
  color: var(--td-theme-primary);
  position: relative;
  text-align: center;
  border: 1px solid var(--td-common-line);
  z-index: 2;
}

/*# sourceMappingURL=main.css.map */
.td-header-logo img {
  width: 140px;   /* ← change this number */
  height: auto;
}
/* Client logo slider – bigger logos, same card size
   Card height stays ~122px: 21px padding top + 80px logo + 21px padding bottom
   (template was 45px + ~32px + 45px) */
.td-brand-single-logo a {
  padding: 21px 18px;          /* inner breathing space */
  overflow: hidden;            /* nothing can spill out of the card */
  display: flex;
  align-items: center;
  justify-content: center;
}
.td-brand-single-logo a img {
  width: 100%;
  max-width: 100%;
  height: 80px;                /* ~2.5x the old logo size */
  object-fit: contain;         /* keeps proportions, never stretches */
}

/* Phones: smaller cards, so scale the logo down with them */
@media (max-width: 767px) {
  .td-brand-single-logo a {
    padding: 15px 12px;
  }
  .td-brand-single-logo a img {
    height: 50px;
  }
}

/* Header nav – fit 8 menu items without overlapping the logo or search box */
@media (min-width: 992px) {
  .td-main-menu nav ul li {
    margin-left: 26px;              /* template default was 50px */
  }
  .td-main-menu nav ul li a {
    font-size: 15px;
  }
  .td-header-input input {
    width: 150px;                   /* template default was 250px */
  }
  .td-main-menu-content > ul {
    flex-wrap: nowrap;
  }
}

/* Large screens: a little more breathing room */
@media (min-width: 1400px) {
  .td-main-menu nav ul li {
    margin-left: 34px;
  }
  .td-main-menu nav ul li a {
    font-size: 16px;
  }
  .td-header-input input {
    width: 200px;
  }
}

/* Client logo grid (Who We Are) – bigger logos, same tile size
   Tile height stays 330px: 105px padding + 120px logo box + 105px padding
   (template was 135px + 60px + 135px) */
.td-brand-logo-wrap-2 {
  padding: 105px 20px;
}
.td-brand-logo-wrap-2 img.td-brand-logo-2 {
  width: auto;
  height: 120px;          /* logo box – image scales inside it */
  max-width: 88%;
  object-fit: contain;
}

@media (max-width: 767px) {
  .td-brand-logo-wrap-2 {
    padding: 60px 20px;
  }
  .td-brand-logo-wrap-2 img.td-brand-logo-2 {
    height: 80px;
  }
}

/* =========================================================
   Conferences & Events page
   Placeholder image size: 870 x 500 (landscape)
   ========================================================= */

/* --- Event gallery --------------------------------------- */
.td-event-gallery-item {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
  background: var(--td-common-gray, #f4f5f7);
}
.td-event-gallery-item img {
  width: 100%;
  aspect-ratio: 870 / 500;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}
.td-event-gallery-item:hover img {
  transform: scale(1.05);
}
@media (min-width: 992px) {
  .td-event-gallery-col-offset {
    margin-top: 90px;          /* staggered rhythm between the two columns */
  }
}

/* --- Services carousel ----------------------------------- */
.td-event-service-area {
  overflow: hidden;
}
.td-event-service-card {
  height: 100%;
  padding: 40px 35px;
  border: 1px solid var(--td-common-line, #e6e8ec);
  background: var(--td-surface);
  transition: box-shadow 0.4s ease, transform 0.4s ease;
}
.td-event-service-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
}
.td-event-service-nav button {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid var(--td-common-line, #e6e8ec);
  background: transparent;
  margin-left: 10px;
  transition: all 0.3s ease;
}
.td-event-service-nav button:hover {
  background: var(--td-theme-primary, #00A8E8);
  border-color: var(--td-theme-primary, #00A8E8);
  color: #fff;
}

/* --- Photo marquee (two rows, opposite directions) -------- */
.td-event-marquee {
  overflow: hidden;
  width: 100%;
  margin-bottom: 20px;
}
.td-event-marquee-track {
  display: flex;
  gap: 20px;
  width: max-content;
}
.td-event-marquee-item {
  flex: 0 0 auto;
  width: 435px;                 /* half of 870, keeps the 870x500 ratio */
}
.td-event-marquee-item img {
  width: 100%;
  aspect-ratio: 870 / 500;
  object-fit: cover;
  display: block;
}
.td-event-marquee-left {
  animation: td-marquee-left 60s linear infinite;
}
.td-event-marquee-right {
  animation: td-marquee-right 60s linear infinite;
}
.td-event-marquee:hover .td-event-marquee-track {
  animation-play-state: paused;
}
@keyframes td-marquee-left {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}
@keyframes td-marquee-right {
  from { transform: translate3d(-50%, 0, 0); }
  to   { transform: translate3d(0, 0, 0); }
}
@media (max-width: 767px) {
  .td-event-marquee-item {
    width: 260px;
  }
  .td-event-gallery-item {
    margin-bottom: 20px;
  }
}

/* Event gallery – "show more" */
.td-event-gallery-hidden {
  display: none;
}
.td-event-gallery-more {
  margin-top: 20px;
  padding: 16px 38px;
  border: 1px solid var(--td-common-line, #e6e8ec);
  background: transparent;
  font-weight: 500;
  transition: all 0.3s ease;
}
.td-event-gallery-more i {
  margin-left: 8px;
}
.td-event-gallery-more:hover {
  background: var(--td-theme-primary, #00A8E8);
  border-color: var(--td-theme-primary, #00A8E8);
  color: #fff;
}

/* Event services carousel – card sizing fix */
.td-event-service-slider .swiper-wrapper {
  align-items: stretch;
}
.td-event-service-slider .swiper-slide {
  height: auto;
}
.td-event-service-card {
  overflow: hidden;
}
.td-event-service-card .td-service-6-icon {
  margin-right: 22px;
  flex: 0 0 auto;
}
.td-event-service-card .td-service-6-icon svg {
  width: 52px;
  height: 52px;
}
.td-event-service-card .td-service-6-content {
  min-width: 0;
}
.td-event-service-card .td-service-6-title {
  font-size: 24px;
  line-height: 1.3;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
  margin-bottom: 14px !important;
}
.td-event-service-card p {
  font-size: 15px;
  line-height: 1.6;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .td-event-service-card .td-service-6-title {
    font-size: 22px;
  }
}
@media (max-width: 575px) {
  .td-event-service-card {
    padding: 35px 25px;
  }
  .td-event-service-card .td-service-6-title {
    font-size: 22px;
  }
}

/* Marquee – logo tiles mixed among the photos */
.td-event-marquee-item.is-logo {
  width: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f5f6f8;
  padding: 0 34px;
  aspect-ratio: 870 / 500;
}
.td-event-marquee-item.is-logo img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 62%;
  aspect-ratio: auto;
  object-fit: contain;
}
@media (max-width: 767px) {
  .td-event-marquee-item.is-logo {
    width: 200px;
    padding: 0 22px;
  }
}

/*----------------------------------------*/
/*  Cursor effects on hero / breadcrumb banners
/*  Homepage hero      -> image trail
/*  Inner-page banners -> soft blue spotlight
/*  Paired with assets/js/hero-glow.js, which creates both layers.
/*  Desktop only.
/*----------------------------------------*/
.td-hero-area,
.td-breadcrumb-area {
  position: relative;
  z-index: 0;
}
/* The hero is a positioned element now, so it would paint over the header,
   which the template leaves on z-index auto. Say the header is on top. */
.td-header-area {
  z-index: 99;
}
/* keep every real child above the effect layers */
.td-hero-area > *:not(.td-cursor-glow):not(.td-cursor-trail),
.td-breadcrumb-area > *:not(.td-cursor-glow):not(.td-cursor-trail) {
  position: relative;
  z-index: 2;
}
.td-cursor-glow,
.td-cursor-trail {
  display: none;
}

@media (hover: hover) and (pointer: fine) and (min-width: 992px) {

  /* --- spotlight, inner page banners --- */
  .td-cursor-glow {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.5s ease;
    background:
      radial-gradient(600px circle at var(--td-mx, 50%) var(--td-my, 50%),
        rgba(47, 193, 255, 0.12) 0%,
        rgba(0, 168, 232, 0.05) 36%,
        rgba(0, 168, 232, 0) 64%),
      radial-gradient(210px circle at var(--td-mx, 50%) var(--td-my, 50%),
        rgba(0, 168, 232, 0.065) 0%,
        rgba(0, 168, 232, 0) 72%);
  }
  .td-glow-on > .td-cursor-glow {
    opacity: 1;
  }

  /* --- image trail, homepage hero --- */
  .td-cursor-trail {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
  }
  .td-trail-item {
    position: absolute;
    width: 220px;
    aspect-ratio: 1;
    margin: -110px 0 0 -110px;
    object-fit: cover;
    will-change: transform, opacity;
    box-shadow: 0 16px 42px rgba(32, 40, 45, 0.18);
    animation: td-trail-pop 1000ms cubic-bezier(0.16, 0.84, 0.34, 1) forwards;
  }
}

@keyframes td-trail-pop {
  0% {
    opacity: 0;
    transform: translate3d(0, 14px, 0) scale(0.74) rotate(var(--td-rot, 0deg));
  }
  14% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1) rotate(var(--td-rot, 0deg));
  }
  100% {
    opacity: 0;
    transform: translate3d(0, -26px, 0) scale(0.95) rotate(var(--td-rot, 0deg));
  }
}

@media (prefers-reduced-motion: reduce) {
  .td-cursor-glow { transition: none; }
  .td-cursor-trail { display: none; }
}

/*----------------------------------------*/
/*  Featured programmes — small-screen layout
/*  Below 992px there is no hover, so the shared backdrop that swaps as you
/*  move between columns cannot work. Each programme becomes a card with its
/*  own photograph and its description always visible.
/*  Desktop is untouched.
/*----------------------------------------*/
@media (max-width: 991px) {
  /* the shared backdrop and its dark overlay are hover-only */
  .td-service-area .service__slider-8 {
    display: none;
  }
  .td-service-area {
    background-color: var(--td-surface);
    margin-bottom: 80px;
  }
  .td-service-area .container-fluid {
    padding-left: 12px;
    padding-right: 12px;
  }
  .td-service-area .td-service-border {
    border: 0;
  }
  .td-service-area .service__item-8 {
    padding: 0 8px 20px;
  }

  /* the card */
  .td-service-area .td-service-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 0;
    overflow: hidden;
    background: var(--td-surface);
    border: 1px solid var(--td-common-line);
  }
  /* its own photograph, same one the desktop hover shows */
  .td-service-area .td-service-wrap::before {
    content: "";
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    background-color: #e9eef1;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }
  .td-service-area .service__item-8[rel="service-img-1"] .td-service-wrap::before {
    background-image: url("../img/service/ai-business-strategy.webp");
  }
  .td-service-area .service__item-8[rel="service-img-2"] .td-service-wrap::before {
    background-image: url("../img/service/ecowas-thumb.webp");
  }
  .td-service-area .service__item-8[rel="service-img-3"] .td-service-wrap::before {
    background-image: url("../img/service/strategic-hr-management.webp");
  }
  .td-service-area .service__item-8[rel="service-img-4"] .td-service-wrap::before {
    background-image: url("../img/service/international-law.webp");
  }
  .td-service-area .service__item-8[rel="service-img-5"] .td-service-wrap::before {
    background-image: url("../img/service/security-and-cybercrime.webp");
  }

  /* category reads as a chip above the title, not a rotated tab */
  .td-service-area .td-service-cetagory,
  .td-service-area .td-service-cetagory-2,
  .td-service-area .td-service-cetagory-3,
  .td-service-area .td-service-cetagory-4,
  .td-service-area .td-service-cetagory-5 {
    position: static;
    transform: none;
    right: auto;
    top: auto;
    align-self: flex-start;
    margin: 22px 22px 0;
    padding: 5px 12px;
    font-size: 12px;
    letter-spacing: 0.04em;
    color: var(--td-theme-primary);
    background: rgba(0, 168, 232, 0.1);
    backdrop-filter: none;
  }

  /* the outlined number needs a tall column it no longer has */
  .td-service-area .td-service-number {
    display: none;
  }

  /* no hover to open the content with, so it is open */
  .td-service-area .td-service-content {
    transform: none;
    padding: 12px 22px 26px;
  }
  .td-service-area .td-service-content-inner {
    opacity: 1;
    visibility: visible;
  }
  .td-service-area .td-service-title {
    font-size: 22px;
    line-height: 1.26;
    color: var(--td-ink);
  }
  .td-service-area .td-service-title a {
    color: var(--td-ink);
    background-image: linear-gradient(var(--td-ink), var(--td-ink)), linear-gradient(var(--td-ink), var(--td-ink));
  }
  .td-service-area .td-service-content-para {
    font-size: 14px;
    line-height: 1.6;
    color: var(--td-grey-2);
    opacity: 1;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  .td-service-area .td-btn-2 {
    background: transparent;
    padding-left: 0;
    padding-right: 0;
  }
}

/*----------------------------------------*/
/*  Mobile menu — Download Brochure button
/*  The desktop header button is hidden below 992px, so the offcanvas
/*  menu carries its own. Desktop never sees this.
/*----------------------------------------*/
.tdoffcanvas__brochure {
  margin: 28px 0 32px;
}
.tdoffcanvas__brochure .td-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 15px 20px;
}
.tdoffcanvas__brochure .td-arrow-angle {
  display: inline-flex;
  align-items: center;
}

/*----------------------------------------*/
/*  Photo cards — "More ways we can help"
/*  Three layers in one box: the photograph, a dark scrim over it, then
/*  the text. The photo sits on its own layer, always slightly larger
/*  than the card, so zooming it can never expose an edge.
/*----------------------------------------*/
.td-blog-qoute-photo {
  position: relative;
  overflow: hidden;
  min-height: 215px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-color: #0e1418;
}

/* the photograph */
.td-blog-qoute-photo::after {
  content: "";
  position: absolute;
  inset: -3%;                       /* always overhangs the card on every side */
  z-index: 0;
  background-size: cover;
  background-position: center 42%;
  background-repeat: no-repeat;
  transform: scale(1);
  transform-origin: center;
  transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.3, 1);
  will-change: transform;
}
.td-blog-qoute-photo:hover::after {
  transform: scale(1.07);
}

/* the scrim, so white type stays readable over the photograph */
.td-blog-qoute-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top,
      rgba(14, 20, 24, 0.88) 0%,
      rgba(14, 20, 24, 0.62) 46%,
      rgba(14, 20, 24, 0.34) 100%);
  transition: opacity 0.5s ease;
}
.td-blog-qoute-photo:hover::before {
  opacity: 0.92;
}

/* the text */
.td-blog-qoute-photo > * {
  position: relative;
  z-index: 2;
}
.td-blog-qoute-photo .td-blog-qoute-meta {
  color: #ffffff;
  opacity: 0.82;
}
.td-blog-qoute-photo .td-blog-qoute-title,
.td-blog-qoute-photo .td-blog-qoute-title a {
  color: #ffffff;
}

@media (prefers-reduced-motion: reduce) {
  .td-blog-qoute-photo::after,
  .td-blog-qoute-photo::before { transition: none; }
  .td-blog-qoute-photo:hover::after { transform: scale(1); }
}

/* each card names its own photograph — paths relative to this file */
.td-blog-qoute-photo--team::after {
  background-image: url("../img/blog/team-building.webp");
}
.td-blog-qoute-photo--events::after {
  background-image: url("../img/blog/corporate-events.webp");
  background-position: center 58%;
}
/* this photograph is already dark, so it needs far less scrim */
.td-blog-qoute-photo--events::before {
  background:
    linear-gradient(to top,
      rgba(14, 20, 24, 0.72) 0%,
      rgba(14, 20, 24, 0.40) 48%,
      rgba(14, 20, 24, 0.10) 100%);
}

/* ==========================================================================
   Dark theme
   --------------------------------------------------------------------------
   Opt-in only. The page still ships <meta name="color-scheme" content="only
   light">, so no browser ever generates its own dark version; this theme is
   applied solely by the toggle writing data-theme="dark" on <html>.
   Neutrals carry a slight blue bias toward the brand #2FC1FF so they read as
   chosen rather than default grey.
   ========================================================================== */
:root[data-theme="dark"] {
  color-scheme: dark;

  --td-page: #0f1519;          /* the page itself            */
  --td-surface: #192228;       /* cards sitting above it     */
  --td-surface-2: #141d23;     /* tinted section bands       */
  --td-ink: #e4ebef;           /* headings and body text     */
  --td-common-line: #2a353c;   /* rules and card borders     */
  --td-grey-2: #a6b2ba;        /* secondary paragraph text   */
  --td-grey-4: #8e9ba3;
}

/* Logos have white baked into the files, so in dark mode their containers
   become deliberate white cards rather than leaving white boxes adrift. */
:root[data-theme="dark"] .td-brand-single-logo a,
:root[data-theme="dark"] .td-event-marquee-item.is-logo {
  background: var(--td-surface);
  border-radius: 6px;
}
:root[data-theme="dark"] .td-brand-logo-wrap-2 {
  background: var(--td-surface);
  border-radius: 6px;
}
:root[data-theme="dark"] .td-brand-logo-border {
  border-color: #e6e6e6;
}

/* Gallery tile placeholder (shows while a lazy image loads) */
:root[data-theme="dark"] .td-event-gallery-item {
  background: var(--td-surface-2);
}

/* Form controls */
:root[data-theme="dark"] input:not([type="submit"]):not([type="button"]),
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
  background: var(--td-surface);
  color: var(--td-ink);
  border-color: var(--td-common-line);
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: var(--td-grey-4);
}

/* Bootstrap accordion sets its own near-black */
:root[data-theme="dark"] .accordion-item,
:root[data-theme="dark"] .accordion-button {
  background: var(--td-surface);
  color: var(--td-ink);
}

/* ---- the toggle itself ---- */
.td-theme-toggle {
  background: transparent;
  border: 1px solid currentColor;
  border-radius: 999px;
  width: 30px;
  height: 30px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  opacity: 0.8;
  cursor: pointer;
  transition: opacity 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  flex: 0 0 auto;
}
.td-theme-toggle:hover,
.td-theme-toggle:focus-visible {
  opacity: 1;
  border-color: var(--td-theme-primary);
  background: rgba(47, 193, 255, 0.14);
}
.td-header-right .td-theme-toggle { margin-left: 18px; }
.td-theme-toggle svg {
  width: 15px;
  height: 15px;
  display: block;
}
.td-theme-toggle .td-icon-moon { display: block; }
.td-theme-toggle .td-icon-sun  { display: none; }
:root[data-theme="dark"] .td-theme-toggle .td-icon-moon { display: none; }
:root[data-theme="dark"] .td-theme-toggle .td-icon-sun  { display: block; }

/* top utility bar: text centred as before, toggle pinned right */
.td-header-3-content {
  position: relative;
}
/* the inner-page utility bar is #20282D in both themes, so its icon is white.
   Inheriting here picked up the page ink and vanished against the bar. */
.td-header-3-content .td-theme-toggle {
  color: #fff;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

/* in the mobile menu it sits as a labelled row under the brochure button */
.tdoffcanvas__theme {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 18px;
  margin-bottom: 28px;
  padding-top: 18px;
  border-top: 1px solid var(--td-common-line);
}
.tdoffcanvas__theme span {
  font-size: 15px;
  font-weight: 600;
  color: var(--td-ink);
}
.tdoffcanvas__theme .td-theme-toggle {
  border-color: var(--td-common-line);
  color: var(--td-ink);
  width: 38px;
  height: 38px;
}
.tdoffcanvas__theme .td-theme-toggle svg { width: 17px; height: 17px; }

:root[data-theme="dark"] .tdoffcanvas {
  background: var(--td-surface);
}

@media (max-width: 575px) {
  .td-header-3-content .td-theme-toggle { position: static; transform: none; margin-top: 6px; }
  .td-header-3-content { text-align: center; }
}

/* Logo swap: the dark wordmark is unreadable on a dark surface, so dark mode
   serves the white variant that already ships with the site. Containers that
   already carry logo-white.png simply resolve to the same file. */
:root[data-theme="dark"] .td-header-logo img,
:root[data-theme="dark"] .tdoffcanvas__logo img,
:root[data-theme="dark"] .td-footer-logo img,
:root[data-theme="dark"] .td-footer-3-logo img {
  content: url("../img/logo/logo-white.png");
}

/* The header CTA is a white pill carrying brand-blue text. Its white is a
   button colour, not a page surface, so it stays white in dark mode. */
:root[data-theme="dark"] .td-btn-7,
:root[data-theme="dark"] .td-btn-7:hover {
  background: #fff;
  color: var(--td-theme-primary);
}

/* ==========================================================================
   The light / dark switch itself — a real, labelled button, fixed to the
   viewport so it is visible on every page at every width. Bottom LEFT, to
   stay clear of the back-to-top control in the opposite corner.
   ========================================================================== */
.td-theme-fab {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 97;
  width: auto;                 /* undo the small round base style */
  height: 46px;
  padding: 0 20px 0 15px;
  gap: 9px;
  border-radius: 999px;
  border: 1px solid var(--td-common-line);
  background: var(--td-surface);
  color: var(--td-ink);
  opacity: 1;
  font-family: var(--td-ff-manrope);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 10px 28px rgba(14, 20, 24, 0.16);
}
.td-theme-fab:hover,
.td-theme-fab:focus-visible {
  background: var(--td-surface);
  border-color: var(--td-theme-primary);
  color: var(--td-theme-primary);
  box-shadow: 0 12px 32px rgba(47, 193, 255, 0.28);
}
.td-theme-fab svg { width: 17px; height: 17px; }
.td-theme-fab-txt { white-space: nowrap; }
.td-theme-fab .td-theme-fab-light { display: none; }
:root[data-theme="dark"] .td-theme-fab .td-theme-fab-dark  { display: none; }
:root[data-theme="dark"] .td-theme-fab .td-theme-fab-light { display: inline; }

@media (max-width: 575px) {
  .td-theme-fab { left: 16px; bottom: 16px; height: 42px; padding: 0 16px 0 12px; font-size: 13px; }
}

/* The homepage hero's backdrop is a photograph (assets/img/hero/bg.jpg) and a
   background image cannot follow a colour token, so in dark mode it stayed
   light while the headline and the 300px slider type above it turned light.
   Multiplying the image against the page colour darkens it while keeping its
   diagonal texture, rather than hiding the artwork behind a flat overlay. */
:root[data-theme="dark"] .td-hero-area {
  background-color: #141c22;
  background-blend-mode: multiply;
}

/* ==========================================================================
   Training faculties catalogue  (assets/js/faculties.js renders into this)
   A grid of rectangular faculty boxes; clicking one opens a full-width
   drawer directly beneath its row rather than pushing the grid apart.
   ========================================================================== */
.td-faculties-area { padding-top: 140px; padding-bottom: 130px; }

.td-fac-search { position: relative; max-width: 520px; margin: 0 0 14px; }
.td-fac-search input {
  width: 100%;
  padding: 15px 46px 15px 18px;
  font-family: var(--td-ff-manrope);
  font-size: 15px;
  color: var(--td-ink);
  background: var(--td-surface);
  border: 1px solid var(--td-common-line);
  border-radius: 10px;
  outline: none;
}
.td-fac-search input:focus {
  border-color: var(--td-theme-primary);
  box-shadow: 0 0 0 3px rgba(47, 193, 255, 0.16);
}
.td-fac-search svg {
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  width: 17px; height: 17px; stroke: var(--td-grey-2); fill: none; stroke-width: 2;
}
.td-fac-status { font-size: 14px; color: var(--td-grey-2); min-height: 22px; margin: 0 0 30px; }

.td-fac-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 24px;
}

.td-fac-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 26px;
  min-height: 186px;
  padding: 26px 28px 28px;
  text-align: left;
  background: var(--td-surface);
  border: 1px solid var(--td-common-line);
  border-radius: 12px;
  cursor: pointer;
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.td-fac-card:hover {
  border-color: var(--td-theme-primary);
  box-shadow: 0 16px 40px rgba(14, 20, 24, 0.10);
  transform: translateY(-3px);
}
.td-fac-card.is-open {
  border-color: var(--td-theme-primary);
  box-shadow: 0 0 0 1px var(--td-theme-primary) inset;
}
.td-fac-tag {
  align-self: flex-start;
  font-size: 13px; font-weight: 700; line-height: 1;
  color: var(--td-theme-primary);
  background: rgba(47, 193, 255, 0.12);
  padding: 7px 13px; border-radius: 999px;
}
.td-fac-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.td-fac-name {
  font-size: 22px; font-weight: 700; line-height: 1.24;
  color: var(--td-ink); text-wrap: balance;
}
.td-fac-chev {
  flex: 0 0 auto; width: 20px; height: 20px;
  stroke: var(--td-theme-primary); fill: none; stroke-width: 2.2;
  transition: transform .25s ease;
}
.td-fac-card.is-open .td-fac-chev { transform: rotate(180deg); }

.td-fac-panel {
  grid-column: 1 / -1;
  border: 1px solid var(--td-theme-primary);
  border-radius: 12px;
  background: var(--td-surface-2);
  animation: td-fac-in .26s ease both;
}
@keyframes td-fac-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.td-fac-panel-inner { padding: 30px 32px 34px; }
.td-fac-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.td-fac-panel-head h3 { font-size: 24px; font-weight: 700; margin: 0; color: var(--td-ink); }
.td-fac-close {
  flex: 0 0 auto; width: 34px; height: 34px; line-height: 1;
  font-size: 22px; color: var(--td-grey-2);
  background: transparent; border: 1px solid var(--td-common-line);
  border-radius: 50%; cursor: pointer;
}
.td-fac-close:hover { color: var(--td-theme-primary); border-color: var(--td-theme-primary); }

.td-fac-courses {
  list-style: none; margin: 22px 0 0; padding: 0;
  columns: 3; column-gap: 34px;
}
.td-fac-courses li {
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
  position: relative;
  padding: 7px 0 7px 18px;
  font-size: 15px;
  color: var(--td-grey-2);
}
.td-fac-courses li::before {
  content: ""; position: absolute; left: 0; top: 16px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--td-common-line);
}
.td-fac-courses a {
  color: var(--td-ink); font-weight: 600;
  border-bottom: 1px solid var(--td-theme-primary);
}
.td-fac-courses a:hover { color: var(--td-theme-primary); }
.td-fac-courses mark { background: rgba(47, 193, 255, 0.3); color: inherit; border-radius: 2px; }

.td-fac-ask {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 26px; font-size: 14px; font-weight: 700;
  color: var(--td-theme-primary);
}
.td-fac-ask:hover { text-decoration: underline; }
.td-fac-empty { grid-column: 1 / -1; padding: 40px 4px; color: var(--td-grey-2); }

@media (max-width: 1199px) { .td-fac-courses { columns: 2; } }
@media (max-width: 767px) {
  .td-faculties-area { padding-top: 90px; padding-bottom: 80px; }
  .td-fac-grid { grid-template-columns: 1fr; gap: 18px; }
  .td-fac-card { min-height: 0; padding: 22px 22px 24px; gap: 20px; }
  .td-fac-name { font-size: 20px; }
  .td-fac-courses { columns: 1; }
  .td-fac-panel-inner { padding: 24px 22px 26px; }
}

/* The line on the contact page naming the faculty the visitor clicked */
.td-contact-faculty {
  margin: 34px 0 4px;
  padding: 14px 18px;
  border-left: 3px solid var(--td-theme-primary);
  background: var(--td-surface-2);
  border-radius: 0 8px 8px 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--td-ink);
}

/* brief highlight so the eye lands on the enquiry line after the scroll */
.td-contact-faculty.is-new { animation: td-note-in 2.2s ease both; }
@keyframes td-note-in {
  0%   { background: rgba(47, 193, 255, 0.22); }
  18%  { background: rgba(47, 193, 255, 0.22); }
  100% { background: var(--td-surface-2); }
}
@media (prefers-reduced-motion: reduce) {
  .td-contact-faculty.is-new { animation: none; }
}

/* When the visitor arrives from a faculty, the heading itself carries the
   enquiry, so it has to cope with names as long as "Language Translation
   and Interpretation" without running to five lines. */
.td-section-title.is-enquiry {
  font-size: clamp(30px, 3.6vw, 46px);
  line-height: 1.15;
  text-wrap: balance;
}

/* The catalogue ships as real HTML so crawlers and no-JavaScript visitors
   can read all 311 course names. Once JavaScript takes over it rebuilds the
   same data as the interactive grid, so the static lists are hidden before
   first paint — the .js class is set in the <head>, not after load. */
.js .td-fac-item-list { display: none; }
.td-fac-item {
  padding: 22px 0;
  border-bottom: 1px solid var(--td-common-line);
}
.td-fac-item-name { font-size: 20px; font-weight: 700; margin: 0 0 10px; color: var(--td-ink); }
.td-fac-item-list { list-style: none; margin: 0; padding: 0; columns: 3; column-gap: 30px; }
.td-fac-item-list li {
  -webkit-column-break-inside: avoid; break-inside: avoid;
  padding: 5px 0 5px 16px; position: relative; font-size: 15px; color: var(--td-grey-2);
}
.td-fac-item-list li::before {
  content: ""; position: absolute; left: 0; top: 14px;
  width: 5px; height: 5px; border-radius: 50%; background: var(--td-common-line);
}
.js .td-fac-item { padding: 0; border: 0; }
@media (max-width: 991px) { .td-fac-item-list { columns: 2; } }
@media (max-width: 600px) { .td-fac-item-list { columns: 1; } }