/*
==============================================*/
/* CSS Index
==============================================

	// components
	01. Animation
	02. background
	03. Breadcrumb
	04. Button
	05. Mobile Menu
	06. Nice Select
	07. OffCanvas
	08. Preloader
	09. Scroll Top
	10. Search
	11. Section Title
	12. spacing default responsive

	// layout
    01. about
	02. awards
	03. blog
	04. brand
	05. chose
	06. contact
	07. counter
	08. cta
	09. error
	10. faq
	11. footer
	12. header
	13. hero
	14. Menu
	15. portfolio
	16. about
	17. process
	18. service
	19. shop
	20. skill
	21. portfolio
	22. testimonial
	23. video
==============================================*/



/*============================================
/*  01. Theme Default CSS
==============================================*/
:root {
  --tg-ff-body: "Inter", sans-serif;
  --tg-ff-heading: "Unbounded", sans-serif;
  --tg-ff-p: "Inter", sans-serif;
  --tg-ff-fontawesome: "Font Awesome 6 Pro";
  --tg-common-white: #fff;
  --tg-common-black: #000;
  --tg-grey-1: #6f6f6f;
  --tg-grey-2: #f0f0f0;
  --tg-theme-primary: #cbca7b;
  --tg-border-1: rgba(28, 29, 31, 0.15);
}

/*=============================
	Typography css start
===============================*/
body {
  font-family: var(--tg-ff-body);
  font-size: 18px;
  font-weight: 400;
  color: var(--tg-common-black);
  line-height: 1.66;
}
@media (max-width: 767px) {
    body {
        font-size: 16px;
        line-height: 1.66;
    }
}
img,
.img {
  max-width: 100%;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

a:focus,
.btn:focus,
.button:focus {
  text-decoration: none;
  outline: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

a:hover,
button:hover {
  color: var(--tg-common-black);
  text-decoration: none;
}

.scrool-bar::-webkit-scrollbar {
  width: 5px;
  display: block;
  overflow: hidden;
  position: relative;
  margin-left: 5px;
}

.scrool-bar::-webkit-scrollbar-thumb {
  background-color: #e1e1e1;
  outline: 1px solid #e1e1e1;
}

.scrool-bar::-mos-webkit-scrollbar-thumb {
  background-color: #e1e1e1;
  outline: 1px solid #e1e1e1;
}

button:focus,
input:focus,
input:focus,
textarea,
textarea:focus {
  outline: 0;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password],
input[type=url],
textarea {
  outline: none;
  background-color: var(--tg-common-white);
  height: 56px;
  width: 100%;
  line-height: 56px;
  font-size: 15px;
  color: var(--tg-common-black);
  padding-left: 26px;
  padding-right: 26px;
  border: 1px solid #a2a9ac;
  display: block;
}
textarea {
  height: 150px;
}
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 {
  color: var(--tg-common-black);
  opacity: .7
}
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 {
  color: var(--tg-common-black);
  opacity: .7
}
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 {
  color: var(--tg-common-black);
  opacity: .7
}
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 {
  color: var(--tg-common-black);
  opacity: .7
}
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 {
  color: var(--tg-common-black);
  opacity: .7
}
input[type=text]:focus::placeholder,
input[type=email]:focus::placeholder,
input[type=tel]:focus::placeholder,
input[type=number]:focus::placeholder,
input[type=password]:focus::placeholder,
input[type=url]:focus::placeholder,
textarea:focus::placeholder {
  opacity: 0;
}
.form-group {
    margin: 0 0 20px;
}
.comment-form .row {
    --bs-gutter-x: 20px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--tg-common-black);
  font-weight: 700;
  font-family: var(--tg-ff-heading);
  line-height: 1.1;
  text-transform: unset;
  letter-spacing: -0.02em;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  color: inherit;
}

h1 {
  font-size: 60px;
}

h2 {
  font-size: 50px;
}

h3 {
  font-size: 36px;
}

h4 {
  font-size: 24px;
}

h5 {
  font-size: 20px;
}

h6 {
  font-size: 18px;
}

p {
  margin-bottom: 15px;
}

label {
  color: var(--tg-common-black);
  cursor: pointer;
}

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(--tg-common-black);
  color: var(--tg-common-white);
  text-shadow: none;
}

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

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

/*=============================
    - Input Placeholder
===============================*/
input,
textarea {
  color: var(--tg-common-black);
}

*::-moz-placeholder {
  color: var(--tg-common-black);
  font-size: 16px;
  opacity: 1;
}

*::placeholder {
  color: var(--tg-common-black);
  font-size: 16px;
  opacity: 1;
}

/*=============================
    - Common Classes
===============================*/
.ovh {
  overflow: hidden;
}

.clear {
  clear: both;
}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.lh-28 {
  line-height: 28px;
}

.tg-round-15 {
  border-radius: 15px;
}

.tg-round-25 {
  border-radius: 25px;
}

.tg-rounded-10 {
  border-radius: 10px;
}

.tg-rounded-full {
  border-radius: 400px;
}

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

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

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

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

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

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

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

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

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

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

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

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

.gx-10 {
  --bs-gutter-x: 10px;
}

.gx-50 {
  --bs-gutter-x: 50px;
}

.gx-80 {
  --bs-gutter-x: 80px;
}

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

.fix {
  overflow: hidden;
}

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

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

/*=============================
    - Bootstrap Custom
=============================*/
.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #F0F0F0;
}

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

.rounded-circale {
  border-radius: 50%;
}

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

.p-inherit {
  position: inherit !important;
}

@media (min-width: 1400px) {
  .container-1710 {
    max-width: 1710px;
  }
}
/*=============================
	04. Button
===============================*/
.tg-btn {
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
    color: var(--tg-common-white);
    border-radius: 30px;
    padding: 20px 35px;
    display: inline-block;
    line-height: 1;
    background: var(--tg-common-black);
    font-family: var(--tg-ff-heading);
}
.tg-btn:hover {
  color: var(--tg-common-white);
}
.tg-btn-primary {
  background: var(--tg-theme-primary);
  color: var(--tg-common-black);
}
.tg-btn-primary:hover {
  color: var(--tg-common-black);
}
.tg-btn-white {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
}
.tg-btn-white:hover {
  color: var(--tg-common-black);
}
.tg-btn-hover:hover .hover-effect .effect-1 {
  top: -100%;
}
.tg-btn-hover .hover-effect {
  position: relative;
  overflow: hidden;
  display: block;
  height: 20px;
  line-height: normal;
}
.tg-btn-hover .hover-effect .effect-1 {
  display: block;
  height: 100%;
  position: relative;
  top: 0%;
  transition: 0.3s;
}
.tg-btn-rounded {
  width: 150px;
  height: 150px;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  color: var(--tg-common-black);
  border: 1px solid var(--tg-common-black);
  background: transparent;
  border-radius: 50%;
  font-family: var(--tg-ff-heading);
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--tg-common-black);
  line-height: 1.3;
  text-align: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
}
.tg-btn-rounded span {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-top: 43px;
}
.tg-btn-rounded span svg {
  margin-top: 7px;
}
.tg-btn-rounded:hover {
  color: var(--tg-common-white);
}
.tg-btn-rounded:hover .tg-btn-circle-dot {
  width: 520px;
  height: 520px;
}
.tg-btn-rounded-black {
  background: var(--tg-common-black);
  color: var(--tg-common-white);
}
.tg-btn-rounded-black:hover {
  border-color: var(--tg-theme-primary);
  background: transparent;
  color: var(--tg-common-black);
}
.tg-btn-rounded-black .tg-btn-circle-dot {
  background: var(--tg-theme-primary);
}
.tg-btn-rounded-primary {
  background: var(--tg-theme-primary);
  color: var(--tg-common-black);
  border-color: var(--tg-theme-primary);
}
.tg-btn-rounded-primary:hover {
  border-color: var(--tg-theme-primary);
  background: transparent;
  color: var(--tg-common-white);
}
.tg-btn-rounded-primary .tg-btn-circle-dot {
  background: var(--tg-common-black);
}
.tg-btn-rounded-white {
  background: transparent;
  color: var(--tg-common-white);
  border-color: var(--tg-common-white);
}
.tg-btn-rounded-white:hover {
  border-color: var(--tg-theme-primary);
  background: transparent;
  color: var(--tg-common-black);
}
.tg-btn-rounded-white .tg-btn-circle-dot {
  background: var(--tg-theme-primary);
}
.tg-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(--tg-common-black);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border: 1px solid transparent;
  z-index: -1;
}
.tg-btn-two {
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--tg-common-white);
  border-radius: 30px;
  padding: 15px 48px;
  background: var(--tg-common-black);
  transition: all 0.3s ease-in-out;
  font-family: var(--tg-ff-heading);
  border: 1px solid var(--tg-common-black);
}
.tg-btn-two:hover {
  color: var(--tg-common-black);
  background: var(--tg-common-white);
}
.tg-btn-two-white {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
  padding: 19px 34px;
}
.tg-btn-two-white:hover {
  background: var(--tg-theme-primary);
}

/*=============================
    08. Preloader
===============================*/
.preloader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 999;
  background-color: var(--tg-common-black);
  display: flex;
  align-items: center;
  justify-content: center;
}

.preloader-inner {
  display: block;
  width: 45px;
  height: 45px;
}

.preloader-inner span {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 37px;
  height: 37px;
  margin: 4px;
  border: 4px solid transparent;
  border-radius: 50%;
  animation: preloader 1s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: var(--tg-theme-primary) transparent transparent transparent;
}

.preloader-inner span:nth-child(1) {
  animation-delay: -0.1s;
}

.preloader-inner span:nth-child(2) {
  animation-delay: -0.2s;
}

.preloader-inner span:nth-child(3) {
  animation-delay: -0.3s;
}

@-webkit-keyframes preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*=============================
    02. background
===============================*/
.tgbg-primary {
  background: var(--tg-theme-primary);
}

.tgbg-grey {
  background: var(--tg-grey-2);
}

.tgbg-black {
  background: var(--tg-common-black);
}

.tgbg-black-2 {
  background: rgba(255, 255, 255, 0.06);
}

/*=============================
	 07. OffCanvas
===============================*/
.offCanvas-toggle {
  position: relative;
  margin-right: 40px;
  padding-right: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .offCanvas-toggle {
    margin-right: 25px;
    padding-right: 25px;
  }
}
@media (max-width: 575px) {
  .offCanvas-toggle {
    display: none;
  }
}
.offCanvas-toggle::before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 60px;
  background: var(--tg-border-1);
}
.offCanvas-toggle .menu-tigger {
  color: var(--tg-common-black);
}
.offCanvas-toggle .menu-tigger:hover {
  color: var(--tg-theme-primary);
}
.offCanvas-toggle-two {
  margin-right: 0;
  padding-right: 0;
  padding-left: 40px;
}
.offCanvas-toggle-two::before {
  right: auto;
  left: 0;
  height: 104px;
}

.offCanvas__info {
  background: var(--tg-common-white) none repeat scroll 0 0;
  height: 100%;
  padding: 30px;
  padding-top: 80px;
  position: fixed;
  right: 0;
  top: 0;
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -ms-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  width: 400px;
  z-index: 999;
  overflow-y: scroll;
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
}
@media (max-width: 575px) {
  .offCanvas__info {
    width: 100%;
  }
}
.offCanvas__info.active {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}
.offCanvas__info::-webkit-scrollbar {
  width: 0px;
}
.offCanvas__close-icon {
  position: absolute;
  top: 0;
  right: 0;
}
.offCanvas__close-icon button {
  color: var(--tg-common-white);
  cursor: pointer;
  font-size: 24px;
  padding: 0;
  transition: all 0.4s ease;
  width: 45px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  background: var(--tg-common-black);
}
.offCanvas__close-icon button:hover {
  color: var(--tg-common-black);
  background: var(--tg-theme-primary);
}
.offCanvas__logo img {
  max-height: 34px;
}
.offCanvas__social-icon span {
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 2.8px;
  color: var(--tg-common-black);
  display: block;
  margin-bottom: 15px;
}
.offCanvas__social-icon a {
  color: var(--tg-common-black);
  display: inline-block;
  margin-right: 5px;
  text-align: center;
  width: 42px;
  height: 42px;
  line-height: 42px;
  border: 1px solid var(--tg-border-1);
  border-radius: 50%;
  transition: all 0.4s ease;
}
.offCanvas__social-icon a svg {
  transform: translateY(-2px);
  width: 16px !important;
}
.offCanvas__social-icon a:hover {
  background: var(--tg-theme-primary);
  color: var(--tg-common-white);
}
.offCanvas__overly {
  position: fixed;
  background: #000;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.offCanvas__overly.active {
  opacity: 0.7;
  visibility: visible;
}

.contact-list h4 {
  color: var(--tg-common-black);
  font-weight: 500;
  font-size: 22px;
  margin-bottom: 15px;
}
.contact-list a {
  margin: 0;
  margin-bottom: 8px;
  font-size: 18px;
  color: var(--tg-common-black);
  line-height: 26px;
  display: flex;
  align-items: center;
}
.contact-list a i {
  font-size: 20px;
  width: 20px;
  margin-right: 15px;
}
.contact-list a:hover {
  color: var(--tg-theme-primary);
}

.offcanvas-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 10px;
}
.offcanvas-gallery .popup-image {
  position: relative;
}
.offcanvas-gallery .popup-image::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: var(--tg-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;
}
.offcanvas-gallery .popup-image:hover::after {
  transform: scale(1);
}
.offcanvas-title-wrap h3 {
  font-weight: 600;
  font-size: 34px;
  letter-spacing: -0.01em;
}

/*=========================
      03. Breadcrumb
===========================*/
.tg-breadcrumb-spacing {
  padding-top: 250px;
  padding-bottom: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tg-breadcrumb-spacing {
    padding-top: 170px;
    padding-bottom: 50px;
  }
}
@media (max-width: 575px) {
  .tg-breadcrumb-spacing {
    padding-top: 100px;
    padding-bottom: 50px;
  }
}
.tg-breadcrumb-title {
  font-weight: 700;
  font-size: 90px;
  line-height: 110%;
  color: var(--tg-common-white);
  margin: 0;
}
.single.single-post .tg-breadcrumb-title {
  font-size: 74px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tg-breadcrumb-title {
    font-size: 70px;
  }
  .single.single-post .tg-breadcrumb-title {
      font-size: 60px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-breadcrumb-title {
    font-size: 50px;
  }
  .single.single-post .tg-breadcrumb-title {
      font-size: 40px;
  }
}
@media (max-width: 575px) {
  .tg-breadcrumb-title {
    font-size: 35px;
  }
}
.tg-breadcrumb-service-spacing {
  padding: 45px 0px 35px 0px;
}
.tg-breadcrumb-navigation-title {
  font-weight: 700;
  font-size: 60px;
  line-height: 183%;
}
@media (max-width: 575px) {
  .tg-breadcrumb-navigation-title {
    font-size: 40px;
  }
}
.tg-breadcrumb-navigation ul {
  display: flex;
  align-items: center;
  justify-content: end;
}
@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) {
  .tg-breadcrumb-navigation ul {
    justify-content: inherit;
  }
}
.tg-breadcrumb-navigation ul li {
  font-weight: 500;
  font-size: 16px;
  color: var(--tg-common-black);
  margin-left: 13px;
}

.tg-text-slide-bigtext {
  font-weight: 800;
  font-size: 130px;
  line-height: 108%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-color: var(--tg-common-black);
  -webkit-text-stroke-width: 1px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-text-slide-bigtext {
    font-size: 90px;
  }
}
.tg-text-slide-active .swiper-slide {
  width: auto !important;
}

