/*
============================
Name:  Wallex
Version: 1.0.0
Description: Wallex - Painting and Wallpapering  HTML Template
Author: Vikiglab
Author URI: https://themeforest.net/user/vikinglab/portfolio
Location:
============================
*/
/*============= HEDAER CSS AREA ===============*/
/*============= HERO CSS AREA ===============*/
/*============= MOBILE-MENU CSS AREA ===============*/
/*============= ABOUT CSS AREA ===============*/
/*============= SERVICE CSS AREA ===============*/
/*============= WORK CSS AREA ===============*/
/*============= TESTIMONIAL CSS AREA ===============*/
/*============= BLOG CSS AREA ===============*/
/*============= CONTACT CSS AREA ===============*/
/*============= TEAM CSS AREA ===============*/
/*============= FAQ CSS AREA ===============*/
/*============= CASE CSS AREA ===============*/
/*============= CTA CSS AREA ===============*/
/*============= OTHERS CSS AREA ===============*/
/*============= FOOTER CSS AREA ===============*/
@import url("https://fonts.googleapis.com/css2?family=Fustat:wght@200..800&display=swap");

body {
  overflow-x: hidden;
}

a,
a:hover {
  text-decoration: none;
}

ul {
  padding: 0;
  margin: 0;
}

ul li {
  list-style: none;
}

h2,
p {
  margin-bottom: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-bottom: 0;
}

input,
textarea {
  background: none;
  border: none;
  outline: none;
}

img {
  max-width: 100%;
  max-height: 100%;
}

.space6 {
  height: 6px;
}

.space8 {
  height: 8px;
}

.space10 {
  height: 10px;
}

.space12 {
  height: 12px;
}

.space14 {
  height: 14px;
}

.space16 {
  height: 16px;
}

.space18 {
  height: 18px;
}

.space20 {
  height: 20px;
}

.space22 {
  height: 22px;
}

.space24 {
  height: 24px;
}

.space26 {
  height: 26px;
}

.space28 {
  height: 28px;
}

.space30 {
  height: 30px;
}

.space32 {
  height: 32px;
}

.space34 {
  height: 34px;
}

.space36 {
  height: 36px;
}

.space38 {
  height: 38px;
}

.space40 {
  height: 40px;
}

.space42 {
  height: 42px;
}

.space44 {
  height: 44px;
}

.space46 {
  height: 46px;
}

.space48 {
  height: 48px;
}

.space50 {
  height: 50px;
}

.space52 {
  height: 52px;
}

.space54 {
  height: 54px;
}

.space56 {
  height: 56px;
}

.space58 {
  height: 58px;
}

.space60 {
  height: 60px;
}

.space62 {
  height: 62px;
}

.space64 {
  height: 64px;
}

.space66 {
  height: 66px;
}

.space68 {
  height: 68px;
}

.space70 {
  height: 70px;
}

.space72 {
  height: 72px;
}

.space74 {
  height: 74px;
}

.space76 {
  height: 76px;
}

.space78 {
  height: 78px;
}

.space80 {
  height: 80px;
}

.space82 {
  height: 82px;
}

.space84 {
  height: 84px;
}

.space86 {
  height: 86px;
}

.space {
  height: 88px;
}

.space90 {
  height: 90px;
}

.space92 {
  height: 92px;
}

.space94 {
  height: 94px;
}

.space96 {
  height: 96px;
}

.space98 {
  height: 98px;
}

.space100 {
  height: 100px;
}

@keyframes animation-5 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(1.1);
  }
}

.aniamtion-key-5 {
  position: relative;
  animation-name: animation-5;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  transition: all 0.4s ease-in-out;
}

@keyframes animation-7 {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(-1000deg);
  }
}

.keyframe5 {
  position: relative;
  animation-name: animation-7;
  animation-duration: 90s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(0.59, 0.59, 1, 1);
}

@keyframes animation-1 {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(30px);
  }
}

.aniamtion-key-1 {
  position: relative;
  animation-name: animation-1;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes animation-2 {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(50px);
  }
}

.aniamtion-key-2 {
  position: relative;
  animation-name: animation-2;
  animation-duration: 2.5s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes animation-3 {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(60px);
  }
}

.aniamtion-key-3 {
  position: relative;
  animation-name: animation-3;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes animation-4 {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(40px);
  }
}

.aniamtion-key-4 {
  position: relative;
  animation-name: animation-4;
  animation-duration: 1.6s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes animation-6 {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(50px);
  }
}

.aniamtion-key-6 {
  position: relative;
  animation-name: animation-6;
  animation-duration: 1.9s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes animation-8 {
  0% {
    padding-left: 0px;
  }

  100% {
    padding-left: 50px;
  }
}

.aniamtion-key-7 {
  position: relative;
  animation-name: animation-8;
  animation-duration: 1.3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes fade-in-down {
  0% {
    transform: translate3d(0, -50px, 0);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes pulse-border {
  0% {
    transform: translateX(0) translateY(0) translateZ(0) scale(1);
    opacity: 1;
  }

  100% {
    transform: translateX(0) translateY(0) translateZ(0) scale(1.5);
    opacity: 1;
  }
}

.pulse-border {
  position: relative;
  animation-name: pulse-border;
  animation-duration: 1500ms;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translatex(-100%);
  }
}

@keyframes marquee-2 {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translatex(0);
  }
}

:root {
  --ztc-text-text-1: #fff;
  --ztc-text-text-2: #1C293F;
  --ztc-text-text-3: #021A13;
  --ztc-text-text-4: #C1274D;
  --ztc-text-text-5: #C1274D;
  --ztc-text-text-6: #505659;
  --ztc-text-text-7: #2E2A20;
  --ztc-text-text-8: #FDE018;
  --ztc-text-text-9: #E6EBED;
  --ztc-text-text-10: #403E3D;
  --ztc-text-text-11: #C1274D;
  --ztc-text-text-12: #061317;
  --ztc-bg-bg-1: #fff;
  --ztc-bg-bg-2: #1C293F;
  --ztc-bg-bg-3: #C1274D;
  --ztc-bg-bg-4: #F0F0FA;
  --ztc-bg-bg-5: #014284;
  --ztc-bg-bg-6: #C1274D;
  --ztc-bg-bg-7: #F5F5F5;
  --ztc-border-border-1: #E5E7EB;
  --ztc-border-border-2: #dfdcdc;
  --ztc-font-size-font-s10: 10px;
  --ztc-font-size-font-s12: 12px;
  --ztc-font-size-font-s14: 14px;
  --ztc-font-size-font-s16: 16px;
  --ztc-font-size-font-s18: 18px;
  --ztc-font-size-font-s20: 20px;
  --ztc-font-size-font-s22: 22px;
  --ztc-font-size-font-s24: 24px;
  --ztc-font-size-font-s26: 26px;
  --ztc-font-size-font-s28: 28px;
  --ztc-font-size-font-s30: 30px;
  --ztc-font-size-font-s32: 32px;
  --ztc-font-size-font-s34: 34px;
  --ztc-font-size-font-s36: 36px;
  --ztc-font-size-font-s38: 38px;
  --ztc-font-size-font-s40: 40px;
  --ztc-font-size-font-s42: 42px;
  --ztc-font-size-font-s44: 44px;
  --ztc-font-size-font-s46: 46px;
  --ztc-font-size-font-s48: 48px;
  --ztc-font-size-font-s50: 50px;
  --ztc-font-size-font-s52: 52px;
  --ztc-font-size-font-s54: 54px;
  --ztc-font-size-font-s56: 56px;
  --ztc-font-size-font-s58: 58px;
  --ztc-font-size-font-s60: 60px;
  --ztc-font-size-font-s62: 62px;
  --ztc-font-size-font-s64: 64px;
  --ztc-font-size-font-s66: 66px;
  --ztc-font-size-font-s68: 68px;
  --ztc-font-size-font-s70: 70px;
  --ztc-font-size-font-s10: 10px;
  --ztc-font-size-font-s12: 12px;
  --ztc-font-size-font-s14: 14px;
  --ztc-font-size-font-s16: 16px;
  --ztc-font-size-font-s18: 18px;
  --ztc-font-size-font-s20: 20px;
  --ztc-font-size-font-s22: 22px;
  --ztc-font-size-font-s24: 24px;
  --ztc-font-size-font-s26: 26px;
  --ztc-font-size-font-s28: 28px;
  --ztc-font-size-font-s30: 30px;
  --ztc-font-size-font-s32: 32px;
  --ztc-font-size-font-s34: 34px;
  --ztc-font-size-font-s36: 36px;
  --ztc-font-size-font-s38: 38px;
  --ztc-font-size-font-s40: 40px;
  --ztc-font-size-font-s42: 42px;
  --ztc-font-size-font-s44: 44px;
  --ztc-font-size-font-s46: 46px;
  --ztc-font-size-font-s48: 48px;
  --ztc-font-size-font-s50: 50px;
  --ztc-font-size-font-s52: 52px;
  --ztc-font-size-font-s54: 54px;
  --ztc-font-size-font-s56: 56px;
  --ztc-font-size-font-s58: 58px;
  --ztc-font-size-font-s60: 60px;
  --ztc-font-size-font-s62: 62px;
  --ztc-font-size-font-s64: 64px;
  --ztc-font-size-font-s66: 66px;
  --ztc-font-size-font-s68: 68px;
  --ztc-font-size-font-s70: 70px;
  --ztc-specing-height6: 6px;
  --ztc-specing-height8: 8px;
  --ztc-specing-height10: 10px;
  --ztc-specing-height12: 12px;
  --ztc-specing-height14: 114px;
  --ztc-specing-height16: 16px;
  --ztc-specing-height18: 18px;
  --ztc-specing-height20: 20px;
  --ztc-specing-height22: 22px;
  --ztc-specing-height24: 24px;
  --ztc-specing-height26: 26px;
  --ztc-specing-height28: 28px;
  --ztc-specing-height30: 30px;
  --ztc-specing-height32: 32px;
  --ztc-specing-height34: 34px;
  --ztc-specing-height36: 36px;
  --ztc-specing-height38: 38px;
  --ztc-specing-height40: 40px;
  --ztc-specing-height42: 42px;
  --ztc-specing-height44: 44px;
  --ztc-specing-height46: 46px;
  --ztc-specing-height48: 48px;
  --ztc-specing-height50: 50px;
  --ztc-specing-height52: 52px;
  --ztc-specing-height54: 54px;
  --ztc-specing-height56: 56px;
  --ztc-specing-height58: 58px;
  --ztc-specing-height60: 60px;
  --ztc-specing-height70: 70px;
  --ztc-specing-height80: 80px;
  --ztc-specing-height90: 90px;
  --ztc-specing-height100: 100px;
  --ztc-specing-height110: 110px;
  --ztc-specing-height120: 120px;
  --ztc-specing-height130: 130px;
  --ztc-weight-regular: 400;
  --ztc-weight-medium: 500;
  --ztc-weight-semibold: 600;
  --ztc-weight-bold: 700;
  --ztc-weight-black: 800;
  --ztc-family-font1: 'Fustat', sans-serif;
}

/*============= COMMON CSS AREA ===============*/
.mr-12 {
  margin-right: 12px !important;
}

.mr-8 {
  margin-right: 8px !important;
}

.mr-14 {
  margin-right: 14px;
}

.mr-16 {
  margin-right: 16px;
}

.mr-26 {
  margin-right: 26px !important;
}

.mr-38 {
  margin-right: 38px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.mt-20 {
  margin-top: 20px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mr-34 {
  margin-right: 34px !important;
}

.ml-30 {
  margin-left: 30px;
}

.pt-16 {
  padding-top: 16px;
}

.pb-16 {
  padding-bottom: 16px;
}

.br-55 {
  border-radius: 55px !important;
}

.br-8 {
  border-radius: 8px !important;
}

.fw-500 {
  font-weight: 500 !important;
}

.fw-400 {
  font-weight: 400 !important;
}

.fns-14 {
  font-size: 14px !important;
}

@media (max-width: 575px) {
  .xs-mb20 {
    margin-bottom: 20px;
  }
}

@media (max-width: 575px) {
  .xs-mt20 {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .lg-mb20 {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .mt-20_brk {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .mt-32_brk {
    margin-top: 32px;
  }
}

@media (max-width: 575px) {
  .mb-20_brk {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .mb-0 {
    margin-bottom: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .ftz-38 {
    font-size: 38px !important;
  }
}

@media (max-width: 575px) {
  .ftz-38 {
    font-size: 34px !important;
    line-height: 42px !important;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ftz-18 {
    font-size: 18px !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .ftz-18 {
    font-size: 21px !important;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ftz-21 {
    font-size: 21px !important;
  }
}

.clr-white {
  color: var(--ztc-text-text-1) !important;
}

.clr-blue {
  color: var(--ztc-text-text-5) !important;
}

.fade-blue {
  color: var(--ztc-text-text-5) !important;
}

.fade-white-bg {
  background: var(--ztc-bg-bg-4) !important;
}

.fade-white-bg-2 {
  background: var(--ztc-bg-bg-7) !important;
}

.white-bg {
  background: var(--ztc-bg-bg-1) !important;
}

.blue-bg {
  background: var(--ztc-bg-bg-6) !important;
}

.clr-pera {
  color: var(--ztc-text-text-10) !important;
}

.clr-pera-2 {
  color: var(--ztc-text-text-6) !important;
}

.border1px {
  border: 1px solid #D8D8E1 !important;
}

.hm5-bg {
  background: var(--ztc-bg-bg-7) !important;
}

.btn_fixxer_hm4 {
  border-radius: 55px !important;
}

.btn_fixxer_hm4::after {
  border-radius: 55px !important;
}

.vl-btn1 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  text-transform: uppercase;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.6s;
  background: var(--ztc-bg-bg-3);
  padding: 18px 24px;
  border-radius: 8px;
  position: relative;
  border: none;
  z-index: 1;
}

@media (max-width: 575px) {
  .vl-btn1 {
    padding: 18px 12px;
  }
}

.vl-btn1::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 0;
  transition: all 0.6s;
  right: 0;
  top: 0;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-2);
  z-index: -1;
  border-radius: 8px;
}

.vl-btn1 i {
  margin-left: 4px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.vl-btn1:hover {
  transition: all 0.4s;
  transform: translateY(-10px);
  color: var(--ztc-text-text-1);
}

.vl-btn1:hover::after {
  width: 100%;
  transition: all 0.6s;
  left: 0;
  right: inherit;
}

.vl-btn1:hover i {
  transform: rotate(0);
  transition: all 0.4s;
}

.vl-btn2 {
  color: var(--ztc-text-text-4);
  font-size: var(--ztc-font-size-font-s18);
  text-transform: uppercase;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.6s;
  background: var(--ztc-bg-bg-1);
  padding: 18px 24px;
  border-radius: 4px;
  position: relative;
  z-index: 1;
}

.vl-btn2::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 0;
  transition: all 0.6s;
  right: 0;
  top: 0;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-2);
  z-index: -1;
  border-radius: 4px;
}

.vl-btn2 i {
  margin-left: 4px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.vl-btn2:hover {
  transition: all 0.4s;
  transform: translateY(-10px);
  color: var(--ztc-text-text-1);
}

.vl-btn2:hover::after {
  width: 100%;
  transition: all 0.6s;
  left: 0;
  right: inherit;
}

.vl-btn2:hover i {
  transform: rotate(0);
  transition: all 0.4s;
}

.vl-btn3 {
  position: relative;
  color: var(--ztc-text-text-1);
  display: inline-block;
  padding: 16px 22px;
  background: var(--ztc-bg-bg-3);
  border-radius: 8px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  border: none;
  z-index: 1;
  transition: 0.3s;
}

.vl-btn3:hover {
  color: var(--ztc-text-text-1);
}

.vl-btn3 img {
  margin-right: 8px;
}

.vl-btn3::after {
  position: absolute;
  content: "";
  background: var(--ztc-bg-bg-2);
  left: 0;
  right: 0;
  border-radius: 8px;
  height: 100%;
  width: 100%;
  top: 0;
  transform: scaleX(0);
  transition: 0.4s;
  z-index: -1;
}

.vl-btn3:hover::after {
  transform: scaleX(1);
}

.service3-btn {
  position: relative;
  color: var(--ztc-text-text-5);
  display: inline-block;
  padding: 16px 22px;
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  z-index: 1;
  transition: 0.3s;
}

.service3-btn:hover {
  color: var(--ztc-text-text-1);
}

.service3-btn::after {
  position: absolute;
  content: "";
  background: var(--ztc-bg-bg-2);
  left: 0;
  right: 0;
  border-radius: 8px;
  height: 100%;
  width: 100%;
  top: 0;
  transform: scaleX(0);
  transition: 0.4s;
  z-index: -1;
}

.service3-btn:hover::after {
  transform: scaleX(1);
}

.btn4-4 {
  position: relative;
  color: var(--ztc-text-text-5);
  display: inline-block;
  padding: 16px 22px;
  border: 1px solid var(--ztc-text-text-5);
  border-radius: 55px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  z-index: 1;
  transition: 0.4s;
}

.vl-btn5 {
  position: relative;
  color: var(--ztc-text-text-1);
  display: inline-block;
  padding: 16px 22px;
  background: var(--ztc-bg-bg-3);
  border-radius: 111px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  border: none;
  line-height: 18px;
  z-index: 1;
  transition: 0.3s;
}

.vl-btn5:hover {
  color: var(--ztc-text-text-1);
}

.vl-btn5::after {
  position: absolute;
  content: "";
  background: var(--ztc-bg-bg-2);
  left: 0;
  right: 0;
  border-radius: 111px;
  height: 100%;
  width: 100%;
  top: 0;
  transform: scaleX(0);
  transition: 0.4s;
  z-index: -1;
}

.vl-btn5:hover::after {
  transform: scaleX(1);
}

.btn-6 a {
  position: relative;
  color: var(--ztc-text-text-5);
  display: inline-block;
  padding: 16px 22px;
  border: 1px solid var(--ztc-text-text-5);
  border-radius: 55px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  z-index: 1;
  transition: 0.4s;
}

.vl-btn07 {
  position: relative;
  color: var(--ztc-text-text-5);
  display: inline-block;
  padding: 16px 22px;
  background: var(--ztc-bg-bg-1);
  border-radius: 111px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  border: 1px solid;
  z-index: 1;
  transition: 0.3s;
}

.vl-btn07:hover {
  color: var(--ztc-text-text-1);
}

.vl-btn07::after {
  position: absolute;
  content: "";
  background: var(--ztc-bg-bg-2);
  left: 0;
  right: 0;
  border-radius: 111px;
  height: 100%;
  width: 100%;
  top: 0;
  transform: scaleX(0);
  transition: 0.4s;
  z-index: -1;
}

.vl-btn07:hover::after {
  transform: scaleX(1);
}

.vl-btn8 {
  color: var(--ztc-text-text-16);
  font-size: var(--ztc-font-size-font-s18);
  text-transform: uppercase;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.6s;
  background: none;
  padding: 18px 24px;
  border-radius: 8px;
  position: relative;
  border: 1px solid #061317;
  z-index: 1;
}

@media (max-width: 575px) {
  .vl-btn8 {
    padding: 18px 12px;
  }
}

.vl-btn8::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 0;
  transition: all 0.6s;
  right: 0;
  top: 0;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-2);
  z-index: -1;
  border-radius: 8px;
}

.vl-btn8 i {
  margin-left: 4px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.vl-btn8:hover {
  transition: all 0.4s;
  transform: translateY(-10px);
  color: var(--ztc-text-text-1);
}

.vl-btn8:hover::after {
  width: 100%;
  transition: all 0.6s;
  left: 0;
  right: inherit;
}

.vl-btn8:hover i {
  transform: rotate(0);
  transition: all 0.4s;
}

.vl-btn9 {
  position: relative;
  color: var(--ztc-text-text-1);
  display: inline-block;
  padding: 16px 22px;
  background: var(--ztc-bg-bg-3);
  border-radius: 99px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  z-index: 1;
  transition: 0.3s;
}

.vl-btn9 i {
  margin-left: 8px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.vl-btn9:hover {
  color: var(--ztc-text-text-1);
}

.vl-btn9:hover i {
  transform: rotate(0deg);
  transition: all 0.4s;
}

.vl-btn9::after {
  position: absolute;
  content: "";
  background: var(--ztc-bg-bg-2);
  left: 0;
  right: 0;
  border-radius: 99px;
  height: 100%;
  width: 100%;
  top: 0;
  transform: scaleX(0);
  transition: 0.4s;
  z-index: -1;
}

.vl-btn9:hover::after {
  transform: scaleX(1);
}

.vl-btn10 {
  color: var(--ztc-text-text-14);
  font-size: var(--ztc-font-size-font-s18);
  text-transform: uppercase;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.6s;
  background: var(--ztc-bg-bg-1);
  padding: 18px 24px;
  border-radius: 4px;
  border: none;
  position: relative;
  z-index: 1;
}

.vl-btn10::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 0;
  transition: all 0.6s;
  right: 0;
  top: 0;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-2);
  z-index: -1;
  border-radius: 4px;
}

.vl-btn10 i {
  margin-left: 4px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.vl-btn10:hover {
  transition: all 0.4s;
  transform: translateY(-10px);
  color: var(--ztc-text-text-1);
}

.vl-btn10:hover::after {
  width: 100%;
  transition: all 0.6s;
  left: 0;
  right: inherit;
}

.vl-btn10:hover i {
  transform: rotate(0);
  transition: all 0.4s;
}

.vl-btn11 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  text-transform: uppercase;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.6s;
  background: var(--ztc-bg-bg-2);
  padding: 18px 24px;
  border-radius: 8px;
  position: relative;
  border: none;
  z-index: 1;
}

@media (max-width: 575px) {
  .vl-btn11 {
    padding: 18px 12px;
  }
}

.vl-btn11::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 0;
  transition: all 0.6s;
  right: 0;
  top: 0;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-3);
  z-index: -1;
  border-radius: 8px;
}

.vl-btn11 i {
  margin-left: 4px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.vl-btn11:hover {
  transition: all 0.4s;
  transform: translateY(-10px);
  color: var(--ztc-text-text-1);
}

.vl-btn11:hover::after {
  width: 100%;
  transition: all 0.6s;
  left: 0;
  right: inherit;
}

.vl-btn11:hover i {
  transform: rotate(0);
  transition: all 0.4s;
}

.next-arrow button {
  height: 56px;
  width: 56px;
  text-align: center;
  line-height: 56px;
  border-radius: 50%;
  display: inline-block;
  border: none;
  background: var(--ztc-text-text-4);
  transition: 0.3s;
}

.next-arrow button:hover {
  background: var(--ztc-text-text-1);
}

.next-arrow button:hover i {
  color: var(--ztc-text-text-4);
}

.next-arrow button i {
  font-size: var(--ztc-font-size-font-s24);
  color: var(--ztc-text-text-1);
  line-height: 55px;
  transition: 0.3s;
}

.prev-arrow button {
  height: 56px;
  width: 56px;
  text-align: center;
  line-height: 56px;
  border-radius: 50%;
  display: inline-block;
  border: none;
  background: var(--ztc-text-text-1);
  transition: 0.3s;
}

.prev-arrow button:hover {
  background: var(--ztc-text-text-4);
}

.prev-arrow button:hover i {
  color: var(--ztc-text-text-1);
}

.prev-arrow button i {
  font-size: var(--ztc-font-size-font-s24);
  color: var(--ztc-text-text-4);
  line-height: 55px;
}

.vl-hero-heading .vl-hero-subtitle h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-semibold);
  text-transform: uppercase;
}

@media (max-width: 575px) {
  .vl-hero-heading .vl-hero-subtitle h2 {
    font-size: 15px;
  }
}

.vl-hero-heading .vl-hero-subtitle h2 img {
  width: 40px;
  padding-right: 8px;
}

.vl-hero-heading .vl-hero-title h1 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s56);
  font-weight: var(--ztc-weight-bold);
  line-height: 66px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero-heading .vl-hero-title h1 {
    line-height: 50px;
    font-size: 45px;
  }
}

@media (max-width: 575px) {
  .vl-hero-heading .vl-hero-title h1 {
    line-height: 50px;
    font-size: 40px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-hero-heading .vl-hero-title h1 br {
    display: none;
  }
}

.vl-about-title-area h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-semibold);
  line-height: 18px;
  text-transform: uppercase;
}

.vl-about-title-area h3 img {
  width: 40px;
  padding-right: 8px;
}

.vl-about-title-area h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media (max-width: 575px) {
  .vl-about-title-area h2 {
    line-height: 40px;
    font-size: 32px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-about-title-area h2 {
    line-height: 42px;
    font-size: 40px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-about-title-area h2 {
    font-size: 34px;
    line-height: 48px;
  }
}

@media (max-width: 575px) {
  .vl-about-title-area h2 br {
    display: none;
  }
}

.vl-about-title-area p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-about-title-area p {
    font-size: 17px;
  }
}

.star_icon ul li {
  display: inline-block;
  margin-right: 2px;
}

.star_icon ul li i {
  color: var(--ztc-text-text-8);
}

.star_icon_2 ul li i {
  color: var(--ztc-text-text-4);
}

.our_services_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .our_services_top {
    display: block;
  }
}

.vl-work-heading-area h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-semibold);
  line-height: 18px;
  text-transform: uppercase;
}

