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

Name:  RoofPro- Roofing Company Template
Version: 1.0.0
Description: RoofPro- Roofing Company Template
Author: Vikiglab
Author URI: https://themeforest.net/user/vikinglab/portfolio
Location:
-----------------------------------------------------------------------------------

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

-----------------
01 THEME CSS
-----------------
	 Theme Default
	 Common Classes
	 Default Spacing

-----------------
 02 COMPONENTS css
-----------------
	 ABOUT CSS AREA
	 MOBILE MENU CSS AREA
	 SERVICE CSS AREA
-----------------
 03 LAYOUT CSS
-----------------
	 PAGES
	 BLOG
	 HEADER
	 FOOTER
	 MENU

---------------------------------
 04. MENU CSS
---------------------------------
   HEADER CSS AREA 

--------------------------------- 
 05 BLOG CSS
--------------------------------- 
   BLOG CSS AREA

--------------------------------- 
 06. FOOTER CSS
--------------------------------- 
  FOOTER CSS AREA

---------------------------------  
 07. PAGES CSS 
---------------------------------  
   CHOOSE CSS AREA 
   CONTACT CSS AREA  
   CTA CSS AREA 
   FAQ CSS AREA 
   OTHERS CSS AREA STARTS 
   PRICING CSS AREA 
   PROEJCTS CSS AREA STARTS 
   SKILLS CSS AREA STARTS
   TEAM CSS AREA
   TESTIMONIAL CSS AREA
   WORK CSS AREA
   CASE STUDY CSS

**********************************************/
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");
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(-50%) translateY(-50%) translateZ(0) scale(1);
opacity: 1;
}
100% {
transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
opacity: 0;
}
}
.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: #ffffff;
--ztc-text-text-2: #0F0D0D;
--ztc-text-text-3: #5B5D61;
--ztc-text-text-4: #000000;
--ztc-text-text-5: #5d5e62;
--ztc-text-text-6: #EC4A05;
--ztc-text-text-7: #F8CE69;
--ztc-text-text-8: #1C1853;
--ztc-text-text-9: #00091B;
--ztc-text-text-10: #42464D;
--ztc-text-text-11: #ffffff;
--ztc-text-text-12: #000814;
--ztc-text-text-13: #EC4A05;
--ztc-text-text-14: #F61E26;
--ztc-text-text-15: #12161F;
--ztc-text-text-16: #42464D;
--ztc-text-text-17: #F61E26;
--ztc-text-text-18: #727079;
--ztc-bg-bg-1: #fff;
--ztc-bg-bg-2: #0F0D0D;
--ztc-bg-bg-3: #000000;
--ztc-bg-bg-4: #F2F2F2;
--ztc-bg-bg-5: #00a6e4;
--ztc-bg-bg-6: #F4F4F9;
--ztc-bg-bg-7: #EC4A05;
--ztc-bg-bg-8: #F5F3F4;
--ztc-bg-bg-9: #F8CE69;
--ztc-bg-bg-10: #F5F3F4;
--ztc-bg-bg-11: #1C1853;
--ztc-bg-bg-12: #00091B;
--ztc-bg-bg-13: #155FFF;
--ztc-bg-bg-14: #F6F8FA;
--ztc-bg-bg-15: #000814;
--ztc-bg-bg-16: #EC4A05;
--ztc-bg-bg-17: #F8EECA;
--ztc-bg-bg-18: #333943;
--ztc-bg-bg-19: #F61E26;
--ztc-bg-bg-20: #12161F;
--ztc-bg-bg-21: #F61E26;
--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: 'Plus Jakarta Sans', serif;
--ztc-family-font2: 'Plus Jakarta Sans', serif;
}

/*============= ABOUT CSS AREA ===============*/
.about1 {
position: relative;
z-index: 1;
overflow: hidden;
}
.about1 .about-imges-area {
position: relative;
z-index: 1;
}
.about1 .about-imges-area .image-counter-area {
position: relative;
z-index: 1;
}
.about1 .about-imges-area .image-counter-area .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 100px 8px 8px 8px;
}
.about1 .about-imges-area .image-counter-area .experiance-box {
background: var(--ztc-bg-bg-2);
border-radius: 8px;
padding: 24px;
text-align: center;
}
.about1 .about-imges-area .image-counter-area .experiance-box h2 {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 44px;
}
.about1 .about-imges-area .image-counter-area .experiance-box p {
color: rgba(255, 255, 255, 0.9);
text-align: center;
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;
}
@media (max-width: 767px) {
.about1 .about-imges-area .img2 {
margin-top: 30px;
}
}
.about1 .about-imges-area .img2 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 100px 8px;
}
.about1 .heading1 {
padding: 0 0 0 50px;
}
@media (max-width: 767px) {
.about1 .heading1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about1 .heading1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about1 .heading1 {
padding: 0;
margin-top: 30px;
}
}
.about1 .heading1 ul li {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
padding-top: 20px;
display: flex;
align-items: center;
}
@media (max-width: 767px) {
.about1 .heading1 ul li {
line-height: 24px;
}
}
.about1 .heading1 ul li img {
margin: 0 6px 0 0;
}

.about2 {
position: relative;
z-index: 1;
overflow: hidden;
}
.about2 .images-area {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.about2 .images-area {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about2 .images-area {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about2 .images-area {
margin-bottom: 30px;
}
}
.about2 .images-area .img1 img {
width: 100%;
height: 580px;
border-radius: 8px;
}
@media (max-width: 767px) {
.about2 .images-area .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}
.about2 .images-area .img2 {
position: relative;
z-index: 1;
right: 60px;
text-align: end;
margin-top: -370px;
}
@media (max-width: 767px) {
.about2 .images-area .img2 {
right: 0;
margin-top: 30px;
text-align: start;
}
}
.about2 .images-area .img2 img {
width: 270px;
height: 480px;
border-radius: 8px;
padding: 8px;
background: var(--ztc-bg-bg-1);
}
@media (max-width: 767px) {
.about2 .images-area .img2 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}
.about2 .heading2 .about-boxarea {
background: var(--ztc-bg-bg-6);
padding: 20px;
border-radius: 8px;
transition: all 0.4s;
margin-top: 20px;
}
.about2 .heading2 .about-boxarea:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.about2 .heading2 .about-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
background: var(--ztc-bg-bg-5);
}
.about2 .heading2 .about-boxarea:hover .icons img {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.about2 .heading2 .about-boxarea .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
border-radius: 50%;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
display: inline-block;
position: absolute;
}
@media (max-width: 767px) {
.about2 .heading2 .about-boxarea .icons {
position: relative;
}
}
.about2 .heading2 .about-boxarea .icons img {
transition: all 0.4s;
}
.about2 .heading2 .about-boxarea .content {
padding-left: 100px;
}
@media (max-width: 767px) {
.about2 .heading2 .about-boxarea .content {
padding-left: 0;
margin-top: 24px;
}
}
.about2 .heading2 .about-boxarea .content 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.about2 .heading2 .about-boxarea .content a {
line-height: 26px;
}
}
.about2 .heading2 .about-boxarea .content a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}

.about3 {
position: relative;
z-index: 1;
overflow: hidden;
}
@media (max-width: 767px) {
.about3 .img1 {
margin-top: 30px;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about3 .img1 {
margin-top: 30px;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about3 .img1 {
margin-top: 30px;
margin-bottom: 30px;
}
}
.about3 .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about3 .img1 img {
height: 400px;
}
}
.about3 .about-accordion-area .accordion .accordion-item {
border: none;
background: var(--ztc-bg-bg-7);
border-radius: 8px;
}
.about3 .about-accordion-area .accordion .accordion-item h2 button {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
border: none;
outline: none;
background: var(--ztc-bg-bg-1);
border-radius: 6px;
box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.09);
}
.about3 .about-accordion-area .accordion .accordion-item h2 button:not(.collapsed) {
background: none;
transition: all 0.4s;
color: var(--ztc-text-text-1);
box-shadow: none;
}
.about3 .about-accordion-area .accordion .accordion-item h2 button:not(.collapsed)::after {
filter: brightness(0) invert(1);
}
.about3 .about-accordion-area .accordion .accordion-item .accordion-body p {
color: rgba(255, 255, 255, 0.8);
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: 26px;
}

.about4 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-6);
}
.about4 .images-content {
position: relative;
z-index: 1;
}
.about4 .images-content .elements4 {
position: absolute;
right: -30px;
top: -30px;
}
.about4 .images-content .img1 img {
height: 500px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about4 .images-content .img1 img {
height: 400px;
}
}
.about4 .images-content .content-area {
display: flex;
align-items: center;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.09);
width: 310px;
padding: 24px;
position: absolute;
right: -100px;
bottom: 60px;
}
@media (max-width: 767px) {
.about4 .images-content .content-area {
position: relative;
right: 0;
bottom: 0;
margin-top: 30px;
width: 100%;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about4 .images-content .content-area {
position: relative;
right: 0;
bottom: 0;
margin-top: 30px;
width: 100%;
}
}
.about4 .images-content .content-area .text {
padding: 0 12px 0 0;
border-right: 1px solid var(--ztc-bg-bg-10);
margin: 0 12px 0 0;
}
@media (max-width: 767px) {
.about4 .heading4 {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about4 .heading4 {
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about4 .heading4 {
margin-top: 30px;
}
}
.about4 .heading4 .pera {
padding-bottom: 32px;
border-bottom: 1px solid var(--ztc-bg-bg-10);
}
.about4 .heading4 .about-boxarea {
margin-top: 32px;
}
.about4 .heading4 .about-boxarea 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-bold);
line-height: 28px;
display: inline-block;
transition: all 0.4s;
}
.about4 .heading4 .about-boxarea a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}

.about5 {
position: relative;
z-index: 1;
overflow: hidden;
}
.about5 .about5-images-area {
position: relative;
z-index: 1;
}
.about5 .about5-images-area .img1 {
position: relative;
z-index: 1;
margin-bottom: -160px;
}
@media (max-width: 767px) {
.about5 .about5-images-area .img1 {
margin-bottom: 30px;
}
}
.about5 .about5-images-area .img1 img {
border-radius: 16px;
}
@media (max-width: 767px) {
.about5 .about5-images-area .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}
.about5 .about5-images-area .img2 img {
border-radius: 16px;
}
@media (max-width: 767px) {
.about5 .about5-images-area .img2 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about5 .about5-images-area .img2 img {
width: 100%;
height: 450px;
-o-object-fit: cover;
   object-fit: cover;
}
}
.about5 .about5-images-area .content {
display: flex;
align-items: center;
position: absolute;
right: 80px;
top: 60px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about5 .about5-images-area .content {
right: 50px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.about5 .about5-images-area .content {
right: 0;
}
}
.about5 .about5-images-area .content p {
padding-left: 10px;
}
.about5 .about-heading {
padding: 0 0 0 50px;
}
@media (max-width: 767px) {
.about5 .about-heading {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about5 .about-heading {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.about5 .about-heading {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about5 .about-heading {
padding: 0;
margin-top: 30px;
}
}
.about5 .about-heading ul li {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 24px;
padding: 24px 0;
}
@media (max-width: 767px) {
.about5 .about-heading ul li {
line-height: 32px;
}
}
.about5 .about-heading ul li:nth-child(1) {
border-bottom: 1px solid var(--ztc-bg-bg-4);
}
.about5 .about-heading ul li:nth-child(2) {
border-bottom: 1px solid var(--ztc-bg-bg-4);
}

.about7-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.about7-section .about7-images {
position: relative;
z-index: 1;
}
.about7-section .about7-images .cirle-progress {
width: 180px;
height: 180px;
border-radius: 50%;
background: var(--ztc-bg-bg-12);
text-align: center;
line-height: 172px;
position: absolute;
z-index: 2;
left: 60%;
top: 25%;
}
@media (max-width: 767px) {
.about7-section .about7-images .cirle-progress {
left: 50%;
top: 50%;
margin-left: -90px;
margin-top: -90px;
}
}
.about7-section .about7-images .cirle-progress svg {
position: absolute;
left: 50%;
z-index: 2;
top: 50%;
margin-top: -34px;
margin-left: -34px;
}
.about7-section .about7-images .img1 img {
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about7-section .about7-images .img1 img {
width: 100%;
height: 420px;
-o-object-fit: cover;
   object-fit: cover;
}
}
.about7-section .about7-images .img2 {
position: relative;
z-index: 1;
margin-top: -150px;
}
@media (max-width: 767px) {
.about7-section .about7-images .img2 {
margin-top: 30px;
}
}
.about7-section .about7-images .img2 img {
border-radius: 8px;
}
@media (max-width: 767px) {
.about7-section .about7-images .img2 img {
width: 100%;
height: 420px;
-o-object-fit: cover;
   object-fit: cover;
}
}
.about7-section .about-7 {
padding: 0 0 0 50px;
}
@media (max-width: 767px) {
.about7-section .about-7 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about7-section .about-7 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about7-section .about-7 {
padding: 0;
margin-top: 30px;
}
}
.about7-section .about-7 .about7-list li {
color: var(--ztc-text-text-9);
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;
margin-top: 18px;
}
.about7-section .about-7 .about7-list li img {
margin: 0 4px 0 0;
}

.about8-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.about8-section .about8-heading {
padding: 0 80px 0 0;
}
@media (max-width: 767px) {
.about8-section .about8-heading {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about8-section .about8-heading {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about8-section .about8-heading {
padding: 0;
margin-bottom: 30px;
}
}
.about8-section .about8-heading .label {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
color: var(--ztc-text-text-12);
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;
}
.about8-section .about8-heading .progress-container {
width: 100%;
background-color: var(--ztc-bg-bg-17);
border-radius: 5px;
height: 8px;
}
.about8-section .about8-heading .progress-bar {
height: 8px;
background-color: var(--ztc-bg-bg-15);
border-radius: 5px;
}
.about8-section .about8-heading .commercial .progress-bar {
width: 90%;
}
.about8-section .about8-heading .residential .progress-bar {
width: 95%;
}
.about8-section .img1 img {
height: 100%;
width: 100%;
overflow: hidden;
transition: all 0.4s;
border-radius: 8px;
-o-object-fit: cover;
 object-fit: cover;
}
@media (max-width: 767px) {
.about8-section .img1 img {
height: 250px;
margin-bottom: 30px;
-o-object-fit: cover;
   object-fit: cover;
}
}

.about-inner {
position: relative;
z-index: 1;
overflow: hidden;
background-color: #E9F6FC;
}
.about-inner .about-content-area {
position: relative;
z-index: 1;
}
.about-inner .about-content-area .img1 img {
height: 300px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about-inner .about-content-area .img1 img {
height: 400px;
}
}
.about-inner .about-content-area .counter-area {
margin-top: 32px;
}
.about-inner .heading1 {
padding: 0 0 0 40px;
}
@media (max-width: 767px) {
.about-inner .heading1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about-inner .heading1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about-inner .heading1 {
padding: 0;
margin-top: 30px;
}
}
.about-inner .heading1 .img1 img {
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
height: 100%;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about-inner .heading1 .img1 img {
height: 400px;
}
}

.about9-section {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
}
@media (max-width: 767px) {
.about9-section {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about9-section {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about9-section {
margin: 0;
}
}
.about9-section .about9-boxarea {
position: relative;
z-index: 1;
transition: all 0.4s;
background: var(--ztc-bg-bg-14);
padding: 30px;
border-radius: 12px;
}
.about9-section .about9-boxarea:hover {
background: var(--ztc-bg-bg-19);
transition: all 0.4s;
transform: translateY(-5px);
}
.about9-section .about9-boxarea:hover .icons img {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.about9-section .about9-boxarea:hover .content-area a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.about9-section .about9-boxarea:hover .content-area p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.about9-section .about9-boxarea .icons {
height: 48px;
width: 48px;
text-align: center;
line-height: 48px;
border-radius: 4px;
display: inline-block;
transition: all 0.4s;
position: absolute;
}
.about9-section .about9-boxarea .icons img {
transition: all 0.4s;
}
.about9-section .about9-boxarea .content-area {
padding-left: 75px;
}
.about9-section .about9-boxarea .content-area a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
text-transform: capitalize;
}
@media (max-width: 767px) {
.about9-section .about9-boxarea .content-area a {
font-size: var(--ztc-font-size-font-s18);
line-height: 18px;
}
}
.about9-section .about9-boxarea .content-area p {
color: var(--ztc-text-text-10);
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;
transition: all 0.4s;
}
@media (max-width: 767px) {
.about9-section .about9-boxarea .content-area p {
line-height: 24px;
}
}
@media (max-width: 767px) {
.about9-section .img1 {
margin-top: 30px;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about9-section .img1 {
margin-top: 30px;
margin-bottom: 30px;
}
}
.about9-section .img1 img {
height: 500px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}

.about10-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.about10-section .about6-images-area {
position: relative;
z-index: 1;
}
.about10-section .about6-images-area .elements21 {
width: 240px;
height: 64px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
position: absolute;
top: 100px;
left: -50px;
}
@media (max-width: 767px) {
.about10-section .about6-images-area .elements21 {
display: none;
}
}
.about10-section .about6-images-area .elements22 {
position: absolute;
bottom: 0;
left: 0;
}
@media (max-width: 767px) {
.about10-section .about6-images-area .elements22 {
right: 0;
}
}
.about10-section .about6-images-area .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 50%;
}
.about10-section .about6-images-area .img2 {
position: absolute;
top: 0;
right: 100px;
}
@media (max-width: 767px) {
.about10-section .about6-images-area .img2 {
right: 0;
}
}
.about10-section .about6-images-area .img2 img {
width: 100px;
-o-object-fit: cover;
 object-fit: cover;
height: 100px;
border-radius: 50%;
}
.about10-section .heading10 {
padding: 0 0 0 50px;
}
@media (max-width: 767px) {
.about10-section .heading10 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.about10-section .heading10 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.about10-section .heading10 {
padding: 0;
margin-top: 30px;
}
}
.about10-section .heading10 .about-counter-boxarea {
margin-top: 30px;
}
.about10-section .heading10 .about-counter-boxarea h2 span {
color: var(--ztc-text-text-12);
}

/*============= ABOUT CSS AREA ENDS ===============*/
/*============= SERVICE CSS AREA ===============*/
.service1 {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
overflow: hidden;
}
.service1 .service1-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 24px 24px 32px 24px;
transition: all 0.4s;
text-align: center;
margin-bottom: 30px;
}
.service1 .service1-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.service1 .service1-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.service1 .service1-boxarea:hover .content-area .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
}
.service1 .service1-boxarea:hover .content-area .icons img {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.service1 .service1-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.service1 .service1-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.service1 .service1-boxarea .content-area .icons {
height: 70px;
width: 70px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-4);
text-align: center;
line-height: 70px;
}
.service1 .service1-boxarea .content-area .icons img {
transition: all 0.4s;
}
.service1 .service1-boxarea .content-area .title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px; /* 100% */
display: inline-block;
transition: all 0.4s;
}
.service1 .service1-boxarea .content-area .title:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
@media (max-width: 767px) {
.service1 .service1-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s20);
line-height: 28px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service1 .service1-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s22);
line-height: 28px;
}
}
.service1 .service1-boxarea .content-area .readmore {
color: var(--ztc-text-text-4);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
}
.service1 .service1-boxarea .content-area .readmore:hover {
color: var(--ztc-text-text-2);
transition: all 0.4s;
}
.service1 .service1-boxarea .content-area .readmore i {
margin: 0 0 0 4px;
}

.service2 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-6);
}
.service2 .service2-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-1);
padding: 24px;
border-radius: 8px;
transition: all 0.4s;
margin-bottom: 30px;
}
.service2 .service2-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.service2 .service2-boxarea:hover .image-icons .icons {
background: var(--ztc-bg-bg-5);
transition: all 0.6s;
left: 0;
border-radius: 0 8px 0 0;
}
.service2 .service2-boxarea:hover .image-icons .img1 img {
transform: scale(1.1) rotate(4deg);
transition: all 0.4s;
}
.service2 .service2-boxarea .image-icons {
position: relative;
z-index: 1;
}
.service2 .service2-boxarea .image-icons .img1 {
position: relative;
z-index: 1;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.service2 .service2-boxarea .image-icons .img1 img {
width: 100%;
height: 244px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.service2 .service2-boxarea .image-icons .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
background: var(--ztc-bg-bg-2);
display: inline-block;
position: absolute;
bottom: 0;
left: -24px;
z-index: 2;
transition: all 0.6s;
}
.service2 .service2-boxarea .content-area {
background: var(--ztc-bg-bg-6);
padding: 24px;
}
.service2 .service2-boxarea .content-area .title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service2 .service2-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s20);
line-height: 20px;
}
}
@media (max-width: 767px) {
.service2 .service2-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s20);
line-height: 20px;
}
}
.service2 .service2-boxarea .content-area .title:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.service2 .service2-boxarea .content-area p {
color: var(--ztc-text-text-3);
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: 28px;
}
.service2 .service2-boxarea .content-area .readmore {
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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.service2 .service2-boxarea .content-area .readmore:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.service2 .service2-boxarea .content-area .readmore:hover i {
transform: rotate(0);
transition: all 0.4s;
}
.service2 .service2-boxarea .content-area .readmore i {
margin-left: 4px;
transform: rotate(-45deg);
transition: all 0.4s;
}

.service3 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-8);
}
.service3 .tabs-button {
position: relative;
z-index: 1;
}
.service3 .tabs-button ul {
display: inline-block !important;
}
.service3 .tabs-button ul li {
display: inline-block;
width: 100%;
text-align: start;
margin-bottom: 16px;
}
.service3 .tabs-button ul li:nth-last-child(1) {
margin-bottom: 0;
}
.service3 .tabs-button ul li button {
background: var(--ztc-bg-bg-1);
width: 100%;
border: none;
outline: none;
text-align: start;
}
.service3 .tabs-button ul li button.active {
background: var(--ztc-bg-bg-7);
transition: all 0.4s;
}
.service3 .tabs-button ul li button.active .title {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service3 .tabs-button ul li button span.icons {
height: 50px;
width: 50px;
text-align: center;
line-height: 50px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-8);
}
.service3 .tabs-button ul li button .title {
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-bold);
line-height: 20px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
padding-left: 16px;
}
@media (max-width: 767px) {
.service3 .tabs-button ul li button .title {
font-size: var(--ztc-font-size-font-s18);
line-height: 18px;
}
}
.service3 .main-content-boxarea .main-content-area {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 32px 40px;
}
@media (max-width: 767px) {
.service3 .main-content-boxarea .main-content-area {
padding: 20px;
}
}
.service3 .main-content-boxarea .main-content-area .img1 img {
height: 370px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media (max-width: 767px) {
.service3 .main-content-boxarea .main-content-area .content-area {
margin-top: 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service3 .main-content-boxarea .main-content-area .content-area {
margin-top: 20px;
}
}
.service3 .main-content-boxarea .main-content-area .content-area a.title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 24px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.service3 .main-content-boxarea .main-content-area .content-area a.title:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.service3 .main-content-boxarea .main-content-area .content-area p {
color: var(--ztc-text-text-3);
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: 26px;
text-transform: capitalize;
}
.service3 .main-content-boxarea .main-content-area .content-area ul li {
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 26px;
text-transform: capitalize;
margin-top: 16px;
}
.service3 .main-content-boxarea .main-content-area .content-area ul li img {
margin: 0 4px 0 0;
}

.service4 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-10);
}
.service4 .heading4 h5 {
background: var(--ztc-bg-bg-1);
}
.service4 .service4-wdiget-boxarea {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 32px;
transition: all 0.4s;
margin-bottom: 30px;
}
.service4 .service4-wdiget-boxarea:hover {
background: var(--ztc-bg-bg-9);
transition: all 0.4s;
transform: translateY(-10px);
}
.service4 .service4-wdiget-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
}
.service4 .service4-wdiget-boxarea:hover .elements5 {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.service4 .service4-wdiget-boxarea .elements5 {
position: absolute;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
z-index: -1;
}
.service4 .service4-wdiget-boxarea .icons {
height: 80px;
width: 80px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-10);
text-align: center;
line-height: 80px;
border-radius: 50%;
}
.service4 .service4-wdiget-boxarea .content-area .title {
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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.service4 .service4-wdiget-boxarea .content-area .title:hover {
text-decoration: underline;
transition: all 0.4s;
}
.service4 .service4-wdiget-boxarea .content-area p {
color: var(--ztc-text-text-3);
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: 26px;
}
.service4 .service4-wdiget-boxarea .content-area .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.service4 .service4-wdiget-boxarea .content-area .readmore:hover {
text-decoration: underline;
transition: all 0.4s;
}
.service4 .service4-wdiget-boxarea .content-area .readmore i {
margin-left: 4px;
transition: all 0.4s;
}

.service5 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-4);
}
.service5 .service5-boxarea {
position: relative;
z-index: 1;
transition: all 0.4s;
margin-bottom: 30px;
margin-right: 30px;
}
@media (max-width: 767px) {
.service5 .service5-boxarea {
margin-left: 30px;
margin-right: 0;
}
}
.service5 .service5-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.service5 .service5-boxarea:hover .icons {
top: 24px;
margin-top: 0;
transform: rotateY(-180deg);
}
.service5 .service5-boxarea:hover .content-area {
background: var(--ztc-bg-bg-11);
transition: all 0.4s;
}
.service5 .service5-boxarea:hover .content-area .title {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service5 .service5-boxarea:hover .content-area a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service5 .service5-boxarea:hover .content-area p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service5 .service5-boxarea .icons {
height: 48px;
width: 48px;
text-align: center;
line-height: 48px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.09);
position: absolute;
top: 50%;
margin-top: -24px;
z-index: 2;
left: -24px;
}
.service5 .service5-boxarea .content-area {
background: var(--ztc-bg-bg-1);
padding: 24px 24px 24px 44px;
position: relative;
z-index: 1;
border-radius: 8px;
transition: all 0.4s;
}
.service5 .service5-boxarea .content-area a.title {
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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.service5 .service5-boxarea .content-area p {
color: var(--ztc-text-text-3);
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: 26px;
transition: all 0.4s;
}
.service5 .service5-boxarea .content-area .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.service5 .service5-boxarea .content-area .readmore i {
margin-left: 4px;
transition: all 0.4s;
}

.service7-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.service7-section .sevice7-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
margin-bottom: 30px;
}
.service7-section .sevice7-boxarea:hover .content-area {
bottom: 30px;
transition: all 0.8s;
}
.service7-section .sevice7-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.service7-section .sevice7-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.service7-section .sevice7-boxarea .img1::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
border-radius: 12px;
background: linear-gradient(180deg, rgba(0, 8, 20, 0.8) 0%, rgba(0, 8, 20, 0.2) 100%);
bottom: 0;
border-radius: 8px;
}
.service7-section .sevice7-boxarea .img1 img {
height: 400px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.service7-section .sevice7-boxarea .content-area {
position: absolute;
bottom: -150px;
z-index: 2;
left: 30px;
right: 30px;
display: inline-block;
transition: all 0.8s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service7-section .sevice7-boxarea .content-area {
bottom: -172px;
}
}
@media (max-width: 767px) {
.service7-section .sevice7-boxarea .content-area {
bottom: -172px;
}
}
.service7-section .sevice7-boxarea .content-area .icons {
height: 72px;
width: 72px;
text-align: center;
line-height: 72px;
background: var(--ztc-bg-bg-1);
border-radius: 50%;
transition: all 0.4s;
display: inline-block;
}
.service7-section .sevice7-boxarea .content-area .title {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.service7-section .sevice7-boxarea .content-area .title:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.service7-section .sevice7-boxarea .content-area p {
color: rgba(255, 255, 255, 0.9);
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: 24px;
}

.service8-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.service8-section .service8-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-17);
padding: 30px;
border-radius: 8px;
transition: all 0.4s;
margin-bottom: 30px;
}
.service8-section .service8-boxarea:hover::after {
height: 100%;
width: 100%;
transition: all 0.4s;
}
.service8-section .service8-boxarea:hover .service-img25 {
height: 100%;
transition: all 0.4s;
}
.service8-section .service8-boxarea:hover .icons {
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
}
.service8-section .service8-boxarea:hover .icons img {
filter: brightness(0);
transition: all 0.4s;
}
.service8-section .service8-boxarea:hover .arrow a {
background: var(--ztc-bg-bg-16);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.service8-section .service8-boxarea:hover .content-area a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service8-section .service8-boxarea:hover .content-area p {
color: var(--ztc-text-text-1);
opacity: 80%;
transition: all 0.4s;
}
.service8-section .service8-boxarea:hover .content-area h4 {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service8-section .service8-boxarea::after {
position: absolute;
content: "";
height: 0;
width: 100%;
left: 0;
top: 0;
transition: all 0.4s;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
z-index: -1;
opacity: 50%;
}
.service8-section .service8-boxarea .service-img25 {
position: absolute;
z-index: -2;
transition: all 0.4s;
height: 0;
width: 100%;
border-radius: 8px;
left: 0;
top: 0;
}
.service8-section .service8-boxarea .b-shape1 {
position: absolute;
right: 0;
top: 0;
}
.service8-section .service8-boxarea .arrow a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
border-radius: 50%;
display: inline-block;
background: var(--ztc-bg-bg-17);
transition: all 0.4s;
color: var(--ztc-text-text-12);
transform: rotate(-45deg);
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
.service8-section .service8-boxarea .arrow a:hover {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
transform: rotate(0);
}
.service8-section .service8-boxarea .icons {
height: 72px;
width: 72px;
text-align: center;
line-height: 72px;
display: inline-block;
border-radius: 50%;
transition: all 0.4s;
background: var(--ztc-bg-bg-16);
}
.service8-section .service8-boxarea .icons img {
transition: all 0.4s;
}
.service8-section .service8-boxarea .content-area a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
transition: all 0.4s;
display: inline-block;
}
@media (max-width: 767px) {
.service8-section .service8-boxarea .content-area a {
font-size: var(--ztc-font-size-font-s20);
line-height: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service8-section .service8-boxarea .content-area a {
font-size: var(--ztc-font-size-font-s20);
line-height: 24px;
}
}
.service8-section .service8-boxarea .content-area a:hover {
color: var(--ztc-text-text-13);
transition: all 0.4s;
}
.service8-section .service8-boxarea .content-area p {
color: var(--ztc-text-text-10);
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: 24px;
transition: all 0.4s;
}
.service8-section .service8-boxarea .content-area h4 {
color: var(--ztc-text-text-12);
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;
position: relative;
z-index: 1;
transition: all 0.4s;
}
.service8-section .service8-boxarea .content-area h4::after {
position: absolute;
content: "";
height: 1px;
width: 93%;
left: 0;
bottom: 5px;
background: #CECECE;
}

.service-inner-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.service-inner-area .service2-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-4);
padding: 24px;
border-radius: 8px;
transition: all 0.4s;
margin-bottom: 30px;
}
.service-inner-area .service2-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.service-inner-area .service2-boxarea:hover .image-icons .icons {
background: var(--ztc-bg-bg-3);
transition: all 0.6s;
left: 0;
border-radius: 0 8px 0 0;
}
.service-inner-area .service2-boxarea:hover .image-icons .img1 img {
transform: scale(1.1) rotate(4deg);
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .image-icons {
position: relative;
z-index: 1;
}
.service-inner-area .service2-boxarea .image-icons .img1 {
position: relative;
z-index: 1;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .image-icons .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .image-icons .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
background: var(--ztc-bg-bg-2);
display: inline-block;
position: absolute;
bottom: 0;
left: -24px;
z-index: 2;
transition: all 0.6s;
}
.service-inner-area .service2-boxarea .content-area {
background: var(--ztc-bg-bg-1);
padding: 24px;
}
.service-inner-area .service2-boxarea .content-area .title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service-inner-area .service2-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s20);
line-height: 20px;
}
}
@media (max-width: 767px) {
.service-inner-area .service2-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s20);
line-height: 20px;
}
}
.service-inner-area .service2-boxarea .content-area .title:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .content-area p {
color: var(--ztc-text-text-3);
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: 28px;
}
.service-inner-area .service2-boxarea .content-area .readmore {
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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .content-area .readmore:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .content-area .readmore:hover i {
transform: rotate(0);
transition: all 0.4s;
}
.service-inner-area .service2-boxarea .content-area .readmore i {
margin-left: 4px;
transform: rotate(-45deg);
transition: all 0.4s;
}

.service-details-section {
position: relative;
z-index: 1;
}
.service-details-section .service-side-details {
position: sticky;
top: 120px;
transition: all 0.4s;
}
.service-details-section .service-side-details .service-post-widget h3 {
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-bold);
line-height: 20px;
}
.service-details-section .service-side-details .service-post-widget .search-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.service-details-section .service-side-details .service-post-widget .search-area form {
position: relative;
z-index: 1;
}
.service-details-section .service-side-details .service-post-widget .search-area form input {
width: 100%;
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-regular);
line-height: 16px;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 16px;
}
.service-details-section .service-side-details .service-post-widget .search-area form input::-moz-placeholder {
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-regular);
line-height: 16px;
opacity: 70%;
}
.service-details-section .service-side-details .service-post-widget .search-area form input::placeholder {
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-regular);
line-height: 16px;
opacity: 70%;
}
.service-details-section .service-side-details .service-post-widget .search-area form button {
border: none;
outline: none;
height: 52px;
width: 52px;
text-align: center;
line-height: 48px;
border-radius: 0 8px 8px 0;
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
position: absolute;
right: 0;
top: 0;
}
.service-details-section .service-side-details .service-post-widget .categories-area {
border-radius: 8px;
background: #00a6e4;
padding: 24px 20px;
}
.service-details-section .service-side-details .service-post-widget .categories-area ul li a {
display: flex;
align-items: center;
justify-content: space-between;
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 20px 20px;
transition: all 0.4s;
margin-top: 20px;
}
.service-details-section .service-side-details .service-post-widget .categories-area ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.service-details-section .service-side-details .service-post-widget .categories-area ul li a:hover span {
transform: rotate(90deg);
transition: all 0.4s;
background: #3172FF;
color: var(--ztc-text-text-1);
}
.service-details-section .service-side-details .service-post-widget .categories-area ul li a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-4);
border-radius: 36px;
background: rgba(21, 95, 255, 0.1);
transition: all 0.4s;
}
.service-details-section .service-side-details .service-post-widget .help-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.service-details-section .service-side-details .service-post-widget .help-area h3 {
line-height: 28px;
}
.service-details-section .service-side-details .service-post-widget .help-area .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
border-radius: 8px;
background: var(--ztc-bg-bg-3);
padding: 10px 16px;
display: inline-block;
transition: all 0.4s;
}
.service-details-section .service-side-details .service-post-widget .help-area .btn-area1 a:hover {
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
}
.service-details-section .service-side-details .service-post-widget .help-area .btn-area1 a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: inline-block;
transition: all 0.4s;
margin: 0 4px 0 0;
}
.service-details-section .service-side-details .service-post-widget .social-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.service-details-section .service-side-details .service-post-widget .social-area ul li {
display: inline-block;
margin: 0 6px 0 0;
}
.service-details-section .service-side-details .service-post-widget .social-area ul li:last-child {
margin: 0;
}
.service-details-section .service-side-details .service-post-widget .social-area ul li a {
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
color: var(--ztc-text-text-2);
display: inline-block;
font-size: var(--ztc-font-size-font-s20);
}
.service-details-section .service-side-details .service-post-widget .social-area ul li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 28px;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area {
margin-top: 16px;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area input {
width: 100%;
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;
padding: 20px;
border-radius: 4px;
background: var(--ztc-bg-bg-1);
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area textarea {
width: 100%;
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;
padding: 20px;
border-radius: 4px;
background: var(--ztc-bg-bg-1);
height: 120px;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
}
.service-details-section .service-side-details .service-post-widget .contact-boxarea .input-area button {
border: none;
outline: none;
}
.service-details-section .service-main-detailsarea {
position: relative;
z-index: 1;
}
.service-details-section .service-main-detailsarea.padding1 {
padding: 0 0 0 40px;
}
@media (max-width: 767px) {
.service-details-section .service-main-detailsarea.padding1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service-details-section .service-main-detailsarea.padding1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.service-details-section .service-main-detailsarea.padding1 {
padding: 0;
margin-top: 30px;
}
}
.service-details-section .service-main-detailsarea.padding2 {
padding: 0 40px 0 0;
}
@media (max-width: 767px) {
.service-details-section .service-main-detailsarea.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service-details-section .service-main-detailsarea.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.service-details-section .service-main-detailsarea.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
.service-details-section .service-main-detailsarea h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
}
.service-details-section .service-main-detailsarea .service-arrows {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.service-details-section .service-main-detailsarea .service-arrows {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service-details-section .service-main-detailsarea .service-arrows {
margin-top: 30px;
}
}
.service-details-section .service-main-detailsarea .service-arrows .testimonial-arrows {
display: flex;
align-items: center;
}
.service-details-section .service-main-detailsarea .service-arrows .testimonial-arrows .testimonial-prev-arrow-sinner {
position: absolute;
top: 50%;
margin-top: -28px;
z-index: 2;
left: 30px;
}
.service-details-section .service-main-detailsarea .service-arrows .testimonial-arrows .testimonial-next-arrow-sinner {
position: absolute;
top: 50%;
margin-top: -28px;
z-index: 2;
right: 30px;
}
.service-details-section .service-main-detailsarea .service-arrows .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.service-details-section .service-main-detailsarea .service-arrows .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.service-details-section .service-main-detailsarea .service-arrows .service-slider-images {
position: relative;
z-index: 1;
}
.service-details-section .service-main-detailsarea .service-arrows .service-slider-images .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.service-details-section .service-main-detailsarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
}
@media (max-width: 767px) {
.service-details-section .service-main-detailsarea .img1 {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service-details-section .service-main-detailsarea .img1 {
margin-bottom: 30px;
}
}
.service-details-section .service-main-detailsarea .img1 .play a {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
background: var(--ztc-bg-bg-3);
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
color: var(--ztc-text-text-1);
position: absolute;
top: 50%;
left: 50%;
margin-left: -30px;
margin-top: -30px;
font-size: var(--ztc-font-size-font-s20);
}
.service-details-section .service-main-detailsarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.service-details-section .service-main-detailsarea .service-list {
position: relative;
z-index: 1;
}
.service-details-section .service-main-detailsarea .service-list:hover h3 {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.service-details-section .service-main-detailsarea .service-list h3 {
height: 48px;
width: 48px;
text-align: center;
line-height: 48px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-4);
color: var(--ztc-text-text-4);
border-radius: 50%;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
max-width: 48px;
max-height: 48px;
position: absolute;
}
.service-details-section .service-main-detailsarea .service-list .content {
padding-left: 60px;
}
.service-details-section .service-main-detailsarea .service-list .content a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
.service-details-section .service-main-detailsarea .service-list .content a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.service-details-section .service-main-detailsarea .service-listarea ul li {
color: var(--ztc-text-text-3);
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;
margin-top: 16px;
}
.service-details-section .service-main-detailsarea .service-listarea ul li img {
margin: 0 6px 0 0;
}

.service9-section {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
}
@media (max-width: 767px) {
.service9-section {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service9-section {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.service9-section {
margin: 0;
}
}
.service9-section .service9-slider-area {
position: relative;
z-index: 1;
}
.service9-section .service9-slider-area .service9-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
margin: 0 10px;
}
.service9-section .service9-slider-area .service9-boxarea.slick-slide.slick-current.slick-active .content-area {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea:hover .content-area {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea .img1::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
left: 0;
top: 0;
border-radius: 8px;
background: linear-gradient(180deg, rgba(0, 8, 20, 0) 50%, #000814 100%);
}
.service9-section .service9-slider-area .service9-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea .content-area {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 30px 24px;
position: absolute;
left: 24px;
right: 24px;
bottom: 24px;
z-index: 2;
transition: all 0.4s;
visibility: hidden;
opacity: 0;
}
@media (max-width: 767px) {
.service9-section .service9-slider-area .service9-boxarea .content-area {
left: 10px;
right: 10px;
bottom: 10px;
}
}
.service9-section .service9-slider-area .service9-boxarea .content-area .title {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.service9-section .service9-slider-area .service9-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s18);
line-height: 20px;
}
}
@media (max-width: 767px) {
.service9-section .service9-slider-area .service9-boxarea .content-area .title {
font-size: var(--ztc-font-size-font-s18);
line-height: 20px;
}
}
.service9-section .service9-slider-area .service9-boxarea .content-area .title:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea .content-area p {
color: var(--ztc-text-text-10);
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: 24px;
display: inline-block;
}
.service9-section .service9-slider-area .service9-boxarea .content-area .readmore {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: capitalize;
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea .content-area .readmore:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.service9-section .service9-slider-area .service9-boxarea .content-area .readmore i {
margin-left: 4px;
transform: rotate(-45deg);
}
.service9-section .service9-slider-area .service9-boxarea .content-area .arrow a {
height: 48px;
width: 48px;
text-align: center;
line-height: 48px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
font-size: var(--ztc-weight-semibold);
position: absolute;
transform: rotate(-45deg);
right: 24px;
}
.service9-section .service9-slider-area .slick-dots {
display: flex;
justify-content: center;
margin-top: 60px;
}
.service9-section .service9-slider-area .slick-dots li {
margin: 0 8px;
}
.service9-section .service9-slider-area .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: var(--ztc-bg-bg-19);
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.service9-section .service9-slider-area .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
border: 1px solid var(--ztc-text-text-14);
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.service9-section .service9-slider-area .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-19);
}
.service9-section .service9-slider-area .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}

.service10-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
}
.service10-section .service10-slider-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.service10-section .service10-slider-area .slick-dots {
display: flex;
justify-content: center;
margin-top: 40px;
}
.service10-section .service10-slider-area .slick-dots li {
margin: 0 8px;
}
.service10-section .service10-slider-area .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: var(--ztc-bg-bg-19);
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.service10-section .service10-slider-area .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
border: 1px solid var(--ztc-text-text-14);
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.service10-section .service10-slider-area .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-19);
}
.service10-section .service10-slider-area .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
margin: 0 10px;
}
.service10-section .service10-slider-area .service10-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area {
position: relative;
z-index: 1;
padding: 60px 30px 30px 30px;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .icons {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
position: absolute;
top: -30px;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .icons:after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-19);
top: 2px;
transition: all 0.4s;
border-radius: 50%;
z-index: -1;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .icons img {
transition: all 0.4s;
height: 28px;
width: 28px;
display: inline-block;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .title {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: block;
transition: all 0.4s;
text-transform: capitalize;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .title:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area p {
color: var(--ztc-text-text-10);
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: 24px;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .readmore {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .readmore i {
margin-left: 4px;
transition: all 0.4s;
transform: rotate(-45deg);
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .readmore:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.service10-section .service10-slider-area .service10-boxarea .content10-area .readmore:hover i {
transform: rotate(0);
transition: all 0.4s;
}

/*============= SERVICE CSS AREA ENDS===============*/
/*============= 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: 99;
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: 767px) {
.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;
filter: brightness(0) invert(1);
}
.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;
}

.homepage2-body .vl-header-action-item {
float: right;
border: 1px solid var(--ztc-bg-bg-5);
padding: 6px;
border-radius: 4px;
color: var(--ztc-bg-bg-5);
}
.homepage2-body .vl-header-action-item button {
border: none;
outline: none;
background: none;
transition: all 0.4s;
color: var(--ztc-bg-bg-5);
font-size: var(--ztc-font-size-font-s20);
}
.homepage2-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-5);
width: 450px;
z-index: 99;
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) {
.homepage2-body .vl-offcanvas {
width: 100%;
}
}
.homepage2-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage2-body .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: 767px) {
.homepage2-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage2-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage2-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage2-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage2-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage2-body .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;
}
.homepage2-body .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);
}
.homepage2-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage2-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage2-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage2-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage2-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage2-body .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;
}
.homepage2-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage2-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage2-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage2-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage2-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage2-body .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;
}
.homepage2-body .vl-menu-close i {
transition: 0.3s;
}

.homepage3-body .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);
}
.homepage3-body .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);
}
.homepage3-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-7);
width: 450px;
z-index: 99;
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) {
.homepage3-body .vl-offcanvas {
width: 100%;
}
}
.homepage3-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage3-body .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: 767px) {
.homepage3-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage3-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage3-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage3-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage3-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage3-body .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;
}
.homepage3-body .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);
}
.homepage3-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage3-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage3-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage3-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage3-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage3-body .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;
}
.homepage3-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage3-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage3-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage3-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage3-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage3-body .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;
}
.homepage3-body .vl-menu-close i {
transition: 0.3s;
}

.homepage4-body .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);
}
.homepage4-body .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);
}
.homepage4-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-2);
width: 450px;
z-index: 99;
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) {
.homepage4-body .vl-offcanvas {
width: 100%;
}
}
.homepage4-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage4-body .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: 767px) {
.homepage4-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage4-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage4-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage4-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage4-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage4-body .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;
}
.homepage4-body .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);
}
.homepage4-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage4-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage4-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage4-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage4-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage4-body .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;
}
.homepage4-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage4-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage4-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage4-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage4-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage4-body .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;
}
.homepage4-body .vl-menu-close i {
transition: 0.3s;
}

.homepage5-body .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);
}
.homepage5-body .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);
}
.homepage5-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-11);
width: 450px;
z-index: 99;
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) {
.homepage5-body .vl-offcanvas {
width: 100%;
}
}
.homepage5-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage5-body .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: 767px) {
.homepage5-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage5-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage5-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage5-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage5-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage5-body .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;
}
.homepage5-body .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);
}
.homepage5-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage5-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage5-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage5-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage5-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage5-body .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;
}
.homepage5-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage5-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage5-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage5-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage5-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage5-body .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;
}
.homepage5-body .vl-menu-close i {
transition: 0.3s;
}

.homepage7-body .vl-header-action-item {
float: right;
border: 1px solid var(--ztc-text-text-1);
padding: 6px;
border-radius: 4px;
color: var(--ztc-text-text-1);
}
.homepage7-body .vl-header-action-item button {
border: none;
outline: none;
background: none;
transition: all 0.4s;
color: var(--ztc-text-text-1);
font-size: var(--ztc-font-size-font-s20);
}
.homepage7-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-13);
width: 450px;
z-index: 99;
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) {
.homepage7-body .vl-offcanvas {
width: 100%;
}
}
.homepage7-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage7-body .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: 767px) {
.homepage7-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage7-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage7-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage7-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage7-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage7-body .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;
}
.homepage7-body .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);
}
.homepage7-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage7-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage7-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage7-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage7-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage7-body .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;
}
.homepage7-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage7-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage7-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage7-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage7-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage7-body .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;
}
.homepage7-body .vl-menu-close i {
transition: 0.3s;
}

.homepage8-body .vl-header-action-item {
float: right;
border: 1px solid var(--ztc-text-text-12);
padding: 6px;
border-radius: 4px;
color: var(--ztc-text-text-12);
}
.homepage8-body .vl-header-action-item button {
border: none;
outline: none;
background: none;
transition: all 0.4s;
color: var(--ztc-text-text-12);
font-size: var(--ztc-font-size-font-s20);
}
.homepage8-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-16);
width: 450px;
z-index: 99;
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) {
.homepage8-body .vl-offcanvas {
width: 100%;
}
}
.homepage8-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage8-body .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: 767px) {
.homepage8-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage8-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage8-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage8-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage8-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage8-body .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;
}
.homepage8-body .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);
}
.homepage8-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage8-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage8-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage8-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage8-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage8-body .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;
}
.homepage8-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage8-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage8-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage8-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage8-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage8-body .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;
}
.homepage8-body .vl-menu-close i {
transition: 0.3s;
}

.homepage9-body .vl-header-action-item {
float: right;
border: 1px solid var(--ztc-text-text-12);
padding: 6px;
border-radius: 4px;
color: var(--ztc-text-text-12);
}
.homepage9-body .vl-header-action-item button {
border: none;
outline: none;
background: none;
transition: all 0.4s;
color: var(--ztc-text-text-12);
font-size: var(--ztc-font-size-font-s20);
}
.homepage9-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-19);
width: 450px;
z-index: 99;
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) {
.homepage9-body .vl-offcanvas {
width: 100%;
}
}
.homepage9-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage9-body .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: 767px) {
.homepage9-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage9-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage9-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage9-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage9-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage9-body .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;
}
.homepage9-body .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);
}
.homepage9-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage9-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage9-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage9-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage9-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage9-body .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;
}
.homepage9-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage9-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage9-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage9-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage9-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage9-body .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;
}
.homepage9-body .vl-menu-close i {
transition: 0.3s;
}

.homepage10-body .vl-header-action-item {
float: right;
border: 1px solid var(--ztc-text-text-12);
padding: 6px;
border-radius: 4px;
color: var(--ztc-text-text-12);
}
.homepage10-body .vl-header-action-item button {
border: none;
outline: none;
background: none;
transition: all 0.4s;
color: var(--ztc-text-text-12);
font-size: var(--ztc-font-size-font-s20);
}
.homepage10-body .vl-offcanvas {
position: fixed;
background: var(--ztc-bg-bg-19);
width: 450px;
z-index: 99;
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) {
.homepage10-body .vl-offcanvas {
width: 100%;
}
}
.homepage10-body .vl-offcanvas-open {
opacity: 1;
visibility: visible;
transform: translateX(0);
}
.homepage10-body .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: 767px) {
.homepage10-body .vl-offcanvas-header {
margin-bottom: 40px;
}
}
.homepage10-body .vl-offcanvas-title {
font-size: 35px;
color: var(--ztc-text-text-1);
}
.homepage10-body .vl-offcanvas-info span a {
display: block;
color: var(--ztc-text-text-1);
margin-bottom: 10px;
}
.homepage10-body .vl-offcanvas-info span a i {
margin: 0 4px 0 0;
}
.homepage10-body .vl-offcanvas-sm-title {
font-size: var(--ztc-font-size-font-s24);
color: var(--ztc-text-text-1);
}
.homepage10-body .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;
}
.homepage10-body .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);
}
.homepage10-body .vl-offcanvas-overlay-open {
opacity: 0.7;
visibility: visible;
}
.homepage10-body .vl-offcanvas .vl-offcanvas-logo {
height: 50px;
width: 164px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage10-body .vl-offcanvas .vl-offcanvas-close button {
border: none;
background: none;
outline: none;
color: var(--ztc-text-text-1);
}
.homepage10-body .vl-offcanvas-menu ul {
list-style: none;
}
.homepage10-body .vl-offcanvas-menu ul li {
position: relative;
}
.homepage10-body .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;
}
.homepage10-body .vl-offcanvas-menu ul li a span {
display: block;
}
.homepage10-body .vl-offcanvas-menu ul li > a {
border-bottom: none;
}
.homepage10-body .vl-offcanvas-menu ul li.active > a {
color: var(--ztc-text-text-1);
}
.homepage10-body .vl-offcanvas-menu ul li.active > .vl-menu-close i {
transform: rotate(90deg);
}
.homepage10-body .vl-offcanvas-menu ul li .sub-menu {
display: none;
padding-left: 20px;
}
.homepage10-body .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;
}
.homepage10-body .vl-menu-close i {
transition: 0.3s;
}

/*============= MOBILE MENU CSS AREA ===============*/
/*============= COMMON CSS AREA ===============*/
.heading1 h5 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading1 h5 img {
margin: 0 4px 0 0;
}
.heading1 h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading1 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading1 p {
color: var(--ztc-text-text-4);
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: 26px;
}

.heading2 h5 {
color: var(--ztc-bg-bg-5);
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;
border-radius: 4px;
background: var(--ztc-text-text-2);
text-transform: uppercase;
padding: 10px 14px;
}
.heading2 h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading2 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading2 p {
color: var(--ztc-text-text-3);
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: 26px;
}

.heading3 h5 {
color: var(--ztc-text-text-6);
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;
border-radius: 4px;
background: rgba(236, 74, 5, 0.08);
text-transform: uppercase;
padding: 10px 14px;
}
.heading3 h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading3 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading3 p {
color: var(--ztc-text-text-3);
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: 26px;
}

.heading4 h5 {
color: var(--ztc-text-text-2);
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;
border-radius: 80px;
background: var(--Gray-2nd, #F5F3F4);
padding: 10px 14px;
}
.heading4 h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading4 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading4 p {
color: var(--ztc-text-text-3);
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: 26px;
}

.heading5 h5 {
color: var(--ztc-text-text-8);
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;
border-radius: 8px;
background: rgba(28, 24, 83, 0.1);
padding: 10px 14px;
}
.heading5 h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading5 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading5 p {
color: var(--ztc-text-text-3);
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: 26px;
}

.cta-heading7 h2.title {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.cta-heading7 h2.title {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.cta-heading7 p {
color: var(--ztc-text-text-1);
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: 26px;
opacity: 80%;
}

.heading6 h5 {
color: var(--ztc-text-text-11);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading6 h5 img {
margin: -4px 6px 0 0;
}
.heading6 h2 {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading6 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading6 p {
color: var(--ztc-text-text-10);
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: 26px;
}

.heading6_white h5 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading6_white h5 img {
margin: -4px 6px 0 0;
filter: brightness(0) invert(1);
}
.heading6_white h2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading6_white h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading6_white p {
color: var(--ztc-text-text-1);
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: 26px;
}

.heading7 h5 {
color: var(--ztc-text-text-13);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading7 h5 img {
margin: -4px 6px 0 0;
}
.heading7 h2 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading7 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading7 p {
color: var(--ztc-text-text-10);
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: 26px;
}

.heading8 h5 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading8 h5 img {
margin: -4px 6px 0 0;
filter: brightness(0) invert(1);
}
.heading8 h2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading8 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading8 h1 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s60);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 70px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading8 h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading8 p {
color: var(--ztc-text-text-1);
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: 26px;
opacity: 80%;
}

.heading9 h5 {
color: var(--ztc-text-text-14);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading9 h5 img {
margin: -4px 6px 0 0;
}
.heading9 h2 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading9 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading9 h1 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s60);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 70px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading9 h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading9 p {
color: var(--ztc-text-text-10);
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: 26px;
}

.heading10 h5 {
color: var(--ztc-text-text-14);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.heading10 h5 img {
margin: -4px 6px 0 0;
}
.heading10 h2 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 52px;
display: inline-block;
transition: all 0.4s;
text-transform: capitalize;
}
@media (max-width: 767px) {
.heading10 h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading10 h2 span {
color: var(--ztc-text-text-18);
transition: all 0.4s;
display: inline-block;
}
.heading10 h1 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s60);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 70px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.heading10 h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.heading10 p {
color: var(--ztc-text-text-10);
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: 26px;
}

.vl-btn1 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
padding: 20px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-btn1::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.vl-btn1:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.vl-btn1:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.vl-btn1 i {
margin-left: 4px;
}

.vl-btn2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-5);
padding: 18px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-btn2::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
color: var(--ztc-text-text-1) !important;
}
.vl-btn2:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.vl-btn2:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
color: var(--ztc-text-text-1) !important;
}
.vl-btn2 i {
margin-left: 4px;

}

.vl-btn3 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-7);
padding: 18px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-btn3::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.vl-btn3:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.vl-btn3:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.vl-btn3 i {
margin-left: 4px;
}

.vl-btn4 {
color: var(--ztc-text-text-2) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-9);
padding: 20px 24px;
border-radius: 60px;
position: relative;
z-index: 1;
}
.vl-btn4::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 60px;
z-index: -1;
}
.vl-btn4:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1) !important;
}
.vl-btn4:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.vl-btn4 i {
margin-left: 4px;
}

.vl-btn5 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-11);
padding: 18px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-btn5::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.vl-btn5::before {
position: absolute;
content: "";
height: 36px;
width: 36px;
border-radius: 50%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-1);
opacity: 20%;
left: 10px;
top: 8px;
}
.vl-btn5:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.vl-btn5:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.vl-btn5 i {
margin-left: 4px;
}

.vl-btn6 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-13);
padding: 12px 12px 12px 20px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.vl-btn6::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 80px;
z-index: -1;
}
.vl-btn6:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.vl-btn6:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-9);
}
.vl-btn6:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.vl-btn6 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-11);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}