/*=============================
    09. Scroll Top
===============================*/
.scroll__top {
  width: 50px;
  height: 50px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  position: fixed;
  bottom: -10%;
  right: 50px;
  font-size: 16px;
  border-radius: 0;
  z-index: 99;
  color: var(--tg-common-white);
  text-align: center;
  cursor: pointer;
  background: var(--tg-common-black);
  transition: 1s ease;
  border-radius: 50%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .scroll__top {
    right: 25px;
    bottom: 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .scroll__top {
    right: 30px;
  }
}
@media (max-width: 575px) {
  .scroll__top {
    right: 15px;
    width: 35px;
    height: 35px;
    font-size: 14px;
  }
}
.scroll__top.open {
  bottom: 30px;
}
@media (max-width: 575px) {
  .scroll__top.open {
    bottom: 15px;
  }
}
.scroll__top::after {
  position: absolute;
  z-index: -1;
  content: "";
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 1;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
}
.scroll__top:hover {
  background: var(--tg-theme-primary);
  color: var(--tg-common-white);
}

/*=============================
	11. Section Title
===============================*/
.tg-section-subtitle {
  font-weight: 600;
  letter-spacing: -0.04em;
  color: var(--tg-common-black);
  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) {
  .tg-section-title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-section-title {
    font-size: 30px;
  }
  .tg-section-title br {
    display: none;
  }
}

/*=============================
	05. Mobile Menu
===============================*/
.tgmobile__search {
  padding: 0 20px 25px 25px;
}
.tgmobile__search form {
  position: relative;
}
.tgmobile__search input {
  border: 1px solid #d9e1e1;
  border-radius: 8px;
  width: 100%;
  height: 50px;
  background: var(--tg-common-white);
  font-family: var(--tg-ff-poppins);
  font-weight: 400;
  font-size: 16px;
  text-transform: capitalize;
  padding-right: 50px;
  color: var(--tg-grey-1);
}
.tgmobile__search input:focus {
  border-color: var(--tg-common-black);
}
.tgmobile__search input::placeholder {
  font-family: var(--tg-ff-poppins);
  font-weight: 400;
  font-size: 16px;
  text-transform: capitalize;
  color: var(--tg-grey-1);
}
.tgmobile__search button {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  border: none;
  padding: 0;
  right: 20px;
  line-height: 1;
  background: transparent;
  color: var(--tg-common-black);
}
.tgmobile__menu {
  position: fixed;
  right: 0;
  top: 0;
  width: 350px;
  padding-right: 30px;
  max-width: 100%;
  height: 100%;
  z-index: 9991;
  border-radius: 0px;
  transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -ms-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) e;
  -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -webkit-transform: translateX(101%);
  -moz-transform: translateX(101%);
  -ms-transform: translateX(101%);
  -o-transform: translateX(101%);
  transform: translateX(101%);
}
@media (max-width: 575px) {
  .tgmobile__menu {
    width: 100%;
  }
}
.tgmobile__menu .navbar-collapse {
  display: block !important;
}
.tgmobile__menu .nav-logo {
  position: relative;
  padding: 30px 25px;
  text-align: left;
}
.tgmobile__menu .nav-logo img {
  width: 150px;
}
.tgmobile__menu .navigation {
  position: relative;
  display: block;
  width: 100%;
  float: none;
  margin: 0;
  padding: 0;
}
.tgmobile__menu .navigation li {
  position: relative;
  display: block;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn {
  position: absolute;
  right: 20px;
  top: 9px;
  width: 32px;
  height: 32px;
  text-align: center;
  font-size: 16px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--tg-common-white);
  background: var(--tg-common-black);
  cursor: pointer;
  border-radius: 0;
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
  z-index: 5;
}
.tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn .plus-line {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(0);
  -ms-transform: translate(-50%, -50%) rotate(0);
  transform: translate(-50%, -50%) rotate(0);
  border-radius: 10px;
  width: 12px;
  height: 2px;
  background-color: var(--tg-common-white);
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}
.tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn .plus-line::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(0);
  -ms-transform: translate(-50%, -50%) rotate(0);
  transform: translate(-50%, -50%) rotate(0);
  border-radius: 10px;
  width: 2px;
  height: 12px;
  background-color: var(--tg-common-white);
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}
.tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open {
  background-color: var(--tg-common-black);
}
.tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open .plus-line {
  background-color: var(--tg-common-white);
}
.tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open .plus-line::after {
  display: none;
}
.tgmobile__menu .navigation li > a {
  position: relative;
  display: block;
  padding: 13px 60px 13px 25px;
  font-size: 15px;
  font-weight: 600;
  color: var(--tg-common-black);
  text-transform: uppercase;
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
  font-family: var(--tg-ff-heading);
  border: none;
  letter-spacing: 0;
}
.tgmobile__menu .navigation li > a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 0;
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
  width: 2px;
  background: var(--tg-common-black);
  pointer-events: none;
}
.tgmobile__menu .navigation li ul li > a {
  margin-left: 20px;
}
.tgmobile__menu .navigation li ul li ul li a {
  margin-left: 40px;
}
.tgmobile__menu .navigation li ul li ul li ul li a {
  margin-left: 60px;
}
.tgmobile__menu .navigation li > .sub-menu {
  display: none;
}
.tgmobile__menu .navigation li > .sub-menu > li > ul {
  display: none;
}
.tgmobile__menu .navigation ul {
  padding: 0;
  margin: 0;
}
.tgmobile__menu .navigation ul li a {
  display: block;
}
.tgmobile__menu .navigation ul li ul li > a {
  font-size: 16px;
  margin-left: 20px;
  text-transform: capitalize;
}
.tgmobile__menu .navigation:last-child {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.tgmobile__menu .navigation > li > ul > li:first-child {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.tgmobile__menu .navigation > li.active > a::before {
  height: 100%;
}
.tgmobile__menu .close-btn {
  position: absolute;
  right: 15px;
  top: 28px;
  line-height: 30px;
  width: 35px;
  text-align: center;
  font-size: 14px;
  color: var(--tg-common-black);
  cursor: pointer;
  padding: 8px;
  z-index: 10;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  font-size: 23px;
}
.tgmobile__menu-backdrop {
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  transition: all 700ms ease;
  -moz-transition: all 700ms ease;
  -webkit-transition: all 700ms ease;
  -ms-transition: all 700ms ease;
  -o-transition: all 700ms ease;
  opacity: 0;
  visibility: hidden;
  background: rgba(0, 0, 0, 0.5);
}
.tgmobile__menu .social-links ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    text-align: center;
    padding: 30px 20px 20px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 30px;
    margin: 0;
}
.tgmobile__menu .social-links ul li {
  position: relative;
  display: block;
}
.tgmobile__menu .social-links ul li a {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: 22px;
  color: var(--tg-common-black);
  -webkit-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}
.tgmobile__menu .social-links ul li a svg {
  width: 18px;
}
.tgmobile__menu .social-links ul li a:hover {
  color: var(--tg-grey-1);
}
.tgmobile__menu .tgmenu__action {
  padding: 0 0;
  margin: 0 0;
}
.tgmobile__menu .tgmenu__action > ul {
  margin: 0 0;
  padding: 30px 20px 0;
  justify-content: center;
  gap: 0 15px;
}
.tgmobile__menu .tgmenu__action > ul li {
  margin: 0 0;
}
.tgmobile__menu .tgmenu__action > ul .header-btn {
  display: block;
}
.tgmobile__menu-box {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--tg-common-white);
  padding: 0px 0px;
  z-index: 5;
  box-shadow: -9px 0 14px 0px rgba(0, 0, 0, 0.06);
}
.tgmobile__menu-outer .mobile-nav-toggler {
  position: relative;
  float: right;
  font-size: 40px;
  line-height: 50px;
  cursor: pointer;
  display: none;
  color: var(--tg-color-white-default);
  margin-right: 30px;
  top: 15px;
}

.mobile-menu-visible {
  overflow: hidden;
}
.mobile-menu-visible .tgmobile__menu {
  -webkit-transform: translateX(0%);
  -moz-transform: translateX(0%);
  -ms-transform: translateX(0%);
  -o-transform: translateX(0%);
  transform: translateX(0%);
}
.mobile-menu-visible .tgmobile__menu-backdrop {
  opacity: 1;
  visibility: visible;
}
.mobile-menu-visible .tgmobile__menu .close-btn {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}

@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) {
  .header-mobile-spacing {
    padding: 20px 0px;
  }
}

/*=============================
    01. Animation
===============================*/
@-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;
  }
}
@keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }
  100% {
    margin-top: 0;
  }
}
/*img-animation**********************/
.img-custom-anim-right {
  animation: img-anim-right 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.1s;
  opacity: 0;
}

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

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

@keyframes img-anim-top {
  0% {
    transform: translateY(-5%);
    clip-path: inset(0 0 100% 0);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
@keyframes upslide {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-20px);
  }
}
.upslide {
  animation: upslide 4s linear forwards infinite alternate;
}

.tg-rotate {
  -webkit-animation: rotate-infinite 15s linear infinite;
  animation: rotate-infinite 15s linear infinite;
}

@-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);
  }
}
/*=============================
	10. Search
===============================*/
.search__popup {
  padding-top: 70px;
  padding-bottom: 100px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: var(--tg-common-white);
  backdrop-filter: blur(10px);
  z-index: 99999999;
  -webkit-transform: translateY(calc(-100% - 80px));
  -moz-transform: translateY(calc(-100% - 80px));
  -ms-transform: translateY(calc(-100% - 80px));
  -o-transform: translateY(calc(-100% - 80px));
  transform: translateY(calc(-100% - 80px));
  -webkit-transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  -moz-transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition-delay: 0.5s;
}
.search__popup.search-opened {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -ms-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  transition-delay: 0s;
}
.search__popup.search-opened .search__input {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
  opacity: 1;
  transition-delay: 0.3s;
}
.search__popup.search-opened .search__input::after {
  width: 100%;
  transition-delay: 0.5s;
}
.search__input {
  position: relative;
  height: 80px;
  -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -o-transform: translateY(-40px);
  transform: translateY(-40px);
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  transition-delay: 0.5s;
  opacity: 0;
}
.search__input::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 0%;
  height: 1px;
  background-color: var(--tg-common-black);
  transition-delay: 0.3s;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.search__input input {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: 0;
  outline: 0;
  font-size: 24px;
  color: var(--tg-common-black);
  border-bottom: 1px solid transparent;
  padding: 0;
  padding-right: 30px;
}
.search__input input::placeholder {
  font-size: 24px;
  color: var(--tg-grey-1);
}
.search__input button {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 18px;
  color: var(--tg-common-black);
  border: none;
  padding: 0 0;
  background: transparent;
}
.search__close {
  position: absolute;
  top: 10%;
  right: 2%;
  z-index: 2;
}
.search-close-btn {
  margin: 0;
  padding: 0;
  border: none;
  color: var(--tg-common-black);
  cursor: pointer;
  background: transparent;
}
.search-close-btn:hover {
  color: var(--tg-theme-primary);
}
.search-popup-overlay {
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 4;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  transition-delay: 0.5s;
  opacity: 0;
  visibility: hidden;
  background: #000d25;
}
.search-popup-overlay.search-popup-overlay-open {
  opacity: 0.55;
  visibility: visible;
  transition-delay: 0s;
}

.search-input-field ~ .search-focus-border {
  position: absolute;
  bottom: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 1px;
  background-color: var(--tg-theme-primary);
  transition: all 0.5s;
  z-index: 1;
}
.search-input-field:focus ~ .search-focus-border {
  width: 100%;
  left: 0;
  right: auto;
  transition: all 0.5s;
}

/*=============================
	12. spacing default responsive
===============================*/
@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;
  }
}

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

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

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

/*=============================
    12. header
===============================*/
.tg-header-search {
  width: 60px;
  height: 60px;
  border: 1px solid var(--tg-common-black);
  border-radius: 50%;
  color: var(--tg-common-black);
}
.tg-header-search i {
  font-weight: 500;
}
.tg-header-4-right .tg-header-search {
  border: 1px solid var(--tg-common-white);
  color: var(--tg-common-white);
}
.tg-header-4-right .tgmenu-offcanvas-open-bar {
  border: 1px solid var(--tg-common-white);
}
.tg-header-4-right .tgmenu-offcanvas-open-bar span {
  background: var(--tg-common-white);
}

.header-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  opacity: 1;
  width: 100%;
  z-index: 999;
  visibility: visible;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0px 1px 3px 0px rgba(18, 20, 32, 0.14);
  animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  -webkit-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  backdrop-filter: blur(10px);
}
.header-sticky .tgmenu__navbar-wrap > ul > li > a {
  padding: 35px 0px;
}
.header-sticky .tgmenu-main-4 > ul > li > a {
  color: var(--tg-common-black);
}
.header-sticky .tg-header-logo .logo-1 {
  display: none;
}
.header-sticky .tg-header-logo .logo-2 {
  display: block !important;
}
.header-sticky .tg-header-4-right .tg-header-search {
  border: 1px solid var(--tg-common-black);
  color: var(--tg-common-black);
}
.header-sticky .tg-header-4-right .tgmenu-offcanvas-open-bar {
  border: 1px solid var(--tg-common-black);
}
.header-sticky .tg-header-4-right .tgmenu-offcanvas-open-bar span {
  background: var(--tg-common-black);
}

/*=============================
    14. Menu
===============================*/
.tgmenu__navbar-wrap>ul.navigation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0;
  padding: 0;
  position: relative;
  gap: 0 45px;
}
.tgmenu__navbar-wrap > ul > li {
  display: block;
  position: relative;
  list-style: none;
}

.tgmenu__navbar-wrap > ul > li > a {
  font-weight: 500;
  font-size: 15px;
  display: block;
  color: var(--tg-common-black);
  padding: 40px 0px;
  font-family: var(--tg-ff-heading);
  text-transform: uppercase;
}
.tgmenu__navbar-wrap > ul > li > a:hover .effect-1 {
  top: -100%;
}
.tgmenu__navbar-wrap > ul > li .sub-menu {
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 280px;
  background: var(--tg-common-white);
  margin: 0;
  -webkit-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  -o-transform: scale(1, 0);
  transform: scale(1, 0);
  transform-origin: 0 0;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  -webkit-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
  -moz-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
  box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15);
  border-radius: 0;
  padding: 18px 0;
  display: block;
  visibility: hidden;
  opacity: 0;
  z-index: 9;
}
.tgmenu__navbar-wrap > ul > li .sub-menu.sub-menu-right {
  right: 0;
  left: auto;
}
.tgmenu__navbar-wrap > ul > li .sub-menu .sub-menu {
  right: auto;
  left: 100%;
  top: 0;
}
.tgmenu__navbar-wrap > ul > li .sub-menu li {
  margin-left: 0;
  text-align: left;
  display: block;
}
.tgmenu__navbar-wrap > ul > li .sub-menu li a {
  padding: 6px 25px 6px 25px;
  font-weight: 500;
  font-size: 15px;
  display: block;
  color: var(--tg-common-black);
  margin: 0;
  font-family: var(--tg-ff-heading);
  text-transform: capitalize;
}
.tgmenu__navbar-wrap > ul > li .sub-menu li:hover > a, .tgmenu__navbar-wrap > ul > li .sub-menu li.active > a {
  color: var(--tg-theme-primary);
}
.tgmenu__navbar-wrap ul li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.tgmenu__navbar-wrap > ul > li.active > a, .tgmenu__navbar-wrap > ul > li:hover > a {
  color: var(--tg-theme-primary) !important;
}
.tgmenu-offcanvas-open-bar {
  background: transparent;
  position: relative;
  height: 60px;
  width: 60px;
  border: 1px solid var(--tg-common-black);
  border-radius: 50%;
  text-align: center;
  line-height: 54px;
  padding-top: 20px;
  cursor: pointer;
}
@media (max-width: 575px) {
  .tgmenu-offcanvas-open-bar {
    height: 45px;
    width: 45px;
    padding-top: 13px;
  }
}
.tgmenu-offcanvas-open-bar:hover span:nth-child(2) {
  transform: translateX(0);
}
.tgmenu-offcanvas-open-bar span {
  display: block;
  height: 2px;
  width: 22px;
  background: var(--tg-common-black);
  margin: auto;
  transition: 0.4s;
}
.tgmenu-offcanvas-open-bar span:not(:last-child) {
  margin-bottom: 6px;
}
.tgmenu-offcanvas-open-bar span:nth-child(2) {
  transform: translateX(2px);
}
.tgmenu-link-effect {
  position: relative;
  overflow: hidden;
  display: block;
  height: 17px;
  line-height: normal;
}
.tgmenu-link-effect .effect-1 {
  display: block;
  height: 100%;
  position: relative;
  top: 0%;
  transition: 0.3s;
}
.tgmenu__wrap-two .tgmenu__navbar-wrap > ul > li.active > a, .tgmenu__wrap-two .tgmenu__navbar-wrap > ul > li:hover > a {
  color: var(--tg-common-black) !important;
}
.tgmenu-main-4 > ul > li > a {
  color: var(--tg-common-white);
}

.tg-menu-full {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  padding: 0;
  width: 100%;
  min-width: 100%;
  z-index: 999;
  background: var(--tg-common-white);
  box-shadow: 0px 10px 30px 0px rgba(25, 25, 26, 0.1);
  overflow: hidden;
  margin: auto;
}
.tg-menu-full .tg-full-wrapper {
  padding: 30px 30px 0px 30px;
}
.tg-menu-full .tg-full-wrapper .full {
  margin-bottom: 25px;
}
.tg-menu-full .tg-full-wrapper .full-thumb {
  height: 250px;
  border-radius: 4px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
  .tg-menu-full .tg-full-wrapper .full-thumb {
    height: auto;
  }
}
.tg-menu-full .tg-full-wrapper .full-thumb a {
  padding: 0;
}
.tg-menu-full .tg-full-wrapper .full-thumb img {
  transition: all 0.4s ease;
  object-fit: cover;
}
.tg-menu-full .tg-full-wrapper .full-thumb:hover img {
  transform: scale(1.06);
}
.tg-menu-full .tg-full-wrapper .full-thumb-wrap {
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  position: relative;
}
.tg-menu-full .tg-full-wrapper .full-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  color: var(--tg-common-black);
}
.tg-menu-full .tg-full-wrapper .full-title.active a {
  color: var(--tg-theme-primary);
}
.tg-menu-full .tg-full-wrapper .full-title a {
  padding: 0;
  color: var(--tg-common-black);
}
.tg-menu-full .tg-full-wrapper .full-title a:hover {
  color: var(--tg-theme-primary);
}
.tg-menu-full .tg-full-wrapper .comeing-soon .full-thumb {
  position: relative;
}
.tg-menu-full .tg-full-wrapper .comeing-soon .full-thumb::before {
  position: absolute;
  z-index: 22;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  backdrop-filter: blur(6px);
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 6px;
}