.vl-work-heading-area h3 img {
  width: 40px;
  padding-right: 8px;
}

.vl-work-heading-area h2 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media (max-width: 575px) {
  .vl-work-heading-area h2 {
    line-height: 40px;
    font-size: 32px;
  }
}

.vl-service1-box-info-top {
  display: flex;
}

.vl-service1-box-info-top .vl-service1-box-date a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-service1-box-info-top .vl-service1-box-date a {
    font-size: 16px;
  }
}

.vl-service1-box-info-top .vl-service1-box-date a svg {
  margin: 0px 5px 3px 0px;
}

.vl-service1-box-info-top .vl-service1-box-right_hover a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  border-radius: 8px;
  background: var(--ztc-bg-bg-4);
  padding: 4px 12px;
  transition: all 0.4s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-service1-box-info-top .vl-service1-box-right_hover a {
    font-size: 16px;
  }
}

.vl-service1-box-info-top .vl-service1-box-right_hover a:hover {
  color: var(--ztc-text-text-1);
  background: var(--ztc-bg-bg-3);
}

.vl-service1-box-info-content h2 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 32px;
  transition: all 0.4s;
}

.vl-service1-box-info-content h2 a:hover {
  color: var(--ztc-text-text-4);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-service1-box-info-content h2 a br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
(max-width: 575px) {
  .vl-service1-box-info-content h2 a {
    font-size: 20px;
  }
}

.vl-service1-box-info-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-service1-box-info-content p br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-service1-box-info-content p {
    font-size: 16px;
  }
}

.image-anime {
  position: relative;
  overflow: hidden;
}

.image-anime:after {
  content: "";
  position: absolute;
  width: 200%;
  height: 0%;
  left: 50%;
  top: 50%;
  background-color: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%) rotate(-45deg);
  z-index: 1;
}

.image-anime:hover:after {
  height: 250%;
  transition: all 600ms linear;
  background-color: transparent;
}

.service_c_bg {
  border: 1px solid #F0F0FA !important;
}

.service_bg {
  background: #fff !important;
}

.cursor-outer {
  margin-inline-start: -12px;
  margin-top: -12px;
  width: 30px;
  height: 30px;
  border: 1px solid var(--ztc-bg-bg-2);
  background-color: transparent;
  box-sizing: border-box;
  z-index: 10000000;
  opacity: 0.34;
  transition: all 0.4s ease-out 0s;
}

.cursor-outer.color-4 {
  border: 1px solid red;
  background-color: green;
}

.cursor-outer.cursor-hover {
  opacity: 0.14;
}

.cursor-outer.cursor-big {
  opacity: 0;
}

.mouseCursor {
  position: fixed;
  top: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  bottom: 0;
  pointer-events: none;
  border-radius: 50%;
  transform: translateZ(0);
  visibility: hidden;
  text-align: center;
}

.mouseCursor.cursor-big {
  width: 20px;
  height: 20px;
  margin-inline-start: -12px;
  margin-top: -12px;
}

.cursor-inner {
  margin-inline-start: -3px;
  margin-top: -3px;
  width: 10px;
  height: 10px;
  z-index: 10000001;
  background-color: var(--ztc-bg-bg-3);
  opacity: 1;
  transition: all 0.24s ease-out 0s;
}

.cursor-inner.color-4 {
  background-color: red;
}

.cursor-inner.cursor-big span {
  opacity: 1;
}

.cursor-inner.cursor-hover {
  margin-inline-start: -10px;
  margin-top: -10px;
  width: 30px;
  height: 30px;
  background-color: var(--theme);
  /* $theme-color */
  border: 1px solid #686363;
  opacity: 0;
}

.reveal {
  position: relative;
  display: -ms-inline-flexbox;
  visibility: hidden;
  overflow: hidden;
}

.reveal img {
  height: 100%;
  width: 100%;
  display: inline-block;
  -o-object-fit: cover;
  object-fit: cover;
  transform-origin: left;
}

/*============= COMMON CSS AREA ENDS===============*/
.sp1 {
  padding: 100px 0 100px;
}