.vl-btn7 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border: 1px solid var(--ztc-bg-bg-1);
padding: 12px 12px 12px 20px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.vl-btn7:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
background: var(--ztc-bg-bg-13);
border: 1px solid var(--ztc-text-text-11);
}
.vl-btn7:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-11);
}
.vl-btn7 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-9);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}

.vl-btn8 {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border: 1px solid var(--ztc-bg-bg-12);
padding: 12px 12px 12px 20px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.vl-btn8:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
background: var(--ztc-bg-bg-13);
border: 1px solid var(--ztc-text-text-11);
}
.vl-btn8:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-11);
background: var(--ztc-bg-bg-1);
}
.vl-btn8 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-1);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-12);
transform: rotate(-45deg);
margin-left: 10px;
}

.vl-btn9 .text {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-16);
padding: 18px 24px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.vl-btn9 .arrow {
height: 50px;
width: 50px;
text-align: center;
line-height: 50px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-16);
color: var(--ztc-text-text-1);
border-radius: 50%;
transform: rotate(-45deg);
}
.vl-btn9:hover .text {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
}
.vl-btn9:hover .arrow {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
transform: rotate(0);
}

.vl-btn10 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
padding: 12px 12px 12px 20px;
border-radius: 10px;
position: relative;
z-index: 1;
}
.vl-btn10::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 10px;
z-index: -1;
}
.vl-btn10:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.vl-btn10:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-12);
}
.vl-btn10:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.vl-btn10 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-14);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}

.vl-btn11 {
color: var(--ztc-text-text-14);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border: 1px solid var(--ztc-bg-bg-19);
padding: 12px 12px 12px 20px;
border-radius: 10px;
position: relative;
z-index: 1;
}
.vl-btn11:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
background: var(--ztc-bg-bg-19);
border: 1px solid var(--ztc-text-text-14);
}
.vl-btn11:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-14);
background: var(--ztc-bg-bg-1);
}
.vl-btn11 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-1);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
transform: rotate(-45deg);
margin-left: 10px;
}

.vl-btn12 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
padding: 16px;
border-radius: 4px;
position: relative;
z-index: 1;
}
.vl-btn12::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 4px;
z-index: -1;
}
.vl-btn12:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.vl-btn12:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}

/*============= COMMON CSS AREA ENDS===============*/
.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;
}

.b-bg {
background: #F2F2F2;
}

.pagination-area {
position: relative;
z-index: 1;
text-align: center;
overflow: hidden;
}
.pagination-area ul {
justify-content: center;
}
.pagination-area ul li {
margin: 0 14px 0 0;
}
.pagination-area ul li:last-child(1) {
margin: 0;
}
.pagination-area ul li a {
color: var(--ztc-text-text-2);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
display: inline-block;
transition: all 0.4s;
height: 50px;
width: 50px;
text-align: center;
line-height: 50px;
border: none;
border-radius: 8px;
margin: 0;
padding: 0;
border-radius: 8px;
background: var(--ztc-bg-bg-4);
}
.pagination-area ul li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.pagination-area ul li a.active {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}

.sp1 {
padding: 100px 0 100px;
}
@media (max-width: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.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: 767px) {
.sp11 {
padding: 0 0 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.sp11 {
padding: 0 0 30px;
}
}

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

/*============= BLOG CSS AREA ===============*/
.vl-blog-1-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-1-area .vl-blog-1-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
}
.vl-blog-1-area .vl-blog-1-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-1-area .vl-blog-1-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content {
border-radius: 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.08);
position: relative;
z-index: 1;
padding: 32px 24px 24px 24px;
margin: -120px 24px 0;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .date {
background: var(--ztc-bg-bg-2);
display: inline-block;
transition: all 0.8s;
border-radius: 8px;
padding: 12px;
position: absolute;
top: -40px;
right: 16px;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .date p {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s28);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
text-transform: capitalize;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .date span {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s12);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 12px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
margin: 0 16px 0 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
margin: 0;
}
}
@media (max-width: 767px) {
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
margin: 0;
}
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li:nth-child(2) {
margin: 0;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-3);
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;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title 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-bold);
line-height: 28px;
display: inline-block;
transition: all 0.4s;
padding-bottom: 24px;
border-bottom: 1px solid #E7E7E7;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .readmore i {
margin-left: 4px;
}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content .readmore:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}

.vl-blog-2-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-2-area .vl-blog-1-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
background: var(--ztc-bg-bg-6);
padding: 20px;
border-radius: 8px;
}
.vl-blog-2-area .vl-blog-1-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-2-area .vl-blog-1-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-3);
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;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .readmore i {
margin-left: 4px;
transition: all 0.4s;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .readmore:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.vl-blog-2-area .vl-blog-1-item .vl-blog-1-content .readmore:hover i {
transform: rotate(-45deg);
transition: all 0.4s;
}

.vl-blog-3-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-8);
}
.vl-blog-3-area .vl-blog-1-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
background: var(--ztc-bg-bg-1);
padding: 20px;
border-radius: 8px;
}
.vl-blog-3-area .vl-blog-1-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-3-area .vl-blog-1-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-3);
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;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content p {
color: var(--ztc-text-text-3);
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: 26px;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .readmore i {
margin-left: 4px;
transition: all 0.4s;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .readmore:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.vl-blog-3-area .vl-blog-1-item .vl-blog-1-content .readmore:hover i {
transform: rotate(-45deg);
transition: all 0.4s;
}

.vl-blog-4-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-4-area .vl-blog-1-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
background: var(--ztc-bg-bg-10);
border-radius: 8px;
}
.vl-blog-4-area .vl-blog-1-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-4-area .vl-blog-1-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px 8px 0 0;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
padding: 4px 24px 28px 24px;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-3);
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;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title 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-bold);
line-height: 28px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .readmore i {
margin-left: 4px;
transition: all 0.4s;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .readmore:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}
.vl-blog-4-area .vl-blog-1-item .vl-blog-1-content .readmore:hover i {
transform: rotate(-45deg);
transition: all 0.4s;
}

.vl-blog-5-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-5-area .vl-blog-1-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
border-radius: 8px;
}
.vl-blog-5-area .vl-blog-1-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item:hover .vl-blog-1-content {
transform: translateY(-10px);
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-thumb img {
height: 378px;
}
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
padding: 32px;
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-3);
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;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 40px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title.title2 a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title.title2 a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title.title2 a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title.title2 a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title.title2 a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content p {
color: var(--ztc-text-text-3);
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: 26px;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .readmore i {
margin-left: 4px;
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .readmore:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.vl-blog-5-area .vl-blog-1-item .vl-blog-1-content .readmore:hover i {
transition: all 0.4s;
}

.vl-blog-2-area-inner {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-2-area-inner .vl-blog-1-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
background: var(--ztc-bg-bg-4);
padding: 20px;
border-radius: 8px;
}
.vl-blog-2-area-inner .vl-blog-1-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-2-area-inner .vl-blog-1-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-3);
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;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .readmore {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
text-transform: uppercase;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .readmore i {
margin-left: 4px;
transition: all 0.4s;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .readmore:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.vl-blog-2-area-inner .vl-blog-1-item .vl-blog-1-content .readmore:hover i {
transform: rotate(-45deg);
transition: all 0.4s;
}

.vl-blog-7-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-7-area .vl-blog-7-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
background: var(--ztc-bg-bg-14);
border-radius: 12px;
transition: all 0.4s;
}
.vl-blog-7-area .vl-blog-7-item:hover {
border-radius: 12px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.08);
transition: all 0.4s;
}
.vl-blog-7-area .vl-blog-7-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-7-area .vl-blog-7-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px 8px 0 0;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
padding: 4px 24px 30px 24px;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-10);
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;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.vl-blog-7-area .vl-blog-7-item .vl-blog-1-content p {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 24px;
}