/*=============================
    	13. hero
===============================*/
.tg-hero-content {
  padding-left: 125px;
}
@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) {
  .tg-hero-content {
    padding-left: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-content {
    padding-top: 0px;
  }
}
.tg-hero-title {
  font-weight: 800;
  font-size: 140px;
  line-height: 1;
  color: #000;
}
@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) {
  .tg-hero-title {
    font-size: 130px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-title {
    font-size: 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) {
  .tg-hero-title {
    font-size: 80px;
  }
}
@media (max-width: 575px) {
  .tg-hero-title {
    font-size: 40px;
  }
}
.tg-hero-title img {
  margin-left: -20px;
}
@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) {
  .tg-hero-title img {
    width: 100px;
  }
}
@media (max-width: 575px) {
  .tg-hero-title img {
    width: 70px;
    margin-left: 0;
  }
}
.tg-hero-thumb {
  float: 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) {
  .tg-hero-thumb {
    float: inherit;
    padding-top: 30px;
  }
  .tg-hero-thumb img {
    width: 100%;
  }
}
.tg-hero-spacing {
  padding-top: 50px;
}
.tg-hero-bigtext {
  font-weight: 800;
  font-size: 300px;
  line-height: 1;
  color: var(--tg-theme-primary);
  margin-bottom: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-bigtext {
    font-size: 200px;
  }
}
@media (max-width: 575px) {
  .tg-hero-bigtext {
    font-size: 100px;
  }
}
.tg-hero-text-slide-active {
  margin-top: -135px;
}
@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) {
  .tg-hero-text-slide-active {
    margin-top: -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) {
  .tg-hero-text-slide-active {
    margin-top: -50px;
  }
}
@media (max-width: 575px) {
  .tg-hero-text-slide-active {
    margin-top: 0;
  }
}
.tg-hero-text-slide-active .swiper-slide {
  width: auto !important;
}
.tg-hero-text-shape {
  position: absolute;
  bottom: 36px;
  left: 0;
  width: 100%;
  z-index: 22;
}
@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) {
  .tg-hero-text-shape {
    bottom: 23px;
  }
}
.tg-hero-2-spacing {
  padding-top: 245px;
  padding-bottom: 195px;
}
@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) {
  .tg-hero-2-spacing {
    padding-top: 170px;
    padding-bottom: 110px;
  }
}
.tg-hero-2-title {
  font-weight: 700;
  font-size: 120px;
  line-height: 1;
  letter-spacing: -0.03em;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tg-hero-2-title {
    font-size: 90px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-2-title {
    font-size: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-hero-2-title {
    font-size: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-2-title {
    font-size: 40px;
  }
  .tg-hero-2-title br {
    display: none;
  }
}
.tg-hero-2-para {
  padding-right: 587px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tg-hero-2-para {
    padding-right: 415px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-2-para {
    padding-right: 318px;
  }
}
@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) {
  .tg-hero-2-para {
    padding-right: 0;
  }
}
@media (max-width: 575px) {
  .tg-hero-2-para {
    flex-direction: column;
  }
}
.tg-hero-2-shape {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}
.tg-hero-2-shape-two {
  position: absolute;
  right: 195px;
  bottom: 210px;
}
@media (max-width: 575px) {
  .tg-hero-2-shape-two {
    display: none;
  }
}
.tg-hero-2-thumb {
  position: absolute;
  right: 0;
  top: 175px;
  z-index: -1;
  width: 55%;
  height: 92%;
  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) {
  .tg-hero-2-thumb {
    position: inherit;
    margin-top: 30px;
    width: 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) {
  .tg-hero-2-btn {
    margin-right: 20px;
  }
}
.tg-hero-3-title {
  font-weight: 700;
  font-size: 87px;
  line-height: 122%;
  letter-spacing: 0px;
}
@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) {
  .tg-hero-3-title {
    font-size: 65px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-3-title {
    font-size: 45px;
  }
}
@media (max-width: 575px) {
  .tg-hero-3-title {
    font-size: 35px;
  }
}
.tg-hero-3-banner {
  flex-wrap: wrap;
  padding: 17px 115px 17px 30px;
  transform: translateY(-13px);
}
@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) {
  .tg-hero-3-banner {
    transform: translateY(1px);
  }
}
@media (max-width: 575px) {
  .tg-hero-3-banner {
    padding: 11px 15px 11px 15px;
  }
}
.tg-hero-3-banner span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  line-height: 1;
  font-family: var(--tg-ff-heading);
  letter-spacing: 0px;
}
.tg-hero-3-roundedtext {
  width: 72px;
  height: 72px;
  display: inline-block;
  background: var(--tg-theme-primary);
  line-height: 56px;
  text-align: center;
  border-radius: 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) {
  .tg-hero-3-roundedtext {
    display: none;
  }
}
.tg-hero-3-roundedtext .shape {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
}
.tg-hero-3-para {
  margin-left: 670px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-3-para {
    margin-left: 400px;
  }
}
@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) {
  .tg-hero-3-para {
    margin-left: 0;
  }
}
@media (max-width: 575px) {
  .tg-hero-3-para {
    flex-wrap: wrap;
  }
}
.tg-hero-3-spacing {
  padding-top: 120px;
  padding-bottom: 70px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-3-spacing {
    padding-top: 80px;
  }
}
@media (max-width: 575px) {
  .tg-hero-3-spacing {
    padding-top: 30px;
  }
}
.tg-hero-3-shape {
  margin-top: -20px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-3-shape {
    margin-top: 0;
    margin-bottom: 30px;
  }
}
.tg-hero-3-shape-2 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}
.tg-hero-3-transparent-text {
  font-weight: 800;
  font-size: 300px;
  color: #f0f0f0;
  position: absolute;
  bottom: 96px;
  left: 0;
  line-height: 1;
  z-index: -1;
  font-family: var(--tg-ff-heading);
  margin-left: -135px;
}
@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) {
  .tg-hero-3-transparent-text {
    font-size: 163px;
    margin-left: -50px;
    bottom: 158px;
  }
}
@media (max-width: 575px) {
  .tg-hero-3-transparent-text {
    font-size: 100px;
  }
}
.tg-hero-4-shape {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
.tg-hero-4-btn {
  padding-top: 252px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-4-btn {
    padding-top: 50px;
  }
}
.tg-hero-4-spacing {
  padding-top: 135px;
  padding-bottom: 50px;
}
.tg-hero-4-right-shape {
  position: absolute;
  right: 0;
  bottom: 0;
}
@media (max-width: 575px) {
  .tg-hero-4-right-shape {
    width: 80px;
  }
}
.tg-hero-4-text-slide-active .swiper-slide {
  width: auto !important;
}
.tg-hero-4-bigtext {
  font-weight: 800;
  font-size: 140px;
  line-height: 100%;
  color: var(--tg-common-white);
  transition: all 0.4s ease;
}
.tg-hero-4-bigtext:hover {
  filter: blur(7px);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-4-bigtext {
    font-size: 90px;
  }
}
.tg-hero-4-bigtext:hover {
  backdrop-filter: blur(14px);
}
.tg-hero-5-content {
  margin-left: 100px;
}
@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) {
  .tg-hero-5-content {
    margin-left: 0;
  }
}
.tg-hero-5-spacing {
  padding-top: 160px;
  padding-bottom: 210px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tg-hero-5-spacing {
    padding-top: 120px;
  }
}
@media (max-width: 575px) {
  .tg-hero-5-spacing {
    padding-top: 90px;
    padding-bottom: 110px;
  }
}
.tg-hero-5-title {
  font-weight: 700;
  font-size: 180px;
  line-height: 100%;
  letter-spacing: 0;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tg-hero-5-title {
    font-size: 140px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-5-title {
    font-size: 120px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-hero-5-title {
    font-size: 90px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-5-title {
    font-size: 80px;
  }
  .tg-hero-5-title span {
    margin-left: 0;
  }
  .tg-hero-5-title img {
    margin-left: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tg-hero-5-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .tg-hero-5-title {
    font-size: 34px;
  }
}
@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) {
  .tg-hero-5-title .star {
    width: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-5-title .star {
    width: 50px;
    transform: translateY(-6px);
  }
}
@media (max-width: 575px) {
  .tg-hero-5-title .star {
    width: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-5-title .avatar {
    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) {
  .tg-hero-5-title .avatar {
    width: 100px;
  }
}
@media (max-width: 575px) {
  .tg-hero-5-title .avatar {
    width: 60px;
  }
}
.tg-hero-5-para {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}
@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) {
  .tg-hero-5-para br {
    display: none;
  }
}
.tg-hero-5-text {
  margin-top: -143px;
  margin-left: -30px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-5-text {
    margin-top: -120px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-hero-5-text {
    margin-top: -74px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-5-text {
    margin-top: 40px;
    margin-left: 0;
  }
}
.tg-hero-5-shape {
  position: absolute;
  bottom: 0;
  left: 80px;
  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) {
  .tg-hero-5-shape {
    left: 0;
    width: 300px;
  }
}
@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) {
  .tg-hero-5-shape {
    width: 200px;
  }
}
@media (max-width: 575px) {
  .tg-hero-5-shape {
    width: 100px;
  }
}
.tg-hero-5-shape-two {
  position: absolute;
  bottom: -80px;
  right: 172px;
  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) {
  .tg-hero-5-shape-two {
    width: 150px;
    bottom: -40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-5-shape-two {
    right: 0;
  }
}
@media (max-width: 575px) {
  .tg-hero-5-shape-two {
    width: 100px;
  }
}
.tg-hero-6-spacing {
  padding-top: 127px;
  padding-bottom: 180px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-6-spacing {
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-6-content {
    margin-bottom: 20px;
  }
}
.tg-hero-6-title {
  font-weight: 700;
  font-size: 90px;
  line-height: 111%;
  color: var(--tg-common-white);
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tg-hero-6-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .tg-hero-6-title {
    font-size: 44px;
  }
}
.tg-hero-6-thumb {
  position: absolute;
  bottom: -209px;
  left: 0;
  width: 50%;
  height: 540px;
}
@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) {
  .tg-hero-6-thumb {
    width: 48%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-hero-6-thumb {
    bottom: -100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-6-thumb {
    bottom: 0;
    width: 100%;
    position: inherit;
    height: auto;
    margin-bottom: 30px;
  }
}
.tg-hero-6-thumb img {
  object-fit: cover;
  height: 100%;
}
.tg-hero-6-btn {
  margin-right: -85px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-6-btn {
    margin-right: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-6-btn .tg-portfolio-4-btn {
    flex-direction: column;
    align-items: flex-start;
  }
}
.tg-hero-6-btn .tg-btn-rounded {
  background: var(--tg-common-white);
  border-color: var(--tg-common-white);
}
@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) {
  .tg-hero-6-btn .tg-btn-rounded {
    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) {
  .tg-hero-6-btn .tg-btn-rounded {
    margin-bottom: 20px;
  }
}
.tg-hero-6-btn .tg-btn-rounded:hover {
  border-color: var(--tg-common-black);
}
.tg-hero-6-btn .tg-portfolio-4-btn p {
  color: var(--tg-common-white);
}
.tg-hero-6-icon {
  display: flex;
  justify-content: space-between;
  flex: 0 0 auto;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-6-icon {
    margin-left: 0;
  }
}
@media (max-width: 575px) {
  .tg-hero-6-icon {
    padding-bottom: 0;
  }
}
.tg-hero-6-icon span {
  display: inline-block;
  margin: 0 5px;
}
@media (max-width: 575px) {
  .tg-hero-6-icon span {
    width: 60px;
  }
}
.tg-hero-7-title {
  font-weight: 700;
  font-size: 100px;
  line-height: 110%;
  text-align: center;
  color: var(--tg-common-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tg-hero-7-title {
    font-size: 70px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tg-hero-7-title {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .tg-hero-7-title {
    font-size: 35px;
  }
}
.tg-hero-7-spacing {
  padding-top: 207px;
  padding-bottom: 225px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-7-spacing {
    padding-top: 120px;
    padding-bottom: 180px;
  }
}
.tg-hero-7-bg {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
}
.tg-hero-7-content {
  position: relative;
  z-index: 3;
}
.tg-hero-7-next {
  font-weight: 700;
  font-size: 24px;
  text-align: center;
  color: var(--tg-common-white);
  font-family: var(--tg-ff-heading);
  transition: all 0.4 ease;
}
.tg-hero-7-next:hover {
  color: var(--tg-theme-primary);
}
.tg-hero-7-prev {
  width: 80px;
  height: 80px;
  display: inline-block;
  background: var(--tg-common-black);
  color: var(--tg-common-white);
  text-align: center;
  line-height: 80px;
  border-radius: 50%;
  transition: all 0.4s ease;
}
.tg-hero-7-prev:hover {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
}
.tg-hero-7-navigation {
  position: absolute;
  bottom: 60px;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 88%;
  margin: 0 120px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-7-navigation {
    margin: 0 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-7-navigation {
    margin: 0 30px;
  }
}
.tg-hero-7-shape {
  position: absolute;
  bottom: 0;
  right: 0;
  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) {
  .tg-hero-7-shape {
    display: none;
  }
}
.tg-hero-7-zoom .swiper-slide.swiper-slide-active .text {
  -webkit-animation-name: fadeInUp;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 0.8s;
  animation-duration: 1s;
  opacity: 1;
}
.tg-hero-7-zoom .swiper-slide.swiper-slide-active .text2 {
  -webkit-animation-name: fadeInUp;
  animation-fill-mode: both;
  animation-name: fadeInUp;
  animation-delay: 0.9s;
  animation-duration: 1s;
  opacity: 1;
}
.tg-hero-8-spacing {
  padding-top: 175px;
  padding-bottom: 155px;
}
@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) {
  .tg-hero-8-spacing {
    padding-top: 120px;
    padding-bottom: 120px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-spacing {
    padding-bottom: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-spacing {
    padding-top: 90px;
  }
}
.tg-hero-8-subtitle {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  color: var(--tg-theme-primary);
  display: inline-block;
}
.tg-hero-8-title {
  font-size: 150px;
  line-height: 80%;
  letter-spacing: -0.02em;
  color: var(--tg-common-white);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-8-title {
    font-size: 115px;
  }
}
@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) {
  .tg-hero-8-title {
    font-size: 100px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-title {
    font-size: 70px;
  }
}
@media (max-width: 575px) {
  .tg-hero-8-title {
    font-size: 50px;
  }
}
.tg-hero-8-contact-info {
  column-count: 2;
  margin-right: 340px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-8-contact-info {
    margin-right: 240px;
  }
}
@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) {
  .tg-hero-8-contact-info {
    margin-right: 150px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-contact-info {
    margin-right: 0;
    column-count: 1;
  }
}
.tg-hero-8-contact-info a {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-white);
  display: flex;
  margin-bottom: 15px;
}
.tg-hero-8-contact-info a:hover {
  color: var(--tg-theme-primary);
}
.tg-hero-8-contact-info a i {
  transform: translateY(5px);
  margin-right: 20px;
}
.tg-hero-8-btn {
  margin-left: 270px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-hero-8-btn {
    margin-left: 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) {
  .tg-hero-8-btn {
    margin-left: 0;
  }
}
.tg-hero-8-thumb {
  position: absolute;
  bottom: 0;
  right: 26px;
  width: 38%;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-thumb {
    width: auto;
    position: inherit;
    right: auto;
  }
}
.tg-hero-8-thumb img {
  mix-blend-mode: luminosity;
}
.tg-hero-8-author-position {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
  background: var(--tg-theme-primary);
  transform: rotate(-10deg);
  font-family: var(--tg-ff-heading);
  padding: 14px 20px;
  position: absolute;
  bottom: 192px;
  right: 314px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-author-position {
    right: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-hero-8-author-position {
    bottom: 100px;
  }
}
@media (max-width: 575px) {
  .tg-hero-8-author-position {
    font-size: 20px;
  }
}
.tg-hero-8-shape {
  position: absolute;
  bottom: 0;
  right: -25px;
}
.tg-hero-8-shape-two {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 27%;
}

/*=============================
    	01. about
===============================*/
@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) {
  .tg-about-item {
    margin-left: 0;
  }
}
.tg-about-item h4 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.02em;
}
.tg-about-item p {
  font-size: 18px;
  color: #000;
}
.tg-about-shape {
  margin-left: -40px;
}
.tg-about-bigtext {
  position: absolute;
  bottom: 130px;
  right: 0;
  font-weight: 500;
  font-size: 210px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 0;
  color: rgba(0, 0, 0, 0.15);
  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) {
  .tg-about-bigtext {
    font-size: 160px;
  }
}
@media (max-width: 575px) {
  .tg-about-bigtext {
    font-size: 100px;
  }
}
.tg-about-2-content {
  margin-right: 400px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-about-2-content {
    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) {
  .tg-about-2-content {
    margin-right: 0px;
    margin-bottom: 40px;
  }
}
.tg-about-2-content p {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: #000;
}
@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) {
  .tg-about-2-clients {
    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) {
  .tg-about-2-clients {
    margin-bottom: 30px;
  }
}
.tg-about-2-clients h4 {
  font-weight: 600;
  font-size: 50px;
  letter-spacing: -0.02em;
  margin-bottom: 0;
}
.tg-about-2-clients span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  margin-bottom: 14px;
  display: 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) {
  .tg-about-2-thumb-two {
    padding-top: 0;
  }
}
.tg-about-3-thumb {
  margin-top: -140px;
}
@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) {
  .tg-about-3-thumb {
    margin-top: 0;
  }
}
.tg-about-3-border {
  height: 1px;
  width: 100%;
  background: var(--tg-common-black);
}
@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) {
  .tg-about-3-content p br {
    display: none;
  }
}
.tg-about-3-counter-item h2 {
  font-weight: 500;
  font-size: 70px;
  letter-spacing: -0.01em;
}
@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) {
  .tg-about-3-counter-item h2 {
    font-size: 60px;
  }
}
.tg-about-5-para {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}
@media (max-width: 575px) {
  .tg-about-5-thumb-three {
    padding-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) {
  .tg-about-5-thumb-wrap {
    margin-right: 30px;
  }
}
@media (max-width: 575px) {
  .tg-about-5-thumb-wrap {
    margin-right: 0;
  }
}
.tg-about-6-thumb {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 51%;
  height: 524px;
}
@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) {
  .tg-about-6-thumb {
    height: 450px;
  }
}
@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) {
  .tg-about-6-thumb {
    position: inherit;
    width: 100%;
    height: auto;
    margin-bottom: 30px;
  }
}
.tg-about-6-thumb img {
  object-fit: cover;
  height: 100%;
}

/*=============================
    18. service
===============================*/
.tg-service-item {
  border-top: 1px solid var(--tg-common-black);
  border-bottom: 1px solid var(--tg-common-black);
  padding: 43px 0px 20px 60px;
  margin-top: -1px;
  transition: all 0.4s ease;
  position: relative;
  z-index: 1;
}
@media (max-width: 575px) {
  .tg-service-item {
    padding: 23px 15px 20px 15px;
  }
}
.tg-service-item::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 0;
  background: var(--tg-common-black);
  top: auto;
  bottom: 0;
  left: 0;
  transition: all 0.4s ease;
  z-index: -1;
}
.tg-service-item:hover::before {
  height: 100%;
  top: 0;
  bottom: auto;
}
.tg-service-item:hover .tg-service-item-title span {
  color: var(--tg-common-white);
}
.tg-service-item:hover .tg-service-item-title h3 {
  color: var(--tg-common-white);
}
.tg-service-item:hover .tg-service-text p {
  opacity: 0;
}
.tg-service-item:hover .tg-service-text img {
  opacity: 1;
  visibility: visible;
}
.tg-service-item:hover .tg-service-btn a {
  border: 1px solid var(--tg-theme-primary);
  background: var(--tg-theme-primary);
}
.tg-service-item-title {
  display: flex;
  align-items: center;
}
.tg-service-item-title span {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
  transition: all 0.3s 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) {
  .tg-service-item-title span {
    margin-right: 15px;
  }
}
.tg-service-item-title h3 {
  font-weight: 700;
  font-size: 30px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
  margin-bottom: 0;
  transition: all 0.3s ease;
}
.tg-service-text {
  position: relative;
  overflow: hidden;
}
.tg-service-text p {
  color: var(--tg-common-black);
  transition: all 0.3s ease;
  margin-bottom: 0;
}
.tg-service-text img {
  position: absolute;
  top: -1px;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  height: 100%;
}
@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) {
  .tg-service-text img {
    top: 0;
  }
}
.tg-service-btn a {
  border: 1px solid var(--tg-common-black);
  border-radius: 40px;
  width: 64px;
  height: 64px;
  display: inline-block;
  text-align: center;
  line-height: 59px;
  transition: all 0.4s ease;
  color: var(--tg-common-black);
}
.tg-service-2-subtitle {
  font-weight: 600;
  font-size: 18px;
  color: var(--tg-common-white);
  display: block;
}
.tg-service-2-item {
  font-family: var(--tg-ff-heading);
  font-weight: 700;
  font-size: 80px;
  line-height: 1;
  color: var(--tg-common-white);
  display: flex;
  align-items: center;
  transition: all 0.6s ease;
  border-top: 1px solid var(--tg-common-white);
  border-bottom: 1px solid var(--tg-common-white);
  padding-top: 30px;
  padding-bottom: 30px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-service-2-item {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .tg-service-2-item {
    font-size: 30px;
  }
}
.tg-service-2-item:hover {
  padding-left: 60px;
  color: var(--tg-theme-primary);
}
@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) {
  .tg-service-2-item:hover {
    padding-left: 10px;
  }
}
.tg-service-2-item span {
  font-family: var(--tg-ff-heading);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--tg-common-black);
  width: 40px;
  height: 40px;
  display: inline-block;
  background: var(--tg-theme-primary);
  border-radius: 60px;
  text-align: center;
  line-height: 40px;
  margin-right: 30px;
}
.tg-service-3-icon {
  color: rgba(28, 29, 31, 0.15);
  transition: all 0.4s ease;
}
.tg-service-3-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 25px 0px;
  border-bottom: 1px solid var(--tg-common-black);
}
@media (max-width: 575px) {
  .tg-service-3-item {
    padding: 15px 0px;
  }
}
.tg-service-3-item:hover {
  background: var(--tg-common-white);
  border-color: var(--tg-common-white);
  padding: 25px 30px;
}
@media (max-width: 575px) {
  .tg-service-3-item:hover {
    padding: 15px 10px;
  }
}
.tg-service-3-item:hover .tg-service-3-icon {
  color: var(--tg-common-black);
}
@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) {
  .tg-service-3-item-wrap {
    margin-right: 0;
    margin-left: 0;
  }
}
.tg-service-3-item-content span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  display: inline-block;
  margin-bottom: 2px;
}
.tg-service-3-item-content h4 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.01em;
}
@media (max-width: 575px) {
  .tg-service-3-item-content h4 {
    font-size: 18px;
  }
}
.tg-service-4-item h4 {
  font-weight: 700;
  font-size: 44px;
  line-height: 114%;
  letter-spacing: -0.01em;
  color: var(--tg-common-white);
}
@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) {
  .tg-service-4-item h4 {
    font-size: 35px;
  }
}
.tg-service-4-item h4 a:hover {
  color: var(--tg-theme-primary);
}
.tg-service-4-item p {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-white);
}
.tg-service-4-item .link {
  font-weight: 500;
  font-size: 16px;
  line-height: 175%;
  text-transform: uppercase;
  color: var(--tg-common-white);
  border-bottom: 1px solid transparent;
}
.tg-service-4-item .link:hover {
  color: var(--tg-theme-primary);
  border-color: var(--tg-theme-primary);
}
.tg-service-5-item {
  border-top: 1px solid var(--tg-common-white);
  border-bottom: 1px solid var(--tg-common-white);
  padding: 43px 0px 20px 60px;
  margin-top: -1px;
  transition: all 0.4s ease;
  position: relative;
  z-index: 1;
}
@media (max-width: 575px) {
  .tg-service-5-item {
    padding: 43px 20px 20px 20px;
  }
}
.tg-service-5-item:hover {
  border-top: 1px solid var(--tg-common-black);
  border-bottom: 1px solid var(--tg-common-black);
}
.tg-service-5-item:hover .tg-service-5-item-title span {
  color: var(--tg-theme-primary);
}
.tg-service-5-item:hover .tg-service-5-item-title h3 {
  color: var(--tg-theme-primary);
}
.tg-service-5-item:hover .tg-service-5-btn a {
  border: 1px solid var(--tg-theme-primary);
  background: var(--tg-theme-primary);
}
.tg-service-5-item:hover .tg-service-5-thumb {
  opacity: .3;
  visibility: visible;
}
.tg-service-5-item-title {
  display: flex;
  align-items: center;
}
.tg-service-5-item-title h3 {
  font-weight: 700;
  font-size: 30px;
  line-height: 107%;
  letter-spacing: -0.01em;
  color: var(--tg-common-white);
  transition: all 0.4s ease;
}
.tg-service-5-item-title span {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-white);
  transition: all 0.4s ease;
}
@media (max-width: 575px) {
  .tg-service-5-item-title span {
    margin-right: 20px;
  }
}
.tg-service-5-text p {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-white);
  transition: all 0.4s 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) {
  .tg-service-5-text p br {
    display: none;
  }
}
.tg-service-5-btn a {
  border: 1px solid var(--tg-common-white);
  border-radius: 40px;
  width: 64px;
  height: 64px;
  display: inline-block;
  text-align: center;
  color: var(--tg-common-white);
  line-height: 59px;
  transition: all 0.4s 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) {
  .tg-service-5-title-text {
    margin-right: 0;
  }
}
.tg-service-5-thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100% !important;
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  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) {
  .tg-service-5-thumb {
    height: 100%;
    object-fit: cover;
  }
}
.tg-service-6-count {
  font-weight: 700;
  font-size: 200px;
  line-height: 0.8;
  letter-spacing: -0.01em;
  background: linear-gradient(180deg, #cbca7b 0%, rgba(255, 255, 255, 0) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: -53px;
}
@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) {
  .tg-service-6-count {
    font-size: 170px;
  }
}
.tg-service-6-title {
  font-weight: 700;
  font-size: 44px;
  line-height: 114%;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
}
@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) {
  .tg-service-6-title {
    font-size: 35px;
  }
}
.tg-service-6-para {
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}
.tg-service-6-btn {
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--tg-common-black);
  font-family: var(--tg-ff-heading);
  border-bottom: 1px solid transparent;
}
.tg-service-6-btn:hover {
  border-color: var(--tg-common-black);
}
.tg-service-7-wrap {
  border: 1px solid var(--tg-common-black);
  padding: 40px 40px 25px 40px;
  transition: all 0.4s ease;
}
.tg-service-7-wrap:hover {
  background: var(--tg-common-white);
  border-color: var(--tg-common-white);
}
.tg-service-7-count {
  font-family: var(----tg-ff-heading);
  font-weight: 700;
  font-size: 30px;
  letter-spacing: -0.01em;
  color: var(--tg-ff-heading);
  display: block;
  margin-bottom: 150px;
  text-align: right;
}
.tg-service-7-title {
  font-size: 30px;
  line-height: 107%;
  letter-spacing: -0.01em;
  display: block;
}
.tg-service-7-btnwrap .tg-btn-rounded-black:hover {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
}
.tg-service-7-btnwrap .tg-btn-rounded-black:hover .tg-btn-circle-dot {
  background: var(--tg-common-white);
}
.tg-service-7-para p {
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}
@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) {
  .tg-service-7-para p br {
    display: none;
  }
}
.tg-service-8-shape {
  position: absolute;
  top: 145px;
  left: 167px;
}
.tg-service-8-count {
  font-weight: 400;
  font-size: 20px;
  color: #cbca7b;
  display: inline-block;
  margin-right: 70px;
}
.tg-service-8-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 113%;
  color: var(--tg-common-white);
  margin-right: 70px;
}
.tg-service-8-title a:hover {
  color: rgba(240, 240, 240, 0.631372549);
}

