@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&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(0) translateY(0) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(0) translateY(0) translateZ(0) scale(1.5); opacity: 1; } } .pulse-border { position: relative; animation-name: pulse-border; animation-duration: 1500ms; animation-iteration-count: infinite; animation-direction: alternate; } @keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translatex(-100%); } } @keyframes marquee-2 { 0% { transform: translateX(-100%); } 100% { transform: translatex(0); } } .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; } .reveal { position: relative; display: -ms-inline-flexbox; visibility: hidden; overflow: hidden; } .reveal img { height: 100%; width: 100%; display: inline-block; -o-object-fit: cover; object-fit: cover; transform-origin: left; } .bg-w { background: #fff !important; } .bg1 { background: #F6F8FA !important; } :root { --ztc-text-text-1: #fff; --ztc-text-text-2: #03071E; --ztc-text-text-3: #6C757D; --ztc-text-text-4: #FFAF01; --ztc-text-text-5: #FFAF01; --ztc-text-text-6: #FF6610; --ztc-text-text-7: #FFD61E; --ztc-text-text-8: #1063FF; --ztc-bg-bg-1: #fff; --ztc-bg-bg-2: #03071E; --ztc-bg-bg-3: #FFAF01; --ztc-bg-bg-4: #F4F9E6; --ztc-bg-bg-5: #efb30e; --ztc-bg-bg-6: #FF6610; --ztc-bg-bg-7: #FFD61E; --ztc-bg-bg-8: #1063FF; --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: 'Figtree', sans-serif; --ztc-family-font2: 'Figtree', sans-serif; }.header-btn1 { color: #ffffff; 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; background: var(--ztc-bg-bg-3); padding: 16px 20px; position: relative; z-index: 1; } .header-btn1 i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .header-btn1::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .header-btn1:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .header-btn1:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .header-btn1:hover i { transform: rotate(0); transition: all 0.4s; } .header-btn2-h2 { 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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-5); padding: 16px 20px; position: relative; z-index: 1; } .header-btn2-h2 i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .header-btn2-h2::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .header-btn2-h2:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .header-btn2-h2:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .header-btn2-h2:hover i { transform: rotate(0); transition: all 0.4s; } .header-btn2-h3 { 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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-6); padding: 8px 8px 8px 16px; position: relative; z-index: 1; border-radius: 25px; } .header-btn2-h3 i { transform: rotate(-45deg); transition: all 0.4s; } .header-btn2-h3 span { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; color: var(--ztc-text-text-2); transition: all 0.4s; display: inline-block; background: #fff; margin-left: 12px; } .header-btn2-h3::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .header-btn2-h3:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .header-btn2-h3:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .header-btn2-h3:hover i { transform: rotate(0); transition: all 0.4s; } .header-btn2-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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-7); padding: 8px 8px 8px 16px; position: relative; z-index: 1; border-radius: 25px; } .header-btn2-h4 i { transform: rotate(-45deg); transition: all 0.4s; } .header-btn2-h4 span { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; color: var(--ztc-text-text-2); transition: all 0.4s; display: inline-block; background: #fff; margin-left: 12px; } .header-btn2-h4::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .header-btn2-h4:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .header-btn2-h4:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .header-btn2-h4:hover i { transform: rotate(0); transition: all 0.4s; } .header-btn2-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-bold); line-height: 18px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-8); padding: 16px; position: relative; z-index: 1; border-radius: 25px; } .header-btn2-h5 i { transform: rotate(-45deg); transition: all 0.4s; } .header-btn2-h5::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .header-btn2-h5:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .header-btn2-h5:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .header-btn2-h5:hover i { transform: rotate(0); transition: all 0.4s; } .heading1 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; display: inline-block; } .heading1 h5 img { margin: -5px 4px 0 0; height: 20px; width: 20px; display: inline-block !important; } .heading1 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: 85px; } @media (max-width: 767px) { .heading1 h2 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading1 h3 { 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; } @media (max-width: 767px) { .heading1 h3 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading1 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-regular); line-height: 28px; opacity: 80%; } .heading2 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; display: inline-block; } .heading2 h5 img { margin: -5px 4px 0 0; height: 20px; width: 20px; display: inline-block !important; } .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; } @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-s16); font-style: normal; font-weight: var(--ztc-weight-regular); line-height: 28px; } .heading3 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; display: inline-block; } .heading3 h5 img { margin: -5px 4px 0 0; height: 20px; width: 20px !important; display: inline-block !important; } .heading3 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: 85px; } @media (max-width: 767px) { .heading3 h2 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading3 h3 { 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; } @media (max-width: 767px) { .heading3 h3 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading3 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-regular); line-height: 28px; opacity: 80%; } .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-semibold); line-height: 18px; display: inline-block; } .heading4 h5 img { margin: -5px 4px 0 0; height: 20px; width: 20px; display: inline-block !important; } .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; } @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-s16); font-style: normal; font-weight: var(--ztc-weight-regular); line-height: 28px; } .heading5 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-semibold); line-height: 18px; display: inline-block; } .heading5 h5 img { margin: -5px 4px 0 0; height: 20px; width: 20px; display: inline-block !important; } .heading5 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: 85px; } @media (max-width: 767px) { .heading5 h1 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading5 h3 { 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; } @media (max-width: 767px) { .heading5 h3 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading5 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-regular); line-height: 28px; opacity: 80%; } .heading6 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; display: inline-block; } .heading6 h5 img { margin: -5px 4px 0 0; height: 20px; width: 20px; display: inline-block !important; } .heading6 h1 { color: var(--ztc-text-text-1); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s56); font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 64px; } @media (max-width: 767px) { .heading6 h1 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading6 h3 { 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; } @media (max-width: 767px) { .heading6 h3 { font-size: var(--ztc-font-size-font-s36); line-height: 44px; } } .heading6 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-regular); line-height: 28px; opacity: 80%; } /*============= COMMON CSS AREA ENDS===============*/ .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; } } .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; } } /*============= ABOUT CSS AREA ===============*/ .about1-section-area { position: relative; z-index: 1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area { padding-top: 50px; } } .about1-section-area .about-header .images-area { width: 420px; } @media (max-width: 767px) { .about1-section-area .about-header .images-area { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area .about-header .images-area { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } .about1-section-area .about-header .images-area .text p { 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-top: 16px; text-align: center; } .about1-section-area .sucess-text { position: relative; z-index: 1; display: inline-block; } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area .sucess-text { display: block; } } .about1-section-area .sucess-text .counter-text { background: var(--4th-Color, #FFAF01); padding: 30px; display: inline-block; text-align: center; position: absolute; bottom: 35px; left: -200px; } @media (max-width: 767px) { .about1-section-area .sucess-text .counter-text { position: relative; width: 100%; left: 0; bottom: 0; margin-top: 20px; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area .sucess-text .counter-text { position: relative; width: 100%; left: 0; bottom: 0; margin-top: 20px; margin-bottom: 30px; } } .about1-section-area .sucess-text .counter-text h2 { color: var(--ztc-text-text-2); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s50); font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 50px; } .about1-section-area .sucess-text .counter-text p { color: var(--Text-Color, #03071E); 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; } .about1-section-area .sucess-text .images-area2 { position: relative; left: -40px; } @media (max-width: 767px) { .about1-section-area .sucess-text .images-area2 { left: 0; margin-top: 30px; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area .sucess-text .images-area2 { left: 0; margin-top: 30px; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area .sucess-text .images-area2 .img2 img { width: 100%; } } .about1-section-area .sucess-text .images-area2 p { 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-top: 16px; text-align: center; } .about1-section-area .peragraph .images-area .img1 img { width: 300px; height: 320px; } @media (max-width: 767px) { .about1-section-area .peragraph .images-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about1-section-area .peragraph .images-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } .about1-section-area .peragraph .images-area .text p { 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-top: 16px; text-align: center; } .about2-sectio-area { position: relative; z-index: 1; } @media (max-width: 767px) { .about2-sectio-area { margin-top: -50px; } } .about2-sectio-area .about-images-area { position: relative; z-index: 1; } .about2-sectio-area .about-images-area .img1 img { width: 100px; height: 320px; -o-object-fit: cover; object-fit: cover; } .about2-sectio-area .about-images-area .img2 img { height: 582px !important; -o-object-fit: cover; object-fit: cover; width: 100% !important; } .about2-sectio-area .about-images-area .customer-area { background: var(--ztc-text-text-5); padding: 16px; display: inline-block; transition: all 0.4s; text-align: center; position: absolute; bottom: 32px; z-index: 1; } .about2-sectio-area .about-images-area .customer-area img { filter: brightness(0) invert(1); } .about2-sectio-area .about-images-area .customer-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; } .about2-sectio-area .about-images-area .customer-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-regular); line-height: 28px; } .about2-sectio-area .about-header { padding: 0 0 0 50px; position: relative; } @media (max-width: 767px) { .about2-sectio-area .about-header { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about2-sectio-area .about-header { padding: 0; margin-top: 30px; } } .about2-sectio-area .about-header 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-medium); line-height: 18px; margin-top: 16px; } .about2-sectio-area .about-header ul li img { height: 18px; width: 18px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; margin: 0 8px 0 0; } .about2-sectio-area .about-header .succes-rate-area { position: absolute; z-index: 1; background: #FFF6F4; padding: 24px; display: inline-block; bottom: 0; right: 0; } @media (max-width: 767px) { .about2-sectio-area .about-header .succes-rate-area { position: relative; width: 100%; margin-top: 20px; } } .about2-sectio-area .about-header .succes-rate-area .successful { text-align: center; padding-bottom: 20px; border-bottom: 1px solid #A7A9AD; } .about2-sectio-area .about-header .succes-rate-area .successful h3 { color: var(--1st-Main, #efb30e); 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; } .about2-sectio-area .about-header .succes-rate-area .client { text-align: center; } .about2-sectio-area .about-header .succes-rate-area .client h3 { color: var(--1st-Main, #efb30e); 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; } .about3-section-area { position: relative; z-index: 1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area { padding-top: 50px; } } .about3-section-area .about-header .images-area { width: 420px; } .about3-section-area .about-header .images-area img { border-radius: 8px; } @media (max-width: 767px) { .about3-section-area .about-header .images-area { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area .about-header .images-area { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } .about3-section-area .about-header .images-area .text p { 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-top: 16px; text-align: center; text-transform: uppercase; } .about3-section-area .sucess-text { position: relative; z-index: 1; display: inline-block; } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area .sucess-text { display: block; } } .about3-section-area .sucess-text .counter-text { background: var(--ztc-text-text-6); padding: 30px; display: inline-block; text-align: center; position: absolute; border-radius: 8px; bottom: 35px; left: -200px; } @media (max-width: 767px) { .about3-section-area .sucess-text .counter-text { position: relative; width: 100%; left: 0; bottom: 0; margin-top: 20px; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area .sucess-text .counter-text { position: relative; width: 100%; left: 0; bottom: 0; margin-top: 20px; margin-bottom: 30px; } } .about3-section-area .sucess-text .counter-text h2 { color: var(--ztc-text-text-1); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s50); font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 50px; } .about3-section-area .sucess-text .counter-text p { 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; text-transform: uppercase; } .about3-section-area .sucess-text .images-area2 { position: relative; left: -40px; } .about3-section-area .sucess-text .images-area2 img { border-radius: 8px; } @media (max-width: 767px) { .about3-section-area .sucess-text .images-area2 { left: 0; margin-top: 30px; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area .sucess-text .images-area2 { left: 0; margin-top: 30px; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area .sucess-text .images-area2 .img2 img { width: 100%; } } .about3-section-area .sucess-text .images-area2 p { 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-top: 16px; text-align: center; text-transform: uppercase; } .about3-section-area .peragraph .images-area .img1 img { width: 300px; height: 320px; border-radius: 8px; } @media (max-width: 767px) { .about3-section-area .peragraph .images-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about3-section-area .peragraph .images-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } } .about3-section-area .peragraph .images-area .text p { 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-top: 16px; text-align: center; text-transform: uppercase; } .about4-section-area { position: relative; z-index: 1; } @media (max-width: 767px) { .about4-section-area { margin-top: 50px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about4-section-area { margin-top: 50px; } } .about4-section-area .img1 img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .about4-section-area .about-header { padding: 0 0 0 50px; position: relative; } @media (max-width: 767px) { .about4-section-area .about-header { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about4-section-area .about-header { padding: 0; margin-top: 30px; } } .about4-section-area .about-header 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-medium); line-height: 18px; margin-top: 16px; } .about4-section-area .about-header ul li img { height: 18px; width: 18px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; margin: 0 8px 0 0; } .about4-section-area .about-header .succes-rate-area { position: absolute; z-index: 1; background: #FFFCED; padding: 24px; display: inline-block; bottom: 0; right: 0; } @media (max-width: 767px) { .about4-section-area .about-header .succes-rate-area { position: relative; width: 100%; margin-top: 20px; } } .about4-section-area .about-header .succes-rate-area .successful { text-align: center; padding-bottom: 20px; border-bottom: 1px solid #A7A9AD; } .about4-section-area .about-header .succes-rate-area .successful 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; } .about4-section-area .about-header .succes-rate-area .client { text-align: center; } .about4-section-area .about-header .succes-rate-area .client 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; } .about5-section-area { position: relative; z-index: 1; } @media (max-width: 767px) { .about5-section-area { margin-top: 50px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about5-section-area { margin-top: 50px; } } .about5-section-area .img1 img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .about5-section-area .about-header { padding: 0 0 0 50px; position: relative; } @media (max-width: 767px) { .about5-section-area .about-header { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .about5-section-area .about-header { padding: 0; margin-top: 30px; } } .about5-section-area .about-header 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-medium); line-height: 18px; margin-top: 16px; } .about5-section-area .about-header ul li img { height: 18px; width: 18px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; margin: 0 8px 0 0; } /*============= ABOUT CSS AREA ENDS ===============*/ /*============= SERVICE CSS AREA ===============*/ .service1-section-area { position: relative; z-index: 1; background: #F6F8FA; } .service1-section-area .service-boxarea { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; margin-bottom: 30px; } .service1-section-area .service-boxarea:hover .img1::after { height: 100%; width: 100%; transition: all 0.4s; } .service1-section-area .service-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .service1-section-area .service-boxarea:hover .content-area { height: 104px; transition: all 0.6s; } .service1-section-area .service-boxarea:hover .content-area .readmore { bottom: 0; height: 30px; transition: all 0.6s; visibility: visible; opacity: 1; } .service1-section-area .service-boxarea:hover .arrow { transition: all 0.8s; top: 95px; } .service1-section-area .service-boxarea .img1 { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; } .service1-section-area .service-boxarea .img1::after { position: absolute; content: ""; height: 0; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-text-text-2); opacity: 0.5; } .service1-section-area .service-boxarea .img1 img { height: 350px; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .service1-section-area .service-boxarea .content-area { background: var(--ztc-bg-bg-1); text-align: center; padding: 22px; position: absolute; bottom: 0; z-index: 1; width: 100%; height: 64px; transition: all 0.6s; } .service1-section-area .service-boxarea .content-area .head { 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); line-height: 20px; /* 100% */ display: inline-block; transition: all 0.4s; } .service1-section-area .service-boxarea .content-area .head:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .service1-section-area .service-boxarea .content-area .readmore { 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; display: inline-block; transition: all 0.6s; padding-top: 20px; visibility: hidden; opacity: 0; position: relative; bottom: -100px; height: 0; } .service1-section-area .service-boxarea .content-area .readmore i { transform: rotate(-45deg); margin-left: 4px; } .service1-section-area .service-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .service1-section-area .service-boxarea .arrow { position: absolute; z-index: 2; top: -100px; left: 50%; margin-left: -28px; transition: all 0.8s; } .service1-section-area .service-boxarea .arrow a { height: 56px; width: 56px; text-align: center; line-height: 56px; border-radius: 50%; background: var(--ztc-bg-bg-3); transition: all 0.4s; color: var(--ztc-text-text-2); display: inline-block; font-size: var(--ztc-font-size-font-s20); transform: rotate(-45deg); } .service2-section-area { position: relative; z-index: 1; background: #F6F6F6; } .service2-section-area .service-boxarea { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; margin-bottom: 30px; } .service2-section-area .service-boxarea:hover .img1::after { height: 100%; width: 100%; transition: all 0.4s; } .service2-section-area .service-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .service2-section-area .service-boxarea:hover .content-area { height: 104px; transition: all 0.6s; } .service2-section-area .service-boxarea:hover .content-area .readmore { bottom: 0; height: 30px; transition: all 0.6s; visibility: visible; opacity: 1; } .service2-section-area .service-boxarea:hover .arrow { transition: all 0.8s; top: 95px; } .service2-section-area .service-boxarea .img1 { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; } .service2-section-area .service-boxarea .img1::after { position: absolute; content: ""; height: 0; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-text-text-2); opacity: 0.5; } .service2-section-area .service-boxarea .img1 img { height: 350px; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .service2-section-area .service-boxarea .content-area { background: var(--ztc-bg-bg-1); text-align: center; padding: 22px; position: absolute; bottom: 0; z-index: 1; width: 100%; height: 64px; transition: all 0.6s; } .service2-section-area .service-boxarea .content-area .head { 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); line-height: 20px; /* 100% */ display: inline-block; transition: all 0.4s; } .service2-section-area .service-boxarea .content-area .head:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } .service2-section-area .service-boxarea .content-area .readmore { 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; display: inline-block; transition: all 0.6s; padding-top: 20px; visibility: hidden; opacity: 0; position: relative; bottom: -100px; height: 0; } .service2-section-area .service-boxarea .content-area .readmore i { transform: rotate(-45deg); margin-left: 4px; } .service2-section-area .service-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } .service2-section-area .service-boxarea .arrow { position: absolute; z-index: 2; top: -100px; left: 50%; margin-left: -28px; transition: all 0.8s; } .service2-section-area .service-boxarea .arrow a { height: 56px; width: 56px; text-align: center; line-height: 56px; border-radius: 50%; background: var(--ztc-bg-bg-5); transition: all 0.4s; color: var(--ztc-text-text-1); display: inline-block; font-size: var(--ztc-font-size-font-s20); transform: rotate(-45deg); } .service3-section-area { position: relative; z-index: 1; background: #F6F6F6; } .service3-section-area .service3-boxarea { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; border-radius: 8px; background: #fff; margin-bottom: 30px; } .service3-section-area .service3-boxarea:hover .img1 .service-img7 { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .service3-section-area .service3-boxarea:hover .img1 .elements2 { bottom: 0; transition: all 0.6s; } .service3-section-area .service3-boxarea .img1 { overflow: hidden; transition: all 0.4s; border-radius: 8px 8px 0 0; position: relative; } .service3-section-area .service3-boxarea .img1 .service-img7 { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .service3-section-area .service3-boxarea .img1 .elements2 { position: absolute; bottom: -250px; z-index: 2; right: 0; transition: all 0.6s; } .service3-section-area .service3-boxarea .content-area { padding: 24px; transition: all 0.4s; } .service3-section-area .service3-boxarea .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; transition: all 0.4s; display: inline-block; } .service3-section-area .service3-boxarea .content-area a:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } .service3-section-area .service3-boxarea .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: 400; line-height: 28px; } .service3-section-area .service3-boxarea .content-area a.readmore { 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; transition: all 0.4s; } .service3-section-area .service3-boxarea .content-area a.readmore:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } .service3-section-area .service3-boxarea .content-area a.readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .service4-section-area { position: relative; z-index: 1; background: #F6F6F6; } .service4-section-area .service4-slider-area { position: relative; } .service4-section-area .service4-slider-area .owl-stage-outer { overflow: inherit !important; } .service4-section-area .service4-slider-area .service4-slider-box { position: relative; z-index: 1; border-radius: 4px; overflow: hidden; transition: all 0.4s; } .service4-section-area .service4-slider-area .service4-slider-box:hover .img1 img { transform: scale(1.1) rotate(-4deg); transition: all 0.4s; } .service4-section-area .service4-slider-area .service4-slider-box:hover .img1::after { visibility: visible; opacity: 1; transition: all 0.4s; } .service4-section-area .service4-slider-area .service4-slider-box:hover .arrow { bottom: 8px; transition: all 0.6s; } .service4-section-area .service4-slider-area .service4-slider-box .img1 { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; border-radius: 4px; } .service4-section-area .service4-slider-area .service4-slider-box .img1::after { position: absolute; content: ""; height: 50px; width: 50px; display: inline-block; border-radius: 5px 0 0 0; transition: all 0.4s; background: #fff; right: 0; bottom: 0; visibility: hidden; opacity: 0; } .service4-section-area .service4-slider-area .service4-slider-box .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; transition: all 0.4s; } .service4-section-area .service4-slider-area .service4-slider-box .heading { position: absolute; top: 20px; left: 20px; z-index: 1; } .service4-section-area .service4-slider-area .service4-slider-box .heading a { color: #FFF; 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-section-area .service4-slider-area .service4-slider-box .arrow { position: absolute; bottom: -100px; transition: all 0.6s; right: 8px; z-index: 1; } .service4-section-area .service4-slider-area .service4-slider-box .arrow a { color: #FFF; font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-style: normal; font-weight: 700; line-height: 18px; display: inline-block; transition: all 0.4s; } .service4-section-area .service4-slider-area .service4-slider-box .arrow a span { height: 30px; width: 30px; text-align: center; line-height: 30px; border-radius: 50%; transition: all 0.4s; display: inline-block; background: var(--ztc-bg-bg-7); color: var(--ztc-text-text-2); margin-left: 16px; transform: rotate(-45deg); } .service5-section-area { position: relative; z-index: 1; background: #F6F8FA; } .service5-section-area .service5-slider-area { position: relative; } .service5-section-area .service5-slider-area .owl-stage-outer { overflow: inherit !important; } .service5-section-area .service5-slider-area .service5-slider-box { position: relative; z-index: 1; border-radius: 4px; overflow: hidden; transition: all 0.4s; } .service5-section-area .service5-slider-area .service5-slider-box:hover .heading { visibility: hidden; opacity: 0; } .service5-section-area .service5-slider-area .service5-slider-box:hover .img1 img { transform: scale(1.1) rotate(-4deg); transition: all 0.4s; } .service5-section-area .service5-slider-area .service5-slider-box:hover .img1::after { visibility: visible; opacity: 1; transition: all 0.4s; transform: scale(1); } .service5-section-area .service5-slider-area .service5-slider-box:hover .arrow { visibility: visible; opacity: 1; transition: all 0.6s; transform: scale(1); } .service5-section-area .service5-slider-area .service5-slider-box .img1 { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; border-radius: 4px; } .service5-section-area .service5-slider-area .service5-slider-box .img1::after { position: absolute; content: ""; height: 100%; width: 100%; display: inline-block; border-radius: 5px 0 0 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); left: 0; top: 0; visibility: hidden; opacity: 0; transform: scale(0.7); } .service5-section-area .service5-slider-area .service5-slider-box .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; transition: all 0.4s; } .service5-section-area .service5-slider-area .service5-slider-box .heading { position: absolute; top: 20px; left: 20px; z-index: 1; transition: all 0.4s; visibility: visible; opacity: 1; } .service5-section-area .service5-slider-area .service5-slider-box .heading a { color: #FFF; 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-section-area .service5-slider-area .service5-slider-box .arrow { position: absolute; top: 50%; transition: all 0.6s; left: 50%; z-index: 1; margin-top: -23px; margin-left: -23px; visibility: hidden; opacity: 0; transform: scale(0.6); } .service5-section-area .service5-slider-area .service5-slider-box .arrow a { height: 56px; width: 56px; text-align: center; line-height: 56px; border-radius: 50%; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-8); color: var(--ztc-text-text-1); transform: rotate(-45deg); font-size: var(--ztc-font-size-font-s20); } .service-inner-area { position: relative; z-index: 1; } .service-inner-area .service-widget-area { position: sticky; top: 100px; } .service-inner-area .service-widget-area h3 { color: var(--Text-Color, #03071E); 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; } .service-inner-area .service-widget-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: 400; line-height: 26px; } .service-inner-area .service-widget-area .search { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .service-inner-area .service-widget-area .search form { position: relative; z-index: 1; } .service-inner-area .service-widget-area .search form input { width: 100%; background: #FFF; color: var(--colors-dark-normal-active, #3D4C5E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; padding: 16px; } .service-inner-area .service-widget-area .search form button { border: none; outline: none; position: absolute; right: 16px; top: 16px; background: none; } .service-inner-area .service-widget-area .categories { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .service-inner-area .service-widget-area .categories 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: 500; line-height: 16px; display: block; transition: all 0.4s; padding: 19px 16px; background: var(--ztc-bg-bg-1); margin-top: 16px; } .service-inner-area .service-widget-area .categories ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; color: var(--ztc-text-text-2); } .service-inner-area .service-widget-area .download-area { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .service-inner-area .service-widget-area .download-area .btn-area1 a { width: 100%; text-align: center; } .service-inner-area .service-widget-area .download-area .btn-area1 a i { transform: rotate(0); margin: 0 4px 0 0; } .service-inner-area .service-widget-area .download-area .btn-area1 .header-btn1.btn2 { background: transparent; border: 1px solid var(--ztc-text-text-2); } .service-inner-area .service-widget-area .contact-widget-area { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .service-inner-area .service-widget-area .contact-widget-area .input-area { margin-top: 24px; } .service-inner-area .service-widget-area .contact-widget-area .input-area input { border: 1px solid rgba(255, 255, 255, 0.1); background: #FFF; width: 100%; color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; padding: 22px 16px; height: 60px; } .service-inner-area .service-widget-area .contact-widget-area .input-area input::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .service-inner-area .service-widget-area .contact-widget-area .input-area input::placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .service-inner-area .service-widget-area .contact-widget-area .input-area textarea { border: 1px solid rgba(255, 255, 255, 0.1); background: #FFF; width: 100%; color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; padding: 22px 16px; height: 180px; } .service-inner-area .service-widget-area .contact-widget-area .input-area textarea::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .service-inner-area .service-widget-area .contact-widget-area .input-area textarea::placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .service-inner-area .service-widget-area .contact-widget-area .input-area button { border: none; outline: none; } .service-inner-area .service-widget-others { padding: 0 0 0 50px; } @media (max-width: 767px) { .service-inner-area .service-widget-others { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .service-inner-area .service-widget-others { padding: 0; } } .service-inner-area .service-widget-others 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-inner-area .service-widget-others 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: 400; line-height: 28px; /* 175% */ } .service-inner-area .service-widget-others .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .service-inner-area .service-widget-others .list-area ul li { color: var(--Text-Color, #03071E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-style: normal; font-weight: 500; line-height: 18px; margin-top: 20px; } .service-inner-area .service-widget-others .list-area ul li img { margin: 0 6px 0 0; } /*============= SERVICE CSS AREA ENDS===============*/ /*============= HERO CSS AREA ===============*/ .hero-section-area { padding: 270px 0; width: 100%; position: relative; z-index: 1; overflow: hidden; } @media (max-width: 767px) { .hero-section-area { padding: 150px 0 100px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero-section-area { padding: 150px 0 100px; } } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .hero-section-area { top: -20px !important; } } .hero-section-area .hero-tabs-area img.hero-img1 { position: absolute; width: 100%; left: 0; top: 0; -o-object-fit: cover; object-fit: cover; transform: scale(1); transition: transform 8000ms ease, opacity 1800ms ease-in; } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero-section-area .hero-tabs-area img.hero-img1 { height: 100%; } } @media (max-width: 767px) { .hero-section-area .hero-tabs-area img.hero-img1 { height: 100%; } } .hero-section-area .hero-tabs-area .fade:not(.show) { opacity: 1 !important; } .hero-section-area .hero-tabs-area .tab-pane.fade.active.show .hero-img1 { transform: scale(1.2); transition: transform 8000ms ease, opacity 1800ms ease-in; } .hero-section-area .hero-tabs-area .tab-pane.fade.active.show .hero-header h5 { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(0px); opacity: 1; } .hero-section-area .hero-tabs-area .tab-pane.fade.active.show .hero-header h2 { transition: transform 1600ms ease, opacity 1600ms ease; transform: translateX(0px); opacity: 1; } .hero-section-area .hero-tabs-area .tab-pane.fade.active.show .hero-header p { transition: transform 1700ms ease, opacity 1700ms ease; transform: translateX(0px); opacity: 0.9 !important; } .hero-section-area .hero-tabs-area .tab-pane.fade.active.show .hero-header .btn-area { transition: transform 1800ms ease, opacity 1800ms ease; transform: translateX(0px); opacity: 1; } .hero-section-area .hero-tabs-area .tab-pane.fade.active.show .hero-counter-area { transition: transform 1800ms ease, opacity 1800ms ease; transform: translateY(0px); opacity: 1; } .hero-section-area .hero-tabs-area .hero-header { position: relative; z-index: 1; overflow: hidden; } @media (max-width: 767px) { .hero-section-area .hero-tabs-area .hero-header { text-align: center; } } .hero-section-area .hero-tabs-area .hero-header h5 { transition: transform 1200ms ease, opacity 1500ms ease; transform: translateX(-600px); opacity: 0; position: relative; overflow: hidden; } .hero-section-area .hero-tabs-area .hero-header h2 { overflow: hidden; transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(-800px); position: relative; opacity: 0; } .hero-section-area .hero-tabs-area .hero-header p { overflow: hidden; transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(-900px); position: relative; opacity: 0 !important; } .hero-section-area .hero-tabs-area .hero-header .btn-area { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(-1000px); position: relative; opacity: 0; } .hero-section-area .hero-tabs-area .hero-header .btn-area .header-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; display: inline-block; transition: all 0.4s; border: 1px solid #fff; padding: 15px 20px; position: relative; z-index: 1; margin-left: 16px; } @media (max-width: 767px) { .hero-section-area .hero-tabs-area .hero-header .btn-area .header-btn2 { margin-left: 0; margin-top: 20px; } } .hero-section-area .hero-tabs-area .hero-header .btn-area .header-btn2 i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .hero-section-area .hero-tabs-area .hero-header .btn-area .header-btn2::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .hero-section-area .hero-tabs-area .hero-header .btn-area .header-btn2:hover { color: var(--ztc-text-text-1); transition: all 0.4s; border: 1px solid var(--ztc-text-text-2); } .hero-section-area .hero-tabs-area .hero-header .btn-area .header-btn2:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .hero-section-area .hero-tabs-area .hero-header .btn-area .header-btn2:hover i { transform: rotate(0); transition: all 0.4s; } .hero-section-area .hero-tabs-area .hero-counter-area { position: relative; z-index: 1; overflow: hidden; transition: transform 1400ms ease, opacity 1400ms ease; transform: translateY(300px); position: relative; opacity: 0; } @media (max-width: 767px) { .hero-section-area .hero-tabs-area .hero-counter-area { text-align: center; } } @media (max-width: 767px) { .hero-section-area .hero-tabs-area .hero-counter-area .counter-box { margin-bottom: 20px; } } .hero-section-area .hero-tabs-area .hero-counter-area .counter-box h3 { color: var(--ztc-text-text-1); 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; } .hero-section-area .hero-tabs-area .hero-counter-area .counter-box p { color: #FFF; 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; -o-object-position: 80%; object-position: 80%; } .hero-section-area .slider-btn-area { position: absolute; bottom: 0; z-index: 1; width: 100%; } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero-section-area .slider-btn-area { display: none; } } @media (max-width: 767px) { .hero-section-area .slider-btn-area { display: none; } } .hero-section-area .slider-btn-area button { border-top: 1px solid rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.01); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); border-radius: 0; color: #FFF; font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); font-style: normal; font-weight: 700; line-height: 24px; display: inline-block; transition: all 0.4s; padding: 38px; } .hero-section-area .slider-btn-area button.active { background: var(--ztc-bg-bg-3); color: var(--ztc-text-text-2); } @media screen and (min-width: 2000px) { .hero-section-area .slider-btn-area button { width: 34.3% !important; } } .hero-section-area .slider-btn-area .btn1 button { position: absolute; width: 635px; left: 0px; top: -85px; } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .hero-section-area .slider-btn-area .btn1 button { width: 470px; top: -85px; left: 0; } } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .hero-section-area .slider-btn-area .btn1 button { width: 530px; } } @media screen and (min-width: 2000px) { .hero-section-area .slider-btn-area .btn1 button { width: 797px; } } .hero-section-area .slider-btn-area .btn2 button { position: absolute; width: 635px; left: 33.4%; top: -186px; } .hero-section-area .slider-btn-area .btn2 button::after { position: absolute; content: ""; height: 101px; width: 101%; left: -1px; bottom: -101px; transition: all 0.4s; background: #fff; } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .hero-section-area .slider-btn-area .btn2 button::after { left: 0; } } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .hero-section-area .slider-btn-area .btn2 button::after { left: 0; } } .hero-section-area .slider-btn-area .btn2 button::before { position: absolute; content: ""; height: 900px; width: 1px; background: rgba(255, 255, 255, 0.35); left: 0; z-index: 1; top: -800px; } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .hero-section-area .slider-btn-area .btn2 button { width: 500px; left: 32.6%; top: -186px; } } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .hero-section-area .slider-btn-area .btn2 button { width: 530px; top: -185px; } } @media screen and (min-width: 2000px) { .hero-section-area .slider-btn-area .btn2 button { width: 797px; left: 33.4%; } } .hero-section-area .slider-btn-area .btn3 button { position: absolute; width: 635px; right: -4px; top: -287px; } .hero-section-area .slider-btn-area .btn3 button::after { position: absolute; content: ""; height: 206px; width: 100%; left: 0; bottom: -206px; transition: all 0.4s; background: #fff; } .hero-section-area .slider-btn-area .btn3 button::before { position: absolute; content: ""; height: 900px; width: 1px; background: rgba(255, 255, 255, 0.35); left: 0; z-index: 1; top: -800px; } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .hero-section-area .slider-btn-area .btn3 button { width: 500px; right: -30px; top: -288px; } } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .hero-section-area .slider-btn-area .btn3 button { width: 530px; top: -285px; } } @media screen and (min-width: 2000px) { .hero-section-area .slider-btn-area .btn3 button { width: 792px; right: -4px; } } .header-carousel-slider-area .active .hero-area .header-area .div h5 { transition: transform 1200ms ease, opacity 1200ms ease; transform: translateY(0); opacity: 1; } .header-carousel-slider-area .active .hero-area .header-area .div h2 { transition: transform 1500ms ease, opacity 1500ms ease; transform: translateY(0); opacity: 1; } .header-carousel-slider-area .active .hero-area .header-area .div p { transition: transform 1800ms ease, opacity 1800ms ease; transform: translateY(0); opacity: 0.8 !important; } .header-carousel-slider-area .active .hero-area .header-area .div .btn-area { transition: transform 2000ms ease, opacity 2000ms ease; transform: translateY(0); opacity: 1; } .header-carousel-slider-area .active .hero-area .header-area .authors-area { transition: transform 1800ms ease, opacity 1800ms ease; transform: translateY(0); opacity: 1; } .header-carousel-slider-area .active .hero-area .img1 { transform: scale(1.2); } .header-carousel-slider-area .active .hero-area .img2 { transform: translateX(0); } .header-carousel-slider-area { position: relative; z-index: 1; } .header-carousel-slider-area .hero-area { position: relative; z-index: 1; overflow: hidden; padding: 330px 0 180px; } @media (max-width: 767px) { .header-carousel-slider-area .hero-area { padding: 150px 0 80px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .header-carousel-slider-area .hero-area { padding: 150px 0 80px; } } .header-carousel-slider-area .hero-area .img1 { position: absolute; width: 100%; height: 100%; top: 0; transform: scale(1); transition: transform 8000ms ease, opacity 2400ms ease-in; z-index: -1; } .header-carousel-slider-area .hero-area .img1 img { position: absolute; top: 0; width: 100%; -o-object-fit: cover; object-fit: cover; z-index: -1; height: 100%; } .header-carousel-slider-area .hero-area .img2 { position: absolute; top: 0; height: 100%; z-index: -1; transform: translateX(-100px); transition: transform 8000ms ease, opacity 2400ms ease-in; } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .header-carousel-slider-area .hero-area .img2 { left: -150px; } } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .header-carousel-slider-area .hero-area .img2 { left: -270px; } } @media (max-width: 767px) { .header-carousel-slider-area .hero-area .img2 { width: 100%; transform: translateX(0); } } @media screen and (min-width: 2000px) { .header-carousel-slider-area .hero-area .img2 { width: 60%; } } .header-carousel-slider-area .hero-area .img2 img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .header-carousel-slider-area .hero-area .line1 { position: absolute; top: 45%; left: 137px; } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .header-carousel-slider-area .hero-area .line1 { left: 87px; } } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .header-carousel-slider-area .hero-area .line1 { left: 37px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .header-carousel-slider-area .hero-area .line1 { right: 33px; left: inherit; top: 43%; } } @media (max-width: 767px) { .header-carousel-slider-area .hero-area .line1 { display: none; } } .header-carousel-slider-area .hero-area .line1 img { height: 60px !important; width: 2px !important; } .header-carousel-slider-area .hero-area .line2 { position: absolute; top: 60%; left: 137px; } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .header-carousel-slider-area .hero-area .line2 { left: 87px; } } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .header-carousel-slider-area .hero-area .line2 { left: 37px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .header-carousel-slider-area .hero-area .line2 { right: 33px; left: inherit; top: 64%; } } @media (max-width: 767px) { .header-carousel-slider-area .hero-area .line2 { display: none; } } .header-carousel-slider-area .hero-area .line2 img { height: 60px !important; width: 2px !important; } .header-carousel-slider-area .hero-area .header-area { overflow: hidden; } .header-carousel-slider-area .hero-area .header-area .div { overflow: hidden; } .header-carousel-slider-area .hero-area .header-area .div h5 { transition: transform 1200ms ease, opacity 1200ms ease; opacity: 0; position: relative; overflow: hidden; transform: translateY(100px); } .header-carousel-slider-area .hero-area .header-area .div { overflow: hidden; } .header-carousel-slider-area .hero-area .header-area .div h2 { overflow: hidden; transition: transform 1500ms ease, opacity 1500ms ease; position: relative; opacity: 0; transform: translateY(100px); } .header-carousel-slider-area .hero-area .header-area .div { overflow: hidden; } .header-carousel-slider-area .hero-area .header-area .div p { overflow: hidden; transition: transform 1800ms ease, opacity 1800ms ease; position: relative; opacity: 0 !important; transform: translateY(100px); } .header-carousel-slider-area .hero-area .header-area .div { overflow: hidden; } .header-carousel-slider-area .hero-area .header-area .div .btn-area { transition: transform 2000ms ease, opacity 2000ms ease; position: relative; opacity: 0; transform: translateY(100px); } @media (max-width: 767px) { .header-carousel-slider-area .hero-area .header-area .div .header-btn2-h2 { margin: 0 8px 0 0; } } .header-carousel-slider-area .hero-area .header-area .div .header-btn2-h2:hover { color: var(--ztc-text-text-2); } .header-carousel-slider-area .hero-area .header-area .div .header-btn2-h2::after { background: var(--ztc-bg-bg-1); transition: all 0.5s; color: var(--ztc-text-text-2); } .header-carousel-slider-area .hero-area .header-area .div .header-btn2-h2.btn2 { background: none; border: 1px solid var(--ztc-text-text-1); margin-left: 16px; padding: 15px 20px; } @media (max-width: 767px) { .header-carousel-slider-area .hero-area .header-area .div .header-btn2-h2.btn2 { margin-left: 0; margin-top: 20px; } } .header-carousel-slider-area .hero-area .header-area .authors-area { display: flex; align-items: center; transition: transform 1400ms ease, opacity 1400ms ease; position: relative; opacity: 0; transform: translateY(100px); position: relative; overflow: hidden; } .header-carousel-slider-area .hero-area .header-area .authors-area .content { margin-left: 16px; } .header-carousel-slider-area .hero-area .header-area .authors-area .content ul li { display: inline-block; color: var(--ztc-bg-bg-3); } .header-carousel-slider-area .owl-dots { transform: rotate(90deg); position: absolute; left: 100px; z-index: 2; top: 50%; margin-top: 50px; } @media only screen and (min-width: 1600px) and (max-width: 1700px) { .header-carousel-slider-area .owl-dots { left: 50px; } } @media only screen and (min-width: 1400px) and (max-width: 1599px) { .header-carousel-slider-area .owl-dots { left: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .header-carousel-slider-area .owl-dots { right: 0; left: inherit; } } @media (max-width: 767px) { .header-carousel-slider-area .owl-dots { position: relative; z-index: 1; text-align: center; transform: rotate(0deg); left: 0; bottom: 100px; } } .header-carousel-slider-area .owl-dots button { height: 12px; width: 12px; text-align: center; line-height: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-5); border-radius: 50%; margin: 0 12px 0 0; position: relative; z-index: 1; } .header-carousel-slider-area .owl-dots button.active::after { visibility: visible; opacity: 1; transition: all 0.4s; } .header-carousel-slider-area .owl-dots button::after { position: absolute; content: ""; height: 20px; width: 20px; transition: all 0.4s; border: 1px solid var(--ztc-bg-bg-5); border-radius: 50%; top: -4px; left: -4px; visibility: hidden; opacity: 0; } .hero3-section-area { position: relative; z-index: 1; padding: 250px 0 160px; } @media (max-width: 767px) { .hero3-section-area { padding: 160px 0 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero3-section-area { padding: 160px 0 0; } } .hero3-section-area .elements3 { position: absolute; left: 0; height: 100%; top: 0; } .hero3-section-area .img1 { position: absolute; right: 0; top: 0; } @media (max-width: 767px) { .hero3-section-area .img1 { position: relative; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero3-section-area .img1 { position: relative; margin-top: 30px; } } .hero3-section-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .hero3-section-area .hero-header-area .btn-area1 .header-btn2-h3.btn2 { margin-left: 24px; border: 1px solid var(--ztc-text-text-6); background: none; color: var(--ztc-text-text-6); } @media (max-width: 767px) { .hero3-section-area .hero-header-area .btn-area1 .header-btn2-h3.btn2 { margin-left: 0; margin-top: 20px; } } .hero3-section-area .hero-header-area .btn-area1 .header-btn2-h3.btn2 span { background: var(--ztc-bg-bg-6); color: var(--ztc-text-text-1); } .hero3-section-area .hero-header-area .btn-area1 .header-btn2-h3.btn2:hover { border: 1px solid var(--ztc-text-text-2); color: var(--ztc-text-text-1); } .hero3-section-area .hero-header-area .btn-area1 .header-btn2-h3.btn2:hover span { background: #fff; color: var(--ztc-text-text-2); } .hero3-section-area .hero-header-area .hero-counter-area { position: relative; z-index: 1; } @media (max-width: 767px) { .hero3-section-area .hero-header-area .hero-counter-area { text-align: center; } } @media (max-width: 767px) { .hero3-section-area .hero-header-area .hero-counter-area .counter-box { margin-bottom: 20px; } } .hero3-section-area .hero-header-area .hero-counter-area .counter-box h3 { color: var(--ztc-text-text-6); 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; } .hero3-section-area .hero-header-area .hero-counter-area .counter-box 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-regular); line-height: 16px; -o-object-position: 80%; object-position: 80%; } .hero4-slider-area { position: relative; padding: 0 0 100px 0; } @media (max-width: 767px) { .hero4-slider-area { padding: 0 0 50px 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero4-slider-area { padding: 0 0 50px 0; } } .hero4-slider-area .elements4 { position: absolute; top: 0; left: 0; } .hero4-slider-area .bg3 { position: absolute; right: 0; height: 100%; } .hero4-slider-area .hero-main-slider { position: relative; z-index: 2; } .hero4-slider-area .hero-main-slider .slideshow { position: relative; z-index: 1; height: 100%; } .hero4-slider-area .hero-main-slider .slideshow * { outline: none; } .hero4-slider-area .hero-main-slider .slideshow .slider-track { transition: all 1s cubic-bezier(0.7, 0, 0.3, 1); } .hero4-slider-area .hero-main-slider .slick-dots { display: flex; margin: 0; list-style-type: none; position: absolute; display: flex; margin: 0; list-style-type: none; bottom: 110px; left: 60px; } .hero4-slider-area .hero-main-slider .slick-dots button { display: inline-block; height: 10px; width: 10px; text-align: center; padding: 0; transition: all 0.4s; border: none; border-radius: 100%; background-color: #776D42; text-indent: -9999px; margin: 0 16px 0 0; position: relative; z-index: 1; } .hero4-slider-area .hero-main-slider .slick-dots button::after { height: 16px; width: 16px; text-align: center; line-height: 16px; border-radius: 50%; border: 1px solid var(--ztc-bg-bg-7); display: inline-block; transition: all 0.4s; position: absolute; content: ""; left: -3px; top: -3px; visibility: hidden; opacity: 0; } .hero4-slider-area .hero-main-slider .slick-dots li.slick-active button { background-color: var(--ztc-bg-bg-7); } .hero4-slider-area .hero-main-slider .slick-dots li.slick-active button::after { visibility: visible; opacity: 1; } .hero4-slider-area .hero-main-slider .slideshow .item.slick-active .heading-area h5 { transition: transform 1200ms ease, opacity 1500ms ease; transform: translateX(0); opacity: 1; position: relative; } .hero4-slider-area .hero-main-slider .slideshow .item.slick-active .heading-area h1 { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(0); opacity: 1; position: relative; } .hero4-slider-area .hero-main-slider .slideshow .item.slick-active .heading-area p { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(0); position: relative; opacity: 80%; } .hero4-slider-area .hero-main-slider .slideshow .item.slick-active .heading-area .btn-area1 { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(0); position: relative; opacity: 1; } .hero4-slider-area .hero-main-slider .slideshow .item { height: 100%; position: relative; z-index: 1; overflow: hidden; } .hero4-slider-area .hero-main-slider .slideshow .item .main-img { position: absolute; top: 0; width: 100%; height: 100%; } .hero4-slider-area .hero-main-slider .slideshow .item .main-img img.hero-img6 { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .hero4-slider-area .hero-main-slider .slideshow .item .bg1 { position: absolute; top: 0; } .hero4-slider-area .hero-main-slider .slideshow .item .heading-area { padding: 300px 470px 170px 60px; position: relative; z-index: 1; transition: all 0.4s; overflow: hidden; } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero4-slider-area .hero-main-slider .slideshow .item .heading-area { padding: 200px 60px; } } @media (max-width: 767px) { .hero4-slider-area .hero-main-slider .slideshow .item .heading-area { padding: 200px 20px; } } .hero4-slider-area .hero-main-slider .slideshow .item .heading-area h5 { transition: transform 1200ms ease, opacity 1500ms ease; transform: translateX(-600px); opacity: 0; position: relative; } .hero4-slider-area .hero-main-slider .slideshow .item .heading-area h1 { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(-800px); opacity: 0; position: relative; } .hero4-slider-area .hero-main-slider .slideshow .item .heading-area p { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(-900px); position: relative; opacity: 0; } .hero4-slider-area .hero-main-slider .slideshow .item .heading-area .btn-area1 { transition: transform 1400ms ease, opacity 1400ms ease; transform: translateX(-1000px); position: relative; opacity: 0; } .hero4-slider-area .hero-side-area { position: relative; } .hero4-slider-area .hero-side-area .start-dream { overflow: hidden; transition: all 0.4s; position: relative; border-radius: 4px; margin-top: 120px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero4-slider-area .hero-side-area .start-dream { margin-top: 30px; } } @media (max-width: 767px) { .hero4-slider-area .hero-side-area .start-dream { margin-top: 30px; } } .hero4-slider-area .hero-side-area .start-dream .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .hero4-slider-area .hero-side-area .start-dream .text .link { position: absolute; top: 20px; left: 20px; z-index: 1; } .hero4-slider-area .hero-side-area .start-dream .text .link a { color: #FFF; 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; } .hero4-slider-area .hero-side-area .start-dream .text .arrow { position: absolute; bottom: 10px; right: 10px; z-index: 1; } .hero4-slider-area .hero-side-area .start-dream .text .arrow a { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-7); transition: all 0.4s; color: var(--ztc-bg-bg-2); transform: rotate(-45deg); display: inline-block; } .hero4-slider-area .hero-side-area .author-area ul li { display: inline-block; color: #FFD61E; } .hero4-slider-area .hero-side-area .author-area p { color: var(--Text-Color, #03071E); 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-section-area { position: relative; z-index: 1; background-image: url(../img/all-images/bg/bg4.png); background-position: center bottom; background-size: cover; background-repeat: no-repeat; padding: 180px 0 100px; } .hero5-section-area .elements5 { position: absolute; height: 100%; left: 0; top: 0; } .hero5-section-area .hero5-header { padding: 0 50px 0 0; } @media (max-width: 767px) { .hero5-section-area .hero5-header { padding: 0; margin-bottom: 50px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .hero5-section-area .hero5-header { padding: 0; margin-bottom: 50px; } } .hero5-section-area .hero5-header h2 { line-height: 64px; font-size: 56px; } @media (max-width: 767px) { .hero5-section-area .hero5-header h2 { font-size: var(--ztc-font-size-font-s32); line-height: 40px; } } .hero5-section-area .hero5-header .header-btn2-h5.btn2 { margin-left: 16px; background: none; border: 1px solid #fff; padding: 15px; } .hero5-section-area .hero5-header .header-btn2-h5.btn2:hover { border: 1px solid var(--ztc-text-text-2); } .hero5-section-area .hero5-header .header-btn2-h5.btn2:hover::after { background: var(--ztc-bg-bg-8); } @media (max-width: 767px) { .hero5-section-area .hero5-header .header-btn2-h5.btn2 { margin-left: 0; margin-top: 20px; } } .hero5-section-area .images-area .img1 { position: relative; } .hero5-section-area .images-area .img1 .elements6 { height: 44px; width: 44px; -o-object-fit: contain; object-fit: contain; position: absolute; right: -33px; top: -33px; } .hero5-section-area .images-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .inner-hero-area { position: relative; z-index: 1; background-position: center; background-repeat: no-repeat; background-size: cover; padding: 200px 0 100px; } @media (max-width: 767px) { .inner-hero-area .header-area { text-align: center; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .inner-hero-area .header-area { text-align: center; } } .inner-hero-area .header-area h2 { color: #FFF; 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: 60px; display: block; transition: all 0.4s; } @media (max-width: 767px) { .inner-hero-area .header-area h2 { font-size: var(--ztc-font-size-font-s32); line-height: 40px; } } .inner-hero-area .header-area a { color: #FFF; font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: 400; line-height: 16px; display: inline-block; transition: all 0.4s; } .inner-hero-area .header-area a i { margin: 0 4px; } .inner-hero-area .header-area a span { font-weight: var(--ztc-weight-bold); display: inline-block; } /*============= HERO CSS AREA ===============*/ /*============= MOBILE MENU CSS AREA ===============*/ .mobile-header.mobile-haeder1 { background: var(--ztc-text-text-2); position: fixed; } .mobile-header.mobile-haeder1 .mobile-logo { height: 32px; width: 180px; } .mobile-header.mobile-haeder1 .mobile-nav-icon { color: var(--ztc-text-text-1); } .mobile-sidebar.mobile-sidebar1 { background: var(--ztc-text-text-1); overflow-y: scroll; } .mobile-sidebar.mobile-sidebar1 .logos { height: 32px; width: 180px; } .mobile-sidebar.mobile-sidebar1 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li a { font-weight: var(--ztc-weight-medium); } .mobile-sidebar.mobile-sidebar1 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li ul li a li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium) !important; line-height: var(--ztc-font-size-font-s16); color: var(--ztc-text-text-2); display: inline-block; } .mobile-sidebar.mobile-sidebar1 .mobile-nav.mobile-nav1 .header-btn1 { margin-top: 20px; margin-bottom: 30px; width: 100%; text-align: center; } .mobile-sidebar.mobile-sidebar1 .mobile-nav.mobile-nav1 h3 { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); margin-bottom: 20px; } .mobile-sidebar.mobile-sidebar1 .footer1-contact-info .contact-info-single { display: flex; margin-bottom: 16px; } .mobile-sidebar.mobile-sidebar1 .footer1-contact-info .contact-info-single .contact-info-text a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); line-height: var(--ztc-font-size-font-s24); margin-left: 6px; display: inline-block; } .mobile-sidebar.mobile-sidebar1 .footer1-contact-info .social-links-mobile-menu { margin-bottom: 50px; } .mobile-sidebar.mobile-sidebar1 .footer1-contact-info .social-links-mobile-menu ul li { display: inline-block; line-height: 30px; } .mobile-sidebar.mobile-sidebar1 .footer1-contact-info .social-links-mobile-menu ul li a { height: 40px; width: 40px; display: inline-block; text-align: center; background: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-4); border-radius: 50%; padding: 0; line-height: 42px; transition: all 0.4s ease-in-out; color: var(--ztc-text-text-4); } .mobile-sidebar.mobile-sidebar1 .footer1-contact-info .social-links-mobile-menu ul li a:hover { background: var(--ztc-text-text-4); transition: all 0.4s ease-in-out; transform: translateY(-3px); color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-4); } .mobile-header.mobile-haeder2 { background: var(--ztc-text-text-1); position: fixed; } .mobile-header.mobile-haeder2 .mobile-logo { height: 32px; width: 180px; } .mobile-header.mobile-haeder2 .mobile-nav-icon { color: var(--ztc-text-text-2); } .mobile-sidebar.mobile-sidebar2 { background: var(--ztc-text-text-1); overflow-y: scroll; } .mobile-sidebar.mobile-sidebar2 .logos { height: 32px; width: 180px; } .mobile-sidebar.mobile-sidebar2 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li a { font-weight: var(--ztc-weight-medium); } .mobile-sidebar.mobile-sidebar2 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li ul li a li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium) !important; line-height: var(--ztc-font-size-font-s16); color: var(--ztc-text-text-2); display: inline-block; } .mobile-sidebar.mobile-sidebar2 .mobile-nav.mobile-nav1 .header-btn2-h2 { margin-top: 20px; margin-bottom: 30px; width: 100%; text-align: center; } .mobile-sidebar.mobile-sidebar2 .mobile-nav.mobile-nav1 h3 { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); margin-bottom: 20px; } .mobile-sidebar.mobile-sidebar2 .footer1-contact-info .contact-info-single { display: flex; margin-bottom: 16px; } .mobile-sidebar.mobile-sidebar2 .footer1-contact-info .contact-info-single .contact-info-text a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); line-height: var(--ztc-font-size-font-s24); margin-left: 6px; display: inline-block; } .mobile-sidebar.mobile-sidebar2 .footer1-contact-info .social-links-mobile-menu { margin-bottom: 50px; } .mobile-sidebar.mobile-sidebar2 .footer1-contact-info .social-links-mobile-menu ul li { display: inline-block; line-height: 30px; } .mobile-sidebar.mobile-sidebar2 .footer1-contact-info .social-links-mobile-menu ul li a { height: 40px; width: 40px; display: inline-block; text-align: center; background: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-5); border-radius: 50%; padding: 0; line-height: 42px; transition: all 0.4s ease-in-out; color: var(--ztc-text-text-5); } .mobile-sidebar.mobile-sidebar2 .footer1-contact-info .social-links-mobile-menu ul li a:hover { background: var(--ztc-text-text-5); transition: all 0.4s ease-in-out; transform: translateY(-3px); color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-5); } .mobile-header.mobile-haeder3 { background: var(--ztc-text-text-2); position: fixed; } .mobile-header.mobile-haeder3 .mobile-logo { height: 32px; width: 180px; } .mobile-header.mobile-haeder3 .mobile-nav-icon { color: var(--ztc-text-text-1); } .mobile-sidebar.mobile-sidebar3 { background: var(--ztc-text-text-1); overflow-y: scroll; } .mobile-sidebar.mobile-sidebar3 .logos { height: 32px; width: 180px; } .mobile-sidebar.mobile-sidebar3 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li a { font-weight: var(--ztc-weight-medium); } .mobile-sidebar.mobile-sidebar3 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li ul li a li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium) !important; line-height: var(--ztc-font-size-font-s16); color: var(--ztc-text-text-2); display: inline-block; } .mobile-sidebar.mobile-sidebar3 .mobile-nav.mobile-nav1 .header-btn2-h3 { margin-top: 20px; margin-bottom: 30px; width: 100%; text-align: center; } .mobile-sidebar.mobile-sidebar3 .mobile-nav.mobile-nav1 h3 { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); margin-bottom: 20px; } .mobile-sidebar.mobile-sidebar3 .footer1-contact-info .contact-info-single { display: flex; margin-bottom: 16px; } .mobile-sidebar.mobile-sidebar3 .footer1-contact-info .contact-info-single .contact-info-text a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); line-height: var(--ztc-font-size-font-s24); margin-left: 6px; display: inline-block; } .mobile-sidebar.mobile-sidebar3 .footer1-contact-info .social-links-mobile-menu { margin-bottom: 50px; } .mobile-sidebar.mobile-sidebar3 .footer1-contact-info .social-links-mobile-menu ul li { display: inline-block; line-height: 30px; } .mobile-sidebar.mobile-sidebar3 .footer1-contact-info .social-links-mobile-menu ul li a { height: 40px; width: 40px; display: inline-block; text-align: center; background: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-6); border-radius: 50%; padding: 0; line-height: 42px; transition: all 0.4s ease-in-out; color: var(--ztc-text-text-6); } .mobile-sidebar.mobile-sidebar3 .footer1-contact-info .social-links-mobile-menu ul li a:hover { background: var(--ztc-text-text-6); transition: all 0.4s ease-in-out; transform: translateY(-3px); color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-6); } .mobile-header.mobile-haeder4 { background: var(--ztc-text-text-1); position: fixed; } .mobile-header.mobile-haeder4 .mobile-logo { height: 32px; width: 180px; } .mobile-header.mobile-haeder4 .mobile-nav-icon { color: var(--ztc-text-text-2); } .mobile-sidebar.mobile-sidebar4 { background: var(--ztc-text-text-1); overflow-y: scroll; } .mobile-sidebar.mobile-sidebar4 .logos { height: 32px; width: 180px; } .mobile-sidebar.mobile-sidebar4 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li a { font-weight: var(--ztc-weight-medium); } .mobile-sidebar.mobile-sidebar4 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li ul li a li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium) !important; line-height: var(--ztc-font-size-font-s16); color: var(--ztc-text-text-2); display: inline-block; } .mobile-sidebar.mobile-sidebar4 .mobile-nav.mobile-nav1 .header-btn2-h4 { margin-top: 20px; margin-bottom: 30px; width: 100%; text-align: center; } .mobile-sidebar.mobile-sidebar4 .mobile-nav.mobile-nav1 h3 { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); margin-bottom: 20px; } .mobile-sidebar.mobile-sidebar4 .footer1-contact-info .contact-info-single { display: flex; margin-bottom: 16px; } .mobile-sidebar.mobile-sidebar4 .footer1-contact-info .contact-info-single .contact-info-text a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); line-height: var(--ztc-font-size-font-s24); margin-left: 6px; display: inline-block; } .mobile-sidebar.mobile-sidebar4 .footer1-contact-info .social-links-mobile-menu { margin-bottom: 50px; } .mobile-sidebar.mobile-sidebar4 .footer1-contact-info .social-links-mobile-menu ul li { display: inline-block; line-height: 30px; } .mobile-sidebar.mobile-sidebar4 .footer1-contact-info .social-links-mobile-menu ul li a { height: 40px; width: 40px; display: inline-block; text-align: center; background: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-7); border-radius: 50%; padding: 0; line-height: 42px; transition: all 0.4s ease-in-out; color: var(--ztc-text-text-7); } .mobile-sidebar.mobile-sidebar4 .footer1-contact-info .social-links-mobile-menu ul li a:hover { background: var(--ztc-text-text-7); transition: all 0.4s ease-in-out; transform: translateY(-3px); color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-7); } .mobile-header.mobile-haeder5 { background: var(--ztc-text-text-1); position: fixed; } .mobile-header.mobile-haeder5 .mobile-logo { height: 32px; width: 180px; } .mobile-header.mobile-haeder5 .mobile-nav-icon { color: var(--ztc-text-text-2); } .mobile-sidebar.mobile-sidebar5 { background: var(--ztc-text-text-1); overflow-y: scroll; } .mobile-sidebar.mobile-sidebar5 .logos { height: 32px; width: 180px; } .mobile-sidebar.mobile-sidebar5 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li a { font-weight: var(--ztc-weight-medium); } .mobile-sidebar.mobile-sidebar5 .mobile-nav.mobile-nav1 .mobile-nav-list.nav-list1 li ul li a li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium) !important; line-height: var(--ztc-font-size-font-s16); color: var(--ztc-text-text-2); display: inline-block; } .mobile-sidebar.mobile-sidebar5 .mobile-nav.mobile-nav1 .header-btn2-h5 { margin-top: 20px; margin-bottom: 30px; width: 100%; text-align: center; } .mobile-sidebar.mobile-sidebar5 .mobile-nav.mobile-nav1 h3 { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); margin-bottom: 20px; } .mobile-sidebar.mobile-sidebar5 .footer1-contact-info .contact-info-single { display: flex; margin-bottom: 16px; } .mobile-sidebar.mobile-sidebar5 .footer1-contact-info .contact-info-single .contact-info-text a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); line-height: var(--ztc-font-size-font-s24); margin-left: 6px; display: inline-block; } .mobile-sidebar.mobile-sidebar5 .footer1-contact-info .social-links-mobile-menu { margin-bottom: 50px; } .mobile-sidebar.mobile-sidebar5 .footer1-contact-info .social-links-mobile-menu ul li { display: inline-block; line-height: 30px; } .mobile-sidebar.mobile-sidebar5 .footer1-contact-info .social-links-mobile-menu ul li a { height: 40px; width: 40px; display: inline-block; text-align: center; background: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-8); border-radius: 50%; padding: 0; line-height: 42px; transition: all 0.4s ease-in-out; color: var(--ztc-text-text-8); } .mobile-sidebar.mobile-sidebar5 .footer1-contact-info .social-links-mobile-menu ul li a:hover { background: var(--ztc-text-text-8); transition: all 0.4s ease-in-out; transform: translateY(-3px); color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-8); } /*============= MOBILE MENU CSS AREA ===============*/ /*============= BLOG CSS AREA ===============*/ .blog1-section-area { position: relative; z-index: 1; } .blog1-section-area .blog-boxarea { margin-bottom: 30px; transition: all 0.4s; } .blog1-section-area .blog-boxarea:hover { background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); transition: all 0.4s; } .blog1-section-area .blog-boxarea:hover .content-area { background: #fff; transition: all 0.4s; } .blog1-section-area .blog-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .blog1-section-area .blog-boxarea .img1 { overflow: hidden; transition: all 0.4s; } .blog1-section-area .blog-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .blog1-section-area .blog-boxarea .content-area { position: relative; z-index: 1; background: #F6F8FA; padding: 24px; transition: all 0.4s; } .blog1-section-area .blog-boxarea .content-area ul li { display: inline-block; margin: 0 16px 0 0; } .blog1-section-area .blog-boxarea .content-area ul li a { color: var(--Text-Color, #03071E); 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; } .blog1-section-area .blog-boxarea .content-area ul li a i { margin: 0 4px 0 0; } .blog1-section-area .blog-boxarea .content-area .head { 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: block; transition: all 0.4s; } .blog1-section-area .blog-boxarea .content-area .head:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog1-section-area .blog-boxarea .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: 400; line-height: 28px; } .blog1-section-area .blog-boxarea .content-area .readmore { 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: 32px; display: block; transition: all 0.4s; } .blog1-section-area .blog-boxarea .content-area .readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .blog1-section-area .blog-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog1-section-area .blog-boxarea .content-area .readmore:hover i { transform: rotate(0); transition: all 0.4s; } .blog2-section-area { position: relative; z-index: 1; background: #F6F6F6; } .blog2-section-area .blog-boxarea { margin-bottom: 30px; transition: all 0.4s; } .blog2-section-area .blog-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .blog2-section-area .blog-boxarea .img1 { overflow: hidden; transition: all 0.4s; } .blog2-section-area .blog-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .blog2-section-area .blog-boxarea .content-area { position: relative; z-index: 1; background: var(--ztc-text-text-1); padding: 24px; } .blog2-section-area .blog-boxarea .content-area ul li { display: inline-block; margin: 0 16px 0 0; } .blog2-section-area .blog-boxarea .content-area ul li a { color: var(--Text-Color, #03071E); 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; } .blog2-section-area .blog-boxarea .content-area ul li a i { margin: 0 4px 0 0; } .blog2-section-area .blog-boxarea .content-area .head { 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: block; transition: all 0.4s; } .blog2-section-area .blog-boxarea .content-area .head:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } .blog2-section-area .blog-boxarea .content-area .readmore { 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: 32px; display: block; transition: all 0.4s; } .blog2-section-area .blog-boxarea .content-area .readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .blog2-section-area .blog-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } .blog2-section-area .blog-boxarea .content-area .readmore:hover i { transform: rotate(0); transition: all 0.4s; } .blog3-section-area { position: relative; z-index: 1; } .blog3-section-area .blog-boxarea { margin-bottom: 30px; transition: all 0.4s; border-radius: 4px; } .blog3-section-area .blog-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .blog3-section-area .blog-boxarea:hover .content-area { border-radius: 0px 0px 7px 7px; background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); transition: all 0.4s; } .blog3-section-area .blog-boxarea .img1 { overflow: hidden; transition: all 0.4s; border-radius: 4px 4px 0 0; } .blog3-section-area .blog-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; border-radius: 4px 4px 0 0; } .blog3-section-area .blog-boxarea .content-area { position: relative; z-index: 1; background: #F6F6F6; padding: 24px; transition: all 0.4s; } .blog3-section-area .blog-boxarea .content-area ul li { display: inline-block; margin: 0 16px 0 0; } .blog3-section-area .blog-boxarea .content-area ul li a { color: var(--Text-Color, #03071E); 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; } .blog3-section-area .blog-boxarea .content-area ul li a i { margin: 0 4px 0 0; } .blog3-section-area .blog-boxarea .content-area .head { 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: block; transition: all 0.4s; } .blog3-section-area .blog-boxarea .content-area .head:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } .blog3-section-area .blog-boxarea .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-regular); line-height: 26px; } .blog3-section-area .blog-boxarea .content-area .readmore { 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: 32px; display: block; transition: all 0.4s; } .blog3-section-area .blog-boxarea .content-area .readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .blog3-section-area .blog-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } .blog3-section-area .blog-boxarea .content-area .readmore:hover i { transform: rotate(0); transition: all 0.4s; } .blog4-section-area { position: relative; z-index: 1; } .blog4-section-area .blog-boxarea { margin-bottom: 30px; transition: all 0.4s; border-radius: 4px; } .blog4-section-area .blog-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .blog4-section-area .blog-boxarea:hover .content-area { border-radius: 0px 0px 7px 7px; background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); transition: all 0.4s; } .blog4-section-area .blog-boxarea .img1 { overflow: hidden; transition: all 0.4s; border-radius: 4px 4px 0 0; } .blog4-section-area .blog-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; border-radius: 4px 4px 0 0; } .blog4-section-area .blog-boxarea .content-area { position: relative; z-index: 1; background: #F6F6F6; padding: 24px; transition: all 0.4s; } .blog4-section-area .blog-boxarea .content-area ul li { display: inline-block; margin: 0 16px 0 0; } .blog4-section-area .blog-boxarea .content-area ul li a { color: var(--Text-Color, #03071E); 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; } .blog4-section-area .blog-boxarea .content-area ul li a i { margin: 0 4px 0 0; } .blog4-section-area .blog-boxarea .content-area .head { 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: block; transition: all 0.4s; } .blog4-section-area .blog-boxarea .content-area .head:hover { color: var(--ztc-text-text-7); transition: all 0.4s; } .blog4-section-area .blog-boxarea .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-regular); line-height: 26px; } .blog4-section-area .blog-boxarea .content-area .readmore { 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: 32px; display: block; transition: all 0.4s; } .blog4-section-area .blog-boxarea .content-area .readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .blog4-section-area .blog-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-7); transition: all 0.4s; } .blog4-section-area .blog-boxarea .content-area .readmore:hover i { transform: rotate(0); transition: all 0.4s; } .blog5-section-area { position: relative; z-index: 1; } .blog5-section-area .blog5-boxarea { margin-bottom: 30px; transition: all 0.4s; border-radius: 4px; background: #F6F8FA; padding: 24px; } .blog5-section-area .blog5-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; border-radius: 4px; } .blog5-section-area .blog5-boxarea .img1 { overflow: hidden; transition: all 0.4s; border-radius: 4px; } .blog5-section-area .blog5-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; border-radius: 4px; } .blog5-section-area .blog5-boxarea .content-area { position: relative; z-index: 1; } .blog5-section-area .blog5-boxarea .content-area ul li { display: inline-block; margin: 0 16px 0 0; } .blog5-section-area .blog5-boxarea .content-area ul li a { color: var(--Text-Color, #03071E); 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; } .blog5-section-area .blog5-boxarea .content-area ul li a i { margin: 0 4px 0 0; } .blog5-section-area .blog5-boxarea .content-area .head { 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: block; transition: all 0.4s; } .blog5-section-area .blog5-boxarea .content-area .head:hover { color: var(--ztc-text-text-8); transition: all 0.4s; } .blog5-section-area .blog5-boxarea .content-area p { color: var(--Paragraph-Color, #6C757D); 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: 28px; } .blog5-section-area .blog5-boxarea .content-area .readmore { 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: 32px; display: block; transition: all 0.4s; } .blog5-section-area .blog5-boxarea .content-area .readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .blog5-section-area .blog5-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-8); transition: all 0.4s; } .blog5-section-area .blog5-boxarea .content-area .readmore:hover i { transform: rotate(0); transition: all 0.4s; } .blog-inner-section-area { position: relative; z-index: 1; } .blog-inner-section-area .blog-boxarea { margin-bottom: 30px; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea:hover { background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); transition: all 0.4s; } .blog-inner-section-area .blog-boxarea:hover .content-area { background: #fff; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .img1 { overflow: hidden; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .content-area { position: relative; z-index: 1; background: #F6F8FA; padding: 24px; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .content-area ul li { display: inline-block; margin: 0 16px 0 0; } .blog-inner-section-area .blog-boxarea .content-area ul li a { color: var(--Text-Color, #03071E); 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-inner-section-area .blog-boxarea .content-area ul li a i { margin: 0 4px 0 0; } .blog-inner-section-area .blog-boxarea .content-area .head { 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: 30px; display: block; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .content-area .head:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .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: 400; line-height: 28px; } .blog-inner-section-area .blog-boxarea .content-area .readmore { 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: 32px; display: block; transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .content-area .readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .content-area .readmore:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog-inner-section-area .blog-boxarea .content-area .readmore:hover i { transform: rotate(0); transition: all 0.4s; } .blog-inner-area { position: relative; z-index: 1; } .blog-inner-area .blog-widget-area { position: sticky; top: 100px; } .blog-inner-area .blog-widget-area h3 { color: var(--Text-Color, #03071E); 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-inner-area .blog-widget-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: 400; line-height: 26px; } .blog-inner-area .blog-widget-area .search { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .blog-inner-area .blog-widget-area .search form { position: relative; z-index: 1; } .blog-inner-area .blog-widget-area .search form input { width: 100%; background: #FFF; color: var(--colors-dark-normal-active, #3D4C5E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; padding: 16px; } .blog-inner-area .blog-widget-area .search form button { border: none; outline: none; position: absolute; right: 16px; top: 16px; background: none; } .blog-inner-area .blog-widget-area .categories { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .blog-inner-area .blog-widget-area .categories 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: 500; line-height: 16px; display: block; transition: all 0.4s; padding: 19px 16px; background: var(--ztc-bg-bg-1); margin-top: 16px; } .blog-inner-area .blog-widget-area .categories ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; color: var(--ztc-text-text-2); } .blog-inner-area .blog-widget-area .download-area { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .blog-inner-area .blog-widget-area .download-area .btn-area1 a { width: 100%; text-align: center; } .blog-inner-area .blog-widget-area .download-area .btn-area1 a i { transform: rotate(0); margin: 0 4px 0 0; } .blog-inner-area .blog-widget-area .download-area .btn-area1 .header-btn1.btn2 { background: transparent; border: 1px solid var(--ztc-text-text-2); } .blog-inner-area .blog-widget-area .blog-posts-area { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-posts .img1 { position: absolute; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-posts .img1 img { height: 82px; width: 82px; -o-object-fit: cover; object-fit: cover; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-posts .content { padding-left: 110px; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-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: 500; line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 0; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-posts .content ul li a i { margin: 0 6px 0 0; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-posts .content a { color: var(--Text-Color, #03071E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 500; line-height: 26px; display: inline-block; transition: all 0.4s; padding-top: 10px; } .blog-inner-area .blog-widget-area .blog-posts-area .blog-posts .content a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog-inner-area .blog-widget-area .contact-widget-area { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area { margin-top: 24px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area input { border: 1px solid rgba(255, 255, 255, 0.1); background: #FFF; width: 100%; color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; padding: 22px 16px; height: 60px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area input::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area input::placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area textarea { border: 1px solid rgba(255, 255, 255, 0.1); background: #FFF; width: 100%; color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; padding: 22px 16px; height: 180px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area textarea::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area textarea::placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } .blog-inner-area .blog-widget-area .contact-widget-area .input-area button { border: none; outline: none; } .blog-inner-area .blog-widget-others.padding-right { padding: 0 50px 0 0 !important; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others.padding-right { padding: 0 !important; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .blog-inner-area .blog-widget-others.padding-right { padding: 0 !important; } } .blog-inner-area .blog-widget-others { padding: 0 0 0 50px; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .blog-inner-area .blog-widget-others { padding: 0; } } .blog-inner-area .blog-widget-others 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; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others h3 { font-size: var(--ztc-font-size-font-s28); line-height: 34px; } } .blog-inner-area .blog-widget-others 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: 400; line-height: 28px; /* 175% */ } .blog-inner-area .blog-widget-others .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .blog-inner-area .blog-widget-others ul.date li { display: inline-block; margin: 0 16px 0 0; } .blog-inner-area .blog-widget-others ul.date li a { color: var(--Text-Color, #03071E); 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-inner-area .blog-widget-others ul.date li a i { margin: 0 4px 0 0; } .blog-inner-area .blog-widget-others .list-area ul li { color: var(--Text-Color, #03071E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-style: normal; font-weight: 500; line-height: 18px; margin-top: 20px; } .blog-inner-area .blog-widget-others .list-area ul li img { margin: 0 6px 0 0; } .blog-inner-area .blog-widget-others .pera-boxarea { background: #F6F8FA; padding: 32px 70px; text-align: center; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others .pera-boxarea { padding: 32px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .blog-inner-area .blog-widget-others .pera-boxarea { padding: 32px; } } .blog-inner-area .blog-widget-others .pera-boxarea p { color: var(--Home-3-Text-color, #090B0E); text-align: center; font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); font-style: normal; font-weight: 600; line-height: 32px; } .blog-inner-area .blog-widget-others .pera-boxarea .auhtor-img img { height: 40px; width: 40px; border-radius: 50%; -o-object-fit: cover; object-fit: cover; } .blog-inner-area .blog-widget-others .pera-boxarea .auhtor-img a { color: var(--Home-3-Text-color, #090B0E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s20); font-style: normal; font-weight: 600; line-height: 20px; display: inline-block; padding-left: 8px; } .blog-inner-area .blog-widget-others .tag-social-area { display: flex; align-items: center; justify-content: space-between; padding: 30px 0; border-top: 1px solid #CED4DA; border-bottom: 1px solid #CED4DA; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others .tag-social-area { display: inline-block; } } .blog-inner-area .blog-widget-others .tag-social-area .tags { display: flex; align-items: center; } .blog-inner-area .blog-widget-others .tag-social-area .tags h3 { font-size: var(--ztc-font-size-font-s24); line-height: 24px; } .blog-inner-area .blog-widget-others .tag-social-area .tags ul li { display: inline-block; } .blog-inner-area .blog-widget-others .tag-social-area .tags ul li 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: 700; line-height: 18px; display: inline-block; transition: all 0.4s; background: #F6F8FA; padding: 12px 16px; margin: 0 0 0 16px; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others .tag-social-area .tags ul li a { margin-top: 10px; } } .blog-inner-area .blog-widget-others .tag-social-area .tags ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; } .blog-inner-area .blog-widget-others .tag-social-area .social { display: flex; align-items: center; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others .tag-social-area .social { margin-top: 20px; } } .blog-inner-area .blog-widget-others .tag-social-area .social h3 { font-size: var(--ztc-font-size-font-s24); line-height: 24px; } .blog-inner-area .blog-widget-others .tag-social-area .social ul li { display: inline-block; } .blog-inner-area .blog-widget-others .tag-social-area .social ul li a { background: rgba(252, 235, 200, 0.5); height: 40px; width: 40px; text-align: center; transition: all 0.4s; display: inline-block; color: var(--ztc-text-text-2); line-height: 40px; border-radius: 50%; margin: 0 0 0 16px; } .blog-inner-area .blog-widget-others .tag-social-area .social ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea { position: relative; z-index: 1; background: #F6F8FA; padding: 24px; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes { display: flex; align-items: center; justify-content: space-between; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes .comments-auhtor-box { display: flex; align-items: center; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes .comments-auhtor-box .img3 img { height: 70px; width: 70px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes .comments-auhtor-box .content { padding-left: 16px; } .blog-inner-area .blog-widget-others .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-s24); font-style: normal; font-weight: 700; line-height: 24px; display: block; transition: all 0.4s; } .blog-inner-area .blog-widget-others .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: 400; line-height: 16px; display: block; transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes .reply { color: var(--Home-3-Text-color, #090B0E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 500; line-height: 16px; display: inline-block; transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes .reply:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea .comments-boxes .reply i { margin: 0 4px 0 0; } .blog-inner-area .blog-widget-others .comments-boxarea2 { position: relative; z-index: 1; background: #F6F8FA; padding: 24px; margin: 0 0 0 80px; } @media (max-width: 767px) { .blog-inner-area .blog-widget-others .comments-boxarea2 { margin: 0; } } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes { display: flex; align-items: center; justify-content: space-between; } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes .comments-auhtor-box { display: flex; align-items: center; } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes .comments-auhtor-box .img3 img { height: 70px; width: 70px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes .comments-auhtor-box .content { padding-left: 16px; } .blog-inner-area .blog-widget-others .comments-boxarea2 .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-s24); font-style: normal; font-weight: 700; line-height: 24px; display: block; transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea2 .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: 400; line-height: 16px; display: block; transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes .reply { color: var(--Home-3-Text-color, #090B0E); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 500; line-height: 16px; display: inline-block; transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes .reply:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .blog-inner-area .blog-widget-others .comments-boxarea2 .comments-boxes .reply i { margin: 0 4px 0 0; } .blog-inner-area .blog-widget-others .contact-form-area { background: #F6F8FA; padding: 32px; position: relative; z-index: 1; } .blog-inner-area .blog-widget-others .contact-form-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: 600; line-height: 24px; } .blog-inner-area .blog-widget-others .contact-form-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: 400; line-height: 16px; } .blog-inner-area .blog-widget-others .contact-form-area .input-area { margin-top: 20px; } .blog-inner-area .blog-widget-others .contact-form-area .input-area input { 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: 400; line-height: 16px; background: var(--ztc-bg-bg-1); width: 100%; padding: 16px; } .blog-inner-area .blog-widget-others .contact-form-area .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: 400; line-height: 16px; } .blog-inner-area .blog-widget-others .contact-form-area .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: 400; line-height: 16px; } .blog-inner-area .blog-widget-others .contact-form-area .input-area textarea { 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: 400; line-height: 16px; background: var(--ztc-bg-bg-1); width: 100%; padding: 16px; height: 140px; } .blog-inner-area .blog-widget-others .contact-form-area .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: 400; line-height: 16px; } .blog-inner-area .blog-widget-others .contact-form-area .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: 400; line-height: 16px; } .blog-inner-area .blog-widget-others .contact-form-area button { border: none; outline: none; } /*============= BLOG CSS AREA ENDS ===============*/ /*============= FOOTER CSS AREA ===============*/ .footer1-section-area { position: relative; z-index: 1; padding: 100px 0 32px; } @media (max-width: 767px) { .footer1-section-area { padding: 60px 0 32px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer1-section-area { padding: 60px 0 32px; } } @media (max-width: 767px) { .footer1-section-area .footer-logo { margin-bottom: 30px; text-align: center; } } .footer1-section-area .footer-logo img { width: 180px; height: 32px; -o-object-fit: cover; object-fit: cover; } .footer1-section-area .footer-logo 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-regular); line-height: 26px; } .footer1-section-area .footer-logo ul li { display: inline-block; } .footer1-section-area .footer-logo ul li a { height: 40px; width: 40px; text-align: center; line-height: 40px; display: inline-block; transition: all 0.4s; border-radius: 50%; background: #FCEBC8; color: var(--ztc-text-text-4); margin: 0 4px 0 0; } .footer1-section-area .footer-logo ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; color: var(--ztc-bg-bg-2); } .footer1-section-area .footer-content { padding-left: 50px; } @media (max-width: 767px) { .footer1-section-area .footer-content { padding: 0; text-align: center; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer1-section-area .footer-content { padding: 0; padding-bottom: 20px; } } .footer1-section-area .footer-content 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; } .footer1-section-area .footer-content 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-regular); line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 24px; } .footer1-section-area .footer-content ul li a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; padding-left: 5px; } @media (max-width: 767px) { .footer1-section-area .footer-content2 { text-align: center; } } .footer1-section-area .footer-content2 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; } .footer1-section-area .footer-content2 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-regular); line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 24px; } .footer1-section-area .footer-content2 ul li a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; padding-left: 5px; } @media (max-width: 767px) { .footer1-section-area .footer-form { margin-top: 30px; text-align: center; } } .footer1-section-area .footer-form 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; } .footer1-section-area .footer-form form { position: relative; z-index: 1; } .footer1-section-area .footer-form form input { background: #F7F8FA; width: 100%; padding: 16px 16px; font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); line-height: 16px; font-weight: var(--ztc-weight-semibold); } .footer1-section-area .footer-form form input::-moz-placeholder { color: #575E63; 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; } .footer1-section-area .footer-form form input::placeholder { color: #575E63; 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; } .footer1-section-area .footer-form form button { border: none; outline: none; position: absolute; right: 0; top: 0; } .footer1-section-area .copyright-area { display: flex; align-items: center; justify-content: space-between; padding: 30px 0 0 0; border-top: 1px solid #E5E7EB; margin-top: 30px; } @media (max-width: 767px) { .footer1-section-area .copyright-area { display: inline-block; text-align: center; } } .footer1-section-area .copyright-area 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-regular); line-height: 24px; opacity: 0.7; } .footer1-section-area .copyright-area ul li 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-regular); line-height: 18px; display: inline-block; transition: all 0.4s; opacity: 0.7; } .footer1-section-area .copyright-area ul li a span { margin: 0 4px; } .footer1-section-area .copyright-area ul li a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } @media (max-width: 767px) { .footer1-section-area .copyright-area ul li a { padding-top: 20px; } } .footer2-section-area { position: relative; z-index: 1; padding: 240px 0 32px; background: var(--ztc-bg-bg-2); } @media (max-width: 767px) { .footer2-section-area .footer-logo { margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer2-section-area .footer-logo { margin-bottom: 30px; } } .footer2-section-area .footer-logo img { width: 180px; height: 32px; -o-object-fit: cover; object-fit: cover; filter: brightness(0) invert(1); } .footer2-section-area .footer-logo 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-regular); line-height: 26px; opacity: 80%; } .footer2-section-area .footer-logo ul li { display: inline-block; } .footer2-section-area .footer-logo ul li a { height: 50px; width: 50px; text-align: center; line-height: 50px; display: inline-block; transition: all 0.4s; border-radius: 50%; color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-1); margin: 0 4px 0 0; font-size: var(--ztc-font-size-font-s24); } .footer2-section-area .footer-logo ul li a:hover { background: var(--ztc-bg-bg-5); transition: all 0.4s; color: var(--ztc-bg-bg-1); border: 1px solid var(--ztc-bg-bg-5); } .footer2-section-area .footer-logo form { position: relative; z-index: 1; } .footer2-section-area .footer-logo form input { background: transparent; width: 62%; padding: 16px 16px; font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); line-height: 16px; font-weight: var(--ztc-weight-semibold); border: 1px solid #686A78; color: var(--ztc-text-text-1); } .footer2-section-area .footer-logo form input::-moz-placeholder { 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-regular); line-height: 16px; opacity: 80%; } .footer2-section-area .footer-logo form input::placeholder { 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-regular); line-height: 16px; opacity: 80%; } .footer2-section-area .footer-logo form button.header-btn2-h2 { border: none; outline: none; position: absolute; right: 0; top: 0; } .footer2-section-area .footer-logo form button.header-btn2-h2:hover { color: var(--ztc-text-text-5); } .footer2-section-area .footer-logo form button.header-btn2-h2::after { background: var(--ztc-bg-bg-1) !important; } .footer2-section-area .footer-content { padding-left: 50px; } @media (max-width: 767px) { .footer2-section-area .footer-content { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer2-section-area .footer-content { padding: 0; padding-bottom: 20px; } } .footer2-section-area .footer-content 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; } .footer2-section-area .footer-content 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-regular); line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 24px; opacity: 0.8; } .footer2-section-area .footer-content ul li a:hover { color: var(--ztc-text-text-5); transition: all 0.4s; padding-left: 5px; } .footer2-section-area .footer-content2 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; } .footer2-section-area .footer-content2 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-regular); line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 24px; opacity: 0.8; } .footer2-section-area .footer-content2 ul li a:hover { color: var(--ztc-text-text-5); transition: all 0.4s; padding-left: 5px; } @media (max-width: 767px) { .footer2-section-area .contact-form { margin-top: 30px; } } .footer2-section-area .contact-form 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; } .footer2-section-area .contact-form .icons-area { display: flex; align-items: center; } .footer2-section-area .contact-form .icons-area img { margin: 0 12px 0 0; } .footer2-section-area .contact-form .icons-area .text a { color: rgba(255, 255, 255, 0.8); 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: 28px; display: inline-block; transition: all 0.4s; } .footer2-section-area .contact-form .icons-area .text a:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } .footer2-section-area .copyright-area { display: flex; align-items: center; justify-content: space-between; padding: 30px 0 0 0; border-top: 1px solid #686A78; margin-top: 30px; } @media (max-width: 767px) { .footer2-section-area .copyright-area { display: inline-block; text-align: center; } } .footer2-section-area .copyright-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-regular); line-height: 24px; opacity: 0.8; } .footer2-section-area .copyright-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-regular); line-height: 18px; display: inline-block; transition: all 0.4s; opacity: 0.8; } .footer2-section-area .copyright-area ul li a span { margin: 0 4px; } .footer2-section-area .copyright-area ul li a:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } @media (max-width: 767px) { .footer2-section-area .copyright-area ul li a { padding-top: 20px; } } .footer3-section-area { position: relative; z-index: 1; padding: 100px 0 32px; } @media (max-width: 767px) { .footer3-section-area { padding: 60px 0 32px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer3-section-area { padding: 60px 0 32px; } } @media (max-width: 767px) { .footer3-section-area .footer-logo { margin-bottom: 30px; text-align: center; } } .footer3-section-area .footer-logo img { width: 180px; height: 32px; -o-object-fit: cover; object-fit: cover; } .footer3-section-area .footer-logo 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-regular); line-height: 26px; } .footer3-section-area .footer-logo ul li { display: inline-block; } .footer3-section-area .footer-logo ul li a { height: 40px; width: 40px; text-align: center; line-height: 40px; display: inline-block; transition: all 0.4s; border-radius: 50%; background: #FFF0E7; color: var(--ztc-text-text-6); margin: 0 4px 0 0; } .footer3-section-area .footer-logo ul li a:hover { background: var(--ztc-bg-bg-6); transition: all 0.4s; color: var(--ztc-bg-bg-1); } .footer3-section-area .footer-content2 { padding-left: 50px; } @media (max-width: 767px) { .footer3-section-area .footer-content2 { padding-left: 0; } } .footer3-section-area .footer-content2 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; } .footer3-section-area .footer-content2 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; padding-top: 24px; } .footer3-section-area .footer-content2 ul li a:hover { color: var(--ztc-text-text-6); transition: all 0.4s; padding-left: 5px; } .footer3-section-area .contact-form { padding-left: 50px; } @media (max-width: 767px) { .footer3-section-area .contact-form { padding-left: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer3-section-area .contact-form { padding-left: 0; } } .footer3-section-area .contact-form 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; } .footer3-section-area .contact-form .icons-area { display: flex; align-items: center; } .footer3-section-area .contact-form .icons-area img { margin: 0 12px 0 0; filter: brightness(0); } .footer3-section-area .contact-form .icons-area .text 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: 28px; display: inline-block; transition: all 0.4s; } .footer3-section-area .contact-form .icons-area .text a:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } @media (max-width: 767px) { .footer3-section-area .footer-form { margin-top: 30px; text-align: center; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer3-section-area .footer-form { margin-top: 30px; } } .footer3-section-area .footer-form 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; } .footer3-section-area .footer-form form { position: relative; z-index: 1; } .footer3-section-area .footer-form form input { background: #F7F8FA; width: 100%; padding: 16px 16px; font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); line-height: 16px; font-weight: var(--ztc-weight-semibold); border-radius: 50px; } .footer3-section-area .footer-form form input::-moz-placeholder { color: #575E63; 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; } .footer3-section-area .footer-form form input::placeholder { color: #575E63; 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; } .footer3-section-area .footer-form form button { border: none; outline: none; position: absolute; right: 0; top: 0; } .footer3-section-area .copyright-area { display: flex; align-items: center; justify-content: space-between; padding: 30px 0 0 0; border-top: 1px solid #E5E7EB; margin-top: 30px; } @media (max-width: 767px) { .footer3-section-area .copyright-area { display: inline-block; text-align: center; } } .footer3-section-area .copyright-area 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-regular); line-height: 24px; opacity: 0.7; } .footer3-section-area .copyright-area ul li 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-regular); line-height: 18px; display: inline-block; transition: all 0.4s; opacity: 0.7; } .footer3-section-area .copyright-area ul li a span { margin: 0 4px; } .footer3-section-area .copyright-area ul li a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } @media (max-width: 767px) { .footer3-section-area .copyright-area ul li a { padding-top: 20px; } } .footer4-section-area { position: relative; z-index: 1; padding: 100px 0 32px; background: var(--ztc-bg-bg-2); } @media (max-width: 767px) { .footer4-section-area { padding: 50px 0 32px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer4-section-area { padding: 50px 0 32px; } } @media (max-width: 767px) { .footer4-section-area .footer-logo { margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer4-section-area .footer-logo { margin-bottom: 30px; } } .footer4-section-area .footer-logo img { width: 180px; height: 32px; -o-object-fit: cover; object-fit: cover; filter: brightness(0) invert(1); } .footer4-section-area .footer-logo 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-regular); line-height: 26px; opacity: 80%; } .footer4-section-area .footer-logo ul li { display: inline-block; } .footer4-section-area .footer-logo ul li a { height: 50px; width: 50px; text-align: center; line-height: 50px; display: inline-block; transition: all 0.4s; border-radius: 50%; color: var(--ztc-text-text-1); border: 1px solid var(--ztc-text-text-1); margin: 0 4px 0 0; font-size: var(--ztc-font-size-font-s24); } .footer4-section-area .footer-logo ul li a:hover { background: var(--ztc-bg-bg-7); transition: all 0.4s; color: var(--ztc-bg-bg-1); border: 1px solid var(--ztc-bg-bg-7); } .footer4-section-area .footer-content { padding-left: 50px; } @media (max-width: 767px) { .footer4-section-area .footer-content { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer4-section-area .footer-content { padding: 0; padding-bottom: 20px; } } .footer4-section-area .footer-content 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; } .footer4-section-area .footer-content 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-regular); line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 24px; opacity: 0.8; } .footer4-section-area .footer-content ul li a:hover { color: var(--ztc-text-text-7); transition: all 0.4s; padding-left: 5px; } .footer4-section-area .footer-content2 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; } .footer4-section-area .footer-content2 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-regular); line-height: 16px; display: inline-block; transition: all 0.4s; padding-top: 24px; opacity: 0.8; } .footer4-section-area .footer-content2 ul li a:hover { color: var(--ztc-text-text-7); transition: all 0.4s; padding-left: 5px; } @media (max-width: 767px) { .footer4-section-area .contact-form { margin-top: 30px; } } .footer4-section-area .contact-form 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; } .footer4-section-area .contact-form .icons-area { display: flex; align-items: center; } .footer4-section-area .contact-form .icons-area img { margin: 0 12px 0 0; } .footer4-section-area .contact-form .icons-area .text a { color: rgba(255, 255, 255, 0.8); 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: 28px; display: inline-block; transition: all 0.4s; } .footer4-section-area .contact-form .icons-area .text a:hover { color: var(--ztc-text-text-7); transition: all 0.4s; } .footer4-section-area .copyright-area { display: flex; align-items: center; justify-content: space-between; padding: 30px 0 0 0; border-top: 1px solid #686A78; margin-top: 30px; } @media (max-width: 767px) { .footer4-section-area .copyright-area { display: inline-block; text-align: center; } } .footer4-section-area .copyright-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-regular); line-height: 24px; opacity: 0.8; } .footer4-section-area .copyright-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-regular); line-height: 18px; display: inline-block; transition: all 0.4s; opacity: 0.8; } .footer4-section-area .copyright-area ul li a span { margin: 0 4px; } .footer4-section-area .copyright-area ul li a:hover { color: var(--ztc-text-text-7); transition: all 0.4s; } @media (max-width: 767px) { .footer4-section-area .copyright-area ul li a { padding-top: 20px; } } .footer5-section-area { position: relative; z-index: 1; padding: 100px 0 32px; } @media (max-width: 767px) { .footer5-section-area { padding: 50px 0 32px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer5-section-area { padding: 50px 0 32px; } } @media (max-width: 767px) { .footer5-section-area .footer-logo { margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer5-section-area .footer-logo { margin-bottom: 30px; } } .footer5-section-area .footer-logo img { width: 180px; height: 32px; -o-object-fit: cover; object-fit: cover; } .footer5-section-area .footer-logo 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-regular); line-height: 26px; } .footer5-section-area .footer-logo ul li { display: inline-block; } .footer5-section-area .footer-logo ul li a { height: 40px; width: 40px; text-align: center; line-height: 40px; display: inline-block; transition: all 0.4s; border-radius: 50%; color: var(--ztc-text-text-8); background: #E7EFFE; margin: 0 4px 0 0; font-size: var(--ztc-font-size-font-s16); } .footer5-section-area .footer-logo ul li a:hover { background: var(--ztc-bg-bg-8); transition: all 0.4s; color: var(--ztc-bg-bg-1); } .footer5-section-area .footer-content { padding-left: 50px; } @media (max-width: 767px) { .footer5-section-area .footer-content { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .footer5-section-area .footer-content { padding: 0; padding-bottom: 20px; } } .footer5-section-area .footer-content 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; } .footer5-section-area .footer-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; padding-top: 24px; } .footer5-section-area .footer-content ul li a:hover { color: var(--ztc-text-text-8); transition: all 0.4s; padding-left: 5px; } .footer5-section-area .footer-content2 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; } .footer5-section-area .footer-content2 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; padding-top: 24px; } .footer5-section-area .footer-content2 ul li a:hover { color: var(--ztc-text-text-8); transition: all 0.4s; padding-left: 5px; } @media (max-width: 767px) { .footer5-section-area .contact-form { margin-top: 30px; } } .footer5-section-area .contact-form 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; } .footer5-section-area .contact-form .icons-area { display: flex; align-items: center; } .footer5-section-area .contact-form .icons-area img { margin: 0 12px 0 0; filter: brightness(0); } .footer5-section-area .contact-form .icons-area .text 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: 28px; display: inline-block; transition: all 0.4s; } .footer5-section-area .contact-form .icons-area .text a:hover { color: var(--ztc-text-text-8); transition: all 0.4s; } .footer5-section-area .copyright-area { display: flex; align-items: center; justify-content: space-between; padding: 30px 0 0 0; border-top: 1px solid #e4e4e4; margin-top: 50px; } @media (max-width: 767px) { .footer5-section-area .copyright-area { display: inline-block; text-align: center; } } .footer5-section-area .copyright-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-regular); line-height: 24px; } .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-regular); line-height: 18px; display: inline-block; transition: all 0.4s; } .footer5-section-area .copyright-area ul li a span { margin: 0 4px; } .footer5-section-area .copyright-area ul li a:hover { color: var(--ztc-text-text-8); transition: all 0.4s; } @media (max-width: 767px) { .footer5-section-area .copyright-area ul li a { padding-top: 20px; } } /*============= FOOTER CSS AREA ===============*/ /*============= HEADER CSS AREA ===============*/ .homepage1-body, html { overflow-x: hidden !important; } .commingsoon { height: 280px !important; width: 100%; -o-object-fit: cover; object-fit: cover; filter: blur(5px); border-radius: 4px; } .homepage1-body { overflow-x: hidden; } .homepage1-body .header-area.homepage1 { position: absolute; width: 100%; z-index: 9999; padding: 16px 0; transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements { display: flex; align-items: center; justify-content: space-between; position: relative; transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu { position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li { display: inline-block; position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb { transition: all 0.4s; position: relative; z-index: 1; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.7; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .homemenu-btn { top: 42%; visibility: visible; opacity: 1; transition: all 0.6s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 { position: relative; z-index: 1; overflow: hidden; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-text-text-2); opacity: 0; border-radius: 4px; transform: scale(0.8); z-index: 1; visibility: hidden; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 img { height: 100%; width: 100%; border-radius: 4px; transition: all 0.4s; border: 1px solid #E5E7EB; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn { position: absolute; top: 30%; z-index: 2; visibility: hidden; opacity: 0; text-align: center; transition: all 0.6s; margin: 0 auto; left: 25%; right: 25%; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn1 { color: var(--ztc-text-text-1); transition: all 0.4s; padding: 6px 15px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-content a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); transition: all 0.4s; margin-top: 20px; text-align: center; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover .tp-submenu { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover ul.dropdown-padding { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); display: inline-block; transition: all 0.4s; padding: 0 20px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover > a { transition: all 0.4s; color: var(--ztc-text-text-4) !important; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; z-index: 1; transition: all 0.4s; border-radius: 5px; padding: 15px; left: -160px; width: 1100px; max-height: 600px; overflow: hidden; overflow-y: scroll; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; width: 225px; z-index: 1; transition: all 0.4s; border-radius: 5px; padding: 15px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu { position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a { transition: all 0.4s; padding-left: 25px; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a::after { background: var(--ztc-text-text-4); transition: all 0.4s; visibility: visible; opacity: 1; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li { display: block; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a { font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-medium); transition: all 0.4s; padding: 8px; display: inline-block; position: relative; z-index: 1; border-radius: 4px; color: var(--ztc-text-text-2); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 20%; border-radius: 4px; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a:hover { padding-left: 25px; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after { border-radius: 4px; visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .header-area.homepage1.sticky { position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, 0, 0); z-index: 111; animation-name: fade-in-down; animation-duration: 1s; animation-fill-mode: forwards; background: var(--ztc-text-text-1); transition: all 0.4s; } /*============= HEADER CSS AREA ENDS ===============*/ /*============= HEADER CSS AREA ENDS ===============*/ .homepage1-body, html { overflow-x: hidden !important; } .homepage1-body { overflow-x: hidden; } .homepage1-body .header-area.homepage1 { position: absolute; width: 100%; z-index: 9999; padding: 16px 0; transition: all 0.4s; border-bottom: 1px solid rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.01); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); } .homepage1-body .header-area.homepage1 nav#navbar-example2 { display: block; padding: 0; } .homepage1-body .header-area.homepage1 nav#navbar-example2 ul li a.nav-link.active { color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements { display: flex; align-items: center; justify-content: space-between; position: relative; transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements .site-logo { height: 32px; width: 180px; -o-object-fit: contain; object-fit: contain; } .homepage1-body .header-area.homepage1 .header-elements .all-images-menu { display: flex; align-items: center; } .homepage1-body .header-area.homepage1 .header-elements .main-menu { position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li.menu-small a { display: flex !important; align-items: center; justify-content: space-between; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li.menu-small:hover ul.small-menu { visibility: visible; opacity: 1; transition: all 0.4s; top: 10px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul ul.small-menu { position: absolute; background: #fff; width: 225px; left: 200px; border-radius: 4px; padding: 15px; top: 0; transition: all 0.4s; visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul ul.small-menu.service-small { width: 280px !important; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a.plus i::before { content: "+"; font-size: var(--ztc-font-size-font-s12); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li { display: inline-block; position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb { transition: all 0.4s; position: relative; z-index: 1; margin: 0 20px 20px 0; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.4; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .homemenu-btn { top: 37%; visibility: visible; opacity: 1; transition: all 0.6s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 { position: relative; z-index: 1; overflow: hidden; height: 100%; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); z-index: 1; visibility: hidden; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 img { height: 100%; width: 100%; transition: all 0.4s; border: 1px solid #E5E7EB; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn { position: absolute; top: 20%; z-index: 2; visibility: hidden; opacity: 0; text-align: center; transition: all 0.6s; margin: 0 auto; left: 14%; right: 14%; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn1 { 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; background: var(--ztc-bg-bg-3); padding: 16px 20px; position: relative; z-index: 1; width: 155px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn1 i { margin-left: 4px; transform: rotate(-45deg); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn1::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn1:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn1:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text { position: absolute; top: 0; left: 0; z-index: 1; top: 10px; left: 0px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text::after { position: absolute; content: ""; height: 100px; width: 100px; left: -71px; top: -66px; transition: all 0.4s; background: #FF6610; transform: rotate(-45deg); z-index: -1; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text h2 { font-size: var(--ztc-font-size-font-s12); font-weight: var(--ztc-weight-bold); font-family: var(--ztc-family-font1); transition: all 0.4s; line-height: var(--ztc-font-size-font-s12); color: var(--ztc-text-text-1); transform: rotate(-45deg); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu .homemenu-content a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); transition: all 0.4s; margin-top: 20px; text-align: center; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover .tp-submenu { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; position: absolute; transition: all 0.4s; transform: scale(1); top: 201.3%; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover ul.dropdown-padding { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover .mega-menu-all { opacity: 1; visibility: visible; transform: scale(1); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); display: inline-block; transition: all 0.4s; padding: 0 20px; color: var(--ztc-text-text-1); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li:hover > a { transition: all 0.4s; color: var(--ztc-text-text-4) !important; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .tp-submenu { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; z-index: 1; transition: all 0.4s; padding: 20px 0 0 20px; left: 50%; width: 1300px; max-height: 600px; overflow: hidden; overflow-y: scroll; display: block; top: 201.3%; transform: scale(1, 0); transform-origin: top; margin-left: -350px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; width: 225px; z-index: 1; transition: all 0.4s; padding: 15px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu { position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a { transition: all 0.4s; padding-left: 25px; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a::after { background: var(--ztc-text-text-4); transition: all 0.4s; visibility: visible; opacity: 1; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li { display: block; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a { font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-medium); transition: all 0.4s; padding: 8px; display: block; position: relative; z-index: 1; color: var(--ztc-text-text-2); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 20%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a:hover { padding-left: 25px; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: white; top: 201.3%; transform: scale(1, 0); z-index: 0; transition: all 0.4s; padding: 36px 0; left: -740px; width: 1300px; min-height: 300px; overflow-x: hidden; overflow-y: hidden; transform-origin: top; display: flex; padding: 32px; justify-content: space-between; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all ul li { display: block; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all ul li a { display: block !important; padding: 12px 0 0 0 !important; font-size: var(--ztc-font-size-font-s18); color: var(--ztc-text-text-2); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all ul li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 25%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all ul li a:hover { padding-left: 15px !important; color: var(--ztc-text-text-4); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all ul li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single { position: relative; width: 300px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single h3 { font-size: var(--ztc-font-size-font-s20); line-height: 20px; font-weight: 600; color: var(--ztc-text-text-2); position: relative; margin-bottom: 10px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images { position: relative; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .img1 { position: relative; z-index: 1; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0.6; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .img1 img { height: 342px; width: 500px; -o-object-fit: cover; object-fit: cover; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content { text-align: center; position: absolute; top: 50%; z-index: 1; padding: 40px; margin-top: -120px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content h3 { font-size: var(--ztc-font-size-font-s24); font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-bold); color: var(--ztc-text-text-1); transition: all 0.4s; line-height: 34px; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn1 { 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; background: var(--ztc-bg-bg-3); padding: 16px 20px !important; position: relative; z-index: 1; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn1 i { margin-left: 4px; transform: rotate(-45deg); } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn1::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn1:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn1:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .header-area.homepage1.sticky { position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, 0, 0); z-index: 111; animation-name: fade-in-down; animation-duration: 1s; animation-fill-mode: forwards; border-bottom: 1px solid rgba(255, 255, 255, 0.35); background: var(--ztc-bg-bg-2); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); transition: all 0.4s; background-image: url(../img/all-images/bg/cta-bg1.png); } .homepage2-body, html { overflow-x: hidden !important; } .homepage2-body { overflow-x: hidden; } .homepage2-body .header-area.homepage2 { position: absolute; width: 100%; z-index: 9999; transition: all 0.4s; background: var(--ztc-bg-bg-1); } .homepage2-body .header-area.homepage2 .header-top-area { padding: 16px 0; display: block; background: var(--ztc-bg-bg-2); transition: all 0.4s; visibility: visible; opacity: 1; } .homepage2-body .header-area.homepage2 .header-top-area .header-info-area { display: flex; align-items: center; justify-content: space-between; transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-top-area .header-info-area::after { position: absolute; width: 100%; content: ""; height: 40%; left: 0; top: 0; background: var(--ztc-bg-bg-2); transition: all 0.4s; z-index: -1; } .homepage2-body .header-area.homepage2 .header-top-area .header-info-area ul li { display: inline-block; margin: 0 24px 0 0; } .homepage2-body .header-area.homepage2 .header-top-area .header-info-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; } .homepage2-body .header-area.homepage2 .header-top-area .header-info-area ul li a i { margin: 0 6px 0 0; } .homepage2-body .header-area.homepage2 nav#navbar-example2 { display: block; padding: 0; } .homepage2-body .header-area.homepage2 nav#navbar-example2 ul li a.nav-link.active { color: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements { display: flex; align-items: center; justify-content: space-between; position: relative; transition: all 0.4s; padding: 16px 0; } .homepage2-body .header-area.homepage2 .header-elements .site-logo { height: 32px; width: 180px; -o-object-fit: contain; object-fit: contain; } .homepage2-body .header-area.homepage2 .header-elements .all-images-menu { display: flex; align-items: center; } .homepage2-body .header-area.homepage2 .header-elements .main-menu { position: relative; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li.menu-small a { display: flex !important; align-items: center; justify-content: space-between; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li.menu-small:hover ul.small-menu { visibility: visible; opacity: 1; transition: all 0.4s; top: 10px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul ul.small-menu { position: absolute; background: #fff; width: 225px; left: 200px; border-radius: 4px; padding: 15px; top: 0; transition: all 0.4s; visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul ul.small-menu.service-small { width: 280px !important; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li a.plus i::before { content: "+"; font-size: var(--ztc-font-size-font-s12); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li { display: inline-block; position: relative; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb { transition: all 0.4s; position: relative; z-index: 1; margin: 0 20px 20px 0; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.4; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .homemenu-btn { top: 37%; visibility: visible; opacity: 1; transition: all 0.6s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 { position: relative; z-index: 1; overflow: hidden; height: 100%; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); z-index: 1; visibility: hidden; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 img { height: 100%; width: 100%; transition: all 0.4s; border: 1px solid #E5E7EB; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn { position: absolute; top: 20%; z-index: 2; visibility: hidden; opacity: 0; text-align: center; transition: all 0.6s; margin: 0 auto; left: 14%; right: 14%; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h2 { 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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-5); padding: 16px 20px; position: relative; z-index: 1; width: 155px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h2 i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h2::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h2:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h2:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h2:hover i { transform: rotate(0); transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text { position: absolute; top: 0; left: 0; z-index: 1; top: 10px; left: 0px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text::after { position: absolute; content: ""; height: 100px; width: 100px; left: -71px; top: -66px; transition: all 0.4s; background: #FF6610; transform: rotate(-45deg); z-index: -1; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text h2 { font-size: var(--ztc-font-size-font-s12); font-weight: var(--ztc-weight-bold); font-family: var(--ztc-family-font1); transition: all 0.4s; line-height: var(--ztc-font-size-font-s12); color: var(--ztc-text-text-1); transform: rotate(-45deg); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu .homemenu-content a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); transition: all 0.4s; margin-top: 20px; text-align: center; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li:hover .tp-submenu { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; position: absolute; transition: all 0.4s; transform: scale(1); top: 201.3%; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li:hover ul.dropdown-padding { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li:hover .mega-menu-all { opacity: 1; visibility: visible; transform: scale(1); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); display: inline-block; transition: all 0.4s; padding: 0 20px; color: var(--ztc-text-text-2); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li:hover > a { transition: all 0.4s; color: var(--ztc-text-text-5) !important; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .tp-submenu { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; z-index: 1; transition: all 0.4s; padding: 20px 0 0 20px; left: 50%; width: 1300px; max-height: 600px; overflow: hidden; overflow-y: scroll; display: block; top: 201.3%; transform: scale(1, 0); transform-origin: top; margin-left: -350px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; width: 225px; z-index: 1; transition: all 0.4s; padding: 15px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu { position: relative; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a { transition: all 0.4s; padding-left: 25px; color: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a::after { background: var(--ztc-text-text-5); transition: all 0.4s; visibility: visible; opacity: 1; color: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li { display: block; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a { font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-medium); transition: all 0.4s; padding: 8px; display: block; position: relative; z-index: 1; color: var(--ztc-text-text-2); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 20%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a:hover { padding-left: 25px; color: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: white; top: 201.3%; transform: scale(1, 0); z-index: 0; transition: all 0.4s; padding: 36px 0; left: -740px; width: 1300px; min-height: 300px; overflow-x: hidden; overflow-y: hidden; transform-origin: top; display: flex; padding: 32px; justify-content: space-between; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all ul li { display: block; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all ul li a { display: block !important; padding: 12px 0 0 0 !important; font-size: var(--ztc-font-size-font-s18); color: var(--ztc-text-text-2); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all ul li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 25%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all ul li a:hover { padding-left: 15px !important; color: var(--ztc-text-text-5); } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all ul li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single { position: relative; width: 300px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single h3 { font-size: var(--ztc-font-size-font-s20); line-height: 20px; font-weight: 600; color: var(--ztc-text-text-2); position: relative; margin-bottom: 10px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images { position: relative; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .img1 { position: relative; z-index: 1; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0.6; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .img1 img { height: 342px; width: 500px; -o-object-fit: cover; object-fit: cover; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content { text-align: center; position: absolute; top: 50%; z-index: 1; padding: 40px; margin-top: -120px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content h3 { font-size: var(--ztc-font-size-font-s24); font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-bold); color: var(--ztc-text-text-1); transition: all 0.4s; line-height: 34px; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h2 { 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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-5); padding: 16px 20px; position: relative; z-index: 1; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h2 i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h2::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h2:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h2:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage2-body .header-area.homepage2 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h2:hover i { transform: rotate(0); transition: all 0.4s; } .header-area.homepage2.sticky { position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, 0, 0); z-index: 111; animation-name: fade-in-down; animation-duration: 1s; animation-fill-mode: forwards; background: var(--ztc-bg-bg-1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); transition: all 0.4s; } .header-area.homepage2.sticky .header-top-area { visibility: hidden; opacity: 0; transition: all 0.4s; height: 0; display: none; } .homepage3-body, html { overflow-x: hidden !important; } .homepage3-body { overflow-x: hidden; } .homepage3-body .header-area.homepage3 { position: absolute; width: 100%; z-index: 9999; padding: 16px 0; transition: all 0.4s; } .homepage3-body .header-area.homepage3 nav#navbar-example2 { display: block; padding: 0; } .homepage3-body .header-area.homepage3 nav#navbar-example2 ul li a.nav-link.active { color: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements { display: flex; align-items: center; justify-content: space-between; position: relative; transition: all 0.4s; background: #fff; border-radius: 110px; padding: 16px 16px 16px 24px; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); } .homepage3-body .header-area.homepage3 .header-elements .site-logo { height: 32px; width: 180px; -o-object-fit: contain; object-fit: contain; } .homepage3-body .header-area.homepage3 .header-elements .all-images-menu { display: flex; align-items: center; } .homepage3-body .header-area.homepage3 .header-elements .main-menu { position: relative; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li.menu-small a { display: flex !important; align-items: center; justify-content: space-between; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li.menu-small:hover ul.small-menu { visibility: visible; opacity: 1; transition: all 0.4s; top: 10px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul ul.small-menu { position: absolute; background: #fff; width: 225px; left: 200px; border-radius: 4px; padding: 15px; top: 0; transition: all 0.4s; visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul ul.small-menu.service-small { width: 280px !important; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li a.plus i::before { content: "+"; font-size: var(--ztc-font-size-font-s12); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li { display: inline-block; position: relative; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu { border-radius: 4px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb { transition: all 0.4s; position: relative; z-index: 1; margin: 0 20px 20px 0; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); border-radius: 4px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.4; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .homemenu-btn { top: 37%; visibility: visible; opacity: 1; transition: all 0.6s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 { position: relative; z-index: 1; overflow: hidden; height: 100%; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); z-index: 1; visibility: hidden; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 img { height: 100%; width: 100%; transition: all 0.4s; border: 1px solid #E5E7EB; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn { position: absolute; top: 20%; z-index: 2; visibility: hidden; opacity: 0; text-align: center; transition: all 0.6s; margin: 0 auto; left: 14%; right: 14%; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3 { 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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-6); padding: 8px 8px 8px 16px; position: relative; z-index: 1; border-radius: 25px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3 i { transform: rotate(-45deg); transition: all 0.4s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3 span { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; color: var(--ztc-text-text-2); transition: all 0.4s; display: inline-block; background: #fff; margin-left: 12px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h3:hover i { transform: rotate(0); transition: all 0.4s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text { position: absolute; top: 0; left: 0; z-index: 1; top: 10px; left: 0px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text::after { position: absolute; content: ""; height: 100px; width: 100px; left: -71px; top: -66px; transition: all 0.4s; background: #FF6610; transform: rotate(-45deg); z-index: -1; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text h2 { font-size: var(--ztc-font-size-font-s12); font-weight: var(--ztc-weight-bold); font-family: var(--ztc-family-font1); transition: all 0.4s; line-height: var(--ztc-font-size-font-s12); color: var(--ztc-text-text-1); transform: rotate(-45deg); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu .homemenu-content a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); transition: all 0.4s; margin-top: 20px; text-align: center; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li:hover .tp-submenu { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; position: absolute; transition: all 0.4s; transform: scale(1); top: 201.3%; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li:hover ul.dropdown-padding { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li:hover .mega-menu-all { opacity: 1; visibility: visible; transform: scale(1); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); display: inline-block; transition: all 0.4s; padding: 0 20px; color: var(--ztc-text-text-2); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li:hover > a { transition: all 0.4s; color: var(--ztc-text-text-6) !important; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .tp-submenu { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; z-index: 1; transition: all 0.4s; padding: 20px 0 0 20px; left: 50%; width: 1300px; max-height: 600px; overflow: hidden; overflow-y: scroll; display: block; top: 201.3%; transform: scale(1, 0); transform-origin: top; margin-left: -350px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; width: 225px; z-index: 1; transition: all 0.4s; padding: 15px; border-radius: 4px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu { position: relative; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a { transition: all 0.4s; padding-left: 25px; color: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a::after { background: var(--ztc-text-text-6); transition: all 0.4s; visibility: visible; opacity: 1; color: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li { display: block; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a { font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-medium); transition: all 0.4s; padding: 8px; display: block; position: relative; z-index: 1; color: var(--ztc-text-text-2); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 20%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a:hover { padding-left: 25px; color: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: white; top: 201.3%; transform: scale(1, 0); z-index: 0; transition: all 0.4s; padding: 36px 0; left: -740px; width: 1300px; min-height: 300px; overflow-x: hidden; overflow-y: hidden; transform-origin: top; display: flex; padding: 32px; justify-content: space-between; border-radius: 4px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all ul li { display: block; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all ul li a { display: block !important; padding: 12px 0 0 0 !important; font-size: var(--ztc-font-size-font-s18); color: var(--ztc-text-text-2); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all ul li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 25%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all ul li a:hover { padding-left: 15px !important; color: var(--ztc-text-text-6); } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all ul li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single { position: relative; width: 300px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single h3 { font-size: var(--ztc-font-size-font-s20); line-height: 20px; font-weight: 600; color: var(--ztc-text-text-2); position: relative; margin-bottom: 10px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images { position: relative; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .img1 { position: relative; z-index: 1; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0.6; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .img1 img { height: 342px; width: 500px; -o-object-fit: cover; object-fit: cover; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content { text-align: center; position: absolute; top: 50%; z-index: 1; padding: 40px; margin-top: -120px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content h3 { font-size: var(--ztc-font-size-font-s24); font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-bold); color: var(--ztc-text-text-1); transition: all 0.4s; line-height: 34px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3 { 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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-6); padding: 8px 8px 8px 16px; position: relative; z-index: 1; border-radius: 25px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3 i { transform: rotate(-45deg); transition: all 0.4s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3 span { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; color: var(--ztc-text-text-2); transition: all 0.4s; display: inline-block; background: #fff; margin-left: 12px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3:hover { color: var(--ztc-text-text-1); transition: all 0.4s; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage3-body .header-area.homepage3 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h3:hover i { transform: rotate(0); transition: all 0.4s; } .header-area.homepage3.sticky { position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, 0, 0); z-index: 111; animation-name: fade-in-down; animation-duration: 1s; animation-fill-mode: forwards; background: var(--ztc-bg-bg-1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); transition: all 0.4s; } .header-area.homepage3.sticky .header-elements { padding: 0; transition: all 0.4s; box-shadow: none; } .homepage4-body, html { overflow-x: hidden !important; } .homepage4-body { overflow-x: hidden; } .homepage4-body .header-area.homepage4 { position: absolute; width: 100%; z-index: 9999; transition: all 0.4s; } .homepage4-body .header-area.homepage4 nav#navbar-example2 { display: block; padding: 0; } .homepage4-body .header-area.homepage4 nav#navbar-example2 ul li a.nav-link.active { color: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements { display: flex; align-items: center; justify-content: space-between; position: relative; transition: all 0.4s; padding: 16px 0; } .homepage4-body .header-area.homepage4 .header-elements .site-logo { height: 32px; width: 180px; -o-object-fit: contain; object-fit: contain; } .homepage4-body .header-area.homepage4 .header-elements .all-images-menu { display: flex; align-items: center; } .homepage4-body .header-area.homepage4 .header-elements .main-menu { position: relative; border-radius: 118px; border: 1px solid rgba(255, 255, 255, 0.85); background: rgba(255, 255, 255, 0.68); -webkit-backdrop-filter: blur(6.3000001907px); backdrop-filter: blur(6.3000001907px); padding: 16px 32px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li.menu-small a { display: flex !important; align-items: center; justify-content: space-between; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li.menu-small:hover ul.small-menu { visibility: visible; opacity: 1; transition: all 0.4s; top: 10px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul ul.small-menu { position: absolute; background: #fff; width: 225px; left: 200px; border-radius: 4px; padding: 15px; top: 0; transition: all 0.4s; visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul ul.small-menu.service-small { width: 280px !important; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li a.plus i::before { content: "+"; font-size: var(--ztc-font-size-font-s12); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li { display: inline-block; position: relative; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb { transition: all 0.4s; position: relative; z-index: 1; margin: 0 20px 20px 0; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.4; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .homemenu-btn { top: 37%; visibility: visible; opacity: 1; transition: all 0.6s; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 { position: relative; z-index: 1; overflow: hidden; height: 100%; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); z-index: 1; visibility: hidden; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 img { height: 100%; width: 100%; transition: all 0.4s; border: 1px solid #E5E7EB; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn { position: absolute; top: 20%; z-index: 2; visibility: hidden; opacity: 0; text-align: center; transition: all 0.6s; margin: 0 auto; left: 14%; right: 14%; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-7); padding: 8px 8px 8px 16px; position: relative; z-index: 1; border-radius: 25px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h4 i { transform: rotate(-45deg); transition: all 0.4s; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h4 span { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; color: var(--ztc-text-text-2); transition: all 0.4s; display: inline-block; background: #fff; margin-left: 12px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h4::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h4:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h4:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h4:hover i { transform: rotate(0); transition: all 0.4s; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text { position: absolute; top: 0; left: 0; z-index: 1; top: 10px; left: 0px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text::after { position: absolute; content: ""; height: 100px; width: 100px; left: -71px; top: -66px; transition: all 0.4s; background: #FF6610; transform: rotate(-45deg); z-index: -1; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text h2 { font-size: var(--ztc-font-size-font-s12); font-weight: var(--ztc-weight-bold); font-family: var(--ztc-family-font1); transition: all 0.4s; line-height: var(--ztc-font-size-font-s12); color: var(--ztc-text-text-1); transform: rotate(-45deg); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu .homemenu-content a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); transition: all 0.4s; margin-top: 20px; text-align: center; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li:hover .tp-submenu { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; position: absolute; transition: all 0.4s; transform: scale(1); top: 201.3%; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li:hover ul.dropdown-padding { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li:hover .mega-menu-all { opacity: 1; visibility: visible; transform: scale(1); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); display: inline-block; transition: all 0.4s; padding: 0 20px; color: var(--ztc-text-text-2); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li:hover > a { transition: all 0.4s; color: var(--ztc-text-text-7) !important; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .tp-submenu { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; z-index: 1; transition: all 0.4s; padding: 20px 0 0 20px; left: 50%; width: 1300px; max-height: 600px; overflow: hidden; overflow-y: scroll; display: block; top: 201.3%; transform: scale(1, 0); transform-origin: top; margin-left: -350px; border-radius: 4px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; width: 225px; z-index: 1; transition: all 0.4s; padding: 15px; border-radius: 4px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu { position: relative; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a { transition: all 0.4s; padding-left: 25px; color: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a::after { background: var(--ztc-text-text-7); transition: all 0.4s; visibility: visible; opacity: 1; color: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li { display: block; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a { font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-medium); transition: all 0.4s; padding: 8px; display: block; position: relative; z-index: 1; color: var(--ztc-text-text-2); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 20%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a:hover { padding-left: 25px; color: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: white; top: 201.3%; transform: scale(1, 0); z-index: 0; transition: all 0.4s; padding: 36px 0; left: -740px; width: 1300px; min-height: 300px; overflow-x: hidden; overflow-y: hidden; transform-origin: top; display: flex; padding: 32px; justify-content: space-between; border-radius: 4px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all ul li { display: block; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all ul li a { display: block !important; padding: 12px 0 0 0 !important; font-size: var(--ztc-font-size-font-s18); color: var(--ztc-text-text-2); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all ul li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 25%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all ul li a:hover { padding-left: 15px !important; color: var(--ztc-text-text-7); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all ul li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single { position: relative; width: 300px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single h3 { font-size: var(--ztc-font-size-font-s20); line-height: 20px; font-weight: 600; color: var(--ztc-text-text-2); position: relative; margin-bottom: 10px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images { position: relative; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .img1 { position: relative; z-index: 1; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0.6; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .img1 img { height: 342px; width: 500px; -o-object-fit: cover; object-fit: cover; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content { text-align: center; position: absolute; top: 50%; z-index: 1; padding: 40px; margin-top: -120px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content h3 { font-size: var(--ztc-font-size-font-s24); font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-bold); color: var(--ztc-text-text-1); transition: all 0.4s; line-height: 34px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-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; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-7); padding: 8px 8px 8px 16px; position: relative; z-index: 1; border-radius: 25px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h4 i { transform: rotate(-45deg); transition: all 0.4s; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h4 span { height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 50%; color: var(--ztc-text-text-2); transition: all 0.4s; display: inline-block; background: #fff; margin-left: 12px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h4::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h4:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h4:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage4-body .header-area.homepage4 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h4:hover i { transform: rotate(0); transition: all 0.4s; } .header-area.homepage4.sticky { position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, 0, 0); z-index: 111; animation-name: fade-in-down; animation-duration: 1s; animation-fill-mode: forwards; background: var(--ztc-bg-bg-1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); transition: all 0.4s; } .homepage5-body, html { overflow-x: hidden !important; } .homepage5-body { overflow-x: hidden; } .homepage5-body .header-area.homepage5 { position: absolute; width: 100%; z-index: 9999; transition: all 0.4s; padding: 16px 0 0 0; } .homepage5-body .header-area.homepage5 nav#navbar-example2 { display: block; padding: 0; } .homepage5-body .header-area.homepage5 nav#navbar-example2 ul li a.nav-link.active { color: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements { display: flex; align-items: center; justify-content: space-between; position: relative; transition: all 0.4s; padding: 16px 20px; background: #fff; border-radius: 82px; } .homepage5-body .header-area.homepage5 .header-elements .site-logo { height: 32px; width: 180px; -o-object-fit: contain; object-fit: contain; } .homepage5-body .header-area.homepage5 .header-elements .all-images-menu { display: flex; align-items: center; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li.menu-small a { display: flex !important; align-items: center; justify-content: space-between; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li.menu-small:hover ul.small-menu { visibility: visible; opacity: 1; transition: all 0.4s; top: 10px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul ul.small-menu { position: absolute; background: #fff; width: 225px; left: 200px; border-radius: 4px; padding: 15px; top: 0; transition: all 0.4s; visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul ul.small-menu.service-small { width: 280px !important; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li a.plus i::before { content: "+"; font-size: var(--ztc-font-size-font-s12); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li { display: inline-block; position: relative; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb { transition: all 0.4s; position: relative; z-index: 1; margin: 0 20px 20px 0; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.4; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb:hover .homemenu-btn { top: 37%; visibility: visible; opacity: 1; transition: all 0.6s; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 { position: relative; z-index: 1; overflow: hidden; height: 100%; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); z-index: 1; visibility: hidden; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .img1 img { height: 100%; width: 100%; transition: all 0.4s; border: 1px solid #E5E7EB; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn { position: absolute; top: 20%; z-index: 2; visibility: hidden; opacity: 0; text-align: center; transition: all 0.6s; margin: 0 auto; left: 14%; right: 14%; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-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-bold); line-height: 18px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-8); padding: 16px; position: relative; z-index: 1; border-radius: 25px; width: 140px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h5 i { transform: rotate(-45deg); transition: all 0.4s; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h5::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h5:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h5:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .homemenu-btn .header-btn2-h5:hover i { transform: rotate(0); transition: all 0.4s; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text { position: absolute; top: 0; left: 0; z-index: 1; top: 10px; left: 0px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text::after { position: absolute; content: ""; height: 100px; width: 100px; left: -71px; top: -66px; transition: all 0.4s; background: #FF6610; transform: rotate(-45deg); z-index: -1; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-thumb .text h2 { font-size: var(--ztc-font-size-font-s12); font-weight: var(--ztc-weight-bold); font-family: var(--ztc-family-font1); transition: all 0.4s; line-height: var(--ztc-font-size-font-s12); color: var(--ztc-text-text-1); transform: rotate(-45deg); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu .homemenu-content a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s24); line-height: var(--ztc-font-size-font-s24); font-weight: var(--ztc-weight-semibold); color: var(--ztc-text-text-2); transition: all 0.4s; margin-top: 20px; text-align: center; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li:hover .tp-submenu { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; position: absolute; transition: all 0.4s; transform: scale(1); top: 201.3%; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li:hover ul.dropdown-padding { visibility: visible; transition: all 0.5s ease-in-out; opacity: 1; z-index: 9; top: 50px; position: absolute; transition: all 0.4s; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li:hover .mega-menu-all { opacity: 1; visibility: visible; transform: scale(1); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li a { font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-2); display: inline-block; transition: all 0.4s; padding: 0 20px; color: var(--ztc-text-text-2); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li:hover > a { transition: all 0.4s; color: var(--ztc-text-text-8) !important; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .tp-submenu { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; z-index: 1; transition: all 0.4s; padding: 20px 0 0 20px; left: 50%; width: 1300px; max-height: 600px; overflow: hidden; overflow-y: scroll; display: block; top: 201.3%; transform: scale(1, 0); transform-origin: top; margin-left: -370px; border-radius: 4px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: var(--ztc-text-text-1); top: 100px; width: 225px; z-index: 1; transition: all 0.4s; padding: 15px; border-radius: 4px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu { position: relative; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a { transition: all 0.4s; padding-left: 25px; color: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li.main-small-menu:hover > a::after { background: var(--ztc-text-text-8); transition: all 0.4s; visibility: visible; opacity: 1; color: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li { display: block; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a { font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-medium); transition: all 0.4s; padding: 8px; display: block; position: relative; z-index: 1; color: var(--ztc-text-text-2); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 20%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a:hover { padding-left: 25px; color: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li ul.dropdown-padding li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all { visibility: hidden; opacity: 0; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; position: absolute; background: white; top: 201.3%; transform: scale(1, 0); z-index: 0; transition: all 0.4s; padding: 36px 0; left: -750px; width: 1300px; min-height: 300px; overflow-x: hidden; overflow-y: hidden; transform-origin: top; display: flex; padding: 32px; justify-content: space-between; border-radius: 4px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all ul li { display: block; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all ul li a { display: block !important; padding: 12px 0 0 0 !important; font-size: var(--ztc-font-size-font-s18); color: var(--ztc-text-text-2); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all ul li a::after { position: absolute; content: ""; height: 25px; width: 3px; transition: all 0.4s; z-index: -1; left: -10px; top: 25%; display: inline-block; visibility: hidden; opacity: 0; background: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all ul li a:hover { padding-left: 15px !important; color: var(--ztc-text-text-8); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all ul li a:hover::after { visibility: visible; transition: all 0.4s; opacity: 1; left: 0; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single { position: relative; width: 300px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .mega-menu-single h3 { font-size: var(--ztc-font-size-font-s20); line-height: 20px; font-weight: 600; color: var(--ztc-text-text-2); position: relative; margin-bottom: 10px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images { position: relative; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .img1 { position: relative; z-index: 1; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0.6; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .img1 img { height: 342px; width: 500px; -o-object-fit: cover; object-fit: cover; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content { text-align: center; position: absolute; top: 50%; z-index: 1; padding: 40px; margin-top: -120px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content h3 { font-size: var(--ztc-font-size-font-s24); font-family: var(--ztc-family-font1); font-weight: var(--ztc-weight-bold); color: var(--ztc-text-text-1); transition: all 0.4s; line-height: 34px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-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-bold); line-height: 18px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-8); padding: 16px; position: relative; z-index: 1; border-radius: 25px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h5 i { transform: rotate(-45deg); transition: all 0.4s; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h5::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; border-radius: 25px; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h5:hover { color: var(--ztc-text-text-1); transition: all 0.4s; transform: translateY(-5px); } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h5:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .homepage5-body .header-area.homepage5 .header-elements .main-menu ul li .mega-menu-all .images .content .header-btn2-h5:hover i { transform: rotate(0); transition: all 0.4s; } .header-area.homepage5.sticky { position: fixed; top: 0; left: 0; width: 100%; transform: translate3d(0, 0, 0); z-index: 111; animation-name: fade-in-down; animation-duration: 1s; animation-fill-mode: forwards; background: var(--ztc-bg-bg-1); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2); -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); transition: all 0.4s; padding: 0; } .header-area.homepage5.sticky .header-elements { padding: 16px 0; transition: all 0.4s; } /*============= HEADER CSS AREA ENDS ===============*/ /*============= OTHERS CSS AREA STARTS ===============*/ .preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999999999; background-color: var(--ztc-text-text-4); display: flex; align-items: center; justify-content: center; } .preloader2 { background: var(--ztc-bg-bg-2) !important; } .preloader3 { background: var(--ztc-text-text-6) !important; } .preloader4 { background: var(--ztc-text-text-2) !important; } .preloader5 { background: var(--ztc-text-text-8) !important; } .loading-container, .loading { height: 120px; position: relative; width: 120px; border-radius: 100%; } .loading-container { margin: 40px auto; } .loading { border: 1px solid transparent; border-color: transparent var(--ztc-text-text-1) transparent var(--ztc-text-text-1); animation: rotate-loading 1.5s linear 0s infinite normal; transform-origin: 50% 50%; } .preloader2 .loading { border-color: transparent var(--ztc-text-text-5) transparent var(--ztc-text-text-5) !important; border: 1px solid transparent; animation: rotate-loading 1.5s linear 0s infinite normal; transform-origin: 50% 50%; } .preloader3 .loading { border-color: transparent var(--ztc-text-text-1) transparent var(--ztc-text-text-1) !important; border: 1px solid transparent; animation: rotate-loading 1.5s linear 0s infinite normal; transform-origin: 50% 50%; } .preloader4 .loading { border-color: transparent var(--ztc-text-text-7) transparent var(--ztc-text-text-7) !important; border: 1px solid transparent; animation: rotate-loading 1.5s linear 0s infinite normal; transform-origin: 50% 50%; } .preloader5 .loading { border-color: transparent var(--ztc-text-text-1) transparent var(--ztc-text-text-1) !important; border: 1px solid transparent; animation: rotate-loading 1.5s linear 0s infinite normal; transform-origin: 50% 50%; } .loading-container:hover .loading, .loading-container .loading { transition: all 0.5s ease-in-out; } #loading-icon { position: absolute; top: 48%; left: 50%; transform: translate(-50%, -50%); height: 70px; width: 60px; } @keyframes rotate-loading { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* END: Preloader */ .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(255, 255, 255, 0.1); z-index: 10000; opacity: 0; visibility: hidden; transform: translateY(15px); transition: all 200ms linear; } .progress-wrap:hover { background: var(--ztc-text-text-2); transform: translateY(-5px); box-shadow: 0 0 15px 0 var(--ztc-text-text-16); transition: all 0.4s ease-in-out; 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; } .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; } .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); } .star2 { position: absolute; right: 0; z-index: -1; } .star3 { position: absolute; left: 0; bottom: 0; z-index: -1; } /*============= OTHERS CSS AREA ENDS ===============*/ .others3-slider-area { position: relative; z-index: 1; background: #F6F8FA; } .others3-slider-area .heading2 h3 { color: var(--Text-Color, #03071E); 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; transition: all 0.4s; } .others3-slider-area .slider3-area .img1 { height: 40px; width: 120px; -o-object-fit: contain; object-fit: contain; } .others3-slider-area .slider3-area .img1 img { height: 40px; width: 120px; -o-object-fit: contain; object-fit: contain; } .others4-slider-area1 .others4-slider-area { position: relative; bottom: 185px; z-index: 1; } @media only screen and (min-width: 768px) and (max-width: 991px) { .others4-slider-area1 .others4-slider-area { bottom: 0; } } @media (max-width: 767px) { .others4-slider-area1 .others4-slider-area { bottom: 0; } } .others4-slider-area1 .others4-slider-area .owl-stage-outer { position: absolute !important; } .others4-slider-area1 .others4-slider-area .img1 { height: 40px; width: 120px; -o-object-fit: contain; object-fit: contain; } .others4-slider-area1 .others4-slider-area .img1 img { height: 40px; width: 120px; -o-object-fit: contain; object-fit: contain; } /*============= PRICING CSS AREA STARTS ===============*/ /*============= HISTORY CSS AREA STARTS ===============*/ .history-section-area { position: relative; z-index: 1; } .history-section-area .history-details-boxarea { padding: 0 50px 0 0; } @media (max-width: 767px) { .history-section-area .history-details-boxarea { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .history-section-area .history-details-boxarea { padding: 0; } } .history-section-area .history-details-boxarea .history-boxes { position: relative; padding-bottom: 32px; border-bottom: 1px dashed var(--ztc-text-text-3); margin-bottom: 30px; } @media (max-width: 767px) { .history-section-area .history-details-boxarea .history-boxes { margin-bottom: 30px; border: 1px dashed var(--ztc-text-text-3) !important; padding: 16px !important; border-radius: 4px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .history-section-area .history-details-boxarea .history-boxes { margin-bottom: 30px; } } .history-section-area .history-details-boxarea .history-boxes span { color: var(--Text-Color, #03071E); 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; } .history-section-area .history-details-boxarea .history-boxes a { color: var(--Text-Color, #03071E); 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; transition: all 0.4s; display: inline-block; } .history-section-area .history-details-boxarea .history-boxes a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .history-section-area .history-details-boxarea .history-boxes p { color: var(--Paragraph-Color, #6C757D); 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: 26px; display: inline-block; } .history-section-area .history-details-boxarea .history-boxes .readmore { color: var(--Text-Color, #03071E); 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; } .history-section-area .history-details-boxarea .history-boxes .readmore i { margin-left: 4px; transform: rotate(-45deg); } .history-section-area .history-details-boxarea .history-boxes .readmore:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .history-section-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } /*============= VALUE CSS AREA STARTS ===============*/ .value-section-area { position: relative; z-index: 1; } .value-section-area .value-details-box { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; border-radius: 4px; } .value-section-area .value-details-box .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } @media (max-width: 767px) { .value-section-area .value-details-box .img1 img { height: 470px; } } .value-section-area .value-details-box .content-area { position: absolute; bottom: 0; z-index: 1; padding: 24px; } .value-section-area .value-details-box .content-area h3 { font-size: var(--ztc-font-size-font-s32); line-height: 40px; } .value-section-area .value-boxs-area { padding: 0 0 0 30px; } @media (max-width: 767px) { .value-section-area .value-boxs-area { margin-top: 30px; padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .value-section-area .value-boxs-area { margin-top: 30px; padding: 0; } } .value-section-area .value-boxs-area .value-box { background: #FDC4B4; position: relative; padding: 24px; border-radius: 4px; } .value-section-area .value-boxs-area .value-box .arrow { text-align: end; } .value-section-area .value-boxs-area .value-box .arrow a { height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50%; transition: all 0.4s; background: #efb30e; display: inline-block; transition: all 0.4s; color: var(--ztc-text-text-1); transform: rotate(-45deg); } .value-section-area .value-boxs-area .value-box h5 { color: var(--1st-Main, #efb30e); 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; display: inline-block; } .value-section-area .value-boxs-area .value-box a { color: var(--Text-Color, #03071E); 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: 26px; display: inline-block; transition: all 0.4s; } .value-section-area .value-boxs-area .value-box p { color: var(--colors-dark-normal-active, #3D4C5E); 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: 26px; } .value-section-area .value-boxs-area .value-box2 { background: #CFDFFF; position: relative; padding: 24px; border-radius: 4px; } .value-section-area .value-boxs-area .value-box2 .arrow { text-align: end; } .value-section-area .value-boxs-area .value-box2 .arrow a { height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50%; transition: all 0.4s; background: #1063FF; display: inline-block; transition: all 0.4s; color: var(--ztc-text-text-1); transform: rotate(-45deg); } .value-section-area .value-boxs-area .value-box2 h5 { color: var(--1st-Main, #1063FF); 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; display: inline-block; } .value-section-area .value-boxs-area .value-box2 a { color: var(--Text-Color, #03071E); 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: 26px; display: inline-block; transition: all 0.4s; } .value-section-area .value-boxs-area .value-box2 p { color: var(--colors-dark-normal-active, #3D4C5E); 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: 26px; } /*============= CHOOSE CSS AREA ENDS ===============*/ /*============= ERROR CSS AREA ENDS ===============*/ /*============= ERROR CSS AREA ENDS ===============*/ .pagination-area { text-align: center; margin-top: 20px; } .pagination-area ul { justify-content: center; } .pagination-area ul li { box-shadow: none; } .pagination-area ul li a { height: 50px; width: 50px; border: none; background: #fff; display: inline-block; transition: all 0.4s; border-radius: 4px; box-shadow: none; outline: none; line-height: 50px !important; padding: 0; border: none; color: var(--ztc-text-text-2); text-align: center; font-family: var(--ztc-family-font1); font-size: 20px; font-style: normal; font-weight: 700; line-height: 20px; margin: 0 14px 0 0; } .pagination-area ul li a.active { background: #FFAF01; color: var(--ztc-text-text-2); } .pagination-area ul li a:hover { background: var(--ztc-text-text-4); color: var(--ztc-text-text-2); transition: all 0.4s; } .pagination-area2 { text-align: center; margin-top: 20px; } .pagination-area2 ul { justify-content: center; } .pagination-area2 ul li { box-shadow: none; } .pagination-area2 ul li a { height: 50px; width: 50px; border: none; background: #F9F9F9; display: inline-block; transition: all 0.4s; border-radius: 4px; box-shadow: none; outline: none; line-height: 50px !important; padding: 0; border: none; color: var(--ztc-text-text-2); text-align: center; font-family: var(--ztc-family-font1); font-size: 20px; font-style: normal; font-weight: 700; line-height: 20px; margin: 0 14px 0 0; } .pagination-area2 ul li a.active { background: #FFAF01; color: var(--ztc-text-text-2); } .pagination-area2 ul li a:hover { background: var(--ztc-text-text-4); color: var(--ztc-text-text-2); transition: all 0.4s; } /*============= TEAM CSS AREA ===============*/ .team1-section-area { position: relative; z-index: 1; background: #F6F6F6; } .team1-section-area .team-boxarea { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; text-align: center; margin-bottom: 30px; } .team1-section-area .team-boxarea:hover .img1::after { visibility: visible; opacity: 0.6; transform: scale(1); transition: all 0.4s; } .team1-section-area .team-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .team1-section-area .team-boxarea:hover ul { visibility: visible; opacity: 1; top: 50%; transition: all 0.6s; } .team1-section-area .team-boxarea .img1 { position: relative; z-index: 1; overflow: hidden; } .team1-section-area .team-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); } .team1-section-area .team-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .team1-section-area .team-boxarea .content { padding-top: 24px; } .team1-section-area .team-boxarea .content a { color: var(--ztc-text-text-2); 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; display: inline-block; transition: all 0.4s; } .team1-section-area .team-boxarea .content a:hover { color: var(--ztc-text-text-5); transition: all 0.4s; } .team1-section-area .team-boxarea .content p { color: var(--Paragraph-Color, #6C757D); 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: 16px; } .team1-section-area .team-boxarea ul { position: absolute; top: 30%; z-index: 1; left: 50%; margin-left: -90px; margin-top: -50px; visibility: hidden; opacity: 0; transition: all 0.6s; } .team1-section-area .team-boxarea ul li { display: inline-block; } .team1-section-area .team-boxarea ul li a { height: 32px; width: 32px; text-align: center; line-height: 32px; border-radius: 50%; display: inline-block; transition: all 0.4s; color: var(--ztc-text-text-2); background: var(--ztc-bg-bg-1); margin: 0 6px; } .team1-section-area .team-boxarea ul li a:hover { background: var(--ztc-bg-bg-5); color: var(--ztc-text-text-1); transition: all 0.4s; } .team1-section-area .team-boxarea ul li a i { font-size: var(--ztc-font-size-font-s16); } .team4-section-area { position: relative; z-index: 1; } .team4-section-area .team-boxarea { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; text-align: center; margin-bottom: 30px; } .team4-section-area .team-boxarea:hover .img1::after { visibility: visible; opacity: 0.6; transform: scale(1); transition: all 0.4s; } .team4-section-area .team-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .team4-section-area .team-boxarea:hover ul { visibility: visible; opacity: 1; top: 50%; transition: all 0.6s; } .team4-section-area .team-boxarea .img1 { position: relative; z-index: 1; overflow: hidden; border-radius: 4px; } .team4-section-area .team-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); border-radius: 4px; } .team4-section-area .team-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; border-radius: 4px; } .team4-section-area .team-boxarea .content { padding-top: 24px; } .team4-section-area .team-boxarea .content a { color: var(--ztc-text-text-2); 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; display: inline-block; transition: all 0.4s; } .team4-section-area .team-boxarea .content a:hover { color: var(--ztc-text-text-7); transition: all 0.4s; } .team4-section-area .team-boxarea .content p { color: var(--Paragraph-Color, #6C757D); 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: 16px; } .team4-section-area .team-boxarea ul { position: absolute; top: 30%; z-index: 1; left: 50%; margin-left: -90px; margin-top: -50px; visibility: hidden; opacity: 0; transition: all 0.6s; } .team4-section-area .team-boxarea ul li { display: inline-block; } .team4-section-area .team-boxarea ul li a { height: 32px; width: 32px; text-align: center; line-height: 32px; border-radius: 50%; display: inline-block; transition: all 0.4s; color: var(--ztc-text-text-2); background: var(--ztc-bg-bg-1); margin: 0 6px; } .team4-section-area .team-boxarea ul li a:hover { background: var(--ztc-bg-bg-7); color: var(--ztc-text-text-2); transition: all 0.4s; } .team4-section-area .team-boxarea ul li a i { font-size: var(--ztc-font-size-font-s16); } .teaminner-section-area { position: relative; z-index: 1; } .teaminner-section-area .team-boxarea { position: relative; z-index: 1; overflow: hidden; transition: all 0.4s; text-align: center; margin-bottom: 30px; } .teaminner-section-area .team-boxarea:hover .img1::after { visibility: visible; opacity: 0.6; transform: scale(1); transition: all 0.4s; } .teaminner-section-area .team-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .teaminner-section-area .team-boxarea:hover ul { visibility: visible; opacity: 1; top: 50%; transition: all 0.6s; } .teaminner-section-area .team-boxarea .img1 { position: relative; z-index: 1; overflow: hidden; } .teaminner-section-area .team-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.8); } .teaminner-section-area .team-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.4s; } .teaminner-section-area .team-boxarea .content { padding-top: 24px; } .teaminner-section-area .team-boxarea .content a { color: var(--ztc-text-text-2); 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; display: inline-block; transition: all 0.4s; } .teaminner-section-area .team-boxarea .content a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .teaminner-section-area .team-boxarea .content p { color: var(--Paragraph-Color, #6C757D); 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: 16px; } .teaminner-section-area .team-boxarea ul { position: absolute; top: 30%; z-index: 1; left: 50%; margin-left: -90px; margin-top: -50px; visibility: hidden; opacity: 0; transition: all 0.6s; } .teaminner-section-area .team-boxarea ul li { display: inline-block; } .teaminner-section-area .team-boxarea ul li a { height: 32px; width: 32px; text-align: center; line-height: 32px; border-radius: 50%; display: inline-block; transition: all 0.4s; color: var(--ztc-text-text-2); background: var(--ztc-bg-bg-1); margin: 0 6px; } .teaminner-section-area .team-boxarea ul li a:hover { background: var(--ztc-text-text-4); color: var(--ztc-text-text-2); transition: all 0.4s; } .teaminner-section-area .team-boxarea ul li a i { font-size: var(--ztc-font-size-font-s16); } .team-single-section { position: relative; z-index: 1; } .team-single-section .bottom-content 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: 700; line-height: 32px; } @media (max-width: 767px) { .team-single-section .bottom-content h3 { font-size: var(--ztc-font-size-font-s24); line-height: 32px; } } .team-single-section .bottom-content 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: 400; line-height: 26px; } .team-single-section .team-single-boxarea { background: #F6F8FA; position: relative; } .team-single-section .team-single-boxarea .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .team-single-section .team-single-boxarea .team-single-content { padding: 32px 50px; } @media (max-width: 767px) { .team-single-section .team-single-boxarea .team-single-content { padding: 30px; } } .team-single-section .team-single-boxarea .team-single-content 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: 700; line-height: 24px; } .team-single-section .team-single-boxarea .team-single-content p { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 28px; } .team-single-section .team-single-boxarea .team-single-content .star ul li { display: inline-block; color: #FFAF01; } .team-single-section .team-single-boxarea .team-single-content .star ul li:nth-child(6) { color: var(--ztc-text-text-2); } .team-single-section .team-single-boxarea .team-single-content .listarea 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: 500; line-height: 18px; margin-top: 20px; } .team-single-section .team-single-boxarea .team-single-content .listarea ul li img { margin: 0 8px 0 0; } .team-single-section .team-single-boxarea .team-single-content .social-area ul li { display: inline-block; } .team-single-section .team-single-boxarea .team-single-content .social-area ul li a { height: 32px; width: 32px; text-align: center; line-height: 32px; border-radius: 50%; display: inline-block; transition: all 0.4s; color: var(--ztc-text-text-2); background: rgba(252, 235, 200, 0.5); margin: 0 4px 0 0; } .team-single-section .team-single-boxarea .team-single-content .social-area ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; } /*============= TEAM CSS AREA STARTS ===============*/ /*============= FAQ CSS AREA ===============*/ .faq-inner-area { position: relative; z-index: auto; } .faq-inner-area h2 { 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: 700; line-height: 32px; } .faq-inner-area .service-widget-area { position: sticky; top: 100px; } .faq-inner-area .service-widget-area h3 { color: var(--Text-Color, #03071E); 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; } .faq-inner-area .service-widget-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: 400; line-height: 26px; } .faq-inner-area .service-widget-area .categories { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .faq-inner-area .service-widget-area .categories 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: 500; line-height: 16px; display: block; transition: all 0.4s; padding: 19px 16px; background: var(--ztc-bg-bg-1); margin-top: 16px; } .faq-inner-area .service-widget-area .categories ul li a:hover { background: var(--ztc-bg-bg-3); transition: all 0.4s; color: var(--ztc-text-text-2); } .faq-inner-area .service-widget-area .download-area { background: #F6F8FA; padding: 24px 20px; transition: all 0.4s; } .faq-inner-area .service-widget-area .download-area .btn-area1 a { width: 100%; text-align: center; } .faq-inner-area .service-widget-area .download-area .btn-area1 a i { transform: rotate(0); margin: 0 4px 0 0; } .faq-inner-area .service-widget-area .download-area .btn-area1 .header-btn1.btn2 { background: transparent; border: 1px solid var(--ztc-text-text-2); } .faq-inner-area .faq-widget-area { padding: 0 0 0 30px; } @media (max-width: 767px) { .faq-inner-area .faq-widget-area { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .faq-inner-area .faq-widget-area { padding: 0; margin-top: 30px; } } .faq-inner-area .faq-widget-area .accordion .accordion-item { margin-top: 20px; border-radius: none; background: #F6F8FA; border: none; padding: 24px; } .faq-inner-area .faq-widget-area .accordion .accordion-item button { color: var(--Text-Color, #03071E); 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; transition: all 0.4s; border: none; box-shadow: none; outline: none; background: #F6F8FA; padding: 0; } @media (max-width: 767px) { .faq-inner-area .faq-widget-area .accordion .accordion-item button { line-height: 26px; } } .faq-inner-area .faq-widget-area .accordion .accordion-item button::after { height: 13px; width: 2px; background: var(--ztc-text-text-2); display: inline-block; content: ""; visibility: visible; opacity: 1; transition: all 0.4s; } .faq-inner-area .faq-widget-area .accordion .accordion-item button::before { height: 13px; width: 2px; background: var(--ztc-text-text-2); display: inline-block; content: ""; position: absolute; z-index: 2; right: 0; top: 4px; transform: rotate(-90deg); transition: all 0.4s; } @media (max-width: 767px) { .faq-inner-area .faq-widget-area .accordion .accordion-item button::before { top: 20px; } } .faq-inner-area .faq-widget-area .accordion .accordion-item .accordion-button:not(.collapsed)::after { visibility: hidden; opacity: 0; transition: all 0.4s; } .faq-inner-area .faq-widget-area .accordion .accordion-item .accordion-body { padding: 0; } .faq-inner-area .faq-widget-area .accordion .accordion-item .accordion-body 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: 400; line-height: 26px; padding: 18px 50px 0 0; } @media (max-width: 767px) { .faq-inner-area .faq-widget-area .accordion .accordion-item .accordion-body p { padding: 18px 0 0 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .faq-inner-area .faq-widget-area .accordion .accordion-item .accordion-body p { padding: 18px 0 0 0; } } /*============= FAQ CSS AREA ===============*/ /*============= CONTACT CSS AREA ===============*/ .contact1-section-area { position: relative; z-index: 1; background: #F6F8FA; } .contact1-section-area .contact-header { padding: 0 50px 0 0; } @media (max-width: 767px) { .contact1-section-area .contact-header { padding: 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .contact1-section-area .contact-header { padding: 0; } } .contact1-section-area .contact-header 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; } .contact1-section-area .contact-header ul { border-bottom: 1px solid #CED4DA; padding-bottom: 16px; } .contact1-section-area .contact-header ul li { display: inline-block; margin: 0 72px 0 0; } .contact1-section-area .contact-header ul li a { 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: 16px; display: inline-block; transition: all 0.4s; } .contact1-section-area .contact-header ul li a i { color: var(--ztc-text-text-2); margin: 0 8px 0 0; font-size: var(--ztc-font-size-font-s20); } .contact1-section-area .contact-header .contact-author-area .author-box { margin-top: 32px; position: relative; z-index: 1; } .contact1-section-area .contact-header .contact-author-area .author-box:hover .icons { background: var(--ztc-text-text-4); transition: all 0.4s; } .contact1-section-area .contact-header .contact-author-area .author-box .icons { height: 50px; width: 50px; display: inline-block; border-radius: 50%; background: rgba(252, 235, 200, 0.5); transition: all 0.4s; text-align: center; line-height: 50px; position: absolute; } .contact1-section-area .contact-header .contact-author-area .author-box .text { padding-left: 66px; } .contact1-section-area .contact-header .contact-author-area .author-box .text 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; } .contact1-section-area .contact-header .contact-author-area .author-box .text a { color: var(--Paragraph-Color, #6C757D); 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; padding-top: 12px; } .contact1-section-area .contact-boxarea { position: relative; z-index: 1; background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); padding: 24px; } @media (max-width: 767px) { .contact1-section-area .contact-boxarea { margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .contact1-section-area .contact-boxarea { margin-top: 30px; } } .contact1-section-area .contact-boxarea .input-area 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-bold); line-height: 18px; } .contact1-section-area .contact-boxarea .input-area input { width: 100%; border: 1px solid #EAEBEB; 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; padding: 16px 16px; margin-bottom: 20px; } .contact1-section-area .contact-boxarea .input-area input::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); 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; } .contact1-section-area .contact-boxarea .input-area input::placeholder { color: var(--Paragraph-Color, #6C757D); 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; } .contact1-section-area .contact-boxarea .input-area textarea { width: 100%; border: 1px solid #EAEBEB; 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; padding: 16px 16px; margin-bottom: 20px; height: 168px; } .contact1-section-area .contact-boxarea .input-area textarea::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); 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; } .contact1-section-area .contact-boxarea .input-area textarea::placeholder { color: var(--Paragraph-Color, #6C757D); 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; } .contact1-section-area .contact-boxarea .input-area button { border: none; outline: none; } .mapouter .gmap_canvas iframe { width: 100%; height: 750px; } @media (max-width: 767px) { .mapouter .gmap_canvas iframe { height: 200px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .mapouter .gmap_canvas iframe { height: 200px; } } .error-section-area .error-header .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } /*============= CONTACT CSS AREA ENDS===============*/ /*============= CTA CSS AREA ===============*/ .cta1-section-area { position: relative; z-index: 1; background-image: url(../img/all-images/bg/cta-bg1.png); background-position: center; background-size: cover; background-repeat: no-repeat; } .cta1-section-area .cta-header 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; } @media (max-width: 767px) { .cta1-section-area .cta-header h2 { font-size: var(--ztc-font-size-font-s32); line-height: 40px; } } .cta1-section-area .btn-area { text-align: end; } @media only screen and (min-width: 768px) and (max-width: 991px) { .cta1-section-area .btn-area { text-align: start; padding-top: 30px; } } .cta1-section-area .btn-area .header-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; display: inline-block; transition: all 0.4s; border: 1px solid #fff; padding: 15px 20px; position: relative; z-index: 1; margin-left: 16px; } @media (max-width: 767px) { .cta1-section-area .btn-area .header-btn2 { margin-left: 0; margin-top: 20px; } } .cta1-section-area .btn-area .header-btn2 i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .cta1-section-area .btn-area .header-btn2::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-2); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .cta1-section-area .btn-area .header-btn2:hover { color: var(--ztc-text-text-1); transition: all 0.4s; border: 1px solid var(--ztc-text-text-2); } .cta1-section-area .btn-area .header-btn2:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .cta1-section-area .btn-area .header-btn2:hover i { transform: rotate(0); transition: all 0.4s; } .cta2-section-area { position: relative; z-index: 2; margin-bottom: -160px; } .cta2-section-area .cta-widget-bg { background: var(--ztc-bg-bg-5); position: relative; padding: 24px 32px; z-index: 1; } .cta2-section-area .cta-widget-bg .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .cta2-section-area .cta-widget-bg .heading4 { padding: 0 0 0 50px; } @media (max-width: 767px) { .cta2-section-area .cta-widget-bg .heading4 { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cta2-section-area .cta-widget-bg .heading4 { padding: 0; margin-top: 30px; } } .cta2-section-area .cta-widget-bg .heading4 h2 { color: var(--ztc-text-text-1); } .cta2-section-area .cta-widget-bg .heading4 .btn-area a.header-btn2-h2 { background: var(--ztc-bg-bg-1); color: var(--ztc-text-text-5); } .cta2-section-area .cta-widget-bg .heading4 .btn-area a.header-btn2-h2:hover { color: var(--ztc-text-text-1); } .cta3-section-area { position: relative; z-index: 1; background-image: url(../img/all-images/bg/cta-bg1.png); background-position: center; background-size: cover; background-repeat: no-repeat; } .cta3-section-area::after { position: absolute; content: ""; height: 100%; width: 100%; background: var(--ztc-bg-bg-2); transition: all 0.4s; left: 0; top: 0; opacity: 50%; z-index: -1; } .cta3-section-area .cta-header 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; } @media (max-width: 767px) { .cta3-section-area .cta-header h2 { font-size: var(--ztc-font-size-font-s30); line-height: 40px; } } .cta3-section-area .btn-area { text-align: end; } @media (max-width: 767px) { .cta3-section-area .btn-area { text-align: start; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cta3-section-area .btn-area { text-align: start; padding-top: 30px; } } .cta3-section-area .btn-area .header-btn2-h3.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; display: inline-block; transition: all 0.4s; border: 1px solid #fff; position: relative; z-index: 1; background: none; margin-left: 16px; } @media (max-width: 767px) { .cta3-section-area .btn-area .header-btn2-h3.btn2 { margin-left: 0; margin-top: 20px; } } .cta3-section-area .btn-area .header-btn2-h3.btn2 i { transform: rotate(-45deg); transition: all 0.4s; } .cta3-section-area .btn-area .header-btn2-h3.btn2::after { position: absolute; content: ""; height: 100%; width: 10px; left: 50%; right: 50%; transition: all 0.4s; background: var(--ztc-bg-bg-6); z-index: -1; visibility: hidden; opacity: 0; top: 0; } .cta3-section-area .btn-area .header-btn2-h3.btn2:hover { color: var(--ztc-text-text-1); transition: all 0.4s; border: 1px solid var(--ztc-text-text-6); } .cta3-section-area .btn-area .header-btn2-h3.btn2:hover::after { width: 100%; left: 0; top: 0; transition: all 0.4s; visibility: visible; opacity: 1; } .cta3-section-area .btn-area .header-btn2-h3.btn2:hover i { transform: rotate(0); transition: all 0.4s; } .cta4-section-area { position: relative; z-index: 1; } .cta4-section-area .img1 img { height: 305px; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .cta4-section-area .cta-form-area { background: var(--ztc-bg-bg-7); border-radius: 4px; position: relative; z-index: 1; padding: 32px 110px 32px 32px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .cta4-section-area .cta-form-area { padding: 32px 70px 32px 32px; } } @media (max-width: 767px) { .cta4-section-area .cta-form-area { padding: 24px; } } .cta4-section-area .cta-form-area h2 { 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: 38px; transition: all 0.4s; } .cta4-section-area .cta-form-area p { color: var(--Paragraph-Color, #6C757D); 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; } @media (max-width: 767px) { .cta4-section-area .cta-form-area p { line-height: 26px; } } .cta4-section-area .cta-form-area form { position: relative; z-index: 1; } .cta4-section-area .cta-form-area form input { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: var(--ztc-weight-regular); line-height: 16px; border-radius: 52px; background: #FFF; padding: 18px; width: 415px; } @media (max-width: 767px) { .cta4-section-area .cta-form-area form input { width: 100%; } } .cta4-section-area .cta-form-area form button { position: absolute; right: 0; border-radius: 1px solid var(--ztc-text-text-2); border-radius: 50px; } @media (max-width: 767px) { .cta4-section-area .cta-form-area form button { position: relative; margin-top: 20px; } } .cta5-section-area { position: relative; z-index: 1; background-image: url(../img/all-images/bg/cta-bg2.png); background-position: center; background-size: cover; background-repeat: no-repeat; } .cta5-section-area .cta-header h2 { color: #FFF; 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; } @media (max-width: 767px) { .cta5-section-area .cta-header h2 { font-size: var(--ztc-font-size-font-s32); line-height: 40px; } } @media (max-width: 767px) { .cta5-section-area .cta-input-area { margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cta5-section-area .cta-input-area { margin-top: 30px; } } .cta5-section-area .cta-input-area form { position: relative; z-index: 1; } .cta5-section-area .cta-input-area form input { border-radius: 52px; background: #FFF; color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: 400; line-height: 16px; padding: 17px 18px; width: 350px; } @media (max-width: 767px) { .cta5-section-area .cta-input-area form input { width: 100%; } } .cta5-section-area .cta-input-area form input::-moz-placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: 400; line-height: 16px; } .cta5-section-area .cta-input-area form input::placeholder { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: 400; line-height: 16px; } .cta5-section-area .cta-input-area form button { border: none; margin-left: 16px; } @media (max-width: 767px) { .cta5-section-area .cta-input-area form button { margin-left: 0; margin-top: 20px; } } /*============= CTA CSS AREA ENDS===============*/ /*============= TESTIMONIAL CSS AREA ===============*/ .testimonial1-section-area { background: #F6F8FA; } .testimonial1-section-area .testimonial-sliders { background: var(--ztc-bg-bg-1); box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); padding: 24px; position: relative; } .testimonial1-section-area .testimonial-sliders .slick-dots { margin: 0; list-style-type: none; margin-top: 24px; display: none !important; } @media (max-width: 767px) { .testimonial1-section-area .testimonial-sliders .slick-dots { display: none !important; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial1-section-area .testimonial-sliders .slick-dots { display: none !important; } } .testimonial1-section-area .testimonial-sliders .slick-dots button { display: inline-block; width: 12px; height: 12px; padding: 0; border: none; margin: 0 20px 0 0; border-radius: 100%; background-color: #FCEBC8; text-indent: -9999px; position: relative; z-index: 3; } .testimonial1-section-area .testimonial-sliders .slick-dots button::after { height: 28px; width: 28px; display: inline-block; border-radius: 50%; border: 1px solid var(--ztc-text-text-4); position: absolute; content: ""; top: -8px; left: -8px; z-index: -1; visibility: hidden; opacity: 0; } .testimonial1-section-area .testimonial-sliders .slick-dots li.slick-active button { background: var(--ztc-text-text-4); color: var(--ztc-text-text-2); } .testimonial1-section-area .testimonial-sliders .slick-dots li.slick-active button::after { visibility: visible; opacity: 1; } .testimonial1-section-area .testimonial-sliders .testimonial-arrows { position: absolute; right: -100px; top: 37%; } @media (max-width: 767px) { .testimonial1-section-area .testimonial-sliders .testimonial-arrows { position: relative; right: 0; text-align: center; top: 0; margin-top: 30px; display: flex; justify-content: center; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial1-section-area .testimonial-sliders .testimonial-arrows { position: relative; right: 0; text-align: center; top: 0; margin-top: 30px; display: flex; justify-content: center; } } .testimonial1-section-area .testimonial-sliders .testimonial-arrows button { border: none; height: 52px; width: 52px; display: inline-block; transition: all 0.4s; background: #FCEBC8; margin: 12px 0; color: var(--ztc-text-text-2); } @media (max-width: 767px) { .testimonial1-section-area .testimonial-sliders .testimonial-arrows button { margin: 0 10px 0 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial1-section-area .testimonial-sliders .testimonial-arrows button { margin: 0 10px 0 0; } } .testimonial1-section-area .testimonial-sliders .testimonial-arrows button:hover { background: var(--ztc-text-text-4); color: var(--ztc-bg-bg-1); transition: all 0.4s; transform: translateY(-5px); } .testimonial1-section-area .testimonial-sliders .teimonial-slider-nav-area .testimonial-slider-img img { height: 100%; width: 100%; } @media (max-width: 767px) { .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea { margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea { margin-top: 30px; } } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea 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; margin-bottom: 16px; } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-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-regular); line-height: 28px; } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea .author-content { display: flex; align-items: center; margin-top: 24px; } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea .author-content .img1 img { height: 80px; width: 80px; } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea .author-content .content { margin-left: 16px; } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea .author-content .content a { color: var(--ztc-text-text-2); font-family: var(--ztc-family-font2); 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; } .testimonial1-section-area .testimonial-sliders .testimonial-content-slider .testemonial-boxarea .author-content .content a:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .testimonial2-section-area { position: relative; z-index: 1; } .testimonial2-section-area .testimonial-slider-area .owl-item.active.center { background: var(--Foundation-Blue-White, #FFF); box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.08); transition: all 0.4s; border: none; } .testimonial2-section-area .testimonial-slider-area .owl-item.active.center .testimonial-boxarea { border: 1px solid var(--ztc-bg-bg-1); transition: all 0.4s; } .testimonial2-section-area .testimonial-slider-area .owl-item.active.center .testimonial-boxarea p { color: var(--ztc-text-text-2); transition: all 0.4s; } .testimonial2-section-area .testimonial-slider-area { position: relative; } @media (max-width: 767px) { .testimonial2-section-area .testimonial-slider-area .owl-nav { display: none; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial2-section-area .testimonial-slider-area .owl-nav { display: none; } } .testimonial2-section-area .testimonial-slider-area .owl-nav button { height: 50px; width: 50px; text-align: center; line-height: 50px; border-radius: 50%; transition: all 0.4s; background: #FFF6F4; color: var(--ztc-text-text-5); } .testimonial2-section-area .testimonial-slider-area .owl-nav button:hover { background: var(--ztc-bg-bg-5); color: var(--ztc-text-text-1); transition: all 0.4s; } .testimonial2-section-area .testimonial-slider-area .owl-nav .owl-prev { position: absolute; left: 0; top: 50%; margin-top: -50px; left: -75px; } .testimonial2-section-area .testimonial-slider-area .owl-nav .owl-next { position: absolute; right: 0; top: 50%; margin-top: -50px; right: -75px; } .testimonial2-section-area .testimonial-slider-area .owl-dots { text-align: center; margin-top: 40px; } .testimonial2-section-area .testimonial-slider-area .owl-dots button { height: 12px; width: 12px; text-align: center; line-height: 12px; border-radius: 50%; background: #F8E2DB; transition: all 0.4s; position: relative; margin: 0 16px 0 0; } .testimonial2-section-area .testimonial-slider-area .owl-dots button::after { position: absolute; content: ""; height: 28px; width: 28px; border-radius: 50%; background: #F8E2DB; left: -8px; top: -8px; transition: all 0.4s; z-index: -1; visibility: hidden; opacity: 0; } .testimonial2-section-area .testimonial-slider-area .owl-dots button.active { background: var(--ztc-text-text-5); } .testimonial2-section-area .testimonial-slider-area .owl-dots button.active::after { visibility: visible; opacity: 1; } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea { border: 1px solid #EAEBEB; background: var(--Foundation-Blue-White, #FFF); position: relative; z-index: 1; padding: 32px 24px; transition: all 0.4s; } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea .quoto { height: 40px; width: 40px; -o-object-fit: contain; object-fit: contain; } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea p { color: var(--ztc-text-text-3); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s20); font-style: normal; font-weight: var(--ztc-weight-regular); line-height: 32px; transition: all 0.4s; } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea .name-area { display: flex; align-items: center; justify-content: space-between; } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea .name-area .name 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; transition: all 0.4s; display: inline-block; } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea .name-area .name ul li { display: inline-block; color: var(--ztc-text-text-4); } .testimonial2-section-area .testimonial-slider-area .testimonial-boxarea .name-area .google { height: 40px; width: 40px; -o-object-fit: contain; object-fit: contain; } .testimonial3-section-area { background: #F6F6F6; } .testimonial3-section-area .testimonial-sliders2 { background: var(--ztc-bg-bg-1); box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); padding: 24px; border-radius: 4px; position: relative; } .testimonial3-section-area .testimonial-sliders2 .slick-dots { margin: 0; list-style-type: none; margin-top: 24px; display: none !important; } @media (max-width: 767px) { .testimonial3-section-area .testimonial-sliders2 .slick-dots { display: none !important; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial3-section-area .testimonial-sliders2 .slick-dots { display: none !important; } } .testimonial3-section-area .testimonial-sliders2 .slick-dots button { display: inline-block; width: 12px; height: 12px; padding: 0; border: none; margin: 0 20px 0 0; border-radius: 100%; background-color: #FCEBC8; text-indent: -9999px; position: relative; z-index: 3; border-radius: 4px; } .testimonial3-section-area .testimonial-sliders2 .slick-dots button::after { height: 28px; width: 28px; display: inline-block; border-radius: 50%; border: 1px solid var(--ztc-text-text-6); position: absolute; content: ""; top: -8px; left: -8px; z-index: -1; visibility: hidden; opacity: 0; } .testimonial3-section-area .testimonial-sliders2 .slick-dots li.slick-active button { background: var(--ztc-text-text-6); color: var(--ztc-text-text-1); } .testimonial3-section-area .testimonial-sliders2 .slick-dots li.slick-active button::after { visibility: visible; opacity: 1; } .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows { position: absolute; right: -100px; top: 37%; } @media (max-width: 767px) { .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows { position: relative; right: 0; text-align: center; top: 0; margin-top: 30px; display: flex; justify-content: center; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows { position: relative; right: 0; text-align: center; top: 0; margin-top: 30px; display: flex; justify-content: center; } } .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows button { border: none; height: 52px; width: 52px; display: inline-block; transition: all 0.4s; background: #F9E2D5; margin: 12px 0; color: var(--ztc-text-text-2); border-radius: 4px; } @media (max-width: 767px) { .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows button { margin: 0 10px 0 0; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows button { margin: 0 10px 0 0; } } .testimonial3-section-area .testimonial-sliders2 .testimonial-arrows button:hover { background: var(--ztc-text-text-6); color: var(--ztc-bg-bg-1); transition: all 0.4s; transform: translateY(-5px); } .testimonial3-section-area .testimonial-sliders2 .teimonial-slider-nav-area .testimonial-slider-img img { height: 100%; width: 100%; border-radius: 4px; } @media (max-width: 767px) { .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea { margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea { margin-top: 30px; } } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea 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; margin-bottom: 16px; } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-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-regular); line-height: 28px; } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea .author-content { display: flex; align-items: center; margin-top: 24px; } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea .author-content .img1 img { height: 80px; width: 80px; border-radius: 4px; } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea .author-content .content { margin-left: 16px; } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea .author-content .content a { color: var(--ztc-text-text-2); font-family: var(--ztc-family-font2); 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; } .testimonial3-section-area .testimonial-sliders2 .testimonial-content-slider .testemonial-boxarea .author-content .content a:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } .testimonial4-section-area { position: relative; z-index: 1; background: #F6F6F6; } .testimonial4-section-area .testionial4-slider-area { position: relative; } .testimonial4-section-area .testionial4-slider-area .owl-stage-outer { overflow: inherit; } .testimonial4-section-area .testionial4-slider-area .owl-dots { text-align: center; margin-top: 40px; } .testimonial4-section-area .testionial4-slider-area .owl-dots button { height: 10px; width: 10px; text-align: center; line-height: 10px; border-radius: 50%; transition: all 0.4s; background: var(--ztc-text-text-2); position: relative; z-index: 1; display: inline-block; margin: 0 16px 0 0; } .testimonial4-section-area .testionial4-slider-area .owl-dots button::after { position: absolute; content: ""; height: 16px; width: 16px; text-align: center; line-height: 16px; border: 1px solid var(--ztc-text-text-2); border-radius: 50%; top: -3px; left: -3px; visibility: hidden; opacity: 0; } .testimonial4-section-area .testionial4-slider-area .owl-dots button.active::after { visibility: visible; opacity: 1; transition: all 0.4s; } .testimonial4-section-area .testionial4-slider-area .testimonial4-boxarea { position: relative; border-radius: 8px; background: #FFF; padding: 70px 24px 35px 24px; } .testimonial4-section-area .testionial4-slider-area .testimonial4-boxarea .icons { border-radius: 70px; background: var(--3rd, #FFD61E); box-shadow: 0px 4px 20px 0px rgba(47, 128, 237, 0.25); height: 70px; width: 70px; text-align: center; line-height: 70px; border-radius: 50%; transition: all 0.4s; position: absolute; top: -30px; } .testimonial4-section-area .testionial4-slider-area .testimonial4-boxarea .icons img { height: 30px; width: 30px; text-align: center; display: inline-block; } .testimonial4-section-area .testionial4-slider-area .testimonial4-boxarea .text-area 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-meduim); line-height: 30px; display: inline-block; } .testimonial4-section-area .testionial4-slider-area .testimonial4-boxarea .text-area .name-area a { color: var(--Text-Color, #03071E); 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; } .testimonial4-section-area .testionial4-slider-area .testimonial4-boxarea .text-area .name-area p { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: var(--ztc-weight-meduim); line-height: 16px; display: inline-block; } .testimonial5-section-area { position: relative; z-index: 1; background: #F6F8FA; } .testimonial5-section-area .testionial5-slider-area { position: relative; } .testimonial5-section-area .testionial5-slider-area .owl-stage-outer { overflow: inherit; } .testimonial5-section-area .testionial5-slider-area .owl-dots { text-align: center; margin-top: 40px; } .testimonial5-section-area .testionial5-slider-area .owl-dots button { height: 10px; width: 10px; text-align: center; line-height: 10px; border-radius: 50%; transition: all 0.4s; background: var(--ztc-text-text-2); position: relative; z-index: 1; display: inline-block; margin: 0 16px 0 0; } .testimonial5-section-area .testionial5-slider-area .owl-dots button::after { position: absolute; content: ""; height: 16px; width: 16px; text-align: center; line-height: 16px; border: 1px solid var(--ztc-text-text-2); border-radius: 50%; top: -3px; left: -3px; visibility: hidden; opacity: 0; } .testimonial5-section-area .testionial5-slider-area .owl-dots button.active::after { visibility: visible; opacity: 1; transition: all 0.4s; } .testimonial5-section-area .testionial5-slider-area .testimonial5-boxarea { position: relative; border-radius: 8px; background: #FFF; padding: 70px 24px 35px 24px; } .testimonial5-section-area .testionial5-slider-area .testimonial5-boxarea .icons { border-radius: 70px; background: var(--ztc-bg-bg-8); box-shadow: 0px 4px 20px 0px rgba(47, 128, 237, 0.25); height: 70px; width: 70px; text-align: center; line-height: 70px; border-radius: 50%; transition: all 0.4s; position: absolute; top: -30px; } .testimonial5-section-area .testionial5-slider-area .testimonial5-boxarea .icons img { height: 30px; width: 30px; text-align: center; display: inline-block; filter: brightness(0) invert(1); } .testimonial5-section-area .testionial5-slider-area .testimonial5-boxarea .text-area 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-meduim); line-height: 30px; display: inline-block; } .testimonial5-section-area .testionial5-slider-area .testimonial5-boxarea .text-area .name-area a { color: var(--Text-Color, #03071E); 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; } .testimonial5-section-area .testionial5-slider-area .testimonial5-boxarea .text-area .name-area p { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: var(--ztc-weight-meduim); line-height: 16px; display: inline-block; } /*============= TESTIMONIAL CSS AREA ENDS ===============*/ /*============= CHOOSE CSS AREA STARTS ===============*/ .choose1-section-area { position: relative; z-index: 1; } .choose1-section-area .choose-header { padding: 0 50px 0 0; } @media (max-width: 767px) { .choose1-section-area .choose-header { padding: 0; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .choose1-section-area .choose-header { padding: 0; margin-bottom: 30px; } } .choose1-section-area .choose-header .list-area { position: relative; } .choose1-section-area .choose-header .list-area .icons { position: absolute; } .choose1-section-area .choose-header .list-area .text { padding-left: 24px; } .choose1-section-area .choose-header .list-area .text a { color: var(--Text-Color, #03071E); 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% */ display: inline-block; transition: all 0.4s; } .choose1-section-area .choose-images { position: relative; z-index: 1; } .choose1-section-area .choose-images .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .choose1-section-area .choose-images .others-area { display: flex; align-items: center; background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); padding: 16px 0; width: 370px; position: relative; left: 50%; margin-top: -60px; margin-left: -180px; } .choose1-section-area .choose-images .others-area .widget-text { text-align: center; padding: 0 32px; border-right: 1px solid #EAEBEB; } .choose1-section-area .choose-images .others-area .widget-text:hover .icons { background: var(--ztc-text-text-5); transition: all 0.4s; } .choose1-section-area .choose-images .others-area .widget-text:hover .icons img { filter: brightness(0) invert(1); transition: all 0.4s; } .choose1-section-area .choose-images .others-area .widget-text .icons { height: 48px; width: 48px; border-radius: 50%; display: inline-block; transition: all 0.4s; border: 1px solid var(--ztc-text-text-5); line-height: 48px; text-align: center; } .choose1-section-area .choose-images .others-area .widget-text .icons img { transition: all 0.4s; } .choose1-section-area .choose-images .others-area .widget-text p { 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); line-height: 20px; padding-top: 16px; } .choose5-section-area { position: relative; z-index: 1; } .choose5-section-area .choose-header { padding: 0 50px 0 0; } @media (max-width: 767px) { .choose5-section-area .choose-header { padding: 0; margin-bottom: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .choose5-section-area .choose-header { padding: 0; margin-bottom: 30px; } } .choose5-section-area .choose-header .list-area { position: relative; } .choose5-section-area .choose-header .list-area .icons { position: absolute; } .choose5-section-area .choose-header .list-area .text { padding-left: 24px; } .choose5-section-area .choose-header .list-area .text a { color: var(--Text-Color, #03071E); 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% */ display: inline-block; transition: all 0.4s; } .choose5-section-area .choose-images { position: relative; z-index: 1; } .choose5-section-area .choose-images .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .choose5-section-area .choose-images .others-area { display: flex; align-items: center; background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); padding: 16px 0; width: 370px; position: relative; left: 50%; margin-top: -60px; margin-left: -180px; } .choose5-section-area .choose-images .others-area .widget-text { text-align: center; padding: 0 32px; border-right: 1px solid #EAEBEB; } .choose5-section-area .choose-images .others-area .widget-text:hover .icons { background: var(--ztc-text-text-8); transition: all 0.4s; } .choose5-section-area .choose-images .others-area .widget-text:hover .icons img { filter: brightness(0) invert(1); transition: all 0.4s; } .choose5-section-area .choose-images .others-area .widget-text .icons { height: 48px; width: 48px; border-radius: 50%; display: inline-block; transition: all 0.4s; border: 1px solid var(--ztc-text-text-8); line-height: 48px; text-align: center; } .choose5-section-area .choose-images .others-area .widget-text .icons img { transition: all 0.4s; } .choose5-section-area .choose-images .others-area .widget-text p { 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); line-height: 20px; padding-top: 16px; } .choose6-section-area { position: relative; z-index: 1; background: #F6F8FA; } .choose6-section-area .choose-header { padding: 0 0 0 50px; } @media (max-width: 767px) { .choose6-section-area .choose-header { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .choose6-section-area .choose-header { padding: 0; margin-top: 30px; } } .choose6-section-area .choose-header .list-area { position: relative; } .choose6-section-area .choose-header .list-area .icons { position: absolute; } .choose6-section-area .choose-header .list-area .text { padding-left: 24px; } .choose6-section-area .choose-header .list-area .text a { color: var(--Text-Color, #03071E); 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; } .choose6-section-area .choose-images { position: relative; z-index: 1; } .choose6-section-area .choose-images .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .choose6-section-area .choose-images .others-area { display: flex; align-items: center; background: #FFF; box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.08); padding: 16px 0; width: 370px; position: relative; left: 50%; margin-top: -60px; margin-left: -180px; } .choose6-section-area .choose-images .others-area .widget-text { text-align: center; padding: 0 32px; border-right: 1px solid #EAEBEB; } .choose6-section-area .choose-images .others-area .widget-text:hover .icons { background: var(--ztc-text-text-4); transition: all 0.4s; } .choose6-section-area .choose-images .others-area .widget-text:hover .icons img { filter: brightness(0); transition: all 0.4s; } .choose6-section-area .choose-images .others-area .widget-text .icons { height: 48px; width: 48px; border-radius: 50%; display: inline-block; transition: all 0.4s; border: 1px solid var(--ztc-text-text-4); line-height: 48px; text-align: center; } .choose6-section-area .choose-images .others-area .widget-text .icons img { transition: all 0.4s; } .choose6-section-area .choose-images .others-area .widget-text p { 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); line-height: 20px; padding-top: 16px; } /*============= CHOOSE CSS AREA ENDS ===============*/ /*============= WORKS CSS AREA ===============*/ .works-section-area { position: relative; z-index: 1; background: var(--ztc-bg-bg-2); } .works-section-area .step-by-step { position: relative; z-index: 1; } .works-section-area .step-by-step::after { position: absolute; content: ""; height: 1px; width: 100%; left: 0; top: 10px; background: var(--ztc-bg-bg-1); z-index: -1; } .works-section-area .step-by-step .step-area { margin-bottom: 30px; } .works-section-area .step-by-step .step-area h4 { height: 20px; width: 20px; background: var(--ztc-bg-bg-3); border-radius: 50%; } .works-section-area .step-by-step .step-area 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; display: inline-block; transition: all 0.4s; } .works-section-area .step-by-step .step-area a:hover { color: var(--ztc-text-text-4); } .works-section-area .step-by-step .step-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-regular); line-height: 28px; opacity: 0.8; } .choose3-section-area { position: relative; z-index: 1; background: #F6F6F6; } .choose3-section-area .images-area .img1 img { width: 450px; height: 300px; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .choose3-section-area .images-area .img2 { position: relative; margin-top: -80px; } .choose3-section-area .images-area .img2 img { width: 300px; height: 220px; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .choose3-section-area .choose-pera-area { padding: 0 0 0 40px; } @media (max-width: 767px) { .choose3-section-area .choose-pera-area { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .choose3-section-area .choose-pera-area { padding: 0; margin-top: 30px; } } .choose3-section-area .choose-pera-area .list-area { position: relative; z-index: 1; } .choose3-section-area .choose-pera-area .list-area:hover .icons { background: var(--ztc-bg-bg-6); transition: all 0.4s; transform: rotateY(-180deg); } .choose3-section-area .choose-pera-area .list-area:hover .icons img { filter: brightness(0) invert(1); transition: all 0.4s; } .choose3-section-area .choose-pera-area .list-area .icons { height: 48px; width: 48px; text-align: center; line-height: 48px; border-radius: 50%; transition: all 0.4s; display: inline-block; background: #F9E2D5; position: absolute; } .choose3-section-area .choose-pera-area .list-area .icons img { transition: all 0.4s; } .choose3-section-area .choose-pera-area .list-area .content { padding-left: 70px; } .choose3-section-area .choose-pera-area .list-area .content a { color: var(--Text-Color, #03071E); font-family: var(--ztc-family-font1); font-size: 18px; font-style: normal; font-weight: 700; line-height: 18px; transition: all 0.4s; display: inline-block; } /*============= WORKS CSS AREA ===============*/ /*============= PROJECT CSS AREA ===============*/ .project1-section-area { position: relative; z-index: 1; } .project1-section-area .swiper-slide.swiper-slide-visible.swiper-slide-next { transform: rotateY(-50deg) !important; } .project1-section-area .swiper-slide.swiper-slide-visible.swiper-slide-prev { transform: rotateY(50deg) !important; } .project1-section-area .swiper-slide.swiper-slide-visible.swiper-slide-active img { transform: scale(0.8); } .project1-section-area .swiper { width: 100%; height: 100%; overflow: inherit !important; } .project1-section-area .swiper-slide img { height: 100%; width: 100%; max-width: 100%; -o-object-fit: cover; object-fit: cover; } .project1-section-area .swiper-horizontal > .swiper-scrollbar, .project1-section-area .swiper-scrollbar.swiper-scrollbar-horizontal { display: none; } .project1-section-area span.outer-dot { position: relative; height: 20px; width: 20px; border: solid 2px transparent; background: transparent; top: 15px; } .project1-section-area span.inner-dot { position: absolute; width: 12px; height: 12px; border-radius: 50px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #FFAF01; margin: 0 !important; } .project1-section-area span.inner-dot::after { position: absolute; content: ""; height: 28px; width: 28px; border-radius: 50%; border: 1px solid var(--ztc-text-text-4); transition: all 0.4s; left: -8px; top: -8px; visibility: hidden; opacity: 0; } .project1-section-area span.outer-dot.swiper-pagination-bullet-active span.inner-dot { background: #FFAF01; } .project1-section-area span.outer-dot.swiper-pagination-bullet-active span.inner-dot::after { visibility: visible; opacity: 1; } .project1-section-area .swiper-3d .swiper-slide-shadow-right { display: none !important; } .project1-section-area .swiper-slide.swiper-slide-visible.swiper-slide-active .img1::after { height: 100%; transition: all 0.4s; } .project1-section-area .swiper-slide.swiper-slide-visible.swiper-slide-active .content-area { bottom: 0; transition: all 0.6s; } .project1-section-area .swiper-slide { position: relative; z-index: 1; overflow: hidden; } .project1-section-area .swiper-slide .img1 { position: relative; z-index: 1; } .project1-section-area .swiper-slide .img1::after { position: absolute; content: ""; height: 0; width: 100%; left: 0; top: 0; background: var(--ztc-text-text-2); transition: all 0.4s; opacity: 0.7; transform: scale(0.8); } .project1-section-area .swiper-slide .content-area { position: absolute; z-index: 2; bottom: -300px; left: 0; padding: 90px; transition: all 0.6s; } @media (max-width: 767px) { .project1-section-area .swiper-slide .content-area { padding: 60px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .project1-section-area .swiper-slide .content-area { padding: 120px; } } .project1-section-area .swiper-slide .content-area a { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 20px; font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 20px; display: inline-block; transition: all 0.4s; } .project1-section-area .swiper-slide .content-area p { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: var(--ztc-weight-regular); line-height: 24px; display: inline-block; transition: all 0.4s; opacity: 0.8; } .project1-section-area .swiper-slide .content-area a.readmore { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 16px; display: inline-block; transition: all 0.4s; } .project1-section-area .swiper-slide .content-area a.readmore:hover { color: var(--ztc-text-text-4); transition: all 0.4s; } .project1-section-area .swiper-slide .content-area a.readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .project2-section-area { position: relative; z-index: 1; } .project2-section-area .project-boxarea { position: relative; z-index: 1; transition: all 0.4s; overflow: hidden; height: 310px; margin-bottom: 30px; } .project2-section-area .project-boxarea:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.7; } .project2-section-area .project-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .project2-section-area .project-boxarea:hover .content-area { bottom: 20px; transition: all 0.6s; } .project2-section-area .project-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.7); visibility: hidden; } .project2-section-area .project-boxarea .img1 img { width: 100%; height: 310px; transition: all 0.4s; -o-object-fit: cover; object-fit: cover; } .project2-section-area .project-boxarea .content-area { background: var(--ztc-bg-bg-5); padding: 16px; display: inline-block; transition: all 0.6s; position: absolute; bottom: -200px; left: 20px; } .project2-section-area .project-boxarea .content-area a.head { color: var(--White, #FFF); 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; } .project2-section-area .project-boxarea .content-area a.readmore { color: var(--White, #FFF); 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; } .project2-section-area .project-boxarea .content-area a.readmore i { margin-left: 4px; transform: rotate(-45deg); } .project3-section-area { position: relative; z-index: 1; } .project3-section-area .swiper-slide.swiper-slide-visible.swiper-slide-next { transform: rotateY(-50deg) !important; } .project3-section-area .swiper-slide.swiper-slide-visible.swiper-slide-prev { transform: rotateY(50deg) !important; } .project3-section-area .swiper-slide.swiper-slide-visible.swiper-slide-active img { transform: scale(0.8); } .project3-section-area .swiper2 { width: 100%; height: 100%; overflow: inherit !important; } .project3-section-area .swiper-slide img { height: 100%; width: 100%; max-width: 100%; -o-object-fit: cover; object-fit: cover; } .project3-section-area .swiper-horizontal > .swiper-scrollbar, .project3-section-area .swiper-scrollbar.swiper-scrollbar-horizontal { display: none; } .project3-section-area span.outer-dot { position: relative; height: 20px; width: 20px; border: solid 2px transparent; background: transparent; top: 15px; } .project3-section-area span.inner-dot { position: absolute; width: 12px; height: 12px; border-radius: 50px; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #ff6332; margin: 0 !important; } .project3-section-area span.inner-dot::after { position: absolute; content: ""; height: 28px; width: 28px; border-radius: 50%; border: 1px solid var(--ztc-text-text-6); transition: all 0.4s; left: -8px; top: -8px; visibility: hidden; opacity: 0; } .project3-section-area span.outer-dot.swiper-pagination-bullet-active span.inner-dot { background: var(--ztc-text-text-6); } .project3-section-area span.outer-dot.swiper-pagination-bullet-active span.inner-dot::after { visibility: visible; opacity: 1; } .project3-section-area .swiper-3d .swiper-slide-shadow-right { display: none !important; } .project3-section-area .swiper-slide.swiper-slide-visible.swiper-slide-active .img1::after { height: 100%; transition: all 0.4s; } .project3-section-area .swiper-slide.swiper-slide-visible.swiper-slide-active .content-area { bottom: 0; transition: all 0.6s; } .project3-section-area .swiper-slide { position: relative; z-index: 1; overflow: hidden; } .project3-section-area .swiper-slide .img1 { position: relative; z-index: 1; } .project3-section-area .swiper-slide .img1::after { position: absolute; content: ""; height: 0; width: 100%; left: 0; top: 0; background: var(--ztc-text-text-2); transition: all 0.4s; opacity: 0.7; transform: scale(0.8); } .project3-section-area .swiper-slide .content-area { position: absolute; z-index: 2; bottom: -300px; left: 0; padding: 90px; transition: all 0.6s; } @media (max-width: 767px) { .project3-section-area .swiper-slide .content-area { padding: 60px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .project3-section-area .swiper-slide .content-area { padding: 120px; } } .project3-section-area .swiper-slide .content-area a { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 20px; font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 20px; display: inline-block; transition: all 0.4s; } .project3-section-area .swiper-slide .content-area p { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: var(--ztc-weight-regular); line-height: 24px; display: inline-block; transition: all 0.4s; opacity: 0.8; } .project3-section-area .swiper-slide .content-area a.readmore { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: var(--ztc-weight-bold); line-height: 16px; display: inline-block; transition: all 0.4s; } .project3-section-area .swiper-slide .content-area a.readmore:hover { color: var(--ztc-text-text-6); transition: all 0.4s; } .project3-section-area .swiper-slide .content-area a.readmore i { margin-left: 4px; transform: rotate(-45deg); transition: all 0.4s; } .project4-section-area { position: relative; z-index: 1; } .project4-section-area .project-boxarea { position: relative; z-index: 1; transition: all 0.4s; overflow: hidden; height: 310px; margin-bottom: 30px; } .project4-section-area .project-boxarea:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.7; border-radius: 4px; } .project4-section-area .project-boxarea:hover .img1::before { visibility: visible; opacity: 1; transition: all 0.4s; } .project4-section-area .project-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; border-radius: 4px; } .project4-section-area .project-boxarea:hover .content-area { top: 20px; transition: all 0.6s; } .project4-section-area .project-boxarea:hover .arrow { bottom: 8px; transition: all 0.6s; } .project4-section-area .project-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.7); visibility: hidden; border-radius: 4px; } .project4-section-area .project-boxarea .img1::before { position: absolute; content: ""; height: 50px; width: 50px; display: inline-block; transition: all 0.4s; right: 0; bottom: 0; z-index: 1; background: #fff; border-radius: 5px 0 0 0; visibility: hidden; opacity: 0; } .project4-section-area .project-boxarea .img1 img { width: 100%; height: 310px; transition: all 0.4s; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .project4-section-area .project-boxarea .content-area { padding: 16px; display: inline-block; transition: all 0.6s; position: absolute; top: -200px; left: 16px; } .project4-section-area .project-boxarea .content-area a.head { color: var(--White, #FFF); 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; } .project4-section-area .project-boxarea .content-area p { color: var(--White, #FFF); font-family: var(--ztc-family-font1); font-size: 16px; font-style: normal; font-weight: 400; line-height: 28px; } .project4-section-area .project-boxarea .arrow { position: absolute; bottom: -100px; right: 8px; transition: all 0.6s; z-index: 3; } .project4-section-area .project-boxarea .arrow a.readmore { color: var(--White, #FFF); 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; } .project4-section-area .project-boxarea .arrow a.readmore span { height: 30px; width: 30px; display: inline-block; transition: all 0.4s; border-radius: 50%; background: var(--ztc-bg-bg-7); color: var(--ztc-text-text-2); text-align: center; line-height: 30px; transform: rotate(-45deg); margin-left: 16px; } .project5-section-area { position: relative; z-index: 1; } .project5-section-area .project5-boxarea { position: relative; z-index: 1; transition: all 0.4s; overflow: hidden; height: 310px; margin-bottom: 30px; border-radius: 4px; } .project5-section-area .project5-boxarea:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.7; } .project5-section-area .project5-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .project5-section-area .project5-boxarea:hover .content-area { bottom: 20px; transition: all 0.6s; } .project5-section-area .project5-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.7); visibility: hidden; border-radius: 4px; } .project5-section-area .project5-boxarea .img1 img { width: 100%; height: 310px; transition: all 0.4s; -o-object-fit: cover; object-fit: cover; border-radius: 4px; } .project5-section-area .project5-boxarea .content-area { background: var(--ztc-bg-bg-8); padding: 16px; display: inline-block; transition: all 0.6s; position: absolute; bottom: -200px; left: 20px; border-radius: 4px; } .project5-section-area .project5-boxarea .content-area a.head { color: var(--White, #FFF); 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; } .project5-section-area .project5-boxarea .content-area a.readmore { color: var(--White, #FFF); 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; } .project5-section-area .project5-boxarea .content-area a.readmore i { margin-left: 4px; transform: rotate(-45deg); } .project2-section-inner-area { position: relative; z-index: 1; } .project2-section-inner-area .project-boxarea { position: relative; z-index: 1; transition: all 0.4s; overflow: hidden; height: 310px; margin-bottom: 30px; } .project2-section-inner-area .project-boxarea:hover .img1::after { transform: scale(1); transition: all 0.4s; visibility: visible; opacity: 0.7; } .project2-section-inner-area .project-boxarea:hover .img1 img { transform: scale(1.1) rotate(4deg); transition: all 0.4s; } .project2-section-inner-area .project-boxarea:hover .content-area { bottom: 20px; transition: all 0.6s; } .project2-section-inner-area .project-boxarea .img1::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; transition: all 0.4s; background: var(--ztc-bg-bg-2); opacity: 0; transform: scale(0.7); visibility: hidden; } .project2-section-inner-area .project-boxarea .img1 img { width: 100%; height: 310px; transition: all 0.4s; -o-object-fit: cover; object-fit: cover; } .project2-section-inner-area .project-boxarea .content-area { background: var(--ztc-bg-bg-3); padding: 16px; display: inline-block; transition: all 0.6s; position: absolute; bottom: -200px; left: 20px; } .project2-section-inner-area .project-boxarea .content-area a.head { 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; } .project2-section-inner-area .project-boxarea .content-area a.readmore { 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; display: inline-block; transition: all 0.4s; } .project2-section-inner-area .project-boxarea .content-area a.readmore i { margin-left: 4px; transform: rotate(-45deg); } .projects-inner-area { position: relative; z-index: 1; } .projects-inner-area .project-details-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; } @media (max-width: 767px) { .projects-inner-area .project-details-area h3 { font-size: var(--ztc-font-size-font-s28); line-height: 36px; } } .projects-inner-area .project-details-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: 400; line-height: 28px; } .projects-inner-area .project-details-area .img1 img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .projects-inner-area .project-details-area .project-author-area { display: flex; align-items: center; justify-content: space-between; } @media (max-width: 767px) { .projects-inner-area .project-details-area .project-author-area { display: block; text-align: center; } } @media (max-width: 767px) { .projects-inner-area .project-details-area .project-author-area .author-content { padding-top: 30px; } } .projects-inner-area .project-details-area .project-author-area .author-content h4 { color: var(--Text-Color, #03071E); 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; } .projects-inner-area .project-details-area .project-author-area .author-content p { color: var(--Paragraph-Color, #6C757D); font-family: var(--ztc-family-font1); font-size: var(--ztc-font-size-font-s16); font-style: normal; font-weight: 400; line-height: 16px; } /*============= PROJECT CSS AREA ===============*/ /*============= COST CSS AREA ===============*/ .cost-calculator-area { position: relative; z-index: 1; background-image: url(../img/all-images/cost/cost-bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .cost-calculator-area::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; background: var(--ztc-bg-bg-2); opacity: 0.3; z-index: -1; } .cost-calculator-area .cost-header h5 img { filter: brightness(0) invert(1); } .cost-calculator-area .cost-section-boxarea { background: var(--ztc-bg-bg-1); padding: 32px; } @media (max-width: 767px) { .cost-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } .cost-calculator-area .cost-section-boxarea .slider-area h3 { color: var(--Text-Color, #03071E); 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; } .cost-calculator-area .cost-section-boxarea .slider-area .slider-container { position: relative; } .cost-calculator-area .cost-section-boxarea .slider-area input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; background: #ddd; outline: none; } .cost-calculator-area .cost-section-boxarea .slider-area input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; background: #f39c12; cursor: pointer; border-radius: 50%; } .cost-calculator-area .cost-section-boxarea .slider-area input[type=range]::-moz-range-thumb { width: 20px; height: 20px; background: #f39c12; cursor: pointer; } .cost-calculator-area .cost-section-boxarea .slider-area .slider-value { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-3); color: var(--ztc-text-text-2); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; } .cost-calculator-area .cost-section-boxarea .slider-area .slider-value2 { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-3); color: var(--ztc-text-text-2); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; } .cost-calculator-area .cost-section-boxarea .select-area h3 { color: var(--Text-Color, #03071E); 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; } .cost-calculator-area .cost-section-boxarea .select-area .nice-select { width: 100%; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); box-shadow: none; padding: 16px; height: 50px; line-height: 16px !important; color: var(--ztc-text-text-2); } .cost-calculator-area .cost-section-boxarea .select-area .nice-select::after { width: 7px; height: 7px; -o-object-fit: cover; object-fit: cover; filter: brightness(0); } .cost-calculator-area .cost-section-boxarea .select-area .nice-select span.current { 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; } .cost-calculator-area .cost-section-boxarea .select-area .nice-select ul { width: 100%; } .cost-calculator-area .cost-section-boxarea .select-area .nice-select ul li:hover { background: var(--ztc-bg-bg-3); color: var(--ztc-text-text-2); } .cost-calculator-area .cost-section-boxarea .select-area .btn-area1 { background: var(--Background-Color, #F6F6F6); padding: 7px; display: inline-block; } .cost-calculator-area .cost-section-boxarea .select-area .btn-area1 a.active-size { background: var(--ztc-bg-bg-3); transition: all 0.4s; color: var(--ztc-text-text-2); } .cost-calculator-area .cost-section-boxarea .select-area .btn-area1 .yes { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; border: none; outline: none; } .cost-calculator-area .cost-section-boxarea .select-area .btn-area1 .no { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; margin-left: 8px; border: none; outline: none; accent-color: var(--ztc-bg-bg-2); } .cost-calculator-area .cost-section-boxarea h2 { color: var(--ztc-text-text-4); 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: 60px; } .cost-calculator-area .cost-section-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-regular); line-height: 16px; } .cost-calculator-area .cost-section-boxarea .materials-area h3 { color: var(--Text-Color, #03071E); 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; } .cost-calculator-area .cost-section-boxarea .materials-area ul li { display: inline-block; } .cost-calculator-area .cost-section-boxarea .materials-area 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; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); padding: 16px; margin: 16px 16px 0 0; } .cost-calculator-area .cost-section-boxarea .materials-area ul li a:hover { background: var(--ztc-bg-bg-2); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost-calculator-area .cost-section-boxarea .cost-head { padding: 0 0 0 30px; } @media (max-width: 767px) { .cost-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } .cost-calculator-area .cost-section-boxarea .cost-head 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; } .cost-calculator-area .cost-section-boxarea .cost-head 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-regular); line-height: 28px; } .cost-calculator-area .cost-section-boxarea .cost-head 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-medium); line-height: 18px; padding-top: 16px; } .cost-calculator-area .cost-section-boxarea .cost-head ul li img { height: 16px; width: 16px; -o-object-fit: cover; object-fit: cover; margin: 0 8px 0 0; } .cost-calculator-area .cost-section-boxarea .cost-head .btn-area a { width: 100%; text-align: center; } .cost2-calculator-area { position: relative; z-index: 1; background-image: url(../img/all-images/cost/cost-bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .cost2-calculator-area::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; background: var(--ztc-bg-bg-2); opacity: 0.3; z-index: -1; } .cost2-calculator-area .cost-header h5 img { filter: brightness(0) invert(1); } .cost2-calculator-area .cost-section-boxarea { background: var(--ztc-bg-bg-1); padding: 32px; } @media (max-width: 767px) { .cost2-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost2-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } .cost2-calculator-area .cost-section-boxarea .slider-area h3 { color: var(--Text-Color, #03071E); 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; } .cost2-calculator-area .cost-section-boxarea .slider-area .slider-container { position: relative; } .cost2-calculator-area .cost-section-boxarea .slider-area input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; background: #ddd; outline: none; } .cost2-calculator-area .cost-section-boxarea .slider-area input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; background: var(--ztc-bg-bg-5); cursor: pointer; border-radius: 50%; } .cost2-calculator-area .cost-section-boxarea .slider-area input[type=range]::-moz-range-thumb { width: 20px; height: 20px; background: var(--ztc-bg-bg-5); cursor: pointer; } .cost2-calculator-area .cost-section-boxarea .slider-area .slider-value { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-5); color: var(--ztc-text-text-1); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; } .cost2-calculator-area .cost-section-boxarea .slider-area .slider-value2 { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-5); color: var(--ztc-text-text-1); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; } .cost2-calculator-area .cost-section-boxarea .select-area h3 { color: var(--Text-Color, #03071E); 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; } .cost2-calculator-area .cost-section-boxarea .select-area .nice-select { width: 100%; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); box-shadow: none; padding: 16px; height: 50px; line-height: 16px !important; color: var(--ztc-text-text-2); } .cost2-calculator-area .cost-section-boxarea .select-area .nice-select::after { width: 7px; height: 7px; -o-object-fit: cover; object-fit: cover; filter: brightness(0); } .cost2-calculator-area .cost-section-boxarea .select-area .nice-select span.current { 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; } .cost2-calculator-area .cost-section-boxarea .select-area .nice-select ul { width: 100%; } .cost2-calculator-area .cost-section-boxarea .select-area .nice-select ul li:hover { background: var(--ztc-bg-bg-5); color: var(--ztc-text-text-1); } .cost2-calculator-area .cost-section-boxarea .select-area .btn-area1 { background: var(--Background-Color, #F6F6F6); padding: 7px; display: inline-block; } .cost2-calculator-area .cost-section-boxarea .select-area .btn-area1 a.active-size { background: var(--ztc-bg-bg-5); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost2-calculator-area .cost-section-boxarea .select-area .btn-area1 .yes { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; } .cost2-calculator-area .cost-section-boxarea .select-area .btn-area1 .no { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; margin-left: 8px; } .cost2-calculator-area .cost-section-boxarea h2 { color: var(--ztc-text-text-5); 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: 60px; } .cost2-calculator-area .cost-section-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-regular); line-height: 16px; } .cost2-calculator-area .cost-section-boxarea .materials-area h3 { color: var(--Text-Color, #03071E); 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; } .cost2-calculator-area .cost-section-boxarea .materials-area ul li { display: inline-block; } .cost2-calculator-area .cost-section-boxarea .materials-area 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; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); padding: 16px; margin: 16px 16px 0 0; } .cost2-calculator-area .cost-section-boxarea .materials-area ul li a:hover { background: var(--ztc-bg-bg-2); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost2-calculator-area .cost-section-boxarea .cost-head { padding: 0 0 0 30px; } @media (max-width: 767px) { .cost2-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost2-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } .cost2-calculator-area .cost-section-boxarea .cost-head 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; } .cost2-calculator-area .cost-section-boxarea .cost-head 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-regular); line-height: 28px; } .cost2-calculator-area .cost-section-boxarea .cost-head 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-medium); line-height: 18px; padding-top: 16px; } .cost2-calculator-area .cost-section-boxarea .cost-head ul li img { height: 16px; width: 16px; -o-object-fit: cover; object-fit: cover; margin: 0 8px 0 0; } .cost2-calculator-area .cost-section-boxarea .cost-head .btn-area a { width: 100%; text-align: center; } .cost3-calculator-area { position: relative; z-index: 1; background-image: url(../img/all-images/cost/cost-bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .cost3-calculator-area::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; background: var(--ztc-bg-bg-2); opacity: 0.3; z-index: -1; } .cost3-calculator-area .cost-header h5 img { filter: brightness(0) invert(1); } .cost3-calculator-area .cost-section-boxarea { background: var(--ztc-bg-bg-1); padding: 32px; } @media (max-width: 767px) { .cost3-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost3-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } .cost3-calculator-area .cost-section-boxarea .slider-area h3 { color: var(--Text-Color, #03071E); 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; } .cost3-calculator-area .cost-section-boxarea .slider-area .slider-container { position: relative; } .cost3-calculator-area .cost-section-boxarea .slider-area input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; background: #ddd; outline: none; } .cost3-calculator-area .cost-section-boxarea .slider-area input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; background: #FF6610; cursor: pointer; border-radius: 25px; border-radius: 50%; } .cost3-calculator-area .cost-section-boxarea .slider-area input[type=range]::-moz-range-thumb { width: 20px; height: 20px; background: #FF6610; cursor: pointer; } .cost3-calculator-area .cost-section-boxarea .slider-area .slider-value { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-6); color: var(--ztc-text-text-1); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; border-radius: 25px; } .cost3-calculator-area .cost-section-boxarea .slider-area .slider-value2 { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-6); color: var(--ztc-text-text-1); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; border-radius: 25px; } .cost3-calculator-area .cost-section-boxarea .select-area h3 { color: var(--Text-Color, #03071E); 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; } .cost3-calculator-area .cost-section-boxarea .select-area .nice-select { width: 100%; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); box-shadow: none; padding: 16px; height: 50px; line-height: 16px !important; color: var(--ztc-text-text-2); border-radius: 50px; } .cost3-calculator-area .cost-section-boxarea .select-area .nice-select::after { width: 7px; height: 7px; -o-object-fit: cover; object-fit: cover; filter: brightness(0); } .cost3-calculator-area .cost-section-boxarea .select-area .nice-select span.current { 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; } .cost3-calculator-area .cost-section-boxarea .select-area .nice-select ul { width: 100%; } .cost3-calculator-area .cost-section-boxarea .select-area .nice-select ul li:hover { background: var(--ztc-bg-bg-6); color: var(--ztc-text-text-2); } .cost3-calculator-area .cost-section-boxarea .select-area .btn-area1 { background: var(--Background-Color, #F6F6F6); padding: 7px; display: inline-block; border-radius: 50px; } .cost3-calculator-area .cost-section-boxarea .select-area .btn-area1 a.active-size { background: var(--ztc-bg-bg-6); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost3-calculator-area .cost-section-boxarea .select-area .btn-area1 .yes { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; border-radius: 54px; } .cost3-calculator-area .cost-section-boxarea .select-area .btn-area1 .no { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; margin-left: 8px; border-radius: 54px; } .cost3-calculator-area .cost-section-boxarea h2 { color: var(--ztc-text-text-6); 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: 60px; } .cost3-calculator-area .cost-section-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-regular); line-height: 16px; } .cost3-calculator-area .cost-section-boxarea .materials-area h3 { color: var(--Text-Color, #03071E); 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; } .cost3-calculator-area .cost-section-boxarea .materials-area ul li { display: inline-block; } .cost3-calculator-area .cost-section-boxarea .materials-area 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; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); padding: 16px; margin: 16px 16px 0 0; border-radius: 54px; } .cost3-calculator-area .cost-section-boxarea .materials-area ul li a:hover { background: var(--ztc-bg-bg-2); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost3-calculator-area .cost-section-boxarea .cost-head { padding: 0 0 0 30px; } @media (max-width: 767px) { .cost3-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost3-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } .cost3-calculator-area .cost-section-boxarea .cost-head 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; } .cost3-calculator-area .cost-section-boxarea .cost-head 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-regular); line-height: 28px; } .cost3-calculator-area .cost-section-boxarea .cost-head 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-medium); line-height: 18px; padding-top: 16px; } .cost3-calculator-area .cost-section-boxarea .cost-head ul li img { height: 16px; width: 16px; -o-object-fit: cover; object-fit: cover; margin: 0 8px 0 0; } .cost4-calculator-area { position: relative; z-index: 1; background-image: url(../img/all-images/cost/cost-bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .cost4-calculator-area::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; background: var(--ztc-bg-bg-2); opacity: 0.3; z-index: -1; } .cost4-calculator-area .cost-header h5 img { filter: brightness(0) invert(1); } .cost4-calculator-area .cost-section-boxarea { background: var(--ztc-bg-bg-1); padding: 32px; } @media (max-width: 767px) { .cost4-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost4-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } .cost4-calculator-area .cost-section-boxarea .slider-area h3 { color: var(--Text-Color, #03071E); 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; } .cost4-calculator-area .cost-section-boxarea .slider-area .slider-container { position: relative; } .cost4-calculator-area .cost-section-boxarea .slider-area input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; background: #ddd; outline: none; } .cost4-calculator-area .cost-section-boxarea .slider-area input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; background: #FFD61E; cursor: pointer; border-radius: 25px; border-radius: 50%; } .cost4-calculator-area .cost-section-boxarea .slider-area input[type=range]::-moz-range-thumb { width: 20px; height: 20px; background: #FFD61E; cursor: pointer; } .cost4-calculator-area .cost-section-boxarea .slider-area .slider-value { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-7); color: var(--ztc-text-text-2); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; border-radius: 25px; } .cost4-calculator-area .cost-section-boxarea .slider-area .slider-value2 { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-bg-bg-7); color: var(--ztc-text-text-2); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; border-radius: 25px; } .cost4-calculator-area .cost-section-boxarea .select-area h3 { color: var(--Text-Color, #03071E); 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; } .cost4-calculator-area .cost-section-boxarea .select-area .nice-select { width: 100%; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); box-shadow: none; padding: 16px; height: 50px; line-height: 16px !important; color: var(--ztc-text-text-2); border-radius: 50px; } .cost4-calculator-area .cost-section-boxarea .select-area .nice-select::after { width: 7px; height: 7px; -o-object-fit: cover; object-fit: cover; filter: brightness(0); } .cost4-calculator-area .cost-section-boxarea .select-area .nice-select span.current { 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; } .cost4-calculator-area .cost-section-boxarea .select-area .nice-select ul { width: 100%; } .cost4-calculator-area .cost-section-boxarea .select-area .nice-select ul li:hover { background: var(--ztc-bg-bg-7); color: var(--ztc-text-text-2); } .cost4-calculator-area .cost-section-boxarea .select-area .btn-area1 { background: var(--Background-Color, #F6F6F6); padding: 7px; display: inline-block; border-radius: 50px; } .cost4-calculator-area .cost-section-boxarea .select-area .btn-area1 a.active-size { background: var(--ztc-bg-bg-7); transition: all 0.4s; color: var(--ztc-text-text-2); } .cost4-calculator-area .cost-section-boxarea .select-area .btn-area1 .yes { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; border-radius: 54px; } .cost4-calculator-area .cost-section-boxarea .select-area .btn-area1 .no { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; margin-left: 8px; border-radius: 54px; } .cost4-calculator-area .cost-section-boxarea h2 { color: var(--ztc-text-text-7); 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: 60px; } .cost4-calculator-area .cost-section-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-regular); line-height: 16px; } .cost4-calculator-area .cost-section-boxarea .materials-area h3 { color: var(--Text-Color, #03071E); 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; } .cost4-calculator-area .cost-section-boxarea .materials-area ul li { display: inline-block; } .cost4-calculator-area .cost-section-boxarea .materials-area 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; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); padding: 16px; margin: 16px 16px 0 0; border-radius: 54px; } .cost4-calculator-area .cost-section-boxarea .materials-area ul li a:hover { background: var(--ztc-bg-bg-2); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost4-calculator-area .cost-section-boxarea .cost-head { padding: 0 0 0 30px; } @media (max-width: 767px) { .cost4-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost4-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } .cost4-calculator-area .cost-section-boxarea .cost-head 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; } .cost4-calculator-area .cost-section-boxarea .cost-head 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-regular); line-height: 28px; } .cost4-calculator-area .cost-section-boxarea .cost-head 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-medium); line-height: 18px; padding-top: 16px; } .cost4-calculator-area .cost-section-boxarea .cost-head ul li img { height: 16px; width: 16px; -o-object-fit: cover; object-fit: cover; margin: 0 8px 0 0; } .cost5-calculator-area { position: relative; z-index: 1; background-image: url(../img/all-images/cost/cost-bg1.png); background-position: center; background-repeat: no-repeat; background-size: cover; } .cost5-calculator-area::after { position: absolute; content: ""; height: 100%; width: 100%; left: 0; top: 0; background: var(--ztc-bg-bg-2); opacity: 0.3; z-index: -1; } .cost5-calculator-area .cost-header h5 img { filter: brightness(0) invert(1); } .cost5-calculator-area .cost-section-boxarea { background: var(--ztc-bg-bg-1); padding: 32px; } @media (max-width: 767px) { .cost5-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost5-calculator-area .cost-section-boxarea .slider-area { margin-top: 20px; } } .cost5-calculator-area .cost-section-boxarea .slider-area h3 { color: var(--Text-Color, #03071E); 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; } .cost5-calculator-area .cost-section-boxarea .slider-area .slider-container { position: relative; } .cost5-calculator-area .cost-section-boxarea .slider-area input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; background: #ddd; outline: none; } .cost5-calculator-area .cost-section-boxarea .slider-area input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; background: var(--ztc-text-text-8); cursor: pointer; border-radius: 25px; border-radius: 50%; } .cost5-calculator-area .cost-section-boxarea .slider-area input[type=range]::-moz-range-thumb { width: 20px; height: 20px; background: var(--ztc-text-text-8); cursor: pointer; } .cost5-calculator-area .cost-section-boxarea .slider-area .slider-value { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-text-text-8); color: var(--ztc-text-text-1); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; border-radius: 25px; } .cost5-calculator-area .cost-section-boxarea .slider-area .slider-value2 { position: absolute; top: -35px; left: 50%; transform: translateX(-50%); background-color: var(--ztc-text-text-8); color: var(--ztc-text-text-1); padding: 5px 10px; border-radius: 5px; font-size: 16px; font-weight: bold; border-radius: 25px; } .cost5-calculator-area .cost-section-boxarea .select-area h3 { color: var(--Text-Color, #03071E); 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; } .cost5-calculator-area .cost-section-boxarea .select-area .nice-select { width: 100%; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); box-shadow: none; padding: 16px; height: 50px; line-height: 16px !important; color: var(--ztc-text-text-2); border-radius: 50px; } .cost5-calculator-area .cost-section-boxarea .select-area .nice-select::after { width: 7px; height: 7px; -o-object-fit: cover; object-fit: cover; filter: brightness(0); } .cost5-calculator-area .cost-section-boxarea .select-area .nice-select span.current { 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; } .cost5-calculator-area .cost-section-boxarea .select-area .nice-select ul { width: 100%; } .cost5-calculator-area .cost-section-boxarea .select-area .nice-select ul li:hover { background: var(--ztc-text-text-8); color: var(--ztc-text-text-1); } .cost5-calculator-area .cost-section-boxarea .select-area .btn-area1 { background: var(--Background-Color, #F6F6F6); padding: 7px; display: inline-block; border-radius: 50px; } .cost5-calculator-area .cost-section-boxarea .select-area .btn-area1 a.active-size { background: var(--ztc-text-text-8); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost5-calculator-area .cost-section-boxarea .select-area .btn-area1 .yes { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-text-text-1); padding: 12px 28px; border-radius: 54px; } .cost5-calculator-area .cost-section-boxarea .select-area .btn-area1 .no { 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: 12px; display: inline-block; transition: all 0.4s; background: var(--ztc-bg-bg-1); padding: 12px 28px; margin-left: 8px; border-radius: 54px; } .cost5-calculator-area .cost-section-boxarea h2 { color: var(--ztc-text-text-8); 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: 60px; } .cost5-calculator-area .cost-section-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-regular); line-height: 16px; } .cost5-calculator-area .cost-section-boxarea .materials-area h3 { color: var(--Text-Color, #03071E); 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; } .cost5-calculator-area .cost-section-boxarea .materials-area ul li { display: inline-block; } .cost5-calculator-area .cost-section-boxarea .materials-area 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; border: 1px solid var(--Home-2-Box-Color, #EAEBEB); padding: 16px; margin: 16px 16px 0 0; border-radius: 54px; } .cost5-calculator-area .cost-section-boxarea .materials-area ul li a:hover { background: var(--ztc-bg-bg-2); transition: all 0.4s; color: var(--ztc-text-text-1); } .cost5-calculator-area .cost-section-boxarea .cost-head { padding: 0 0 0 30px; } @media (max-width: 767px) { .cost5-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .cost5-calculator-area .cost-section-boxarea .cost-head { padding: 0; margin-top: 30px; } } .cost5-calculator-area .cost-section-boxarea .cost-head 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; } .cost5-calculator-area .cost-section-boxarea .cost-head 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-regular); line-height: 28px; } .cost5-calculator-area .cost-section-boxarea .cost-head 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-medium); line-height: 18px; padding-top: 16px; } .cost5-calculator-area .cost-section-boxarea .cost-head ul li img { height: 16px; width: 16px; -o-object-fit: cover; object-fit: cover; margin: 0 8px 0 0; }
/*============= COST CSS AREA ===============*//*# sourceMappingURL=main.css.map */