.vl-blog-8-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-8-area .vl-blog-8-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
background: var(--ztc-bg-bg-17);
border-radius: 12px;
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item:hover {
border-radius: 12px;
background: var(--ztc-bg-bg-16);
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-8-area .vl-blog-8-item:hover .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item:hover .vl-blog-1-content p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item .b-shape1 {
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
.vl-blog-8-area .vl-blog-8-item .arrow a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
border-radius: 50%;
line-height: 46px;
display: inline-block;
background: var(--ztc-bg-bg-16);
color: var(--ztc-text-text-1);
position: absolute;
right: 0;
z-index: 2;
transform: rotate(-45deg);
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item .arrow a:hover {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
transform: rotate(0);
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px 8px 0 0;
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 0 0;
transition: all 0.4s;
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content {
border-radius: 8px;
position: relative;
z-index: 1;
padding: 4px 24px 30px 24px;
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-10);
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;
background: var(--ztc-bg-bg-1);
padding: 8px;
border-radius: 8px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-8-area .vl-blog-8-item .vl-blog-1-content p {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 24px;
transition: all 0.4s;
}

.vl-blog-9-area {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
}
@media (max-width: 767px) {
.vl-blog-9-area {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-9-area {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-blog-9-area {
margin: 0;
}
}
.vl-blog-9-area .vl-blog-9-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
border-radius: 12px;
border: 1px solid var(--Strok-Color, #DBDBDB);
background: var(--ztc-bg-bg-14);
transition: all 0.4s;
padding: 30px;
}
@media (max-width: 767px) {
.vl-blog-9-area .vl-blog-9-item {
padding: 20px;
}
}
.vl-blog-9-area .vl-blog-9-item:hover {
border-radius: 12px;
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item:hover .vl-blog-1-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item:hover .vl-blog-1-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-9-area .vl-blog-9-item:hover .vl-blog-1-content .vl-blog-1-title a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item:hover .vl-blog-1-content p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item .b-shape1 {
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
.vl-blog-9-area .vl-blog-9-item .arrow a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
border-radius: 50%;
line-height: 46px;
display: inline-block;
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
position: absolute;
right: 0;
z-index: 2;
transform: rotate(-45deg);
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item .arrow a:hover {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
transform: rotate(0);
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-1-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-1-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content {
border-radius: 8px;
position: relative;
z-index: 1;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li {
display: inline-block;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-10);
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;
background: var(--ztc-bg-bg-1);
padding: 8px;
border-radius: 8px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s16);
line-height: 14px;
}
}
@media (max-width: 767px) {
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li a span {
color: #E2E2E6;
display: inline-block;
margin: 0 8px;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-1-title a {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 30px;
display: inline-block;
transition: all 0.4s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s22);
line-height: 26px;
}
}
@media (max-width: 767px) {
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-1-title a {
font-size: var(--ztc-font-size-font-s20);
line-height: 26px;
}
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.vl-blog-9-area .vl-blog-9-item .vl-blog-9-content p {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 24px;
transition: all 0.4s;
}

.blog-details-section {
position: relative;
z-index: 1;
}
.blog-details-section .blog-sidebar-details {
position: sticky;
top: 120px;
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget h3 {
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-bold);
line-height: 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .search-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .search-area form {
position: relative;
z-index: 1;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .search-area form input {
width: 100%;
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-regular);
line-height: 16px;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 16px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .search-area form input::-moz-placeholder {
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-regular);
line-height: 16px;
opacity: 70%;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .search-area form input::placeholder {
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-regular);
line-height: 16px;
opacity: 70%;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .search-area form button {
border: none;
outline: none;
height: 52px;
width: 52px;
text-align: center;
line-height: 48px;
border-radius: 0 8px 8px 0;
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
position: absolute;
right: 0;
top: 0;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .categories-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .categories-area ul li a {
display: flex;
align-items: center;
justify-content: space-between;
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 20px 20px;
transition: all 0.4s;
margin-top: 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .categories-area ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
position: relative;
}
@media (max-width: 767px) {
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area {
text-align: center;
}
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts {
position: relative;
}
@media (max-width: 767px) {
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts {
text-align: center;
}
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .img1 {
position: absolute;
}
@media (max-width: 767px) {
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .img1 {
position: relative;
}
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .img1 img {
height: 100px;
width: 100px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 4px;
max-height: 100px;
max-width: 100px;
}
@media (max-width: 767px) {
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .img1 img {
height: 100px;
width: 100px;
-o-object-fit: cover;
   object-fit: cover;
}
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .content {
padding-left: 120px;
}
@media (max-width: 767px) {
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .content {
padding-left: 0;
margin-top: 16px;
}
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .content ul li a {
color: var(--ztc-text-text-3);
font-family: var(---ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .content ul li a img {
margin: -5px 4px 0 0;
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .content h4 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-semibold);
line-height: 26px;
display: inline-block;
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .recent-posts-area .recent-posts .content h4 a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .help-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .help-area h3 {
line-height: 28px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .help-area .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
border-radius: 8px;
background: var(--ztc-bg-bg-3);
padding: 10px 16px;
display: inline-block;
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .help-area .btn-area1 a:hover {
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .help-area .btn-area1 a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: inline-block;
transition: all 0.4s;
margin: 0 4px 0 0;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .popular-tags {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .popular-tags ul li {
display: inline-block;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .popular-tags ul li a {
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-semibold);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
border-radius: 4px;
padding: 12px 16px;
background: var(--ztc-bg-bg-1);
margin: 16px 6px 0 0;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .popular-tags ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .social-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .social-area ul li {
display: inline-block;
margin: 0 6px 0 0;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .social-area ul li:last-child {
margin: 0;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .social-area ul li a {
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
color: var(--ztc-text-text-2);
display: inline-block;
font-size: var(--ztc-font-size-font-s20);
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .social-area ul li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .author-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
position: relative;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .author-area ul li {
display: inline-block;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .author-area ul li a {
display: inline-block;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .author-area ul li a img {
height: 70px;
width: 70px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 50%;
margin: 0 6px 0 0;
}
.blog-details-section .blog-sidebar-details .blog-sidebar-post-widget .author-area ul li a img:nth-child(4) {
margin: 0;
}
.blog-details-section .blog-main-content-details {
position: relative;
z-index: 1;
position: relative;
z-index: 1;
}
.blog-details-section .blog-main-content-details.padding1 {
padding: 0 0 0 40px;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details.padding1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blog-details-section .blog-main-content-details.padding1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.blog-details-section .blog-main-content-details.padding1 {
padding: 0;
margin-top: 30px;
}
}
.blog-details-section .blog-main-content-details.padding2 {
padding: 0 40px 0 0;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blog-details-section .blog-main-content-details.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.blog-details-section .blog-main-content-details.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
.blog-details-section .blog-main-content-details h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 40px;
}
.blog-details-section .blog-main-content-details .service-arrows {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .service-arrows {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blog-details-section .blog-main-content-details .service-arrows {
margin-top: 30px;
}
}
.blog-details-section .blog-main-content-details .service-arrows .testimonial-arrows {
display: flex;
align-items: center;
}
.blog-details-section .blog-main-content-details .service-arrows .testimonial-arrows .testimonial-prev-arrow-sinner {
position: absolute;
top: 50%;
margin-top: -28px;
z-index: 2;
left: 30px;
}
.blog-details-section .blog-main-content-details .service-arrows .testimonial-arrows .testimonial-next-arrow-sinner {
position: absolute;
top: 50%;
margin-top: -28px;
z-index: 2;
right: 30px;
}
.blog-details-section .blog-main-content-details .service-arrows .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.blog-details-section .blog-main-content-details .service-arrows .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.blog-details-section .blog-main-content-details .service-arrows .service-slider-images {
position: relative;
z-index: 1;
}
.blog-details-section .blog-main-content-details .service-arrows .service-slider-images .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.blog-details-section .blog-main-content-details .list-author {
padding: 16px 0;
border-top: 1px solid var(--ztc-bg-bg-4);
border-bottom: 1px solid var(--ztc-bg-bg-4);
}
.blog-details-section .blog-main-content-details .list-author li {
display: inline-block;
}
.blog-details-section .blog-main-content-details .list-author li:nth-child(1) img {
height: 40px;
width: 40px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 50%;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .list-author li:nth-child(3) {
margin-top: 10px;
}
}
.blog-details-section .blog-main-content-details .list-author li:nth-child(1) a {
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px;
text-transform: capitalize;
display: inline-block;
padding: 10px;
border-radius: 4px;
}
.blog-details-section .blog-main-content-details .list-author li a {
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px;
display: inline-block;
}
.blog-details-section .blog-main-content-details .list-author li a img {
height: 18px;
width: 18px;
-o-object-fit: contain;
 object-fit: contain;
margin: -5px 4px 0 0;
}
.blog-details-section .blog-main-content-details .list-author li a span {
color: #9BA5A3;
display: inline-block;
margin: 0 8px;
}
.blog-details-section .blog-main-content-details .pera {
padding-bottom: 32px;
border-bottom: 1px solid var(--ztc-bg-bg-4);
}
.blog-details-section .blog-main-content-details .pera p {
background: var(--ztc-bg-bg-4);
position: relative;
z-index: 1;
padding: 24px 18px 24px 24px;
position: relative;
z-index: 1;
}
.blog-details-section .blog-main-content-details .pera p::after {
position: absolute;
content: "";
height: 100%;
width: 5px;
left: 0;
top: 0;
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
}
.blog-details-section .blog-main-content-details .img1 {
position: relative;
z-index: 1;
overflow: hidden;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .img1 {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blog-details-section .blog-main-content-details .img1 {
margin-top: 30px;
}
}
.blog-details-section .blog-main-content-details .img1 .play a {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
background: var(--ztc-bg-bg-3);
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
color: var(--ztc-text-text-1);
position: absolute;
top: 50%;
left: 50%;
margin-left: -30px;
margin-top: -30px;
font-size: var(--ztc-font-size-font-s20);
}
.blog-details-section .blog-main-content-details .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.blog-details-section .blog-main-content-details .service-list {
position: relative;
z-index: 1;
}
.blog-details-section .blog-main-content-details .service-list:hover h3 {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.blog-details-section .blog-main-content-details .service-list h3 {
height: 48px;
width: 48px;
text-align: center;
line-height: 48px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-4);
color: var(--ztc-text-text-4);
border-radius: 50%;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
max-width: 48px;
max-height: 48px;
position: absolute;
}
.blog-details-section .blog-main-content-details .service-list .content {
padding-left: 60px;
}
.blog-details-section .blog-main-content-details .service-list .content a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
.blog-details-section .blog-main-content-details .service-list .content a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.blog-details-section .blog-main-content-details .service-listarea ul li {
color: var(--ztc-text-text-3);
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;
margin-top: 16px;
}
.blog-details-section .blog-main-content-details .service-listarea ul li img {
margin: 0 6px 0 0;
}
.blog-details-section .blog-main-content-details .tags-social {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 32px;
border-top: 1px solid var(--ztc-bg-bg-4);
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .tags-social {
display: inline-block;
}
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .tags-social .tags {
margin-bottom: 16px;
}
}
.blog-details-section .blog-main-content-details .tags-social .tags ul li {
display: inline-block;
}
.blog-details-section .blog-main-content-details .tags-social .tags ul li:nth-child(1) {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 24px;
margin: 0 16px 0 0;
}
.blog-details-section .blog-main-content-details .tags-social .tags ul li a {
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;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
border-radius: 4px;
border: 1px solid var(--ztc-text-text-3);
padding: 8px 12px;
margin: 0 8px 0 0;
border-radius: 8px;
}
.blog-details-section .blog-main-content-details .tags-social .tags ul li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
border: 1px solid var(--ztc-text-text-4);
}
.blog-details-section .blog-main-content-details .tags-social .social ul li {
display: inline-block;
}
.blog-details-section .blog-main-content-details .tags-social .social ul li:nth-child(1) {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 24px;
margin: 0 16px 0 0;
}
.blog-details-section .blog-main-content-details .tags-social .social ul li a {
height: 44px;
width: 44px;
text-align: center;
line-height: 44px;
border-radius: 50%;
transition: all 0.4s;
background: var(--ztc-bg-bg-4);
color: var(--ztc-text-text-2);
transition: all 0.4s;
display: inline-block;
font-size: var(--ztc-font-size-font-s16);
margin: 0 8px 0 0;
}
.blog-details-section .blog-main-content-details .tags-social .social ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.blog-details-section .blog-main-content-details .comments-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
border-radius: 8px;
padding: 24px;
}
.blog-details-section .blog-main-content-details .comments-boxarea.box2 {
margin: 0 0 0 30px;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .comments-boxarea.box2 {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blog-details-section .blog-main-content-details .comments-boxarea.box2 {
margin: 0;
}
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes {
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes {
display: inline-block;
}
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .comments-auhtor-box {
display: flex;
align-items: center;
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .comments-auhtor-box .img3 img {
height: 80px;
width: 80px;
border-radius: 50%;
-o-object-fit: cover;
 object-fit: cover;
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .comments-auhtor-box .content {
padding-left: 18px;
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .comments-auhtor-box .content .date {
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px; /* 100% */
display: inline-block;
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .comments-auhtor-box .content .name {
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-bold);
line-height: 20px;
display: block;
transition: all 0.4s;
padding-bottom: 10px;
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .reply {
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-bold);
line-height: 16px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .reply {
margin-top: 12px;
}
}
.blog-details-section .blog-main-content-details .comments-boxarea .comments-boxes .reply i {
margin: 0 2px 0 0;
}
.blog-details-section .blog-main-content-details .contact-boxarea {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 32px;
}
.blog-details-section .blog-main-content-details .contact-boxarea h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area {
margin-top: 16px;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area input {
width: 100%;
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;
padding: 20px 16px;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
opacity: 70%;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
opacity: 70%;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area textarea {
width: 100%;
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;
padding: 20px;
border-radius: 4px;
background: var(--ztc-bg-bg-1);
height: 140px;
border-radius: 8px;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
opacity: 70%;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
opacity: 70%;
}
.blog-details-section .blog-main-content-details .contact-boxarea .input-area button {
border: none;
outline: none;
text-align: center;
}

.vl-blog-10-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.vl-blog-10-area .vl-blog-10-item {
position: relative;
z-index: 1;
margin-bottom: 30px;
}
.vl-blog-10-area .vl-blog-10-item:hover .vl-blog-10-thumb img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.vl-blog-10-area .vl-blog-10-item:hover .vl-blog-10-content .date {
transform: rotateX(-360deg);
transition: all 0.8s;
background: var(--ztc-bg-bg-3);
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-thumb {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-thumb img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content {
border-radius: 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.08);
position: relative;
z-index: 1;
padding: 24px;
margin: -120px 24px 0;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .date {
background: var(--ztc-bg-bg-2);
display: inline-block;
transition: all 0.8s;
border-radius: 8px;
padding: 12px;
position: absolute;
top: -40px;
right: 16px;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .date p {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s28);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
text-transform: capitalize;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .date span {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s12);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 12px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-meta ul li {
display: inline-block;
margin: 0 16px 0 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-meta ul li {
margin: 0;
}
}
@media (max-width: 767px) {
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-meta ul li {
margin: 0;
}
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-meta ul li:nth-child(2) {
margin: 0;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-meta ul li a {
color: var(--ztc-text-text-10);
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;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-meta ul li a svg {
margin: -4px 4px 0 0;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-1-title a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
display: inline-block;
transition: all 0.4s;
}
.vl-blog-10-area .vl-blog-10-item .vl-blog-10-content .vl-blog-1-title a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}

/*============= BLOG CSS AREA ENDS ===============*/
/*============= FOOTER CSS AREA ===============*/
.vl-footer1-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: #F2F2F2;
padding: 270px 0 32px;
}
.vl-footer1-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer1-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
}
.vl-footer1-section-area .footer-logo-area p {
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: 26px;
letter-spacing: -0.32px;
opacity: 70%;
}
.vl-footer1-section-area .footer-logo-area .social-links li {
display: inline-block;
}
.vl-footer1-section-area .footer-logo-area .social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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);
}
.vl-footer1-section-area .footer-logo-area .social-links li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-footer1-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer1-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer1-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer1-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer1-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer1-section-area .footer-widget-area.foot-padding1 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer1-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer1-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer1-section-area .footer-widget-area.foot-padding2 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer1-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer1-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer1-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer1-section-area .footer-widget-area ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer1-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.vl-footer1-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer1-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DBDBDB;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer1-section-area .copyright-area {
display: block;
text-align: center;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer1-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer1-section-area .copyright-area a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer1-section-area .copyright-area a {
line-height: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer1-section-area .copyright-area ul {
padding-top: 20px;
}
}
@media (max-width: 767px) {
.vl-footer1-section-area .copyright-area ul {
padding-top: 20px;
}
}
.vl-footer1-section-area .copyright-area ul li {
display: inline-block;
}
.vl-footer1-section-area .copyright-area ul li a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
.vl-footer1-section-area .copyright-area ul li span {
display: inline-block;
margin: 0 16px;
color: #DBDBDB;
}

.vl-footer2-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-3);
padding: 270px 0 32px;
}
.vl-footer2-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer2-section-area .footer-logo-area img {
width: 50%;
height: 100px;
-o-object-fit: contain;
 object-fit: contain;
}
.vl-footer2-section-area .footer-logo-area p {
color: var(--ztc-text-text-1);
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: 26px;
letter-spacing: -0.32px;
opacity: 70%;
}
.vl-footer2-section-area .footer-logo-area .social-links li {
display: inline-block;
}
.vl-footer2-section-area .footer-logo-area .social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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);
}
.vl-footer2-section-area .footer-logo-area .social-links li a:hover {
background: var(--ztc-bg-bg-5);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-footer2-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer2-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer2-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer2-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer2-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer2-section-area .footer-widget-area.foot-padding1 ul li a {
color: var(--ztc-text-text-1);
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;
}
.vl-footer2-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-bg-bg-5);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer2-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer2-section-area .footer-widget-area.foot-padding2 ul li a {
color: var(--ztc-text-text-1);
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;
}
.vl-footer2-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-bg-bg-5);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer2-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer2-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer2-section-area .footer-widget-area ul li a {
color: var(--ztc-text-text-1);
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;
}
.vl-footer2-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-bg-bg-5);
transition: all 0.4s;
}
.vl-footer2-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer2-section-area .copyright-area {
display: block;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DBDBDB;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer2-section-area .copyright-area {
display: block;
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-medium);
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer2-section-area .copyright-area {
display: block;
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-medium);
}
}
.vl-footer2-section-area .copyright-area a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer2-section-area .copyright-area a {
line-height: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer2-section-area .copyright-area ul {
padding-top: 20px;
}
}
@media (max-width: 767px) {
.vl-footer2-section-area .copyright-area ul {
padding-top: 20px;
}
}
.vl-footer2-section-area .copyright-area ul li {
display: inline-block;
}
.vl-footer2-section-area .copyright-area ul li a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
.vl-footer2-section-area .copyright-area ul li span {
display: inline-block;
margin: 0 16px;
color: #DBDBDB;
}

.vl-footer3-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-8);
padding: 270px 0 32px;
}
.vl-footer3-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer3-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
}
.vl-footer3-section-area .footer-logo-area p {
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: 26px;
letter-spacing: -0.32px;
opacity: 70%;
}
.vl-footer3-section-area .footer-logo-area .contact-links li a {
color: rgba(15, 13, 13, 0.8);
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;
margin-top: 20px;
}
.vl-footer3-section-area .footer-logo-area .contact-links li a:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.vl-footer3-section-area .footer-logo-area .contact-links li a svg {
margin: -5px 4px 0 0;
}
.vl-footer3-section-area .footer-logo-area .social-links li {
display: inline-block;
}
.vl-footer3-section-area .footer-logo-area .social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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);
}
.vl-footer3-section-area .footer-logo-area .social-links li a:hover {
background: var(--ztc-bg-bg-7);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-footer3-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer3-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer3-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer3-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer3-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer3-section-area .footer-widget-area.foot-padding1 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer3-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer3-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer3-section-area .footer-widget-area.foot-padding2 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer3-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer3-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer3-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer3-section-area .footer-widget-area ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer3-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.vl-footer3-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer3-section-area .footer-form-area {
position: relative;
z-index: 1;
margin-top: -80px;
}
@media (max-width: 767px) {
.vl-footer3-section-area .footer-form-area {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer3-section-area .footer-form-area {
margin-top: 30px;
}
}
.vl-footer3-section-area .footer-form-area .f-heading h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer3-section-area .footer-form-area form {
position: relative;
z-index: 1;
}
.vl-footer3-section-area .footer-form-area form input {
color: var(--ztc-text-text-2);
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;
border-radius: 8px;
border: 1px solid var(--ztc-text-text-1);
background: var(--ztc-bg-bg-1);
padding: 18px 16px;
width: 410px;
}
@media (max-width: 767px) {
.vl-footer3-section-area .footer-form-area form input {
width: 100%;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-footer3-section-area .footer-form-area form input {
width: 300px;
}
}
.vl-footer3-section-area .footer-form-area form input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.vl-footer3-section-area .footer-form-area form input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.vl-footer3-section-area .footer-form-area form button {
border: none;
outline: none;
margin-left: 16px;
}
@media (max-width: 767px) {
.vl-footer3-section-area .footer-form-area form button {
margin-left: 0;
margin-top: 16px;
}
}
.vl-footer3-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DBDBDB;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer3-section-area .copyright-area {
display: block;
text-align: center;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer3-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer3-section-area .copyright-area a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer3-section-area .copyright-area a {
line-height: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer3-section-area .copyright-area ul {
padding-top: 20px;
}
}
@media (max-width: 767px) {
.vl-footer3-section-area .copyright-area ul {
padding-top: 20px;
}
}
.vl-footer3-section-area .copyright-area ul li {
display: inline-block;
}
.vl-footer3-section-area .copyright-area ul li a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
.vl-footer3-section-area .copyright-area ul li span {
display: inline-block;
margin: 0 16px;
color: #DBDBDB;
}

.vl-footer4-section-area {
position: relative;
z-index: 1;
overflow: hidden;
padding: 80px 0 32px;
}
.vl-footer4-section-area .footer-logo-area {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-10);
padding: 48px 40px;
border-radius: 8px;
}
.vl-footer4-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
}
.vl-footer4-section-area .footer-logo-area p {
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: 26px;
letter-spacing: -0.32px;
opacity: 70%;
}
.vl-footer4-section-area .footer-logo-area .contact-links li a {
color: rgba(15, 13, 13, 0.8);
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;
margin-top: 20px;
}
.vl-footer4-section-area .footer-logo-area .contact-links li a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}
.vl-footer4-section-area .footer-logo-area .contact-links li a svg {
margin: -5px 4px 0 0;
}
.vl-footer4-section-area .contact4-bg {
background: var(--ztc-bg-bg-10);
padding: 48px 40px 58px 40px;
border-radius: 8px;
}
@media (max-width: 767px) {
.vl-footer4-section-area .contact4-bg {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer4-section-area .contact4-bg {
margin-top: 30px;
}
}
.vl-footer4-section-area .footer-widget-area.foot-padding2 {
position: relative;
left: -40px;
}
@media (max-width: 767px) {
.vl-footer4-section-area .footer-widget-area.foot-padding2 {
left: 0;
}
}
.vl-footer4-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer4-section-area .footer-widget-area.foot-padding1 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer4-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer4-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer4-section-area .footer-widget-area.foot-padding2 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer4-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer4-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer4-section-area .footer-widget-area .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 4px;
margin-top: 10px;
}
.vl-footer4-section-area .footer-widget-area .img1:hover .icons {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.vl-footer4-section-area .footer-widget-area .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 4px;
}
.vl-footer4-section-area .footer-widget-area .img1 .icons {
position: absolute;
left: 50%;
top: 50%;
margin-top: -15px;
margin-left: -15px;
transition: all 0.4s;
visibility: hidden;
opacity: 0;
}
.vl-footer4-section-area .footer-widget-area .img1 .icons a {
height: 30px;
width: 30px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-9);
transition: all 0.4s;
color: var(--ztc-text-text-2);
text-align: center;
line-height: 30px;
border-radius: 50%;
}
.vl-footer4-section-area .footer-conatct-area {
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 767px) {
.vl-footer4-section-area .footer-conatct-area {
display: inline-block;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer4-section-area .footer-conatct-area {
display: inline-block;
}
}
.vl-footer4-section-area .footer-conatct-area .form-area form {
position: relative;
z-index: 1;
}
.vl-footer4-section-area .footer-conatct-area .form-area form input {
color: var(--ztc-text-text-2);
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;
border-radius: 90px;
border: 1px solid var(--ztc-text-text-1);
background: var(--ztc-bg-bg-10);
padding: 18px 16px;
width: 410px;
}
@media (max-width: 767px) {
.vl-footer4-section-area .footer-conatct-area .form-area form input {
width: 100%;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-footer4-section-area .footer-conatct-area .form-area form input {
width: 300px;
}
}
.vl-footer4-section-area .footer-conatct-area .form-area form input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.vl-footer4-section-area .footer-conatct-area .form-area form input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.vl-footer4-section-area .footer-conatct-area .form-area form button {
border: none;
outline: none;
margin-left: 16px;
}
@media (max-width: 767px) {
.vl-footer4-section-area .footer-conatct-area .form-area form button {
margin-left: 0;
margin-top: 16px;
}
}
@media (max-width: 767px) {
.vl-footer4-section-area .footer-conatct-area .social-area {
margin-top: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer4-section-area .footer-conatct-area .social-area {
margin-top: 24px;
}
}
.vl-footer4-section-area .footer-conatct-area .social-area ul li {
display: inline-block;
}
.vl-footer4-section-area .footer-conatct-area .social-area ul li a {
height: 54px;
width: 54px;
text-align: center;
line-height: 54px;
border-radius: 50%;
background: var(--ztc-bg-bg-10);
display: inline-block;
font-size: var(--ztc-font-size-font-s20);
transition: all 0.4s;
color: var(--ztc-text-text-2);
}
.vl-footer4-section-area .footer-conatct-area .social-area ul li a:hover {
background: var(--ztc-bg-bg-9);
color: var(--ztc-text-text-2);
transition: all 0.4s;
}
.vl-footer4-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DBDBDB;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer4-section-area .copyright-area {
display: block;
text-align: center;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer4-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer4-section-area .copyright-area a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer4-section-area .copyright-area a {
line-height: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer4-section-area .copyright-area ul {
padding-top: 20px;
}
}
@media (max-width: 767px) {
.vl-footer4-section-area .copyright-area ul {
padding-top: 20px;
}
}
.vl-footer4-section-area .copyright-area ul li {
display: inline-block;
}
.vl-footer4-section-area .copyright-area ul li a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
.vl-footer4-section-area .copyright-area ul li span {
display: inline-block;
margin: 0 16px;
color: #DBDBDB;
}

.vl-footer5-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-4);
padding: 270px 0 32px;
}
.vl-footer5-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer5-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
}
.vl-footer5-section-area .footer-logo-area p {
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: 26px;
letter-spacing: -0.32px;
opacity: 70%;
}
.vl-footer5-section-area .footer-logo-area .contact-links li a {
color: rgba(15, 13, 13, 0.8);
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;
margin-top: 20px;
}
.vl-footer5-section-area .footer-logo-area .contact-links li a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.vl-footer5-section-area .footer-logo-area .contact-links li a svg {
margin: -5px 4px 0 0;
}
.vl-footer5-section-area .footer-logo-area .social-links li {
display: inline-block;
}
.vl-footer5-section-area .footer-logo-area .social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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);
}
.vl-footer5-section-area .footer-logo-area .social-links li a:hover {
background: var(--ztc-bg-bg-11);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.vl-footer5-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer5-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer5-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer5-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer5-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer5-section-area .footer-widget-area.foot-padding1 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer5-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer5-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer5-section-area .footer-widget-area.foot-padding2 ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer5-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer5-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer5-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer5-section-area .footer-widget-area ul li a {
color: rgba(15, 13, 13, 0.8);
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;
}
.vl-footer5-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.vl-footer5-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer5-section-area .footer-form-area {
position: relative;
z-index: 1;
margin-top: -80px;
}
@media (max-width: 767px) {
.vl-footer5-section-area .footer-form-area {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer5-section-area .footer-form-area {
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer5-section-area .footer-form-area {
margin-top: 30px;
}
}
.vl-footer5-section-area .footer-form-area .f-heading h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer5-section-area .footer-form-area form {
position: relative;
z-index: 1;
}
.vl-footer5-section-area .footer-form-area form input {
color: var(--ztc-text-text-2);
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;
border-radius: 8px;
border: 1px solid var(--ztc-text-text-1);
background: var(--ztc-bg-bg-1);
padding: 18px 16px;
width: 410px;
}
@media (max-width: 767px) {
.vl-footer5-section-area .footer-form-area form input {
width: 100%;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.vl-footer5-section-area .footer-form-area form input {
width: 300px;
}
}
.vl-footer5-section-area .footer-form-area form input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.vl-footer5-section-area .footer-form-area form input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.vl-footer5-section-area .footer-form-area form button {
border: none;
outline: none;
margin-left: 16px;
}
@media (max-width: 767px) {
.vl-footer5-section-area .footer-form-area form button {
margin-left: 0;
margin-top: 16px;
}
}
.vl-footer5-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DBDBDB;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer5-section-area .copyright-area {
display: block;
text-align: center;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer5-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer5-section-area .copyright-area a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer5-section-area .copyright-area a {
line-height: 24px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer5-section-area .copyright-area ul {
padding-top: 20px;
}
}
@media (max-width: 767px) {
.vl-footer5-section-area .copyright-area ul {
padding-top: 20px;
}
}
.vl-footer5-section-area .copyright-area ul li {
display: inline-block;
}
.vl-footer5-section-area .copyright-area ul li a {
color: var(--ztc-text-text-3);
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;
opacity: 80%;
}
.vl-footer5-section-area .copyright-area ul li span {
display: inline-block;
margin: 0 16px;
color: #DBDBDB;
}

.vl-footer7-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-12);
padding: 60px 0 32px;
}
.vl-footer7-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer7-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.vl-footer7-section-area .footer-logo-area p {
color: var(--ztc-text-text-1);
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: 26px;
letter-spacing: -0.32px;
opacity: 70%;
}
.vl-footer7-section-area .footer-logo-area .contact-logo li {
padding-top: 20px;
}
.vl-footer7-section-area .footer-logo-area .contact-logo li a {
color: var(--ztc-text-text-1);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer7-section-area .footer-logo-area .contact-logo li a:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.vl-footer7-section-area .footer-logo-area .contact-logo li a svg {
margin: 0 5px 0 0;
filter: brightness(0) invert(1);
opacity: 90%;
}
.vl-footer7-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer7-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer7-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer7-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer7-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer7-section-area .footer-widget-area.foot-padding1 ul li a {
color: var(--ztc-text-text-1);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer7-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer7-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer7-section-area .footer-widget-area.foot-padding2 ul li a {
color: var(--ztc-text-text-1);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer7-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer7-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer7-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer7-section-area .footer-widget-area ul li a {
color: var(--ztc-text-text-1);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer7-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.vl-footer7-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer7-section-area .footer-widget-area ul.time-area {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 6px 28px 24px 28px;
margin-top: 24px;
}
.vl-footer7-section-area .footer-widget-area ul.time-area li {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 18px;
border-bottom: 1px solid #E8EAEC;
padding-top: 18px;
}
.vl-footer7-section-area .footer-widget-area ul.time-area li:nth-child(3) {
padding-bottom: 0;
padding-top: 18px;
border: none;
}
.vl-footer7-section-area .footer-widget-area ul.time-area li span a {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-family-font1);
font-style: normal;
font-weight: var(--ztc-weight-medium);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
}
.vl-footer7-section-area .footer-widget-area ul.time-area li span a:nth-child(1) {
font-weight: var(--ztc-weight-semibold);
}
.vl-footer7-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #192232;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer7-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer7-section-area .copyright-area a {
color: var(--ztc-text-text-1);
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: 18px;
display: inline-block;
transition: all 0.4s;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer7-section-area .copyright-area a {
line-height: 24px;
}
}
@media (max-width: 767px) {
.vl-footer7-section-area .copyright-area ul.social-links {
margin-top: 20px;
}
}
.vl-footer7-section-area .copyright-area ul.social-links li {
display: inline-block;
}
.vl-footer7-section-area .copyright-area ul.social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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);
opacity: 1;
}
.vl-footer7-section-area .copyright-area ul.social-links li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}

.vl-footer8-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-17);
padding: 250px 0 32px;
}
.vl-footer8-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer8-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0);
}
.vl-footer8-section-area .footer-logo-area p {
color: var(--ztc-text-text-10);
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: 26px;
letter-spacing: -0.32px;
}
.vl-footer8-section-area .footer-logo-area .contact-logo li {
padding-top: 20px;
}
.vl-footer8-section-area .footer-logo-area .contact-logo li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer8-section-area .footer-logo-area .contact-logo li a:hover {
color: var(--ztc-text-text-13);
transition: all 0.4s;
}
.vl-footer8-section-area .footer-logo-area .contact-logo li a svg {
margin: 0 5px 0 0;
filter: brightness(0);
opacity: 90%;
}
.vl-footer8-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer8-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer8-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer8-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer8-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer8-section-area .footer-widget-area.foot-padding1 ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer8-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer8-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer8-section-area .footer-widget-area.foot-padding2 ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer8-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-13);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer8-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer8-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer8-section-area .footer-widget-area ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
}
.vl-footer8-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.vl-footer8-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer8-section-area .footer-widget-area ul.time-area {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 6px 28px 24px 28px;
margin-top: 24px;
}
.vl-footer8-section-area .footer-widget-area ul.time-area li {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 18px;
border-bottom: 1px solid #E8EAEC;
padding-top: 18px;
}
.vl-footer8-section-area .footer-widget-area ul.time-area li:nth-child(3) {
padding-bottom: 0;
padding-top: 18px;
border: none;
}
.vl-footer8-section-area .footer-widget-area ul.time-area li span a {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-family-font1);
font-style: normal;
font-weight: var(--ztc-weight-medium);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
}
.vl-footer8-section-area .footer-widget-area ul.time-area li span a:nth-child(1) {
font-weight: var(--ztc-weight-semibold);
}
.vl-footer8-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DFD7B8;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer8-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer8-section-area .copyright-area a {
color: var(--ztc-text-text-10);
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: 18px;
display: inline-block;
transition: all 0.4s;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer8-section-area .copyright-area a {
line-height: 24px;
}
}
@media (max-width: 767px) {
.vl-footer8-section-area .copyright-area ul.social-links {
margin-top: 20px;
}
}
.vl-footer8-section-area .copyright-area ul.social-links li {
display: inline-block;
}
.vl-footer8-section-area .copyright-area ul.social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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-12);
opacity: 1;
}
.vl-footer8-section-area .copyright-area ul.social-links li a:hover {
background: var(--ztc-bg-bg-16);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}

.vl-footer9-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
padding: 250px 0 32px;
margin: 0 60px 60px 60px;
border-radius: 10px;
}
@media (max-width: 767px) {
.vl-footer9-section-area {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer9-section-area {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer9-section-area {
margin: 0;
}
}
.vl-footer9-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer9-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0);
}
.vl-footer9-section-area .footer-logo-area p {
color: var(--ztc-text-text-10);
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: 26px;
letter-spacing: -0.32px;
}
.vl-footer9-section-area .footer-logo-area .contact-logo li {
padding-top: 20px;
}
.vl-footer9-section-area .footer-logo-area .contact-logo li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer9-section-area .footer-logo-area .contact-logo li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.vl-footer9-section-area .footer-logo-area .contact-logo li a svg {
margin: 0 5px 0 0;
filter: brightness(0);
opacity: 90%;
}
.vl-footer9-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer9-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer9-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer9-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer9-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer9-section-area .footer-widget-area.foot-padding1 ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer9-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer9-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer9-section-area .footer-widget-area.foot-padding2 ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer9-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer9-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer9-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer9-section-area .footer-widget-area ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
}
.vl-footer9-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.vl-footer9-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer9-section-area .footer-widget-area ul.time-area {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 6px 28px 24px 28px;
margin-top: 24px;
}
.vl-footer9-section-area .footer-widget-area ul.time-area li {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 18px;
border-bottom: 1px solid #DDE0E3;
padding-top: 18px;
}
.vl-footer9-section-area .footer-widget-area ul.time-area li:nth-child(3) {
padding-bottom: 0;
padding-top: 18px;
border: none;
}
.vl-footer9-section-area .footer-widget-area ul.time-area li span a {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-family-font1);
font-style: normal;
font-weight: var(--ztc-weight-medium);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
}
.vl-footer9-section-area .footer-widget-area ul.time-area li span a:nth-child(1) {
font-weight: var(--ztc-weight-semibold);
}
.vl-footer9-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DDE0E3;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer9-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer9-section-area .copyright-area a {
color: var(--ztc-text-text-10);
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: 18px;
display: inline-block;
transition: all 0.4s;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer9-section-area .copyright-area a {
line-height: 24px;
}
}
@media (max-width: 767px) {
.vl-footer9-section-area .copyright-area ul.social-links {
margin-top: 20px;
}
}
.vl-footer9-section-area .copyright-area ul.social-links li {
display: inline-block;
}
.vl-footer9-section-area .copyright-area ul.social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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-12);
opacity: 1;
}
.vl-footer9-section-area .copyright-area ul.social-links li a:hover {
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}

.vl-footer10-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
padding: 250px 0 32px;
}
.vl-footer10-section-area .footer-logo-area {
position: relative;
z-index: 1;
}
.vl-footer10-section-area .footer-logo-area img {
width: 210px;
height: 44px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0);
}
.vl-footer10-section-area .footer-logo-area p {
color: var(--ztc-text-text-10);
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: 26px;
letter-spacing: -0.32px;
}
.vl-footer10-section-area .footer-logo-area .contact-logo li {
padding-top: 20px;
}
.vl-footer10-section-area .footer-logo-area .contact-logo li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer10-section-area .footer-logo-area .contact-logo li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.vl-footer10-section-area .footer-logo-area .contact-logo li a svg {
margin: 0 5px 0 0;
filter: brightness(0);
opacity: 90%;
}
.vl-footer10-section-area .footer-widget-area.foot-padding1 {
padding-left: 70px;
}
@media (max-width: 767px) {
.vl-footer10-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.vl-footer10-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.vl-footer10-section-area .footer-widget-area.foot-padding1 {
padding: 0;
}
}
.vl-footer10-section-area .footer-widget-area.foot-padding1 ul li {
padding-top: 24px;
}
.vl-footer10-section-area .footer-widget-area.foot-padding1 ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer10-section-area .footer-widget-area.foot-padding1 ul li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer10-section-area .footer-widget-area.foot-padding2 ul li {
padding-top: 24px;
}
.vl-footer10-section-area .footer-widget-area.foot-padding2 ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
opacity: 90%;
}
.vl-footer10-section-area .footer-widget-area.foot-padding2 ul li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
padding-left: 5px;
}
.vl-footer10-section-area .footer-widget-area h3 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
margin-bottom: 4px;
}
.vl-footer10-section-area .footer-widget-area ul li {
padding-top: 24px;
}
.vl-footer10-section-area .footer-widget-area ul li a {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
}
.vl-footer10-section-area .footer-widget-area ul li a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.vl-footer10-section-area .footer-widget-area ul li a svg {
margin: 0 5px 0 0;
}
.vl-footer10-section-area .footer-widget-area ul.time-area {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 6px 28px 24px 28px;
margin-top: 24px;
}
.vl-footer10-section-area .footer-widget-area ul.time-area li {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 18px;
border-bottom: 1px solid #DDE0E3;
padding-top: 18px;
}
.vl-footer10-section-area .footer-widget-area ul.time-area li:nth-child(3) {
padding-bottom: 0;
padding-top: 18px;
border: none;
}
.vl-footer10-section-area .footer-widget-area ul.time-area li span a {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-family-font1);
font-style: normal;
font-weight: var(--ztc-weight-medium);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
}
.vl-footer10-section-area .footer-widget-area ul.time-area li span a:nth-child(1) {
font-weight: var(--ztc-weight-semibold);
}
.vl-footer10-section-area .copyright-area {
display: flex;
align-items: center;
justify-content: space-between;
border-top: 1px solid #DDE0E3;
padding-top: 24px;
}
@media (max-width: 767px) {
.vl-footer10-section-area .copyright-area {
display: block;
text-align: center;
}
}
.vl-footer10-section-area .copyright-area a {
color: var(--ztc-text-text-10);
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: 18px;
display: inline-block;
transition: all 0.4s;
opacity: 80%;
}
@media (max-width: 767px) {
.vl-footer10-section-area .copyright-area a {
line-height: 24px;
}
}
@media (max-width: 767px) {
.vl-footer10-section-area .copyright-area ul.social-links {
margin-top: 20px;
}
}
.vl-footer10-section-area .copyright-area ul.social-links li {
display: inline-block;
}
.vl-footer10-section-area .copyright-area ul.social-links li a {
height: 36px;
width: 36px;
text-align: center;
line-height: 36px;
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-12);
opacity: 1;
}
.vl-footer10-section-area .copyright-area ul.social-links li a:hover {
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}

/*============= FOOTER CSS AREA ===============*/
/*============= HERO CSS AREA ===============*/
.hero1-section-area {
position: relative;
z-index: 1;
overflow: hidden;
padding: 300px 0 290px;
}
@media (max-width: 767px) {
.hero1-section-area {
padding: 180px 0 140px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero1-section-area {
padding: 180px 0 180px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero1-section-area {
padding: 180px 0 180px;
}
}
.hero1-section-area .hero-header {
position: relative;
z-index: 1;
}
.hero1-section-area .hero-header h5 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.hero1-section-area .hero-header h5 img {
margin: 0 4px 0 0;
}
@media (max-width: 767px) {
.hero1-section-area .hero-header h5 {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.hero1-section-area .hero-header h1 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s64);
font-style: normal;
font-weight: var(--ztc-weight-black);
line-height: 72px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.hero1-section-area .hero-header h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.hero1-section-area .hero-header p {
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 26px;
}
.hero1-section-area .hero-img1 img {
position: absolute;
top: 100px;
right: 0;
height: 915px;
width: 55%;
z-index: -1;
}
@media (max-width: 767px) {
.hero1-section-area .hero-img1 img {
position: relative;
width: 100%;
right: 0;
height: 100%;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero1-section-area .hero-img1 img {
position: relative;
width: 100%;
right: 0;
height: 100%;
top: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero1-section-area .hero-img1 img {
position: relative;
width: 100%;
right: 0;
height: 100%;
top: 0;
}
}
.hero1-section-area .video-background {
top: 0;
left: 0;
position: absolute;
z-index: -1;
width: 100%;
}
.hero1-section-area video {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
}

.slider-arrow-main {
position: relative;
z-index: 1;
}
.slider-arrow-main .hero2-slider-main {
position: relative;
z-index: 1;
overflow: hidden;
}
.slider-arrow-main .hero2-slider-main .slick-slide.slick-current.slick-active h5 {
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(0px);
opacity: 1;
}
.slider-arrow-main .hero2-slider-main .slick-slide.slick-current.slick-active h2 {
transition: transform 1600ms ease, opacity 1600ms ease;
transform: translateX(0px);
opacity: 1;
}
.slider-arrow-main .hero2-slider-main .slick-slide.slick-current.slick-active p {
transition: transform 1700ms ease, opacity 1700ms ease;
transform: translateX(0px);
opacity: 0.9 !important;
}
.slider-arrow-main .hero2-slider-main .slick-slide.slick-current.slick-active .play-btns-area {
transition: transform 1800ms ease, opacity 1800ms ease;
transform: translateX(0px);
opacity: 1;
}
.slider-arrow-main .hero2-slider-main .hero2-section-area {
position: relative;
z-index: 1;
padding: 280px 0 120px;
}
@media (max-width: 767px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area {
padding: 160px 0 120px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area {
padding: 200px 0 120px;
}
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .hero-bg2 {
position: absolute;
top: 0;
left: 0;
bottom: 0;
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
z-index: -1;
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading {
position: relative;
z-index: 1;
overflow: hidden;
}
@media (max-width: 767px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading {
overflow: inherit;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading {
overflow: inherit;
}
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading h5 {
color: var(--ztc-text-text-1);
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;
text-transform: uppercase;
border-radius: 4px;
padding: 10px;
background: rgba(255, 255, 255, 0.1);
transform: translateX(-600px);
opacity: 0;
position: relative;
overflow: hidden;
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading h2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s70);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 74px;
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(-800px);
position: relative;
opacity: 0;
}
@media (max-width: 767px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading h2 {
font-size: var(--ztc-font-size-font-s64);
line-height: 68px;
}
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading p {
color: rgba(255, 255, 255, 0.9);
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: 26px;
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(-900px);
position: relative;
opacity: 0 !important;
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading .play-btns-area {
display: flex;
align-items: center;
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(-1000px);
position: relative;
opacity: 0;
}
@media (max-width: 767px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading .play-btns-area {
display: inline-block;
}
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading .play-btns-area .play-btn {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
padding-left: 24px;
display: inline-block;
}
@media (max-width: 767px) {
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading .play-btns-area .play-btn {
padding-left: 0;
margin-top: 20px;
}
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading .play-btns-area .play-btn .video {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
color: var(--ztc-text-text-5);
background: var(--ztc-bg-bg-1);
font-size: var(--ztc-font-size-font-s20);
margin: 0 10px 0 0;
position: relative;
z-index: 1;
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .slider-heading .play-btns-area .play-btn .video::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 28px;
top: 28px;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
border-radius: 50%;
z-index: -1;
animation: pulse-border 1500ms ease-out infinite;
opacity: 40%;
}
.slider-arrow-main .hero2-slider-main .hero2-section-area .elements1 {
position: absolute;
bottom: 0;
right: 0;
}
.slider-arrow-main .testimonial-arrows {
position: absolute;
z-index: 2;
right: 30px;
bottom: 50px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
.slider-arrow-main .testimonial-arrows {
bottom: 0;
}
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.slider-arrow-main .testimonial-arrows {
bottom: 50px;
}
}
@media (max-width: 767px) {
.slider-arrow-main .testimonial-arrows {
bottom: 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.slider-arrow-main .testimonial-arrows {
bottom: 50px;
}
}
.slider-arrow-main .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.slider-arrow-main .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.slider-arrow-main .testimonial-arrows .testimonial-next-arrow-h2 {
margin-top: 12px;
}

.hero3-arrow-slider {
position: relative;
z-index: 1;
}
.hero3-arrow-slider .hero3-slick-slider {
position: relative;
z-index: 1;
}
.hero3-arrow-slider .hero3-slick-slider .slick-slide.slick-current.slick-active .header-content-area {
transition: transform 1800ms ease, opacity 1800ms ease;
transform: translateY(0px);
opacity: 1;
}
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header {
position: relative;
z-index: 1;
padding: 405px 0 60px;
margin: 90px 45px 0 45px;
border-radius: 40px;
}
@media (max-width: 767px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header {
border-radius: 0;
margin: 90px 0 0 0;
padding: 300px 0 60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header {
border-radius: 0;
margin: 90px 0 0 0;
padding: 300px 0 60px;
}
}
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area {
background: var(--ztc-bg-bg-1);
padding: 48px;
position: relative;
z-index: 1;
border-radius: 8px;
transform: translateY(-300px);
opacity: 0;
position: relative;
overflow: hidden;
transition: transform 1800ms ease, opacity 1800ms ease;
}
@media (max-width: 767px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area {
padding: 24px;
text-align: center;
}
}
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading h5 {
color: var(--ztc-text-text-6);
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;
padding: 10px;
border-radius: 4px;
background: rgba(236, 74, 5, 0.08);
text-transform: uppercase;
}
@media (max-width: 767px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading h5 {
font-size: var(--ztc-font-size-font-s12);
line-height: 12px;
}
}
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s70);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 78px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading h2 {
font-size: var(--ztc-font-size-font-s60);
line-height: 70px;
}
}
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading p {
color: var(--ztc-text-text-3);
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: 26px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.hero3-arrow-slider .hero3-slick-slider .hero3-slider-header .header-content-area .hero3-heading .btn-area1 a {
font-size: var(--ztc-font-size-font-s16);
line-height: 16px;
}
}
.hero3-arrow-slider .testimonial-arrows {
position: absolute;
z-index: 2;
right: 80px;
top: 50%;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
.hero3-arrow-slider .testimonial-arrows {
bottom: 0;
}
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.hero3-arrow-slider .testimonial-arrows {
top: 37%;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero3-arrow-slider .testimonial-arrows {
top: 37%;
}
}
@media (max-width: 767px) {
.hero3-arrow-slider .testimonial-arrows {
top: 27%;
right: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero3-arrow-slider .testimonial-arrows {
top: 20%;
right: 30px;
}
}
.hero3-arrow-slider .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.hero3-arrow-slider .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-7);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.hero3-arrow-slider .testimonial-arrows .testimonial-next-arrow-h3 {
margin-top: 12px;
}

.hero4-section-area {
position: relative;
z-index: 1;
overflow: hidden;
padding: 200px 0 0;
}
.hero4-section-area .hero4-header h5 {
color: var(--ztc-text-text-1);
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;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border-radius: 50px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.1);
padding: 10px 14px;
}
@media (max-width: 767px) {
.hero4-section-area .hero4-header h5 {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.hero4-section-area .hero4-header h2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s64);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 72px;
}
@media (max-width: 767px) {
.hero4-section-area .hero4-header h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero4-section-area .hero4-header h2 {
font-size: var(--ztc-font-size-font-s50);
line-height: 60px;
}
}
.hero4-section-area .hero4-header p {
color: rgba(255, 255, 255, 0.9);
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: 26px;
}
.hero4-section-area .hero-main-img-area {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.hero4-section-area .hero-main-img-area {
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero4-section-area .hero-main-img-area {
text-align: center;
}
}
.hero4-section-area .hero-main-img-area .elements3 {
position: absolute;
top: 75px;
z-index: -1;
max-width: 800px;
max-height: 800px;
-o-object-fit: contain;
 object-fit: contain;
border-radius: 50%;
left: -70px;
}
.hero4-section-area .hero-main-img-area .check-text {
display: flex;
align-items: center;
background: var(--ztc-bg-bg-1);
padding: 16px;
border-radius: 4px;
width: 330px;
position: absolute;
bottom: 100px;
transform: rotate(15deg);
}
.hero4-section-area .hero-main-img-area .check-text .icons img {
height: 40px;
width: 40px;
border-radius: 50%;
-o-object-fit: cover;
 object-fit: cover;
max-height: 40px;
max-width: 40px;
}
.hero4-section-area .hero-main-img-area .check-text .content p {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 24px;
display: inline-block;
padding-left: 8px;
}
.hero4-section-area .hero-main-img-area .client-text {
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 24px;
display: inline-block;
transform: rotate(-10deg);
position: absolute;
top: 100px;
right: -50px;
}
@media (max-width: 767px) {
.hero4-section-area .hero-main-img-area .client-text {
display: none;
}
}
.hero4-section-area .hero-main-img-area .client-text p {
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;
}
.hero4-section-area .hero-main-img-area .client-text p i {
color: var(--ztc-text-text-7);
margin: 0 4px 0 0;
}

.hero5-area {
position: relative;
z-index: 1;
overflow: hidden;
margin: 125px 55px 0 55px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero5-area {
margin: 125px 20px 0 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero5-area {
margin: 100px 0 0 0;
}
}
@media (max-width: 767px) {
.hero5-area {
margin: 100px 0 0 0;
}
}
.hero5-area .hero5-main-content {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
padding: 60px;
border-radius: 16px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero5-area .hero5-main-content {
padding: 30px;
}
}
@media (max-width: 767px) {
.hero5-area .hero5-main-content {
padding: 16px;
}
}
.hero5-area .hero5-main-content::after {
position: absolute;
content: "";
height: 100px;
width: 100px;
right: 0;
bottom: 0;
background: var(--ztc-bg-bg-1);
border-radius: 16px 0 0 0;
}
@media (max-width: 767px) {
.hero5-area .hero5-main-content::after {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero5-area .hero5-main-content::after {
display: none;
}
}
.hero5-area .hero5-main-content h5 {
color: var(--ztc-text-text-8);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
padding: 10px 14px;
border-radius: 8px;
background: rgba(28, 24, 83, 0.1);
text-transform: uppercase;
}
@media (max-width: 767px) {
.hero5-area .hero5-main-content h5 {
font-size: var(--ztc-font-size-font-s12);
line-height: 14px;
}
}
.hero5-area .hero5-main-content h1 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s64);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 78px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.hero5-area .hero5-main-content h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero5-area .hero5-main-content h1 {
font-size: var(--ztc-font-size-font-s50);
line-height: 60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero5-area .hero5-main-content h1 {
font-size: var(--ztc-font-size-font-s50);
line-height: 60px;
}
}
.hero5-area .hero5-main-content p {
color: var(--ztc-text-text-3);
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: 26px;
}
.hero5-area .hero5-main-content .btn-area1 .vl-btn5.btn2 {
margin-left: 16px;
background: transparent;
border: 1px solid var(--ztc-text-text-2);
color: var(--ztc-text-text-2) !important;
}
@media (max-width: 767px) {
.hero5-area .hero5-main-content .btn-area1 .vl-btn5.btn2 {
margin-left: 0;
margin-top: 20px;
}
}
.hero5-area .hero5-main-content .btn-area1 .vl-btn5.btn2::before {
background: var(--ztc-bg-bg-2);
opacity: 20%;
transition: all 0.4s;
}
.hero5-area .hero5-main-content .btn-area1 .vl-btn5.btn2:hover {
color: var(--ztc-text-text-1) !important;
transition: all 0.4s;
}
.hero5-area .hero5-main-content .btn-area1 .vl-btn5.btn2:hover::before {
background: var(--ztc-bg-bg-1);
opacity: 20%;
transition: all 0.4s;
}
@media (max-width: 767px) {
.hero5-area .img1 {
margin-top: 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero5-area .img1 {
margin-top: 20px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero5-area .img1 {
margin-top: 20px;
}
}
.hero5-area .img1 img {
height: 400px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
.hero5-area .img1 img {
height: 100%;
}
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.hero5-area .img1 img {
height: 100%;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero5-area .img1 img {
height: 360px;
}
}
.hero5-area .counter-boxarea {
background: var(--ztc-bg-bg-4);
border-radius: 16px;
padding: 28px 32px;
margin-top: 20px;
}
.hero5-area .counter-boxarea p {
font-size: var(--ztc-font-size-font-s16);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero5-area .counter-boxarea p {
font-size: var(--ztc-font-size-font-s12);
}
}
.hero5-area .testimonial-header-box {
position: relative;
z-index: 1;
}
.hero5-area .testimonial-header-box .testimonial-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-11);
border-radius: 16px;
padding: 32px;
margin-top: 20px;
}
.hero5-area .testimonial-header-box .testimonial-boxarea ul li {
display: inline-block;
color: var(--ztc-text-text-1);
}
.hero5-area .testimonial-header-box .testimonial-boxarea p {
color: rgba(255, 255, 255, 0.8);
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: 30px;
}
.hero5-area .testimonial-header-box .testimonial-boxarea a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
}
.hero5-area .header-conatct-box {
background: var(--ztc-bg-bg-4);
border-radius: 16px;
padding: 16px 24px 32px 24px;
position: relative;
z-index: 1;
top: -80px;
margin: 0 0 0 40px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
.hero5-area .header-conatct-box {
margin: 0 0 0 16px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero5-area .header-conatct-box {
margin: 0 0 0 10px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero5-area .header-conatct-box {
margin: 20px 0 0 0;
top: 0;
}
}
@media (max-width: 767px) {
.hero5-area .header-conatct-box {
margin: 20px 0 0 0;
top: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero5-area .header-conatct-box {
margin: 20px 0 0 0;
top: 0;
}
}
.hero5-area .header-conatct-box .input-area {
margin-top: 16px;
}
.hero5-area .header-conatct-box .input-area input {
color: var(--ztc-text-text-2);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
}
.hero5-area .header-conatct-box .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.hero5-area .header-conatct-box .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.hero5-area .header-conatct-box .input-area .nice-select {
color: var(--ztc-text-text-3);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: auto;
border: none;
box-shadow: none;
}
.hero5-area .header-conatct-box .input-area .nice-select::after {
height: 7px;
width: 7px;
right: 16px;
}
.hero5-area .header-conatct-box .input-area .nice-select ul {
width: 100%;
}
.hero5-area .header-conatct-box .input-area textarea {
color: var(--ztc-text-text-2);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: 120px;
}
.hero5-area .header-conatct-box .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.hero5-area .header-conatct-box .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
}
.hero5-area .header-conatct-box .input-area button {
border: none;
outline: none;
}

.hero-inner-area {
position: relative;
z-index: 1;
overflow: hidden;
padding: 300px 0 140px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero-inner-area {
padding: 160px 0 0;
}
}
@media (max-width: 767px) {
.hero-inner-area {
padding: 160px 0 0;
}
}
.hero-inner-area .img1 {
position: absolute;
right: 0;
bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero-inner-area .img1 {
position: relative;
left: 0;
}
}
@media (max-width: 767px) {
.hero-inner-area .img1 {
position: relative;
left: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero-inner-area .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}
@media (max-width: 767px) {
.hero-inner-area .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}
.hero-inner-area .inner-header h2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s64);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 64px;
}
@media (max-width: 767px) {
.hero-inner-area .inner-header h2 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero-inner-area .inner-header h2 {
font-size: var(--ztc-font-size-font-s50);
line-height: 60px;
}
}
.hero-inner-area .inner-header span {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.hero-inner-area .inner-header span a {
color: var(--ztc-text-text-1);
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;
}
.hero-inner-area .inner-header span i {
margin: 0 6px;
}

.hero6-section-area {
position: relative;
z-index: 1;
overflow: hidden;
padding: 300px 0 290px;
}
@media (max-width: 767px) {
.hero6-section-area {
padding: 180px 0 140px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero6-section-area {
padding: 180px 0 180px;
}
}
.hero6-section-area::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-2);
opacity: 60%;
transition: all 0.4s;
z-index: -1;
}
.hero6-section-area .hero-header {
position: relative;
z-index: 1;
}
.hero6-section-area .hero-header h5 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
text-transform: uppercase;
}
.hero6-section-area .hero-header h5 img {
margin: 0 4px 0 0;
filter: brightness(0) invert(1);
}
@media (max-width: 767px) {
.hero6-section-area .hero-header h5 {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.hero6-section-area .hero-header h1 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s64);
font-style: normal;
font-weight: var(--ztc-weight-black);
line-height: 72px;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.hero6-section-area .hero-header h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
.hero6-section-area .hero-header p {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 26px;
opacity: 80% !important;
}
.hero6-section-area .hero-img1 img {
position: absolute;
top: 100px;
right: 0;
height: 915px;
width: 55%;
z-index: -1;
}
@media (max-width: 767px) {
.hero6-section-area .hero-img1 img {
position: relative;
width: 100%;
right: 0;
height: 100%;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero6-section-area .hero-img1 img {
position: relative;
width: 100%;
right: 0;
height: 100%;
top: 0;
}
}
.hero6-section-area .video-background {
top: 0;
left: 0;
position: absolute;
z-index: -1;
width: 100%;
height: 100%;
}
.hero6-section-area video {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
}

.hero7-slider-arrow {
position: relative;
z-index: 1;
}
.hero7-slider-arrow .hero7-slider-area {
position: relative;
z-index: 1;
}
.hero7-slider-arrow .hero7-slider-area .slick-slide.slick-current.slick-active h5 {
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(0px);
opacity: 1;
}
.hero7-slider-arrow .hero7-slider-area .slick-slide.slick-current.slick-active h1 {
transition: transform 1600ms ease, opacity 1600ms ease;
transform: translateX(0px);
opacity: 1;
}
.hero7-slider-arrow .hero7-slider-area .slick-slide.slick-current.slick-active p {
transition: transform 1700ms ease, opacity 1700ms ease;
transform: translateX(0px);
opacity: 0.9 !important;
}
.hero7-slider-arrow .hero7-slider-area .slick-slide.slick-current.slick-active .btn-area1 {
transition: transform 1800ms ease, opacity 1800ms ease;
transform: translateX(0px);
opacity: 1;
}
.hero7-slider-arrow .hero7-slider-area .slick-slide.slick-current.slick-active .hero7-img .img1 {
transform: scale(1.1);
}
.hero7-slider-arrow .hero7-slider-area .hero7-section {
position: relative;
z-index: 1;
overflow: hidden;
padding: 300px 0 120px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero7-slider-arrow .hero7-slider-area .hero7-section {
padding: 180px 0 120px;
}
}
@media (max-width: 767px) {
.hero7-slider-arrow .hero7-slider-area .hero7-section {
padding: 180px 0 120px;
}
}
.hero7-slider-arrow .hero7-slider-area .hero7-section::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
background: linear-gradient(270deg, rgba(0, 8, 20, 0.1) 0%, #00091B 100%);
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-img img {
position: absolute;
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
top: 0;
z-index: -2;
transform: scale(1);
transition: transform 8000ms ease, opacity 1800ms ease-in;
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading {
position: relative;
z-index: 1;
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading h5 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 16px;
text-transform: uppercase;
transform: translateX(-600px);
opacity: 0;
position: relative;
overflow: hidden;
}
@media (max-width: 767px) {
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading h5 {
font-size: var(--ztc-font-size-font-s10);
line-height: 12px;
}
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading h5 img {
filter: brightness(0) invert(1);
margin: 0 4px 0 0;
height: 16px;
width: 16px;
-o-object-fit: cover;
 object-fit: cover;
display: inline-block;
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading h1 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s60);
font-style: normal;
font-weight: var(--ztc-weight-black);
line-height: 68px;
display: inline-block;
transition: all 0.4s;
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(-800px);
position: relative;
opacity: 0;
}
@media (max-width: 767px) {
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading h1 {
font-size: var(--ztc-font-size-font-s32);
line-height: 40px;
}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading h1 {
font-size: var(--ztc-font-size-font-s50);
line-height: 60px;
}
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading p {
color: var(--ztc-text-text-1);
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: 26px;
opacity: 80%;
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(-900px);
position: relative;
opacity: 0;
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading .btn-area1 {
transition: transform 1400ms ease, opacity 1400ms ease;
transform: translateX(-1000px);
position: relative;
opacity: 0;
}
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading .btn-area1 .vl-btn7 {
margin-left: 16px;
}
@media (max-width: 767px) {
.hero7-slider-arrow .hero7-slider-area .hero7-section .hero7-heading .btn-area1 .vl-btn7 {
margin-left: 0;
margin-top: 16px;
}
}
.hero7-slider-arrow .testimonial-arrows {
position: absolute;
z-index: 2;
right: 50px;
top: 50%;
margin-top: -32px;
}
@media (max-width: 767px) {
.hero7-slider-arrow .testimonial-arrows {
bottom: 50px;
top: inherit;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero7-slider-arrow .testimonial-arrows {
bottom: 50px;
top: inherit;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero7-slider-arrow .testimonial-arrows {
bottom: 50px;
top: inherit;
}
}
.hero7-slider-arrow .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.hero7-slider-arrow .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-13);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.hero7-slider-arrow .testimonial-arrows .testimonial-next-arrow-h2 {
margin-top: 12px;
}

.homepage8-section {
position: relative;
z-index: 1;
overflow: hidden;
padding: 180px 0 0 0;
}
.homepage8-section::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
background: var(--ztc-bg-bg-12);
opacity: 70%;
left: 0;
top: 0;
z-index: -1;
}
.homepage8-section .hero8-images {
position: relative;
z-index: 1;
}
.homepage8-section .hero8-images .hero8-img {
width: 630px;
height: 630px;
}
@media (max-width: 767px) {
.homepage8-section .hero8-images .hero8-img {
height: 100%;
width: 100%;
-o-object-fit: cover;
   object-fit: cover;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage8-section .hero8-images .hero8-img {
height: 100%;
width: 100%;
-o-object-fit: cover;
   object-fit: cover;
margin-top: 30px;
}
}
.homepage8-section .hero8-images .hero8-img img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.homepage8-section .hero8-images .hero8-heading {
position: relative;
z-index: 2;
}

.hero9-section {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
padding: 208px 0 100px;
}
@media (max-width: 767px) {
.hero9-section {
margin: 0;
padding: 180px 0 50px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero9-section {
margin: 0;
padding: 180px 0 50px;
}
}
.hero9-section .heading9 {
padding: 0 40px 0 0;
}
@media (max-width: 767px) {
.hero9-section .heading9 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero9-section .heading9 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero9-section .heading9 {
padding: 0;
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.hero9-section .heading9 h5 {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.hero9-section .heading9 h1 img {
margin-top: 10px;
}
.hero9-section .heading9 .btn-area1 .vl-btn11 {
margin-left: 16px;
}
@media (max-width: 767px) {
.hero9-section .heading9 .btn-area1 .vl-btn11 {
margin-left: 0;
margin-top: 16px;
}
}
.hero9-section .header-submit-boxarea {
background: var(--ztc-bg-bg-14);
transition: all 0.4s;
position: relative;
z-index: 1;
padding: 30px;
border-radius: 10px;
}
.hero9-section .header-submit-boxarea h4 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
}
.hero9-section .header-submit-boxarea p {
color: var(--ztc-text-text-10);
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: 24px;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .nav-item {
margin: 0 8px 0 0;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .nav-item:nth-last-child(1) {
margin: 0;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .nav-item button {
color: var(--ztc-bg-bg-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
background: var(--ztc-bg-bg-1);
padding: 12px;
border-radius: 8px;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .nav-item button.active {
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area {
position: relative;
z-index: 1;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area svg {
position: absolute;
right: 16px;
top: 16px;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area input {
width: 100%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-10);
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;
padding: 18px 16px;
border-radius: 8px;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area textarea {
width: 100%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-10);
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;
padding: 18px 16px;
border-radius: 8px;
height: 140px;
border: none;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area button {
width: 100%;
text-align: center;
border: none;
outline: none;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area2 .nice-select {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 18px;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: auto;
box-shadow: none;
border-radius: 8px;
border: none;
display: block;
position: relative;
z-index: 2;
margin-bottom: 20px;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area2 .nice-select::after {
height: 7px;
width: 7px;
right: 16px;
}
.hero9-section .header-submit-boxarea .submit-tabs-area .tab-content .tab-pane .tabs-submit .input-area2 .nice-select ul {
width: 100%;
}
.hero9-section .hero9-images {
position: relative;
margin-top: -344px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.hero9-section .hero9-images {
margin-top: -300px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero9-section .hero9-images {
margin-top: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero9-section .hero9-images {
margin-top: 0;
margin-top: 30px;
}
}
@media (max-width: 767px) {
.hero9-section .hero9-images {
margin-top: 0;
margin-top: 30px;
}
}
.hero9-section .hero9-images img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}

.hero10-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.hero10-section .img1 {
position: relative;
z-index: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero10-section .img1 {
margin-top: 50px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero10-section .img1 {
margin-top: 50px;
}
}
@media (max-width: 767px) {
.hero10-section .img1 {
margin-top: 150px;
}
}
.hero10-section .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
}
@media (max-width: 767px) {
.hero10-section .img1 img {
height: 400px;
}
}
.hero10-section .elements23 {
position: absolute;
left: 20px;
top: 250px;
z-index: 1;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.hero10-section .elements23 {
z-index: -1;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero10-section .elements23 {
z-index: -1;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero10-section .elements23 {
right: 0;
left: inherit;
z-index: -1;
top: 100px;
}
}
@media (max-width: 767px) {
.hero10-section .elements23 {
display: none;
}
}
.hero10-section .hero-main-heading {
position: relative;
z-index: 1;
top: 210px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
.hero10-section .hero-main-heading {
top: 180px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero10-section .hero-main-heading {
top: 180px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero10-section .hero-main-heading {
top: 180px;
}
}
@media (max-width: 767px) {
.hero10-section .hero-main-heading {
top: 180px;
}
}
.hero10-section .hero-main-heading h1 {
color: var(--ztc-text-text-12);
text-shadow: 4px 4px 12px rgba(246, 30, 38, 0.07);
font-family: var(--ztc-family-font1);
font-size: 140px;
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 120px;
text-transform: uppercase;
position: relative;
}
@media (max-width: 767px) {
.hero10-section .hero-main-heading h1 {
font-size: var(--ztc-font-size-font-s48);
line-height: 48px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero10-section .hero-main-heading h1 {
font-size: 80px;
line-height: 80px;
}
}
.hero10-section .hero-main-heading h1 span {
color: #71717A;
display: inline-block;
position: absolute;
right: 0;
z-index: -1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero10-section .hero-main-heading h1 span {
position: relative;
}
}
.hero10-section .hero-main-heading p {
color: var(--ztc-text-text-10);
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: 28px;
display: inline-block;
width: 350px;
position: absolute;
right: 0;
top: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.hero10-section .hero-main-heading p {
position: relative;
margin-top: -70px;
}
}
@media (max-width: 767px) {
.hero10-section .hero-main-heading p {
position: relative;
width: 100%;
margin-top: 60px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.hero10-section .hero-main-heading p {
width: 240px;
}
}

/*============= HERO CSS AREA ===============*/
/*============= HEADER CSS AREA STARTS ===============*/
.homepage1-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
}
@media (max-width: 767px) {
.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: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
}
.homepage1-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
padding: 16px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage1-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage1-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage1-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage1-body .vl-transparent-header .vl-hero-btn .btn-area1 a svg {
margin: -4px 3px 0 0;
}
.homepage1-body .vl-transparent-header .header-top-area {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 16px;
border-bottom: 1px solid rgba(15, 13, 13, 0.1);
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
@media (max-width: 767px) {
.homepage1-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage1-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage1-body .vl-transparent-header .header-top-area {
display: none;
}
}
.homepage1-body .vl-transparent-header .header-top-area .header-list p {
color: var(--ztc-text-text-2);
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;
}
.homepage1-body .vl-transparent-header .header-top-area .header-list p a {
color: var(--ztc-text-text-2);
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;
padding-left: 5px;
transition: all 0.4s;
}
.homepage1-body .vl-transparent-header .header-top-area .header-list p a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.homepage1-body .vl-transparent-header .header-top-area ul li {
display: inline-block;
margin: 0 8px 0 0;
}
.homepage1-body .vl-transparent-header .header-top-area ul li:nth-last-child(1) {
margin: 0;
}
.homepage1-body .vl-transparent-header .header-top-area ul li span {
color: #E8EAEC;
display: inline-block;
margin: 0 8px;
}
.homepage1-body .vl-transparent-header .header-top-area ul li:nth-child(1) a {
color: var(--ztc-text-text-2);
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;
}
.homepage1-body .vl-transparent-header .header-top-area ul li:nth-child(1) a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.homepage1-body .vl-transparent-header .header-top-area ul li:nth-child(1) a svg {
margin: 0 4px 0 0;
}
.homepage1-body .vl-transparent-header .header-top-area ul li .social {
height: 40px;
width: 40px;
text-align: center;
line-height: 37px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: #F2F2F2;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.homepage1-body .vl-transparent-header .header-top-area ul li .social:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.homepage1-body .vl-transparent-header .row-bg1 {
background: var(--ztc-bg-bg-1);
padding: 16px;
border-radius: 0 0 8px 8px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.homepage1-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage1-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage1-body .vl-transparent-header .row-bg1::after {
position: absolute;
content: "";
height: 100%;
width: 5px;
left: 0;
top: 0;
background: var(--ztc-bg-bg-3);
border-radius: 0 0 0 8px;
}
@media (max-width: 767px) {
.homepage1-body .vl-transparent-header .row-bg1::after {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage1-body .vl-transparent-header .row-bg1::after {
display: none;
}
}
.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-2);
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: 201%;
transform: scale(1);
}
.homepage1-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage1-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage1-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage1-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage1-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage1-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage1-body .vl-home-thumb .btn-area1 a.vl-btn1 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
padding: 19px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage1-body .vl-home-thumb .btn-area1 a.vl-btn1::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage1-body .vl-home-thumb .btn-area1 a.vl-btn1:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage1-body .vl-home-thumb .btn-area1 a.vl-btn1:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage1-body .vl-home-thumb .btn-area1 a.vl-btn1 i {
margin-left: 4px;
}
.homepage1-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 18px;
font-weight: var(--ztc-weight-medium);
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;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage1-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.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);
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
}
.homepage1-body .header-sticky::after {
display: none !important;
}
.homepage1-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage1-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage1-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage1-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
.homepage1-body .header-sticky .space16 {
display: none !important;
}
.homepage1-body .header-sticky .header-top-area {
display: none;
}

.homepage2-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
}
@media (max-width: 767px) {
.homepage2-body .vl-transparent-header {
background: var(--ztc-bg-bg-3);
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage2-body .vl-transparent-header {
background: var(--ztc-bg-bg-3);
}
}
.homepage2-body .vl-transparent-header .vl-logo img {
width: 100%;
height: 92px;
-o-object-fit: contain;
 object-fit: contain;
}
.homepage2-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-5);
padding: 16px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage2-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
border: 1px solid #00a6e4;
}
.homepage2-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage2-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage2-body .vl-transparent-header .vl-hero-btn .btn-area1 a svg {
margin: -4px 3px 0 0;
}
.homepage2-body .vl-transparent-header .header-top-area {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 16px;
border-bottom: 1px solid #E7E7E7;
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
@media (max-width: 767px) {
.homepage2-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage2-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage2-body .vl-transparent-header .header-top-area {
display: none;
}
}
.homepage2-body .vl-transparent-header .header-top-area .header-list p {
color: var(--ztc-text-text-1);
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;
}
.homepage2-body .vl-transparent-header .header-top-area .header-list p a {
color: var(--ztc-text-text-1);
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;
padding-left: 5px;
transition: all 0.4s;
text-decoration: underline;
}
.homepage2-body .vl-transparent-header .header-top-area .header-list p a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.homepage2-body .vl-transparent-header .header-top-area ul li {
display: inline-block;
margin: 0 8px 0 0;
}
.homepage2-body .vl-transparent-header .header-top-area ul li:nth-last-child(1) {
margin: 0;
}
.homepage2-body .vl-transparent-header .header-top-area ul li span {
color: #E8EAEC;
display: inline-block;
margin: 0 8px;
}
.homepage2-body .vl-transparent-header .header-top-area ul li:nth-child(1) a {
color: var(--ztc-text-text-1);
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;
}
.homepage2-body .vl-transparent-header .header-top-area ul li:nth-child(1) a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.homepage2-body .vl-transparent-header .header-top-area ul li:nth-child(1) a svg {
margin: 0 4px 0 0;
}
.homepage2-body .vl-transparent-header .header-top-area ul li .social {
height: 40px;
width: 40px;
text-align: center;
line-height: 37px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-6);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.homepage2-body .vl-transparent-header .header-top-area ul li .social:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.homepage2-body .vl-transparent-header .row-bg1 {
background: var(--ztc-bg-bg-3);
padding: 16px;
border-radius: 0 0 8px 8px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.homepage2-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage2-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage2-body .vl-transparent-header .row-bg1::after {
position: absolute;
content: "";
height: 100%;
width: 5px;
left: 0;
top: 0;
background: var(--ztc-bg-bg-5);
border-radius: 0 0 0 8px;
}
@media (max-width: 767px) {
.homepage2-body .vl-transparent-header .row-bg1::after {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage2-body .vl-transparent-header .row-bg1::after {
display: none;
}
}
.homepage2-body .vl-main-menu ul {
text-align: center;
}
.homepage2-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage2-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage2-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-2);
background: none;
opacity: 70%;
}
.homepage2-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-1);
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);
}
.homepage2-body .vl-main-menu ul > li:hover a {
color: #00a6e4;
}
.homepage2-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);
}
.homepage2-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-5);
top: 0;
}
.homepage2-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage2-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage2-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);
}
.homepage2-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-5);
z-index: 1;
}
.homepage2-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage2-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage2-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);
}
.homepage2-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-5);
}
.homepage2-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage2-body .vl-main-menu ul > li:hover a {
color: var(--ztc-bg-bg-5);
}
.homepage2-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage2-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage2-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage2-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage2-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage2-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage2-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) {
.homepage2-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage2-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage2-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;
}
.homepage2-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage2-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage2-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage2-body .vl-home-thumb .btn-area1 a.vl-btn2 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-5);
padding: 19px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage2-body .vl-home-thumb .btn-area1 a.vl-btn2::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
color: var(--ztc-text-text-1) !important;
}
.homepage2-body .vl-home-thumb .btn-area1 a.vl-btn2:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage2-body .vl-home-thumb .btn-area1 a.vl-btn2:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage2-body .vl-home-thumb .btn-area1 a.vl-btn2 i {
margin-left: 4px;
}
.homepage2-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 16px;
font-weight: var(--ztc-weight-medium);
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);
}
.homepage2-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-5) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage2-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage2-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage2-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage2-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-3);
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
}
.homepage2-body .header-sticky::after {
display: none !important;
}
.homepage2-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage2-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage2-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage2-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
.homepage2-body .header-sticky .space16 {
display: none !important;
}
.homepage2-body .header-sticky .header-top-area {
display: none;
}

.homepage3-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
}
@media (max-width: 767px) {
.homepage3-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage3-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
.homepage3-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
}
.homepage3-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-7);
padding: 16px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage3-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage3-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage3-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage3-body .vl-transparent-header .vl-hero-btn .btn-area1 a svg {
margin: -4px 3px 0 0;
}
.homepage3-body .vl-transparent-header .row-bg1 {
padding: 16px 0;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.homepage3-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage3-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage3-body .vl-main-menu ul {
text-align: center;
}
.homepage3-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage3-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage3-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-2);
background: none;
opacity: 70%;
}
.homepage3-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-2);
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);
}
.homepage3-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-5);
}
.homepage3-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);
}
.homepage3-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-5);
top: 0;
}
.homepage3-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage3-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage3-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);
}
.homepage3-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-5);
z-index: 1;
}
.homepage3-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage3-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage3-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);
}
.homepage3-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-5);
}
.homepage3-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage3-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-5);
}
.homepage3-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage3-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage3-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage3-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage3-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage3-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage3-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) {
.homepage3-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage3-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage3-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;
}
.homepage3-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage3-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage3-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage3-body .vl-home-thumb .btn-area1 a.vl-btn3 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-7);
padding: 18px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage3-body .vl-home-thumb .btn-area1 a.vl-btn3::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage3-body .vl-home-thumb .btn-area1 a.vl-btn3:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage3-body .vl-home-thumb .btn-area1 a.vl-btn3:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage3-body .vl-home-thumb .btn-area1 a.vl-btn3 i {
margin-left: 4px;
}
.homepage3-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 16px;
font-weight: var(--ztc-weight-medium);
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);
}
.homepage3-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-5) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage3-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage3-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage3-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage3-body .header-sticky {
position: fixed;
left: 0;
right: 0;
top: 0;
animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
background: var(--ztc-bg-bg-1);
}
.homepage3-body .header-sticky .row-bg1 {
transition: all 0.4s;
}
@media (max-width: 767px) {
.homepage3-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage3-body .header-sticky .row-bg1 {
box-shadow: none;
}
}