@media (max-width: 575px) {
  .tg-service-8-count {
    margin-right: 20px;
  }
  .tg-service-8-title {
    font-size: 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) {
  .tg-service-8-title-wrap {
    margin-bottom: 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) {
  .tg-service-8-right {
    margin-left: 0;
  }
}
.tg-service-8-right ul li {
  font-weight: 400;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: var(--tg-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) {
  .tg-service-8-right ul li {
    font-size: 17px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-service-8-thumb {
    padding-top: 60px;
  }
}
.tg-service-8-item {
  border-top: 1px solid var(--tg-common-white);
  border-bottom: 1px solid var(--tg-common-white);
  padding: 31px 20px 10px 40px;
  margin-top: -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) {
  .tg-service-8-item {
    padding: 31px 0px 10px 0px;
  }
}
.tg-service-details-title {
  font-size: 60px;
  line-height: 117%;
  letter-spacing: -0.03em;
}
@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) {
  .tg-service-details-title {
    font-size: 45px;
  }
}
@media (max-width: 575px) {
  .tg-service-details-title {
    font-size: 40px;
  }
}
.tg-service-details-border {
  width: 100%;
  height: 1px;
  background: var(--tg-common-black);
}
.tg-service-details-list ul {
  column-count: 2;
}
@media (max-width: 575px) {
  .tg-service-details-list ul {
    column-count: 1;
  }
}
.tg-service-details-list ul li {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
  position: relative;
  padding-left: 18px;
  margin-bottom: 5px;
}
.tg-service-details-list ul li::before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  background: var(--tg-common-black);
  border-radius: 20px;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}
.tg-service-details-thumb-wrap {
  margin-top: -83px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-service-details-thumb-wrap {
    margin-top: 0;
  }
}
.tg-service-timeline {
  height: 1px;
  width: 100%;
  background: var(--tg-common-black);
  display: flex;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-service-timeline {
    display: none;
  }
}
.tg-service-timeline-item {
  position: relative;
}
.tg-service-timeline-item::before {
  position: absolute;
  content: "";
  width: 15px;
  height: 15px;
  background: var(--tg-common-black);
  top: -48px;
  left: 0;
  border-radius: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-service-timeline-item::before {
    display: none;
  }
}
.tg-service-timeline-item h3 {
  font-weight: 500;
  font-size: 24px;
  line-height: 125%;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
}
@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) {
  .tg-service-replace-content {
    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) {
  .tg-service-replace-shape {
    margin-top: 0;
  }
}
.tg-service-replace-title h2 {
  font-weight: 700;
  font-size: 44px;
  line-height: 123%;
  letter-spacing: -0.01em;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-service-replace-title h2 {
    font-size: 35px;
  }
}

/*=============================
    15. portfolio
===============================*/
.tg-portfolio-item:hover .tg-portfolio-tag {
  transform: translateY(0);
  opacity: 1;
}
.tg-portfolio-item:hover .tg-portfolio-thumb img {
  transform: scale(1.03) translateX(8px);
}
.tg-portfolio-thumb {
  display: inline-block;
  overflow: hidden;
}
.tg-portfolio-thumb img {
  transform: scale(1.03);
  transition: 0.4s ease-in-out;
  width: 100%;
}
.tg-portfolio-tag {
  position: absolute;
  bottom: 40px;
  left: 40px;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.3s ease-in-out;
}
@media (max-width: 575px) {
  .tg-portfolio-tag {
    bottom: 20px;
    left: 20px;
  }
}
.tg-portfolio-tag-text {
  font-weight: 600;
  font-size: 14px;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--tg-common-black);
  border-radius: 20px;
  padding: 5px 20px;
  display: inline-block;
  background: var(--tg-common-white);
  margin-right: 5px;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}
.tg-portfolio-tag-text:hover {
  background: var(--tg-common-black);
  color: var(--tg-common-white);
}
.tg-portfolio-title {
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
.tg-portfolio-title a:hover {
  color: var(--tg-theme-primary);
}
.tg-portfolio-2-item {
  overflow: hidden;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-2-item {
    padding-top: 0;
  }
}
@media (max-width: 575px) {
  .tg-portfolio-2-item {
    margin-bottom: 40px;
  }
}
.tg-portfolio-2-item:hover .tg-portfolio-2-thumb {
  overflow: hidden;
}
.tg-portfolio-2-item:hover .tg-portfolio-2-thumb img {
  transform: scale(1.1);
}
.tg-portfolio-2-thumb img {
  transition: all 0.3s ease-in-out;
}
.tg-portfolio-2-thumb:hover .tg-portfolio-2-content {
  margin-bottom: 0;
}
.tg-portfolio-2-thumb:hover .tg-portfolio-2-link {
  opacity: 1;
}
.tg-portfolio-2-content {
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: 0;
  background: var(--tg-common-white);
  padding: 30px 30px 30px 30px;
  margin-left: 40px;
  margin-bottom: -40px;
  width: 70%;
  transition: all 0.3s ease-in-out;
}
@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) {
  .tg-portfolio-2-content {
    padding: 30px 30px 28px 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-2-content {
    margin-left: 0;
    position:inherit;
    width: 100%;
  }
}
@media (max-width: 575px) {
  .tg-portfolio-2-content {
    position: inherit;
    margin-bottom: 0;
    width: 100%;
  }
}
.tg-portfolio-2-content span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-portfolio-2-content h3 {
  font-weight: 600;
  font-size: 24px;
  line-height: 117%;
  letter-spacing: -0.01em;
}
@media (max-width: 575px) {
  .tg-portfolio-2-content h3 {
    font-size: 20px;
  }
}
@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) {
  .tg-portfolio-2-content h3 br {
    display: none;
  }
}
.tg-portfolio-2-content h3 a:hover {
  color: var(--tg-theme-primary);
}
.tg-portfolio-2-link {
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--tg-common-black);
  opacity: 0;
  transition: all 0.3s ease-in-out;
  font-family: var(--tg-ff-heading);
}
@media (max-width: 575px) {
  .tg-portfolio-2-link {
    opacity: 1;
  }
}
.tg-portfolio-2-link:hover {
  color: var(--tg-theme-primary);
}
.tg-portfolio-3-btn {
  padding-top: 350px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-portfolio-3-btn {
    padding-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) {
  .tg-portfolio-3-btn {
    padding-top: 0;
  }
}
.tg-portfolio-4-thumb img {
  transition: all 0.4s ease;
}
.tg-portfolio-4-item:hover .tg-portfolio-4-thumb img {
  transform: scale(1.1);
}
.tg-portfolio-4-item-content {
  background: var(--tg-common-white);
  transition: all 0.4s ease;
  padding: 80px 80px 80px 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) {
  .tg-portfolio-4-item-content {
    padding: 50px 50px 50px 50px;
  }
}
@media (max-width: 575px) {
  .tg-portfolio-4-item-content {
    padding: 20px 20px 20px 20px;
  }
}
.tg-portfolio-4-item-content:hover {
  background: var(--tg-theme-primary);
}
.tg-portfolio-4-item-content:hover .tg-btn-rounded-primary {
  border-color: var(--tg-common-black);
}
.tg-portfolio-4-item-title {
  margin-bottom: 245px;
}
@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) {
  .tg-portfolio-4-item-title {
    margin-bottom: 145px;
  }
}
@media (max-width: 575px) {
  .tg-portfolio-4-item-title {
    margin-bottom: 45px;
  }
}
.tg-portfolio-4-item-title span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-portfolio-4-item-title h4 {
  font-weight: 600;
  font-size: 24px;
  line-height: 125%;
  letter-spacing: -0.01em;
}
@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) {
  .tg-portfolio-4-item-title h4 a br {
    display: none;
  }
}
.tg-portfolio-4-btn {
  display: flex;
  align-items: center;
}
@media (max-width: 575px) {
  .tg-portfolio-4-btn {
    flex-wrap: wrap;
  }
}
.tg-portfolio-4-btn a {
  flex: 0 0 auto;
  margin-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) {
  .tg-portfolio-4-btn a {
    margin-right: 20px;
  }
}
@media (max-width: 575px) {
  .tg-portfolio-4-btn a {
    margin-bottom: 20px;
  }
}
.tg-portfolio-4-btn p {
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}
.tg-portfolio-6-item-content:hover {
  background: var(--tg-common-black);
}
.tg-portfolio-6-item-content:hover .tg-portfolio-4-item-title span {
  color: var(--tg-common-white);
}
.tg-portfolio-6-item-content:hover .tg-portfolio-4-item-title h4 {
  color: var(--tg-common-white);
}
.tg-portfolio-6-item-content:hover .tg-portfolio-4-item-title h4 a:hover {
  color: var(--tg-common-white);
}
.tg-portfolio-6-item-content:hover .tg-portfolio-4-btn p {
  color: var(--tg-common-white);
}
.tg-portfolio-6-item-content:hover .tg-btn-rounded-primary {
  border-color: var(--tg-common-white);
}
.tg-portfolio-6-item-content:hover .tg-btn-rounded-primary {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
  border-color: var(--tg-common-white);
}
.tg-portfolio-6-item-content:hover .tg-btn-rounded-primary:hover {
  border-color: var(--tg-theme-primary);
}
.tg-portfolio-6-item-content:hover .tg-btn-rounded-primary .tg-btn-circle-dot {
  background: var(--tg-theme-primary);
}
.tg-portfolio-7-tag span, .tg-portfolio-7-tag a {
  font-weight: 600;
  font-size: 14px;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--tg-common-white);
  border-radius: 20px;
  padding: 5px 20px;
  background: var(--tg-common-black);
  display: inline-block;
  transition: all 0.4s ease;
}
.tg-portfolio-7-tag span:hover, .tg-portfolio-7-tag a:hover {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
}
.tg-portfolio-7-title {
  font-weight: 600;
  font-size: 36px;
  line-height: 122%;
  letter-spacing: -0.01em;
  text-align: center;
  width: 50%;
  margin:0 auto;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-7-title {
    font-size: 26px;
    width: 100%;
    margin:0 auto;
  }
  .tg-portfolio-7-title a br {
    display: none;
  }
}
.tg-portfolio-7-title a {
  transition: all 0.5s ease;
}
.tg-portfolio-7-title a:hover {
  text-decoration: underline;
}
.tg-portfolio-7-btn {
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}
.tg-portfolio-7-item {
  padding: 80px 80px 42px 80px;
  position: sticky;
  top: 100px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-7-item {
    padding: 20px 20px 22px 20px;
  }
}
.tg-portfolio-7-item:hover .tg-portfolio-7-btn {
  opacity: 1;
  visibility: visible;
}