@media (max-width: 575px) {
  .sp1 {
    padding: 50px 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp1 {
    padding: 50px 0 50px;
  }
}

.sp2 {
  padding: 100px 0 70px;
}

@media (max-width: 575px) {
  .sp2 {
    padding: 50px 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp2 {
    padding: 50px 0 20px;
  }
}

.sp3 {
  padding: 100px 0 50px;
}

.sp4 {
  padding: 80px 0 80px;
}

@media (max-width: 575px) {
  .sp4 {
    padding: 40px 0 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp4 {
    padding: 40px 0 40px;
  }
}

.sp5 {
  padding: 60px 0 60px;
}

@media (max-width: 575px) {
  .sp5 {
    padding: 30px 0 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp5 {
    padding: 30px 0 30px;
  }
}

.sp6 {
  padding: 120px 0 120px;
}

@media (max-width: 575px) {
  .sp6 {
    padding: 60px 0 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp6 {
    padding: 60px 0 60px;
  }
}

.sp7 {
  padding: 120px 0 90px;
}

@media (max-width: 575px) {
  .sp7 {
    padding: 60px 0 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp7 {
    padding: 60px 0 30px;
  }
}

.sp8 {
  padding: 100px 0 0;
}

@media (max-width: 575px) {
  .sp8 {
    padding: 50px 0 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp8 {
    padding: 50px 0 0;
  }
}

.sp9 {
  padding: 120px 0 0;
}

@media (max-width: 575px) {
  .sp9 {
    padding: 60px 0 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp9 {
    padding: 60px 0 0;
  }
}

.sp10 {
  padding: 0 0 100px;
}

@media (max-width: 575px) {
  .sp10 {
    padding: 0 0 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp10 {
    padding: 0 0 50px;
  }
}

.sp11 {
  padding: 0 0 70px;
}

@media (max-width: 575px) {
  .sp11 {
    padding: 0 0 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sp11 {
    padding: 0 0 20px;
  }
}

.space-margin60 {
  margin-bottom: 60px;
}

@media (max-width: 575px) {
  .space-margin60 {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .space-margin60 {
    margin-bottom: 30px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sp-brk-1 {
    padding: 50px 0px;
  }
}

/*============= ABOUT CSS AREA ===============*/
.about1 {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.about1 .about-exp-box {
  background: var(--ztc-bg-bg-3);
  border-radius: 16px;
  padding: 28px 24px;
}

.about1 .about-exp-box h2 {
  color: var(--ztc-text-text-1);
  font-weight: var(--ztc-weight-bold);
  font-size: var(--ztc-font-size-font-s44);
  line-height: 44px;
}

.about1 .about-exp-box p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.about1 .about-exp-box h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-semibold);
  line-height: 28px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about1 .about-exp-box h3 {
    font-size: 19px;
  }
}

@media (max-width: 575px) {
  .about1 .about1-box-banner-sm {
    margin-top: 30px;
  }
}

.about1 .about1-box-banner-sm img {
  height: 300px;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px;
}

.about1 .about1-lrg-banner img {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px;
}

.about1 .about1-info {
  margin-left: 15px;
}

@media (max-width: 575px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .about1 .about1-info {
    margin-left: 0px;
    margin-top: 20px;
  }
}

.about1 .about1-info-content .about1-info-contentbox {
  display: flex;
}

@media (max-width: 575px) {
  .about1 .about1-info-content .about1-info-contentbox {
    display: block;
  }
}

.about1 .about1-info-content .about1-info-contentbox:hover .about1-contentbox-icon {
  transform: rotateY(-360deg);
  transition: all 1s;
}

.about1 .about1-info-content .about1-info-contentbox .about1-contentbox-icon {
  background: var(--ztc-bg-bg-4);
  border-radius: 60px;
  width: 60px;
  height: 60px;
  text-align: center;
  display: inline-block;
  line-height: 58px;
  margin-right: 16px;
  transform: rotateY(0);
  transition: all 0.4s;
}

@media (max-width: 575px) {
  .about1 .about1-info-content .about1-info-contentbox .about1-contentbox-icon {
    margin-bottom: 20px;
  }
}

.about1 .about1-info-content .about1-info-contentbox .about1-contentbox-icon img {
  height: 32px;
  width: 32px;
}

.about1 .about1-info-content .about1-info-contentbox .about1-contentbox-text h2 a {
  color: var(--ztc-text-text-2);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.about1 .about1-info-content .about1-info-contentbox .about1-contentbox-text p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.about1-shape {
  position: absolute;
  bottom: 0px;
  right: 0px;
}

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

.vl-about2-area {
  overflow: hidden;
}

.vl-about2-area-banner {
  position: relative;
}

@media (max-width: 575px) {
  .vl-about2-area-banner-img {
    margin-bottom: 20px;
  }
}

.vl-about2-area-banner-img img {
  border-radius: 16px 16px 0 16px;
  width: 100%;
  height: 640px;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-about2-area-banner-img img {
    border-radius: 16px;
  }
}

.vl-about2-area-banner-bottom {
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: 0;
}

.vl-about2-area-banner-bottom-box {
  background: var(--ztc-bg-bg-3);
  display: flex;
  padding: 26px 22px;
  border-radius: 16px 0 0 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .vl-about2-area-banner-bottom-box {
    border-radius: 16px 0px 16px 0px;
  }
}

.vl-about2-area-banner-bottom-box-logo {
  margin-right: 12px;
}

.vl-about2-area-banner-bottom-box-rating-top {
  display: flex;
  margin-bottom: 4px;
}

.vl-about2-area-banner-bottom-box-rating-top-star i {
  color: var(--ztc-text-text-8);
  margin-right: 6px;
}

.vl-about2-area-banner-bottom-box-rating-top h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s16);
  font-weight: var(--ztc-weight-medium);
  line-height: 24px;
}

.vl-about2-area-banner-bottom-box-rating-text h2 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s14);
  font-weight: 400;
  line-height: 21px;
}

.vl-about2-area-banner-bottom-box-rating-text h2 span {
  font-weight: var(--ztc-weight-bold);
}

.about2-title_area {
  padding-left: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about2-title_area {
    padding: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about2-title_area {
    padding: 0;
    margin-top: 30px;
  }
}

@media (max-width: 575px) {
  .about2-title_area {
    padding: 0;
    margin-top: 30px;
  }
}

.about2_content_bottom {
  background: var(--ztc-bg-bg-4);
  margin-left: -26px;
  border-radius: 0 16px 16px 0;
  margin-top: 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .about2_content_bottom {
    margin-left: 0px;
    border-radius: 16px;
  }
}

.about2_content_box {
  padding: 24px 12px;
}

.about2_content_box:hover .about2_content_box_icon {
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.about2_content_box_icon {
  background: var(--ztc-bg-bg-1);
  display: inline-block;
  height: 70px;
  width: 70px;
  position: relative;
  border-radius: 8px;
  transition: all 0.4s;
}

.about2_content_box_icon_img {
  text-align: center;
  line-height: 70px;
}

.about2_icon {
  width: 32px;
  height: 32px;
  text-align: center;
}

.about2_content_box_icon_img_shape {
  position: absolute;
  bottom: -8px;
  right: -10px;
}

.about2_content_box_icon_img_shape img {
  width: 70px;
  height: 30px;
}

.about2_content_box_content h2 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
  transition: 0.3s;
}

.about2_content_box_content h2 a:hover {
  color: var(--ztc-text-text-4);
  transition: 0.3s;
}

.about2_content_box_content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-abouthm3-contentarea {
  padding-left: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-abouthm3-contentarea {
    padding: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-abouthm3-contentarea {
    padding: 0;
  }
}

@media (max-width: 575px) {
  .vl-abouthm3-contentarea {
    padding: 0;
  }
}

.vl-about3-area {
  position: relative;
  overflow: hidden;
}

.vl-about3-thumb-info {
  margin-top: 78px;
}

@media (max-width: 575px) {
  .vl-about3-thumb-info {
    margin-top: 0;
  }
}

.vl-about3-thumb-info-img img {
  width: 100%;
  height: 300px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px;
}

.vl-about3-thumb-info-box {
  text-align: center;
  background: var(--ztc-bg-bg-4);
  padding: 28px 24px;
  border-radius: 16px;
}

@media (max-width: 575px) {
  .vl-about3-thumb-info-box {
    margin-bottom: 30px;
  }
}

.vl-about3-thumb-info-box-img img {
  -o-object-fit: cover;
  object-fit: cover;
}

.vl-about3-thumb-info-box h3 {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

@media (max-width: 575px) {
  .vl-about3-thumb {
    margin-bottom: 30px;
  }
}

.vl-about3-thumb-img img {
  width: 100%;
  height: 300px;
  border-radius: 16px;
  -o-object-fit: cover;
  object-fit: cover;
}

.vl-about3-heading .about3-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media (max-width: 575px) {
  .vl-about3-heading .about3-title br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-about3-heading .about3-title {
    font-size: 40px;
    line-height: 44px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-about3-heading .about3-title {
    font-size: 36px;
    line-height: 44px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-about3-heading .about3-title {
    line-height: 36px;
    font-size: 26px;
  }
}

@media (max-width: 575px) {
  .vl-about3-heading .about3-title {
    line-height: 48px;
    font-size: 40px;
  }
}

.vl-about3-heading p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.about3-subtitle {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  padding: 10px 14px;
  display: inline-block;
}

.vl-about3-items ul li {
  margin-bottom: 16px;
}

.vl-about3-items ul li:last-child {
  margin-bottom: 0px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-about3-items ul li:last-child {
    margin-bottom: 16px;
  }
}

.vl-about3-items ul li span {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-semibold);
  line-height: 18px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-about3-items ul li span {
    font-size: 17px;
  }
}

@media (max-width: 575px) {
  .vl-about3-items ul li span {
    font-size: 15px;
  }
}

.vl-about3-items ul li span img {
  margin-right: 6px;
}

.vl-about3-list-border {
  border-bottom: 1px solid #E6EBED;
}

.vl-about3-counter {
  display: flex;
}

.vl-about3-counter-info {
  margin-right: 32px;
}

.vl-about3-counter-info:last-child {
  margin-right: 0px;
}

.vl-about3-counter-info h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

.vl-about3-counter-info p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.about3_shape {
  height: 175px;
}

.abouthm4-alltext-area {
  padding-left: 40px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .abouthm4-alltext-area {
    padding-left: 8px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .abouthm4-alltext-area {
    padding-left: 0px;
  }
}

.vl-about4-area {
  overflow: hidden;
  padding: 100px 40px 100px;
  position: relative;
  z-index: 1;
}

@media (max-width: 575px) {
  .vl-about4-area {
    padding: 50px 16px 50px;
  }
}

.about4-thumb-1 img {
  width: 100%;
  height: 100%;
  border-radius: 30px;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .about4-thumb-1 img {
    height: 100%;
  }
}

.about4-thumb-2 {
  margin-top: 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about4-thumb-2 {
    margin-top: 320px;
  }
}

@media (max-width: 575px) {
  .about4-thumb-2 {
    margin-top: 32px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about4-thumb-2 {
    margin-top: 0px;
  }
}

.about4-thumb-2 img {
  width: 100%;
  height: 100%;
  border-radius: 30px;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .about4-thumb-2 img {
    height: 100%;
  }
}

.about4-thumb-shape {
  position: absolute;
  z-index: -1;
  left: 0;
  bottom: 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about4-thumb-shape {
    bottom: 80px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .about4-thumb-shape {
    display: none;
  }
}

.about4-thumb-shape img {
  width: 100%;
  height: 100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .about4-thumb-shape img {
    width: 500px;
    height: 600px;
  }
}

.about4-boxinfo {
  display: flex;
}

.about4-boxinfo:hover .about4-boxinfo-logo {
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.about4-boxinfo:hover .about4-logo {
  transition: all 0.4s;
  filter: inherit;
}

.about4-boxinfo-logo {
  position: relative;
  margin-right: 16px;
  transition: all 0.4s;
}

.about4-boxinfo-logo-img {
  width: 60px;
  height: 60px;
}

.about4-boxinfo-logo-img img {
  transition: all 0.4s;
  filter: brightness(0) invert(1);
}

.about4-boxinfo-logo .about4-icon {
  position: absolute;
  top: 14px;
  left: 12px;
  height: 34px;
  width: 34px;
}

.about4-boxinfo-text h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.about4-boxinfo-text p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

/*============= ABOUT CSS AREA ENDS ===============*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .shape_aboutus_fixxer {
    height: 180px;
  }
}

/*============= SERVICE CSS AREA ===============*/
.service1-area {
  overflow: hidden;
  padding: 100px 0px 300px 0px;
  position: relative;
}

.service1-area .vl-service1-box {
  display: flex;
}

.service1-area .vl-service1-box:hover .view_services {
  color: var(--ztc-text-text-4);
  transition: 0.4s;
}

.service1-area .vl-service1-box:hover .view_services i {
  transform: rotate(0deg);
  transition: 0.4s;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service1-area .vl-service1-box:last-child {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .service1-area .vl-service1-box {
    display: block;
  }
}

.service1-area .vl-service1-box-banner {
  margin-right: 28px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .service1-area .vl-service1-box-banner {
    margin-right: 0px;
    margin-bottom: 18px;
  }
}

.service1-area .vl-service1-box-banner-img img {
  border-radius: 16px;
  -o-object-fit: cover;
  object-fit: cover;
  height: 235px;
  width: 200px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .service1-area .vl-service1-box-banner-img img {
    height: 100%;
    width: 100%;
  }
}

.service1-area-shape {
  position: absolute;
  top: 20px;
  right: 0;
}

@media (max-width: 575px) {
  .service1-area-shape-img {
    display: none;
  }
}

.service1-area-shape-img img {
  height: 360px;
  width: 171px;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .service1-area-shape-img img {
    height: 340px;
    width: 150px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service1-area-shape-img img {
    height: 224px;
    width: 120px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service1-area-shape-img img {
    height: 200px;
    width: 100px;
  }
}

.view_services {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  text-transform: uppercase;
  display: inline-block;
  transition: all 0.4s;
}

.view_services:hover {
  color: var(--ztc-text-text-4);
}

.view_services i {
  transform: rotate(-45deg);
  transition: all 0.4s;
  height: 24px;
  width: 24px;
  font-size: 22px;
  margin-left: 6px;
}

.vl-service1-top_line span {
  margin: 0px 8px;
  color: var(--ztc-text-text-9);
}

.service1_bottom_border {
  margin: 30px 0px;
  border-bottom: 1px solid rgba(46, 42, 32, 0.1);
}

@media (max-width: 575px) {
  .service1_bottom_border {
    border-bottom: none;
  }
}

.vl-services2-area {
  background: var(--ztc-bg-bg-4);
  overflow: hidden;
}

.vl-services2-box {
  background: var(--ztc-text-text-1);
  padding: 24px 18px;
  border-radius: 16px;
  transition: 0.4s;
  margin-bottom: 30px;
}

.vl-services2-box:hover {
  background: var(--ztc-bg-bg-3);
  transition: 0.4s;
}

.vl-services2-box:hover h3 {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.vl-services2-box:hover .vl-services2-icon-shape .blue-shape {
  opacity: 1;
  visibility: visible;
  z-index: 99;
}

.vl-services2-box:hover .vl-services2-icon-shape .wht-shape {
  opacity: 0;
  visibility: hidden;
  z-index: -99;
}

.vl-services2-box:hover .vl-services2-box-top-text h3 a {
  color: var(--ztc-text-text-1);
  transition: 0.4s;
}

.vl-services2-box:hover p {
  color: var(--ztc-text-text-1);
  transition: 0.4s;
}

.vl-services2-box-top {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid rgba(0, 51, 78, 0.1);
  padding-bottom: 24px;
}

.vl-services2-box-top-text h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
  transition: 0.4s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-services2-box-top-text h3 a {
    font-size: 17px;
  }
}

.vl-services2-box-top-icon {
  background: var(--ztc-bg-bg-4);
  height: 70px;
  width: 70px;
  display: inline-block;
  border-radius: 8px;
  position: relative;
}

.vl-services2-box-top-icon-img {
  text-align: center;
  line-height: 70px;
}

.vl-services2-box-top-icon-img img {
  width: 32px;
  height: 32px;
}

.vl-services2-box p {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
  transition: 0.4s;
}

.vl-services2-icon-shape {
  position: absolute;
  bottom: 0px;
}

.vl-services2-icon-shape .wht-shape {
  position: absolute;
  width: 70px;
  height: 30px;
  bottom: -8px;
  left: 10px;
}

.vl-services2-icon-shape .blue-shape {
  width: 70px;
  height: 30px;
  bottom: -8px;
  left: 10px;
  position: relative;
  opacity: 0;
  visibility: hidden;
  z-index: 99;
}

.services2_img img {
  border-radius: 16px;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.vl-service3-area {
  overflow: hidden;
  background: var(--ztc-bg-bg-5);
  padding: 100px 0px 230px;
}

.vl-service3-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 575px) {
  .vl-service3-top {
    display: block;
  }
}

.vl-service3-heading h4 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 8px;
  padding: 10px 14px;
  display: inline-block;
}

.vl-service3-heading h2 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media (max-width: 575px) {
  .vl-service3-heading h2 br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-service3-heading h2 {
    font-size: 36px;
    line-height: 44px;
  }
}

@media (max-width: 575px) {
  .vl-service3-heading h2 {
    line-height: 44px;
    font-size: 30px;
    margin-bottom: 12px;
  }
}

.vl-service3-items {
  margin-top: -170px;
  margin-bottom: 0px;
}

@media (max-width: 575px) {
  .service3-items-list {
    padding: 0px 10px;
  }
}

.service3-items-list-banner {
  position: relative;
}

.service3-items-list-banner-img {
  overflow: hidden;
  border-radius: 16px 16px 0px 0px;
}

.service3-items-list-banner-img img {
  width: 100%;
  height: 340px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px 16px 0px 0px;
  transition: 0.4s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service3-items-list-banner-img img {
    width: 100%;
  }
}

.service3-items-list:hover .service3-items-list-banner-img img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s;
}

.service3-items-list:hover .service3-items-list-icon {
  background: var(--ztc-bg-bg-3);
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.service3-items-list:hover .service3-items-list-icon img {
  filter: brightness(0) invert(1);
}

.service3-items-list:hover .learn_more {
  color: var(--ztc-text-text-4);
}

.service3-items-list:hover .learn_more i {
  transform: rotate(0deg);
}

.service3-items-list-icon {
  width: 60px;
  height: 60px;
  border-radius: 8px;
  background: var(--ztc-bg-bg-1);
  box-shadow: 0 4px 40px 0 rgba(0, 0, 0, 0.08);
  display: inline-block;
  position: absolute;
  bottom: -28px;
  right: 24px;
  text-align: center;
  line-height: 60px;
  transition: all 0.4s;
}

.service3-items-list-icon img {
  width: 32px;
  height: 32px;
  filter: brightness(0) invert(0);
  transition: all 0.4s;
}

.service3-items-list-content {
  padding: 36px 24px;
  border: 1px solid #DCDDDE;
  border-radius: 0 0 16px 16px;
}

.service3-items-list-content h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.service3-items-list-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .service3-items-list-content p {
    font-size: 17px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .service3-items-list-content p {
    font-size: 16px;
  }
}

.learn_more {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.4s;
}

.learn_more i {
  transform: rotate(-45deg);
  transition: all 0.4s;
  height: 24px;
  width: 24px;
  font-size: 22px;
  margin-left: 6px;
}

.blog3-shape-img img {
  height: 280px;
  width: 144px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog3-shape-img img {
    height: 200px;
    width: 100px;
  }
}

.vl-service4-area {
  padding: 100px 40px 100px;
  overflow: hidden;
}

@media (max-width: 575px) {
  .vl-service4-area {
    padding: 50px 16px 50px;
  }
}

.service4-box {
  border-right: 1px solid #E6EBED;
  border-bottom: 1px solid #E6EBED;
  padding: 40px 0px;
  transition: all 0.4s;
}

.service4-box:hover {
  background: var(--ztc-bg-bg-1);
  transition: all 0.4s;
}

.service4-box:hover .service4_learn {
  opacity: 1;
  visibility: visible;
}

.service4-box:hover .service4-box-icon {
  transform: translateY(-10px);
  transition: all 0.4s;
}

.service4-box:hover .service4-content-wrap {
  transform: translateY(-10px);
  transition: all 0.4s;
}

.service4-box:hover .service4_learn {
  transform: translateY(-10px);
  transition: all 0.4s;
}

.service4-box-icon {
  transition: all 0.4s;
}

.service4-box-icon svg {
  margin-bottom: 40px;
}

.service4-box .service4-content {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  transition: all 0.4s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service4-box .service4-content {
    font-size: 22px;
  }
}

.service4-box .service4_learn {
  color: var(--ztc-text-text-4);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  opacity: 0;
  visibility: hidden;
  display: inline-block;
  transition: all 0.4s;
}

.service4-box .service4_learn i {
  transform: rotate(-45deg);
  transition: all 0.4s;
  height: 24px;
  width: 24px;
  font-size: 20px;
  margin-left: 4px;
  margin-top: 6px;
}

.service4-content-wrap {
  transition: all 0.4s;
}

.service_single-pagination ul li {
  display: inline-block;
  margin-right: 10px;
}

.service_single-pagination ul li:last-child {
  margin-right: 0;
}

.service_single-pagination ul li a {
  background: var(--ztc-bg-bg-4);
  color: var(--ztc-text-text-5);
  display: block;
  border-radius: 8px;
  height: 56px;
  width: 56px;
  line-height: 56px;
  text-align: center;
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  transition: 0.3s;
}

.service_single-pagination ul li a:hover {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  transition: 0.3s;
}

.service-inr-details-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .service-inr-details-title {
    font-size: 42px;
  }
}

.service-inr-details-text {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.service-inr-details-thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 426px;
  border-radius: 20px;
}

.service-inr-details-thumb-2 img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 426px;
  border-radius: 20px;
}

.service-inr-details-title-mini {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 30px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-inr-details-title-mini {
    font-size: 23px;
  }
}

.service-inr-details-box {
  display: flex;
}

.service-inr-details-box:hover .about2_content_box_icon {
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.service-inr-box-details-title a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .service-inr-box-details-title a {
    font-size: 22px;
  }
}

@media (max-width: 575px) {
  .service-inr-box-details-title a {
    font-size: 19px;
  }
}

.service-inr-box-details-text {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media (max-width: 575px) {
  .service-inr-box-details-text {
    font-size: 17px;
  }
}

/*============= SERVICE CSS AREA ENDS===============*/
/*============= HERO CSS AREA ===============*/
.vl-hero-area {
  overflow: hidden;
  padding-top: 155px;
}

.vl-hero-area .swiper-slide.swiper-slide-active .vl-hero-box {
  transition: transform 1400ms ease, opacity 1400ms ease;
  transform: translateY(0px);
  opacity: 1;
  z-index: 1;
}

.vl-hero-area .swiper-slide.swiper-slide-active .hero-hm1-bg {
  transform: scale(1.2);
}

.vl-hero-area .hero1-bg-slide {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.vl-hero-area .hero1-bg {
  position: relative;
  background-size: cover;
  overflow: hidden;
}

.vl-hero-area .hero1-bg .hero-hm1-bg {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  transform: scale(1);
  transition: transform 8000ms ease, opacity 1800ms ease-in;
}

.vl-hero-area .vl-hero-box {
  margin-top: 108px;
  background: var(--ztc-bg-bg-4);
  border-radius: 16px 16px 0 0;
  transition: transform 1400ms ease, opacity 1400ms ease;
  transform: translateY(900px);
  position: relative;
  opacity: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero-area .vl-hero-box {
    margin-top: 45px;
  }
}

@media (max-width: 575px) {
  .vl-hero-area .vl-hero-box {
    margin-top: 35px;
  }
}

.vl-hero-area .vl-hero-box .vl-hero-box-info {
  padding: 60px 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero-area .vl-hero-box .vl-hero-box-info {
    padding: 40px 40px;
  }
}

@media (max-width: 575px) {
  .vl-hero-area .vl-hero-box .vl-hero-box-info {
    padding: 22px 18px 175px 18px;
  }
}

.vl-hero-area .vl-hero-box .vl-hero-box-info .vl-hero-info-content .item-list {
  display: flex;
  align-items: center;
}

.vl-hero-area .vl-hero-box .vl-hero-box-info .vl-hero-info-content .item-list .item-icons img {
  height: 24px;
  width: 24px;
  margin-right: 8px;
}

.vl-hero-area .vl-hero-box .vl-hero-box-info .vl-hero-info-content .item-list h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 26px;
  margin-top: 3px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero-area .vl-hero-box .vl-hero-box-info .vl-hero-info-content .item-list h2 {
    font-size: 19px;
    line-height: 24px;
  }
}

@media (max-width: 575px) {
  .vl-hero-area .vl-hero-box .vl-hero-box-info .vl-hero-info-content .item-list h2 {
    font-size: 16px;
    line-height: 22px;
  }
}

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

.hero1-arrow {
  position: absolute;
  bottom: 30px;
  right: 30px;
}

.vl-hero2-area {
  background-size: cover;
  overflow: hidden;
  position: relative;
  padding: 245px 0px 140px 0px;
}

@media (max-width: 575px) {
  .vl-hero2-area {
    padding: 120px 0px 50px 0px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero2-area {
    padding: 180px 0px 140px 0px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .hm2-herofixtitle {
    font-size: 54px !important;
  }
}

@media (max-width: 575px) {
  .hm2-herofixtitle {
    font-size: 32px !important;
    line-height: 44px !important;
  }
}

.hm2_heroheader_p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-hero3-area {
  background-size: cover;
  overflow: hidden;
  position: relative;
  padding: 170px 0px 60px 0px;
  z-index: 1;
}

.hero3-heading-area {
  z-index: 9;
  position: relative;
}

.about3-heading-subtitle {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  padding: 10px 14px;
  display: inline-block;
}

.about3-heading-title {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s56);
  font-weight: var(--ztc-weight-bold);
  line-height: 66px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .about3-heading-title {
    font-size: 37px;
    line-height: 46px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about3-heading-title {
    line-height: 46px;
    font-size: 40px;
  }
}

@media (max-width: 575px) {
  .about3-heading-title {
    line-height: 50px;
    font-size: 44px;
  }
}

.hero3-heading-pera {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.hero3-vdo-area {
  display: flex;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero3-vdo-area {
    display: block;
  }
}

.hero3-vdo-popup-area {
  margin-left: 16px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero3-vdo-popup-area {
    margin-top: 20px;
  }
}

.hero3-vdo-popup-area a {
  background: var(--ztc-bg-bg-1);
  height: 52px;
  width: 52px;
  border-radius: 50%;
  display: inline-block;
  line-height: 52px;
  text-align: center;
  margin-right: 8px;
  transition: 0.4s;
}

.hero3-vdo-popup-area a i {
  font-size: 20px;
  color: var(--ztc-text-text-4);
  margin-top: 16px;
}

.hero3-vdo-popup-area span {
  color: #fff;
  font-size: 18px;
  line-height: 18px;
  font-weight: 700;
}

.hero3-rating_review {
  background: var(--ztc-bg-bg-1);
  display: inline-block;
  padding: 10px 12px;
  border-radius: 8px;
}

.hero3-rating_review ul li {
  display: inline-block;
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

@media (max-width: 575px) {
  .hero3-rating_review ul li {
    display: block;
    margin-bottom: 10px;
  }

  .hero3-rating_review ul li:last-child {
    margin-bottom: 0px;
  }
}

.hero3-rating_review ul li img {
  margin: 0px 8px 3px 0px;
}

.hero_hm3_form_area {
  position: relative;
  z-index: 9;
  background: var(--ztc-bg-bg-1);
  padding: 32px 24px;
  border-radius: 16px;
  margin-left: 40px;
  width: 436px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .hero_hm3_form_area {
    width: 384px;
    padding: 32px 18px;
    margin-left: 0px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero_hm3_form_area {
    padding: 32px 16px;
    margin-left: 35px;
    width: 370px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero_hm3_form_area {
    padding: 32px 16px;
    margin-left: 0px;
    width: 350px;
  }
}

@media (max-width: 575px) {
  .hero_hm3_form_area {
    padding: 32px 16px;
    margin-left: 0px;
    margin-top: 30px;
    width: 350px;
  }
}

.hero3-form-area {
  background: var(--ztc-bg-bg-1);
  z-index: 9;
  position: relative;
  padding: 32px 24px;
  border-radius: 16px;
  margin-left: 86px;
  width: 336px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .hero3-form-area {
    margin-left: 40px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero3-form-area {
    margin-left: 74px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .hero3-form-area {
    margin-left: 0px;
  }
}

.hero3-form-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.hero-3-form input {
  border: inherit;
  border-radius: 8px;
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  background: var(--ztc-bg-bg-4);
  padding: 16px 16px;
  width: 100%;
}

.hero-3-form ::-moz-placeholder {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.hero-3-form ::placeholder {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.hero-3-form textarea {
  width: 100%;
  border: inherit;
  border-radius: 8px;
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  background: var(--ztc-bg-bg-4);
  padding: 16px 16px;
  margin-top: 20px;
  height: 140px;
}

.hero-3-form button {
  border: none;
  outline: none;
  width: 100%;
  text-align: center;
}

.blog-select-2 .nice-select {
  background: var(--ztc-bg-bg-4) !important;
}

.vl-hero3-shape-thumb {
  position: absolute;
  z-index: -1;
  top: 140px;
  left: 39%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero3-shape-thumb {
    left: 32%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-hero3-shape-thumb {
    display: none;
  }
}

.vl-hero3-shape-thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 750px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero3-shape-thumb img {
    -o-object-fit: inherit;
    object-fit: inherit;
  }
}

.vl-herohm4 {
  overflow: hidden;
  padding: 100px 40px 0 40px;
}

@media (max-width: 575px) {
  .vl-herohm4 {
    padding: 0px 16px;
  }
}

.vl-herohm4-area {
  border-radius: 30px;
  position: relative;
}

.hero4-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s56);
  font-weight: var(--ztc-weight-bold);
  line-height: 66px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero4-title {
    line-height: 50px;
    font-size: 42px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero4-title {
    line-height: 48px;
    font-size: 40px;
  }
}

@media (max-width: 575px) {
  .hero4-title {
    line-height: 44px;
    font-size: 34px;
  }
}

.hero4_heading_text {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-hero4-btn-area {
  display: flex;
}

.hero4_heading-counter-area {
  display: flex;
}

@media (max-width: 575px) {
  .hero4_heading-counter-area {
    display: block;
  }
}

@media (max-width: 575px) {
  .hero4_heading-counter-content {
    margin-bottom: 12px;
  }
}

.hero4_heading-counter-content h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

.hero4_heading-counter-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero4-thumb {
    text-align: center;
    margin-top: 30px;
  }
}

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

.hero4-thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
  width: 100%;
}

@media (max-width: 575px) {
  .hero4-shape-area {
    display: none;
  }
}

.hero4-shape-area-1 {
  position: absolute;
  right: 0;
  bottom: 0px;
}

@media (max-width: 575px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .hero4-shape-area-1 {
    display: none;
  }
}

.hero4-shape-area-1 img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 212px;
  height: 196px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .hero4-shape-area-1 img {
    width: 190px;
    height: 160px;
    -o-object-fit: inherit;
    object-fit: inherit;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero4-shape-area-1 img {
    width: 150px;
    height: 160px;
    -o-object-fit: inherit;
    object-fit: inherit;
  }
}

.hero4-shape-area-2 {
  position: absolute;
  right: 44%;
  bottom: 96px;
}

.hero4-shape-area-2 img {
  width: 74px;
  height: 88px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero4-shape-area-2 {
    display: none;
  }
}

.hero4-shape-area-3 {
  position: absolute;
  right: 62px;
  top: 84px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero4-shape-area-3 {
    right: 128px;
    top: 500px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero4-shape-area-3 {
    right: 24px;
    top: 32px;
  }
}

.hero4-shape-area-3 img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 106px;
  height: 112px;
}

.aboutus_hero_title h2 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s56);
  font-weight: var(--ztc-weight-bold);
  line-height: 66px;
}

.aboutus_hero_title ul li {
  display: inline-block;
}

.aboutus_hero_title ul li a {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  color: var(--ztc-text-text-1);
}

.aboutus_hero_title ul li img {
  margin: 0 4px;
}

.aboutus_titlefix {
  font-weight: var(--ztc-weight-bold) !important;
}

.vl-herohm5-area {
  background: #d01d49;
  margin-top: 146px;
  padding: 140px 0px;
  position: relative;
  overflow: hidden;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-herohm5-area {
    padding: 100px 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-herohm5-area {
    padding: 100px 0px 500px 0px;
  }
}

@media (max-width: 575px) {
  .vl-herohm5-area {
    margin-top: 98px;
    padding: 50px 0px;
  }
}

.herohm5-info {
  position: relative;
  z-index: 1;
}

.herohm5-heading {
  position: relative;
  z-index: 1;
}

.herohm5-heading .sub-title {
  padding: 10px 14px;
  display: inline-block;
  text-align: center;
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: 500;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
}

@media (max-width: 575px) {
  .herohm5-heading .sub-title {
    font-size: 17px;
  }
}

.herohm5-heading .title {
  color: var(--ztc-text-text-1);
  font-size: 80px;
  line-height: 82px;
  font-weight: var(--ztc-weight-bold);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .herohm5-heading .title {
    font-size: 70px;
    line-height: 76px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm5-heading .title {
    font-size: 59px;
    line-height: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm5-heading .title {
    font-size: 57px;
    line-height: 66px;
  }
}

@media (max-width: 575px) {
  .herohm5-heading .title {
    font-size: 32px;
    line-height: 40px;
  }
}

.herohm5-heading .pera-text {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 26px;
  font-weight: var(--ztc-weight-medium);
}

.hm5-btn-fxr {
  background: var(--ztc-bg-bg-1) !important;
  color: var(--ztc-text-text-6);
}

.hero5-vdo-area {
  display: flex;
  align-items: center;
}

.hm5-rating-fxr {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.1);
}

.hm5-rating-fxr ul li {
  color: var(--ztc-text-text-1);
}

.herohm5-thumb-shape {
  position: absolute;
  top: 16%;
  right: 0%;
  z-index: 1;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .herohm5-thumb-shape {
    right: -4%;
    top: 10%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm5-thumb-shape {
    right: -1%;
  }

  .herohm5-thumb-shape img {
    height: 460px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm5-thumb-shape {
    height: 460px;
    top: 56%;
    right: 12%;
  }
}

@media (max-width: 575px) {
  .herohm5-thumb-shape {
    display: none;
  }
}

.herohm5-bg-shape {
  position: absolute;
  top: 0;
  right: -8%;
}

.herohm5-bg-shape img {
  width: 100%;
  height: 100%;
  transform: rotate(20deg);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .herohm5-bg-shape {
    right: -10%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm5-bg-shape {
    right: -12%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm5-bg-shape {
    display: none;
  }
}

.vl-herohm6-area {
  overflow: hidden;
  position: relative;
  padding: 250px 0px 130px 0px;
  background-size: cover;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-herohm6-area {
    padding: 170px 0px 130px 0px;
  }
}

@media (max-width: 575px) {
  .vl-herohm6-area {
    padding: 170px 0px 60px 0px;
  }
}

.herohm6-info {
  position: relative;
  z-index: 99;
}

.herohm6-heading .title {
  font-size: 90px;
  line-height: 80px;
  font-weight: 700;
  color: #111;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .herohm6-heading .title {
    font-size: 82px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm6-heading .title {
    font-size: 66px;
    line-height: 66px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm6-heading .title {
    font-size: 60px;
    line-height: 60px;
  }
}

@media (max-width: 575px) {
  .herohm6-heading .title {
    font-size: 40px;
    line-height: 46px;
    text-align: center !important;
  }
}

.herohm6-heading .title span {
  color: #111;
  font-size: var(--ztc-font-size-font-s24);
  line-height: 28px;
  font-weight: var(--ztc-weight-medium);
  display: inline-block;
  text-align: right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm6-heading .title span {
    font-size: 20px;
    line-height: 26px;
  }
}

@media (max-width: 575px) {
  .herohm6-heading .title span {
    font-size: 18px;
    line-height: 24px;
    text-align: inherit;
  }
}

.herohm6-heading .title img {
  height: 80px;
  width: 170px;
  border-radius: 999px;
}

@media (max-width: 575px) {
  .herohm6-heading .title img {
    display: none;
  }
}

.herohm6-bottom-info {
  margin-top: 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm6-bottom-info {
    margin-top: 60px;
  }
}

@media (max-width: 575px) {
  .herohm6-bottom-info {
    margin-top: 32px;
  }
}

.herohm6-bottom-info .pera-text {
  color: #555;
  font-size: 18px;
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-herohm6-shape .shape-1 {
  position: absolute;
  left: -8%;
  bottom: -40%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-herohm6-shape .shape-1 {
    left: -12%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-herohm6-shape .shape-1 {
    left: -10%;
    bottom: -36%;
    height: 500px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-herohm6-shape .shape-1 {
    left: -10%;
    bottom: -24%;
    height: 400px;
  }
}

@media (max-width: 575px) {
  .vl-herohm6-shape .shape-1 {
    display: none;
  }
}

.vl-herohm6-shape .shape-2 {
  position: absolute;
  right: 0%;
  bottom: -4%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-herohm6-shape .shape-2 {
    right: -4%;
    bottom: -5%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-herohm6-shape .shape-2 {
    bottom: -2%;
    height: 400px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-herohm6-shape .shape-2 {
    bottom: 0%;
    height: 300px;
  }
}

@media (max-width: 575px) {
  .vl-herohm6-shape .shape-2 {
    display: none;
  }
}

.vl-herohm6-shape .shape-3 {
  position: absolute;
  right: 4%;
  top: 12%;
  height: 300px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-herohm6-shape .shape-3 {
    right: 0%;
    top: 24%;
    height: 250px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-herohm6-shape .shape-3 {
    top: 18%;
    height: 220px;
    right: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-herohm6-shape .shape-3 {
    display: none;
  }
}

.herohm6-btn {
  position: relative;
  color: var(--ztc-text-text-1);
  display: inline-block;
  padding: 16px 22px;
  background: var(--ztc-bg-bg-3);
  border-radius: 99px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  border: 1px solid rgba(22, 26, 45, 0.3);
  box-shadow: 0 -4px 6px 0 rgba(22, 26, 45, 0.38) inset, 0 4px 6px 0 rgba(255, 255, 255, 0.48) inset;
  z-index: 1;
  transition: 0.3s;
}

.herohm6-btn:hover {
  transform: translateY(-4px);
  color: var(--ztc-text-text-1);
  transition: 0.4s;
}

.herohm6-btn::after {
  position: absolute;
  content: "";
  background: var(--ztc-bg-bg-2);
  left: 0;
  right: 0;
  border-radius: 99px;
  height: 100%;
  width: 100%;
  top: 0;
  transform: scaleX(0);
  transition: 0.4s;
  z-index: -1;
}

.herohm6-btn:hover::after {
  transform: scaleX(1);
}

.vl-herohm7-area {
  background: var(--ztc-bg-bg-6);
  margin: 88px 0px 0px 0px !important;
  padding: 100px 0px;
  position: relative;
  overflow: hidden;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-herohm7-area {
    margin-top: 82px !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-herohm7-area {
    padding-bottom: 560px;
  }
}

@media (max-width: 575px) {
  .vl-herohm7-area {
    padding: 130px 0px 140px 0px;
    margin: 0 !important;
  }
}

.hero7-vdo-pop {
  margin-top: 0px;
}

.hero7-vdo-pop a {
  background: var(--ztc-bg-bg-3);
}

.hero7-vdo-pop a i {
  color: var(--ztc-text-text-1);
}

.herohm7-thumb {
  position: absolute;
  right: 0;
  top: 6%;
  z-index: 2;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm7-thumb {
    right: -4%;
  }

  .herohm7-thumb img {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm7-thumb {
    height: 500px;
    top: 53%;
    right: 16%;
  }
}

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

.herohm7-thumb-bg {
  position: absolute;
  right: 0;
  top: 8%;
  z-index: 1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm7-thumb-bg {
    right: -4%;
  }

  .herohm7-thumb-bg img {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm7-thumb-bg {
    height: 500px;
    top: 54%;
    right: 15%;
  }
}

@media (max-width: 575px) {
  .herohm7-thumb-bg {
    display: none;
  }
}

.herohm7-element1 {
  position: absolute;
  bottom: -18%;
  right: 26%;
  z-index: 3;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .herohm7-element1 {
    bottom: -12%;
    right: 44%;
  }
}

@media (max-width: 575px) {
  .herohm7-element1 {
    right: 24%;
  }

  .herohm7-element1 img {
    height: 270px;
  }
}

.herohm7-bg-line {
  position: absolute;
  top: 0;
  right: -8%;
}

.herohm7-bg-line img {
  width: 100%;
  height: 100%;
  transform: rotate(16deg);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .herohm7-bg-line {
    right: -12%;
  }

  .herohm7-bg-line img {
    transform: rotate(27deg);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .herohm7-bg-line {
    display: none;
  }
}

.vl-hero8-area {
  margin: 88px 0px 0px 0px;
  background: var(--ztc-bg-bg-4);
  overflow: hidden;
  padding: 60px 0px 170px 0px;
  position: relative;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero8-area {
    margin: 80px 0px 0px 0px;
    padding: 0px 0px 102px 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero8-area {
    padding: 0px 0px 600px 0px;
  }
}

@media (max-width: 575px) {
  .vl-hero8-area {
    padding: 42px 0px 430px 0px;
  }
}

.vl-hero8-top-text {
  text-align: center;
}

.vl-hero8-top-text h2 {
  color: rgba(0, 0, 0, 0.06);
  font-size: 240px;
  line-height: 244px;
  font-weight: var(--ztc-weight-bold);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero8-top-text h2 {
    font-size: 208px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero8-top-text h2 {
    font-size: 156px;
  }
}

@media (max-width: 575px) {
  .vl-hero8-top-text h2 {
    font-size: 76px;
    line-height: 154px;
  }
}

.vl-hero8-heading-area h3 {
  color: var(--ztc-text-text-12);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  padding: 10px 14px;
  display: inline-block;
}

@media (max-width: 575px) {
  .vl-hero8-heading-area h3 {
    font-size: 17px;
  }
}

.vl-hero8-heading-area h2 {
  color: var(--ztc-text-text-12);
  font-size: var(--ztc-font-size-font-s70);
  font-weight: var(--ztc-weight-bold);
  line-height: 72px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-hero8-heading-area h2 {
    font-size: 65px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero8-heading-area h2 {
    font-size: 54px;
    line-height: 60px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero8-heading-area h2 {
    line-height: 60px;
    font-size: 50px;
  }
}

@media (max-width: 575px) {
  .vl-hero8-heading-area h2 {
    line-height: 42px;
    font-size: 32px;
  }
}

.vl-hero8-heading-area p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-hero8-heading-area p {
    font-size: 17px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero8-heading-area p {
    font-size: 17px;
    line-height: 24px;
  }
}

.vl-hero8-header-btn {
  display: flex;
  align-items: center;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .vl-hero8-header-btn {
    display: block;
  }
}

.vl-hero8-header-btn .btn_hm8 {
  margin-left: 16px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .vl-hero8-header-btn .btn_hm8 {
    margin-left: 0px;
    margin-top: 16px;
  }
}

.hero8-thumb {
  position: absolute;
  right: 14%;
  top: 12%;
  height: 730px;
  width: 650px;
  z-index: 1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero8-thumb {
    right: 4%;
    top: 18%;
  }

  .hero8-thumb img {
    height: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero8-thumb {
    right: 4%;
    top: 52%;
  }

  .hero8-thumb img {
    height: 600px;
  }
}

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

.hero8-thumb-bg {
  position: absolute;
  right: 16%;
  top: 42%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .hero8-thumb-bg {
    right: 20%;
  }

  .hero8-thumb-bg img {
    height: 220px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero8-thumb-bg {
    right: 21%;
  }

  .hero8-thumb-bg img {
    height: 180px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero8-thumb-bg {
    right: 25%;
    top: 70%;
  }

  .hero8-thumb-bg img {
    height: 180px;
  }
}

@media (max-width: 575px) {
  .hero8-thumb-bg {
    display: none;
  }
}

.hero8-circle-content {
  position: absolute;
  right: 6%;
  bottom: 42%;
  z-index: 1;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero8-circle-content {
    right: 10%;
    bottom: 45%;
  }
}

@media (max-width: 575px) {
  .hero8-circle-content {
    right: 36%;
    bottom: 30%;
  }
}

.hero8-circle-content .hero8-circle {
  background: var(--ztc-bg-bg-3);
  border-radius: 50%;
  display: inline-block;
  padding: 6px;
  position: relative;
}

.hero8-circle-content .hero8-circle a .arrow-hm8 {
  position: absolute;
  left: 40%;
  right: 50%;
  top: 40%;
  bottom: 50%;
}

.hero8-clients-content {
  position: absolute;
  right: 1%;
  bottom: 18%;
  z-index: 99;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero8-clients-content {
    bottom: 12%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero8-clients-content {
    right: 2%;
    bottom: 26%;
  }
}

@media (max-width: 575px) {
  .hero8-clients-content {
    right: 18%;
    bottom: 10%;
  }
}

.hero8-clients-content h2 a {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: 700;
}

.star_icon_hm8 ul li {
  height: 24px;
  width: 24px;
  line-height: 24px;
  background: var(--ztc-bg-bg-1);
  text-align: center;
  border-radius: 2px;
}

.vl-hero9-area {
  overflow: hidden;
  margin: 88px 0px 0px 0px;
  padding: 100px 0px;
  position: relative;
  background-size: cover;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero9-area {
    margin: 0px;
    padding: 100px 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-hero9-area {
    margin: 0px;
    padding: 100px 0px 40px 0px;
  }
}

.vl-hero9-header h3 {
  color: var(--ztc-text-text-12);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  padding: 10px 14px;
  display: inline-block;
}

@media (max-width: 575px) {
  .vl-hero9-header h3 {
    font-size: 17px;
  }
}

.vl-hero9-header h2 {
  color: var(--ztc-text-text-12);
  font-size: var(--ztc-font-size-font-s70);
  font-weight: var(--ztc-weight-bold);
  line-height: 72px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero9-header h2 {
    line-height: 58px;
    font-size: 48px;
  }
}

@media (max-width: 575px) {
  .vl-hero9-header h2 {
    font-size: 32px;
    line-height: 40px;
  }
}

.vl-hero9-header p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-hero9-header p br {
    display: none;
  }
}

.hero9-thumb img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 30px;
}

.vl-hero9_arrow {
  display: flex;
  justify-content: center;
  margin-top: 44px;
}

.vl-hero9_arrow .hero_arrow_slider1 {
  margin-right: 12px;
}

.hero9-shape-area .shape-1 {
  position: absolute;
  top: 22%;
  left: 4%;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero9-shape-area .shape-1 {
    top: 36%;
    left: 2%;
    height: 80px;
  }
}

@media (max-width: 575px) {
  .hero9-shape-area .shape-1 {
    display: none;
  }
}

.hero9-shape-area .shape-2 {
  position: absolute;
  bottom: 10%;
  right: 4%;
}

.vl_10_slider_area {
  overflow: hidden;
}

.vl-hero10-area {
  overflow: hidden;
  position: relative;
  background: var(--ztc-bg-bg-3);
  padding: 150px 0px 60px 0px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero10-area {
    padding: 150px 0px 700px 0px;
  }
}

@media (max-width: 575px) {
  .vl-hero10-area {
    padding: 150px 0px 530px 0px;
  }
}

.hero10-counter-area {
  position: relative;
  margin-top: 44px;
  z-index: 9;
}

.hero10-counter-fix {
  width: 1px;
  height: 80px;
  background-color: #E6EBED;
  margin: 0px 32px 0px 32px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hero10-counter-fix {
    margin: 0px 16px 0px 16px;
  }
}

@media (max-width: 575px) {
  .hero10-counter-fix {
    display: none;
  }
}

.header10_images {
  position: absolute;
  top: 0%;
  right: 0%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header10_images {
    right: -8%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header10_images {
    right: -22%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header10_images {
    top: 52%;
  }

  .header10_images img {
    width: 770px;
    height: 730px;
    -o-object-fit: cover;
    object-fit: cover;
  }
}

@media (max-width: 575px) {
  .header10_images {
    top: 66%;
  }
}

.header10_shape {
  position: absolute;
  bottom: 0%;
  left: 0%;
  z-index: 7;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header10_shape {
    left: -6%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header10_shape {
    left: -19%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .header10_shape {
    display: none;
  }
}

.home10-arrow {
  position: absolute;
  right: 32px;
  bottom: 80px;
  z-index: 99;
}

.header10_element {
  position: absolute;
  right: -70%;
  bottom: -188%;
  z-index: 1;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .header10_element {
    right: -94%;
    bottom: -189%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header10_element {
    right: -70%;
    bottom: -80%;
  }
}

@media (max-width: 575px) {
  .header10_element {
    right: -30%;
    bottom: -26%;
  }
}

/*============= HERO CSS AREA ===============*/
/*============= MOBILE MENU CSS AREA ===============*/
.vl-header-action-item {
  float: right;
  border: 1px solid var(--ztc-text-text-2);
  padding: 6px;
  border-radius: 4px;
  color: var(--ztc-text-text-2);
}

.vl-header-action-item button {
  border: none;
  outline: none;
  background: none;
  transition: all 0.4s;
  color: var(--ztc-text-text-2);
  font-size: var(--ztc-font-size-font-s20);
}

.vl-offcanvas {
  position: fixed;
  background: var(--ztc-bg-bg-3);
  width: 450px;
  z-index: 999999;
  right: 0;
  top: 0;
  padding: 50px 40px;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transform: translateX(100%);
  transition: 0.3s;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}

@media only screen and (max-width: 450px) {
  .vl-offcanvas {
    width: 100%;
  }
}

.vl-offcanvas-open {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.vl-offcanvas-close-toggle {
  font-size: var(--ztc-font-size-font-s30);
  color: var(--vl-heading-color);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-offcanvas-header {
    margin-bottom: 40px;
  }
}

.vl-offcanvas-title {
  font-size: 35px;
  color: var(--ztc-text-text-1);
}

.vl-offcanvas-info span a {
  display: block;
  color: var(--ztc-text-text-1);
  margin-bottom: 10px;
}

.vl-offcanvas-info span a i {
  margin: 0 4px 0 0;
}

.vl-offcanvas-sm-title {
  font-size: var(--ztc-font-size-font-s24);
  color: var(--ztc-text-text-1);
}

.vl-offcanvas-social a {
  display: inline-block;
  text-align: center;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 40px;
  color: var(--ztc-text-text-1);
  border: 1px solid var(--ztc-text-text-1);
  font-size: 14px;
}

.vl-offcanvas-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  width: 100%;
  height: 100%;
  visibility: hidden;
  opacity: 0;
  transition: 0.45 easc-in-out;
  background: rgba(24, 24, 24, 0.4);
}

.vl-offcanvas-overlay-open {
  opacity: 0.7;
  visibility: visible;
}

.vl-offcanvas .vl-offcanvas-logo {
  height: 50px;
  width: 164px;
  -o-object-fit: contain;
  object-fit: contain;
}

.vl-offcanvas .vl-offcanvas-close button {
  border: none;
  background: none;
  outline: none;
  color: var(--ztc-text-text-1);
}

.vl-offcanvas-menu ul {
  list-style: none;
}

.vl-offcanvas-menu ul li {
  position: relative;
}

.vl-offcanvas-menu ul li a {
  padding: 8px 0;
  display: block;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.vl-offcanvas-menu ul li a span {
  display: block;
}

.vl-offcanvas-menu ul li>a {
  border-bottom: none;
}

.vl-offcanvas-menu ul li.active>a {
  color: var(--ztc-text-text-1);
}

.vl-offcanvas-menu ul li.active>.vl-menu-close i {
  transform: rotate(90deg);
}

.vl-offcanvas-menu ul li .sub-menu {
  display: none;
  padding-left: 20px;
}

.vl-menu-close {
  position: absolute;
  right: 0;
  top: 7px;
  border: 1px solid var(--ztc-text-text-1);
  height: 30px;
  width: 30px;
  text-align: center;
  font-size: 12px;
  line-height: 25px;
  background: transparent;
  color: var(--ztc-text-text-1);
  border-radius: 4px;
}

.vl-menu-close i {
  transition: 0.3s;
}

.vl-header-action-item-hm7 {
  border: 1px solid #fff;
}

.vl-offcanvas-toggle-hm7 {
  color: var(--ztc-text-text-1) !important;
}

/*============= MOBILE MENU CSS AREA ===============*/
/*============= BLOG CSS AREA ===============*/
.vl-blog2-area {
  overflow: hidden;
}

.vl-blog2-box {
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-blog2-box {
    margin-bottom: 20px;
  }
}

@media (max-width: 575px) {
  .vl-blog2-box {
    padding: 8px;
  }
}

.vl-blog2-box:hover .view_services i {
  transform: rotate(0deg);
  transition: all 0.4s;
}

.vl-blog2-box:hover .text_decoration {
  text-decoration: underline;
  transition: all 0.4s;
}

.vl-blog2-box-thumb {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
}

.vl-blog2-box-thumb-img img {
  width: 100%;
  height: 450px;
  border-radius: 16px;
  transition: 0.4s;
  -o-object-fit: cover;
  object-fit: cover;
}

.vl-blog2-box-thumb-info {
  position: absolute;
  bottom: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(0, 51, 78, 0) 0%, #00334E 82.67%);
  width: 100%;
  height: 100%;
  border-radius: 16px;
}

.vl-blog2-box-thumb-info-content {
  bottom: 30px;
  position: absolute;
  left: 22px;
  right: 22px;
}

.vl-blog2-box-thumb:hover .vl-blog2-box-thumb-img img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s;
}

.vl-blog3-area {
  position: relative;
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .blog3-box {
    margin-bottom: 20px;
  }
}

.blog3-box:hover .learn_more {
  color: var(--ztc-text-text-5);
}

.blog3-box:hover .learn_more i {
  transform: rotate(0deg);
}

.blog3-box-img img {
  width: 100%;
  height: 350px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px;
}

.blog3-box h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .blog3-box h3 a {
    font-size: 19px;
    transition: 0.4s;
  }
}

.blog3-box h3 a:hover {
  color: var(--ztc-text-text-4);
  transition: 0.4s;
}

.blog3-box-meta ul li {
  display: inline-block;
}

.blog3-box-meta ul li a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog3-box-meta ul li a {
    font-size: 17px;
  }
}

@media (max-width: 575px) {
  .blog3-box-meta ul li a {
    font-size: 16px;
  }
}

.blog3-box-meta ul li a svg {
  margin: -4px 8px 0 0;
}

.blog3-box-meta ul li span {
  margin: 0 8px;
  color: #CCD6DC;
}

.vl-blog4-area {
  overflow: hidden;
  padding: 100px 40px 100px;
}

@media (max-width: 575px) {
  .vl-blog4-area {
    padding: 50px 16px 50px;
  }
}

.blog4-thumb-area-img img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 420px;
  border-radius: 16px 16px 0px 0px;
}

.blog4-thumb-img-content {
  padding: 32px 32px;
  transition: 0.4s;
  border-radius: 0px 0px 16px 16px;
}

@media (max-width: 575px) {
  .blog4-thumb-img-content {
    padding: 32px 18px;
  }
}

.blog4-thumb-img-content:hover {
  background: var(--ztc-text-text-1);
  transition: 0.4s;
}

.blog4-thumb-img-content:hover .btn-6 a {
  color: var(--ztc-text-text-1);
  background: #d01d49;
  border: none;
  transition: all 0.4s;
}

.title_blog4 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  font-weight: var(--ztc-weight-bold);
  line-height: 42px;
}

.title_blog4-2 a {
  font-size: var(--ztc-font-size-font-s24);
  line-height: 32px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .title_blog4-2 a {
    font-size: 23px;
  }
}

.text_blog4 {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.blog4-thumb-content {
  padding: 28px 28px;
  border-radius: 16px;
  border: 1px solid #E6EBED;
  transition: all 0.4s;
  margin-bottom: 24px;
}

@media (max-width: 575px) {
  .blog4-thumb-content {
    padding: 28px 18px;
  }
}

.blog4-thumb-content:last-child {
  margin-bottom: 0px;
}

.blog4-thumb-content:hover {
  background: var(--ztc-bg-bg-1);
  transition: all 0.4s;
}

.blog4-thumb-content:hover .btn-6 a {
  color: var(--ztc-text-text-1);
  background: #d01d49;
  border: none;
  transition: all 0.4s;
  border: 1px solid #d01d49;
}

.vl-blog_right-details {
  overflow: hidden;
}

.vl-blog_inner_box {
  overflow: hidden;
}

.vl-blogleft-thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 20px;
}

.vl-blog-meta-list {
  padding-top: 16px;
  border-top: 1px solid #E7E7E7;
  margin-top: 40px;
  margin-bottom: 16px;
  border-bottom: 1px solid #E7E7E7;
}

.vl-blog-meta-list ul li {
  display: inline-block;
  margin-right: 16px;
  padding-right: 16px;
  margin-bottom: 16px;
  position: relative;
}

@media (max-width: 575px) {
  .vl-blog-meta-list ul li {
    display: block;
  }
}

.vl-blog-meta-list ul li:first-child::after {
  top: 11px;
}

.vl-blog-meta-list ul li::after {
  position: absolute;
  content: "";
  right: 0;
  top: 4px;
  height: 16px;
  width: 2px;
  background: #9FAFB7;
}

@media (max-width: 575px) {
  .vl-blog-meta-list ul li::after {
    display: none;
  }
}

.vl-blog-meta-list ul li:last-child::after {
  display: none;
}

.vl-blog-meta-list ul li a {
  color: var(--vkl-text-text-3);
  font-size: var(--vkl-font-size-font-s16);
  line-height: var(--vkl-specing-height16);
  font-weight: var(--vkl-weight-medium);
}

.vl-blog-meta-list ul li a span img.auth-thumb {
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50px;
  margin-right: 8px;
}

.vl-blog-meta-list ul li a span img.icon {
  margin-top: -4px;
  margin-right: 4px;
}

.vl-wallex-tags {
  display: flex;
  align-items: center;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-wallex-tags {
    display: block !important;
  }
}

.vl-wallex-tags .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
  margin-right: 8px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-wallex-tags .title {
    font-size: 21px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-wallex-tags .title {
    padding-bottom: 20px;
  }
}

.vl-wallex-tags ul li {
  display: inline-block;
}

.vl-wallex-tags ul li a {
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  border: 1px solid #E6EBED;
  display: inline-block;
  padding: 8px 12px;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  color: var(--ztc-text-text-5);
  font-weight: var(--ztc-weight-bold);
  transition: 0.3s;
  margin-right: 10px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-wallex-tags ul li a {
    margin-right: 6px;
    font-size: 16px;
  }
}

.vl-wallex-tags ul li a:hover {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  transition: 0.3s;
}

.vl-blog-share {
  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),
(max-width: 575px) {
  .vl-blog-share {
    justify-content: start;
  }
}

.vl-blog-share .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
  transition: 0.3s;
  margin-right: 8px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-blog-share .title {
    font-size: 22px;
  }
}

@media (max-width: 575px) {
  .vl-blog-share .title {
    font-size: 20px;
  }
}

.vl-blog-share ul li {
  display: inline-block;
}

.vl-blog-share ul li a {
  background: var(--ztc-bg-bg-4);
  height: 32px;
  width: 32px;
  display: inline-block;
  line-height: 32px;
  border-radius: 50px;
  color: var(--ztc-text-text-5);
  text-align: center;
  transition: 0.3s;
  margin-left: 8px;
}

.vl-blog-share ul li a:hover {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-bg-bg-1);
  transition: 0.3s;
}

.bloginner_comment {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
}

.comment__box__wrap {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  padding: 24px 32px;
}

@media (max-width: 575px) {
  .comment__box__wrap {
    padding: 24px 14px;
  }
}

.comment__box__wrap .main-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.comment__box__wrap .main-flex .comment__box__wrap-flex {
  display: flex;
  align-items: center;
}

.comment__box__wrap .main-flex .comment__box__wrap-flex-thumb span img {
  margin-right: 16px;
}

.comment__box__wrap .main-flex .comment__box__wrap-flex-content h4 a {
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
  transition: 0.3s;
  color: var(--ztc-text-text-5);
}

.comment__box__wrap .main-flex .comment__box__wrap-flex-content h4 a:hover {
  color: var(--ztc-text-text-3);
  transition: 0.3s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .comment__box__wrap .main-flex .comment__box__wrap-flex-content h4 a {
    font-size: var(--ztc-font-size-font-s22);
    line-height: 34px;
  }
}

@media (max-width: 575px) {
  .comment__box__wrap .main-flex .comment__box__wrap-flex-content h4 a {
    font-size: var(--ztc-font-size-font-s20);
    line-height: 30px;
  }
}

.comment__box__wrap .main-flex .comment__box__wrap-flex-content a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 26px;
  font-weight: var(--ztc-weight-medium);
}

.comment__box__wrap .main-flex .vl-reply-flex a {
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-bold);
  font-family: var(--vkl-family-font1);
  display: inline-block;
  transition: 0.3s;
  margin-right: 8px;
  color: var(--ztc-text-text-5);
}

.comment__box__wrap .main-flex .vl-reply-flex a:hover {
  color: var(--ztc-text-text-4);
  transition: 0.3s;
}

.comment__box__wrap p {
  margin-top: 16px;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 26px;
  font-weight: var(--ztc-weight-medium);
}

.comment__form__wrap {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  padding: 32px;
}

.comment__form__wrap .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
}

.comment__form__wrap p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 26px;
  font-weight: var(--ztc-weight-medium);
}

.blog-comment-form input[type=text],
.blog-comment-form input[type=email],
.blog-comment-form input[type=number],
.blog-comment-form textarea {
  border: inherit;
  border-radius: 8px;
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  background: var(--ztc-bg-bg-1);
  padding: 16px 16px;
  width: 100%;
}

.blog-comment-form input[type=text]::-moz-placeholder,
.blog-comment-form input[type=email]::-moz-placeholder,
.blog-comment-form input[type=number]::-moz-placeholder,
.blog-comment-form textarea::-moz-placeholder {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.blog-comment-form input[type=text]::placeholder,
.blog-comment-form input[type=email]::placeholder,
.blog-comment-form input[type=number]::placeholder,
.blog-comment-form textarea::placeholder {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.blog-comment-form textarea {
  width: 100%;
  height: 160px;
}

.blog-select .nice-select {
  border: none;
  background: var(--ztc-bg-bg-1);
  height: 56px;
  line-height: 56px;
  border-radius: 8px;
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
}

.blog-select .nice-select::after {
  height: 10px;
  margin-top: -6px;
  right: 14px;
  width: 10px;
}

.more-vlog-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

/*============= BLOG CSS AREA ENDS ===============*/
/*============= FOOTER CSS AREA ===============*/
.footer1 {
  overflow: hidden;
  background: var(--ztc-bg-bg-4);
  padding: 260px 0px 32px 0px;
  margin-top: -200px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .footer1 .footer-area-gallery {
    margin-top: 20px;
  }
}

@media (max-width: 575px) {
  .footer1 .footer-area-gallery {
    margin-top: 20px;
  }
}

.footer1 .footer-area-gallery h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.footer1 .footer-area-gallery .footer-img {
  margin-bottom: 10px;
}

.footer1 .footer-area-gallery .footer-img:hover {
  transform: rotateY(-360deg);
  transition: all 1s;
}

.footer1 .footer-area-gallery .footer-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 8px;
  transform: rotateY(0deg);
}

.footer1 .footer-subscribe h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.footer1 .footer-subscribe form {
  position: relative;
}

.footer1 .footer-subscribe form input {
  background: var(--ztc-text-text-1);
  border-radius: 8px;
  width: 100%;
  height: 52px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  padding-left: 16px;
}

.footer1 .footer-subscribe form input::-moz-placeholder {
  color: var(--ztc-text-text-6);
  opacity: 0.8;
}

.footer1 .footer-subscribe form input::placeholder {
  color: var(--ztc-text-text-6);
  opacity: 0.8;
}

.footer1 .footer-subscribe form .sub_arrow {
  position: absolute;
  top: 6px;
  right: 14px;
  background: var(--ztc-bg-bg-3);
  height: 36px;
  width: 36px;
  text-align: center;
  line-height: 38px;
  transform: rotate(-45deg);
  border-radius: 50%;
  border: none;
}

.footer1 .footer-subscribe form .sub_arrow i {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
}

.footer1 .footer-mobile-area {
  display: flex;
  justify-content: space-between;
  margin: 25px 0px 0px 25px;
}

@media (max-width: 575px) {
  .footer1 .footer-mobile-area {
    display: block;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .footer1 .footer-mobile-area {
    margin: 25px 0px 0px 0px;
  }
}

@media (max-width: 575px) {
  .footer1 .footer-mobile-area-info {
    margin-bottom: 18px;
  }
}

.footer1 .footer-mobile-area-info h4 {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.footer1 .footer-mobile-area-info a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer1 .footer-mobile-area-info a {
    font-size: 17px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area-logo {
    margin-bottom: 20px;
  }
}

.footer-area-logo img {
  -o-object-fit: cover;
  object-fit: cover;
}

.footer-area-logo p {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-area-logo p {
    font-size: 17px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-area-logo p br {
    display: none;
  }
}

.social_link li {
  display: inline-block;
  margin: 0 6px 0 0;
}

.social_link li a {
  height: 40px;
  width: 40px;
  text-align: center;
  line-height: 42px;
  border-radius: 50%;
  background: var(--ztc-bg-bg-1);
  display: inline-block;
  font-size: var(--ztc-font-size-font-s18);
  transition: all 0.4s;
  color: var(--ztc-text-text-2);
}

.social_link li a:hover {
  background: var(--ztc-bg-bg-3);
}

.social_link li a:hover i {
  color: var(--ztc-text-text-1);
}

.social_link li a i {
  color: var(--ztc-text-text-5);
  transition: all 0.4s;
}

.social_link-hm2 li a {
  background: var(--ztc-bg-bg-4);
}

.footer-widget-area {
  margin-left: 35px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget-area {
    margin-left: 85px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .footer-widget-area {
    margin-left: 0px;
  }
}

@media (max-width: 575px) {
  .footer-widget-area {
    margin-top: 20px;
  }
}

.footer-widget-area h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.footer-widget-area ul li {
  margin-bottom: 18px;
}

.footer-widget-area ul li:last-child {
  margin-bottom: 0px;
}

.footer-widget-area ul li a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  display: inline-block;
  transition: all 0.4s;
}

.footer-widget-area ul li a:hover {
  margin-left: 5px;
  color: var(--ztc-text-text-4);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget-hour-hm4 {
    left: 0 !important;
  }
}

.footer-widget-hour {
  position: relative;
  left: -70px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-widget-hour {
    margin-top: 20px;
    left: 0;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-widget-hour {
    margin-left: -75px;
    margin-right: 40px;
    left: 0;
  }
}

@media (max-width: 575px) {
  .footer-widget-hour {
    margin-top: 20px;
    left: 0;
  }
}

.footer-widget-hour h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.footer-widget-hour ul {
  background: var(--ztc-bg-bg-1);
  border-radius: 16px;
  padding: 4px 16px;
  box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
}

.footer-widget-hour ul li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 18px;
  border-bottom: 1px solid #DDDAE7;
  padding-top: 18px;
}

.footer-widget-hour ul li:last-child {
  border-bottom: none;
}

.footer-widget-hour ul li span .f-date {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.footer-widget-hour ul li span a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.footer1-copyright-area {
  text-align: center;
  padding-top: 24px;
  border-top: 1px solid #CCD4E0;
}

.footer1-copyright-area a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

@media (max-width: 575px) {
  .footer1-copyright-area a {
    font-size: 16px;
  }
}

.footer1_bottom_fixer {
  margin-top: 50px;
}

.vl-footer2-area {
  padding: 80px 0px 32px 0px;
  overflow: hidden;
}

.footer-wid-hour-hm2 {
  background: var(--ztc-bg-bg-4) !important;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-widget-contact {
    margin-top: 20px;
  }
}

.footer-widget-contact h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.footer-widget-contact ul li {
  margin-bottom: 18px;
}

.footer-widget-contact ul li:last-child {
  margin-bottom: 0px;
}

.footer-widget-contact ul li a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  display: inline-block;
}

.footer-widget-contact ul li a svg {
  margin-right: 6px;
}

.vl-footer4 {
  overflow: hidden;
  padding: 0px 40px;
}

@media (max-width: 575px) {
  .vl-footer4 {
    padding: 0px 18px;
  }
}

.vl-footer4-area-fixxer {
  padding: 48px 32px;
}

@media (max-width: 575px) {
  .vl-footer4-area-fixxer {
    padding: 48px 0px;
  }
}

.vl-footer4-area {
  background-color: var(--ztc-bg-bg-1);
  border-radius: 30px 30px 0px 0px;
}

.vl-footer4-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 80px 40px 40px 40px;
  border-bottom: 1px solid rgba(0, 51, 78, 0.1);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-footer4-wrap {
    display: block;
  }
}

@media (max-width: 575px) {
  .vl-footer4-wrap {
    padding: 30px 0px 40px 0px;
  }
}

.footer4-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer4-title {
    line-height: 42px;
    font-size: 38px;
  }
}

.footer4-mail_area form {
  display: inline-block;
  position: relative;
}

.footer4-mail_area form input {
  background: var(--ztc-bg-bg-7);
  border-radius: 111px;
  width: 490px;
  height: 70px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  padding-left: 16px;
  color: var(--ztc-text-text-5);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer4-mail_area form input {
    width: 400px;
  }
}

@media (max-width: 575px) {
  .footer4-mail_area form input {
    width: 316px;
  }
}

.footer4-mail_area form input::-moz-placeholder {
  color: var(--ztc-text-text-5);
}

.footer4-mail_area form input::placeholder {
  color: var(--ztc-text-text-5);
}

.vl-footer4-subscribe {
  position: absolute;
  top: 10px;
  right: 8px;
}

/*============= FOOTER CSS AREA ===============*/
/*============= HEADER CSS AREA ===============*/
body {
  font-family: var(--ztc-family-font1);
}

.homepage1-body .vl-header-area {
  padding: 20px 0px;
  position: relative;
  z-index: 99;
}

.homepage1-body .vl-header-area .header-top-area {
  visibility: visible;
  opacity: 1;
  transition: all 0.4s;
}

@media (max-width: 575px),
only screen and (min-width: 576px) and (max-width: 767px) {
  .homepage1-body .vl-header-area .header-top-area {
    display: none;
  }
}

.homepage1-body .vl-header-area .header-top-area .header-top-main {
  display: flex;
  justify-content: space-between;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-location li a {
  color: var(--ztc-text-text-3);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-location li a svg {
  margin: -4px 4px 0 0;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-phn-area .header-phn-mail {
  color: var(--ztc-text-text-3);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-phn-area .header-phn-mail svg {
  margin: -2px 4px 0 0;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-phn-area .header-top-line {
  color: var(--ztc-text-text-3);
  font-size: var(--ztc-font-size-font-s18);
  opacity: 0.1;
  margin: 0 8px 0px 50px;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-phn-area .header-phn-num {
  color: var(--ztc-text-text-3);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.homepage1-body .vl-header-area .header-top-area .header-top-main .header-phn-area .header-phn-num svg {
  margin: -4px 4px 0 0;
}

.homepage2-body {
  position: absolute;
  top: 0;
  z-index: 99999;
  left: 0;
  right: 0;
}

.hm2_header_fixxer {
  background: var(--ztc-bg-bg-1);
  padding: 8px 0px;
  border-radius: 8px;
}

.vl-header-wrap-fixxer {
  display: flex;
  align-items: center;
  justify-content: end;
}

.hm3_line span {
  color: #E6EBED;
  margin: 0px 8px;
  font-size: 22px;
}

.hm5_header_fixxer {
  border-radius: 99px;
  padding: 16px;
}

.headerhm7-area {
  background: var(--ztc-text-text-11) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.vl-mobile-menu-active-hm7 ul li a {
  color: var(--ztc-text-text-1) !important;
}

.vl-mobile-menu-active-hm7 ul li a:hover {
  color: #d01d49 !important;
  transition: 0.4s;
}

.hp3_line span {
  color: #fff;
  opacity: 0.1;
}

.sub-menu-hm7 {
  background: var(--ztc-bg-bg-6) !important;
}

.headerhm8-area {
  background: var(--ztc-bg-bg-4);
}

.search-btn {
  background: inherit;
  border: none;
  cursor: pointer;
  outline: none;
  width: 40px;
  height: 40px;
}

.search-btn img {
  width: 24px;
  height: 24px;
}

/* Popup container */
.popup-search {
  display: none;
  /* Hidden by default */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 400px;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.popup-search::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  background: var(--ztc-bg-bg-2);
  opacity: 90%;
  z-index: -1;
}

/* Search box */
.popup-search input[type=text] {
  padding: 10px;
  width: 600px;
  font-size: 16px;
  background: #F0F0FA;
  border-radius: 5px;
  padding: 19px 16px;
  color: var(--ztc-bg-bg-2);
}

.popup-search input[type=text]::-moz-placeholder {
  color: var(--ztc-bg-bg-2);
}

.popup-search input[type=text]::placeholder {
  color: var(--ztc-bg-bg-2);
}

.top_search_btn_area {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.top_search_btn_area .vl-btn3 {
  border: none;
  outline: none;
  position: absolute;
  right: 6px;
  top: 6px;
}

/* Close button */
.close-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
  background: var(--ztc-bg-bg-3);
  height: 60px;
  width: 60px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
}

/*============= HEADER CSS AREA ENDS ===============*/
/*============= HEADER CSS AREA ENDS ===============*/
.homepage1-body .vl-transparent-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999999;
  padding: 0;
}

@media (max-width: 575px) {
  .homepage1-body .vl-transparent-header {
    background: var(--ztc-bg-bg-1);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .homepage1-body .vl-transparent-header {
    background: var(--ztc-bg-bg-1);
  }
}

.homepage1-body .vl-transparent-header .vl-logo img {
  width: 220px;
  -o-object-fit: contain;
  object-fit: contain;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn {
  display: flex;
  align-items: center;
  justify-content: end;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .search-icon a {
  position: relative;
  z-index: 1;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .search-icon a img {
  margin: 0 36px 0 0;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .search-icon a::after {
  position: absolute;
  content: "";
  height: 28px;
  width: 2px;
  right: 20px;
  background: #DADFE4;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .vl-btn-wrap {
  display: flex;
  align-items: center;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .vl-btn-wrap span.icons {
  height: 50px;
  width: 50px;
  text-align: center;
  line-height: 50px;
  display: inline-block;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-3);
  border-radius: 50%;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .vl-btn-wrap span.text {
  padding-left: 10px;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .vl-btn-wrap span.text span {
  color: var(--ztc-text-text-2);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s16);
  font-style: normal;
  font-weight: var(--ztc-weight-medium);
  line-height: 16px;
  /* 100% */
  display: block;
  transition: all 0.4s;
  opacity: 80%;
  text-align: start;
  padding-bottom: 8px;
}

.homepage1-body .vl-transparent-header .vl-hero-btn .head-btn .vl-btn-wrap span.text a {
  color: var(--ztc-text-text-2);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s20);
  font-style: normal;
  font-weight: var(--ztc-weight-medium);
  line-height: 20px;
  display: inline-block;
  transition: all 0.4s;
}

.homepage1-body .vl-main-menu ul {
  text-align: center;
}

.homepage1-body .vl-main-menu ul>li {
  display: inline-block;
  position: relative;
}

.homepage1-body .vl-main-menu ul>li .span-arrow {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}

.homepage1-body .vl-main-menu ul>li a.nav-link.active {
  color: var(--ztc-text-text-2);
  background: none;
  opacity: 70%;
}

.homepage1-body .vl-main-menu ul>li>a {
  color: var(--ztc-text-text-5);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  display: inline-block;
  position: relative;
  transition: 0.4s;
  padding: 0 16px;
  font-weight: var(--ztc-weight-medium);
}

.homepage1-body .vl-main-menu ul>li:hover a {
  color: var(--ztc-text-text-4);
}

.homepage1-body .vl-main-menu ul>li .sub-menu {
  position: absolute;
  top: 201%;
  width: 220px;
  left: 0;
  background: var(--ztc-bg-bg-1);
  padding: 12px 20px 24px;
  opacity: 0;
  visibility: hidden;
  box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
  transition: 0.4s;
  border-radius: 4px;
  transform-origin: top;
  transform: scale(1, 0);
}

.homepage1-body .vl-main-menu ul>li .sub-menu::after {
  position: absolute;
  content: "";
  height: 2px;
  left: 0;
  width: 100%;
  background: var(--ztc-bg-bg-3);
  top: 0;
}

.homepage1-body .vl-main-menu ul>li .sub-menu.menu1 {
  top: 20% !important;
}

.homepage1-body .vl-main-menu ul>li .sub-menu li {
  margin-right: 0;
  display: block;
  text-align: start;
}

.homepage1-body .vl-main-menu ul>li .sub-menu li a {
  color: var(--ztc-text-text-2);
  display: inline-block;
  font-size: var(--ztc-font-size-font-s18);
  position: relative;
  z-index: 1;
  padding: 12px 0 0 0;
  font-weight: var(--ztc-weight-medium);
}

.homepage1-body .vl-main-menu ul>li .sub-menu li a::after {
  position: absolute;
  content: "";
  height: 2px;
  width: 0;
  transition: all 0.4s;
  left: 0;
  bottom: 0;
  background: var(--ztc-bg-bg-3);
  z-index: 1;
}

.homepage1-body .vl-main-menu ul>li .sub-menu li a:hover::after {
  width: 50%;
  transition: all 0.4s;
}

.homepage1-body .vl-main-menu ul>li .sub-menu li a:before {
  display: none;
}

.homepage1-body .vl-main-menu ul>li .sub-menu li .sub-menu {
  left: 100%;
  top: 201%;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
  transform-origin: top;
  transform: scale(1, 0);
}

.homepage1-body .vl-main-menu ul>li .sub-menu li:hover>a {
  color: var(--ztc-text-text-4);
}

.homepage1-body .vl-main-menu ul>li .sub-menu li:hover>.sub-menu {
  opacity: 1;
  visibility: visible;
  top: 201%;
  transform: scale(1);
}

.homepage1-body .vl-main-menu ul>li:hover a {
  color: var(--ztc-text-text-4);
}

.homepage1-body .vl-main-menu ul>li:hover .sub-menu {
  opacity: 1;
  visibility: visible;
  top: 201%;
  transform: scale(1);
  transition: all 0.4s;
}

.homepage1-body .vl-main-menu ul>li:hover .vl-mega-menu {
  opacity: 1;
  visibility: visible;
  transition: 0.3s;
  top: 184%;
  transform: scale(1);
}

.homepage1-body .vl-mega-menu {
  position: absolute;
  left: -275px;
  top: 100px;
  width: 1300px;
  background: #fff;
  padding: 25px 25px 5px 25px;
  box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  top: 201.3%;
  transform: scale(1, 0);
  transform-origin: top;
  border-radius: 4px;
  overflow: hidden;
  height: 600px;
  overflow-y: scroll;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .homepage1-body .vl-mega-menu {
    width: auto;
    opacity: 1;
    visibility: visible;
    transition: none;
    position: static;
    display: none;
    transform: scale(1);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .homepage1-body .vl-mega-menu {
    left: -162px;
    width: 1030px;
  }
}

.homepage1-body .vl-home-thumb {
  position: relative;
  z-index: 1;
  margin-bottom: 20px;
}

.homepage1-body .vl-home-thumb img {
  box-shadow: 0px 2px 6px rgba(1, 15, 28, 0.2);
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 4px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .homepage1-body .vl-home-thumb img {
    -o-object-fit: cover;
    object-fit: cover;
  }
}

.homepage1-body .vl-home-thumb .img1 {
  position: relative;
  z-index: 1;
}

.homepage1-body .vl-home-thumb .img1::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  left: 0;
  transition: all 0.4s;
  top: 0;
  background: var(--ztc-text-text-2);
  border-radius: 4px;
  transform: scale(0.8);
  visibility: hidden;
  opacity: 0;
}

.homepage1-body .vl-home-thumb .btn-area1 {
  position: absolute;
  top: 20%;
  left: 50%;
  transition: all 0.6s;
  visibility: hidden;
  opacity: 0;
  z-index: 2;
  margin-top: -43px;
  margin-left: -70px;
}

@media (max-width: 575px) {
  .homepage1-body .vl-home-thumb .btn-area1 {
    margin-top: -50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .homepage1-body .vl-home-thumb .btn-area1 {
    margin-top: -43px;
  }
}

.homepage1-body .vl-home-thumb .btn-area1 .vl-btn1 {
  color: var(--ztc-text-text-1) !important;
  font-size: var(--ztc-font-size-font-s18);
  text-transform: uppercase;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  display: inline-block;
  transition: all 0.6s;
  background: var(--ztc-bg-bg-3);
  padding: 18px 24px;
  border-radius: 8px;
  position: relative;
  z-index: 1;
}

.homepage1-body .vl-home-thumb .btn-area1 .vl-btn1::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 0;
  transition: all 0.6s;
  right: 0;
  top: 0;
  transition: all 0.4s;
  background: var(--ztc-bg-bg-2);
  z-index: -1;
  border-radius: 8px;
}

.homepage1-body .vl-home-thumb .btn-area1 .vl-btn1 i {
  margin-left: 4px;
  transform: rotate(-45deg);
  transition: all 0.4s;
}

.homepage1-body .vl-home-thumb .btn-area1 .vl-btn1:hover {
  transition: all 0.4s;
  transform: translateY(-10px);
  color: var(--ztc-text-text-1);
}

.homepage1-body .vl-home-thumb .btn-area1 .vl-btn1:hover::after {
  width: 100%;
  transition: all 0.6s;
  left: 0;
  right: inherit;
}

.homepage1-body .vl-home-thumb .btn-area1 .vl-btn1:hover i {
  transform: rotate(0);
  transition: all 0.4s;
}

.homepage1-body .vl-home-thumb a {
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-semibold);
  color: var(--ztc-text-text-2) !important;
  transition: all 0.4s;
  display: block;
  padding-top: 16px;
  text-align: center;
  font-family: var(--ztc-family-font1);
}

.homepage1-body .vl-home-thumb a:hover {
  color: var(--ztc-text-text-4) !important;
  transition: all 0.4s;
}

.homepage1-body .vl-home-thumb:hover .btn-area1 {
  visibility: visible;
  opacity: 1;
  transition: all 0.6s;
  top: 50%;
}

.homepage1-body .vl-home-thumb:hover .img1::after {
  transform: scale(1);
  transition: all 0.4s;
  visibility: visible;
  opacity: 0.8;
}

.homepage1-body .header-sticky {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
  background: var(--ztc-bg-bg-1);
  border-bottom: 1px solid #dfe1e2;
}

.homepage1-body .header-sticky.fade-white-bg-2.homepage_4__padding {
  padding: 16px;
}

.homepage1-body .header-sticky .hm5_header_fixxer {
  padding: 0;
}

.homepage1-body .header-sticky .hm2_header_fixxer {
  padding: 0;
}

.homepage1-body .header-sticky .header-top-area {
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s;
  height: 0;
}

.homepage1-body .header-sticky .space16 {
  display: none;
}

.headerhm7-area.header-sticky {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
  background: #00334E;
  border-bottom: 1px solid #00334E;
}

@keyframes vlfadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-100%);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.vlfadeInDown {
  animation: vlfadeInDown 1s ease-out forwards;
}

.homepage_4__padding {
  padding: 0 40px;
}

.homepage_4__padding .header-sticky {
  padding: 16px !important;
}

/*============= HEADER CSS AREA ENDS ===============*/
/*============= WORK CSS AREA ===============*/
.work1-area {
  overflow: hidden;
  z-index: 1;
  position: relative;
  background: var(--ztc-bg-bg-5);
}

.work1-area .work1-contentbox {
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  padding: 24px 24px;
  position: relative;
  transition: all 0.4s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .work1-area .work1-contentbox {
    margin-bottom: 40px;
  }
}

.work1-area .work1-contentbox:hover {
  background: var(--ztc-bg-bg-3);
}

.work1-area .work1-contentbox:hover .work1-box-text h2 a {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.work1-area .work1-contentbox:hover .work1-box-text p {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.work1-area .work1-contentbox:hover .work1-box-icon img {
  filter: brightness(0) invert(1);
}

.work1-area .work1-contentbox:hover .work1-box-topshape {
  transform: rotateY(-360deg);
  transition: all 1s;
}

.work1-area .work1-contentbox .work1-box-icon img {
  height: 50px;
  width: 50px;
  transition: all 0.4s;
}

.work1-area .work1-contentbox .work1-box-text h2 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
  transition: all 0.4s;
}

.work1-area .work1-contentbox .work1-box-text P {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
  transition: all 0.4s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .work1-area .work1-contentbox .work1-box-text P {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .work1-area .work1-contentbox .work1-box-text P br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .work1-area .work1-contentbox .work1-box-text P {
    font-size: 16px;
  }
}

.work1-area .work1-contentbox .work1-box-topshape {
  position: absolute;
  top: -30px;
  right: 20px;
}

.work1-area .work1-contentbox .work1-box-topshape h2 {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 58px;
  display: inline-block;
  width: 60px;
  height: 60px;
  text-align: center;
  border-radius: 100%;
  border: 3px solid #fff;
  transform: rotateY(0deg);
}

.vl-work2-area {
  overflow: hidden;
  background: var(--ztc-bg-bg-5);
}

.vl-work2-area .vl-work2-banner {
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 16px 16px;
  border-radius: 16px;
  transition: 0.4s;
}

.vl-work2-area .vl-work2-banner:hover {
  background: rgba(255, 255, 255, 0.2);
  margin-top: 10px;
}

.vl-work2-area .vl-work2-banner-img img {
  border-radius: 16px;
  width: 100%;
  height: 400px;
  -o-object-fit: cover;
  object-fit: cover;
}

.vl-work2-area .vl-work2-banner-content h3 a {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-work2-area .vl-work2-banner-content h3 a {
    font-size: 22px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-work2-area .vl-work2-banner-content h3 a {
    font-size: 21px;
  }
}

.vl-work2-area .vl-work2-banner-content p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-work3-area {
  overflow: hidden;
  background: var(--ztc-bg-bg-4);
  position: relative;
  z-index: 1;
}

.work3-shape {
  position: absolute;
  top: 0;
  left: 0;
}

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

.work3-shape img {
  width: 260px;
  height: 260px;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .work3-shape img {
    width: 150px;
    height: 150px;
    -o-object-fit: inherit;
    object-fit: inherit;
  }
}

.vl-work3-items-box {
  background: var(--ztc-bg-bg-1);
  display: flex;
  padding: 22px 20px;
  border-radius: 8px;
  transition: 0.4s;
}

@media (max-width: 575px) {
  .vl-work3-items-box {
    display: block;
  }
}

.vl-work3-items-box:hover {
  background: var(--ztc-bg-bg-3);
  transition: 0.4s;
}

.vl-work3-items-box:hover .work3-icons {
  background: rgba(255, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  transition: all 0.4s;
}

.vl-work3-items-box:hover .work3-icons img {
  filter: brightness(0) invert(1);
  transition: all 0.4s;
}

.vl-work3-items-box:hover .work3-minitop h5 {
  background: var(--ztc-bg-bg-1);
  transition: all 0.4s;
  color: var(--ztc-bg-bg-3);
}

.vl-work3-items-box:hover .vl-work3-items-box-content h4 a {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.vl-work3-items-box:hover .vl-work3-items-box-content p {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.vl-work3-items-box:hover .work3-minitop {
  transform: rotateY(-360deg);
  transition: all 0.7s;
}

.vl-work3-items-box-icons {
  position: relative;
  display: inline-block;
  margin-right: 30px;
}

@media (max-width: 575px) {
  .vl-work3-items-box-icons {
    margin-bottom: 16px;
  }
}

.vl-work3-items-box-icons .work3-icons {
  background: var(--ztc-bg-bg-4);
  height: 100px;
  width: 100px;
  border-radius: 100%;
  text-align: center;
  line-height: 100px;
  position: relative;
  transition: all 0.4s;
}

.vl-work3-items-box-icons .work3-icons img {
  height: 45px;
  width: 45px;
  filter: brightness(0) invert(0);
  transition: all 0.4s;
}

.vl-work3-items-box-icons .work3-minitop {
  position: absolute;
  top: 0;
  right: 0;
}

.vl-work3-items-box-icons .work3-minitop h5 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s16);
  font-weight: var(--ztc-weight-bold);
  background: var(--ztc-bg-bg-3);
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  border-radius: 100%;
  transition: all 0.4s;
}

.vl-work3-items-box-content h4 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  transition: all 0.4s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-work3-items-box-content h4 a {
    font-size: 20px;
  }
}

.vl-work3-items-box-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
  transition: all 0.4s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-work3-items-box-content p {
    font-size: 17px;
  }
}

.vl-work3-thumb1 {
  text-align: right;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-work3-thumb1 {
    margin-top: 20px;
  }
}

.vl-work3-thumb1 img {
  width: 470px;
  height: 420px;
  border-radius: 16px;
}

.vl-work3-thumb2 {
  margin-top: -130px;
}

.vl-work3-thumb2 img {
  width: 420px;
  height: 370px;
  border: 10px solid #F0F0FA;
  border-radius: 16px;
}

/*============= WORK CSS AREA ===============*/
/*============= OTHERS CSS AREA STARTS ===============*/
.preloader {
  position: fixed;
  background: var(--ztc-bg-bg-2);
  left: 0;
  top: 0;
  z-index: 99999999999;
  width: 100%;
  height: 100%;
}

.preloader .loader {
  width: 70px;
  padding: 8px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--ztc-bg-bg-1);
  --_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  animation: l3 1s infinite linear;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -35px;
  margin-top: -35px;
  height: 70px;
}

@keyframes l3 {
  to {
    transform: rotate(1turn);
  }
}

.progress-wrap {
  position: fixed;
  right: 30px;
  bottom: 30px;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  border-radius: 50px;
  box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.1);
  z-index: 10000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: all 200ms linear;
  color: var(--ztc-text-text-1);
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.progress-wrap::after {
  position: absolute;
  font-family: "FontAwesome";
  content: "\f062";
  text-align: center;
  line-height: 56px;
  font-size: 18px;
  color: var(--ztc-text-text-2);
  left: 0;
  top: 0;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  z-index: 1;
  transition: all 200ms linear;
}

.progress-wrap:hover::after {
  opacity: 0;
  color: var(--ztc-text-text-2);
}

.progress-wrap::before {
  position: absolute;
  font-family: "FontAwesome";
  content: "\f062";
  text-align: center;
  line-height: 56px;
  font-size: 18px;
  opacity: 0;
  left: 0;
  top: 0;
  height: 56px;
  width: 56px;
  cursor: pointer;
  display: block;
  z-index: 2;
  transition: all 200ms linear;
}

.progress-wrap:hover::before {
  opacity: 1;
  color: var(--ztc-text-text-2);
}

.progress-wrap svg path {
  fill: none;
}

.progress-wrap svg.progress-circle path {
  stroke: var(--ztc-text-text-2);
  stroke-width: 4;
  box-sizing: border-box;
  transition: all 200ms linear;
}

.progress-wrap.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.vl-hero2-bottom {
  margin-top: -252px;
  z-index: 999;
  position: relative;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-hero2-bottom {
    margin-left: -150px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-hero2-bottom {
    margin-top: -180px;
  }
}

@media (max-width: 575px) {
  .vl-hero2-bottom {
    margin-top: 20px;
  }
}

.hero2-box {
  background: var(--ztc-bg-bg-3);
  width: 470px;
  height: 280px;
  border-radius: 16px;
  padding: 48px 40px;
}

@media (max-width: 575px) {
  .hero2-box {
    width: 100%;
    height: 100%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero2-box {
    width: 438px;
    height: 232px;
    padding: 20px 38px;
  }
}

.hero2-box-content h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s28);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
}

.hero2-box-content p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.hero2-box-phn {
  display: flex;
}

.hero2-box-phn:hover-logo {
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.hero2-box-phn-logo {
  background: var(--ztc-bg-bg-1);
  display: inline;
  padding: 16px 16px;
  border-radius: 50%;
  margin-right: 16px;
  transition: all 0.4s;
}

.hero2-box-phn-num h4 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.hero2-box-phn-num a {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.vl-others4-area {
  overflow: hidden;
  padding: 100px 40px 0;
}

@media (max-width: 575px) {
  .vl-others4-area {
    padding: 50px 16px 0;
  }
}

.offer-box {
  background: var(--ztc-bg-bg-1);
  border-radius: 16px;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.09);
  padding: 32px 28px;
  position: relative;
  transition: all 0.4s;
}

@media (max-width: 575px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .offer-box {
    margin-bottom: 20px;
  }
}

.offer-box:hover {
  background: var(--ztc-bg-bg-3);
  transition: all 0.4s;
}

.offer-box:hover h4 {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.offer-box:hover .offer-box-title {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.offer-box:hover .offer-box-circel-img img {
  filter: brightness(0) invert(1);
  transition: all 0.4s;
}

.offer-box:hover .offer-box-circel-img h4 {
  color: var(--ztc-text-text-5);
}

.offer-box:hover .btn4-4 {
  background: var(--ztc-bg-bg-1);
  border: none;
  transition: all 0.4s;
}

.offer-box:hover .box-shape {
  opacity: 1;
  transition: 0.4s;
}

.offer-box h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  transition: all 0.4s;
}

.offer-box .offer-box-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
  transition: all 0.4s;
  position: relative;
  z-index: 9;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .offer-box .offer-box-title {
    font-size: 18px;
  }
}

.offer-box-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.offer-box-circel {
  position: relative;
}

.offer-box-circel-img img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 80px;
  height: 80px;
  filter: brightness(0) invert(0);
  transition: all 0.4s;
}

.offer-box-circel-img h4 {
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  position: absolute;
  color: #fff;
  top: 50%;
  margin-top: -21px;
  left: 50%;
  margin-left: -20px;
  text-align: center;
  transition: all 0.4s;
}

.box-shape {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: 0.4s;
}

.box-shape img {
  height: 230px;
  width: 230px;
}

.vl-other8-area {
  overflow: hidden;
  background: var(--ztc-bg-bg-3);
  padding: 32px 0px;
  margin: -82px 36px 0px 36px;
  border-radius: 8px;
  position: relative;
  z-index: 99;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-other8-area {
    margin: -82px 16px 0px 16px;
  }
}

.other8-list-area {
  display: flex;
  align-items: center;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .other8-list-area {
    display: block;
  }
}

.other8-list-area .list_heading {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s32);
  line-height: 32px;
  font-weight: var(--ztc-weight-bold);
  margin-right: 40px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .other8-list-area .list_heading {
    margin: 0px 0px 16px 0px;
  }
}

@media (max-width: 575px) {
  .other8-list-area .list_heading {
    font-size: 28px;
    margin: 0px 0px 16px 0px;
  }
}

.other8-list-area ul li {
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  color: var(--ztc-text-text-1);
  display: inline-block;
  margin-right: 24px;
}

.other8-list-area ul li img {
  height: 24px;
  width: 24px;
  margin: 0px 8px 2px 0px;
}

@media (max-width: 575px) {
  .other8-list-area ul li {
    margin-bottom: 6px;
  }
}

.other8-form {
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 16px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .other8-form {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

@media (max-width: 575px) {
  .other8-form {
    grid-template-columns: 1fr;
  }
}

.other8-form .other8-form-text {
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.1);
  display: flex;
  align-items: center;
  padding: 10px;
}

.other8-form .other8-form-text input {
  color: rgba(255, 255, 255, 0.9);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  width: 100%;
}

.other8-form .other8-form-text input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.9);
}

.other8-form .other8-form-text input::placeholder {
  color: rgba(255, 255, 255, 0.9);
}

.other8-form .other8-form-text textarea {
  color: rgba(255, 255, 255, 0.9);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 7px;
  font-weight: var(--ztc-weight-medium);
  width: 100%;
  resize: inherit;
}

.other8-form .other8-form-text textarea::-moz-placeholder {
  color: rgba(255, 255, 255, 0.9);
}

.other8-form .other8-form-text textarea::placeholder {
  color: rgba(255, 255, 255, 0.9);
}

.other8-form .other8-form-text img {
  height: 24px;
  width: 24px;
  margin: 0px 4px 2px 0px;
}

/*============= OTHERS CSS AREA ENDS ===============*/
/*============= HEADER SEARCH CSS AREA STARTS ===============*/
.header-search-container form input {
  outline: none;
  border: none;
  background: none;
  font-family: var(--ztc-family-font1);
  font-weight: 500;
}

.header-search-form-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 400px;
  z-index: 9999999999;
  background-color: var(--ztc-bg-bg-1);
  transform: translate3d(0, -100%, 0);
  transition: transform 0.85s cubic-bezier(0.175, 1, 0.275, 1), visibility 0.8s step-end;
}

.header-search-form-wrapper.open {
  transition: transform 0.85s cubic-bezier(0.175, 1, 0.275, 1), visibility 0.8s step-start;
  transform: translate3d(0, 0, 0);
}

.header-search-form-wrapper .search-form {
  margin: 0 auto;
  position: relative;
  text-align: center;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.header-search-form-wrapper .search-form input[type=search] {
  height: 65px;
  line-height: 65px;
  font-size: 28px;
  background-color: transparent;
  text-align: left;
  border: none;
  border-bottom: 1px solid #dddbdb;
  padding-left: 0;
  border-radius: 0;
  width: 100%;
  color: var(--ztc-text-text-2);
}

.header-search-form-wrapper .search-form input[type=search]::-moz-placeholder {
  color: #a4a4a4;
  opacity: 1;
}

.header-search-form-wrapper .search-form input[type=search]::placeholder {
  color: #a4a4a4;
  opacity: 1;
}

.header-search-form-wrapper .search-form input[type=search]:-ms-input-placeholder {
  color: #a4a4a4;
}

.header-search-form-wrapper .search-form input[type=search]::-ms-input-placeholder {
  color: #a4a4a4;
}

.header-search-form-wrapper .search-submit {
  position: absolute;
  height: 50px;
  width: 50px;
  bottom: 0;
  right: 0;
  background-color: transparent;
  color: #9F9F9F;
  font-size: 24px;
  border: none;
  color: #2B495A;
}

.header-search-form-wrapper .tx-search-close {
  background: rgba(204, 204, 204, 0.2705882353);
  width: 54px;
  height: 54px;
  border-width: 18px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  line-height: 54px;
  text-align: center;
  cursor: pointer;
  font-size: 30px;
}

.header-search-form-wrapper .tx-search-close::before,
.header-search-form-wrapper .tx-search-close::after {
  background-color: var(--ztc-bg-bg-2);
}

.header-search-container {
  width: 100%;
  height: 100%;
  max-width: 1170px;
  border: 0;
  padding: 0;
  background: 0 0;
  transform: translate3d(0, calc(100% - 100px), 0);
  transition: transform 0.85s cubic-bezier(0.175, 1, 0.275, 1);
  margin: auto;
  opacity: 0;
  visibility: hidden;
}

.header-search-form-wrapper.open .header-search-container {
  transform: translate3d(0, 0, 0);
  opacity: 1;
  visibility: visible;
}

/*============= ERROR CSS AREA ENDS ===============*/
/*============= ERROR CSS AREA ENDS ===============*/
/*============= TEAM CSS AREA ===============*/
.vl-team2-area {
  overflow: hidden;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .team__three__wrap {
    margin-bottom: 20px;
  }
}

.team__three__wrap-thumb {
  overflow: hidden;
  position: relative;
}

.team__three__wrap-thumb img {
  height: 310px;
  -o-object-fit: cover;
  object-fit: cover;
  transition: 0.3s;
  border-radius: 16px 16px 0px 0px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .team__three__wrap-thumb img {
    height: 100%;
  }
}

.team__three__wrap-thumb-social {
  background: #fff;
  height: 150px;
  width: 150px;
  border-radius: 100%;
  position: absolute;
  left: 0;
  bottom: -75px;
  right: 0;
  margin: 0 auto;
}

.team__three__wrap-thumb-social ul li {
  display: inline-block;
  height: 44px;
  width: 44px;
  line-height: 44px;
  border-radius: 50px;
  display: inline-block;
  text-align: center;
}

.team__three__wrap-thumb-social ul li a {
  background: var(--ztc-bg-bg-1);
  height: 44px;
  width: 44px;
  line-height: 48px;
  border-radius: 50px;
  display: inline-block;
  text-align: center;
  color: var(--ztc-text-text-5);
  transition: 0.3s;
  font-size: var(--ztc-font-size-font-s20);
}

.team__three__wrap-thumb-social ul li a:hover {
  color: var(--ztc-text-text-1);
  background: var(--ztc-text-text-4);
  transition: 0.3s;
}

.team__three__wrap-thumb-social ul li:nth-child(1) a {
  display: inline-block;
  border-radius: 50px;
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  transition: 0.3s;
  z-index: 1;
}

.team__three__wrap-thumb-social ul li:nth-child(2) {
  display: inline-block;
  border-radius: 50px;
  position: absolute;
  left: -50px;
  top: 20px;
  transform: translateX(63px);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

.team__three__wrap-thumb-social ul li:nth-child(3) {
  display: inline-block;
  border-radius: 50px;
  position: absolute;
  left: -9px;
  top: 13px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

.team__three__wrap-thumb-social ul li:nth-child(4) {
  display: inline-block;
  border-radius: 50px;
  position: absolute;
  left: 22px;
  top: 0px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

.team__three__wrap-thumb-social ul li:nth-child(5) {
  display: inline-block;
  border-radius: 50px;
  position: absolute;
  left: 53px;
  top: 12px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

.team__three__wrap-thumb-social ul li:nth-child(6) {
  display: inline-block;
  border-radius: 50px;
  position: absolute;
  left: 61px;
  top: 25px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 0;
  visibility: hidden;
}

.team__three__wrap:hover .team3_box_content {
  background: var(--ztc-bg-bg-3);
  transition: all 0.4s;
}

.team__three__wrap:hover .team3_box_content_title a {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.team__three__wrap:hover .team3_box_content span {
  color: var(--ztc-text-text-1);
  transition: all 0.4s;
}

.plusminus {
  display: none;
  transition: 0.3s;
}

.team__three__wrap:hover .plusminus {
  display: block;
  line-height: 40px;
  transition: 0.3s;
}

.team__three__wrap:hover .plusicon {
  display: none;
  transition: 0.3s;
}

.team__three__wrap:hover .team__three__wrap-thumb-social ul li:nth-child(2) {
  transform: translateX(0px);
  transition: 0.3s;
  opacity: 1;
  visibility: visible;
}

.team__three__wrap:hover .team__three__wrap-thumb-social ul li:nth-child(3) {
  left: -13px;
  top: -37px;
  transform: translateX(0px);
  transition: 0.3s;
  opacity: 1;
  visibility: visible;
}

.team__three__wrap:hover .team__three__wrap-thumb-social ul li:nth-child(4) {
  left: 22px;
  top: -55px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 1;
  visibility: visible;
}

.team__three__wrap:hover .team__three__wrap-thumb-social ul li:nth-child(5) {
  left: 90px;
  top: -34px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 1;
  visibility: visible;
}

.team__three__wrap:hover .team__three__wrap-thumb-social ul li:nth-child(6) {
  left: 128px;
  top: 21px;
  transform: translateX(30px);
  transition: 0.3s;
  opacity: 1;
  visibility: visible;
}

.team3_box_content {
  padding: 28px;
  background: var(--ztc-bg-bg-4);
  border-radius: 0px 0px 16px 16px;
  transition: 0.4s;
}

.team3_box_content_title a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  transition: 0.4s;
}

.team3_box_content span {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  transition: 0.4s;
}

.vl-team-details-area {
  overflow: hidden;
}

.vl-team_inner_wrap {
  overflow: hidden;
  padding: 100px 0px 40px 0px;
}

.team-details-area {
  border-radius: 8px;
  padding: 32px 28px;
}

@media (max-width: 575px) {
  .team-details-area {
    padding: 26px 8px;
  }
}

.team-details-inner-thumb-img img {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  height: 520px;
  border-radius: 8px;
}

@media (max-width: 575px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .team-details-inner-thumb-img img {
    height: 100%;
  }
}

.title_bio-details {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  font-weight: var(--ztc-weight-bold);
  line-height: 32px;
}

.text_bio-details {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.team-details-star_rating {
  display: flex;
  align-items: center;
}

.team-details-star_rating span {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s16);
  font-weight: var(--ztc-weight-medium);
  line-height: 16px;
}

.team-details-area-info {
  display: flex;
  align-items: center;
}

@media (max-width: 575px) {
  .team-details-area-info {
    display: block;
  }
}

.team-details-area-info h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

@media (max-width: 575px) {
  .team-details-area-info h3 {
    margin-bottom: 16px;
  }
}

.team-details-area-info a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.team-details-widget-title h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  font-weight: var(--ztc-weight-bold);
  line-height: 32px;
}

.team-details-widget-title p {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.team-details-widget-tags h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.team-details-tags a {
  color: var(--ztc-text-text-5);
  background: var(--ztc-bg-bg-4);
  padding: 12px 16px;
  border-radius: 8px;
  display: inline-block;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  transition: 0.4s;
  margin-right: 16px;
}

.team-details-tags a:hover {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  transition: 0.4s;
}

.team-details-title_section h3 {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.team-details-title_section p {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .team-details-title_section p {
    font-size: 17px;
  }
}

.team-details-contact-from h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  font-weight: var(--ztc-weight-bold);
  line-height: 32px;
}

.team-details-contact-from ul li a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.team-details-contact-from ul li a svg {
  line-height: 10px;
  margin: 0px 8px 2px 0px;
}

.team-details-contact-from ul li a span {
  margin: 0px 12px 0px;
}

.contact-form form {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  padding: 16px 14px;
  display: inline-block;
  width: 100%;
}

.contact-form form input {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.contact-form form ::-moz-placeholder {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.contact-form form ::placeholder {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.msg-form {
  width: 100%;
}

.contact-form input {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  padding: 16px 14px;
  display: inline-block;
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  width: 100%;
}

.contact-form ::-moz-placeholder {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.contact-form ::placeholder {
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.contact-form textarea {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  color: var(--ztc-text-text-11);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  padding: 16px 14px;
  width: 100%;
  height: 190px;
}

/*============= TEAM CSS AREA STARTS ===============*/
/*============= FAQ CSS AREA ===============*/
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .aboutus_faq_title {
    font-size: 42px !important;
  }
}

.vl-aboutus_faq-area {
  overflow: hidden;
}

.aboutus_faq-area-thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 8px;
  width: 100%;
  height: 320px;
}

/*============= FAQ CSS AREA ===============*/
.vl-faq-inner .vl-accordion-item {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  border-radius: 8px;
  margin-bottom: 20px;
}

.vl-faq-inner .vl-accordion-item .accordion-button {
  color: var(--ztc-text-text-1);
}

.vl-faq-inner .vl-accordion-item .accordion-button.collapsed {
  border-radius: 8px;
  background: var(--ztc-bg-bg-1);
  color: var(--ztc-text-text-5);
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.08);
}

.vl-faq-inner .vl-accordion-item .accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
  font-size: 1rem;
  color: var(--bs-accordion-btn-color);
  text-align: left;
  background-color: rgba(255, 255, 255, 0);
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  transition: var(--bs-accordion-transition);
  padding: 24px 20px;
  font-size: 20px;
  line-height: 20px;
  font-weight: 700;
  color: var(--ztc-text-text-2);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .vl-faq-inner .vl-accordion-item .accordion-button {
    font-size: 17px;
  }
}

.vl-faq-inner .vl-accordion-item .accordion-button:focus {
  box-shadow: none;
}

.vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) {
  box-shadow: inherit;
}

.vl-faq-inner .vl-accordion-item .accordion-body {
  padding: 24px 20px;
  padding-top: 0;
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
}

.vl-faq-inner .vl-accordion-item .accordion-body-2 {
  font-weight: 500;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .vl-faq-inner .vl-accordion-item .accordion-body br {
    display: none;
  }
}

.vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  color: var(--vkl-text-text-white);
  padding-bottom: 18px;
}

.vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) span.vl-faqarrow {
  background: var(--ztc-bg-bg-1);
  color: var(--ztc-text-text-4);
  height: 30px;
  width: 30px;
  line-height: 35px;
  border-radius: 50px;
  text-align: center;
  position: absolute;
  right: 25px;
}

@media (max-width: 575px) {
  .vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) span.vl-faqarrow {
    right: 2px;
  }
}

.vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) span.vl-faqarrow-2 {
  height: 48px;
  width: 48px;
  line-height: 52px;
  transform: rotate(-180deg);
  transition: 0.4s;
}

@media (max-width: 575px) {
  .vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) span.vl-faqarrow-2 {
    height: 36px;
    width: 36px;
    line-height: 40px;
  }
}

.vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) span.vl-faqarrow-3 {
  background: none;
  color: var(--ztc-text-text-1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-faq-inner .vl-accordion-item .accordion-button:not(.collapsed) span.vl-faqarrow-3 {
    right: -5px;
  }
}

.vl-faq-inner .vl-accordion-item .accordion-body .para:not(.collapsed) {
  color: var(--ztc-text-text-1);
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}

.vl-faq-inner .vl-accordion-item span.vl-faqarrow {
  background: var(--ztc-text-text-4);
  color: var(--ztc-bg-bg-1);
  height: 30px;
  width: 30px;
  line-height: 35px;
  border-radius: 50px;
  text-align: center;
  position: absolute;
  right: 25px;
}

@media (max-width: 575px) {
  .vl-faq-inner .vl-accordion-item span.vl-faqarrow {
    right: 2px;
  }
}

.vl-faq-inner .vl-accordion-item span.vl-faqarrow-2 {
  height: 48px;
  width: 48px;
  line-height: 55px;
  transition: 0.4s;
}

@media (max-width: 575px) {
  .vl-faq-inner .vl-accordion-item span.vl-faqarrow-2 {
    height: 36px;
    width: 36px;
    line-height: 40px;
  }
}

.vl-faq-inner .vl-accordion-item span.vl-faqarrow-3 {
  color: var(--ztc-text-text-5);
  background: none;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-faq-inner .vl-accordion-item span.vl-faqarrow-3 {
    right: -5px;
  }
}

.vl-faq-inner .accordion-button::after {
  display: none;
}

.vl-faq_inner-area {
  overflow: hidden;
}

.faq_title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

@media (max-width: 575px) {
  .faq_title {
    font-size: 38px;
  }
}

.faq_inner_option ul {
  border: 1px solid #E6EBED;
  border-radius: 8px;
  display: inline-block;
  padding: 16px 16px;
}

.faq_inner_option ul li {
  display: inline-block;
  margin-right: 16px;
}

.faq_inner_option ul li a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  background: var(--ztc-bg-bg-4);
  padding: 12px 24px;
  border-radius: 8px;
  display: inline-block;
  transition: 0.4s;
}

.faq_inner_option ul li a:hover {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  transition: 0.4s;
}

/*============= CONTACT CSS AREA ===============*/
.vl-contacthm3-left_area {
  padding-right: 140px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-contacthm3-left_area {
    padding-right: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-contacthm3-left_area {
    padding-right: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-contacthm3-left_area {
    padding-right: 200px;
  }
}

@media (max-width: 575px) {
  .vl-contacthm3-left_area {
    padding-right: 0px;
  }
}

.vl-contact3-area {
  background: var(--ztc-bg-bg-5);
  overflow: hidden;
}

.contact3-work_hour {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ztc-text-text-1);
}

.contact3-work_hour h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.contact3-work_hour ul li {
  display: inline-block;
  margin: 0 52px 0 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact3-work_hour ul li {
    margin-bottom: 10px;
  }
}

.contact3-work_hour ul li a {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.contact3-work_hour ul li a svg {
  margin: -4px 8px 0 0;
}

.contact3-info {
  display: flex;
}

@media (max-width: 575px) {
  .contact3-info:last-child {
    margin-bottom: 20px;
  }
}

.contact3-info:hover span {
  background: var(--ztc-bg-bg-3);
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.contact3-info:hover span img {
  filter: brightness(0) invert(1);
  transition: all 0.4s;
}

.contact3-info-logo {
  margin-right: 16px;
}

.contact3-info-logo span {
  background: var(--ztc-bg-bg-1);
  height: 50px;
  width: 50px;
  display: inline-block;
  text-align: center;
  line-height: 48px;
  border-radius: 100%;
  transition: all 0.4s;
}

.contact3-info-logo span img {
  filter: brightness(0) invert(0);
  transition: all 0.4s;
}

.contact3-info-text h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.contact3-info-text a {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.contact3-info-form {
  background: var(--ztc-bg-bg-1);
  padding: 28px;
  border-radius: 8px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact3-info-form {
    margin-top: 40px;
  }
}

.contact3-info-form input {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  padding: 16px 14px;
  display: inline-block;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
  width: 100%;
}

.contact3-info-form ::-moz-placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
}

.contact3-info-form ::placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
}

.contact3-info-form textarea {
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
  padding: 16px 14px;
  width: 100%;
  height: 168px;
}

.contact3-info-form button {
  border: none;
  outline: none;
}

.contact3-from-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.contact3-select .nice-select {
  border: none;
  background: var(--ztc-bg-bg-4);
  height: 56px;
  line-height: 56px;
  border-radius: 8px;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  font-weight: var(--ztc-weight-medium);
}

.contact3-select .nice-select::after {
  height: 10px;
  margin-top: -6px;
  right: 14px;
  width: 10px;
}

.vl-contact_inner-box {
  overflow: hidden;
}

.contact_inner-box {
  border: 1px solid #E6EBED;
  border-radius: 8px;
  text-align: center;
  padding: 32px 0px;
  transition: 0.4s;
}

.contact_inner-box:hover {
  background: var(--ztc-bg-bg-4);
  transition: 0.4s;
}

.contact_inner-box:hover .contact_inner_logo {
  background: var(--ztc-text-text-4);
  transition: 0.4s;
}

.contact_inner-box:hover .contact_inner_logo img {
  filter: brightness(0) invert(1);
  transition: 0.4s;
}

.contact_inner_logo {
  height: 60px;
  width: 60px;
  border-radius: 100%;
  text-align: center;
  line-height: 60px;
  display: inline-block;
}

.contact_inner_logo img {
  height: 32px;
  width: 32px;
  transition: 0.4s;
}

.contact_inner-content h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.contact_inner-content .number_tags a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 28px;
}

.vl-contact_inner-map-area {
  overflow: hidden;
  z-index: 1;
  position: relative;
}

.vl-contact_inner-map iframe {
  width: 100%;
  height: 740px;
}

.contactinr_fromtitle {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  line-height: 32px;
  font-weight: var(--ztc-weight-bold);
}

.contactinner_from {
  position: absolute;
  top: 0;
  border: 1px solid #E6EBED;
}

@media (max-width: 575px) {
  .contactinner_from {
    position: relative;
    width: 100%;
    top: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contactinner_from {
    position: relative;
    width: 100%;
    top: 0;
  }
}

/*============= CONTACT CSS AREA ENDS===============*/
/*============= CTA CSS AREA ===============*/
.cta1-area {
  overflow: hidden;
  position: relative;
  z-index: 1;
  margin-top: -210px;
}

.cta1-area-info {
  border-radius: 16px;
  background-size: cover;
}

.cta1-area-info-content {
  padding: 70px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta1-area-info-content {
    padding: 40px;
  }
}

@media (max-width: 575px) {
  .cta1-area-info-content {
    padding: 18px 10px;
  }
}

.cta1-area-info-content-title_area h2 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media (max-width: 575px) {
  .cta1-area-info-content-title_area h2 {
    font-size: 32px;
    line-height: 45px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta1-area-info-content-title_area h2 br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta1-area-info-content-title_area h2 {
    font-size: 40px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta1-area-info-content-title_area h2 {
    font-size: 38px;
  }
}

.cta1-area-info-content-title_area p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .cta1-area-info-content-title_area p br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .cta1-area-info-content-title_area p {
    font-size: 16px;
  }
}

.cta1-area-info-banner-img {
  margin-top: 14px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cta1-area-info-banner-img {
    margin-top: 62px;
  }
}

.cta1-area-info-banner-img img {
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 575px) {
  .cta1_btn a {
    font-size: 16px;
  }
}

.vl-cta2-area {
  background-size: cover;
  height: 100%;
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.vl-cta2-area::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  opacity: 0.9;
  background: #014284;
}

.vl-cta2-area .vl-cta2-area-info {
  display: flex;
  justify-content: space-between;
  z-index: 99;
  align-items: center;
}

@media (max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info {
    display: block;
  }
}

@media (max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content {
    margin-bottom: 20px;
  }
}

.vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media (max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content h3 br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content h3 {
    line-height: 46px;
    font-size: 36px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content h3 {
    line-height: 44px;
    font-size: 30px;
  }
}

.vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-info-content p br {
    display: none;
  }
}

.vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section-heading h2 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main {
  display: flex;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main {
    display: block;
  }
}

.vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main form {
  margin-right: 12px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main form {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main form {
    margin-bottom: 20px;
    margin-right: 0px;
  }
}

.vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main form input {
  background: var(--ztc-text-text-1);
  border-radius: 8px;
  width: 350px;
  height: 56px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  padding-left: 16px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main form input {
    width: 290px;
  }
}

@media (max-width: 575px) {
  .vl-cta2-area .vl-cta2-area-info .vl-cta2-area-from-section .vl-cta2-area-from-section-main form input {
    width: 100%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-cta2-area-info-content {
    margin-right: 50px;
  }
}

.vl-cta2-area-info-content h3 {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 52px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-cta2-area-info-content h3 {
    font-size: 42px;
  }
}

@media (max-width: 575px) {
  .vl-cta2-area-info-content h3 {
    line-height: 42px;
    font-size: 32px;
  }
}

.vl-cta2-area-info-content p {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media (max-width: 575px) {
  .vl-cta2-area-info-content p br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-cta2-area-info-content p {
    font-size: 17px;
  }
}

.vl-cta3-area {
  overflow: hidden;
  z-index: 1;
  background: var(--ztc-bg-bg-3);
  position: relative;
  padding: 70px 0 80px;
}

.cta3-mail form {
  display: inline-block;
  position: relative;
}

.cta3-mail form input {
  background: var(--ztc-text-text-1);
  border-radius: 8px;
  width: 480px;
  height: 70px;
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  padding-left: 16px;
}

@media (max-width: 575px) {
  .cta3-mail form input {
    width: 300px;
  }
}

.cta3-mail form .cta3-mail-subscribe {
  position: absolute;
  top: 10px;
  right: 8px;
}

.cta3-phn-bar-shape {
  position: absolute;
  top: -65px;
  right: -94px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta3-phn-bar-shape {
    top: -45px;
    right: -85px;
  }
}

@media (max-width: 575px) {
  .cta3-phn-bar-shape {
    top: -62px;
    left: -86px;
  }
}

.cta3-phn-bar {
  z-index: 1;
  text-align: end;
  position: relative;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cta3-phn-bar {
    margin-top: 50px;
  }
}

@media (max-width: 575px) {
  .cta3-phn-bar {
    text-align: center;
    margin-top: 50px;
  }
}

.cta3-phn-bar-num {
  display: inline-block;
  position: relative;
}

.cta3-phn-bar-num a {
  background: var(--ztc-bg-bg-6);
  padding: 26px 32px;
  display: inline-block;
  line-height: 28px;
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s28);
  font-weight: var(--ztc-weight-bold);
  font-weight: 28px;
  border-radius: 12px;
}

.cta3-phn-bar-logo a {
  background: var(--ztc-bg-bg-1);
  display: inline-block;
  height: 84px;
  width: 84px;
  text-align: center;
  line-height: 84px;
  border-radius: 100px;
  margin-right: 86px;
}

@media (max-width: 575px) {
  .cta3-phn-bar-logo a {
    margin-right: 0;
  }
}

.cta3-phn-bar-num-shape {
  position: absolute;
  bottom: -44px;
  right: 104px;
}

.cta3-phn-bar-num-shape img {
  width: 46px;
  height: 46px;
}

/*============= CTA CSS AREA ENDS===============*/
/*============= TESTIMONIAL CSS AREA ===============*/
.testimonial1 {
  background: var(--ztc-bg-bg-4);
  position: relative;
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .testimonial1 {
    padding-bottom: 100px;
  }
}

.testimonial1 .teasimonial_1_slider_arrows {
  position: relative;
  z-index: 1;
}

.testimonial1 .vl-testimonial1-info {
  background: var(--ztc-bg-bg-1);
  padding: 40px 30px;
  border-radius: 16px;
  display: flex;
}

@media (max-width: 575px) {
  .testimonial1 .vl-testimonial1-info {
    display: block;
    padding: 18px 16px;
  }
}

.testimonial1 .vl-testimonial1-info:hover .testimonial1-bio-user {
  transform: rotateY(360deg);
  transition: all 1s;
}

.testimonial1 .vl-testimonial1-info .vl-testimonial1-info-content .p-text {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s22);
  font-weight: var(--ztc-weight-medium);
  line-height: 32px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1 .vl-testimonial1-info .vl-testimonial1-info-content .p-text {
    font-size: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .testimonial1 .vl-testimonial1-info .vl-testimonial1-info-content .p-text br {
    display: none;
  }
}

.testimonial1 .vl-testimonial1-info .vl-testimonial1-info-content .testimonial1-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 575px) {
  .testimonial1 .vl-testimonial1-info .vl-testimonial1-info-content .testimonial1-bottom {
    display: block;
  }
}

@media (max-width: 575px) {
  .testimonial1 .vl-testimonial1-info .vl-testimonial1-counter-area {
    text-align: center;
  }
}

.testimonial1 .vl-testimonial1-info .vl-testimonial1-counter-area .vl-testimonial1-counter-area-box h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

.testimonial1 .vl-testimonial1-info .vl-testimonial1-counter-area .vl-testimonial1-counter-area-box p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.testimonial1-bio {
  display: flex;
  align-items: center;
}

.testimonial1-bio .testimonial1-bio-user {
  margin-right: 16px;
  transition: all 1s;
}

.testimonial1-bio .testimonial1-bio-user img {
  width: 70px;
  height: 70px;
}

.testimonial1-bio .testimonial1-bio-text h2 a {
  color: var(--ztc-text-text-7);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  transition: 0.3s;
}

.testimonial1-bio .testimonial1-bio-text h2 a:hover {
  color: var(--ztc-text-text-5);
  transition: 0.3s;
}

.testimonial1-bio .testimonial1-bio-text p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

@media (max-width: 575px) {
  .testimonial1-bottom-logo {
    text-align: center;
    margin-bottom: 20px;
  }
}

.testimonial1-bottom-logo img {
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 575px) {
  .testimonial1-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
  }
}

.testimonial1-arrow .testimonial1-arrow-left {
  position: absolute;
  top: 50%;
  left: -80px;
  margin-top: -28px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-arrow .testimonial1-arrow-left {
    position: relative;
    left: 0;
    top: 0;
    margin: 0 8px 0 0;
  }
}

@media (max-width: 575px) {
  .testimonial1-arrow .testimonial1-arrow-left {
    position: relative;
    left: 0;
    top: 0;
    margin: 0 8px 0 0;
  }
}

.testimonial1-arrow .testimonial1-arrow-right {
  position: absolute;
  right: -80px;
  top: 50%;
  margin-top: -28px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial1-arrow .testimonial1-arrow-right {
    position: relative;
    left: 0;
    top: 0;
    margin: 0 0 0 8px;
  }
}

@media (max-width: 575px) {
  .testimonial1-arrow .testimonial1-arrow-right {
    position: relative;
    left: 0;
    top: 0;
    margin: 0 0 0 8px;
  }
}

.line {
  height: 285px;
  border-left: 1px solid rgba(0, 51, 78, 0.2);
  margin: 0 auto;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .line {
    margin: 0 14px;
    height: 340px;
  }
}

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

.title_area_testimonial1 {
  color: var(--ztc-text-text-7) !important;
}

.vl-testimonials3-area {
  overflow: hidden;
}

.vl-testimonials3-box {
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: var(--ztc-bg-bg-1);
  padding: 24px 24px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-testimonials3-box {
    padding: 24px 14px;
  }
}

.vl-testimonials3-box-quotation img {
  width: 40px;
  height: 40px;
}

.vl-testimonials3-box .testimonial3-text {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s22);
  font-weight: var(--ztc-weight-medium);
  line-height: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid #E6EBED;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-testimonials3-box .testimonial3-text {
    font-size: 21px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-testimonials3-box .testimonial3-text {
    font-size: 18px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimo_3_brk {
    font-size: 18px !important;
  }
}

.vl-testimonials4 {
  overflow: hidden;
  padding: 0px 40px 0px;
}

@media (max-width: 575px) {
  .vl-testimonials4 {
    padding: 0px 16px 0px;
  }
}

.vl-testimonials4-area {
  padding: 100px 0px 270px;
  background-size: cover;
  height: 100%;
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
  border-radius: 30px;
}

.vl-testimonials4-area::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  opacity: 0.9;
  background: #014284;
}

.testimonials4-top {
  z-index: 99;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 575px) {
  .testimonials4-top {
    display: block;
  }
}

.testimonials4-arrow {
  display: flex;
}

.testimonials4-arrow-left {
  margin-right: 16px;
}

.testimonials4-box-area {
  margin-top: -200px;
  position: relative;
  z-index: 99;
}

.vl-testimonials_inr_area {
  overflow: hidden;
}

.vl-testimonials_inr {
  border: 1px solid #E6EBED;
  box-shadow: inherit;
}

.testimonials_inner_box {
  transition: 0.4s;
}

.testimonials_inner_box:hover {
  box-shadow: 0 4px 40px 0 rgba(0, 0, 0, 0.12);
  transition: 0.4s;
  margin-top: -5px;
}

/*============= TESTIMONIAL CSS AREA ENDS ===============*/
.vl-choose1-area {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.vl-choose1-area .vl-choose1-content h2 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  transition: 0.3s;
}

.vl-choose1-area .vl-choose1-content h2 a:hover {
  color: var(--ztc-text-text-4);
  transition: 0.3s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-choose1-area .vl-choose1-content h2 a {
    font-size: 22px;
  }
}

.vl-choose1-area .vl-choose1-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-choose1-area .vl-choose1-content p br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-choose1-area .vl-choose1-banner {
    margin-top: 20px;
  }
}

.vl-choose1-area .vl-choose1-banner .banner-shape1 {
  position: relative;
  z-index: 1;
}

.vl-choose1-area .vl-choose1-banner .banner-shape1 img {
  border-radius: 8px;
  width: 270px;
  height: 270px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-choose1-area .vl-choose1-banner .banner-shape1 img {
    width: 60%;
  }
}

@media (max-width: 575px) {
  .vl-choose1-area .vl-choose1-banner .banner-shape1 img {
    height: 100%;
    width: 100%;
    margin-top: 30px;
  }
}

.vl-choose1-area .vl-choose1-banner .banner-shape2 {
  position: relative;
  margin-top: -210px;
}

@media (max-width: 575px) {
  .vl-choose1-area .vl-choose1-banner .banner-shape2 {
    margin-top: 30px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-choose1-area .vl-choose1-banner .banner-shape2 {
    margin-top: -90px;
  }
}

.vl-choose1-area .vl-choose1-banner .banner-shape2 img {
  border-radius: 8px;
  width: 470px;
  height: 306px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-choose1-area .vl-choose1-banner .banner-shape2 img {
    width: 85%;
  }
}

@media (max-width: 575px) {
  .vl-choose1-area .vl-choose1-banner .banner-shape2 img {
    height: 100%;
    width: 100%;
  }
}

.vl-aboutus_choose {
  overflow: hidden;
}

.aboutus_choose_text p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media (max-width: 575px) {
  .aboutus_choose_text p br {
    display: none;
  }
}

.aboutus_choose_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .aboutus_choose_top {
    display: block;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .aboutus_choose_thumb {
    margin-bottom: 20px;
  }
}

.aboutus_choose_thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 600px;
  border-radius: 8px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .aboutus_choose_thumb img {
    height: 100%;
  }
}

.aboutus_choose_box {
  padding: 28px 14px;
  background: var(--ztc-bg-bg-4);
  border-radius: 8px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .aboutus_choose_box {
    padding: 16px 10px;
  }
}

.aboutus_choose_box:hover .aboutus_choose_box_icon {
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.aboutus_choose_box_icon {
  background: var(--ztc-bg-bg-1);
  display: inline-block;
  height: 80px;
  width: 80px;
  text-align: center;
  line-height: 80px;
  border-radius: 60px;
  transition: all 0.4s;
}

.aboutus_choose_box_icon img {
  width: 32px;
  height: 35px;
}

.aboutus_choose_box h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .aboutus_choose_box h3 a {
    font-size: 16px;
  }
}

.aboutus_choose_box p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .aboutus_choose_box p {
    font-size: 16px;
  }
}

.aboutus_choose_thumb_mini {
  overflow: hidden;
  border-radius: 8px;
}

.aboutus_choose_thumb_mini:hover img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s;
}

.aboutus_choose_thumb_mini img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 286px;
  transition: 0.4s;
  border-radius: 8px;
}

.swiper-slide.swiper-slide-active .our_services1_info_banner .our_services1_info_banner_content {
  visibility: visible;
  opacity: 1;
  transition: all 0.4s;
  transform: scale(1);
}

.vl-our_services_area {
  background: var(--ztc-bg-bg-4);
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.vl-our_services_area .our_services1_info {
  overflow: hidden;
}

.vl-our_services_area .our_services1_info_banner {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
}

.vl-our_services_area .our_services1_info_banner:hover .view_services i {
  transform: rotate(0deg);
  transition: all 0.4s;
}

.vl-our_services_area .our_services1_info_banner:hover img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s;
}

.vl-our_services_area .our_services1_info_banner img {
  width: 100%;
  height: 100%;
  border-radius: 16px;
  -o-object-fit: cover;
  object-fit: cover;
}

.our_services1_info_banner_content {
  background: var(--ztc-bg-bg-1);
  padding: 22px 22px;
  position: absolute;
  bottom: 24px;
  border-radius: 8px;
  left: 24px;
  right: 24px;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
  transform: scale(0.8);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .our_services1_info_banner_content {
    padding: 18px 12px;
  }
}

.our_services1_info_banner_content h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .our_services1_info_banner_content h3 a {
    font-size: 19px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .our_services1_info_banner_content h3 a {
    font-size: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .our_services1_info_banner_content h3 a {
    font-size: 18px;
  }
}

.our_services1_info_banner_content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .our_services1_info_banner_content p {
    font-size: 17px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .our_services1_info_banner_content p {
    font-size: 16px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .our_services1_info_banner_content p br {
    display: none;
  }
}

.our_services_top_btn {
  margin-top: 20px;
}

.vl-our_services_arrow {
  display: flex;
  justify-content: center;
}

.vl-our_services_arrow .our_services_arrow_slider1 {
  margin-right: 10px;
}

.our_services1_info:hover .our_services1_info_banner_content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.vl-products4 {
  overflow: hidden;
  padding: 100px 40px 0px;
}

@media (max-width: 575px) {
  .vl-products4 {
    padding: 50px 16px 50px;
  }
}

.vl-products4-area {
  background: var(--ztc-bg-bg-5);
  border-radius: 30px;
  position: relative;
}

.products4-shape {
  position: absolute;
  top: 0;
  right: 0;
}

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

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-products4-info {
    margin-bottom: 20px;
  }
}

.vl-products4-info-thumb {
  position: relative;
}

.vl-products4-info-thumb .thumb-imgs {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 300px;
  border-radius: 16px 16px 0px 0px;
}

.vl-products4-info-priceing {
  background: var(--ztc-bg-bg-1);
  padding: 28px 24px 34px;
  border-radius: 0 0 16px 16px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-products4-info-priceing {
    padding: 28px 14px 34px;
  }
}

.vl-products4-info-priceing h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-products4-info-priceing h3 a {
    font-size: 19px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-products4-info-priceing h3 a {
    font-size: 17px;
  }
}

.vl-products4-info-priceing p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.products4-cart-area {
  position: absolute;
  top: 0%;
  margin: 0 auto;
  left: 0;
  right: 0;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
}

.products4-cart-list ul {
  display: flex;
  justify-content: center;
  margin-bottom: 16px;
}

.products4-cart-list ul li {
  margin-right: 8px;
}

.products4-cart-list ul li:last-child {
  margin-right: 0px;
}

.products4-cart-list ul li a {
  background: var(--ztc-bg-bg-1);
  height: 32px;
  width: 32px;
  display: inline-block;
  text-align: center;
  border-radius: 100%;
  line-height: 30px;
  transition: all 0.4s;
}

.products4-cart-list ul li a:hover {
  background: var(--ztc-bg-bg-3);
  transition: all 0.4s;
}

.products4-cart-list ul li a:hover img {
  filter: brightness(0) invert(1);
}

.products4-cart-list ul li a img {
  height: 14px;
  width: 14px;
}

.vl-products4-info-thumb::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 0%;
  width: 100%;
  opacity: 0.75;
  background: #014284;
  transition: 0.4s;
}

.vl-products4-info:hover .products4-cart-area {
  top: 60%;
  transition: 0.4s;
  visibility: visible;
  opacity: 1;
}

.vl-products4-info:hover .vl-products4-info-thumb::after {
  height: 100%;
  transition: 0.4s;
}

.product__area__wrap {
  border-radius: 8px;
  padding: 20px;
  background: var(--ztc-bg-bg-4);
  transition: 0.3s;
}

.product__area__wrap-thumb {
  position: relative;
  z-index: 1;
  height: 270px;
  overflow: hidden;
  border-radius: 20px;
}

.product__area__wrap-thumb::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 51, 78, 0.7);
  opacity: 0;
}

.product__area__wrap-thumb img {
  height: 270px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 20px;
  transition: 0.3s;
}

.product__area__wrap-thumb .product-icon {
  background: var(--ztc-bg-bg-1);
  display: inline-block;
  border-radius: 8px;
  padding: 10px;
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 132px;
  margin: 0 auto;
  text-align: center;
  right: 0;
  transform: translateY(85px);
  transition: 0.3s;
  z-index: 1;
}

.product__area__wrap-thumb .product-icon a {
  background: var(--ztc-bg-bg-4);
  height: 32px;
  width: 32px;
  line-height: 32px;
  border-radius: 50px;
  text-align: center;
  display: inline-block;
  transition: 0.3s;
  margin: 0 1px;
}

.product__area__wrap-thumb .product-icon a img {
  margin-top: -3px;
  transition: 0.3s;
  height: 16px;
  width: 16px;
}

.product__area__wrap-thumb .product-icon a:hover {
  background: var(--ztc-bg-bg-3);
  transition: 0.3s;
}

.product__area__wrap-thumb .product-icon a:hover img {
  filter: brightness(0) invert(1);
  transition: 0.3s;
}

.product__area__wrap-thumb .fav-icon span {
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50px;
  display: inline-block;
  background: var(--ztc-bg-bg-1);
  position: absolute;
  top: 12px;
  right: 12px;
  transition: 0.3s;
  color: var(--ztc-text-text-5);
  z-index: 1;
}

.product__area__wrap-content .title a {
  color: var(--ztc-bg-bg-5);
  font-size: var(--ztc-font-size-font-s20);
  line-height: 20px;
  font-weight: var(--ztc-weight-bold);
  transition: 0.3s;
}

.product__area__wrap-content .title a:hover {
  transition: 0.3s;
}

.product__area__wrap-content .price {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-bold);
  background: var(--ztc-bg-bg-3);
  padding: 8px 12px;
  border-radius: 8px;
  display: inline-block;
  transition: 0.3s;
}

.product__area__wrap:hover {
  border-radius: 8px;
  transition: 0.3s;
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.12);
}

.product__area__wrap:hover .product__area__wrap-thumb img {
  transform: scale(1.1);
  transition: 0.3s;
}

.product__area__wrap:hover .product__area__wrap-thumb .product-icon {
  transform: translateY(0px);
  transition: 0.3s;
}

.product__area__wrap:hover .product__area__wrap-thumb .fav-icon span {
  background: var(--ztc-bg-bg-3);
  transition: 0.3s;
  color: var(--ztc-bg-bg-1);
}

.product__area__wrap:hover .product__area__wrap-thumb:after {
  opacity: 1;
  transition: 0.3s;
}

.vl-product_inr_thumb img {
  height: 500px;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 8px;
}

.vl-product_inr_minithumb img {
  width: 100%;
  height: 190px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 8px;
}

.vl-shop4 {
  overflow: hidden;
}

.vl-shop4-area {
  background: var(--ztc-bg-bg-1);
  border-radius: 30px;
}

.shop4-area-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 575px) {
  .shop4-area-top {
    display: block;
  }
}

.shop4-box-info {
  overflow: hidden;
  margin-bottom: 20px;
}

.shop4-box-info:hover .shop4-cart-area {
  top: 34%;
  visibility: visible;
  opacity: 1;
  transition: 0.4s;
}

.shop4-box-info:hover .shop4-box-thumb::after {
  height: 100%;
  transition: 0.4s;
}

.shop4-box-info .shop4-box-thumb {
  position: relative;
}

.shop4-box-info .shop4-box-thumb::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 0%;
  width: 100%;
  opacity: 0.75;
  background: #014284;
  transition: 0.4s;
  border-radius: 16px;
}

.shop4-box-info .shop4-box-thumb .shop4-thumb-imgs {
  width: 100%;
  height: 100%;
  border-radius: 16px;
}

.shop4-box-info .shop4-box-content {
  background: var(--ztc-bg-bg-7);
  border-radius: 16px;
  padding: 28px 24px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .shop4-box-info .shop4-box-content {
    padding: 28px 14px;
  }
}

.shop4-box-info .shop4-box-content h3 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .shop4-box-info .shop4-box-content h3 a {
    font-size: 18px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .shop4-box-info .shop4-box-content h3 a {
    font-size: 17px;
  }
}

.shop4-box-info .shop4-box-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.shop4-cart-area {
  position: absolute;
  top: 0%;
  margin: 0 auto;
  left: 0;
  right: 0;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
}

.vkl__product__details-title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  font-weight: var(--ztc-weight-bold);
  line-height: 32px;
}

.vkl__product__details-rating span.preview-text {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  margin-left: 8px;
}

.vkl__product__details-price span.amount {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  line-height: 32px;
  font-weight: var(--ztc-weight-bold);
}

.vkl__product__details-quantity-wrap {
  display: flex;
  align-items: center;
}

@media (max-width: 575px) {
  .vkl__product__details-quantity-wrap {
    display: block;
  }
}

.vkl__product__details-quantity-wrap-box {
  margin-right: 32px;
  position: relative;
}

@media (max-width: 575px) {
  .vkl__product__details-quantity-wrap-box {
    margin-right: 0;
    margin-bottom: 20px;
  }
}

.vkl__product__details-quantity-wrap-box input[type=text] {
  background: #E8E8E8;
  border: transparent;
  width: 109px;
  height: 52px;
  border-radius: 8px;
  text-align: center;
  color: var(--ztc-text-text-4);
  font-size: var(--ztc-font-size-font-s16);
}

@media (max-width: 575px) {
  .vkl__product__details-quantity-wrap-box input[type=text] {
    width: 100%;
  }
}

.vkl__product__details-quantity-wrap-box .vl-cart-minus {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 16px;
  cursor: pointer;
  color: var(--ztc-text-text-5);
}

.vkl__product__details-quantity-wrap-box .vl-cart-plus {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 16px;
  cursor: pointer;
  color: var(--ztc-text-text-5);
}

.vkl__product__details-quantity-wrap-btn {
  margin-right: 32px;
}

@media (max-width: 575px) {
  .vkl__product__details-quantity-wrap-btn {
    margin-right: 0;
    margin-bottom: 20px;
  }
}

.vkl__product__details-quantity-wishlist span {
  background: var(--ztc-bg-bg-3);
  height: 56px;
  width: 56px;
  border-radius: 50px;
  line-height: 56px;
  text-align: center;
  display: inline-block;
}

.vkl__product__details-product-info ul li {
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  color: var(--ztc-text-text-6);
  margin-bottom: 20px;
}

.vkl__product__details-product-info ul li:last-child {
  margin-bottom: 0;
}

.vkl__product__details-product-info ul li span {
  font-size: var(--ztc-font-size-font-s20);
  line-height: 20px;
  font-weight: var(--ztc-weight-bold);
  color: var(--ztc-text-text-5);
  width: 150px;
  display: inline-block;
}

.vkl__product__details-social-title {
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
  color: var(--ztc-text-text-5);
}

.vl-product-text p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-product-content-block .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  line-height: 32px;
  font-weight: var(--ztc-weight-bold);
  text-transform: capitalize;
}

.vl-product-content-block p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-product-description-content .nav-link {
  padding: 14px 24px;
  font-size: var(--ztc-font-size-font-s20);
  line-height: 20px;
  font-weight: var(--ztc-weight-bold);
  border: 1px solid #00334E;
  border-radius: 8px;
  margin-right: 16px;
  color: var(--ztc-text-text-5);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .vl-product-description-content .nav-link {
    padding: 14px 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-product-description-content .nav-link {
    padding: 14px 14px;
  }
}

.vl-product-description-content .nav-link.active {
  background: var(--ztc-text-text-4);
  border: none;
  outline: none;
}

.vl-product_add_review_area-content {
  display: flex;
  border-top: 1px solid #E6EBED;
  border-bottom: 1px solid #E6EBED;
  padding: 32px 0px;
}

.product_add_review_user {
  margin-right: 32px;
}

.product_add_review_user img {
  width: 144px;
  height: 144px;
  -o-object-fit: cover;
  object-fit: cover;
}

.review_top_heading {
  display: flex;
  justify-content: space-between;
}

.review_top_heading h2 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
}

.review_top_heading h2 span {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  margin-left: 16px;
}

.pera_add {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .pera_add {
    font-size: 17px !important;
  }
}

.review_from_title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s32);
  line-height: 32px;
  font-weight: var(--ztc-weight-bold);
}

.review_from_text {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.form_area_content input {
  border: inherit;
  border-radius: 8px;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
  background: var(--ztc-bg-bg-1);
  width: 100%;
  padding: 16px 16px;
}

.form_area_content ::-moz-placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
}

.form_area_content ::placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
}

.form_area_content textarea {
  width: 100%;
  border: inherit;
  border-radius: 8px;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s16);
  line-height: 16px;
  font-weight: var(--ztc-weight-medium);
  background: var(--ztc-bg-bg-1);
  padding: 16px 16px;
  height: 140px;
  width: 100%;
}

.more_shop_heading {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

.vl-gallery4-area {
  overflow: hidden;
}

.gallery4-area-thumb {
  margin-bottom: 30px;
  position: relative;
  overflow: hidden;
}

.gallery4-area-thumb::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 0%;
  opacity: 0.75;
  background: #014284;
  transition: 0.4s;
  border-radius: 20px;
}

.gallery4-area-thumb .grl-img-1 {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 20px;
  height: 900px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .gallery4-area-thumb .grl-img-1 {
    height: 100%;
  }
}

.gallery4-area-thumb .grl-img-2 {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 20px;
  height: 435px;
}

@media (max-width: 575px) {
  .gallery4-area-thumb .grl-img-2 {
    height: 100%;
  }
}

.gallery4-area-thumb:hover::after {
  width: 100%;
  transition: 0.4s;
}

.gallery4-area-thumb:hover .gallary_search {
  top: 50%;
  opacity: 1;
  visibility: visible;
  transition: 0.4s;
}

.gallary_search {
  position: absolute;
  top: 0%;
  margin: 0 auto;
  left: 0;
  right: 0;
  text-align: center;
  transform: translateY(-50px);
  z-index: 9;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
}

.gallary_search span {
  background: var(--ztc-text-text-4);
  height: 100px;
  width: 100px;
  display: inline-block;
  align-content: center;
  text-align: center;
  border-radius: 100%;
  cursor: pointer;
}

.grl-img-1 {
  height: 630px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .grl-img-1 {
    height: 654px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .grl-img-1 {
    height: 592px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .grl-img-1 {
    height: 546px;
  }
}

.grl-img-2 {
  height: 270px;
}

.grl-img-3 {
  height: 270px;
}

.grl-img-4 {
  height: 330;
}

.grl-img-5 {
  height: 330;
}

.tp-text-slide-title {
  color: #fff;
  margin-bottom: 0;
  font-size: var(--ztc-font-size-font-s28);
  line-height: 28px;
  font-weight: var(--ztc-weight-bold);
}

.tp-text-slide-title img {
  width: 40px;
  height: 40px;
  margin-right: 20px;
}

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

.tpcauses-text-slider-active .swiper-slide {
  width: auto;
  display: inline-block;
}

.tp-brand {
  background-color: #fff;
  padding: 25px 0;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tp-text-bg-2 {
  overflow: hidden;
  padding: 30px 0;
  height: 95px;
  width: 100%;
}

.tp-texthm7-slider {
  position: relative;
  z-index: 2;
}

.vl-sidebar {
  position: sticky;
  top: 50px;
}

.vl-widegt-1 {
  border-radius: 8px;
  padding: 24px 20px;
  margin-bottom: 32px;
}

.vl-widegt-1 .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.vl-widegt-1 .vl-searh-form-wid form {
  position: relative;
  z-index: 1;
  display: inline-block;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-widegt-1 .vl-searh-form-wid form {
    display: block;
  }
}

.vl-widegt-1 .vl-searh-form-wid form input[type=text] {
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  height: 48px;
  width: 330px;
  padding: 16px;
  color: #747473;
  transition: 0.3s;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  border: 1px solid transparent;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-widegt-1 .vl-searh-form-wid form input[type=text] {
    width: 100%;
  }
}

.vl-widegt-1 .vl-searh-form-wid form input[type=text]::-moz-placeholder {
  color: #747473;
  font-size: var(--ztc-font-size-font-s18);
}

.vl-widegt-1 .vl-searh-form-wid form input[type=text]::placeholder {
  color: #747473;
  font-size: var(--ztc-font-size-font-s18);
}

.vl-widegt-1 .vl-searh-form-wid form span {
  background: var(--ztc-bg-bg-3);
  height: 48px;
  width: 48px;
  line-height: 52px;
  text-align: center;
  border-radius: 8px;
  display: inline-block;
  position: absolute;
  right: 0;
  top: 0;
  color: var(--ztc-text-text-1);
  cursor: pointer;
  font-size: var(--ztc-font-size-font-s20);
}

.vl-widegt-2 {
  border-radius: 8px;
  padding: 24px 20px;
  margin-bottom: 32px;
}

.vl-widegt-2 .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.vl-widegt-2 .vl-service-list ul li {
  margin-bottom: 20px;
}

.vl-widegt-2 .vl-service-list ul li:last-child {
  margin-bottom: 0;
}

.vl-widegt-2 .vl-service-list ul li a {
  background: var(--ztc-bg-bg-1);
  border-radius: 8px;
  color: var(--ztc-text-text-5);
  padding: 21px 20px;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-bold);
  display: block;
  position: relative;
  transition: 0.4s;
}

.vl-widegt-2 .vl-service-list ul li a span {
  height: 36px;
  width: 36px;
  line-height: 38px;
  text-align: center;
  border-radius: 36px;
  background: rgba(1, 110, 220, 0.1);
  display: inline-block;
  position: absolute;
  right: 20px;
  top: 14px;
  transition: 0.4s;
  color: var(--ztc-text-text-4);
  transform: rotate(-90deg);
}

.vl-widegt-2 .vl-service-list ul li a:hover {
  background: var(--ztc-bg-bg-3);
  color: var(--ztc-text-text-1);
  transition: 0.4s;
}

.vl-widegt-2 .vl-service-list ul li a:hover span {
  background: var(--ztc-bg-bg-1);
  color: var(--ztc-text-text-5);
  transform: rotate(90deg);
  transition: 0.4s;
}

.vl-widegt-3 {
  border-radius: 8px;
  padding: 24px 20px;
  margin-bottom: 32px;
}

.vl-widegt-3 .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .vl-widegt-3 .title br {
    display: none;
  }
}

.vl-widegt-3 .sidebar-con-icon-list a {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  margin-bottom: 23px;
  display: block;
  transition: 0.4;
}

.vl-widegt-3 .sidebar-con-icon-list a:hover {
  color: var(--ztc-text-text-5);
  transition: 0.4s;
}

.vl-widegt-3 .sidebar-con-icon-list a svg {
  margin: 0px 4px 4px 0px;
}

.vl-widegt-3 .sidebar-con-icon-list a:last-child {
  margin-bottom: 0;
}

.vl-widegt-4 {
  border-radius: 8px;
  padding: 24px 20px;
  margin-bottom: 32px;
}

.vl-widegt-4 .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
}

.vl-widegt-4 .vl-sidebar-social ul li {
  display: inline-block;
}

.vl-widegt-4 .vl-sidebar-social ul li a span {
  background: var(--ztc-bg-bg-1);
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50px;
  text-align: center;
  color: var(--ztc-text-text-5);
  transition: 0.4s;
  display: inline-block;
  margin-right: 10px;
}

.vl-widegt-4 .vl-sidebar-social ul li a span:hover {
  background: var(--ztc-bg-bg-3);
  transition: 0.4s;
  color: var(--ztc-text-text-1);
}

.vl-widegt-5 {
  border-radius: 8px;
  padding: 24px 20px;
  margin-bottom: 32px;
}

.vl-widegt-5 .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
}

.vl-widegt-5 .vl-sidebar-form input[type=text],
.vl-widegt-5 .vl-sidebar-form input[type=email],
.vl-widegt-5 .vl-sidebar-form input[type=number] {
  background: var(--ztc-bg-bg-1);
  width: 100%;
  height: 52px;
  border-radius: 8px;
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  margin-bottom: 16px;
  padding: 16px;
}

.vl-widegt-5 .vl-sidebar-form input[type=text]::-moz-placeholder,
.vl-widegt-5 .vl-sidebar-form input[type=email]::-moz-placeholder,
.vl-widegt-5 .vl-sidebar-form input[type=number]::-moz-placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.vl-widegt-5 .vl-sidebar-form input[type=text]::placeholder,
.vl-widegt-5 .vl-sidebar-form input[type=email]::placeholder,
.vl-widegt-5 .vl-sidebar-form input[type=number]::placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.vl-widegt-5 .vl-sidebar-form textarea {
  color: var(--ztc-text-text-6);
  transition: 0.3s;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
  height: 180px;
  border-radius: 8px;
  margin-bottom: 32px;
  background: var(--ztc-bg-bg-1);
  padding: 16px;
  width: 100%;
}

.vl-widegt-5 .vl-sidebar-form textarea::-moz-placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.vl-widegt-5 .vl-sidebar-form textarea::placeholder {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-medium);
}

.vl-widget-cat {
  padding: 24px 20px;
  border-radius: 8px;
  margin-bottom: 32px;
}

.vl-widget-cat .category__item {
  display: flex;
  padding-bottom: 32px;
}

.vl-widget-cat .category__item-icon span {
  background: var(--ztc-bg-bg-1);
  height: 54px;
  width: 54px;
  line-height: 54px;
  border-radius: 50px;
  text-align: center;
  display: inline-block;
  margin-right: 16px;
}

.vl-widget-cat .category__item-content .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 20px;
}

.vl-widget-cat .category__item-content p {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.vl-widget-tags {
  padding: 24px 20px;
  border-radius: 8px;
  margin-bottom: 32px;
}

.vl-widget-tags .title {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.vl-widget-tags .popular-tags a {
  color: var(--ztc-text-text-5);
  background: var(--ztc-bg-bg-1);
  padding: 12px 16px;
  border-radius: 8px;
  display: inline-block;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-bold);
  transition: 0.4s;
  margin-right: 16px;
  margin-bottom: 16px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .vl-widget-tags .popular-tags a {
    font-size: 16px;
  }
}

.vl-widget-tags .popular-tags a:hover {
  background: var(--ztc-bg-bg-3);
  transition: 0.4s;
  color: var(--ztc-text-text-1);
}

.vl-widget-category {
  padding: 24px 20px;
  border-radius: 8px;
  margin-bottom: 32px;
}

.vl-widget-category h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.vl-widget-category .vl-widget-category-list ul li {
  margin-bottom: 20px;
}

.vl-widget-category .vl-widget-category-list ul li:last-child {
  margin-bottom: 0;
}

.vl-widget-category .vl-widget-category-list ul li a {
  display: block;
  background: var(--ztc-text-text-1);
  border-radius: 8px;
  padding: 20px;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 18px;
  font-weight: var(--ztc-weight-bold);
  color: var(--ztc-text-text-5);
  transition: 0.4s;
}

.vl-widget-category .vl-widget-category-list ul li a:hover {
  background: var(--ztc-text-text-4);
  transition: 0.4s;
  color: var(--ztc-text-text-1);
}

.vl-widget-category .vl-widget-category-list ul li a span {
  float: right;
}

.vl-widget-rpost {
  padding: 24px 20px;
  border-radius: 8px;
  margin-bottom: 32px;
}

.vl-widget-rpost h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.rec__post__wrap {
  display: flex;
  align-items: center;
}

.rec__post__wrap-thumb {
  margin-right: 13px;
}

.rec__post__wrap-thumb img {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  -o-object-fit: cover;
  object-fit: cover;
}

.rec__post__wrap-content {
  margin-top: 10px;
}

.rec__post__wrap-content .date {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.rec__post__wrap-content .date img {
  margin-top: -4px;
  margin-right: 4px;
}

.rec__post__wrap-content .title a {
  color: var(--ztc-text-text-2);
  font-size: var(--ztc-font-size-font-s18);
  line-height: 28px;
  font-weight: var(--ztc-weight-bold);
  transition: 0.4s;
  display: inline-block;
}

@media (max-width: 575px) {
  .rec__post__wrap-content .title a {
    font-size: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .rec__post__wrap-content .title a br {
    display: none;
  }
}

.rec__post__wrap-content .title a:hover {
  color: #d01d49;
  transition: 0.4s;
}

.vl-widegt-author {
  padding: 24px 20px;
  border-radius: 8px;
}

.vl-widegt-author h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.vl-widegt-author .vl-auth-thumb-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.vl-widegt-author .vl-auth-thumb-grid a img {
  height: 70px;
  width: 70px;
}

.vl-filter-widget h3 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.project1 {
  overflow: hidden;
  z-index: 1;
  position: relative;
}

.project1-info {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

.project1-info .project1-before-thumb {
  position: relative;
  width: 100%;
}

.project1-info .project1-after-thumb {
  position: relative;
  width: 100%;
}

.project1-info .before_imgs {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px 0px 0px 16px;
}

.project1-info .after_imgs {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 0px 16px 16px 0px;
}

.project1-info .thumb-text {
  position: absolute;
  bottom: 28px;
  left: 80px;
  right: 80px;
  text-align: center;
}

@media (max-width: 575px) {
  .project1-info .thumb-text {
    left: 26px;
  }
}

.project1-info .thumb-text h4 {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
  background: var(--ztc-bg-bg-1);
  padding: 16px 24px;
  border-radius: 8px;
  display: inline-block;
}

.projects-details-thumbs img {
  width: 100%;
  height: 426px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 20px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .projects-details-thumbs img {
    height: 100%;
  }
}

.content_box_projrct {
  background: var(--ztc-bg-bg-4);
  padding: 28px 32px;
  position: relative;
  z-index: 1;
  border-radius: 8px;
}

.content_box_projrct::after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 8px;
  background: #d01d49;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.content_box_projrct p {
  color: var(--ztc-text-text-10);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.service-inr_left_box {
  display: flex;
  justify-content: space-between;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .service-inr_left_box {
    display: block;
  }
}

.service-inr-details_thumb2 img {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  height: 256px;
  border-radius: 8px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .service-inr-details_thumb2 img {
    height: 100%;
  }
}

.title_more {
  text-align: center;
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

.vl-projects-inner-details {
  overflow: hidden;
}

.project_inner_section_area {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.project_inner_section_area .project_inner_boxarea {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-radius: 16px;
  margin-bottom: 30px;
}

.project_inner_section_area .project_inner_boxarea:hover .images img {
  transform: scale(1.1) rotate(-4deg);
  transition: all 0.4s;
}

.project_inner_section_area .images {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-radius: 16px;
}

.project_inner_section_area .images::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  border-radius: 16px;
  background: linear-gradient(10deg, rgba(0, 51, 78, 0.87) 21.82%, rgba(0, 51, 78, 0) 61.72%);
  left: 0;
  top: 0;
  border-radius: 16px;
}

.project_inner_section_area .images img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 16px;
  transition: all 0.4s;
}

.project_inner_section_area .project_content_area {
  background: var(--ztc-bg-bg-1);
  padding: 30px;
  border-radius: 16px;
  position: absolute;
  left: 24px;
  bottom: 24px;
  right: 24px;
  z-index: 2;
}

.project_inner_section_area .project_content_area .date {
  color: var(--Text-Colors, #00334E);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  display: inline-block;
  transition: all 0.4s;
}

.project_inner_section_area .project_content_area .title {
  color: var(--Text-Colors, #00334E);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s20);
  font-style: normal;
  font-weight: var(--ztc-weight-semibold);
  line-height: 28px;
  transition: all 0.4s;
  display: inline-block;
}

.project_inner_section_area .project_content_area .readmore {
  color: var(--Text-Colors, #00334E);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: 800;
  line-height: 18px;
  text-transform: uppercase;
}

.project_inner_section_area .project_content_area .readmore:hover {
  color: #d01d49;
  transition: all 0.4s;
}

.project_inner_section_area .project_content_area .readmore i {
  margin-left: 4px;
  transform: rotate(-45deg);
}

.vl-process2-area {
  overflow: hidden;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .process2-info-box {
    margin-bottom: 22px;
  }
}

.process2-info-box:hover .process2-logo-icon {
  transform: rotateY(-180deg);
  transition: all 0.4s;
}

.process2-info-logo {
  width: 100px;
  height: 100px;
  background: var(--ztc-bg-bg-3);
  border-radius: 8px;
  position: relative;
  padding-left: 0px;
  padding-right: 0px;
  margin: 0 auto;
}

.process2-info-logo .process2-info-logo-num {
  color: var(--ztc-text-text-1);
  font-size: var(--ztc-font-size-font-s56);
  font-weight: var(--ztc-weight-bold);
  line-height: 100px;
  text-align: center;
}

.project2-icon-shape {
  position: absolute;
  bottom: -61px;
  right: 11px;
  transform: rotate(55.61deg);
}

.project2-icon-shape img {
  width: 54px;
  height: 130px;
}

.process2-logo-icon {
  height: 80px;
  width: 80px;
  display: inline-block;
  z-index: 99;
  position: relative;
  text-align: center;
  line-height: 80px;
  border-radius: 60px;
  top: -38px;
  margin-left: 55px;
  background: var(--ztc-bg-bg-4);
  transition: all 0.4s;
}

.process2-logo-icon img {
  height: 32px;
  width: 32px;
}

.process2-box-content {
  margin-top: 60px;
  background: var(--ztc-bg-bg-4);
  border-radius: 16px;
  padding: 28px 18px;
}

.process2-box-content .process2_boxtitle a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s20);
  font-weight: var(--ztc-weight-bold);
  line-height: 28px;
  transition: 0.3s;
}

.process2-box-content .process2_boxtitle a:hover {
  color: var(--ztc-text-text-4);
  transition: 0.3s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .process2-box-content .process2_boxtitle a {
    font-size: 19px;
  }
}

.process2-box-content .process2_box_title {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .process2-box-content .process2_box_title {
    font-size: 17px;
  }
}

.vl-paln_inner_area {
  overflow: hidden;
}

.vl-paln_inner_list {
  border: 1px solid #E6EBED;
  border-radius: 8px;
  padding: 32px;
  transition: 0.4s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .vl-paln_inner_list {
    padding: 26px 14px;
  }
}

.vl-paln_inner_list:hover {
  background: var(--ztc-bg-bg-4);
  transition: 0.4s;
}

.vl-paln_inner_list .vl-btn1 {
  text-align: center;
  width: 100%;
}

.title_plan {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

.title_plan_text {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.vl-paln_inner_price h2 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s44);
  font-weight: var(--ztc-weight-bold);
  line-height: 44px;
}

.vl-paln_inner_price h2 a span {
  color: var(--ztc-text-text-6);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 26px;
}

.pricing-table-title {
  font-size: var(--ztc-font-size-font-s44);
  line-height: 44px;
  font-weight: var(--ztc-weight-bold);
  color: var(--ztc-text-text-5);
  margin-bottom: 60px;
}

.pricing-table-area {
  overflow: hidden;
}

.pricing-table-area table {
  width: 100%;
}

.pricing-table-area table thead {
  border-radius: 16px 0px 0px 0px;
  border: 1px solid rgba(24, 23, 22, 0.1);
  background: var(--ztc-bg-bg-4);
}

.pricing-table-area table thead tr th {
  font-size: var(--ztc-font-size-font-s24);
  line-height: 24px;
  font-weight: var(--ztc-weight-bold);
  padding: 24px 28px;
  border: 1px solid #E6EBED;
}

@media (max-width: 575px) {
  .pricing-table-area table thead tr th {
    font-size: 16px;
  }
}

.pricing-table-area table tbody tr td {
  border: 1px solid #E8E8E8;
  font-size: var(--ztc-font-size-font-s18);
  line-height: 20px;
  font-weight: var(--ztc-weight-medium);
  padding: 24px 28px;
}

@media (max-width: 575px) {
  .pricing-table-area table tbody tr td {
    font-size: 16px;
    padding: 16px 20px;
  }
}

.pricing-table-area table tbody tr td span img {
  margin: -5px 5px 0px 0px;
}

.pricing-table-area table tbody tr td .xmark img {
  margin-top: -5px;
}

@media (max-width: 575px) {
  .pricing-table-area {
    overflow-x: scroll;
  }
}

.amount_wrap {
  font-weight: var(--ztc-weight-bold) !important;
}

.pricing-table-area table tbody tr td:nth-child(1) {
  background: var(--ztc-bg-bg-4);
  font-weight: var(--ztc-weight-bold);
}

.vl-error-area {
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.vl-error-area-thumb img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/*============= CASE STUDY CSS AREA ENDS ===============*/
.vl-case-area {
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 575px) {
  .case3_info {
    margin-bottom: 20px;
  }
}

.case3_info:hover .case3_info_banner_content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.case3_info.active .case3_info_banner_content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.case3_info_banner {
  position: relative;
  overflow: hidden;
}

.case3_info_banner .info_img3 {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 16px;
}

.case3_info_banner_content {
  background: var(--ztc-bg-bg-1);
  text-align: center;
  padding: 20px 16px;
  display: inline-block;
  border-radius: 20px;
  position: absolute;
  left: 20px;
  bottom: 18px;
  right: 20px;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.8);
  transition: 0.6s;
}

.case3_info_banner_content p {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s18);
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
}

.case3_info_banner_content h4 a {
  color: var(--ztc-text-text-5);
  font-size: var(--ztc-font-size-font-s24);
  font-weight: var(--ztc-weight-bold);
  line-height: 24px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
(max-width: 575px) {
  .case3_info_banner_content h4 a {
    font-size: 22px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .case3_info_banner_content h4 a {
    font-size: 18px;
  }
}

.case3-arrow a {
  background: var(--ztc-bg-bg-3);
  height: 54px;
  width: 54px;
  display: inline-block;
  text-align: center;
  line-height: 54px;
  border-radius: 100%;
}

.case3-arrow a i {
  color: var(--ztc-bg-bg-1);
  transform: rotate(-45deg);
  font-size: 24px;
  margin-top: 15px;
}

/*============= CASE STUDY CSS AREA ENDS ===============*/
/*# sourceMappingURL=main.css.map */