.homepage4-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
}
@media (max-width: 767px) {
.homepage4-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage4-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
.homepage4-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
}
.homepage4-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-9);
padding: 16px 24px;
border-radius: 60px;
position: relative;
z-index: 1;
}
.homepage4-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 60px;
z-index: -1;
}
.homepage4-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.homepage4-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover svg {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.homepage4-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage4-body .vl-transparent-header .vl-hero-btn .btn-area1 a svg {
margin: -4px 3px 0 0;
filter: brightness(0);
transition: all 0.4s;
}
.homepage4-body .vl-transparent-header .header-top-area {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 16px;
border-bottom: 1px solid #E7E7E7;
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
@media (max-width: 767px) {
.homepage4-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage4-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage4-body .vl-transparent-header .header-top-area {
display: none;
}
}
.homepage4-body .vl-transparent-header .header-top-area .header-list p {
color: var(--ztc-text-text-2);
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;
}
.homepage4-body .vl-transparent-header .header-top-area .header-list p a {
color: var(--ztc-text-text-2);
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;
padding-left: 5px;
transition: all 0.4s;
text-decoration: underline;
}
.homepage4-body .vl-transparent-header .header-top-area .header-list p a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}
.homepage4-body .vl-transparent-header .header-top-area ul li {
display: inline-block;
margin: 0 8px 0 0;
}
.homepage4-body .vl-transparent-header .header-top-area ul li:nth-last-child(1) {
margin: 0;
}
.homepage4-body .vl-transparent-header .header-top-area ul li span {
color: #E8EAEC;
display: inline-block;
margin: 0 8px;
}
.homepage4-body .vl-transparent-header .header-top-area ul li:nth-child(1) a {
color: var(--ztc-text-text-2);
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;
}
.homepage4-body .vl-transparent-header .header-top-area ul li:nth-child(1) a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}
.homepage4-body .vl-transparent-header .header-top-area ul li:nth-child(1) a svg {
margin: 0 4px 0 0;
}
.homepage4-body .vl-transparent-header .header-top-area ul li .social {
height: 40px;
width: 40px;
text-align: center;
line-height: 37px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-10);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.homepage4-body .vl-transparent-header .header-top-area ul li .social:hover {
background: var(--ztc-bg-bg-9);
transition: all 0.4s;
color: var(--ztc-text-text-2);
}
.homepage4-body .vl-transparent-header .row-bg1 {
background: var(--ztc-bg-bg-1);
padding: 16px;
border-radius: 0 0 8px 8px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.homepage4-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage4-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage4-body .vl-transparent-header .row-bg1::after {
position: absolute;
content: "";
height: 100%;
width: 5px;
left: 0;
top: 0;
background: var(--ztc-bg-bg-9);
border-radius: 0 0 0 8px;
}
@media (max-width: 767px) {
.homepage4-body .vl-transparent-header .row-bg1::after {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage4-body .vl-transparent-header .row-bg1::after {
display: none;
}
}
.homepage4-body .vl-main-menu ul {
text-align: center;
}
.homepage4-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage4-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage4-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-2);
background: none;
opacity: 70%;
}
.homepage4-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-2);
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);
}
.homepage4-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-7);
}
.homepage4-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);
}
.homepage4-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-9);
top: 0;
}
.homepage4-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage4-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage4-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);
}
.homepage4-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-9);
z-index: 1;
}
.homepage4-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage4-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage4-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);
}
.homepage4-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-7);
}
.homepage4-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage4-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-7);
}
.homepage4-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage4-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage4-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage4-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage4-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage4-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage4-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) {
.homepage4-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage4-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage4-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;
}
.homepage4-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage4-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage4-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage4-body .vl-home-thumb .btn-area1 a.vl-btn4 {
color: var(--ztc-text-text-2) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-9);
padding: 20px 24px;
border-radius: 60px;
position: relative;
z-index: 1;
}
.homepage4-body .vl-home-thumb .btn-area1 a.vl-btn4::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 60px;
z-index: -1;
}
.homepage4-body .vl-home-thumb .btn-area1 a.vl-btn4:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1) !important;
}
.homepage4-body .vl-home-thumb .btn-area1 a.vl-btn4:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage4-body .vl-home-thumb .btn-area1 a.vl-btn4 i {
margin-left: 4px;
}
.homepage4-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 16px;
font-weight: var(--ztc-weight-medium);
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);
}
.homepage4-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-7) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage4-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage4-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage4-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage4-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);
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
}
.homepage4-body .header-sticky::after {
display: none !important;
}
.homepage4-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage4-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage4-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage4-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
.homepage4-body .header-sticky .space16 {
display: none !important;
}
.homepage4-body .header-sticky .header-top-area {
display: none;
}

.homepage5-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
margin: 0 70px;
}
@media (max-width: 767px) {
.homepage5-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage5-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
margin: 0;
}
}
.homepage5-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
}
.homepage5-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-11);
padding: 16px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage5-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage5-body .vl-transparent-header .vl-hero-btn .btn-area1 a::before {
position: absolute;
content: "";
height: 36px;
width: 36px;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
opacity: 20%;
left: 17px;
top: 8px;
}
.homepage5-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage5-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage5-body .vl-transparent-header .vl-hero-btn .btn-area1 a svg {
margin: -4px 3px 0 0;
}
.homepage5-body .vl-transparent-header .row-bg1 {
padding: 16px 20px;
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
margin-top: 20px;
border-radius: 16px;
}
@media (max-width: 767px) {
.homepage5-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
margin-top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage5-body .vl-transparent-header .row-bg1 {
background: none;
margin-top: 0;
}
}
.homepage5-body .vl-main-menu ul {
text-align: center;
}
.homepage5-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage5-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage5-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-2);
background: none;
opacity: 70%;
}
.homepage5-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-2);
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);
}
.homepage5-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-8);
}
.homepage5-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);
}
.homepage5-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-11);
top: 0;
}
.homepage5-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage5-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage5-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);
}
.homepage5-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-11);
z-index: 1;
}
.homepage5-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage5-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage5-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);
}
.homepage5-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-8);
}
.homepage5-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage5-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-8);
}
.homepage5-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage5-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage5-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage5-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage5-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage5-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage5-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) {
.homepage5-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage5-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage5-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;
}
.homepage5-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage5-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage5-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage5-body .vl-home-thumb .btn-area1 a.vl-btn5 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-11);
padding: 18px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage5-body .vl-home-thumb .btn-area1 a.vl-btn5::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage5-body .vl-home-thumb .btn-area1 a.vl-btn5::before {
position: absolute;
content: "";
height: 36px;
width: 36px;
border-radius: 50%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-1);
opacity: 20%;
left: 10px;
top: 8px;
}
.homepage5-body .vl-home-thumb .btn-area1 a.vl-btn5:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage5-body .vl-home-thumb .btn-area1 a.vl-btn5:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage5-body .vl-home-thumb .btn-area1 a.vl-btn5 i {
margin-left: 4px;
}
.homepage5-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 16px;
font-weight: var(--ztc-weight-medium);
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);
}
.homepage5-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-8) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage5-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage5-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage5-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage5-body .header-sticky {
position: fixed;
left: 0;
right: 0;
top: 0;
animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
background: var(--ztc-bg-bg-1);
border-radius: 0 0 16px 16px;
}
.homepage5-body .header-sticky .row-bg1 {
transition: all 0.4s;
margin-top: 0;
background: var(--ztc-bg-bg-1);
border-radius: 0 0 16px 16px;
}

.homepage7-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
}
@media (max-width: 767px) {
.homepage7-body .vl-transparent-header {
background: var(--ztc-bg-bg-12);
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage7-body .vl-transparent-header {
background: var(--ztc-bg-bg-12);
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage7-body .vl-transparent-header {
background: var(--ztc-bg-bg-12);
}
}
.homepage7-body .vl-transparent-header::after {
position: absolute;
content: "";
height: 1px;
width: 100%;
left: 0;
bottom: 0;
background: rgba(255, 255, 255, 0.3);
opacity: 30%;
}
.homepage7-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0) invert(1);
}
.homepage7-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
padding: 12px 20px 12px 12px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.homepage7-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-12);
transition: all 0.4s;
border-radius: 80px;
z-index: -1;
}
.homepage7-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage7-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage7-body .vl-transparent-header .vl-hero-btn .btn-area1 a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
background: var(--ztc-bg-bg-1);
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
margin: 0 4px 0 0;
}
.homepage7-body .vl-transparent-header .header-top-area {
background: var(--ztc-bg-bg-12);
visibility: visible;
opacity: 1;
transition: all 0.4s;
padding: 18px;
}
@media (max-width: 767px) {
.homepage7-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage7-body .vl-transparent-header .header-top-area {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage7-body .vl-transparent-header .header-top-area {
display: none;
}
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top {
display: flex;
align-items: center;
justify-content: space-between;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top .header-list p {
color: var(--ztc-text-text-1);
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;
display: inline-block;
transition: all 0.4s;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top .header-list p svg {
margin: -4px 4px 0 0;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li {
display: inline-block;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li:nth-last-child(1) {
margin: 0;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li span {
color: #E8EAEC;
display: inline-block;
margin: 0 8px;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li:nth-child(1) a {
color: var(--ztc-text-text-1);
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;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li:nth-child(1) a:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li:nth-child(1) a svg {
margin: 0 4px 0 0;
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li .social {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
font-size: var(--ztc-font-size-font-s14);
color: var(--ztc-text-text-1);
background: rgba(255, 255, 255, 0.24);
border: 1px solid rgba(255, 255, 255, 0.1);
-webkit-backdrop-filter: blur(10px);
      backdrop-filter: blur(10px);
}
.homepage7-body .vl-transparent-header .header-top-area .header-main-top ul li .social:hover {
background: var(--ztc-bg-bg-13);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.homepage7-body .vl-transparent-header .row-bg1 {
padding: 16px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.homepage7-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage7-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage7-body .vl-main-menu ul {
text-align: center;
}
.homepage7-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage7-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage7-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-1);
background: none;
opacity: 70%;
}
.homepage7-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-1);
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);
}
.homepage7-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-11);
}
.homepage7-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);
}
.homepage7-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-13);
top: 0;
}
.homepage7-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage7-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage7-body .vl-main-menu ul > li .sub-menu li a {
color: var(--ztc-text-text-9);
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);
}
.homepage7-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-13);
z-index: 1;
}
.homepage7-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage7-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage7-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);
}
.homepage7-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-11);
}
.homepage7-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage7-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-11);
}
.homepage7-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage7-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage7-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage7-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage7-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage7-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage7-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) {
.homepage7-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage7-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage7-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-9);
border-radius: 4px;
transform: scale(0.8);
visibility: hidden;
opacity: 0;
}
.homepage7-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage7-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage7-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage7-body .vl-home-thumb .btn-area1 a.vl-btn1 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-13);
padding: 19px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage7-body .vl-home-thumb .btn-area1 a.vl-btn1::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-12);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage7-body .vl-home-thumb .btn-area1 a.vl-btn1:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage7-body .vl-home-thumb .btn-area1 a.vl-btn1:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage7-body .vl-home-thumb .btn-area1 a.vl-btn1 i {
margin-left: 4px;
}
.homepage7-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 18px;
font-weight: var(--ztc-weight-medium);
color: var(--ztc-text-text-9) !important;
transition: all 0.4s;
display: block;
padding-top: 16px;
text-align: center;
font-family: var(--ztc-family-font1);
}
.homepage7-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-11) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage7-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage7-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage7-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage7-body .header-sticky {
position: fixed;
left: 0;
right: 0;
top: 0;
animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
background-color: rgba(0, 0, 0, 0.76);
}
.homepage7-body .header-sticky::after {
display: none !important;
}
.homepage7-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage7-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage7-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage7-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
.homepage7-body .header-sticky .header-top-area {
display: none;
}