.tg-portfolio-8-content {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 500px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-8-content {
    margin-bottom: 40px;
  }
}
.tg-portfolio-8-content span {
  font-weight: 400;
  font-size: 18px;
  text-transform: uppercase;
  color: var(--tg-common-white);
  display: inline-block;
  margin-bottom: 6px;
}
.tg-portfolio-8-content h2 {
  font-weight: 600;
  font-size: 72px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: var(--tg-common-white);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-8-content h2 {
    font-size: 40px;
  }
}
.tg-portfolio-8-content h2 a:hover {
  color: var(--tg-common-white);
}
.tg-portfolio-8-item {
  position: sticky;
  top: 100px;
  background: #0f0f0f;
  padding-left: 5px;
}
.tg-portfolio-8-item .tg-portfolio-7-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
}
.tg-portfolio-8-item:hover .tg-portfolio-7-btn {
  opacity: 1;
  visibility: visible;
}
.tg-portfolio-details-info {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  padding-left: 150px;
  padding-right: 150px;
  border-bottom: 1px solid var(--tg-common-black);
}
@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) {
  .tg-portfolio-details-info {
    padding-left: 0;
    padding-right: 0;
  }
}
.tg-portfolio-details-info-item {
  margin: 10px 20px;
  text-align: center;
}
.tg-portfolio-details-info-item h4 {
  font-weight: 600;
  font-size: 24px;
}
.tg-portfolio-details-info-item span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-portfolio-details-overview-title h2 {
  font-weight: 600;
  font-size: 60px;
  letter-spacing: -0.02em;
}
@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) {
  .tg-portfolio-details-overview-title h2 {
    font-size: 40px;
    margin-bottom: 40px;
  }
}
.tg-portfolio-details-overview-title span {
  font-weight: 400;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: #000;
}
.tg-portfolio-details-overview-title span span {
  font-weight: 600;
}
.tg-portfolio-details-overview-list h5 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.02em;
  border-bottom: 1px solid var(--tg-common-black);
  margin-bottom: 20px;
  padding-bottom: 20px;
}
.tg-portfolio-details-overview-details h5 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.02em;
}
.tg-portfolio-details-identity-title {
  font-weight: 700;
  font-size: 60px;
  letter-spacing: -0.02em;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-portfolio-details-identity-title {
    font-size: 40px;
  }
}
.tg-portfolio-details-identity-subtitle {
  font-weight: 500;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
.tg-portfolio-details-identity-tag-inner {
  display: flex;
  align-items: center;
}
.tg-portfolio-details-identity-tag-inner span {
  font-weight: 600;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-portfolio-details-identity-tag-inner span.prev i {
  margin-right: 10px;
}
.tg-portfolio-details-identity-tag-inner span.next i {
  margin-left: 10px;
}
.tg-portfolio-details-identity-tag-inner span.borders {
  width: 1px;
  height: 70px;
  background: var(--tg-common-black);
  display: inline-block;
  margin: 0 100px;
}
@media (max-width: 575px) {
  .tg-portfolio-details-identity-tag-inner span.borders {
    margin: 0 50px;
  }
}
.tg-portfolio-details-identity-tag-inner span i {
  width: 40px;
  height: 40px;
  display: inline-block;
  border: 1px solid #000;
  border-radius: 50px;
  text-align: center;
  line-height: 40px;
  transition: all 0.4s ease;
}
.tg-portfolio-details-identity-tag-inner span i:hover {
  background: var(--tg-theme-primary);
  color: var(--tg-common-black);
  border-color: var(--tg-theme-primary);
}
@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) {
  .tg-portfolio-details-identity-thumb {
    margin-left: 0;
    margin-right: 0;
  }
}
.tg-portfolio-details-agencies-content h3 {
  font-weight: 600;
  font-size: 26px;
  line-height: 138%;
}
.tg-portfolio-details-agencies-content p {
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}

/*=============================
    23. video
===============================*/
.tg-video-play {
  height: 100px;
  width: 100px;
  display: inline-block;
  background: var(--tg-theme-primary);
  border-radius: 50%;
  text-align: center;
  line-height: 100px;
  color: var(--tg-common-black);
}
.tg-video-play:hover {
  color: var(--tg-common-black);
}

.tg-pulse-border {
  border-radius: 50%;
  z-index: 1;
  position: relative;
}
.tg-pulse-border::after, .tg-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(255, 255, 255, 0.4);
  animation: borderanimate2 2s linear infinite;
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  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;
  z-index: -1;
}
.tg-pulse-border::before {
  animation-delay: 0.7s;
}

.tg-video-inner {
  padding-top: 320px;
  padding-bottom: 320px;
}
@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) {
  .tg-video-inner {
    padding-top: 220px;
    padding-bottom: 220px;
  }
}

.tg-video-shape {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}

.tg-video-5-spacing {
  padding-top: 460px;
  padding-bottom: 180px;
}
@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) {
  .tg-video-5-spacing {
    padding-top: 180px;
  }
}
@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) {
  .tg-video-5-wrap {
    text-align: center;
  }
}
.tg-video-5-wrap .popup-video {
  background: var(--tg-common-black);
  color: var(--tg-common-white);
}
.tg-video-5-wrap .tg-pulse-border::after, .tg-video-5-wrap .tg-pulse-border::before {
  border: 1px solid var(--tg-common-black);
}

/*=============================
    05. chose
===============================*/
@media (max-width: 575px) {
  .tg-chose-funding {
    margin-right: 0;
  }
}
.tg-chose-funding h3 {
  font-weight: 700;
  font-size: 360px;
  letter-spacing: -0.06em;
  margin-bottom: 0;
  display: inline-block;
  position: relative;
  line-height: 0.9;
}
@media (max-width: 575px) {
  .tg-chose-funding h3 {
    font-size: 250px;
  }
}
.tg-chose-funding h3 span {
  display: inline-block;
  font-weight: 700;
  font-size: 36px;
  letter-spacing: -0.06em;
  color: var(--tg-common-black);
  font-family: var(--tg-ff-p);
  width: 100px;
  height: 100px;
  text-align: center;
  line-height: 100px;
  background: var(--tg-theme-primary);
  border-radius: 100px;
  position: absolute;
  right: -22px;
  top: 25px;
}
.tg-chose-funding p {
  line-height: 167%;
  color: var(--tg-common-black);
}
.tg-chose-newwork {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
@media (max-width: 575px) {
  .tg-chose-newwork {
    display: none;
  }
}
.tg-chose-item h4 {
  font-size: 22px;
  letter-spacing: -0.02em;
}
.tg-chose-item p {
  line-height: 167%;
  color: var(--tg-common-black);
}
.tg-chose-shape {
  margin-right: -153px;
}
@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) {
  .tg-chose-shape {
    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) {
  .tg-chose-2-thumb {
    margin-bottom: 40px;
  }
}
.tg-chose-2-item-wrap {
  margin-right: 250px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tg-chose-2-item-wrap {
    margin-right: 120px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-chose-2-item-wrap {
    margin-right: 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) {
  .tg-chose-2-item-wrap {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-chose-2-item-wrap {
    margin-left: 15px;
  }
}

/*=============================
    07. counter
===============================*/
.tg-counter-item {
  background: var(--tg-common-white);
  text-align: center;
  padding: 50px 30px 26px 30px;
}
.tg-counter-item:hover .icons {
  color: var(--tg-theme-primary);
}
.tg-counter-item h4 {
  font-size: 90px;
  line-height: 72%;
  letter-spacing: -0.02em;
}
@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) {
  .tg-counter-item h4 {
    font-size: 70px;
  }
}
.tg-counter-item .icons {
  color: var(--tg-grey-2);
  transition: all 0.3s ease;
}
.tg-counter-item p {
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  color: var(--tg-common-black);
  margin-top: -53px;
}
.tg-counter-2-item {
  border: 1px solid #000;
  padding: 30px 40px 30px 40px;
  margin-right: -1px;
  transition: all 0.4s ease;
}
.tg-counter-2-item:hover {
  background: var(--tg-common-black);
  transform: scaleY(105%);
}
.tg-counter-2-item:hover .title {
  color: var(--tg-common-white);
}
.tg-counter-2-item:hover .para {
  color: var(--tg-common-white);
}
.tg-counter-2-item:hover .position {
  color: var(--tg-common-white);
}
.tg-counter-2-item .title {
  font-weight: 600;
  font-size: 50px;
  line-height: 76%;
  letter-spacing: -0.02em;
}
.tg-counter-2-item .position {
  font-weight: 600;
  font-size: 18px;
  line-height: 133%;
  color: var(--tg-common-black);
}
.tg-counter-2-item .para {
  font-size: 18px;
  line-height: 133%;
  color: var(--tg-common-black);
}
.tg-counter-2-wrap {
  padding-top: 240px;
}
@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) {
  .tg-counter-2-wrap {
    padding-top: 140px;
  }
}

/*=============================
    04. brand
===============================*/
.tg-brand-wrap .swiper-slide {
  display: inline-block;
  width: 300px;
}

/*=============================
    03. blog
===============================*/
.tg-blog-title {
  font-weight: 600;
  font-size: 24px;
  line-height: 133%;
  letter-spacing: -0.02em;
}
.tg-blog-title a:hover {
  color: var(--tg-theme-primary);
}
.tg-blog-para {
  line-height: 167%;
  color: var(--tg-common-black);
}
.tg-blog-item:hover .tg-blog-thumb img {
  transform: scale(1.05);
}
.tg-blog-item:hover .tg-blog-btn {
  opacity: 1;
  visibility: visible;
}
.tg-blog-thumb img {
  transition: all 0.3s ease;
}
.tg-blog-tag {
  border-top: 1px solid var(--tg-common-black);
  padding-top: 30px;
}
.tg-blog-tag span {
  font-weight: 500;
  font-size: 16px;
  color: var(--tg-common-black);
  display: inline-block;
}
.tg-blog-tag span.tg-tag {
  border: 1px solid var(--tg-common-black);
  border-radius: 17px;
  padding: 1px 17px;
}
.tg-blog-tag span.tg-border {
  width: 40px;
  height: 1px;
  background: var(--tg-common-black);
  margin-left: 20px;
  margin-right: 15px;
}
.tg-blog-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}
.tg-blog-btn a {
  color: var(--tg-common-white);
  border-color: var(--tg-common-white);
}
.tg-blog-btn a:hover {
  border-color: var(--tg-common-black);
}
.tg-blog-2-author-name h5 {
  font-weight: 600;
  font-size: 18px;
  letter-spacing: -0.02em;
  margin-bottom: 0;
  line-height: 1;
  font-family: var(--tg-ff-p);
}
.tg-blog-2-author-name span {
  font-weight: 400;
  font-size: 16px;
  color: #000;
}
.tg-blog-2-border {
  border-top: 1px solid var(--tg-common-black);
  width: 100%;
  display: block;
}
.tg-blog-2-date {
  font-weight: 400;
  font-size: 17px;
  color: var(--tg-common-black);
}
.tg-blog-4-item .tg-blog-title {
  color: var(--tg-common-white);
}
.tg-blog-4-item .tg-blog-2-author-name h5 {
  color: var(--tg-common-white);
}
.tg-blog-4-item .tg-blog-2-author-name span {
  color: var(--tg-common-white);
}
.tg-blog-4-item .tg-blog-2-date {
  color: var(--tg-common-white);
}
.tg-blog-4-item .tg-blog-2-border {
  border-top: 1px solid var(--tg-common-white);
}
@media (max-width: 575px) {
  .tg-blog-5-btn {
    margin-bottom: 0;
  }
}
.tg-blog-standard-item:hover .tg-blog-standard-thumb img {
  transform: scale(1.1);
}
.tg-blog-standard-thumb {
  overflow: hidden;
}
.tg-blog-standard-thumb img {
  transition: all 0.4s ease;
}
@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) {
  .tg-blog-standard-left-wrap {
    margin-right: 0;
  }
}
.tg-blog-standard-comments span {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-blog-standard-comments span.dvdr {
  margin: 0 5px;
}
.tg-blog-standard-comments span.names {
  position: relative;
  padding-left: 18px;
}
.tg-blog-standard-comments span.names::before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: var(--tg-common-black);
  border-radius: 50%;
}
.tg-blog-standard-title {
  font-weight: 600;
  font-size: 44px;
  line-height: 114%;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
@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) {
  .tg-blog-standard-title {
    font-size: 30px;
  }
}
.tg-blog-standard-title-2 {
  font-weight: 700;
  font-size: 30px;
  line-height: 114%;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
@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) {
  .tg-blog-standard-title-2 {
    font-size: 25px;
  }
}
.tg-blog-standard-link {
  font-weight: 500;
  font-size: 16px;
  line-height: 175%;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-skip-ink: none;
  color: var(--tg-common-black);
  font-family: var(--tg-ff-heading);
}
.tg-blog-standard-navigation ul {
  display: flex;
  justify-content: center;
}
.tg-blog-standard-navigation ul li {
  margin: 0 5px;
}
.tg-blog-standard-navigation ul li a {
  font-weight: 600;
  font-size: 18px;
  color: var(--tg-common-black);
  width: 60px;
  height: 60px;
  display: inline-block;
  text-align: center;
  line-height: 60px;
  border-radius: 100px;
  border: 1px solid var(--tg-common-black);
  font-family: var(--tg-ff-heading);
}
.tg-blog-standard-navigation ul li a:hover {
  background: var(--tg-theme-primary);
  color: var(--tg-common-black);
  border-color: var(--tg-theme-primary);
}
.tg-blog-standard-author {
  background: #f0f0f0;
  border: 1px solid var(--tg-common-black);
  padding: 40px 40px 35px 40px;
}
.tg-blog-standard-author p {
  font-size: 18px;
  line-height: 167%;
  text-align: center;
  color: var(--tg-common-black);
}
.tg-blog-standard-author-title {
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.02em;
  text-align: center;
  color: var(--tg-common-black);
}
@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) {
  .tg-blog-standard-author-title {
    font-size: 25px;
  }
}
.tg-blog-standard-search input {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  height: 60px;
  width: 100%;
  border: 1px solid var(--tg-common-black);
  padding-left: 30px;
  padding-right: 70px;
}
.tg-blog-standard-search input::placeholder {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-blog-standard-search button {
  width: 60px;
  height: 60px;
  background: var(--tg-theme-primary);
  text-align: center;
  line-height: 60px;
  color: var(--tg-common-black);
  border: 1px solid var(--tg-common-black);
  position: absolute;
  top: 0;
  right: 0;
}
.tg-blog-standard-categories ul li a {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  padding: 3px 0px;
  display: block;
}
.tg-blog-standard-categories ul li a:hover {
  text-decoration: underline;
  text-decoration-skip-ink: none;
}
.tg-blog-standard-tag ul {
  display: flex;
  flex-wrap: wrap;
}
.tg-blog-standard-tag ul li a {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  padding: 3px 10px;
  display: inline-block;
}
.tg-blog-standard-tag ul li a:hover {
  text-decoration: underline;
  text-decoration-skip-ink: none;
}
.tg-blog-recent-content h4 {
  font-weight: 600;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: -0.02em;
}
.tg-blog-recent-content span {
  font-weight: 500;
  font-size: 16px;
  color: var(--tg-common-black);
}
.tg-blog-recent-post:hover .tg-blog-recent-post-thumb img {
  transform: scale(1.1);
}
.tg-blog-recent-post-thumb img {
  transition: all 0.4s ease;
}
.tg-blog-recent-post-thumb.mb-15.fix {
    height: 160px;
    width: 100%;
}
.tg-blog-recent-post-thumb.mb-15.fix img {
    width: 100%;
    object-fit: cover;
}
.tg-blog-details-blockquote {
  display: flex;
}
.tg-blog-details-blockquote .icons {
  width: 45px;
  height: 45px;
  background: var(--tg-theme-primary);
  text-align: center;
  line-height: 45px;
  flex: 0 0 auto;
  display: inline-block;
  margin-top: 7px;
  margin-right: 20px;
}
.tg-blog-details-blockquote .titles {
  font-weight: 600;
  font-size: 20px;
  line-height: 150%;
  letter-spacing: -0.02em;
}
.tg-blog-details-tag ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.tg-blog-details-tag ul li:not(:last-child) {
  margin-right: 40px;
}
.tg-blog-details-tag ul li a {
  font-weight: 400;
  font-size: 18px;
  color: #000;
}
.tg-blog-details-tag ul li a:hover {
  text-decoration: underline;
  text-decoration-skip-ink: none;
}
.tg-blog-details-tag-wrap {
  border-top: 1px solid var(--tg-common-black);
  border-bottom: 1px solid var(--tg-common-black);
  padding: 20px 0px;
}
.tg-blog-details-social ul {
  display: flex;
  align-items: center;
  justify-content: end;
}
@media (max-width: 575px) {
  .tg-blog-details-social ul {
    justify-content: flex-start;
    margin-top: 10px;
  }
}
.tg-blog-details-social ul li:not(:first-child) {
  margin-left: 12px;
}
.tg-blog-details-social ul li a {
  font-family: var(--tg-ff-heading);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
.tg-blog-details-social ul li a:hover {
  text-decoration: underline;
  text-decoration-skip-ink: none;
}
.tg-blog-details-comment ul li {
  display: flex;
  align-items: center;
}
@media (max-width: 575px) {
  .tg-blog-details-comment ul li {
    flex-wrap: wrap;
  }
}
.tg-blog-details-comment-thumb {
  width: 200px;
  flex: 0 0 auto;
}
@media (max-width: 575px) {
  .tg-blog-details-comment-thumb {
    margin-bottom: 20px;
  }
}
.tg-blog-details-comment-content h3 {
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.02em;
}
.blog-post-wrap {
    margin-right: 70px;
}
@media (max-width: 1500px) {
    .blog-post-wrap {
        margin-right: 50px;
    }
}
@media (max-width: 1199px) {
    .blog-post-wrap {
        margin-right: 0;
    }
}
.blog-post-item {
    margin: 0 0 70px;
}
.blog-post-meta .list-wrap {
    display: flex;
    align-items: center;
    gap: 0 28px;
    flex-wrap: wrap;
}
.blog-post-meta .list-wrap li {
    display: flex;
    align-items: center;
    gap: 8px;
    display: inline-block;
    position: relative;
    font-size: 18px;
    font-weight: 400;
    font-family: var(--tg-ff-body);
    color: var(--tg-common-black);
    margin-right: 0;
}
.blog-post-meta .list-wrap li a {
    color: var(--tg-common-black);
}
.blog-post-meta .list-wrap li i {
    font-size: 18px;
}
.blog-post-meta .list-wrap li:not(:first-child):after {
    content: "";
    height: 4px;
    width: 4px;
    background-color: var(--tg-common-black);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: -15px;
    margin-top: -3px;
}
.blog-post-meta {
    margin-bottom: 12px;
}
.blog-post-content .title {
    font-size: 44px;
    font-weight: 600;
    letter-spacing: -0.02em;
    margin-bottom: 20px;
}
@media (max-width: 992px) {
    .blog-post-content .title {
        font-size: 36px;
    }
}
@media (max-width: 767px) {
    .blog-post-content .title {
        font-size: 26px;
        margin-bottom: 12px;
    }
    .blog-post-content .post-text {
        margin: 0 0 20px !important;
    }
}
.blog-post-content .post-text {
    margin: 0 0 30px;
}
.blog-post-content .post-text p {
    margin: 0;
}
.blog-post-thumb {
    margin: 0 0 20px;
}
.link-btn {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--tg-ff-heading);
    display: inline-block;
    line-height: 0.8;
    position: relative;
    padding-bottom: 6px;
    margin-bottom: 0px;
    text-transform: uppercase;
    color: var(--tg-common-black);
    display: inline-flex;
    gap: 10px;
    text-decoration: none;
}
.link-btn i {
    font-size: 0.9rem;
}
.link-btn:after, .link-btn:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: var(--tg-common-black);
    transition: all ease 0.4s;
}
.link-btn:after {
    width: 0;
    left: 0;
    transition: all ease 0.8s;
}
.link-btn:hover {
    color: var(--tg-common-black);
}
.link-btn:hover::before {
    width: 0;
}
.link-btn:hover:after {
    width: 100%;
}
.link-btn:hover .effect-1 {
    top: -100%;
}
.sidebar__widget {
    margin: 0 0 50px;
}
.sidebar__widget:last-child {
    margin: 0 0;
}

/*=============================
    08. cta
===============================*/
.tg-cta-title {
  font-weight: 800;
  font-size: 120px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: var(--tg-common-white);
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6), 0 0 5px rgba(0, 0, 0, 0.6), 0 0 0px rgba(0, 0, 0, 0.6);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tg-cta-title {
    font-size: 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) {
  .tg-cta-title {
    font-size: 70px;
  }
}
@media (max-width: 575px) {
  .tg-cta-title {
    font-size: 50px;
  }
}
.tg-cta-shape {
  position: absolute;
  left: 160px;
  top: 125px;
}
@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) {
  .tg-cta-shape {
    left: 40px;
  }
}
.tg-cta-shape-2 {
  position: absolute;
  right: 270px;
  bottom: 115px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-cta-shape-2 {
    right: 100px;
  }
}
.tg-cta-2-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 100%;
  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), (max-width: 575px) {
  .tg-cta-2-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .tg-cta-2-title {
    font-size: 30px;
  }
}
.tg-cta-2-thumb {
  position: absolute;
  left: 0;
  top: 0;
  width: 45%;
  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) {
  .tg-cta-2-thumb {
    width: 100%;
    position: inherit;
  }
}
div.tg-cta-2-thumb img {
  width: 100%;
  height: 100%;
}
.tg-cta-2-shape {
  position: absolute;
  right: 0;
  bottom: 145px;
  width: 24%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-cta-2-shape {
    width: 17%;
  }
}
.tg-cta-6-title {
  font-weight: 600;
  font-size: 80px;
  line-height: 100%;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
@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) {
  .tg-cta-6-title {
    font-size: 60px;
  }
}
@media (max-width: 575px) {
  .tg-cta-6-title {
    font-size: 37px;
  }
}
.tg-cta-6-border {
  width: 100%;
  height: 1px;
  background: var(--tg-common-black);
}

/*=============================
    11. footer
===============================*/
.tg-footer-title {
  font-size: 50px;
  line-height: 120%;
}
@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) {
  .tg-footer-title br {
    display: none;
  }
}
@media (max-width: 575px) {
  .tg-footer-title {
    font-size: 30px;
  }
}
.tg-footer-location h4 {
  font-weight: 600;
  font-size: 24px;
  line-height: 167%;
  letter-spacing: -0.02em;
  font-family: var(--tg-ff-p);
}
.tg-footer-location a {
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
}
@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) {
  .tg-footer-location a br {
    display: none;
  }
}
.tg-footer-location-wrap {
  column-count: 2;
  padding-right: 88px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-footer-location-wrap {
    padding-right: 0;
  }
}
@media (max-width: 575px) {
  .tg-footer-location-wrap {
    column-count: 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) {
  .tg-footer-social {
    margin-bottom: 50px;
  }
}
.tg-footer-social a {
  border: 1px solid #000;
  border-radius: 100px;
  width: 44px;
  height: 44px;
  display: inline-block;
  text-align: center;
  line-height: 44px;
  transition: all 0.4s ease;
}
.tg-footer-social a svg {
  transform: translateY(-2px);
  width: 17px !important;
}
.tg-footer-social a:hover {
  background: var(--tg-common-black);
  color: var(--tg-common-white);
}
.tg-footer-rborder {
  width: 1px;
  height: 78px;
  background: var(--tg-common-black);
  display: inline-block;
  position: absolute;
  right: 105px;
  bottom: 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) {
  .tg-footer-rborder {
    right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-footer-rborder {
    display: none;
  }
}
.tg-footer-form {
  position: relative;
}
.tg-footer-form-btn {
  position: absolute;
  right: 0;
  top: 0;
}
.tg-footer-form input {
  border: none;
  border-bottom: 1px solid var(--tg-common-black);
  width: 100%;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-black);
  padding-left: 0;
  height: 50px;
  background: transparent;
}
.tg-footer-form input::placeholder {
  color: var(--tg-common-black);
}
.tg-footer-form input:focus {
  border: none;
  border-bottom: 1px solid var(--tg-common-black);
}
.tg-footer-bottom {
  border-top: 1px solid var(--tg-common-black);
  padding: 21px 0px 20px 0px;
}
.tg-footer-copyright p {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
  margin-bottom: 10px;
}
.tg-footer-copyright p a {
  font-weight: 700;
}
.tg-footer-menu ul {
  display: flex;
  justify-content: end;
  flex-wrap: wrap;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-footer-menu ul {
    justify-content: flex-start;
  }
}
.tg-footer-menu ul li {
  margin-left: 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) {
  .tg-footer-menu ul li {
    margin-left: 20px;
  }
}
.tg-footer-menu ul li a {
  font-family: var(--tg-ff-heading);
  font-weight: 500;
  font-size: 15px;
  color: var(--tg-common-black);
  padding: 0;
  display: inline-block;
  text-transform: uppercase;
}
.tg-footer-menu ul li a:hover {
  color: var(--tg-theme-primary);
}
.tg-footer-2-location .email {
  font-weight: 400;
  font-size: 17px;
  line-height: 153%;
  text-decoration: underline;
  text-decoration-skip-ink: none;
  display: block;
  color: var(--tg-common-black);
  margin-bottom: 4px;
}
.tg-footer-2-location .email:hover {
  color: var(--tg-theme-primary);
}
.tg-footer-2-location .number {
  font-weight: 600;
  font-size: 20px;
  line-height: 130%;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
.tg-footer-2-location .number:hover {
  color: var(--tg-theme-primary);
}
.tg-footer-4-widget .tg-footer-location h4 {
  color: var(--tg-common-white);
}
.tg-footer-4-widget .tg-footer-location a {
  color: var(--tg-common-white);
}
.tg-footer-4-widget .tg-footer-rborder {
  background: var(--tg-common-white);
}
.tg-footer-4-widget .tg-footer-social a {
  border: 1px solid var(--tg-common-white);
  color: var(--tg-common-white);
}
.tg-footer-4-widget .tg-footer-social a:hover {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
  border-color: var(--tg-common-white);
}
.tg-footer-4-widget .tg-footer-form input {
  border-color: var(--tg-common-white);
  color: var(--tg-common-white);
}
.tg-footer-4-widget .tg-footer-form input::placeholder {
  color: var(--tg-common-white);
}
.tg-footer-4-bottom {
  border-top: 1px solid var(--tg-common-white);
}
.tg-footer-4-bottom .tg-footer-copyright p {
  color: var(--tg-common-white);
}
.tg-footer-4-bottom .tg-footer-copyright p a:hover {
  color: var(--tg-common-white);
}
.tg-footer-4-bottom .tg-footer-menu ul li a {
  color: var(--tg-common-white);
}
.tg-footer-4-bottom .tg-footer-menu ul li a:hover {
  color: var(--tg-theme-primary);
}
.tg-footer-8-bottom {
  border-top: none;
}

/*=============================
    17. process
===============================*/
.tg-process-item {
  border: 1px solid #000;
  padding: 53px 50px 24px 50px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-process-item {
    margin-top: 0;
  }
}
.tg-process-item:hover {
  background: var(--tg-common-black);
}
.tg-process-item:hover .tg-process-icon .count {
  color: var(--tg-common-white);
}
.tg-process-item:hover .tg-process-icon svg {
  color: var(--tg-common-white);
}
.tg-process-item:hover .tg-process-content h4 {
  color: var(--tg-common-white);
}
.tg-process-item:hover .tg-process-content p {
  color: var(--tg-common-white);
}
.tg-process-content h4 {
  font-weight: 600;
  font-size: 26px;
  letter-spacing: -0.02em;
}
.tg-process-content p {
  font-size: 18px;
  line-height: 144%;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}
.tg-process-icon .count {
  font-weight: 600;
  font-size: 18px;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
}

/*=============================
    06. contact
===============================*/
.tg-contact-bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 57%;
  height: 100%;
  z-index: -1;
  background: var(--tg-theme-primary);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-contact-bg {
    display: none;
  }
}
.tg-contact-icon {
  column-count: 2;
  margin-right: 100px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-contact-icon {
    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) {
  .tg-contact-icon {
    column-count: 3;
  }
}
.tg-contact-icon span {
  width: 50%;
  display: inline-block;
  margin-bottom: 120px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-contact-form {
    padding-left: 0;
  }
}
.tg-contact-form-info-item h3 {
  font-weight: 500;
  font-size: 24px;
  line-height: 125%;
  letter-spacing: -0.01em;
}
.tg-contact-form-info-item a {
  font-weight: 400;
  font-size: 18px;
  display: block;
  color: var(--tg-common-black);
  padding-bottom: 5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-contact-spacing {
    margin-top: 0;
  }
}
.tg-contact-input input, .tg-contact-input textarea {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  border: none;
  border-bottom: 1px solid var(--tg-common-black);
  padding-left: 0;
  height: 42px;
  background: transparent;
}
.tg-contact-input input::placeholder, .tg-contact-input textarea::placeholder {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-contact-input textarea {
  height: 115px;
}
.tg-contact-8-title {
  font-size: 80px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-contact-8-title {
    font-size: 50px;
    margin-bottom: 40px;
  }
}
.tg-contact-8-form .tg-contact-input input, .tg-contact-8-form .tg-contact-input textarea {
  border-color: var(--tg-common-white);
  color: var(--tg-common-white);
}
.tg-contact-8-form .tg-contact-input input::placeholder, .tg-contact-8-form .tg-contact-input textarea::placeholder {
  color: var(--tg-common-white);
}
.tg-contact-8-form .tg-contact-input textarea {
  height: 135px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-contact-8-shape {
    margin-top: 0;
    margin-bottom: 30px;
  }
}
@media (max-width: 575px) {
  .tg-contact-map-area {
    padding-top: 0;
  }
}
.tg-contact-map-wrap {
  margin-top: 208px;
  width: 350px;
  background: var(--tg-common-white);
  padding: 60px 30px 50px 60px;
  position: absolute;
  left: 300px;
  z-index: 2;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tg-contact-map-wrap {
    left: 100px;
  }
}
@media (max-width: 575px) {
  .tg-contact-map-wrap {
    left: 0;
  }
}
.tg-contact-map-wrap h6 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.02em;
}
.tg-contact-map-wrap a {
  font-weight: 400;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
  display: block;
}
.tg-contact-map-inner {
  line-height: 1;
  overflow: hidden;
}
.tg-contact-map-inner iframe {
  width: 100%;
  height: 800px;
  filter: saturate(0);
  line-height: 1;
}

/*=============================
    21. portfolio
===============================*/
.tg-team-3-content h4 {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  margin-bottom: 0;
}
.tg-team-3-content h4 a:hover {
  color: var(--tg-theme-primary);
}
.tg-team-3-social {
  display: flex;
  flex-direction: column;
  position: absolute;
  bottom: 30px;
  left: 15px;
  gap: 6px;
  opacity: 0;
  transition: all 0.3s ease;
  z-index: 1;
}
.tg-team-3-social a {
  width: 48px;
  height: 48px;
  display: inline-block;
  border-radius: 100%;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(3px);
  text-align: center;
  line-height: 48px;
  color: var(--tg-common-white);
}
.tg-team-3-social a:hover {
  background: var(--tg-theme-primary);
  border-color: var(--tg-theme-primary);
  color: var(--tg-common-black);
}
.tg-team-3-shape {
  position: absolute;
  bottom: 52px;
  left: 47px;
  opacity: 0;
  pointer-events: none;
  -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
  clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
  -webkit-transition: all 0.8s linear;
  transition: all 0.8s linear;
}
.tg-team-3-item:hover .tg-team-3-shape {
  opacity: 1;
  clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
  -webkit-clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
}
.tg-team-3-item:hover .tg-team-3-social {
  opacity: 1;
  left: 30px;
}
.tg-team-3-item:hover .tg-team-7-shape {
  opacity: 1;
  visibility: visible;
}
.tg-team-3-item:hover .tg-team-3-thumb img {
  transform: scale(1.1);
}
.tg-team-3-thumb {
  overflow: hidden;
}
.tg-team-3-thumb img {
  transition: all 0.4s ease;
  width: 100%;
}
.tg-team-7-shape {
  border-radius: 100%;
  background: #cbca7b;
  filter: blur(160px);
  width: 307px;
  height: 407px;
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
  z-index: 1;
}
.tg-team-7-item .tg-team-3-social a {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
}
.tg-team-7-item .tg-team-3-social a:hover {
  background: var(--tg-common-black);
  color: var(--tg-common-white);
  border-color: var(--tg-common-black);
}
.tg-team-details-thumb {
  position: sticky;
  top: 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) {
  .tg-team-details-thumb {
    margin-right: 0;
  }
}
.tg-team-details-content {
  margin-left: -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) {
  .tg-team-details-content {
    margin-left: 0;
  }
}
.tg-team-details-content-para a {
  font-weight: 400;
  font-size: 17px;
  line-height: 165%;
  color: var(--tg-common-black);
}
.tg-team-details-content-para a.under {
  text-decoration: underline;
}
.tg-team-details-subtitle {
  font-weight: 600;
  font-size: 18px;
  color: var(--tg-common-black);
  display: inline-block;
}
.tg-team-details-title {
  font-weight: 700;
  font-size: 30px;
  line-height: 133%;
  letter-spacing: -0.01em;
}
.tg-team-details-list ul li {
  font-weight: 400;
  font-size: 18px;
  line-height: 180%;
  color: var(--tg-common-black);
}
.tg-team-details-list-title {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
}
.tg-team-details-progress-bar .tg-skill-progress-bar-title label {
  font-size: 16px;
  color: var(--tg-common-black);
}
.tg-team-details-progress-bar .progress-count {
  font-size: 16px !important;
  color: var(--tg-common-black) !important;
}
.tg-team-details-progress-bar .tg-skill-progress-bar .progress-bar {
  background-color: var(--tg-theme-primary);
  height: 10px;
}
.tg-team-details-progress-bar .tg-skill-progress-bar .progress {
  height: 10px;
  background: #f0f0f0;
}

/*=============================
    02. awards
===============================*/
.tg-awards-3-subtitle {
  font-weight: 500;
  font-size: 18px;
  display: inline-block;
  color: var(--tg-common-black);
  background: var(--tg-theme-primary);
  padding: 3px 30px;
  padding: 6px 32px;
}
.tg-awards-3-item a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(10, 17, 25, 0.15);
  border-top: 1px solid rgba(10, 17, 25, 0.15);
  padding: 16px 30px 6px 30px;
  position: relative;
  margin-top: -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) {
  .tg-awards-3-item a {
    padding: 10px 10px 4px 10px;
  }
}
.tg-awards-3-item a:hover {
  background: var(--tg-common-black);
}
.tg-awards-3-item a:hover .title {
  color: var(--tg-common-white);
}
.tg-awards-3-item a:hover .icon {
  color: var(--tg-common-white);
}
.tg-awards-3-item .title {
  font-family: var(--tg-ff-heading);
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
}
@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) {
  .tg-awards-3-item .title {
    font-size: 15px;
  }
}
.tg-awards-3-item .title span {
  font-weight: 600;
  font-family: var(--tg-ff-p);
}
@media (max-width: 575px) {
  .tg-awards-3-item .title span {
    margin-right: 10px;
  }
}
.tg-awards-3-item.active a {
  background: var(--tg-common-black);
}
.tg-awards-3-item.active a .title {
  color: var(--tg-common-white);
}
.tg-awards-3-item.active a .icon {
  color: var(--tg-common-white);
}
.tg-awards-3-item .icon {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
}
@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) {
  .tg-awards-3-para br {
    display: none;
  }
}
.tg-awards-3-img-wrapper {
  position: relative;
  margin-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) {
  .tg-awards-3-img-wrapper {
    margin-left: 0;
    margin-top: 0;
  }
}
.tg-awards-3-img-wrapper .hover-image {
  display: inline-block;
}
.tg-awards-3-img-wrapper .hover-image .thumb {
  object-fit: cover;
  opacity: 0;
  transform: rotate(-20deg) !important;
  transition: all 0.5s ease;
  position: absolute;
  top: 0;
  left: 50px;
  border-radius: 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) {
  .tg-awards-3-img-wrapper .hover-image .thumb {
    width: 250px;
  }
}
.tg-awards-3-img-wrapper .hover-image .shape {
  opacity: 0;
  transition: all 0.5s ease;
  position: absolute;
  top: 250px;
  left: 141px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-awards-3-img-wrapper .hover-image .shape {
    display: none;
  }
}
.tg-awards-3-img-wrapper .hover-image.active .thumb {
  opacity: 1;
  transform: rotate(0deg) !important;
}
.tg-awards-3-img-wrapper .hover-image.active .shape {
  opacity: 1;
  transform: scale(1);
  top: 280px;
}
@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) {
  .tg-awards-3-img-wrapper .hover-image.active .shape {
    top: 119px;
  }
}