.homepage8-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
padding-top: 16px;
}
@media (max-width: 767px) {
.homepage8-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage8-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage8-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
padding: 0;
}
}
.homepage8-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0);
}
.homepage8-body .vl-transparent-header .row-bg1 {
padding: 16px;
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
border-radius: 80px;
}
@media (max-width: 767px) {
.homepage8-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage8-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage8-body .vl-main-menu ul {
text-align: center;
}
.homepage8-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage8-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage8-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-1);
background: none;
opacity: 70%;
}
.homepage8-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-12);
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);
}
.homepage8-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-13);
}
.homepage8-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);
}
.homepage8-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-16);
top: 0;
}
.homepage8-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage8-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage8-body .vl-main-menu ul > li .sub-menu li a {
color: var(--ztc-text-text-12);
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);
}
.homepage8-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-16);
z-index: 1;
}
.homepage8-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage8-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage8-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);
}
.homepage8-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-13);
}
.homepage8-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage8-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-13);
}
.homepage8-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage8-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage8-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage8-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage8-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage8-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage8-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) {
.homepage8-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage8-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage8-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-12);
border-radius: 4px;
transform: scale(0.8);
visibility: hidden;
opacity: 0;
}
.homepage8-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage8-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage8-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage8-body .vl-home-thumb .btn-area1 a.vl-btn1 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-16);
padding: 19px 24px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.homepage8-body .vl-home-thumb .btn-area1 a.vl-btn1::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 80px;
z-index: -1;
}
.homepage8-body .vl-home-thumb .btn-area1 a.vl-btn1:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage8-body .vl-home-thumb .btn-area1 a.vl-btn1:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage8-body .vl-home-thumb .btn-area1 a.vl-btn1 i {
margin-left: 4px;
}
.homepage8-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 18px;
font-weight: var(--ztc-weight-medium);
color: var(--ztc-text-text-12) !important;
transition: all 0.4s;
display: block;
padding-top: 16px;
text-align: center;
font-family: var(--ztc-family-font1);
}
.homepage8-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-13) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage8-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage8-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage8-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage8-body .header-sticky {
position: fixed;
left: 0;
right: 0;
top: 0;
animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
background-color: var(--ztc-bg-bg-1);
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
padding: 0;
}
.homepage8-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage8-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage8-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage8-body .header-sticky .row-bg1 {
box-shadow: none;
}
}

.homepage9-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
padding-top: 16px;
margin: 0 60px;
}
@media (max-width: 767px) {
.homepage9-body .vl-transparent-header {
background: var(--ztc-bg-bg-14);
padding: 0;
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage9-body .vl-transparent-header {
background: var(--ztc-bg-bg-14);
padding: 0;
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage9-body .vl-transparent-header {
background: var(--ztc-bg-bg-14);
padding: 0;
margin: 0;
}
}
.homepage9-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0);
}
.homepage9-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
padding: 12px 20px 12px 12px;
border-radius: 10px;
position: relative;
z-index: 1;
}
.homepage9-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 10px;
z-index: -1;
}
.homepage9-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage9-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage9-body .vl-transparent-header .vl-hero-btn .btn-area1 a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
background: var(--ztc-bg-bg-1);
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
margin: 0 4px 0 0;
}
.homepage9-body .vl-transparent-header .row-bg1 {
padding: 16px;
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-14);
border-radius: 8px;
}
@media (max-width: 767px) {
.homepage9-body .vl-transparent-header .row-bg1 {
background: none;
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage9-body .vl-transparent-header .row-bg1 {
background: none;
}
}
.homepage9-body .vl-main-menu ul {
text-align: center;
}
.homepage9-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage9-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage9-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-1);
background: none;
opacity: 70%;
}
.homepage9-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-12);
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);
}
.homepage9-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-14);
}
.homepage9-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);
}
.homepage9-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-19);
top: 0;
}
.homepage9-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage9-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage9-body .vl-main-menu ul > li .sub-menu li a {
color: var(--ztc-text-text-12);
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);
}
.homepage9-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-19);
z-index: 1;
}
.homepage9-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage9-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage9-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);
}
.homepage9-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-14);
}
.homepage9-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage9-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-14);
}
.homepage9-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage9-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage9-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage9-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage9-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage9-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage9-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) {
.homepage9-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage9-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage9-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-12);
border-radius: 4px;
transform: scale(0.8);
visibility: hidden;
opacity: 0;
}
.homepage9-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage9-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage9-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage9-body .vl-home-thumb .btn-area1 a.vl-btn1 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
padding: 19px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage9-body .vl-home-thumb .btn-area1 a.vl-btn1::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage9-body .vl-home-thumb .btn-area1 a.vl-btn1:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage9-body .vl-home-thumb .btn-area1 a.vl-btn1:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage9-body .vl-home-thumb .btn-area1 a.vl-btn1 i {
margin-left: 4px;
}
.homepage9-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 18px;
font-weight: var(--ztc-weight-medium);
color: var(--ztc-text-text-12) !important;
transition: all 0.4s;
display: block;
padding-top: 16px;
text-align: center;
font-family: var(--ztc-family-font1);
}
.homepage9-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-14) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage9-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage9-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage9-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage9-body .header-sticky {
position: fixed;
left: 0;
right: 0;
top: 0;
animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
background-color: var(--ztc-bg-bg-1);
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
padding: 0;
border-radius: 0 0 8px 8px;
}
.homepage9-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage9-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage9-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage9-body .header-sticky .row-bg1 {
box-shadow: none;
}
}

.homepage10-body .vl-transparent-header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
padding: 16px 0;
}
@media (max-width: 767px) {
.homepage10-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage10-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.homepage10-body .vl-transparent-header {
background: var(--ztc-bg-bg-1);
}
}
.homepage10-body .vl-transparent-header::after {
position: absolute;
content: "";
height: 1px;
width: 100%;
left: 0;
bottom: 0;
background: #DBDBDB;
opacity: 30%;
}
.homepage10-body .vl-transparent-header .vl-logo img {
width: 164px;
height: 50px;
-o-object-fit: contain;
 object-fit: contain;
filter: brightness(0);
}
.homepage10-body .vl-transparent-header .vl-hero-btn .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
padding: 12px 20px 12px 12px;
border-radius: 10px;
position: relative;
z-index: 1;
}
.homepage10-body .vl-transparent-header .vl-hero-btn .btn-area1 a::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 10px;
z-index: -1;
}
.homepage10-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage10-body .vl-transparent-header .vl-hero-btn .btn-area1 a:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage10-body .vl-transparent-header .vl-hero-btn .btn-area1 a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
background: var(--ztc-bg-bg-1);
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
margin: 0 4px 0 0;
}
.homepage10-body .vl-main-menu ul {
text-align: center;
}
.homepage10-body .vl-main-menu ul > li {
display: inline-block;
position: relative;
}
.homepage10-body .vl-main-menu ul > li .span-arrow {
display: flex !important;
align-items: center;
justify-content: space-between;
}
.homepage10-body .vl-main-menu ul > li a.nav-link.active {
color: var(--ztc-text-text-1);
background: none;
opacity: 70%;
}
.homepage10-body .vl-main-menu ul > li > a {
color: var(--ztc-text-text-12);
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);
}
.homepage10-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-14);
}
.homepage10-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);
}
.homepage10-body .vl-main-menu ul > li .sub-menu::after {
position: absolute;
content: "";
height: 2px;
left: 0;
width: 100%;
background: var(--ztc-bg-bg-19);
top: 0;
}
.homepage10-body .vl-main-menu ul > li .sub-menu.menu1 {
top: 20% !important;
}
.homepage10-body .vl-main-menu ul > li .sub-menu li {
margin-right: 0;
display: block;
text-align: start;
}
.homepage10-body .vl-main-menu ul > li .sub-menu li a {
color: var(--ztc-text-text-12);
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);
}
.homepage10-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-19);
z-index: 1;
}
.homepage10-body .vl-main-menu ul > li .sub-menu li a:hover::after {
width: 50%;
transition: all 0.4s;
}
.homepage10-body .vl-main-menu ul > li .sub-menu li a:before {
display: none;
}
.homepage10-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);
}
.homepage10-body .vl-main-menu ul > li .sub-menu li:hover > a {
color: var(--ztc-text-text-14);
}
.homepage10-body .vl-main-menu ul > li .sub-menu li:hover > .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
}
.homepage10-body .vl-main-menu ul > li:hover a {
color: var(--ztc-text-text-14);
}
.homepage10-body .vl-main-menu ul > li:hover .sub-menu {
opacity: 1;
visibility: visible;
top: 201%;
transform: scale(1);
transition: all 0.4s;
}
.homepage10-body .vl-main-menu ul > li:hover .vl-mega-menu {
opacity: 1;
visibility: visible;
transition: 0.3s;
top: 201%;
transform: scale(1);
}
.homepage10-body .vl-mega-menu {
position: absolute;
left: -315px;
top: 100px;
width: 1300px;
background: var(--ztc-bg-bg-1);
padding: 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;
height: 650px;
overflow-x: scroll;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage10-body .vl-mega-menu {
width: 1140px;
left: -242px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
.homepage10-body .vl-mega-menu {
width: auto;
opacity: 1;
visibility: visible;
transition: none;
position: static;
display: none;
transform: scale(1);
}
}
.homepage10-body .vl-home-thumb {
position: relative;
z-index: 1;
}
.homepage10-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) {
.homepage10-body .vl-home-thumb img {
-o-object-fit: cover;
   object-fit: cover;
}
}
.homepage10-body .vl-home-thumb .img1 {
position: relative;
z-index: 1;
}
.homepage10-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-12);
border-radius: 4px;
transform: scale(0.8);
visibility: hidden;
opacity: 0;
}
.homepage10-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: -48px;
margin-left: -77px;
}
@media (max-width: 767px) {
.homepage10-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage10-body .vl-home-thumb .btn-area1 {
margin-top: -60px;
}
}
.homepage10-body .vl-home-thumb .btn-area1 a.vl-btn1 {
color: var(--ztc-text-text-1) !important;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-19);
padding: 19px 24px;
border-radius: 8px;
position: relative;
z-index: 1;
}
.homepage10-body .vl-home-thumb .btn-area1 a.vl-btn1::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
border-radius: 8px;
z-index: -1;
}
.homepage10-body .vl-home-thumb .btn-area1 a.vl-btn1:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.homepage10-body .vl-home-thumb .btn-area1 a.vl-btn1:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.homepage10-body .vl-home-thumb .btn-area1 a.vl-btn1 i {
margin-left: 4px;
}
.homepage10-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s16);
line-height: 18px;
font-weight: var(--ztc-weight-medium);
color: var(--ztc-text-text-12) !important;
transition: all 0.4s;
display: block;
padding-top: 16px;
text-align: center;
font-family: var(--ztc-family-font1);
}
.homepage10-body .vl-home-thumb a:hover {
color: var(--ztc-text-text-14) !important;
transition: all 0.4s;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.homepage10-body .vl-home-thumb a {
font-size: var(--ztc-font-size-font-s14);
line-height: 14px;
}
}
.homepage10-body .vl-home-thumb:hover .btn-area1 {
visibility: visible;
opacity: 1;
transition: all 0.6s;
top: 50%;
}
.homepage10-body .vl-home-thumb:hover .img1::after {
transform: scale(1);
transition: all 0.4s;
visibility: visible;
opacity: 0.8;
}
.homepage10-body .header-sticky {
position: fixed;
left: 0;
right: 0;
top: 0;
animation: 0.7s ease-in-out 0s normal none 1 running vlfadeInDown;
background-color: var(--ztc-bg-bg-1);
box-shadow: 0px 20px 30px rgba(1, 15, 28, 0.1);
padding: 0;
border-radius: 0 0 8px 8px;
}
.homepage10-body .header-sticky .row-bg1 {
box-shadow: none;
transition: all 0.4s;
padding: 16px 0;
}
.homepage10-body .header-sticky .row-bg1::after {
display: none !important;
}
@media (max-width: 767px) {
.homepage10-body .header-sticky .row-bg1 {
box-shadow: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.homepage10-body .header-sticky .row-bg1 {
box-shadow: none;
}
}

@keyframes vlfadeInDown {
0% {
opacity: 0;
transform: translateY(-100%);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.vlfadeInDown {
animation: vlfadeInDown 1s ease-out forwards;
}

/*============= HEADER CSS AREA ENDS ===============*/
/*============= WORK CSS AREA ===============*/
/*============= WORK CSS AREA ===============*/
/*============= OTHERS CSS AREA STARTS ===============*/
.preloader {
position: fixed;
background: var(--ztc-bg-bg-1);
left: 0;
top: 0;
z-index: 9999;
width: 100%;
height: 100%;
}
.preloader .loader {
width: 70px;
padding: 8px;
aspect-ratio: 1;
border-radius: 50%;
background: var(--ztc-bg-bg-2);
--_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);
}

.others-section {
position: relative;
z-index: 1;
margin-top: -100px;
}
.others-section .others-boxes {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.09);
padding: 28px 24px;
transition: all 0.4s;
}
@media (max-width: 767px) {
.others-section .others-boxes {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.others-section .others-boxes {
margin-bottom: 30px;
}
}
.others-section .others-boxes:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.others-section .others-boxes:hover .icons-heading .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
}
.others-section .others-boxes:hover .icons-heading .icons img {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.others-section .others-boxes .icons-heading {
display: flex;
align-items: center;
}
.others-section .others-boxes .icons-heading .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-5);
border-radius: 50%;
position: absolute;
}
.others-section .others-boxes .icons-heading .icons img {
transition: all 0.4s;
}
.others-section .others-boxes .icons-heading .heading {
padding-left: 100px;
}
.others-section .others-boxes .icons-heading .heading a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s28);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 36px;
display: inline-block;
transition: all 0.4s;
}
.others-section .others-boxes .icons-heading .heading a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.others-section .others-boxes .icons-heading .heading a {
font-size: var(--ztc-font-size-font-s20);
line-height: 28px;
}
}
.others-section .others-boxes p {
color: var(--ztc-text-text-3);
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: 26px;
}

.others-section2 {
position: relative;
z-index: 1;
}
.others-section2 .others-boxes {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
border: 1px solid rgba(15, 13, 13, 0.1);
padding: 28px 24px;
transition: all 0.4s;
}
@media (max-width: 767px) {
.others-section2 .others-boxes {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.others-section2 .others-boxes {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.others-section2 .others-boxes {
margin-bottom: 30px;
}
}
.others-section2 .others-boxes:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.others-section2 .others-boxes:hover .icons-heading .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
}
.others-section2 .others-boxes:hover .icons-heading .icons img {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.others-section2 .others-boxes .icons-heading .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-4);
border-radius: 50%;
position: absolute;
}
.others-section2 .others-boxes .icons-heading .icons img {
transition: all 0.4s;
}
.others-section2 .others-boxes .icons-heading .heading {
padding-left: 100px;
}
.others-section2 .others-boxes .icons-heading .heading 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.others-section2 .others-boxes .icons-heading .heading a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.others-section2 .others-boxes p {
color: var(--ztc-text-text-3);
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: 26px;
}

.others-section3 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-4);
}
.others-section3 .others-boxes {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 28px 24px;
transition: all 0.4s;
margin-bottom: 30px;
}
@media (max-width: 767px) {
.others-section3 .others-boxes {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.others-section3 .others-boxes {
margin-bottom: 30px;
}
}
.others-section3 .others-boxes:hover {
transform: translateY(-5px);
transition: all 0.4s;
}
.others-section3 .others-boxes:hover .icons-heading .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
background: var(--ztc-bg-bg-3);
}
.others-section3 .others-boxes:hover .icons-heading .icons img {
filter: brightness(0) invert(1);
transition: all 0.4s;
}
.others-section3 .others-boxes .icons-heading .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-4);
border-radius: 50%;
position: absolute;
}
.others-section3 .others-boxes .icons-heading .icons img {
transition: all 0.4s;
}
.others-section3 .others-boxes .icons-heading .heading {
padding-left: 100px;
}
.others-section3 .others-boxes .icons-heading .heading 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-bold);
line-height: 26px;
display: inline-block;
transition: all 0.4s;
}
.others-section3 .others-boxes .icons-heading .heading a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.others-section3 .others-boxes p {
color: var(--ztc-text-text-3);
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: 26px;
}

.others7-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.others7-section .others7-slider-warp {
width: 100%;
position: relative;
background: var(--ztc-bg-bg-13);
padding: 30px 0;
}
.others7-section .others7-slider-warp .marquee-wrap .marquee-text {
animation: marquee-2 30s linear infinite;
position: relative;
width: 100%;
white-space: nowrap;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.others7-section .others7-slider-warp .marquee-wrap .marquee-text {
animation: marquee-2 30s linear infinite;
}
}
@media (max-width: 767px) {
.others7-section .others7-slider-warp .marquee-wrap .marquee-text {
animation: marquee-2 30s linear infinite;
}
}
.others7-section .others7-slider-warp .marquee-wrap .marquee-text .main-heading {
display: flex;
align-items: center;
}
.others7-section .others7-slider-warp .marquee-wrap .marquee-text .main-heading h1 {
font-family: var(--ztc-family-font1);
font-size: 16px;
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
margin: 0 30px;
width: 100%;
color: var(--ztc-text-text-1);
position: relative;
text-transform: uppercase;
}
.others7-section .others7-slider-warp2 {
width: 100%;
position: relative;
background: var(--ztc-bg-bg-12);
padding: 30px 0;
}
.others7-section .others7-slider-warp2 .marquee-wrap .marquee-text {
animation: marquee 30s linear infinite;
position: relative;
width: 100%;
white-space: nowrap;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.others7-section .others7-slider-warp2 .marquee-wrap .marquee-text {
animation: marquee 30s linear infinite;
}
}
@media (max-width: 767px) {
.others7-section .others7-slider-warp2 .marquee-wrap .marquee-text {
animation: marquee 30s linear infinite;
}
}
.others7-section .others7-slider-warp2 .marquee-wrap .marquee-text .main-heading {
display: flex;
align-items: center;
}
.others7-section .others7-slider-warp2 .marquee-wrap .marquee-text .main-heading h1 {
font-family: var(--ztc-family-font1);
font-size: 16px;
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
margin: 0 30px;
width: 100%;
color: var(--ztc-text-text-1);
position: relative;
text-transform: uppercase;
}

.others8-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-17);
}
.others8-section .brand-box {
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
text-align: center;
padding: 40px;
border-radius: 8px;
margin-bottom: 30px;
border: 1px solid var(--ztc-bg-bg-1);
}
.others8-section .brand-box:hover {
border: 1px solid var(--ztc-text-text-13);
transition: all 0.4s;
transform: translateY(-10px);
}
.others8-section .brand-box img {
height: 48px;
width: 185px;
-o-object-fit: contain;
 object-fit: contain;
}

.slider8-section-area {
overflow: hidden !important;
}
.slider8-section-area .brand-single-box {
display: inline-block;
}
.slider8-section-area .marquee-wrap {
background-color: var(--ztc-bg-bg-17);
width: 100%;
position: relative;
}
.slider8-section-area .marquee-wrap .marquee-text {
animation: marquee 30s linear infinite;
position: relative;
width: 100%;
white-space: nowrap;
padding: 38px 0 30px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.slider8-section-area .marquee-wrap .marquee-text {
animation: marquee 30s linear infinite;
}
}
@media (max-width: 767px) {
.slider8-section-area .marquee-wrap .marquee-text {
animation: marquee 30s linear infinite;
}
}
.slider8-section-area .marquee-wrap .marquee-text .brand-single-box {
display: inline-block;
}
.slider8-section-area .marquee-wrap .marquee-text .brand-single-box h3 {
color: var(--ztc-text-text-4);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s28);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
text-transform: uppercase;
}
.slider8-section-area .marquee-wrap .marquee-text .brand-single-box h3 img {
margin: -10px 20px 0;
height: 48px;
width: 180px;
-o-object-fit: contain;
 object-fit: contain;
}

.others10-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.others10-section .others10-slider-warp {
width: 100%;
position: relative;
background: #71717A;
padding: 36px 0;
}
.others10-section .others10-slider-warp .marquee-wrap .marquee-text {
animation: marquee-2 30s linear infinite;
position: relative;
width: 100%;
white-space: nowrap;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.others10-section .others10-slider-warp .marquee-wrap .marquee-text {
animation: marquee-2 30s linear infinite;
}
}
@media (max-width: 767px) {
.others10-section .others10-slider-warp .marquee-wrap .marquee-text {
animation: marquee-2 30s linear infinite;
}
}
.others10-section .others10-slider-warp .marquee-wrap .marquee-text .main-heading {
display: flex;
align-items: center;
}
.others10-section .others10-slider-warp .marquee-wrap .marquee-text .main-heading h1 {
font-family: var(--ztc-family-font1);
font-size: 32px;
line-height: 32px;
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
margin: 0 30px;
width: 100%;
color: var(--ztc-text-text-1);
position: relative;
text-transform: uppercase;
}

.coupons10-section-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.coupons10-section-area .coupons10-boxarea {
position: relative;
z-index: 1;
transition: all 0.4s;
margin-bottom: 30px;
}
.coupons10-section-area .coupons10-boxarea:hover .cupons-price {
border-radius: 0px 0px 8px 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.08);
transition: all 0.4s;
border-right: 1px solid var(--Strok-Color, #fff);
border-bottom: 1px solid var(--Strok-Color, #fff);
border-left: 1px solid var(--Strok-Color, #fff);
}
.coupons10-section-area .coupons10-boxarea .counpons-head {
padding: 30px;
background: var(--ztc-bg-bg-14);
text-align: center;
}
.coupons10-section-area .coupons10-boxarea .counpons-head img {
height: 52px;
width: 190px;
-o-object-fit: contain;
 object-fit: contain;
}
.coupons10-section-area .coupons10-boxarea .counpons-head .title {
color: var(--ztc-text-text-12);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
text-transform: capitalize;
transition: all 0.4s;
display: inline-block;
}
.coupons10-section-area .coupons10-boxarea .counpons-head .title:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.coupons10-section-area .coupons10-boxarea .cupons-price {
text-align: center;
border-radius: 0px 0px 8px 8px;
border-right: 1px solid var(--Strok-Color, #DBDBDB);
border-bottom: 1px solid var(--Strok-Color, #DBDBDB);
border-left: 1px solid var(--Strok-Color, #DBDBDB);
background: var(--ztc-bg-bg-1);
padding: 30px;
transition: all 0.4s;
}
.coupons10-section-area .coupons10-boxarea .cupons-price .price {
color: var(--ztc-text-text-12);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
letter-spacing: 0.64px;
text-transform: uppercase;
padding: 12px 16px;
border: 1px solid var(--ztc-text-text-12);
display: inline-block;
border-radius: 8px;
transition: all 0.4s;
}
.coupons10-section-area .coupons10-boxarea .cupons-price .price:hover {
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
transition: all 0.4s;
border: 1px solid var(--ztc-text-text-14);
}

/*============= OTHERS CSS AREA ENDS ===============*/
/*============= TEAM CSS AREA ===============*/
.team2 {
position: relative;
z-index: 1;
overflow: hidden;
}
.team2 .slider-arrow-area {
position: relative;
z-index: 1;
}
.team2 .slider-arrow-area .testimonial-arrows {
display: flex;
align-items: center;
position: absolute;
right: 0;
top: -130px;
}
@media (max-width: 767px) {
.team2 .slider-arrow-area .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team2 .slider-arrow-area .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
.team2 .slider-arrow-area .testimonial-arrows .testimonial-prev-arrow {
margin: 0 12px 0 0;
}
.team2 .slider-arrow-area .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-6);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.team2 .slider-arrow-area .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.team2 .slider-arrow-area .team-slider-area {
position: relative;
z-index: 1;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-6);
border-radius: 8px;
padding: 16px 16px 24px 16px;
overflow: hidden;
margin: 0 10px;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea:hover .img1 img {
transform: scale(1.1) rotate(4deg);
transition: all 0.4s;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea:hover .social {
right: 30px;
transition: all 0.6s;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .name-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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .name-text a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .name-text p {
color: var(--ztc-text-text-3);
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;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .social {
position: absolute;
right: -100px;
top: 50%;
z-index: 2;
margin-top: -135px;
transition: all 0.6s;
}
@media (max-width: 767px) {
.team2 .slider-arrow-area .team-slider-area .team-boxarea .social {
right: 30px;
transition: all 0.4s;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team2 .slider-arrow-area .team-slider-area .team-boxarea .social {
right: 30px;
transition: all 0.4s;
}
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .social ul li a {
height: 44px;
width: 44px;
text-align: center;
line-height: 44px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s18);
margin: 0 0 6px 0;
}
.team2 .slider-arrow-area .team-slider-area .team-boxarea .social ul li a:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}

.team4 {
position: relative;
z-index: 1;
overflow: hidden;
}
.team4 .slider-arrow-area4 {
position: relative;
z-index: 1;
}
.team4 .slider-arrow-area4 .testimonial-arrows {
display: flex;
align-items: center;
position: absolute;
right: 0;
top: -130px;
}
@media (max-width: 767px) {
.team4 .slider-arrow-area4 .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team4 .slider-arrow-area4 .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
.team4 .slider-arrow-area4 .testimonial-arrows .testimonial-prev-arrow-t4 {
margin: 0 12px 0 0;
}
.team4 .slider-arrow-area4 .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-10);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.team4 .slider-arrow-area4 .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-9);
transition: all 0.4s;
color: var(--ztc-text-text-2);
}
.team4 .slider-arrow-area4 .team-slider-area4 {
position: relative;
z-index: 1;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 10px;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea:hover .img1 img {
transform: scale(1.1) rotate(4deg);
transition: all 0.4s;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea:hover .social {
right: 30px;
transition: all 0.6s;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea:hover .name-text {
background: var(--ztc-bg-bg-9);
transition: all 0.4s;
transform: rotate(5deg);
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .img1 img {
height: 330px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .name-text {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 16px;
position: absolute;
bottom: 24px;
left: 30px;
right: 30px;
z-index: 2;
transition: all 0.4s;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .name-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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .name-text a:hover {
color: var(--ztc-text-text-2);
transition: all 0.4s;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .name-text p {
color: var(--ztc-text-text-3);
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;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .social {
position: absolute;
right: -100px;
top: 50%;
z-index: 2;
margin-top: -135px;
transition: all 0.6s;
}
@media (max-width: 767px) {
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .social {
right: 30px;
transition: all 0.4s;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .social {
right: 30px;
transition: all 0.4s;
}
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .social ul li a {
height: 44px;
width: 44px;
text-align: center;
line-height: 44px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s18);
margin: 0 0 6px 0;
}
.team4 .slider-arrow-area4 .team-slider-area4 .team-boxarea .social ul li a:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}

.team5 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-4);
}
.team5 .team-arrow-area {
position: relative;
z-index: 1;
}
.team5 .team-arrow-area .testimonial-arrows {
display: flex;
align-items: center;
position: absolute;
right: 0;
top: -130px;
}
@media (max-width: 767px) {
.team5 .team-arrow-area .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team5 .team-arrow-area .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
.team5 .team-arrow-area .testimonial-arrows .testimonial-prev-arrow-t5 {
margin: 0 12px 0 0;
}
.team5 .team-arrow-area .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.team5 .team-arrow-area .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-11);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.team5 .team-arrow-area .team5-slick-sliderarea {
position: relative;
z-index: 1;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 20px 30px;
margin: 0 10px;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box:hover .team-img9 {
height: 100%;
transition: all 0.4s;
top: 0;
left: 0;
border-radius: 8px;
width: 100%;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box:hover .social-area {
right: 30px;
transition: all 0.8s;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .team-img9 {
position: absolute;
top: 20px;
left: 16%;
transition: all 0.4s;
width: 210px;
height: 210px;
border-radius: 50%;
-o-object-fit: cover;
 object-fit: cover;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .team-img9 {
left: 12%;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .team-img9 {
left: 19%;
}
}
@media (max-width: 767px) {
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .team-img9 {
left: 20%;
}
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .img1 {
margin: 0 auto;
text-align: center;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .img1 img {
width: 210px;
height: 210px;
border-radius: 50%;
-o-object-fit: cover;
 object-fit: cover;
margin: 0 auto;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .content-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 16px;
position: relative;
z-index: 1;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .content-area 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .content-area a:hover {
color: var(--ztc-text-text-8);
transition: al 0.4s;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .content-area p {
color: var(--ztc-text-text-3);
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;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .social-area {
position: absolute;
top: 30px;
right: -100px;
transition: all 0.8s;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .social-area li a {
height: 44px;
width: 44px;
display: inline-block;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-8);
transition: all 0.4s;
text-align: center;
line-height: 44px;
margin-bottom: 10px;
}
.team5 .team-arrow-area .team5-slick-sliderarea .team5-slider-box .social-area li a:hover {
background: var(--ztc-bg-bg-11);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}

.team7-section {
position: relative;
z-index: 1;
overflow: hidden;
}

.team7-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
transition: all 0.4s;
margin-bottom: 30px;
}
.team7-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.team7-boxarea:hover .content7-widget {
background: var(--ztc-bg-bg-13);
transition: all 0.4s;
}
.team7-boxarea:hover .content7-widget a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.team7-boxarea:hover .content7-widget p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.team7-boxarea:hover .team7-social {
top: 58%;
transition: all 0.6s;
visibility: visible;
opacity: 1;
}
.team7-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
}
.team7-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.team7-boxarea .content7-widget {
text-align: center;
position: relative;
background: var(--ztc-bg-bg-14);
padding: 30px;
border-radius: 8px;
transition: all 0.4s;
}
.team7-boxarea .content7-widget a {
color: var(--ztc-text-text-9);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.team7-boxarea .content7-widget p {
color: var(--ztc-text-text-10);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px;
transition: all 0.4s;
}
.team7-boxarea .team7-social {
display: inline-block;
position: absolute;
top: 50%;
z-index: 2;
left: 50%;
margin-left: -127px;
transition: all 0.6s;
visibility: hidden;
opacity: 0;
}
.team7-boxarea .team7-social li {
display: inline-block;
margin: 0 16px 0 0;
}
.team7-boxarea .team7-social li:nth-last-child(1) {
margin: 0;
}
.team7-boxarea .team7-social li a {
height: 48px;
width: 48px;
text-align: center;
line-height: 48px;
border-radius: 50%;
color: var(--ztc-text-text-9);
transition: all 0.4s;
display: inline-block;
background: var(--ztc-bg-bg-1);
font-size: var(--ztc-font-size-font-s18);
}
.team7-boxarea .team7-social li a:hover {
background: var(--ztc-bg-bg-13);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}

.team8-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.team8-section .team8-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
margin-bottom: 30px;
}
.team8-section .team8-boxarea:hover .shape-social-area .img1::after {
height: 100%;
transition: all 0.6s;
}
.team8-section .team8-boxarea:hover .shape-social-area .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.team8-section .team8-boxarea:hover .shape-social-area .plus a {
background: var(--ztc-bg-bg-16);
transition: all 0.4s;
color: var(--ztc-text-text-1);
transform: rotate(-45deg);
}
.team8-section .team8-boxarea:hover .shape-social-area .team8-social {
transform: rotateX(0);
transition: all 0.6s;
}
.team8-section .team8-boxarea:hover .content8-area {
background: var(--ztc-bg-bg-16);
transition: all 0.4s;
}
.team8-section .team8-boxarea:hover .content8-area span {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.team8-section .team8-boxarea:hover .content8-area a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.team8-section .team8-boxarea .shape-social-area {
position: relative;
z-index: 1;
}
.team8-section .team8-boxarea .shape-social-area .b-shape1 {
position: absolute;
right: 0;
top: 0;
z-index: 2;
}
.team8-section .team8-boxarea .shape-social-area .team8-social {
position: absolute;
top: 60px;
z-index: 2;
right: 35px;
transform: rotateY(-90deg);
transition: all 0.6s;
}
.team8-section .team8-boxarea .shape-social-area .team8-social li {
margin: 0 0 4px 0;
}
.team8-section .team8-boxarea .shape-social-area .team8-social li:nth-last-child(1) {
margin-bottom: 0;
}
.team8-section .team8-boxarea .shape-social-area .team8-social li a {
height: 44px;
width: 44px;
text-align: center;
line-height: 44px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-12);
border-radius: 50%;
}
.team8-section .team8-boxarea .shape-social-area .team8-social li a:hover {
background: var(--ztc-bg-bg-16);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.team8-section .team8-boxarea .shape-social-area .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.team8-section .team8-boxarea .shape-social-area .img1::after {
position: absolute;
content: "";
height: 0%;
left: 0;
top: 0;
width: 100%;
transition: all 0.6s;
background: var(--ztc-bg-bg-15);
opacity: 30%;
}
.team8-section .team8-boxarea .shape-social-area .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.team8-section .team8-boxarea .shape-social-area .plus a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
display: inline-block;
border-radius: 50%;
transition: all 0.4s;
background: var(--ztc-bg-bg-17);
color: var(--ztc-text-text-2);
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
.team8-section .team8-boxarea .content8-area {
transition: all 0.4s;
text-align: center;
background: var(--ztc-bg-bg-17);
padding: 24px;
border-radius: 8px;
}
.team8-section .team8-boxarea .content8-area span {
color: var(--ztc-text-text-10);
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;
display: inline-block;
transition: all 0.4s;
}
.team8-section .team8-boxarea .content8-area a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
letter-spacing: 0.4px;
transition: all 0.4s;
}

.team-about-inner {
position: relative;
z-index: 1;
overflow: hidden;
}
.team-about-inner .team-boxarea-about {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
border-radius: 8px;
padding: 16px 16px 24px 16px;
overflow: hidden;
margin-bottom: 30px;
}
.team-about-inner .team-boxarea-about:hover .img1 img {
transform: scale(1.1) rotate(4deg);
transition: all 0.4s;
}
.team-about-inner .team-boxarea-about:hover .social {
right: 30px;
transition: all 0.6s;
}
.team-about-inner .team-boxarea-about .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.team-about-inner .team-boxarea-about .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.team-about-inner .team-boxarea-about .img1 img {
height: 250px;
}
}
.team-about-inner .team-boxarea-about .name-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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.team-about-inner .team-boxarea-about .name-text a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.team-about-inner .team-boxarea-about .name-text p {
color: var(--ztc-text-text-3);
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;
}
.team-about-inner .team-boxarea-about .social {
position: absolute;
right: -100px;
top: 50%;
z-index: 2;
margin-top: -135px;
transition: all 0.6s;
}
@media (max-width: 767px) {
.team-about-inner .team-boxarea-about .social {
right: 30px;
transition: all 0.4s;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team-about-inner .team-boxarea-about .social {
right: 30px;
transition: all 0.4s;
}
}
.team-about-inner .team-boxarea-about .social ul li a {
height: 44px;
width: 44px;
text-align: center;
line-height: 44px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s18);
margin: 0 0 6px 0;
}
.team-about-inner .team-boxarea-about .social ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.team-about-inner .slider-arrow-area {
position: relative;
z-index: 1;
}
.team-about-inner .slider-arrow-area .testimonial-arrows {
display: flex;
align-items: center;
position: absolute;
right: 0;
top: -130px;
}
@media (max-width: 767px) {
.team-about-inner .slider-arrow-area .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team-about-inner .slider-arrow-area .testimonial-arrows {
position: relative;
z-index: 1;
justify-content: center;
margin-top: 40px;
top: 0;
}
}
.team-about-inner .slider-arrow-area .testimonial-arrows .testimonial-prev-arrow {
margin: 0 12px 0 0;
}
.team-about-inner .slider-arrow-area .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-6);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.team-about-inner .slider-arrow-area .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.team-about-inner .slider-arrow-area .team-slider-area {
position: relative;
z-index: 1;
}

.team-single-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.team-single-section .team-single-detrails {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
border-radius: 8px;
padding: 32px;
}
.team-single-section .team-single-detrails .team-info .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.team-single-section .team-single-detrails .team-info .img1 img {
height: 500px;
}
}
.team-single-section .team-single-detrails .team-info ul {
text-align: center;
}
.team-single-section .team-single-detrails .team-info ul li {
display: inline-block;
margin: 0 8px 0 0;
}
.team-single-section .team-single-detrails .team-info ul li:nth-last-child(1) {
margin: 0;
}
.team-single-section .team-single-detrails .team-info ul li a {
height: 44px;
width: 44px;
text-align: center;
line-height: 44px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s18);
margin: 0 0 6px 0;
}
.team-single-section .team-single-detrails .team-info ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.team-single-section .team-single-header {
padding: 0 0 0 30px;
}
@media (max-width: 767px) {
.team-single-section .team-single-header {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team-single-section .team-single-header {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.team-single-section .team-single-header {
padding: 0;
margin-top: 30px;
}
}
.team-single-section .team-single-header h4 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
}
.team-single-section .team-single-header ul li {
display: inline-block;
color: var(--ztc-text-text-4);
}
.team-single-section .team-single-header ul li:nth-last-child(1) {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px; /* 100% */
}
.team-single-section .team-single-header .text {
display: flex;
margin-top: 32px;
}
.team-single-section .team-single-header .text.text1 p {
padding-left: 30px;
}
.team-single-section .team-single-header .text h5 {
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-bold);
line-height: 20px;
text-transform: capitalize;
}
.team-single-section .team-single-header .text a {
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-medium);
display: inline-block;
transition: all 0.4s;
line-height: 28px; /* 155.556% */
padding-left: 10px;
position: relative;
}
.team-single-section .team-single-header .text p {
padding-left: 10px;
position: relative;
}
.team-single-section .team-details2-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 32px 24px;
}
.team-single-section .team-details2-area h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px; /* 100% */
}
.team-single-section .team-details2-area h4 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px; /* 100% */
}
.team-single-section .team-details2-area h4 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px; /* 100% */
}
.team-single-section .team-details2-area .pera {
color: var(--ztc-text-text-3);
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: 26px;
}
.team-single-section .team-details2-area p {
color: var(--ztc-text-text-3);
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: 26px;
}
.team-single-section .team-details2-area ul li {
display: inline-block;
margin: 0 10px 0 0;
}
.team-single-section .team-details2-area ul li:nth-last-child(1) {
margin: 0;
}
.team-single-section .team-details2-area ul li a {
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-bold);
line-height: 16px;
border-radius: 4px;
padding: 12px 16px;
transition: all 0.4s;
display: inline-block;
background: var(--ztc-bg-bg-1);
}
.team-single-section .team-details2-area ul li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.team-single-section .team-contact-boxarea {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 32px 24px;
}
.team-single-section .team-contact-boxarea h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
}
.team-single-section .team-contact-boxarea ul li {
margin-top: 24px;
}
.team-single-section .team-contact-boxarea ul li a {
color: var(--ztc-text-text-3);
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: 26px;
transition: all 0.4s;
display: flex;
}
.team-single-section .team-contact-boxarea ul li a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.team-single-section .team-contact-boxarea ul li a span {
margin: 0 8px;
display: inline-block;
font-size: var(--ztc-font-size-font-s12);
line-height: 12px;
}
.team-single-section .team-contact-boxarea ul li a svg {
margin: 0 6px 0 0;
}
.team-single-section .team-contact-boxarea .input-area {
margin-top: 20px;
}
.team-single-section .team-contact-boxarea .input-area input {
width: 100%;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
color: var(--ztc-text-text-2);
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;
padding: 16px;
}
.team-single-section .team-contact-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.team-single-section .team-contact-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.team-single-section .team-contact-boxarea .input-area textarea {
width: 100%;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
color: var(--ztc-text-text-2);
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;
padding: 16px;
height: 152px;
}
.team-single-section .team-contact-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.team-single-section .team-contact-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
}
.team-single-section .team-contact-boxarea .input-area button {
border: none;
outline: none;
}

.team9-section {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
}
@media (max-width: 767px) {
.team9-section {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team9-section {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.team9-section {
margin: 0;
}
}
.team9-section .team9-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
margin-bottom: 30px;
}
.team9-section .team9-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.team9-section .team9-boxarea:hover .team9-social {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.team9-section .team9-boxarea .elements19 {
position: absolute;
bottom: -16px;
width: 100%;
left: 0;
right: 0;
z-index: 2;
}
.team9-section .team9-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.team9-section .team9-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.team9-section .team9-boxarea .share-content-area {
display: flex;
align-items: center;
justify-content: space-between;
position: absolute;
bottom: 28px;
z-index: 2;
left: 24px;
right: 24px;
}
.team9-section .team9-boxarea .share-content-area .name-text a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
letter-spacing: 0.4px;
display: inline-block;
transition: all 0.4s;
}
.team9-section .team9-boxarea .share-content-area .name-text a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.team9-section .team9-boxarea .share-content-area .name-text p {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px;
transition: all 0.4s;
}
.team9-section .team9-boxarea .share-content-area .share a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-15);
border-radius: 50%;
}
.team9-section .team9-boxarea .team9-social {
position: absolute;
top: 50%;
z-index: 2;
left: 50%;
margin-left: -94px;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.team9-section .team9-boxarea .team9-social li {
display: inline-block;
}
.team9-section .team9-boxarea .team9-social li a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
border-radius: 50%;
color: var(--ztc-text-text-12);
font-size: var(--ztc-font-size-font-s18);
}
.team9-section .team9-boxarea .team9-social li a:hover {
background: var(--ztc-bg-bg-19);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}

.team10-section {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
}
@media (max-width: 767px) {
.team10-section {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.team10-section {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.team10-section {
margin: 0;
}
}
.team10-section .team10-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
margin-bottom: 30px;
}
.team10-section .team10-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.team10-section .team10-boxarea:hover .share-content-area .share a {
background: var(--ztc-bg-bg-19);
transition: all 0.4s;
}
.team10-section .team10-boxarea:hover .team10-social {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.team10-section .team10-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.team10-section .team10-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.team10-section .team10-boxarea .share-content-area {
display: flex;
align-items: center;
justify-content: space-between;
position: absolute;
z-index: 2;
background: var(--ztc-bg-bg-14);
padding: 24px;
bottom: 0;
left: 0;
right: 0;
}
.team10-section .team10-boxarea .share-content-area .name-text a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
letter-spacing: 0.4px;
display: inline-block;
transition: all 0.4s;
}
.team10-section .team10-boxarea .share-content-area .name-text a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.team10-section .team10-boxarea .share-content-area .name-text p {
color: var(--ztc-text-text-10);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-regular);
line-height: 16px;
transition: all 0.4s;
}
.team10-section .team10-boxarea .share-content-area .share a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-15);
border-radius: 50%;
}
.team10-section .team10-boxarea .team10-social {
position: absolute;
z-index: 2;
right: 24px;
bottom: 120px;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.team10-section .team10-boxarea .team10-social li {
margin-bottom: 6px;
}
.team10-section .team10-boxarea .team10-social li:nth-last-child(1) {
margin-bottom: 0;
}
.team10-section .team10-boxarea .team10-social li a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
border-radius: 50%;
color: var(--ztc-text-text-12);
font-size: var(--ztc-font-size-font-s18);
}
.team10-section .team10-boxarea .team10-social li a:hover {
background: var(--ztc-bg-bg-19);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}

/*============= TEAM CSS AREA STARTS ===============*/
/*============= FAQ CSS AREA ===============*/
.faq4 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-10);
}
.faq4 .heading4 h5 {
background: var(--ztc-bg-bg-1);
}
.faq4 .faq-main-section {
position: relative;
z-index: 1;
}
.faq4 .faq-main-section .accordion-item {
background: var(--ztc-bg-bg-9);
box-shadow: none;
border: none;
border-radius: 8px;
}
.faq4 .faq-main-section .accordion-item button {
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-semibold);
line-height: 20px;
padding: 24px;
box-shadow: none;
border: none;
outline: none;
border-radius: 6px;
}
@media (max-width: 767px) {
.faq4 .faq-main-section .accordion-item button {
line-height: 26px;
}
}
.faq4 .faq-main-section .accordion-item button:not(.collapsed) {
background: none;
}
.faq4 .faq-main-section .accordion-item button:not(.collapsed)::after {
filter: brightness(0);
}
.faq4 .faq-main-section .accordion-item .accordion-body {
padding: 0;
}
.faq4 .faq-main-section .accordion-item .accordion-body p {
color: var(--ztc-text-text-3);
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: 26px;
padding: 0 24px 24px 24px;
}

.faq7-section {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-14);
padding: 320px 0 100px;
}
@media (max-width: 767px) {
.faq7-section {
padding: 320px 0 50px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.faq7-section {
padding: 320px 0 50px;
}
}
.faq7-section .faq7-accordion {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.faq7-section .faq7-accordion {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.faq7-section .faq7-accordion {
margin-top: 30px;
}
}
.faq7-section .faq7-accordion .accordion .accordion-item {
border: none;
box-shadow: none;
border-radius: 10px;
}
.faq7-section .faq7-accordion .accordion .accordion-item .accordion-header button {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
border: none;
box-shadow: none;
border-radius: 12px;
background: var(--ztc-bg-bg-1);
padding: 24px 30px;
}
.faq7-section .faq7-accordion .accordion .accordion-item .accordion-header button::after {
filter: brightness(0);
}
.faq7-section .faq7-accordion .accordion .accordion-item .accordion-body {
padding: 0;
}
.faq7-section .faq7-accordion .accordion .accordion-item .accordion-body p {
color: var(--ztc-text-text-10);
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: 24px;
padding: 0 30px 24px 30px;
}

.faq8-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-17);
}
.faq8-section .faq8-section .accordion .accordion-item {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
}
.faq8-section .faq8-section .accordion .accordion-item .accordion-header button {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
box-shadow: none;
padding: 24px 30px;
background: none;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.faq8-section .faq8-section .accordion .accordion-item .accordion-header button {
font-size: var(--ztc-font-size-font-s18);
line-height: 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.faq8-section .faq8-section .accordion .accordion-item .accordion-header button {
font-size: var(--ztc-font-size-font-s18);
line-height: 24px;
}
}
@media (max-width: 767px) {
.faq8-section .faq8-section .accordion .accordion-item .accordion-header button {
font-size: var(--ztc-font-size-font-s18);
line-height: 24px;
}
}
.faq8-section .faq8-section .accordion .accordion-item .accordion-header button::after {
filter: brightness(0) invert(1);
}
.faq8-section .faq8-section .accordion .accordion-item .accordion-header button::before {
height: 28px;
width: 28px;
border-radius: 50%;
background: var(--ztc-bg-bg-15);
position: absolute;
content: "";
right: 26px;
}
.faq8-section .faq8-section .accordion .accordion-item .accordion-body {
padding: 0;
}
.faq8-section .faq8-section .accordion .accordion-item .accordion-body p {
padding: 0 30px 24px 30px;
color: var(--ztc-text-text-10);
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: 24px;
}

.faq-video {
position: relative;
z-index: 2;
margin-bottom: -230px;
}
.faq-video .faq-video-service {
position: relative;
z-index: 1;
overflow: hidden;
height: 500px;
border-radius: 12px;
}
.faq-video .faq-video-service .play-btn-area .video {
height: 112px;
width: 112px;
text-align: center;
line-height: 112px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
color: var(--ztc-text-text-11);
background: var(--ztc-bg-bg-1);
font-size: var(--ztc-font-size-font-s32);
position: absolute;
z-index: 1;
left: 50%;
top: 50%;
margin-top: -56px;
margin-left: -56px;
}
.faq-video .faq-video-service .play-btn-area .video::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 56px;
top: 56px;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
border-radius: 50%;
z-index: -1;
animation: pulse-border 1500ms ease-out infinite;
opacity: 40%;
}

.faq-inner {
position: relative;
z-index: 1;
overflow: hidden;
}
.faq-inner .faq-main-section {
position: relative;
z-index: 1;
}
.faq-inner .faq-main-section .accordion-item {
background: var(--ztc-bg-bg-3);
box-shadow: none;
border: 1px solid #E7E7E7;
border-radius: 8px;
}
.faq-inner .faq-main-section .accordion-item button {
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-semibold);
line-height: 20px;
padding: 24px;
box-shadow: none;
border: none;
outline: none;
border-radius: 6px;
}
@media (max-width: 767px) {
.faq-inner .faq-main-section .accordion-item button {
line-height: 26px;
}
}
.faq-inner .faq-main-section .accordion-item button:not(.collapsed) {
background: none;
color: var(--ztc-text-text-1);
}
.faq-inner .faq-main-section .accordion-item button:not(.collapsed)::after {
filter: brightness(0) invert(1);
}
.faq-inner .faq-main-section .accordion-item .accordion-body {
padding: 0;
}
.faq-inner .faq-main-section .accordion-item .accordion-body p {
color: var(--ztc-text-text-1);
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: 26px;
padding: 0 24px 24px 24px;
opacity: 80%;
}

/*============= FAQ CSS AREA ===============*/
/*============= CONTACT CSS AREA ===============*/
.contact1 {
position: relative;
z-index: 1;
overflow: hidden;
}
.contact1 .contact-widget-area .contact-boxarea {
position: relative;
z-index: 1;
}
.contact1 .contact-widget-area .contact-boxarea .input-area {
margin-top: 16px;
}
.contact1 .contact-widget-area .contact-boxarea .input-area input {
color: var(--ztc-text-text-2);
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;
background: var(--ztc-bg-bg-8);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
}
.contact1 .contact-widget-area .contact-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact1 .contact-widget-area .contact-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact1 .contact-widget-area .contact-boxarea .input-area .nice-select {
color: var(--ztc-text-text-3);
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;
background: var(--ztc-bg-bg-8);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: auto;
border: none;
box-shadow: none;
}
.contact1 .contact-widget-area .contact-boxarea .input-area .nice-select::after {
height: 7px;
width: 7px;
right: 16px;
}
.contact1 .contact-widget-area .contact-boxarea .input-area .nice-select ul {
width: 100%;
}
.contact1 .contact-widget-area .contact-boxarea .input-area textarea {
color: var(--ztc-text-text-2);
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;
background: var(--ztc-bg-bg-8);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: 140px;
}
.contact1 .contact-widget-area .contact-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact1 .contact-widget-area .contact-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact1 .contact-widget-area .contact-boxarea .input-area button {
border: none;
outline: none;
}
.contact1 .contact-maps-area iframe {
width: 100%;
border-radius: 8px;
height: 698px;
}
@media (max-width: 767px) {
.contact1 .contact-maps-area iframe {
height: 300px;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.contact1 .contact-maps-area iframe {
height: 400px;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.contact1 .contact-maps-area iframe {
height: 400px;
margin-top: 30px;
}
}

.contact-inenr-area {
position: relative;
z-index: 1;
}
.contact-inenr-area .contact-heading .calnow-boxes {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 32px;
margin-top: 30px;
transition: all 0.4s;
display: block;
align-items: center;
}
.contact-inenr-area .contact-heading .calnow-boxes:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.contact-inenr-area .contact-heading .calnow-boxes:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
}
.contact-inenr-area .contact-heading .calnow-boxes .icons {
height: 60px;
width: 60px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
text-align: center;
border-radius: 50%;
line-height: 60px;
}
.contact-inenr-area .contact-heading .calnow-boxes .text h5 {
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-bold);
line-height: 20px;
margin: 0 8px 0 32px;
}
.contact-inenr-area .contact-heading .calnow-boxes .content a {
color: var(--ztc-text-text-3);
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;
margin: 0 0 0 16px;
}
.contact-inenr-area .contact-heading .calnow-boxes .content a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.contact-inenr-area .contact-heading .contact-boxarea {
position: relative;
z-index: 1;
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 32px;
text-align: center;
margin-top: 30px;
transition: all 0.4s;
}
@media (max-width: 767px) {
.contact-inenr-area .contact-heading .contact-boxarea {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.contact-inenr-area .contact-heading .contact-boxarea {
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.contact-inenr-area .contact-heading .contact-boxarea {
margin-top: 30px;
}
}
.contact-inenr-area .contact-heading .contact-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.contact-inenr-area .contact-heading .contact-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
}
.contact-inenr-area .contact-heading .contact-boxarea .icons {
height: 60px;
width: 60px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
text-align: center;
border-radius: 50%;
line-height: 60px;
}
.contact-inenr-area .contact-heading .contact-boxarea .content-desc h4 {
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-bold);
line-height: 20px;
}
.contact-inenr-area .contact-heading .contact-boxarea .content-desc a {
color: var(--ztc-text-text-3);
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: 40px;
display: inline-block;
transition: all 0.4s;
margin-top: 16px;
}
.contact-inenr-area .contact-heading .contact-boxarea .content-desc a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.contact-inenr-area .contact-main-boxarea {
position: sticky;
z-index: 1;
background: var(--ztc-bg-bg-4);
padding: 32px;
border-radius: 8px;
top: 120px;
}
.contact-inenr-area .contact-main-boxarea h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
}
.contact-inenr-area .contact-main-boxarea .input-area {
margin-top: 16px;
}
.contact-inenr-area .contact-main-boxarea .input-area input {
color: var(--ztc-text-text-2);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
}
.contact-inenr-area .contact-main-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact-inenr-area .contact-main-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact-inenr-area .contact-main-boxarea .input-area .nice-select {
color: var(--ztc-text-text-3);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: auto;
border: none;
box-shadow: none;
}
.contact-inenr-area .contact-main-boxarea .input-area .nice-select::after {
height: 7px;
width: 7px;
right: 16px;
}
.contact-inenr-area .contact-main-boxarea .input-area .nice-select ul {
width: 100%;
}
.contact-inenr-area .contact-main-boxarea .input-area textarea {
color: var(--ztc-text-text-2);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: 140px;
}
.contact-inenr-area .contact-main-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact-inenr-area .contact-main-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
}
.contact-inenr-area .contact-main-boxarea .input-area button {
border: none;
outline: none;
}
.contact-inenr-area iframe {
width: 100%;
border-radius: 8px;
height: 500px;
}
@media (max-width: 767px) {
.contact-inenr-area iframe {
height: 300px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.contact-inenr-area iframe {
height: 400px;
}
}

.contact7 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
}
.contact7 .contact-widget-area {
padding: 0 0 0 40px;
}
@media (max-width: 767px) {
.contact7 .contact-widget-area {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.contact7 .contact-widget-area {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.contact7 .contact-widget-area {
padding: 0;
}
}
.contact7 .contact-widget-area .contact-boxarea {
position: relative;
z-index: 1;
}
.contact7 .contact-widget-area .contact-boxarea .input-area {
margin-top: 16px;
}
.contact7 .contact-widget-area .contact-boxarea .input-area input {
color: var(--ztc-text-text-9);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
}
.contact7 .contact-widget-area .contact-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-10);
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;
}
.contact7 .contact-widget-area .contact-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-10);
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;
}
.contact7 .contact-widget-area .contact-boxarea .input-area .nice-select {
color: var(--ztc-text-text-10);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: auto;
border: none;
box-shadow: none;
}
.contact7 .contact-widget-area .contact-boxarea .input-area .nice-select::after {
height: 7px;
width: 7px;
right: 16px;
}
.contact7 .contact-widget-area .contact-boxarea .input-area .nice-select ul {
width: 100%;
}
.contact7 .contact-widget-area .contact-boxarea .input-area textarea {
color: var(--ztc-text-text-9);
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;
background: var(--ztc-bg-bg-1);
border-radius: 4px;
padding: 18px 16px;
width: 100%;
height: 140px;
}
.contact7 .contact-widget-area .contact-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-10);
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;
}
.contact7 .contact-widget-area .contact-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-10);
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;
}
.contact7 .contact-widget-area .contact-boxarea .input-area button {
border: none;
outline: none;
}
.contact7 .contact-maps-area iframe {
width: 100%;
border-radius: 8px;
height: 608px;
}
@media (max-width: 767px) {
.contact7 .contact-maps-area iframe {
height: 300px;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.contact7 .contact-maps-area iframe {
height: 400px;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.contact7 .contact-maps-area iframe {
height: 400px;
margin-bottom: 30px;
}
}

/*============= CONTACT CSS AREA ENDS===============*/
/*============= CTA CSS AREA ===============*/
.cta1-section-area {
position: relative;
z-index: 2;
overflow: hidden;
margin-bottom: -200px;
}
.cta1-section-area .images1 img {
height: 385px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.cta1-section-area .cta-content-area {
background: var(--ztc-bg-bg-3);
padding: 60px;
border-radius: 8px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.cta1-section-area .cta-content-area {
margin-top: 30px;
padding: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta1-section-area .cta-content-area {
margin-top: 30px;
}
}
.cta1-section-area .cta-content-area h2 {
color: var(--ztc-text-text-1);
}
.cta1-section-area .cta-content-area p {
color: var(--ztc-text-text-1);
opacity: 90%;
}
.cta1-section-area .cta-content-area form {
position: relative;
z-index: 1;
}
.cta1-section-area .cta-content-area form input {
color: var(--ztc-text-text-1);
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;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.2);
width: 300px;
padding: 18px 24px;
}
@media (max-width: 767px) {
.cta1-section-area .cta-content-area form input {
width: 100%;
}
}
.cta1-section-area .cta-content-area form input::-moz-placeholder {
color: var(--ztc-text-text-1);
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;
}
.cta1-section-area .cta-content-area form input::placeholder {
color: var(--ztc-text-text-1);
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;
}
.cta1-section-area .cta-content-area form button.vl-btn1 {
border: none;
outline: none;
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-4) !important;
margin-left: 16px;
}
@media (max-width: 767px) {
.cta1-section-area .cta-content-area form button.vl-btn1 {
margin-left: 0;
margin-top: 24px;
}
}
.cta1-section-area .cta-content-area form button.vl-btn1:hover {
color: var(--ztc-text-text-1) !important;
}

.cta2-section {
position: relative;
z-index: 2;
margin-bottom: -200px;
}
.cta2-section .cta-main-content {
position: relative;
z-index: 1;
background: #00a6e4;
border-radius: 8px;
padding: 70px;
overflow: hidden;
}
@media (max-width: 767px) {
.cta2-section .cta-main-content {
padding: 20px 20px 0 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta2-section .cta-main-content {
padding: 70px 70px 0 70px;
}
}
.cta2-section .cta-main-content .heading1 h2 {
color: var(--ztc-text-text-1);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.cta2-section .cta-main-content .heading1 h2 {
font-size: var(--ztc-font-size-font-s36);
line-height: 42px;
}
}
.cta2-section .cta-main-content .heading1 p {
color: var(--ztc-text-text-1);
opacity: 90%;
}
.cta2-section .cta-main-content .heading1 .btn-area1 .vl-btn2 {
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2) !important;
}
.cta2-section .cta-main-content .heading1 .btn-area1 .vl-btn2:hover {
color: var(--ztc-text-text-1) !important;
}
.cta2-section .cta-main-content .heading1 .btn-area1 .vl-btn2.btn2 {
margin-left: 16px;
border: 1px solid var(--ztc-text-text-1);
background: none;
color: var(--ztc-text-text-1) !important;
}
.cta2-section .cta-main-content .heading1 .btn-area1 .vl-btn2.btn2:hover {
border: 1px solid var(--ztc-text-text-2);
}
@media (max-width: 767px) {
.cta2-section .cta-main-content .heading1 .btn-area1 .vl-btn2.btn2 {
margin-left: 0;
margin-top: 20px;
}
}
.cta2-section .cta-main-content .cta-images {
position: relative;
z-index: 1;
text-align: end;
}
@media (max-width: 767px) {
.cta2-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta2-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
.cta2-section .cta-main-content .cta-images .ot-bg1 {
position: absolute;
left: 0;
z-index: -1;
max-height: 300px;
top: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta2-section .cta-main-content .cta-images .ot-bg1 {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
-o-object-fit: contain;
   object-fit: contain;
}
}
.cta2-section .cta-main-content .cta-images .img1 {
position: absolute;
top: -60px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.cta2-section .cta-main-content .cta-images .img1 {
top: 0;
}
}
@media (max-width: 767px) {
.cta2-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta2-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
}
}
.cta2-section .cta-main-content .cta-images .img1 img {
height: 458px;
width: 100%;
-o-object-fit: cover;
 object-fit: contain;
}

.cta3-section {
position: relative;
z-index: 2;
margin-bottom: -200px;
}
.cta3-section .cta-main-content {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-7);
border-radius: 8px;
padding: 70px;
overflow: hidden;
}
@media (max-width: 767px) {
.cta3-section .cta-main-content {
padding: 20px 20px 30px 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta3-section .cta-main-content {
padding: 70px 70px 30px 70px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta3-section .cta-main-content {
padding: 30px;
}
}
.cta3-section .cta-main-content .heading1 h2 {
color: var(--ztc-text-text-1);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.cta3-section .cta-main-content .heading1 h2 {
font-size: var(--ztc-font-size-font-s36);
line-height: 42px;
}
}
.cta3-section .cta-main-content .heading1 p {
color: var(--ztc-text-text-1);
opacity: 90%;
}
.cta3-section .cta-main-content .heading1 .btn-area1 .vl-btn3 {
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2) !important;
}
.cta3-section .cta-main-content .heading1 .btn-area1 .vl-btn3:hover {
color: var(--ztc-text-text-1) !important;
}
.cta3-section .cta-main-content .heading1 .btn-area1 .vl-btn3.btn2 {
margin-left: 16px;
border: 1px solid var(--ztc-text-text-1);
background: none;
color: var(--ztc-text-text-1) !important;
}
.cta3-section .cta-main-content .heading1 .btn-area1 .vl-btn3.btn2:hover {
border: 1px solid var(--ztc-text-text-2);
}
@media (max-width: 767px) {
.cta3-section .cta-main-content .heading1 .btn-area1 .vl-btn3.btn2 {
margin-left: 0;
margin-top: 20px;
}
}
.cta3-section .cta-main-content .cta-images {
position: relative;
z-index: 1;
text-align: end;
}
@media (max-width: 767px) {
.cta3-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta3-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
.cta3-section .cta-main-content .cta-images .ot-bg1 {
position: absolute;
left: 0;
z-index: -1;
max-height: 300px;
top: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta3-section .cta-main-content .cta-images .ot-bg1 {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
-o-object-fit: contain;
   object-fit: contain;
}
}
.cta3-section .cta-main-content .cta-images .img1 {
position: absolute;
top: 0;
}
@media (max-width: 767px) {
.cta3-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta3-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
margin-bottom: 30px;
}
}
.cta3-section .cta-main-content .cta-images .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
}

.cta4-section {
position: relative;
z-index: 2;
}
.cta4-section .cta-main-content {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-9);
border-radius: 8px;
padding: 70px;
overflow: hidden;
}
@media (max-width: 767px) {
.cta4-section .cta-main-content {
padding: 20px 20px 0 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta4-section .cta-main-content {
padding: 70px 70px 0 70px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta4-section .cta-main-content {
padding: 30px;
}
}
.cta4-section .cta-main-content .heading1 .btn-area1 .vl-btn4 {
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2) !important;
}
.cta4-section .cta-main-content .heading1 .btn-area1 .vl-btn4:hover {
color: var(--ztc-text-text-1) !important;
}
.cta4-section .cta-main-content .heading1 .btn-area1 .vl-btn4.btn2 {
margin-left: 16px;
border: 1px solid var(--ztc-text-text-2);
background: none;
color: var(--ztc-text-text-2) !important;
}
.cta4-section .cta-main-content .heading1 .btn-area1 .vl-btn4.btn2:hover {
border: 1px solid var(--ztc-text-text-2);
color: var(--ztc-text-text-1) !important;
}
@media (max-width: 767px) {
.cta4-section .cta-main-content .heading1 .btn-area1 .vl-btn4.btn2 {
margin-left: 0;
margin-top: 20px;
}
}
.cta4-section .cta-main-content .cta-images {
position: relative;
z-index: 1;
text-align: end;
}
@media (max-width: 767px) {
.cta4-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta4-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
.cta4-section .cta-main-content .cta-images .ot-bg1 {
position: absolute;
left: 0;
z-index: -1;
max-height: 300px;
top: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta4-section .cta-main-content .cta-images .ot-bg1 {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
-o-object-fit: contain;
   object-fit: contain;
}
}
.cta4-section .cta-main-content .cta-images .img1 {
position: absolute;
top: -40px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.cta4-section .cta-main-content .cta-images .img1 {
top: 0;
}
}
@media (max-width: 767px) {
.cta4-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta4-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
}
}
.cta4-section .cta-main-content .cta-images .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
}

.cta5-section {
position: relative;
z-index: 2;
margin-bottom: -200px;
}
.cta5-section .cta-main-content {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-11);
border-radius: 8px;
padding: 70px;
overflow: hidden;
}
@media (max-width: 767px) {
.cta5-section .cta-main-content {
padding: 20px 20px 30px 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta5-section .cta-main-content {
padding: 70px 70px 30px 70px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta5-section .cta-main-content {
padding: 30px;
}
}
.cta5-section .cta-main-content .heading1 h2 {
color: var(--ztc-text-text-1);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
.cta5-section .cta-main-content .heading1 h2 {
font-size: var(--ztc-font-size-font-s36);
line-height: 42px;
}
}
.cta5-section .cta-main-content .heading1 p {
color: var(--ztc-text-text-1);
opacity: 90%;
}
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5 {
background: var(--ztc-bg-bg-1);
color: var(--ztc-text-text-2) !important;
}
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5::before {
background: var(--ztc-bg-bg-2);
opacity: 20%;
}
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5:hover {
color: var(--ztc-text-text-1) !important;
}
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5.btn2 {
margin-left: 16px;
border: 1px solid var(--ztc-text-text-1);
background: none;
color: var(--ztc-text-text-1) !important;
}
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5.btn2:hover {
border: 1px solid var(--ztc-text-text-2);
}
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5.btn2::before {
background: var(--ztc-bg-bg-1);
opacity: 20%;
}
@media (max-width: 767px) {
.cta5-section .cta-main-content .heading1 .btn-area1 .vl-btn5.btn2 {
margin-left: 0;
margin-top: 20px;
}
}
.cta5-section .cta-main-content .cta-images {
position: relative;
z-index: 1;
text-align: end;
}
@media (max-width: 767px) {
.cta5-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta5-section .cta-main-content .cta-images {
margin-top: 30px;
}
}
.cta5-section .cta-main-content .cta-images .ot-bg1 {
position: absolute;
left: 0;
z-index: -1;
max-height: 300px;
top: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta5-section .cta-main-content .cta-images .ot-bg1 {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
-o-object-fit: contain;
   object-fit: contain;
}
}
.cta5-section .cta-main-content .cta-images .img1 {
position: absolute;
top: 0;
}
@media (max-width: 767px) {
.cta5-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta5-section .cta-main-content .cta-images .img1 {
position: relative;
top: 0;
margin-bottom: 30px;
}
}
.cta5-section .cta-main-content .cta-images .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
}

.cta7-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.cta7-section .cta7-bg-content {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 12px;
padding: 70px;
}
@media (max-width: 767px) {
.cta7-section .cta7-bg-content {
padding: 24px 24px 0 16px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta7-section .cta7-bg-content {
padding: 40px 40px 0 40px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta7-section .cta7-bg-content {
padding: 40px 40px 40px 40px;
}
}
.cta7-section .cta7-bg-content::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-12);
z-index: -1;
opacity: 90%;
border-radius: 12px;
}
.cta7-section .cta7-bg-content .btn-area1 .vl-btn7 {
margin-left: 16px;
}
@media (max-width: 767px) {
.cta7-section .cta7-bg-content .btn-area1 .vl-btn7 {
margin-left: 0;
margin-top: 20px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta7-section .cta7-bg-content .btn-area1 .vl-btn7 {
margin-left: 0;
margin-top: 20px;
}
}
.cta7-section .cta7-bg-content .cta7-images {
position: absolute;
right: 70px;
bottom: 0;
z-index: 1;
}
@media (max-width: 767px) {
.cta7-section .cta7-bg-content .cta7-images {
position: relative;
margin-top: 30px;
text-align: center;
right: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta7-section .cta7-bg-content .cta7-images {
position: relative;
margin-top: 30px;
text-align: center;
right: 0;
}
}
.cta7-section .cta7-bg-content .cta7-images .elements11 {
position: absolute;
bottom: -90px;
z-index: -1;
width: 450px;
height: 450px;
-o-object-fit: contain;
 object-fit: contain;
max-width: 450px;
max-height: 450px;
left: -70px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta7-section .cta7-bg-content .cta7-images .elements11 {
display: none;
}
}

.cta8-section {
position: relative;
z-index: 2;
overflow: hidden;
margin-bottom: -170px;
}
.cta8-section .cta8-bg-content {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 12px;
padding: 70px;
}
@media (max-width: 767px) {
.cta8-section .cta8-bg-content {
padding: 24px 24px 0 16px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta8-section .cta8-bg-content {
padding: 40px 40px 0 40px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta8-section .cta8-bg-content {
padding: 40px 40px 0 40px;
}
}
.cta8-section .cta8-bg-content::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-12);
z-index: -1;
opacity: 90%;
border-radius: 12px;
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn6 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-16);
padding: 12px 12px 12px 20px;
border-radius: 80px;
position: relative;
z-index: 1;
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn6::after {
position: absolute;
content: "";
height: 100%;
width: 0;
left: 50%;
top: 0;
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
border-radius: 80px;
z-index: -1;
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn6:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn6:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-12);
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn6:hover::after {
width: 100%;
height: 100%;
transition: all 0.4s;
left: 0;
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn6 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-13);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn7 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border: 1px solid var(--ztc-bg-bg-1);
padding: 12px 12px 12px 20px;
border-radius: 80px;
position: relative;
z-index: 1;
margin-left: 16px;
}
@media (max-width: 767px) {
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn7 {
margin-left: 0;
margin-top: 20px;
}
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn7:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
background: var(--ztc-bg-bg-16);
border: 1px solid var(--ztc-text-text-13);
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn7:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-13);
}
.cta8-section .cta8-bg-content .btn-area1 .vl-cta-btn7 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-9);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}
.cta8-section .cta8-bg-content .cta7-images {
position: absolute;
right: 70px;
bottom: 0;
z-index: 1;
}
@media (max-width: 767px) {
.cta8-section .cta8-bg-content .cta7-images {
position: relative;
margin-top: 30px;
text-align: center;
right: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta8-section .cta8-bg-content .cta7-images {
position: relative;
margin-top: 30px;
text-align: center;
right: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta8-section .cta8-bg-content .cta7-images {
position: relative;
margin-top: 30px;
right: 0;
left: 0;
}
}
.cta8-section .cta8-bg-content .cta7-images .elements11 {
position: absolute;
bottom: -90px;
z-index: -1;
width: 450px;
height: 450px;
-o-object-fit: contain;
 object-fit: contain;
max-width: 450px;
max-height: 450px;
left: -70px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta8-section .cta8-bg-content .cta7-images .elements11 {
display: none;
}
}

.cta9-section {
position: relative;
z-index: 2;
overflow: hidden;
margin-bottom: -170px;
}
.cta9-section .cta9-bg-content {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 12px;
padding: 70px;
}
@media (max-width: 767px) {
.cta9-section .cta9-bg-content {
padding: 24px 24px 24px 16px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta9-section .cta9-bg-content {
padding: 40px 40px 40px 40px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta9-section .cta9-bg-content {
padding: 40px 40px 40px 40px;
}
}
.cta9-section .cta9-bg-content::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
border-radius: 12px;
background: linear-gradient(91deg, #000814 25.53%, rgba(0, 8, 20, 0.2) 99.11%);
z-index: -1;
opacity: 90%;
border-radius: 12px;
}
.cta9-section .cta9-bg-content .btn-area1 .vl-cta-btn11 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border: 1px solid var(--ztc-bg-bg-1);
padding: 12px 12px 12px 20px;
border-radius: 8px;
position: relative;
z-index: 1;
margin-left: 16px;
}
@media (max-width: 767px) {
.cta9-section .cta9-bg-content .btn-area1 .vl-cta-btn11 {
margin-left: 0;
margin-top: 20px;
}
}
.cta9-section .cta9-bg-content .btn-area1 .vl-cta-btn11:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
background: var(--ztc-bg-bg-19);
border: 1px solid var(--ztc-text-text-14);
}
.cta9-section .cta9-bg-content .btn-area1 .vl-cta-btn11:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-14);
}
.cta9-section .cta9-bg-content .btn-area1 .vl-cta-btn11 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-12);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}