/*=============================
    22. testimonial
===============================*/
.tg-testimonial-video {
  margin-left: 300px;
  padding-top: 320px;
  padding-bottom: 320px;
}
@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) {
  .tg-testimonial-video {
    margin-left: 100px;
    padding-top: 200px;
    padding-bottom: 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) {
  .tg-testimonial-video {
    text-align: center;
    margin-left: 0;
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
.tg-testimonial-video .popup-video {
  background: var(--tg-common-white);
  width: 80px;
  height: 80px;
  line-height: 80px;
}
.tg-testimonial-item p {
  font-size: 18px;
  line-height: 178%;
  color: var(--tg-common-black);
}
@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) {
  .tg-testimonial-item p br {
    display: none;
  }
}
.tg-testimonial-name h3 {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  margin-bottom: 0;
}
.tg-testimonial-name span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-testimonial-wrap {
  padding: 90px 300px 50px 110px;
  margin-top: -140px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tg-testimonial-wrap {
    padding: 90px 100px 50px 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) {
  .tg-testimonial-wrap {
    padding: 40px 50px 30px 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) {
  .tg-testimonial-wrap {
    margin-top: 0;
  }
}
@media (max-width: 575px) {
  .tg-testimonial-wrap {
    padding: 20px 20px 20px 20px;
  }
}
.tg-testimonial-navigation {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
}
@media (max-width: 575px) {
  .tg-testimonial-navigation {
    position: inherit;
    margin-top: 20px;
  }
}
.tg-testimonial-navigation span {
  width: 60px;
  height: 60px;
  display: inline-block;
  text-align: center;
  line-height: 60px;
  border: 1px solid var(--tg-common-black);
  transition: all 0.4s ease;
}
.tg-testimonial-navigation span:hover {
  background: var(--tg-common-white);
  border-color: var(--tg-common-white);
}
.tg-testimonial-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) {
  .tg-testimonial-spacing {
    padding-top: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-testimonial-4-content {
    margin-left: 0;
  }
}
.tg-testimonial-4-content h5 {
  font-weight: 500;
  font-size: 32px;
  letter-spacing: -0.01em;
  color: var(--tg-common-white);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-testimonial-4-content h5 {
    font-size: 25px;
  }
}
.tg-testimonial-4-author span {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-white);
  display: inline-block;
  margin-bottom: 5px;
}
.tg-testimonial-4-author h6 {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  color: var(--tg-common-white);
}
.tg-testimonial-4-navigation {
  position: absolute;
  right: 0;
  bottom: 30px;
  z-index: 2;
}
@media (max-width: 575px) {
  .tg-testimonial-4-navigation {
    position: inherit;
    margin-top: 30px;
  }
}
.tg-testimonial-4-navigation span {
  width: 60px;
  height: 60px;
  display: inline-block;
  border: 1px solid var(--tg-common-white);
  border-radius: 40px;
  color: var(--tg-theme-primary);
  text-align: center;
  line-height: 60px;
  transition: all 0.4s ease;
}
.tg-testimonial-4-navigation span.tg-testimonial-4-prev {
  margin-left: 10px;
}
.tg-testimonial-4-navigation span:hover {
  background: var(--tg-theme-primary);
  color: var(--tg-common-white);
  border-color: var(--tg-theme-primary);
}
@media (max-width: 575px) {
  .tg-testimonial-4-thumb img {
    width: 180px;
  }
}
.tg-testimonial-5-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 133%;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
  background: var(--tg-common-white);
  padding: 13px 20px;
  display: inline-block;
}
.tg-testimonial-5-border {
  height: 1px;
  width: 100%;
  background: #000;
  display: block;
}
.tg-testimonial-5-content h5 {
  font-weight: 500;
  font-size: 24px;
  line-height: 158%;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
  font-family: var(--tg-ff-inter);
}
.tg-testimonial-5-content .tg-testimonial-4-author span {
  color: var(--tg-common-black);
  margin-bottom: 0;
}
.tg-testimonial-5-content .tg-testimonial-4-author h6 {
  font-size: 26px;
  color: var(--tg-common-black);
  font-family: var(--tg-ff-inter);
}
.tg-testimonial-5-navigation {
  bottom: 0;
}
.tg-testimonial-5-navigation span {
  border: 1px solid var(--tg-common-black);
  color: var(--tg-common-black);
}
.tg-testimonial-5-navigation span:hover {
  background: var(--tg-common-white);
  color: var(--tg-common-black);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-testimonial-5-innerspacing {
    padding-bottom: 40px;
  }
}
.tg-testimonial-5-thumb {
  position: absolute;
  right: 90px;
  bottom: 0;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-testimonial-5-thumb {
    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) {
  .tg-testimonial-5-thumb {
    position: inherit;
  }
}
.tg-testimonial-5-thumb img {
  mix-blend-mode: luminosity;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tg-testimonial-5-thumb img {
    width: 300px;
  }
}
div.tg-testimonial-8-slider {
  margin-left: 115px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  div.tg-testimonial-8-slider {
    margin-left: 40px;
  }
}


.tg-testimonial-8-pagenation {
  position: absolute;
  top: 75px !important;
  left: 0px !important;
  display: flex;
  flex-direction: column;
  z-index: 2;
  gap: 10px;
}
.tg-testimonial-8-pagenation .swiper-pagination-bullet {
  width: 15px;
  height: 15px;
  display: inline-block;
  border: 1px solid var(--tg-common-black);
  background: transparent;
  opacity: 1;
}
.tg-testimonial-8-pagenation .swiper-pagination-bullet-active {
  background: var(--tg-common-black);
}
.tg-testimonial-8-thumb-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: end;
}
@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) {
  .tg-testimonial-8-thumb-wrap {
    padding-top: 40px;
    justify-content: flex-start;
  }
}
.tg-testimonial-8-wow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 68px;
  right: 0;
  margin: 0 auto;
}
@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) {
  .tg-testimonial-8-wow {
    display: none;
  }
}

/*=============================
    20. skill
===============================*/
.tg-skill-thumb {
  position: absolute;
  left: 0;
  top: 0;
  width: 44%;
  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) {
  .tg-skill-thumb {
    position: inherit;
    width: auto;
  }
}
.tg-skill-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tg-skill-progress-bar-item {
  padding: 25px 0px;
  overflow: hidden;
  padding-bottom: 10px;
}
.tg-skill-progress-bar-title label {
  font-family: var(--tg-ff-heading);
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-white);
  margin-top: 6px;
}
.tg-skill-progress-bar .progress {
  overflow: visible;
  height: 2px;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.3);
}
.tg-skill-progress-bar .progress-bar {
  position: relative;
  top: 0;
  height: 2px;
  overflow: visible;
  border-radius: 0;
  background-color: var(--tg-common-white);
}
.tg-skill-progress-bar .progress-bar .progress-count {
  position: absolute;
  bottom: -37px;
  right: 0;
  font-family: var(--tg-ff-heading);
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-white);
}
.tg-skill-btn .tg-btn-rounded-primary {
  color: var(--tg-common-black);
}
.tg-skill-btn .tg-btn-rounded-primary:hover {
  border-color: var(--tg-common-white);
  background: transparent;
  color: var(--tg-common-black);
}
.tg-skill-btn .tg-btn-rounded-primary .tg-btn-circle-dot {
  background: var(--tg-common-white);
}
@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) {
  .tg-skill-content p br {
    display: none;
  }
}
.tg-skill-4-spacing {
  padding-bottom: 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) {
  .tg-skill-4-spacing {
    padding-bottom: 0;
    margin-top: 90px;
    margin-bottom: 90px;
  }
}