.cta10-section {
position: relative;
z-index: 2;
overflow: hidden;
margin-bottom: -170px;
}
.cta10-section .cta9-bg-content {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 12px;
padding: 70px;
}
@media (max-width: 767px) {
.cta10-section .cta9-bg-content {
padding: 24px 24px 24px 16px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.cta10-section .cta9-bg-content {
padding: 40px 40px 40px 40px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.cta10-section .cta9-bg-content {
padding: 40px 40px 40px 40px;
}
}
.cta10-section .cta9-bg-content::after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
border-radius: 12px;
background: linear-gradient(91deg, #000814 25.53%, rgba(0, 8, 20, 0.2) 99.11%);
z-index: -1;
opacity: 90%;
border-radius: 12px;
}
.cta10-section .cta9-bg-content .btn-area1 .vl-cta-btn11 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border: 1px solid var(--ztc-bg-bg-1);
padding: 12px 12px 12px 20px;
border-radius: 8px;
position: relative;
z-index: 1;
margin-left: 16px;
}
@media (max-width: 767px) {
.cta10-section .cta9-bg-content .btn-area1 .vl-cta-btn11 {
margin-left: 0;
margin-top: 20px;
}
}
.cta10-section .cta9-bg-content .btn-area1 .vl-cta-btn11:hover {
transform: translateY(-5px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
background: var(--ztc-bg-bg-19);
border: 1px solid var(--ztc-text-text-14);
}
.cta10-section .cta9-bg-content .btn-area1 .vl-cta-btn11:hover span {
transform: rotate(0);
transition: all 0.4s;
color: var(--ztc-text-text-14);
}
.cta10-section .cta9-bg-content .btn-area1 .vl-cta-btn11 span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
color: var(--ztc-text-text-12);
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
transform: rotate(-45deg);
margin-left: 10px;
}

/*============= CTA CSS AREA ENDS===============*/
/*============= TESTIMONIAL CSS AREA ===============*/
.testi1 {
position: relative;
z-index: 1;
overflow: hidden;
}
.testi1 .testi-widget-slider {
position: relative;
z-index: 1;
}
.testi1 .testi-widget-slider .owl-dots {
margin-top: 48px;
text-align: center;
}
.testi1 .testi-widget-slider .owl-dots button {
height: 10px;
width: 10px;
display: inline-block;
transition: all 0.4s;
background: #C6D5F5;
border-radius: 50%;
position: relative;
margin: 0 16px 0 0;
}
.testi1 .testi-widget-slider .owl-dots button.active {
background: var(--ztc-bg-bg-3);
}
.testi1 .testi-widget-slider .owl-dots button.active::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.testi1 .testi-widget-slider .owl-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
background: #DCE3F3;
left: -7px;
top: -7px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.testi1 .testi-widget-slider .testi-box-slider {
position: relative;
z-index: 1;
}
.testi1 .testi-widget-slider .testi-box-slider .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.testi1 .testi-widget-slider .testi-box-slider .img1 img {
height: 250px;
}
}
@media (max-width: 767px) {
.testi1 .testi-widget-slider .testi-box-slider .img1 img {
height: 250px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testi1 .testi-widget-slider .testi-box-slider .img1 img {
height: 250px;
}
}
.testi1 .testi-widget-slider .testi-box-slider .testi-contentarea {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 24px;
}
.testi1 .testi-widget-slider .testi-box-slider .testi-contentarea ul li {
display: inline-block;
color: var(--ztc-text-text-4);
}
.testi1 .testi-widget-slider .testi-box-slider .testi-contentarea .pera {
color: var(--ztc-text-text-3);
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: 28px; /* 155.556% */
}
.testi1 .testi-widget-slider .testi-box-slider .testi-contentarea .text-area 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.testi1 .testi-widget-slider .testi-box-slider .testi-contentarea .text-area a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.testi1 .testi-widget-slider .testi-box-slider .testi-contentarea .text-area p {
color: var(--ztc-text-text-3);
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;
}

.testimonial2 {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
overflow: hidden;
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .img1 {
position: absolute;
width: 220px;
height: 220px;
border-radius: 50%;
top: 50%;
margin-top: -110px;
z-index: 2;
left: 30px;
}
@media (max-width: 767px) {
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .img1 {
position: relative;
left: 0;
margin-top: 0;
text-align: center;
margin: 0 auto;
padding-bottom: 10px;
}
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .img1 img {
width: 220px;
height: 220px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 50%;
padding: 5px;
background: var(--ztc-bg-bg-5);
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 32px 24px 32px 132px;
margin: 0 0 0 140px;
position: relative;
z-index: 1;
border: 1px solid black;
}
@media (max-width: 767px) {
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea {
margin: 0;
padding: 16px;
}
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea .quito {
position: absolute;
bottom: 16px;
right: 16px;
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea ul li {
color: var(--ztc-text-text-5);
display: inline-block;
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea p {
color: var(--ztc-text-text-3);
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: 28px;
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea .name-area 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.testimonial2 .testimonial2-slider-area .testimonial-boxarea .content-boxarea .name-area a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
.testimonial2 .testimonial2-slider-area .slick-dots {
display: flex;
justify-content: center;
margin-top: 48px;
}
.testimonial2 .testimonial2-slider-area .slick-dots li {
margin: 0 8px;
}
.testimonial2 .testimonial2-slider-area .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: #F2C4CA;
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.testimonial2 .testimonial2-slider-area .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
background: #F2C4CA;
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.testimonial2 .testimonial2-slider-area .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-5);
}
.testimonial2 .testimonial2-slider-area .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}

.testimonial3-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-8);
}
.testimonial3-section-area .testimonial-imges {
position: relative;
z-index: 1;
}
.testimonial3-section-area .testimonial-imges .img1 img {
height: 250px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.testimonial3-section-area .testimonial-imges .success-rate {
background: var(--ztc-bg-bg-7);
text-align: center;
display: block;
padding: 73px 26px 26px 26px;
border-radius: 0 0 8px 8px;
position: relative;
margin-top: -6px;
}
.testimonial3-section-area .testimonial-imges .success-rate .others-img4 {
position: absolute;
width: 278px;
height: 76px;
-o-object-fit: cover;
 object-fit: cover;
left: 50%;
margin-left: -139px;
top: 0;
margin-top: -38px;
}
.testimonial3-section-area .testimonial-imges .success-rate ul li {
display: inline-block;
color: var(--ztc-text-text-1);
}
.testimonial3-section-area .testimonial-imges .success-rate h3 {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 32px;
}
.testimonial3-section-area .testimonial-single-slider3 {
position: relative;
z-index: 1;
border-radius: 16px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 10px 40px 0px rgba(0, 0, 0, 0.08);
padding: 32px;
}
@media (max-width: 767px) {
.testimonial3-section-area .testimonial-single-slider3 {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial3-section-area .testimonial-single-slider3 {
margin-top: 30px;
}
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box {
position: relative;
z-index: 1;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .list-area {
display: flex;
align-items: center;
justify-content: space-between;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .list-area ul li {
display: inline-block;
height: 28px;
width: 28px;
border-radius: 4px;
text-align: center;
line-height: 28px;
border-radius: 2.203px;
background: rgba(15, 13, 13, 0.06);
color: var(--ztc-text-text-6);
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .pera {
color: rgba(15, 13, 13, 0.8);
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: 33px;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea {
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 767px) {
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea {
display: inline-block;
}
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .elements2 {
width: 100%;
height: 50px;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .author-boxarea {
display: flex;
align-items: center;
}
@media (max-width: 767px) {
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .author-boxarea {
margin-bottom: 20px;
}
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .author-boxarea .img img {
height: 66px;
width: 66px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 50%;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .author-boxarea .text {
padding-left: 16px;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .author-boxarea .text a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s22);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 22px;
display: inline-block;
transition: all 0.4s;
}
.testimonial3-section-area .testimonial-single-slider3 .single-slider-box .others-boxarea .author-boxarea .text p {
color: var(--ztc-text-text-3);
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;
}
@media (max-width: 767px) {
.testimonial3-section-area .testimonial-arrows {
display: flex;
align-items: center;
justify-content: center;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial3-section-area .testimonial-arrows {
display: flex;
align-items: center;
justify-content: center;
margin-top: 30px;
}
}
.testimonial3-section-area .testimonial-arrows .prev-arrow button {
margin-bottom: 14px;
}
@media (max-width: 767px) {
.testimonial3-section-area .testimonial-arrows .prev-arrow button {
margin: 0 16px 0 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial3-section-area .testimonial-arrows .prev-arrow button {
margin: 0 16px 0 0;
}
}
.testimonial3-section-area .testimonial-arrows button {
border: none;
outline: none;
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
background: var(--ztc-bg-bg-2);
color: var(--ztc-text-text-1);
font-size: var(--ztc-font-size-font-s20);
}
.testimonial3-section-area .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-7);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}

.testimonial5 {
position: relative;
z-index: 1;
overflow: hidden;
}
.testimonial5 .testimonial5-boxarea {
position: relative;
z-index: 1;
border-radius: 8px;
border: 1px solid rgba(15, 13, 13, 0.1);
padding: 32px;
transition: all 0.4s;
margin-bottom: 30px;
}
.testimonial5 .testimonial5-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.09);
border: 1px solid var(--ztc-text-text-1);
}
.testimonial5 .testimonial5-boxarea.box2 {
position: relative;
margin-top: -30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial5 .testimonial5-boxarea.box2 {
margin-top: 0;
}
}
.testimonial5 .testimonial5-boxarea ul li {
display: inline-block;
color: var(--ztc-text-text-8);
}
.testimonial5 .testimonial5-boxarea p.pera {
color: var(--ztc-text-text-3);
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: 28px;
}
.testimonial5 .testimonial5-boxarea 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.testimonial5 .testimonial5-boxarea a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.testimonial5 .testimonial5-boxarea p.desc {
color: var(--ztc-text-text-3);
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: 26px;
}

.testi7 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-12);
}
.testi7 .testimonial7-main-slider-area {
position: relative;
z-index: 1;
}
.testi7 .testimonial7-main-slider-area .slick-list {
overflow: inherit;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
padding: 30px;
transition: all 0.4s;
border-radius: 8px;
margin: 0 10px;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .star li {
display: inline-block;
color: var(--ztc-text-text-9);
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .pera {
color: var(--ztc-text-text-10);
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: 24px;
padding-bottom: 32px;
border-bottom: 1px solid #DDD;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .others-widget {
display: flex;
align-items: center;
justify-content: space-between;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .others-widget .author-boxarea {
display: flex;
align-items: center;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .others-widget .author-boxarea .img img {
height: 62px;
width: 62px;
border-radius: 50%;
-o-object-fit: cover;
 object-fit: cover;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .others-widget .author-boxarea .text {
padding-left: 16px;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .others-widget .author-boxarea .text a {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
letter-spacing: 0.4px;
display: inline-block;
transition: all 0.4s;
}
.testi7 .testimonial7-main-slider-area .testimonial-7-widget .others-widget .author-boxarea .text p {
color: var(--ztc-text-text-10);
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;
}
.testi7 .testimonial7-main-slider-area .slick-dots {
display: flex;
justify-content: center;
margin-top: 48px;
}
.testi7 .testimonial7-main-slider-area .slick-dots li {
margin: 0 8px;
}
.testi7 .testimonial7-main-slider-area .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: var(--ztc-bg-bg-1);
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.testi7 .testimonial7-main-slider-area .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.testi7 .testimonial7-main-slider-area .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-1);
}
.testi7 .testimonial7-main-slider-area .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 30%;
transition: all 0.4s;
}

.testimonial8-section-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-15);
}
.testimonial8-section-area .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 16px;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area {
position: relative;
z-index: 1;
margin: 0 30px;
}
@media (max-width: 767px) {
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area {
margin: 30px 0 0 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area {
margin: 30px 0 0 0;
}
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-author-area {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-18);
border-radius: 8px;
padding: 28px 38px 28px 28px;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-author-area .quito1 {
position: absolute;
right: 20px;
top: 20px;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-author-area ul li {
display: inline-block;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-author-area ul li a {
height: 26px;
width: 26px;
text-align: center;
line-height: 26px;
border-radius: 4px;
display: inline-block;
transition: all 0.4s;
border-radius: 2px;
background: #474D56;
color: var(--ztc-text-text-1);
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-author-area p {
color: var(--ztc-text-text-1);
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: 28px;
transition: all 0.4s;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-author-area .elements18 {
position: absolute;
bottom: -35px;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-man-info-area {
display: flex;
align-items: center;
justify-content: space-between;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-man-info-area .man-images-text {
display: flex;
align-items: center;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-man-info-area .man-images-text .mans-img img {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
border-radius: 50%;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-man-info-area .man-images-text .man-text {
padding-left: 16px;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-man-info-area .man-images-text .man-text a {
color: var(--ztc-text-text-1);
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: 20px;
display: inline-block;
transition: all 0.4s;
}
.testimonial8-section-area .slider-galeria .testimonial-slider-content-area .testimonial-man-info-area .man-images-text .man-text p {
color: var(--ztc-text-text-1);
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;
transition: all 0.4s;
}
.testimonial8-section-area .slider-galeria-thumbs .testimonial3-sliders-img {
position: relative;
}
.testimonial8-section-area .slider-galeria-thumbs .testimonial3-sliders-img.slick-slide.slick-current.slick-active:after {
position: absolute;
content: "";
height: 74px;
width: 74px;
background: var(--ztc-bg-bg-16);
z-index: -1;
top: -1px;
left: -2px;
border-radius: 50%;
}
.testimonial8-section-area .slider-galeria-thumbs .testimonial3-sliders-img img {
height: 70px;
width: 70px;
border-radius: 50%;
-o-object-fit: cover;
 object-fit: cover;
transition: all 0.4s;
margin: 0 0 10px 0;
cursor: pointer;
}

.testimonial-about {
position: relative;
z-index: 1;
overflow: hidden;
}
.testimonial-about .testimonial5-boxarea {
position: relative;
z-index: 1;
border-radius: 8px;
border: 1px solid rgba(15, 13, 13, 0.1);
padding: 32px;
transition: all 0.4s;
margin-bottom: 30px;
}
.testimonial-about .testimonial5-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.09);
border: 1px solid var(--ztc-text-text-1);
}
.testimonial-about .testimonial5-boxarea.box2 {
position: relative;
margin-top: -30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial-about .testimonial5-boxarea.box2 {
margin-top: 0;
}
}
.testimonial-about .testimonial5-boxarea ul li {
display: inline-block;
color: var(--ztc-text-text-4);
}
.testimonial-about .testimonial5-boxarea p.pera {
color: var(--ztc-text-text-3);
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: 28px;
}
.testimonial-about .testimonial5-boxarea 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.testimonial-about .testimonial5-boxarea a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.testimonial-about .testimonial5-boxarea p.desc {
color: var(--ztc-text-text-3);
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: 26px;
}

.testimonial5 {
position: relative;
z-index: 1;
overflow: hidden;
}
.testimonial5 .testimonial5-boxarea {
position: relative;
z-index: 1;
border-radius: 8px;
border: 1px solid rgba(15, 13, 13, 0.1);
padding: 32px;
transition: all 0.4s;
margin-bottom: 30px;
}
.testimonial5 .testimonial5-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.09);
border: 1px solid var(--ztc-text-text-1);
}
.testimonial5 .testimonial5-boxarea.box2 {
position: relative;
margin-top: -30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial5 .testimonial5-boxarea.box2 {
margin-top: 0;
}
}
.testimonial5 .testimonial5-boxarea ul li {
display: inline-block;
color: var(--ztc-text-text-8);
}
.testimonial5 .testimonial5-boxarea p.pera {
color: var(--ztc-text-text-3);
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: 28px;
}
.testimonial5 .testimonial5-boxarea 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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.testimonial5 .testimonial5-boxarea a:hover {
color: var(--ztc-text-text-8);
transition: all 0.4s;
}
.testimonial5 .testimonial5-boxarea p.desc {
color: var(--ztc-text-text-3);
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: 26px;
}

.testimonial9-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
margin: 0 60px;
border-radius: 10px;
}
@media (max-width: 767px) {
.testimonial9-section {
margin: 0;
border-radius: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial9-section {
margin: 0;
border-radius: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.testimonial9-section {
margin: 0;
border-radius: 0;
}
}
.testimonial9-section .testimonial9-arrow {
display: flex;
align-items: center;
justify-content: end;
}
@media (max-width: 767px) {
.testimonial9-section .testimonial9-arrow {
justify-content: start;
margin-top: 20px;
}
}
.testimonial9-section .testimonial9-arrow button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.testimonial9-section .testimonial9-arrow button:hover {
background: var(--ztc-bg-bg-5);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.testimonial9-section .testimonial9-arrow .testimonial9-next-arrow {
margin-left: 12px;
}
.testimonial9-section .testimonial9-slider-area {
position: relative;
z-index: 1;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 30px;
transition: all 0.4s;
margin: 0 10px;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea ul li {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
color: var(--ztc-text-text-14);
transition: all 0.4s;
border-radius: 4px;
display: inline-block;
background: #FEF2F2;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .pera {
color: var(--ztc-text-text-10);
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: 28px;
transition: all 0.4s;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .slider-name-area {
display: flex;
align-items: center;
justify-content: space-between;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .images-area {
display: flex;
align-items: center;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .images-area .img1 img {
height: 72px;
width: 72px;
border-radius: 50%;
transition: all 0.4s;
-o-object-fit: cover;
 object-fit: cover;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .images-area .test {
padding-left: 16px;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .images-area .test a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.testimonial9-section .testimonial9-slider-area .testimonial9-boxarea .images-area .test p {
color: var(--ztc-text-text-10);
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;
transition: all 0.4s;
}

.testimonial10-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
}
.testimonial10-section .testimonial10-slider {
position: relative;
z-index: 1;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-1);
border-radius: 8px;
margin: 0 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.testimonial10-section .testimonial10-slider .testimonial10-boxarea {
padding: 24px;
}
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 4px 0 4px 0;
}
@media (max-width: 767px) {
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .img1 img {
border-radius: 4px 4px 0 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .img1 img {
border-radius: 4px 4px 0 0;
}
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content {
padding: 0 24px 0 0;
}
@media (max-width: 767px) {
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content {
padding: 20px;
}
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content ul li {
display: inline-block;
color: var(--ztc-text-text-14);
height: 24px;
width: 24px;
text-align: center;
line-height: 24px;
border-radius: 4px;
background: #FEF2F2;
transition: all 0.4s;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .pera {
color: var(--ztc-text-text-10);
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: 24px;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .slider-name-area {
display: flex;
align-items: center;
justify-content: space-between;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .images-area {
display: flex;
align-items: center;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .images-area .img1 img {
height: 58px;
width: 58px;
border-radius: 50%;
transition: all 0.4s;
-o-object-fit: cover;
 object-fit: cover;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .images-area .test {
padding-left: 16px;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .images-area .test a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.testimonial10-section .testimonial10-slider .testimonial10-boxarea .testi-content .images-area .test p {
color: var(--ztc-text-text-10);
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;
transition: all 0.4s;
}
.testimonial10-section .testimonial10-slider .slick-dots {
display: flex;
justify-content: center;
margin-top: 60px;
}
.testimonial10-section .testimonial10-slider .slick-dots li {
margin: 0 8px;
}
.testimonial10-section .testimonial10-slider .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: var(--ztc-bg-bg-19);
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.testimonial10-section .testimonial10-slider .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
border: 1px solid var(--ztc-text-text-14);
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.testimonial10-section .testimonial10-slider .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-19);
}
.testimonial10-section .testimonial10-slider .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}

/*============= TESTIMONIAL CSS AREA ENDS ===============*/
/*============= CASE STUDY CSS AREA  ===============*/
/*============= CASE STUDY CSS AREA ENDS ===============*/
/*============= PROEJCTS CSS AREA STARTS ===============*/
.proejct1 {
position: relative;
z-index: 1;
overflow: hidden;
background: lightgray;
}
.proejct1 .project-widget-slider {
position: relative;
z-index: 1;
}
.proejct1 .project-widget-slider .owl-nav {
position: absolute;
right: 0;
top: -130px;
}
@media (max-width: 767px) {
.proejct1 .project-widget-slider .owl-nav {
position: relative;
left: 0;
top: 0;
text-align: center;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.proejct1 .project-widget-slider .owl-nav {
position: relative;
left: 0;
top: 0;
text-align: center;
margin-top: 30px;
}
}
.proejct1 .project-widget-slider .owl-nav button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: #F2F2F2;
font-size: var(--ztc-font-size-font-s20);
}
.proejct1 .project-widget-slider .owl-nav button:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.proejct1 .project-widget-slider .owl-nav button.owl-prev {
margin: 0 16px 0 0;
}
.proejct1 .project-widget-slider .project-slider {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.proejct1 .project-widget-slider .project-slider:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider:hover .content-area {
bottom: 20px;
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area {
background: var(--ztc-bg-bg-1);
padding: 28px 24px;
border-radius: 8px;
position: absolute;
bottom: -200px;
left: 20px;
right: 20px;
z-index: 2;
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area span {
color: var(--ztc-text-text-2);
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;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
border-radius: 8px;
background: var(--3rd-GRAY, #F2F2F2);
padding: 8px 12px;
}
.proejct1 .project-widget-slider .project-slider .content-area .title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area .title:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area .readmore {
color: var(--ztc-text-text-4);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
text-transform: uppercase;
display: inline-block;
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area .readmore i {
margin-left: 4px;
transform: rotate(-45deg);
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area .readmore:hover {
color: var(--ztc-text-text-2);
transition: all 0.4s;
}
.proejct1 .project-widget-slider .project-slider .content-area .readmore:hover i {
transform: rotate(0);
transition: all 0.4s;
}

.project2 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-2);
height: 1050px;
}
.project2 .heading2 .vl-section-subtitle {
color: var(--ztc-text-text-1);
border-radius: 4px;
background: rgba(255, 255, 255, 0.1);
}
.project2 .heading2 .vl-section-title {
color: var(--ztc-text-text-1);
}
.project2 .slider-container .slick-slider-content .slick-list {
overflow: inherit !important;
}
.project2 .slider-container .slick-slider-content .slide {
padding: 0 60px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.project2 .slider-container .slick-slider-content .slide {
padding: 10px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project2 .slider-container .slick-slider-content .slide {
padding: 40px;
}
}
.project2 .slider-container .slick-slider-content .slide img {
height: 500px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.project2 .slider-container .slick-slider-content .slide.slick-current.slick-active img {
transform: scale(1.16, 1.16);
transition: all 1s;
cursor: pointer;
display: block;
margin: 15px auto;
}
.project2 .slider-container .slick-slider-content .slide.slick-current.slick-active .main-content {
visibility: visible;
opacity: 1;
transition: all 0.6s;
bottom: 20px;
}
.project2 .slider-container .slick-slider-content .slide .main-content {
background: var(--ztc-bg-bg-1);
display: flex;
align-items: center;
justify-content: space-between;
position: absolute;
width: 100%;
left: 0;
bottom: 100px;
visibility: hidden;
opacity: 0;
transition: all 0.6s;
padding: 24px;
border-radius: 8px;
}
@media (max-width: 767px) {
.project2 .slider-container .slick-slider-content .slide .main-content {
display: inline-block;
}
}
.project2 .slider-container .slick-slider-content .slide .main-content h5 {
color: var(--ztc-text-text-5);
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;
border-radius: 8px;
background: rgba(232, 4, 15, 0.1);
padding: 8px 12px;
}
.project2 .slider-container .slick-slider-content .slide .main-content a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
display: inline-block;
transition: all 0.4s;
}
.project2 .slider-container .slick-slider-content .slide .main-content a:hover {
color: var(--ztc-text-text-5);
transition: all 0.4s;
}
@media (max-width: 767px) {
.project2 .slider-container .slick-slider-content .slide .main-content .arrow {
margin-top: 16px;
}
}
.project2 .slider-container .slick-slider-content .slide .main-content .arrow a {
height: 80px;
width: 80px;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-5);
border-radius: 50%;
line-height: 80px;
text-align: center;
}
.project2 .slider-container .slick-slider-content .slide .main-content .arrow a:hover {
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
}
.project2 .slider-container .slick-dots {
display: flex;
justify-content: center;
margin-top: 60px;
}
.project2 .slider-container .slick-dots li {
margin: 0 8px;
}
.project2 .slider-container .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: #575656;
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.project2 .slider-container .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
background: #575656;
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.project2 .slider-container .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-1);
}
.project2 .slider-container .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}

.project3 {
position: relative;
z-index: 1;
overflow: hidden;
}
.project3 .project-arrow-area {
position: relative;
z-index: 1;
}
.project3 .project-arrow-area .testimonial-arrows {
position: absolute;
z-index: 2;
right: 0;
display: flex;
align-items: center;
top: -130px;
}
@media (max-width: 767px) {
.project3 .project-arrow-area .testimonial-arrows {
position: relative;
margin-top: 30px;
text-align: center;
top: 0;
justify-content: center;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project3 .project-arrow-area .testimonial-arrows {
position: relative;
margin-top: 30px;
text-align: center;
top: 0;
justify-content: center;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.project3 .project-arrow-area .testimonial-arrows {
position: relative;
margin-top: 30px;
text-align: center;
top: 0;
justify-content: center;
}
}
.project3 .project-arrow-area .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-2);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-1);
font-size: var(--ztc-font-size-font-s20);
}
.project3 .project-arrow-area .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-7);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.project3 .project-arrow-area .testimonial-arrows .testimonial-prev-arrow {
margin: 0 12px 0 0;
}
.project3 .project-arrow-area .project3-main-slider {
position: relative;
z-index: 1;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea {
transition: all 0.4s;
position: relative;
z-index: 1;
margin: 0 10px;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea:hover .content-area .desc {
visibility: visible;
opacity: 1;
transition: all 0.6s;
height: 142px;
}
@media (max-width: 767px) {
.project3 .project-arrow-area .project3-main-slider .project-boxarea:hover .content-area .desc {
height: 170px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project3 .project-arrow-area .project3-main-slider .project-boxarea:hover .content-area .desc {
height: 170px;
}
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .img1 img {
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
height: 450px;
border-radius: 8px;
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area {
background: var(--ztc-bg-bg-1);
border-radius: 8px;
padding: 20px 24px;
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
z-index: 2;
overflow: hidden;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .title:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .desc {
visibility: hidden;
transition: all 0.6s;
position: relative;
opacity: 0;
height: 0;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .desc p {
color: var(--ztc-text-text-3);
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: 26px;
display: inline-block;
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .desc .readmore {
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-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .desc .readmore:hover {
color: var(--ztc-text-text-6);
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .desc .readmore:hover i {
transform: rotate(-45deg);
transition: all 0.4s;
}
.project3 .project-arrow-area .project3-main-slider .project-boxarea .content-area .desc .readmore i {
transition: all 0.4s;
margin-left: 4px;
}

.project4-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-2);
}
.project4-section .heading4 h5 {
border-radius: 60px;
background: rgba(255, 255, 255, 0.1);
color: var(--ztc-text-text-1);
}
.project4-section .heading4 h2 {
color: var(--ztc-text-text-1);
}
.project4-section .project-single-boxarea {
position: relative;
z-index: 2;
}
.project4-section .project-single-boxarea .slick-dots {
position: absolute;
top: 0;
right: -100px;
}
@media (max-width: 767px) {
.project4-section .project-single-boxarea .slick-dots {
position: relative;
left: 0;
text-align: center;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project4-section .project-single-boxarea .slick-dots {
position: relative;
left: 0;
text-align: center;
margin-top: 30px;
}
}
@media (max-width: 767px) {
.project4-section .project-single-boxarea .slick-dots li {
display: inline-block;
text-align: center;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project4-section .project-single-boxarea .slick-dots li {
display: inline-block;
text-align: center;
}
}
.project4-section .project-single-boxarea .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-9);
color: var(--ztc-text-text-2);
transition: all 0.4s;
}
.project4-section .project-single-boxarea .slick-dots li button {
height: 50px;
width: 50px;
text-align: center;
line-height: 60px;
border-radius: 60px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.1);
color: var(--ztc-text-text-4);
transition: all 0.4s;
border: none;
outline: none;
color: var(--ztc-text-text-1);
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: 20px;
margin-bottom: 10px;
}
@media (max-width: 767px) {
.project4-section .project-single-boxarea .slick-dots li button {
margin: 0 6px 0 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project4-section .project-single-boxarea .slick-dots li button {
margin: 0 12px 0 0;
}
}
.project4-section .project-single-boxarea .slick-dots li button:hover {
background: var(--ztc-bg-bg-9);
color: var(--ztc-text-text-2);
transition: all 0.4s;
}
.project4-section .project-single-boxarea .project-boxarea {
border-radius: 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.09);
padding: 48px;
border: 1px solid rgba(0, 0, 0, 0.09);
}
@media (max-width: 767px) {
.project4-section .project-single-boxarea .project-boxarea {
padding: 24px;
}
}
.project4-section .project-single-boxarea .project-boxarea h5 {
border-radius: 60px;
background: var(--ztc-bg-bg-8);
color: var(--ztc-text-text-2);
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;
padding: 10px 14px;
display: inline-block;
text-transform: capitalize;
}
.project4-section .project-single-boxarea .project-boxarea h2 a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
display: inline-block;
transition: all 0.4s;
}
.project4-section .project-single-boxarea .project-boxarea a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
display: inline-block;
transition: all 0.4s;
}
.project4-section .project-single-boxarea .project-boxarea a:hover {
color: var(--ztc-text-text-7);
transition: all 0.4s;
}
.project4-section .project-single-boxarea .project-boxarea a i {
margin-left: 4px;
}
.project4-section .all-images .images-area {
position: relative;
z-index: 1;
}
.project4-section .all-images .images-area .img1 {
max-width: 700px;
position: relative;
left: 100px;
z-index: -1;
}
@media (max-width: 767px) {
.project4-section .all-images .images-area .img1 {
max-width: 100%;
left: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project4-section .all-images .images-area .img1 {
max-width: 100%;
left: 0;
margin-top: 30px;
}
}
.project4-section .all-images .images-area .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}

.gallery1 {
position: relative;
z-index: 1;
overflow: hidden;
}
.gallery1 .img1 {
margin-bottom: 30px;
}
.gallery1 .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.gallery1 .img1 img {
height: 250px;
}
}
.gallery1 .img2 {
margin-bottom: 30px;
}
.gallery1 .img2 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.gallery1 .img2 img {
height: 250px;
}
}

.project7-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.project7-section .project7-main-slider-area {
position: relative;
z-index: 1;
}
.project7-section .project7-main-slider-area .slick-list {
overflow: inherit;
}
.project7-section .project7-main-slider-area .project7-main-widget-box {
position: relative;
z-index: 1;
margin: 0 10px;
}
.project7-section .project7-main-slider-area .project7-main-widget-box.slick-slide.slick-current.slick-active .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box.slick-slide.slick-current.slick-active .content-prjs-area {
visibility: visible;
opacity: 1;
transition: all 0.6s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box:hover .content-prjs-area {
visibility: visible;
opacity: 1;
transition: all 0.6s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .img1 img {
height: 400px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
transition: all 0.4s;
border-radius: 8px;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .content-prjs-area {
background: var(--ztc-bg-bg-1);
padding: 30px;
position: absolute;
z-index: 2;
bottom: 30px;
left: 30px;
right: 40px;
border-radius: 8px;
visibility: hidden;
opacity: 0;
transition: all 0.6s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .content-prjs-area span {
color: var(--ztc-text-text-11);
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;
display: inline-block;
transition: all 0.4s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .content-prjs-area a.title {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .content-prjs-area a.title:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .content-prjs-area .arrow a {
height: 58px;
width: 58px;
text-align: center;
line-height: 58px;
border-radius: 50%;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-13);
color: var(--ztc-text-text-1);
display: inline-block;
font-size: var(--ztc-font-size-font-s20);
transform: rotate(-45deg);
position: absolute;
top: -15px;
right: -15px;
}
.project7-section .project7-main-slider-area .project7-main-widget-box .content-prjs-area .arrow a:hover {
background: var(--ztc-bg-bg-12);
transition: all 0.4s;
transform: rotate(0);
}

.gallery8-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.gallery8-section .galler8-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
margin-bottom: 30px;
}
.gallery8-section .galler8-boxarea:hover .img1::after {
height: 100%;
transition: all 0.4s;
}
.gallery8-section .galler8-boxarea:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.gallery8-section .galler8-boxarea:hover .shape-arrow {
visibility: visible;
opacity: 1;
transition: all 0.6s;
}
.gallery8-section .galler8-boxarea .shape-arrow {
visibility: hidden;
opacity: 0;
transition: all 0.6s;
}
.gallery8-section .galler8-boxarea .shape-arrow .b-shape1 {
position: absolute;
top: 0;
right: 0;
z-index: 2;
transition: all 0.4s;
}
.gallery8-section .galler8-boxarea .shape-arrow .arrow a {
height: 46px;
width: 46px;
text-align: center;
line-height: 46px;
border-radius: 50%;
display: inline-block;
background: var(--ztc-bg-bg-16);
transition: all 0.4s;
color: var(--ztc-text-text-1);
transform: rotate(-45deg);
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
.gallery8-section .galler8-boxarea .shape-arrow .arrow a:hover {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
transform: rotate(0);
}
.gallery8-section .galler8-boxarea .img1 {
position: relative;
overflow: hidden;
border-radius: 8px;
}
.gallery8-section .galler8-boxarea .img1::after {
position: absolute;
content: "";
height: 0;
width: 100%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-15);
opacity: 30%;
transition: all 0.6s;
}
.gallery8-section .galler8-boxarea .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}

.project-inner-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.project-inner-area .projects-inner-box {
position: relative;
z-index: 1;
transition: all 0.4s;
margin-bottom: 30px;
}
.project-inner-area .projects-inner-box:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.project-inner-area .projects-inner-box:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.project-inner-area .projects-inner-box:hover .other-content {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
}
.project-inner-area .projects-inner-box:hover .other-content .tags {
color: var(--ztc-text-text-1);
transition: all 0.4s;
background: rgba(255, 255, 255, 0.2);
}
.project-inner-area .projects-inner-box:hover .other-content .title {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.project-inner-area .projects-inner-box .img1 {
transition: all 0.4s;
border-radius: 8px;
position: relative;
overflow: hidden;
}
.project-inner-area .projects-inner-box .img1 img {
height: 350px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
transition: all 0.4s;
}
.project-inner-area .projects-inner-box .other-content {
position: relative;
z-index: 2;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 10px 60px rgba(165, 165, 165, 0.25);
text-align: center;
padding: 24px;
border-radius: 8px;
margin: -60px 16px 0 16px;
transition: all 0.4s;
}
.project-inner-area .projects-inner-box .other-content .tags {
border-radius: 8px;
background: rgba(21, 95, 255, 0.1);
color: var(--ztc-text-text-4);
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;
padding: 8px 12px;
transition: all 0.4s;
}
.project-inner-area .projects-inner-box .other-content .title {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
display: inline-block;
transition: all 0.4s;
}

.project-inner-details {
position: relative;
z-index: 1;
}
.project-inner-details .service-arrows {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.project-inner-details .service-arrows {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project-inner-details .service-arrows {
margin-top: 30px;
}
}
.project-inner-details .service-arrows .testimonial-arrows {
display: flex;
align-items: center;
}
.project-inner-details .service-arrows .testimonial-arrows .testimonial-prev-arrow-sinner {
position: absolute;
top: 50%;
margin-top: -28px;
z-index: 2;
left: 30px;
}
.project-inner-details .service-arrows .testimonial-arrows .testimonial-next-arrow-sinner {
position: absolute;
top: 50%;
margin-top: -28px;
z-index: 2;
right: 30px;
}
.project-inner-details .service-arrows .testimonial-arrows button {
height: 56px;
width: 56px;
text-align: center;
line-height: 56px;
border-radius: 50%;
border: none;
background: var(--ztc-bg-bg-1);
-webkit-backdrop-filter: blur(2px);
      backdrop-filter: blur(2px);
transition: all 0.4s;
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s20);
}
.project-inner-details .service-arrows .testimonial-arrows button:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
}
.project-inner-details .service-arrows .service-slider-images {
position: relative;
z-index: 1;
}
.project-inner-details .service-arrows .service-slider-images .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.project-inner-details .projects-side-details {
position: sticky;
top: 120px;
transition: all 0.4s;
}
.project-inner-details .projects-side-details .project-post-widget h3 {
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-bold);
line-height: 20px;
}
.project-inner-details .projects-side-details .project-post-widget .search-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.project-inner-details .projects-side-details .project-post-widget .search-area form {
position: relative;
z-index: 1;
}
.project-inner-details .projects-side-details .project-post-widget .search-area form input {
width: 100%;
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-regular);
line-height: 16px;
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 16px;
}
.project-inner-details .projects-side-details .project-post-widget .search-area form input::-moz-placeholder {
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-regular);
line-height: 16px;
opacity: 70%;
}
.project-inner-details .projects-side-details .project-post-widget .search-area form input::placeholder {
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-regular);
line-height: 16px;
opacity: 70%;
}
.project-inner-details .projects-side-details .project-post-widget .search-area form button {
border: none;
outline: none;
height: 52px;
width: 52px;
text-align: center;
line-height: 48px;
border-radius: 0 8px 8px 0;
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
position: absolute;
right: 0;
top: 0;
}
.project-inner-details .projects-side-details .project-post-widget .popular-tags {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.project-inner-details .projects-side-details .project-post-widget .popular-tags ul li {
display: inline-block;
}
.project-inner-details .projects-side-details .project-post-widget .popular-tags ul li a {
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-semibold);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
border-radius: 4px;
padding: 12px 16px;
background: var(--ztc-bg-bg-1);
margin: 16px 6px 0 0;
}
.project-inner-details .projects-side-details .project-post-widget .popular-tags ul li a:hover {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.project-inner-details .projects-side-details .project-post-widget .help-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.project-inner-details .projects-side-details .project-post-widget .help-area h3 {
line-height: 28px;
}
.project-inner-details .projects-side-details .project-post-widget .help-area .btn-area1 a {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
border-radius: 8px;
background: var(--ztc-bg-bg-3);
padding: 10px 16px;
display: inline-block;
transition: all 0.4s;
}
.project-inner-details .projects-side-details .project-post-widget .help-area .btn-area1 a:hover {
background: var(--ztc-bg-bg-2);
transition: all 0.4s;
}
.project-inner-details .projects-side-details .project-post-widget .help-area .btn-area1 a span {
height: 32px;
width: 32px;
text-align: center;
line-height: 32px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: inline-block;
transition: all 0.4s;
margin: 0 4px 0 0;
}
.project-inner-details .projects-side-details .project-post-widget .social-area {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 20px;
}
.project-inner-details .projects-side-details .project-post-widget .social-area ul li {
display: inline-block;
margin: 0 6px 0 0;
}
.project-inner-details .projects-side-details .project-post-widget .social-area ul li:last-child {
margin: 0;
}
.project-inner-details .projects-side-details .project-post-widget .social-area ul li a {
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
color: var(--ztc-text-text-2);
display: inline-block;
font-size: var(--ztc-font-size-font-s20);
}
.project-inner-details .projects-side-details .project-post-widget .social-area ul li a:hover {
background: var(--ztc-bg-bg-3);
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea {
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px 28px;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area {
margin-top: 16px;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area input {
width: 100%;
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;
padding: 20px;
border-radius: 4px;
background: var(--ztc-bg-bg-1);
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area input::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area input::placeholder {
color: var(--ztc-text-text-3);
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;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area textarea {
width: 100%;
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;
padding: 20px;
border-radius: 4px;
background: var(--ztc-bg-bg-1);
height: 120px;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area textarea::-moz-placeholder {
color: var(--ztc-text-text-3);
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;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area textarea::placeholder {
color: var(--ztc-text-text-3);
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;
}
.project-inner-details .projects-side-details .project-post-widget .contact-boxarea .input-area button {
border: none;
outline: none;
}
.project-inner-details .project-main-details {
position: relative;
z-index: 1;
}
.project-inner-details .project-main-details.padding1 {
padding: 0 0 0 40px;
}
@media (max-width: 767px) {
.project-inner-details .project-main-details.padding1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project-inner-details .project-main-details.padding1 {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.project-inner-details .project-main-details.padding1 {
padding: 0;
margin-top: 30px;
}
}
.project-inner-details .project-main-details.padding2 {
padding: 0 40px 0 0;
}
@media (max-width: 767px) {
.project-inner-details .project-main-details.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project-inner-details .project-main-details.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.project-inner-details .project-main-details.padding2 {
padding: 0;
margin-bottom: 30px;
}
}
.project-inner-details .project-main-details h3 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 40px;
}
.project-inner-details .project-main-details .project-located-area {
padding: 24px 0;
border-top: 1px solid var(--ztc-bg-bg-4);
border-bottom: 1px solid var(--ztc-bg-bg-4);
}
@media (max-width: 767px) {
.project-inner-details .project-main-details .project-located-area .details-box {
padding-bottom: 20px;
}
}
.project-inner-details .project-main-details .project-located-area .details-box h4 {
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-bold);
line-height: 20px;
}
.project-inner-details .project-main-details .project-located-area .details-box p {
color: var(--ztc-text-text-3);
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;
}
.project-inner-details .project-main-details .pera {
background: var(--ztc-bg-bg-4);
position: relative;
z-index: 1;
padding: 24px 18px 24px 24px;
position: relative;
z-index: 1;
}
.project-inner-details .project-main-details .pera::after {
position: absolute;
content: "";
height: 100%;
width: 5px;
left: 0;
top: 0;
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
}
@media (max-width: 767px) {
.project-inner-details .project-main-details .img1 {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.project-inner-details .project-main-details .img1 {
margin-bottom: 30px;
}
}
.project-inner-details .project-main-details .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.project-inner-details .project-main-details ul li {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
margin-top: 16px;
}
.project-inner-details .project-main-details ul li img {
margin: 0 6px 0 0;
}

.projects9-section {
position: relative;
z-index: 1;
overflow: hidden;
margin: 0 60px;
}
@media (max-width: 767px) {
.projects9-section {
margin: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.projects9-section {
margin: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.projects9-section {
margin: 0;
}
}
.projects9-section .nav {
display: inline-block;
padding: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.projects9-section .nav {
display: flex;
padding: 0;
justify-content: space-around;
margin-bottom: 40px;
}
}
@media (max-width: 767px) {
.projects9-section .nav {
display: flex;
padding: 0;
justify-content: space-around;
margin-bottom: 40px;
}
}
.projects9-section .nav button.active {
background: var(--ztc-bg-bg-19);
}
.projects9-section .nav button img {
height: 100%;
width: 130px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.projects9-section .tab-content .tab-pane img {
height: 512px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.projects9-section .project9-tabs-area {
padding: 0 0 0 50px;
}
@media (max-width: 767px) {
.projects9-section .project9-tabs-area {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.projects9-section .project9-tabs-area {
padding: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.projects9-section .project9-tabs-area {
padding: 0;
margin-top: 30px;
}
}
.projects9-section .project9-tabs-area .accordion .accordion-item {
border-bottom: 1px solid rgba(0, 8, 20, 0.2);
border-left: none;
border-right: none;
border-top: none;
padding: 0;
}
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-header button {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: bold;
line-height: 24px;
text-transform: capitalize;
background: none;
border: none;
box-shadow: none;
padding: 24px 0;
}
@media (max-width: 767px) {
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-header button {
font-size: var(--ztc-font-size-font-s20);
line-height: 20px;
}
}
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-header button::before {
content: "\f061";
font-family: fontawesome;
position: absolute;
right: 0;
transition: all 0.4s;
}
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-header button::after {
display: none;
}
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-header button.accordion-button:not(.collapsed)::before {
transform: rotate(-45deg);
transition: all 0.4s;
}
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-body {
padding: 0;
}
.projects9-section .project9-tabs-area .accordion .accordion-item .accordion-body p {
color: var(--ztc-text-text-10);
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: 24px;
display: inline-block;
padding: 0 0 24px 0;
}

.project10-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
}
.project10-section .project10-main-slider-area {
position: relative;
z-index: 1;
}
.project10-section .project10-main-slider-area .slick-dots {
display: flex;
justify-content: center;
margin-top: 60px;
}
.project10-section .project10-main-slider-area .slick-dots li {
margin: 0 8px;
}
.project10-section .project10-main-slider-area .slick-dots button {
display: inline-block;
width: 14px;
height: 14px;
padding: 0;
border: none;
border-radius: 100%;
background: var(--ztc-bg-bg-19);
text-indent: -9999px;
border-radius: 50%;
position: relative;
}
.project10-section .project10-main-slider-area .slick-dots button::after {
position: absolute;
content: "";
height: 24px;
width: 24px;
border-radius: 50%;
border: 1px solid var(--ztc-text-text-14);
left: -5px;
top: -5px;
z-index: -1;
visibility: hidden;
opacity: 0;
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .slick-dots li.slick-active button {
background: var(--ztc-bg-bg-19);
}
.project10-section .project10-main-slider-area .slick-dots li.slick-active button::after {
visibility: visible;
opacity: 1;
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box {
position: relative;
z-index: 1;
margin: 0 10px;
}
.project10-section .project10-main-slider-area .project10-main-widget-box.slick-slide.slick-current.slick-active .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box.slick-slide.slick-current.slick-active .content-prjs-area {
visibility: visible;
opacity: 1;
transition: all 0.6s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box:hover .img1 img {
transform: scale(1.1) rotate(-4deg);
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box:hover .content-prjs-area {
visibility: visible;
opacity: 1;
transition: all 0.6s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .img1 {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .img1 img {
height: 400px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
transition: all 0.4s;
border-radius: 8px;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .content-prjs-area {
background: var(--ztc-bg-bg-1);
padding: 30px;
position: absolute;
z-index: 2;
bottom: 30px;
left: 30px;
right: 40px;
border-radius: 8px;
visibility: hidden;
opacity: 0;
transition: all 0.6s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .content-prjs-area span {
color: var(--ztc-text-text-14);
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;
display: inline-block;
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .content-prjs-area a.title {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 28px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .content-prjs-area a.title:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .content-prjs-area .arrow a {
height: 58px;
width: 58px;
text-align: center;
line-height: 58px;
border-radius: 50%;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-19);
color: var(--ztc-text-text-1);
display: inline-block;
font-size: var(--ztc-font-size-font-s20);
transform: rotate(-45deg);
position: absolute;
top: -15px;
right: -15px;
}
.project10-section .project10-main-slider-area .project10-main-widget-box .content-prjs-area .arrow a:hover {
background: var(--ztc-bg-bg-15);
transition: all 0.4s;
transform: rotate(0);
}

/*============= PROEJCTS CSS AREA ENDS ===============*/
/*============= PRICING CSS AREA ===============*/
.pricing1 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-2);
}
.pricing1 .heading1 h5 {
color: var(--ztc-text-text-1);
}
.pricing1 .heading1 h5 img {
filter: brightness(0) invert(1);
}
.pricing1 .heading1 h2 {
color: var(--ztc-text-text-1);
}
.pricing1 .pricing-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
background: rgba(255, 255, 255, 0.1);
padding: 24px;
transition: all 0.4s;
margin-bottom: 30px;
}
.pricing1 .pricing-boxarea.active .btn-area1 .vl-btn1 {
color: var(--ztc-text-text-1);
border: 1px solid var(--ztc-text-text-4);
}
.pricing1 .pricing-boxarea.active .btn-area1 .vl-btn1::after {
width: 100%;
left: 0;
background: var(--ztc-bg-bg-3);
padding: 4px;
border-radius: 8px;
color: var(--ztc-text-text-1);
border: 1px solid var(--ztc-text-text-4);
}
.pricing1 .pricing-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.pricing1 .pricing-boxarea:hover .btn-area1 .vl-btn1 {
color: var(--ztc-text-text-1);
border: 1px solid var(--ztc-text-text-4);
}
.pricing1 .pricing-boxarea:hover .btn-area1 .vl-btn1::after {
width: 100%;
left: 0;
background: var(--ztc-bg-bg-3);
padding: 4px;
border-radius: 8px;
color: var(--ztc-text-text-1);
border: 1px solid var(--ztc-text-text-4);
}
.pricing1 .pricing-boxarea .price-heading {
border-radius: 8px;
background: rgba(255, 255, 255, 0.1);
padding: 32px 40px;
}
.pricing1 .pricing-boxarea .price-heading span {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
.pricing1 .pricing-boxarea .price-heading h2 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 44px;
}
.pricing1 .pricing-boxarea .price-heading p {
color: rgba(255, 255, 255, 0.8);
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;
}
.pricing1 .pricing-boxarea .btn-area1 .vl-btn1 {
width: 100%;
text-align: center;
border: 1px solid var(--ztc-text-text-1);
background: none;
}
.pricing1 .pricing-boxarea ul li {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
margin-top: 20px;
}
.pricing1 .pricing-boxarea ul li img {
margin: 0 4px 0 0;
}

.pricing-inner {
position: relative;
z-index: 1;
overflow: hidden;
}
.pricing-inner .pricing-boxarea {
position: relative;
z-index: 1;
overflow: hidden;
border-radius: 8px;
background: var(--ztc-bg-bg-4);
padding: 24px;
transition: all 0.4s;
margin-bottom: 30px;
}
.pricing-inner .pricing-boxarea.active {
background: var(--ztc-bg-bg-3);
}
.pricing-inner .pricing-boxarea.active .price-heading {
border-radius: 8px;
background: rgba(255, 255, 255, 0.1);
}
.pricing-inner .pricing-boxarea.active .price-heading h2 {
color: var(--ztc-text-text-1);
}
.pricing-inner .pricing-boxarea.active .price-heading p {
color: var(--ztc-text-text-1);
}
.pricing-inner .pricing-boxarea.active .price-heading span {
color: var(--ztc-text-text-1);
}
.pricing-inner .pricing-boxarea.active .btn-area1 .vl-btn1 {
color: var(--ztc-text-text-4) !important;
background: var(--ztc-bg-bg-1);
}
.pricing-inner .pricing-boxarea.active .btn-area1 .vl-btn1:hover {
color: var(--ztc-text-text-1) !important;
}
.pricing-inner .pricing-boxarea.active ul li {
color: var(--ztc-text-text-1);
}
.pricing-inner .pricing-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.pricing-inner .pricing-boxarea .price-heading {
border-radius: 8px;
background: var(--ztc-bg-bg-1);
padding: 32px 40px;
}
.pricing-inner .pricing-boxarea .price-heading span {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
display: inline-block;
transition: all 0.4s;
}
.pricing-inner .pricing-boxarea .price-heading h2 {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 44px;
}
.pricing-inner .pricing-boxarea .price-heading p {
color: var(--ztc-text-text-3);
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;
}
.pricing-inner .pricing-boxarea .btn-area1 .vl-btn1 {
width: 100%;
text-align: center;
}
.pricing-inner .pricing-boxarea ul li {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 18px;
margin-top: 20px;
}
.pricing-inner .pricing-boxarea ul li img {
margin: 0 4px 0 0;
}

.compareplan-section-area {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
}
.compareplan-section-area .toggle-inner input {
position: absolute;
left: 0;
width: 100%;
height: 100%;
margin: 0;
border-radius: 25px;
right: 0;
z-index: 1;
opacity: 0;
cursor: pointer;
}
.compareplan-section-area .custom-toggle {
position: absolute;
height: 20px;
width: 20px;
background-color: var(--ztc-text-text-1);
top: 5px;
left: 35px;
border-radius: 50%;
transition: 300ms all;
}
.compareplan-section-area .toggle-inner .t-month,
.compareplan-section-area .toggle-inner .t-year {
position: absolute;
left: -75px;
top: 2px;
transition: 300ms all;
}
.compareplan-section-area .toggle-inner .t-year {
left: unset;
left: 73px;
opacity: 0.5;
}
.compareplan-section-area .active > .toggle-inner .t-month {
opacity: 0.5;
}
.compareplan-section-area .active > .toggle-inner .t-year {
opacity: 1;
}
.compareplan-section-area .toggle-inner input:checked + span {
left: 5px;
}
.compareplan-section-area .toggle-inner {
width: 60px;
margin: 0 auto;
height: 30px;
border-radius: 25px;
position: relative;
background: var(--ztc-text-text-4);
left: -20px;
}
.compareplan-section-area .t-year h4 {
min-width: 200px;
}
.compareplan-section-area .t-year {
text-align: left;
}
.compareplan-section-area .plan-toggle-wrap1 {
position: absolute;
z-index: 1;
left: 25%;
top: 30%;
right: 71%;
}
@media (max-width: 767px) {
.compareplan-section-area .plan-toggle-wrap1 {
position: relative;
left: 0;
top: 0;
text-align: center;
right: 0;
margin-bottom: 20px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.compareplan-section-area .plan-toggle-wrap1 {
left: 20%;
top: 20%;
right: 0;
}
}
@media only screen and (min-width: 1700px) and (max-width: 1800px) {
.compareplan-section-area .plan-toggle-wrap1 {
right: 56% !important;
}
}
.compareplan-section-area .plan-toggle-wrap1 h4 {
font-size: var(--ztc-font-size-font-s16);
font-weight: var(--ztc-weight-bold);
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
margin-bottom: 0;
}
.compareplan-section-area .plan-toggle-wrap1 h4 span {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
}
.compareplan-section-area .single-pricing-area {
background: var(--ztc-text-text-1);
padding: 32px 40px !important;
position: relative;
margin-bottom: 0;
border: 1px solid var(--ztc-bg-bg-4);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.compareplan-section-area .single-pricing-area {
padding: 20px !important;
}
}
.compareplan-section-area .comparison table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
table-layout: fixed;
}
.compareplan-section-area .comparison td, .compareplan-section-area .comparison th {
text-align: center;
}
.compareplan-section-area .comparison tbody tr:nth-child(odd) {
display: none;
}
.compareplan-section-area .comparison .compare-row td {
padding: 25px 0;
border-top: 1px solid #E8EFFF;
}
.compareplan-section-area .comparison tr td:first-child {
text-align: left;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
line-height: var(--ztc-font-size-font-s20);
font-weight: var(--ztc-weight-bold);
color: var(--ztc-text-text-2);
padding: 25px 0;
border-top: 1px solid #E8EFFF;
}
.compareplan-section-area .comparison .tl2 {
font-family: var(--ztc-family-font1);
line-height: var(--ztc-font-size-font-s24);
font-weight: var(--ztc-weight-bold);
color: var(--ztc-text-text-2);
font-size: var(--ztc-font-size-font-s24);
}
.compareplan-section-area .comparison .tl2 span {
display: inline-block;
font-size: var(--ztc-font-size-font-s18);
line-height: var(--ztc-font-size-font-s18);
font-weight: var(--ztc-weight-medium);
color: var(--ztc-text-text-3);
font-family: var(--ztc-family-font1);
margin-top: 32px;
position: absolute;
left: 6%;
top: 55px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.compareplan-section-area .comparison .tl2 span {
display: none;
}
}
.compareplan-section-area .comparison .qbo {
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-weight: var(--ztc-weight-bold);
color: var(--ztc-text-text-2);
line-height: var(--ztc-font-size-font-s20);
padding: 0 !important;
}
.compareplan-section-area th.price-info.hide-mobile {
padding-bottom: 40px;
}
.compareplan-section-area .comparison .price-now span {
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
line-height: var(--ztc-font-size-font-s44);
font-weight: var(--ztc-weight-bold);
color: var(--ztc-text-text-2);
transition: all 0.4s;
display: inline-block;
margin-top: 20px;
margin-bottom: 24px;
}
@media (max-width: 767px) {
.compareplan-section-area .comparison {
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-weight: var(--ztc-weight-bold);
color: var(--ztc-text-text-3);
transition: all 0.4s;
padding: 20px !important;
background: var(--ztc-text-text-1);
}
.compareplan-section-area th.price-info.hide-mobile {
padding-bottom: 20px;
}
.compareplan-section-area .comparison .qbo {
background: none;
padding: 10px !important;
}
.compareplan-section-area .comparison td:first-child, .compareplan-section-area .comparison th:first-child {
display: none;
}
.compareplan-section-area .comparison tbody tr:nth-child(odd) {
display: table-row;
}
.compareplan-section-area .comparison .row {
background: #fff;
}
.compareplan-section-area .comparison td, .compareplan-section-area .comparison th {
border: 1px solid #FAE7E8;
padding: 20px 0;
}
}

.coupons-section {
position: relative;
z-index: 1;
overflow: hidden;
}

.coupons-boxarea {
position: relative;
z-index: 1;
text-align: center;
background: var(--ztc-bg-bg-1);
border: 1px solid #DBDBDB;
border-radius: 8px;
transition: all 0.4s;
margin-bottom: 30px;
}
.coupons-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.coupons-boxarea .logo-content {
background: var(--ztc-bg-bg-14);
padding: 30px;
}
.coupons-boxarea .logo-content .logo img {
width: 210px;
height: 44px;
}
.coupons-boxarea .logo-content .title {
color: var(--ztc-text-text-9);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
.coupons-boxarea .logo-content .title:hover {
color: var(--ztc-text-text-11);
transition: all 0.4s;
}
.coupons-boxarea .pricing-text {
padding: 30px;
}
.coupons-boxarea .pricing-text .off-btn {
color: var(--ztc-text-text-9);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s32);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 32px;
letter-spacing: 0.64px;
text-transform: uppercase;
padding: 12px 16px;
border-radius: 8px;
border: 1px solid var(--ztc-text-text-9);
display: inline-block;
transition: all 0.4s;
}
.coupons-boxarea .pricing-text .off-btn:hover {
background: var(--ztc-bg-bg-13);
color: var(--ztc-text-text-1);
border: 1px solid var(--ztc-text-text-11);
transition: all 0.4s;
}

.pricing10-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
}
.pricing10-section .pricing10-boxarea-widget {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-1);
padding: 30px;
border-radius: 8px;
margin-bottom: 30px;
}
.pricing10-section .pricing10-boxarea-widget .pricing-heading h5 {
color: var(--ztc-text-text-12);
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; /* 100% */
}
.pricing10-section .pricing10-boxarea-widget .pricing-heading h2 {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-semibold);
line-height: 54px;
}
.pricing10-section .pricing10-boxarea-widget .pricing-heading h2 span {
color: var(--ztc-text-text-12);
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;
display: inline-block;
}
.pricing10-section .pricing10-boxarea-widget .pricing-heading p {
color: var(--ztc-text-text-10);
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: 24px;
}
@media (max-width: 767px) {
.pricing10-section .pricing10-boxarea-widget .pricing-list {
padding-top: 20px;
}
}
.pricing10-section .pricing10-boxarea-widget .pricing-list ul li {
color: var(--ztc-text-text-12);
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;
padding-bottom: 20px;
}
.pricing10-section .pricing10-boxarea-widget .pricing-list ul li img {
margin: 0 4px 0 0;
}
.pricing10-section .pricing10-boxarea-widget .pricing-list ul li:nth-last-child(1) {
padding-bottom: 0;
}

/*============= PRICING CSS AREA ENDS ===============*/
/*============= CHOOSE CSS AREA STARTS ===============*/
.chosse-section-area {
position: relative;
z-index: 1;
overflow: hidden;
}
.chosse-section-area .heading1 .chosse-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-4);
border-radius: 8px;
transition: all 0.4s;
padding: 24px;
text-align: center;
margin-top: 30px;
}
.chosse-section-area .heading1 .chosse-boxarea:hover {
border-radius: 8px;
background: var(--ztc-bg-bg-1);
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.09);
transition: all 0.4s;
}
.chosse-section-area .heading1 .chosse-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
}
.chosse-section-area .heading1 .chosse-boxarea .icons {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
border-radius: 50%;
background: var(--ztc-bg-bg-3);
display: inline-block;
transition: all 0.4s;
}
.chosse-section-area .heading1 .chosse-boxarea .content-area a {
color: var(--ztc-text-text-2);
text-align: center;
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: 20px;
display: inline-block;
transition: all 0.4s;
}
.chosse-section-area .heading1 .chosse-boxarea .content-area a:hover {
color: var(--ztc-text-text-4);
transition: all 0.4s;
}
.chosse-section-area .heading1 .chosse-boxarea .content-area p {
color: var(--ztc-text-text-3);
text-align: center;
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: 24px;
}
.chosse-section-area .choose-images-area {
position: relative;
left: -50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.chosse-section-area .choose-images-area {
left: 0;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.chosse-section-area .choose-images-area {
left: 0;
margin-top: 30px;
}
}
@media (max-width: 767px) {
.chosse-section-area .choose-images-area {
left: 0;
margin-top: 30px;
}
}
.chosse-section-area .choose-images-area .img1 {
position: relative;
z-index: -1;
left: -50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.chosse-section-area .choose-images-area .img1 {
left: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.chosse-section-area .choose-images-area .img1 {
left: 0;
}
}
@media (max-width: 767px) {
.chosse-section-area .choose-images-area .img1 {
left: 0;
}
}
.chosse-section-area .choose-images-area .img1 img {
height: 100%;
width: 300px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 8px 8px 100px;
max-width: 300px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.chosse-section-area .choose-images-area .img1 img {
width: 100%;
max-width: 100%;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.chosse-section-area .choose-images-area .img1 img {
width: 100%;
max-width: 100%;
height: 400px;
}
}
@media (max-width: 767px) {
.chosse-section-area .choose-images-area .img1 img {
width: 100%;
max-width: 100%;
border-radius: 8px;
}
}
.chosse-section-area .choose-images-area .img2 img {
height: 100%;
width: 300px;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px 100px 8px 8px;
max-width: 300px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.chosse-section-area .choose-images-area .img2 img {
width: 100%;
max-width: 100%;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.chosse-section-area .choose-images-area .img2 img {
width: 100%;
max-width: 100%;
height: 400px;
}
}
@media (max-width: 767px) {
.chosse-section-area .choose-images-area .img2 img {
width: 100%;
max-width: 100%;
border-radius: 8px;
margin-top: 30px;
}
}

.choose3 {
position: relative;
z-index: 1;
overflow: hidden;
}
@media (max-width: 767px) {
.choose3 .heading3 {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose3 .heading3 {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose3 .heading3 {
margin-bottom: 30px;
}
}
.choose3 .counter-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-8);
border-radius: 8px;
padding: 34px;
text-align: center;
transition: all 0.4s;
}
.choose3 .counter-boxarea:hover {
transform: translateY(-10px);
transition: all 0.4s;
}
.choose3 .counter-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
}
.choose3 .counter-boxarea .icons {
height: 80px;
width: 80px;
text-align: center;
line-height: 80px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: #F4E2DC;
}
.choose3 .counter-boxarea h2 {
color: var(--ztc-text-text-2);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s44);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 44px;
}
.choose3 .counter-boxarea p {
color: var(--ztc-text-text-3);
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;
}

.choose4 {
position: relative;
z-index: 1;
overflow: hidden;
}
.choose4 .chooseheader .about-boxarea {
position: relative;
z-index: 1;
padding: 24px 0 24px;
}
.choose4 .chooseheader .about-boxarea.border1 {
border-bottom: 1px solid var(--ztc-bg-bg-10);
}
.choose4 .chooseheader .about-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
background: var(--ztc-bg-bg-9);
}
.choose4 .chooseheader .about-boxarea .icons {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
border-radius: 50%;
transition: all 0.4s;
background: var(--ztc-bg-bg-10);
display: inline-block;
position: absolute;
}
.choose4 .chooseheader .about-boxarea .textarea {
padding-left: 76px;
}
.choose4 .chooseheader .about-boxarea .textarea a {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px; /* 100% */
}
.choose4 .choose-images-area {
position: relative;
z-index: 1;
}
.choose4 .choose-images-area .choose-img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.choose4 .choose-images-area .choose-img1 .arrow-circle a {
height: 160px;
width: 160px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
background: var(--ztc-bg-bg-9);
position: absolute;
bottom: 70px;
left: -25%;
z-index: 1;
padding: 10px;
}
@media (max-width: 767px) {
.choose4 .choose-images-area .choose-img1 .arrow-circle a {
bottom: 0;
top: 50%;
margin-top: -80px;
}
}
.choose4 .choose-images-area .choose-img1 .arrow-circle a .arrow1 {
position: absolute;
top: 41%;
left: 40%;
height: 37px;
width: 37px;
-o-object-fit: contain;
 object-fit: contain;
}
.choose4 .choose-images-area .choose-img1 .arrow-circle a .elements20 {
position: absolute;
top: 6px;
left: 6px;
}

.choose5 {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-2);
}
.choose5 .heading5 h5 {
border-radius: 8px;
background: rgba(255, 255, 255, 0.2);
color: var(--ztc-text-text-1);
}
.choose5 .heading5 h2 {
color: var(--ztc-text-text-1);
}
.choose5 .others-widget-area {
position: relative;
}
.choose5 .others-widget-area .card-boxarea:hover h3 {
transform: rotateY(360deg);
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea h3 {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 60px;
letter-spacing: -0.24px;
display: inline-block;
transition: all 0.4s;
border-radius: 50%;
height: 60px;
width: 60px;
background: var(--ztc-bg-bg-11);
}
.choose5 .others-widget-area .card-boxarea .content-area {
background: #3F3D3D;
padding: 28px;
border-radius: 4px;
text-align: center;
margin: 0 40px 0 0;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .card-boxarea .content-area {
margin: 0;
}
}
.choose5 .others-widget-area .card-boxarea .content-area:hover::after {
width: 100%;
left: 0;
top: 0;
transition: all 0.4s;
visibility: visible;
opacity: 1;
}
.choose5 .others-widget-area .card-boxarea .content-area:hover a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea .content-area:hover p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
opacity: 80%;
}
.choose5 .others-widget-area .card-boxarea .content-area::after {
position: absolute;
content: "";
height: 100%;
width: 10px;
left: 50%;
transition: all 0.4s;
top: 0;
background: var(--ztc-bg-bg-11);
z-index: -1;
border-radius: 8px;
visibility: hidden;
opacity: 0;
}
.choose5 .others-widget-area .card-boxarea .content-area a {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea .content-area p {
color: var(--ztc-text-text-1);
text-align: center;
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: 26px; /* 162.5% */
letter-spacing: 0.16px;
opacity: 0.8;
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea .content-area2 {
background: #3F3D3D;
padding: 28px;
border-radius: 4px;
text-align: center;
margin: 0 0 0 40px;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .card-boxarea .content-area2 {
margin: 0;
}
}
.choose5 .others-widget-area .card-boxarea .content-area2:hover::after {
width: 100%;
left: 0;
top: 0;
transition: all 0.4s;
visibility: visible;
opacity: 1;
}
.choose5 .others-widget-area .card-boxarea .content-area2:hover a {
color: var(--ztc-text-text-1);
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea .content-area2:hover p {
color: var(--ztc-text-text-1);
transition: all 0.4s;
opacity: 80%;
}
.choose5 .others-widget-area .card-boxarea .content-area2::after {
position: absolute;
content: "";
height: 100%;
width: 10px;
left: 50%;
transition: all 0.4s;
top: 0;
background: var(--ztc-bg-bg-11);
z-index: -1;
border-radius: 8px;
visibility: hidden;
opacity: 0;
}
.choose5 .others-widget-area .card-boxarea .content-area2 a {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
display: inline-block;
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea .content-area2 p {
color: var(--ztc-text-text-1);
text-align: center;
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: 26px; /* 162.5% */
letter-spacing: 0.16px;
opacity: 0.8;
transition: all 0.4s;
}
.choose5 .others-widget-area .card-boxarea.box1 h3 {
position: relative;
left: -75px;
margin-bottom: 20px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .card-boxarea.box1 h3 {
left: 0;
}
}
.choose5 .others-widget-area .card-boxarea.box2 h3 {
position: relative;
left: -73px;
margin-top: 13px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .card-boxarea.box2 h3 {
left: 0;
}
}
.choose5 .others-widget-area .card-boxarea.box3 h3 {
position: relative;
left: 74px;
margin-top: -33px;
margin-bottom: 16px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .card-boxarea.box3 h3 {
left: 0;
}
}
.choose5 .others-widget-area .card-boxarea.box4 h3 {
position: relative;
left: 74px;
margin-top: 16px;
margin-bottom: -16px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .card-boxarea.box4 h3 {
left: 0;
}
}
.choose5 .others-widget-area .images {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .images {
margin-top: 30px;
margin-bottom: 30px;
}
}
.choose5 .others-widget-area .images .elements12 {
position: absolute;
top: -10px;
left: -100px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .images .elements12 {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose5 .others-widget-area .images .elements12 {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose5 .others-widget-area .images .elements12 {
display: none;
}
}
.choose5 .others-widget-area .images .elements13 {
position: absolute;
bottom: -10px;
left: -100px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .images .elements13 {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose5 .others-widget-area .images .elements13 {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose5 .others-widget-area .images .elements13 {
display: none;
}
}
.choose5 .others-widget-area .images .elements14 {
position: absolute;
top: -10px;
right: -100px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .images .elements14 {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose5 .others-widget-area .images .elements14 {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose5 .others-widget-area .images .elements14 {
display: none;
}
}
.choose5 .others-widget-area .images .elements15 {
position: absolute;
bottom: -10px;
right: -100px;
}
@media (max-width: 767px) {
.choose5 .others-widget-area .images .elements15 {
display: none;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose5 .others-widget-area .images .elements15 {
display: none;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose5 .others-widget-area .images .elements15 {
display: none;
}
}
.choose5 .others-widget-area .images .img1 {
position: relative;
z-index: 1;
background: #272525;
padding: 16px;
border-radius: 50%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose5 .others-widget-area .images .img1 {
height: 400px;
width: 400px;
border-radius: 50%;
margin: 0 auto;
}
}
.choose5 .others-widget-area .images .img1 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 50%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose5 .others-widget-area .images .img1 img {
height: 400px;
width: 400px;
border-radius: 50%;
}
}

.choose7-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
}
.choose7-section .choose7-heading {
padding: 0 40px 0 0;
}
@media (max-width: 767px) {
.choose7-section .choose7-heading {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose7-section .choose7-heading {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose7-section .choose7-heading {
padding: 0;
margin-bottom: 30px;
}
}
.choose7-section .choose7-heading .choose7-widget {
position: relative;
z-index: 1;
}
.choose7-section .choose7-heading .choose7-widget .icons {
height: 70px;
width: 70px;
text-align: center;
line-height: 70px;
border-radius: 50%;
background: var(--ztc-bg-bg-1);
display: inline-block;
transition: all 0.4s;
position: absolute;
}
.choose7-section .choose7-heading .choose7-widget .content {
padding-left: 90px;
}
.choose7-section .choose7-heading .choose7-widget .content a {
color: var(--ztc-text-text-9);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
letter-spacing: 0.4px;
display: inline-block;
transition: all 0.4s;
}
.choose7-section .choose7-images-area {
position: relative;
z-index: 1;
}
.choose7-section .choose7-images-area .cirle-progress {
width: 180px;
height: 180px;
border-radius: 50%;
background: var(--ztc-bg-bg-12);
text-align: center;
line-height: 172px;
position: absolute;
z-index: 2;
right: 60%;
top: 25%;
}
@media (max-width: 767px) {
.choose7-section .choose7-images-area .cirle-progress {
right: 50%;
top: 50%;
margin-right: -90px;
margin-top: -90px;
}
}
.choose7-section .choose7-images-area .cirle-progress svg {
position: absolute;
left: 50%;
z-index: 2;
top: 50%;
margin-top: -34px;
margin-left: -34px;
}
.choose7-section .choose7-images-area .img1 img {
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose7-section .choose7-images-area .img1 img {
width: 80%;
height: 400px;
-o-object-fit: cover;
   object-fit: cover;
}
}
.choose7-section .choose7-images-area .img2 {
position: relative;
z-index: 1;
margin-top: -140px;
}
@media (max-width: 767px) {
.choose7-section .choose7-images-area .img2 {
margin-top: 30px;
}
}
.choose7-section .choose7-images-area .img2 img {
border-radius: 8px;
padding: 6px;
background: var(--ztc-bg-bg-1);
}
@media (max-width: 767px) {
.choose7-section .choose7-images-area .img2 img {
width: 100%;
height: 100%;
-o-object-fit: cover;
   object-fit: cover;
}
}

.choose8-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-17);
}
.choose8-section .img1 img {
height: 100%;
width: 100%;
overflow: hidden;
transition: all 0.4s;
border-radius: 8px;
-o-object-fit: cover;
 object-fit: cover;
}
@media (max-width: 767px) {
.choose8-section .img1 img {
height: 250px;
margin-bottom: 30px;
-o-object-fit: cover;
   object-fit: cover;
}
}
.choose8-section .choose-headig8 {
padding: 0 0 0 60px;
}
@media (max-width: 767px) {
.choose8-section .choose-headig8 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose8-section .choose-headig8 {
padding: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose8-section .choose-headig8 {
padding: 0 0 0 0;
}
}
.choose8-section .choose-headig8 .list li {
color: var(--ztc-text-text-12);
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;
margin-top: 28px;
}
.choose8-section .choose-headig8 .list li svg {
margin: -3px 4px 0 0;
}

.choose-about-area {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-2);
}
.choose-about-area .heading1 h5 {
color: var(--ztc-text-text-1);
}
.choose-about-area .heading1 h5 img {
filter: brightness(0) invert(1);
}
.choose-about-area .heading1 h2 {
color: var(--ztc-text-text-1);
}
.choose-about-area .history-btns-area {
position: relative;
z-index: 1;
}
.choose-about-area .history-btns-area ul {
display: block;
text-align: center;
justify-content: center;
}
.choose-about-area .history-btns-area ul li {
display: inline-block;
margin: 0 30px 0 0;
}
.choose-about-area .history-btns-area ul li:nth-last-child(1) {
margin: 0;
}
@media (max-width: 767px) {
.choose-about-area .history-btns-area ul li {
margin: 0 0 10px 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose-about-area .history-btns-area ul li {
margin: 0 0 10px 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose-about-area .history-btns-area ul li {
margin: 0 0 10px 0;
}
}
.choose-about-area .history-btns-area ul li button {
color: var(--ztc-text-text-1);
text-align: center;
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s16);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 16px;
display: inline-block;
transition: all 0.4s;
border-radius: 8px;
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(255, 255, 255, 0.1);
padding: 16px 40px;
}
.choose-about-area .history-btns-area ul li button.active {
background: var(--ztc-bg-bg-3);
transition: all 0.4s;
}
.choose-about-area .history-btns-area .tab-content .tab-pane {
position: relative;
z-index: 1;
top: 120px;
transition: all 0.4s;
}
.choose-about-area .history-btns-area .tab-content .tab-pane.fade.show.active {
top: 0;
transition: all 0.4s;
}
.choose-about-area .history-btns-area .tab-content .tab-pane .img1 img {
height: 396px;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
.choose-about-area .history-btns-area .tab-content .tab-pane .history-heading {
border-radius: 8px;
background: rgba(255, 255, 255, 0.1);
position: relative;
z-index: 1;
padding: 48px 40px;
}
@media (max-width: 767px) {
.choose-about-area .history-btns-area .tab-content .tab-pane .history-heading {
padding: 24px;
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose-about-area .history-btns-area .tab-content .tab-pane .history-heading {
margin-top: 30px;
}
}
.choose-about-area .history-btns-area .tab-content .tab-pane .history-heading h3 {
color: var(--ztc-text-text-1);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s28);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 32px;
}
.choose-about-area .history-btns-area .tab-content .tab-pane .history-heading p {
color: rgba(255, 255, 255, 0.8);
}

.choose9-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-15);
}
@media (max-width: 767px) {
.choose9-section .heading8 {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose9-section .heading8 {
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose9-section .heading8 {
margin-bottom: 30px;
}
}
.choose9-section .brand-box {
background: var(--ztc-bg-bg-1);
transition: all 0.4s;
text-align: center;
padding: 40px;
border-radius: 8px;
margin-bottom: 30px;
border: 1px solid var(--ztc-bg-bg-1);
}
.choose9-section .brand-box:hover {
border: 1px solid var(--ztc-text-text-14);
transition: all 0.4s;
transform: translateY(-10px);
}
.choose9-section .brand-box img {
height: 48px;
width: 185px;
-o-object-fit: contain;
 object-fit: contain;
}

.choose10-section {
position: relative;
z-index: 1;
overflow: hidden;
}
.choose10-section .heading10 {
padding: 0 50px 0 0;
}
@media (max-width: 767px) {
.choose10-section .heading10 {
padding: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose10-section .heading10 {
padding: 0;
}
}
.choose10-section .choose10-all-boxes-area {
position: relative;
z-index: 1;
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea {
position: relative;
z-index: 1;
background: var(--ztc-bg-bg-14);
border-radius: 8px;
padding: 24px;
transition: all 0.4s;
}
@media (max-width: 767px) {
.choose10-section .choose10-all-boxes-area .choose10-boxarea {
margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.choose10-section .choose10-all-boxes-area .choose10-boxarea {
margin-top: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.choose10-section .choose10-all-boxes-area .choose10-boxarea {
margin-top: 30px;
}
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea:hover {
background: var(--ztc-bg-bg-1);
box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.08);
transition: all 0.4s;
transform: translateY(-5px);
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea .icons {
height: 60px;
width: 60px;
text-align: center;
line-height: 60px;
border-radius: 50%;
display: inline-block;
transition: all 0.4s;
background: var(--ztc-bg-bg-1);
position: relative;
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea .icons:after {
position: absolute;
content: "";
height: 100%;
width: 100%;
left: 0;
top: 0;
background: var(--ztc-bg-bg-19);
top: 2px;
transition: all 0.4s;
border-radius: 50%;
z-index: -1;
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea .icons img {
transition: all 0.4s;
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea .content1-area a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s20);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 20px;
letter-spacing: 0.4px;
display: inline-block;
transition: all 0.4s;
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea .content1-area a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.choose10-section .choose10-all-boxes-area .choose10-boxarea .content1-area p {
color: var(--ztc-text-text-10);
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: 24px;
transition: all 0.4s;
}

/*============= CHOOSE CSS AREA ENDS ===============*/
/*============= SKILLS CSS AREA STARTS ===============*/
.skills2 {
position: relative;
z-index: 1;
overflow: hidden;
}
.skills2 .heading2 {
padding: 0 50px 0 0;
}
@media (max-width: 767px) {
.skills2 .heading2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.skills2 .heading2 {
padding: 0;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.skills2 .heading2 {
padding: 0;
margin-bottom: 30px;
}
}
.skills2 .heading2 .skills-section .skill {
margin-top: 24px;
}
.skills2 .heading2 .skills-section .skill .skill-header {
display: flex;
justify-content: space-between;
}
.skills2 .heading2 .skills-section .skill .skill-header span {
color: var(--ztc-text-text-2);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s18);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 18px;
margin-bottom: 15px;
}
.skills2 .heading2 .skills-section .skill .progress-bar {
width: 100%;
background: rgba(15, 13, 13, 0.1);
height: 8px;
border-radius: 4px;
overflow: hidden;
}
.skills2 .heading2 .skills-section .skill .progress-bar .progress-fill {
height: 100%;
background-color: #00a6e4;
transition: width 1s ease-in-out;
}
.skills2 .skills-images-area {
position: relative;
z-index: 1;
}
.skills2 .skills-images-area .img1 img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.skills2 .skills-images-area .img1 img {
height: 400px;
}
}

.skills9-section {
position: relative;
z-index: 1;
overflow: hidden;
background: var(--ztc-bg-bg-14);
margin: 0 60px;
border-radius: 10px;
}
@media (max-width: 767px) {
.skills9-section {
margin: 0;
border-radius: 0;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.skills9-section {
margin: 0;
border-radius: 0;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.skills9-section {
margin: 0;
border-radius: 0;
}
}
.skills9-section .skills9-boxarea {
position: relative;
z-index: 1;
}
.skills9-section .skills9-boxarea:hover .icons {
transform: rotateY(-180deg);
transition: all 0.4s;
}
.skills9-section .skills9-boxarea .icons {
position: absolute;
transition: all 0.4s;
}
.skills9-section .skills9-boxarea .text-area {
position: relative;
padding-left: 60px;
}
.skills9-section .skills9-boxarea .text-area a {
color: var(--ztc-text-text-12);
font-family: var(--ztc-family-font1);
font-size: var(--ztc-font-size-font-s24);
font-style: normal;
font-weight: var(--ztc-weight-bold);
line-height: 24px;
text-transform: capitalize;
display: inline-block;
transition: all 0.4s;
}
@media (max-width: 767px) {
.skills9-section .skills9-boxarea .text-area a {
font-size: var(--ztc-font-size-font-s20);
line-height: 20px;
}
}
.skills9-section .skills9-boxarea .text-area a:hover {
color: var(--ztc-text-text-14);
transition: all 0.4s;
}
.skills9-section .skills9-boxarea .text-area p {
color: var(--ztc-text-text-10);
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: 24px;
}
@media (max-width: 767px) {
.skills9-section .skills-iamges-area {
margin-top: 30px;
margin-bottom: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.skills9-section .skills-iamges-area {
margin-top: 30px;
margin-bottom: 30px;
}
}
.skills9-section .skills-iamges-area img {
height: 100%;
width: 100%;
-o-object-fit: cover;
 object-fit: cover;
border-radius: 8px;
}

/*============= SKILLS CSS AREA ENDS ===============*//*# sourceMappingURL=main.css.map */