/*=============================
    10. faq
===============================*/
.tg-faq-4-accordion .accordion-items {
  border-bottom: 1px solid var(--tg-common-white);
  padding: 36px 0px;
}
.tg-faq-4-accordion .accordion-items h2 {
  line-height: 1;
}
.tg-faq-4-accordion .accordion-buttons {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
  color: var(--tg-common-white);
  text-align: left;
  padding: 0;
  position: relative;
  display: block;
  width: 98%;
  padding-right: 100px;
  line-height: 125%;
}
@media (max-width: 575px) {
  .tg-faq-4-accordion .accordion-buttons {
    padding-right: 20px;
    font-size: 20px;
  }
}
.tg-faq-4-accordion .accordion-buttons:not(.collapsed) .plus-icon::before {
  transform: translate(-50%, -50%) rotate(90deg);
}
.tg-faq-4-accordion .accordion-buttons .plus-icon {
  position: absolute;
  top: 50%;
  right: 0;
}
.tg-faq-4-accordion .accordion-buttons .plus-icon::before {
  position: absolute;
  content: "";
  width: 2px;
  height: 10px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--tg-common-white);
  border-radius: 2px;
  transition: 0.4s;
}
.tg-faq-4-accordion .accordion-buttons .plus-icon::after {
  position: absolute;
  content: "";
  width: 10px;
  height: 2px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--tg-common-white);
  border-radius: 2px;
}
.tg-faq-4-accordion .accordion-body {
  padding: 0;
  padding-top: 14px;
}
.tg-faq-4-accordion .accordion-body p {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-common-white);
  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) {
  .tg-faq-4-wrap {
    padding-top: 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) {
  .tg-faq-4-spacing {
    margin-top: 90px;
  }
}
.tg-faq-4-thumb {
  position: absolute;
  top: 0;
  right: 0;
  width: 44%;
  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) {
  .tg-faq-4-thumb {
    position: inherit;
    width: auto;
    margin-top: 30px;
  }
}
.tg-faq-4-thumb img {
  height: 100%;
  object-fit: cover;
}
.tg-faq-6-accordion .accordion-buttons {
  color: var(--tg-common-black);
}
.tg-faq-6-accordion .accordion-body p {
  color: var(--tg-common-black);
}
.tg-faq-6-accordion .accordion-items {
  border-bottom: 1px solid var(--tg-common-black);
}
.tg-faq-6-accordion .accordion-buttons {
  color: var(--tg-common-black);
}
.tg-faq-6-accordion .accordion-buttons .plus-icon::before {
  background-color: var(--tg-common-black);
}
.tg-faq-6-accordion .accordion-buttons .plus-icon::after {
  background-color: var(--tg-common-black);
}
.tg-faq-details-subtitle {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  display: block;
  border-bottom: 1px solid var(--tg-common-black);
  padding-bottom: 6px;
}
.tg-faq-details-title {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: -0.01em;
}
.tg-faq-details-info {
  padding: 32px 40px 16px 40px;
}
.tg-faq-details-info-link ul li {
  margin-bottom: 13px;
}
.tg-faq-details-info-link ul li a {
  font-weight: 400;
  font-size: 18px;
  color: #000;
}
.tg-faq-details-thumb-wrap {
  padding: 40px 40px 20px 40px;
}
.tg-faq-details-thumb-info h4 {
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: var(--tg-common-white);
}
.tg-faq-details-thumb-info p {
  font-weight: 400;
  font-size: 18px;
  line-height: 167%;
  color: var(--tg-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) {
  .tg-faq-details-list {
    margin-left: 0;
  }
}
.tg-faq-details-list .accordion-buttons {
  padding-right: 50px;
}

/*=============================
    16. about
===============================*/
.tg-pricing-6-wrap {
  background: var(--tg-common-white);
}
.tg-pricing-6-wrap:hover .tg-pricing-6-icon {
  background: var(--tg-common-black);
  color: var(--tg-common-white);
}
.tg-pricing-6-icon {
  width: 130px;
  height: 130px;
  display: inline-block;
  text-align: center;
  line-height: 107px;
  border-radius: 50%;
  border: 10px solid var(--tg-theme-primary);
  margin-top: -60px;
  transform: translateY(-15px);
  background: var(--tg-common-white);
  transition: all 0.4s ease;
}
.tg-pricing-6-header {
  padding: 0px 60px 0px 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) {
  .tg-pricing-6-spacing {
    margin-top: 0;
  }
}
.tg-pricing-6-list {
  padding: 0 60px 39px 60px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-pricing-6-list {
    padding: 0 30px 19px 30px;
  }
}
.tg-pricing-6-list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.tg-pricing-6-list ul li {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-common-black);
  margin-bottom: 6px;
  position: relative;
  padding-left: 16px;
}
.tg-pricing-6-list ul li::before {
  position: absolute;
  content: "";
  width: 4px;
  height: 4px;
  background: var(--tg-common-black);
  left: 0;
  transform: translateY(-50%);
  top: 50%;
  border-radius: 20px;
}
.tg-pricing-6-header-content h4 {
  font-weight: 500;
  font-size: 24px;
  line-height: 117%;
  color: var(--tg-common-black);
  display: inline-block;
  padding: 10px 16px;
  background: var(--tg-theme-primary);
}
.tg-pricing-6-header-content span {
  display: block;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
}
.tg-pricing-6-header-content h2 {
  font-weight: 500;
  font-size: 70px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
}
.tg-pricing-6-btn a {
  font-weight: 500;
  font-size: 16px;
  text-transform: uppercase;
  color: var(--tg-common-white);
  background: var(--tg-common-black);
  text-align: center;
  padding: 15px 20px;
  display: block;
}

/*=============================
    19. shop
===============================*/
.tg-shop-top-result p {
  font-weight: 500;
  font-size: 18px;
  color: var(--tg-common-black);
}
.tg-shop-top-select .nice-select {
  font-size: 14px;
  height: 40px;
  line-height: 38px;
  padding: 0 25px;
  min-width: 204px;
  text-transform: capitalize;
  float: none;
  background: #f9f9f9;
  color: var(--tg-common-black);
  border: 1px solid var(--tg-common-black);
}
@media (max-width: 575px) {
  .tg-shop-top-select .nice-select {
    min-width: 180px;
  }
}
.tg-shop-top-btn {
  font-weight: 500;
  font-size: 14px;
  color: var(--tg-common-white);
  padding: 7px 30px;
  background-color: var(--tg-common-black);
}
.tg-shop-top-btn svg {
  margin-right: 7px;
}
.tg-shop-top-btn:hover {
  color: var(--tg-common-black);
  background-color: var(--tg-theme-primary);
}

.tg-product-item:hover .tg-product-action {
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 1;
  visibility: visible;
}
.tg-product-item:hover .tg-product-btn {
  opacity: 1;
  visibility: visible;
  bottom: 0;
}
.tg-product-action {
  position: absolute;
  right: 0;
  top: 108px;
  z-index: 1;
  left: 30px;
  opacity: 0;
  text-align: center;
  transition: all 0.4s ease;
}
.tg-product-action-btn {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 46px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  color: var(--tg-common-black);
  background-color: var(--tg-common-white);
  border-bottom: 0;
  border-radius: 50%;
  margin-bottom: 6px;
  box-shadow: 0 1px 2px 0 rgba(1, 15, 28, 0.2);
}
.tg-product-action-btn:hover {
  color: var(--tg-common-white);
  background-color: var(--tg-common-black);
  border-color: var(--tg-common-black);
}
.tg-product-action-btn:hover .tg-product-tooltip {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateX(20px) translateY(-50%);
  -moz-transform: translateX(20px) translateY(-50%);
  -ms-transform: translateX(20px) translateY(-50%);
  -o-transform: translateX(20px) translateY(-50%);
  transform: translateX(20px) translateY(-50%);
}
.tg-product-tooltip {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 35px;
  font-weight: 500;
  font-size: 12px;
  color: var(--tg-common-white);
  background-color: var(--tg-common-black);
  display: inline-block;
  width: max-content;
  line-height: 1;
  padding: 4px 6px;
  border-radius: 4px;
  visibility: hidden;
  opacity: 0;
  z-index: 1;
  transition: all 0.4s ease;
}
.tg-product-tooltip::before {
  -webkit-transform: translateY(-65%);
  -moz-transform: translateY(-65%);
  -ms-transform: translateY(-65%);
  -o-transform: translateY(-65%);
  transform: translateY(-65%);
  position: absolute;
  content: "";
  top: 46%;
  width: 0;
  height: 0;
  transform: rotate(67deg);
  border-left: 8px solid var(--tg-common-black);
  border-bottom: 8px solid transparent;
  left: -6px;
}
.tg-product-tooltip-right {
  left: 100%;
  right: auto;
}
.tg-product-tooltip-right::before {
  left: -4px;
  right: auto;
  border-left: 0;
  border-right: 8px solid var(--tg-common-black);
}
.tg-product-btn {
  position: absolute;
  bottom: -20px;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}
.tg-product-btn a {
  text-transform: uppercase !important;
  color: var(--tg-common-white) !important;
  background: var(--tg-common-black) !important;
  padding: 13px 42px !important;
  width: 100% !important;
  text-align: center !important;
  display: block !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  text-transform: uppercase !important;
  line-height: 30px !important;
  border-radius: 0 !important;
}
.tg-product-category {
    font-size: 16px;
    color: var(--tg-common-black);
    margin-bottom: 7px;
    display: block;
}
.tg-product-title {
  font-weight: 500;
  font-size: 20px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
  margin: 0;
}
.tg-product-title a:hover {
  color: var(--tg-theme-primary);
}
.woocommerce-Price-amount {
  font-family: var(--tg-ff-heading);
  font-weight: 500;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--tg-common-black);
}
.tg-product-price-wrap del {
    opacity: .5;
}
.tg-product-content {
  align-items: flex-start;
}
.tg-product-details-nav-tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
}
.tg-product-details-nav-link {
  width: 150px;
  height: 150px;
  padding: 0;
  border: none;
  margin: 10px 5px;
}
@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) {
  .tg-product-details-nav-link {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 575px) {
  .tg-product-details-nav-link {
    width: 80px;
    height: 80px;
  }
}
.tg-product-details-nav-link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tg-product-details-nav-link.active {
  border: none;
}
.tg-product-details-nav-link:hover {
  border: none;
}
.tg-product-details-subtitle {
  font-weight: 400;
  font-size: 16px;
  color: var(--tg-common-black);
  display: inline-block;
}
.woocommerce div.product .product_title {
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.02em;
  color: var(--tg-common-black);
  margin: 0 0 20px;
}
.woocommerce-product-details__short-description {
    margin: 0 0 30px;
}
.tg-product-details-price {
  font-weight: 600;
  font-size: 22px;
  color: var(--tg-common-black);
}
.tg-product-details-ratings i {
  color: #ffb21d;
  font-size: 14px;
}
.tg-product-details-ratings .total {
  font-weight: 400;
  font-size: 15px;
  color: #55585b;
}
.tg-product-details-content {
  font-weight: 400;
  font-size: 15px;
  line-height: 147%;
  color: var(--tg-common-black);
}
.tg-product-details-content span {
  font-weight: 500;
  color: var(--tg-common-black);
}
.tg-product-details-view {
  font-size: 16px;
  font-weight: 400;
  color: var(--tg-common-black);
}
.tg-product-details-view span {
  color: var(--tg-common-black);
  font-weight: 500;
  margin-right: 4px;
}
.tg-product-details-color-title {
  font-weight: 400;
  font-size: 15px;
  color: var(--tg-common-black);
}
.tg-product-details-color-filter .tg-checkbox {
  appearance: none;
  -moz-appearance: none;
  display: block;
  width: 18px;
  height: 18px;
  border: none;
  outline: none;
  flex: 0 0 auto;
  background: #f26339;
  -webkit-transform: translateY(-2.5px);
  -moz-transform: translateY(-2.5px);
  -ms-transform: translateY(-2.5px);
  -o-transform: translateY(-2.5px);
  transform: translateY(-2.5px);
  padding: 0;
  margin-right: 4px;
  transform: translateY(1px);
  border-radius: 50px;
}
.tg-product-details-color-filter .tg-checkbox-2 {
  background: #F1B23D;
}
.tg-product-details-color-filter .tg-checkbox-3 {
  background: rgba(224, 74, 182, 0.94);
}
.tg-product-details-color-filter .tg-checkbox-4 {
  background: #31bb00;
}
.tg-product-details-color-filter .tg-checkbox:checked {
  position: relative;
  border-color: transparent;
}
.tg-product-details-color-filter .tg-checkbox:checked::after {
  box-sizing: border-box;
  position: absolute;
  content: "\f00c";
  font-weight: 700;
  font-family: var(--tg-ff-fontawesome);
  font-size: 10px;
  color: var(--tg-common-white);
  top: 50%;
  left: 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%);
}
.tg-product-details-color-filter .tg-checkbox:hover {
  cursor: pointer;
}
.tg-product-details-action-title {
  font-weight: 500;
  font-size: 16px;
  color: var(--tg-common-black);
}
.tg-product-details-quantity {
  width: 122px;
  position: relative;
  background: var(--tg-common-white);
}
.tg-product-details-quantity .tg-quantity-input {
  height: 44px;
  text-align: center;
  font-size: 16px;
  border: none;
  background-color: var(--tg-common-white);
  padding: 0 45px;
  width: 100% !important;
  box-shadow: 0 1px 3px 0 rgba(1, 15, 28, 0.1);
  color: var(--tg-common-black);
  font-family: var(--tg-ff-heading);
}
.tg-product-details-quantity .qty-btn {
  width: 35px;
  height: 34px;
  line-height: 34px;
  display: inline-block;
  text-align: center;
  font-size: 16px;
  color: var(--tg-common-black);
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  transition: all 0.4s ease;
  margin: 0 3px !important;
  cursor: pointer;
}
.tg-product-details-quantity .qty-btn::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 26px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  background-color: #e1e1e1;
}
.tg-product-details-quantity .quantity-minus {
  right: auto;
  left: 0;
}
.tg-product-details-quantity .quantity-minus::before {
  left: auto;
  right: 0;
}
.billo-cart-action .btn {
    font-size: 16px;
    text-transform: uppercase;
    color: var(--tg-common-black);
    padding: 9px 50px;
    display: block;
    background: var(--tg-theme-primary);
    border-radius: 2px;
    font-family: var(--tg-ff-heading);
    font-weight: 500;
}
@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) {
  .billo-cart-action .btn {
    padding: 10px 40px;
  }
}
.billo-cart-action .btn:hover {
  color: var(--tg-common-white);
  background: var(--tg-common-black);
}
.tg-product-details-wishlist-btn {
  box-shadow: 0 1px 3px 0 rgba(1, 15, 28, 0.1);
  background: var(--tg-common-white);
  width: 46px;
  height: 46px;
  text-align: center;
  line-height: 46px;
}
.tg-product-details-wishlist-btn:hover {
  color: var(--tg-common-white);
  background: var(--tg-common-black);
}
.tg-product-details-compare-wrap ul li {
  display: flex;
  align-items: center;
  margin-bottom: 7px;
}
.tg-product-details-compare-wrap ul li h5 {
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 0;
  margin-right: 10px;
}
.tg-product-details-compare-wrap ul li span {
  font-weight: 400;
  color: var(--tg-common-black);
}
.tg-product-details-compare-wrap ul li span.black {
  color: var(--tg-common-black);
}
.tg-product-details-social a {
  box-shadow: 0 1px 3px 0 rgba(1, 15, 28, 0.1);
  background: var(--tg-common-black);
  border-radius: 0;
  width: 38px;
  height: 38px;
  text-align: center;
  line-height: 35px;
  color: var(--tg-common-white);
}
.tg-product-details-social a:hover {
  color: var(--tg-common-white);
  background: var(--tg-theme-primary);
  border-color: var(--tg-theme-primary);
}
.tg-product-details-payment-way {
  border: 1px solid rgba(28, 29, 31, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding: 12px 20px 0px 20px;
}
.tg-product-details-payment-text span {
  font-weight: 400;
  font-size: 14px;
  color: var(--tg-common-black);
}
.tg-product-details-payment-text span.grey {
  display: block;
  line-height: 1;
}
.tg-product-details-payment-bank a {
  height: 32px;
  box-shadow: 0 1px 3px 0 rgba(1, 15, 28, 0.1);
  background: #fff;
  display: inline-block;
  line-height: 32px;
  padding: 1px 8px;
  border-radius: 6px;
  margin-left: 6px;
}
.tg-product-details-tab-line {
  transition: all 0.3s 0s ease-out;
  position: absolute;
  bottom: -3px;
  height: 3px;
  background-color: var(--tg-theme-secondary);
  display: block;
}
.tg-product-details-tab-nav .nav-tabs {
  border: none;
}
@media (max-width: 575px) {
  .tg-product-details-tab-nav .nav-tabs {
    padding-bottom: 0;
  }
}
.tg-product-details-tab-nav .nav-tabs .nav-link {
  text-transform: capitalize;
  position: relative;
  padding: 0;
  margin: 0;
  border: 0;
  font-weight: 500;
  font-size: 16px;
  text-align: center;
  color: var(--tg-common-black);
  padding: 17px 52px;
  border-radius: 0;
  border-bottom: 1px solid rgba(28, 29, 31, 0.1);
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-product-details-tab-nav .nav-tabs .nav-link {
    padding-bottom: 10px;
  }
}
.tg-product-details-tab-nav .nav-tabs .nav-link:not(:first-child) {
  margin-left: 5px;
}
.tg-product-details-tab-nav .nav-tabs .nav-link.active, .tg-product-details-tab-nav .nav-tabs .nav-link:hover {
  background: var(--tg-theme-primary);
  border-color: var(--tg-theme-primary);
}
.tg-product-details-tab-nav .nav-tabs .nav-link.active::after, .tg-product-details-tab-nav .nav-tabs .nav-link:hover::after {
  width: 100%;
  left: 0;
  right: auto;
}
@media (max-width: 575px) {
  .tg-product-details-tab-nav .nav-tabs span#productTabMarker {
    display: none !important;
  }
}
.tg-product-details-desc-wrapper > p {
  line-height: 30px;
  text-transform: capitalize;
  color: var(--tg-grey-1);
}
.tg-product-details-desc-wrapper ul li {
  font-weight: 400;
  font-size: 18px;
  color: var(--tg-grey-1);
  display: flex;
  margin-bottom: 15px;
}
.tg-product-details-desc-wrapper ul li i {
  margin-right: 10px;
  transform: translateY(3px);
}
.tg-product-details-desc-title {
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.02em;
}
.tg-product-details-additional-info-title {
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 16px;
}
.tg-product-details-additional-info.tg-table-style-2 table {
  border: 0;
  border-collapse: separate;
  border-spacing: 0 7px;
  width: 100%;
  font-family: var(--tg-ff-poppins);
}
.tg-product-details-additional-info.tg-table-style-2 table tr {
  border: 0;
}
.tg-product-details-additional-info.tg-table-style-2 table tr:not(:last-child) {
  border: 0;
  margin-bottom: 6px;
}
.tg-product-details-additional-info.tg-table-style-2 table tr tg {
  padding: 7px 24px;
  border: 1px solid #E6E7E8;
}
.tg-product-details-additional-info.tg-table-style-2 table tr tg:first-child {
  padding-left: 24px;
  border-right: 0;
  font-size: 16px;
  color: var(--tg-common-black);
  background-color: #F9F9F9;
  width: 306px;
}
.tg-product-details-additional-info.tg-table-style-2 table tr tg:last-child {
  padding-left: 34px;
}
.tg-product-details-review-title-2 {
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 33px;
}
.tg-product-details-review-avater-thumb {
  flex: 0 0 auto;
}
.tg-product-details-review-avater-thumb img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-right: 20px;
  flex: 0 0 auto;
}
.tg-product-details-review-avater-rating span {
  font-size: 13px;
  margin-right: 2px;
  color: #FFB21D;
  font-family: var(--tg-ff-poppins);
}
.tg-product-details-review-avater-title {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 2px;
  font-family: var(--tg-ff-poppins);
}
.tg-product-details-review-avater-meta {
  font-size: 14px;
  line-height: 1.2;
  margin-left: 3px;
  display: inline-block;
  font-family: var(--tg-ff-poppins);
}
@media (max-width: 575px) {
  .tg-product-details-review-avater-2 {
    flex-direction: column;
  }
}
.tg-product-details-review-form-title {
  font-size: 34px;
  font-weight: 500;
  margin-bottom: 4px;
}
.tg-product-details-review-form-rating p {
  font-size: 14px;
  margin-right: 8px;
  margin-bottom: 0;
  font-family: var(--tg-ff-poppins);
}
.tg-product-details-review-form-rating-icon span {
  font-size: 12px;
  color: #FFB21D;
}
.tg-product-details-review-form > p {
  font-size: 16px;
  margin-bottom: 8px;
  font-family: var(--tg-ff-poppins);
}
.tg-product-details-review-item-wrapper-2 {
  padding-bottom: 80px;
  border-bottom: 1px solid #E6E7E8;
  font-family: var(--tg-ff-poppins);
}
@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) {
  .tg-product-details-thumb-wrapper {
    margin-right: 0;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tg-product-details-wrap {
    margin-right: 0;
    margin-left: 0;
  }
}

/*=============================
    09. error
===============================*/
.tg-error-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.tg-error-spacing {
  padding-top: 290px;
  padding-bottom: 100px;
  height: 100vh;
}
@media (max-width: 575px) {
  .tg-error-spacing {
    padding-top: 150px;
  }
}
.tg-error-title {
  font-weight: 700;
  font-size: 280px;
  line-height: 1;
  color: var(--tg-common-white);
}
@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) {
  .tg-error-title {
    font-size: 180px;
  }
}
@media (max-width: 575px) {
  .tg-error-title {
    font-size: 80px;
  }
}
.tg-error-subtitle {
  font-weight: 700;
  font-size: 60px;
  color: var(--tg-common-white);
}
@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) {
  .tg-error-subtitle {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .tg-error-subtitle {
    font-size: 30px;
  }
}

/* Blog Details Bottom */
.blog__details-bottom {
    border-top: 1px solid #E7E7E7;
    border-bottom: 1px solid #E7E7E7;
    padding: 20px 0;
    margin-top: 40px;
    margin-bottom: 0;
}
.blog__details-bottom .post-tags {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    gap: 15px;
}
.blog__details-bottom .post-tags .tag-title {
    font-size: 18px;
    flex: 0 0 auto;
    margin: 7px 0 7px;
}
.blog__details-bottom .post-tags .list-wrap {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.blog__details-bottom .post-tags .list-wrap li a {
    background: #F6F5F3;
    padding: 10px 17px;
    display: block;
    border-radius: 50px;
    color: var(--tg-common-black);
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    text-transform: capitalize;
}
.blog__details-bottom .post-tags .list-wrap li a:hover {
    background: var(--tg-theme-primary);
    color: var(--tg-common-black);
}
.blog__details-bottom .post-share {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: flex-end;
}
@media (max-width: 767.98px) {
    .blog__details-bottom .post-share {
        justify-content: flex-start;
        margin-top: 20px;
    }
}
.blog__details-bottom .post-share .social-title {
    margin-bottom: 0;
    font-size: 18px;
}
.blog__details-bottom .post-share .list-wrap {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    gap: 15px;
}
.blog__details-bottom .post-share .list-wrap li a {
    font-size: 18px;
    color: var(--tg-common-black);
    line-height: 1;
    display: block;
}
.blog__details-bottom .post-share .list-wrap svg {
    display: block;
}
.blog__details-bottom .post-share .list-wrap li a:hover {
    opacity: .5;
}
/*Comment Area**************/
.comments-wrap-title {
    font-size: 36px;
    margin-bottom: 35px;
    margin-top: -0.2em;
  }
  @media (max-width: 767px) {
    .comments-wrap-title {
      font-size: 26px;
    }
  }

  .comments-wrap .latest-comments {
    margin-bottom: 50px;
  }
  .comments-wrap .latest-comments .children {
    margin: 0 0 0 50px;
    padding: 0;
  }

  @media (max-width: 1500px) {
  .comments-wrap .latest-comments .children {
          margin: 0 0 0 40px;
      }
  }

  @media (max-width: 767.98px) {
    .comments-wrap .latest-comments .children {
      margin: 0;
    }
  }
  .comments-box {
    display: flex;
    align-items: flex-start;
    padding-bottom: 48px;
    gap: 25px;
  }

  @media (max-width: 767.98px) {
    .comments-box {
      flex-wrap: wrap;
      gap: 20px;
    }
  }
  .comments-avatar {
    flex: 0 0 auto;
  }

  .comment-text .avatar-name {
    margin-bottom: 15px;
  }
  .comment-text .avatar-name .name {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
  }
  .comment-text .avatar-name span {
    font-weight: 400;
    font-size: 18px;
    display: block;
    margin-bottom: 6px;
  }
  .comment-text p {
    margin-bottom: 20px;
    font-size: 18px;
  }
@media (max-width: 767px) {
    .comment-text p {
        font-size: 16px;
    }
}
  .comment-reply-title {
    font-size: 36px;
    margin-bottom: 10px;
    margin-top: 0;
  }
  .latest-comments .comment-reply-title {
      font-size: 28px;
  }
  @media (max-width: 992px) {
      .comment-reply-title {
          font-size: 28px;
      }
  }
  @media (max-width: 767.98px) {
    .comment-reply-title {
      font-size: 26px;
    }
    .latest-comments .comment-reply-title {
        font-size: 24px;
    }
  }
  .comment-form .comment-notes {
    margin-bottom: 35px;
    font-size: 18px;
  }
  .comment-reply-link {
      font-size: 14px;
      font-weight: 600;
      font-family: var(--tg-ff-heading);
      line-height: 1;
      position: relative;
      padding-bottom: 4px;
      margin-bottom: 0px;
      text-transform: uppercase;
      color: var(--tg-common-black);
      display: inline-flex;
      gap: 10px;
      text-decoration: none;
  }
.comment-reply-link:after,
.comment-reply-link:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: var(--tg-common-black);
    transition: all ease 0.4s;
}
.comment-reply-link:after {
    width: 0;
    left: 0;
    transition: all ease 0.8s;
}
.comment-reply-link:hover::before {
    width: 0;
}
.comment-reply-link:hover:after {
    width: 100%;
}
.comment-reply-link svg {
    width: 13px;
    height: 17px;
}
.blog__details-thumb {
    margin: 0 0 25px;
}
/*Blockquote****************/
blockquote,
.wp-block-quote,
.blog-details-content blockquote {
    margin: 40px 0;
    padding: 0 0 0 75px;
    position: relative;
}
blockquote::before,
.wp-block-quote::before,
.blog-details-content blockquote::before {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    background-image: url(../img/icons/quote.svg);
    width: 45px;
    height: 45px;
    background-repeat: no-repeat;
    background-position: center;
    background-color: var(--tg-theme-primary);
}
blockquote p,
.wp-block-quote p,
.blog-details-content blockquote p {
    font-size: 20px;
    font-weight: 600;
    font-family: var(--tg-ff-heading);
    text-transform: capitalize;
    color: var(--tg-common-black);
    line-height: 1.583;
    letter-spacing: -0.02em;
    margin-top: -0.3em;
}

@media (max-width: 767.98px) {
    blockquote,
    .wp-block-quote,
    .blog-details-content blockquote {
        padding: 0 0;
    }
    blockquote::before,
    .wp-block-quote::before,
    .blog-details-content blockquote::before {
        position: relative;
        display: block;
        left: 0;
        top: 0;
        margin: 0 0 20px;
    }
    blockquote p,
    .wp-block-quote p,
    .blog-details-content blockquote p {
        font-size: 20px;
        letter-spacing: 0;
    }
}
@media (max-width: 1199px) {
    .tg-header__area {
        padding: 20px 0;
    }
}
@media (max-width: 767px) {
    .tg-header__area {
        padding: 15px 0;
    }
    .blog-post-item {
        margin: 0 0 50px;
    }
}