@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
:root { --PrimaryColor: #B4D235; --SecondaryColor: #282828; --WhiteColor: #fff; --BlackColor: #000; --Gray88:#888888; --bgColor: #F0F3F5; --Font76:76px; --Font60:60px; --Font50:50px; --Font40:40px; --Font38:38px; --Font32:32px; --Font30:30px; --Font28:28px; --Font26:26px; --Font24:24px; --Font22:22px; --Font20:20px; --Font18:18px; --Font16:16px; --Font14:14px; --Font300:300; --Font400:400; --Font500:500; --Font600:600; --Font700:700; --Font800:800; --Font900:900; }

/* ==================== */

/* common css */

/* ==================== */
body { font-family: "Inter", sans-serif; margin: 0; padding: 0; box-sizing: border-box; }
.bannerHeading { font-size: var(--Font76); color: var(--PrimaryColor); text-transform: uppercase; font-weight: var(--Font900); font-family: "Montserrat", system-ui; display: inline-block; }
.subBannerText { font-size: var(--Font60); font-weight: var(--Font700); color: var(--PrimaryColor); line-height: normal; font-family: "Montserrat", system-ui; position: absolute; top: 50%; transform: translateY(-50%); margin: 0 0 0 100px; }
.subHeading, .blackPrimarySubHeading { font-size: var(--Font50); font-weight: var(--Font700); color: var(--PrimaryColor); font-family: "Montserrat", system-ui; line-height: normal; }
.blackPrimarySubHeading span { color: var(--SecondaryColor); }
.blackPrimaryHeading, .whitePrimaryHeading, .blackWhiteHeading, .heading { font-size: clamp(var(--Font24), 5vw, var(--Font38)); font-weight: var(--Font700); font-family: "Montserrat", system-ui; }
.blackPrimaryHeading, .blackWhiteHeading, .heading { color: var(--SecondaryColor); }
.whitePrimaryHeading { color: var(--WhiteColor); }
.blackPrimaryHeading span, .whitePrimaryHeading span { color: var(--PrimaryColor); }
.blackWhiteHeading span { color: var(--WhiteColor); }
.uniqueHeading { font-size: var(--Font38); font-weight: var(--Font700); position: relative; font-family: "Montserrat", system-ui; display: inline-block; }
.uniqueHeading span { display: block; color: var(--WhiteColor); position: absolute; bottom: 100%; text-transform: uppercase; font-size: var(--Font76); text-shadow: 0 0 1px #EEEEEE, -1px -1px 0 #EEEEEE, 1px -1px 0 #EEEEEE, -1px 1px 0 #EEEEEE, 1px 1px 0 #EEEEEE; left: -20px; line-height: 0.4; z-index: -1; }
.titleText, .primaryBlackTitleText, .primaryTitleText, .blackTitleText { font-size: var(--Font24); color: var(--WhiteColor); font-weight: var(--Font700); font-family: "Montserrat", system-ui; }
.upload-resume-box { margin: 0 0 30px 0; }
.blackTitleText { color: var(--SecondaryColor); }
.primaryTitleText { color: var(--PrimaryColor); }
.primaryBlackTitleText { color: var(--PrimaryColor); }
.primaryBlackTitleText span { color: var(--SecondaryColor); }
.description { font-size: var(--Font16); font-weight: var(--Font300); color: var(--Gray88); display: inline-block; }
.primaryBtn { font-family: "Montserrat", system-ui; border-radius: 5px; padding: 12px 20px; display: inline-block; text-decoration: none; background-color: var(--PrimaryColor); color: var(--WhiteColor); font-weight: var(--Font600); border: 2px solid var(--PrimaryColor); transition: all 0.3s; }
.primaryBtn:hover { background-color: var(--WhiteColor); color: var(--PrimaryColor); }
.secondaryBtn { font-family: "Montserrat", system-ui; border-radius: 5px; padding: 12px 20px; display: inline-block; text-decoration: none; background-color: var(--SecondaryColor); color: var(--WhiteColor); font-weight: var(--Font600); border: 2px solid var(--SecondaryColor); transition: all 0.3s; }
.secondaryBtn:hover { background-color: transparent; color: var(--SecondaryColor); }
.iconTextCard { box-shadow: 0px 5px 10px 0px #0000000D; padding: 40px; background-color: var(--WhiteColor); border-radius: 20px; position: relative; height: 100%; border: 2px solid transparent; transition: all 0.3s; }
.iconTextCard:hover { border: 2px solid var(--PrimaryColor); }
.iconTextCardWrapper .col-lg-3, .iconTextCardWrapper .col-lg-6, .iconTextCardWrapper .col-lg-4 { margin: 0 0 40px 0; }
.icon { position: absolute; top: 15px; right: 15px; width: 50px; height: 50px; background-color: var(--PrimaryColor); border-radius: 14px; display: flex; align-items: center; justify-content: center; transition: all 0.3s; border: 2px solid var(--PrimaryColor); }
.iconTextCard .icon img { transition: all 0.3s; }
.iconTextCard:hover .icon { background-color: transparent; }
.iconTextCard:hover .icon img { filter: invert(83%) sepia(18%) saturate(1469%) hue-rotate(22deg) brightness(91%) contrast(101%); }
.iconTextCardDetail { width: 95%; }
.components { display: none; }
.container-xl { max-width: 1440px; }
.width90 { width: 90%; margin: 0 auto; }
.bgGray { background-color: var(--bgColor); }
.scrollOff { overflow: hidden; }

/* header css */
.logo a { display: block; width: 120px; }
.logo a img { width: 100%; height: 100%; object-fit: contain; }
header { padding: 28px 0; background-color: var(--WhiteColor); position: fixed; top: 0; width: 100%; z-index: 9; }
.textTransform span { font-size: var(--Font20); line-height: 24px; text-transform: uppercase; animation: textTransform 6s ease-in-out infinite; font-weight: var(--Font800); color: var(--PrimaryColor); font-family: "Montserrat", system-ui; ; }
.textTransform { display: flex; flex-direction: column; height: 24px; margin: 0 0 0 10px; overflow: hidden; }
.logo { display: flex; align-items: center; }
@keyframes textTransform {
	0% { transform: translateY(0); }
	15% { transform: translateY(0); }
	30% { transform: translateY(-100%); }
	45% { transform: translateY(-100%); }
	60% { transform: translateY(-200%); }
	75% { transform: translateY(-200%); }
	90% { transform: translateY(0); }
	100% { transform: translateY(0); }
}
.headerInner { display: flex; align-items: center; justify-content: space-between; }
.headerBtn { margin: 0 0 0 30px; }
.headerOption { display: flex; align-items: center; }
.headerUl>ul>li.hasUl > a { padding-right: 25px; }
.headerUl>ul > li.hasUl > a:before { content: '\f107'; font-family: 'FontAwesome'; right: 5px; position: absolute; }
.headerUl ul li.active > a { color: var(--PrimaryColor); }

/* banner css */
.banner { background-position: center center; background-repeat: no-repeat; background-size: cover; height: 100vh; position: relative; z-index: 1; }
.banner:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to top, #000, transparent); z-index: 0; }
.bannerInner { position: absolute; bottom: 70px; text-align: center; left: 50%; transform: translateX(-50%); width: 100%; }
.bannerContent .description { color: var(--WhiteColor); width: 100%; display: block; font-size: var(--Font20); }

/* imageTextWrapper css*/
.imageTextWrapper { padding: 150px 0; overflow: hidden; }
.textWrapperBtn { display: block; }
.imageWrapperInner { width: 90%; height: auto; border-radius: 30px; overflow: hidden; position: relative; }
.imageWrapper { position: relative; }
.imageWrapper img { width: 100%; }
.greenLable { position: absolute; bottom: -40px; right: 0; background-color: var(--PrimaryColor); padding: 40px 30px; border-radius: 20px; }
.greenLable span { color: #fff; font-size: 16px; text-align: center; display: block; text-transform: uppercase; font-weight: 600; }
.greenLable span strong { font-size: 60px; width: 100%; display: block; }
.textWrapper .description { margin: 10px 0 30px 0; }
.imageTextWrapperInner .row { justify-content: space-between; align-items: center; }
.textWrapper { padding: 0 0 0 40px; }
.ourStory { position: relative; overflow: hidden; }
.ourStory .ourStoryArrowWrapper { position: absolute; top: 100px; /* right: 0; */ left: calc(100% - 250px); display: flex; align-items: center; }
.ourStory .ourStoryArrowWrapper img { transition: all 0.7s; opacity: 0; visibility: hidden; width: 55px; }
.ourStory .ourStoryArrowWrapper img:not(:last-child) { margin-left: -40px; opacity: 0; visibility: hidden; }
.ourStory.in-viewport .ourStoryArrowWrapper img { margin: 0; opacity: 1; visibility: visible; }

/* iconCardWrapper css */
.iconCardWrapper { padding: 120px 0; background-color: var(--bgColor); }
.iconCardWrapper .primaryBlackTitleText span { display: block; }
.iconTextCardWrapper { padding: 80px 0 0 0; }

/* accordionWrapper css */
.product { padding: 120px 0; background-color: var(--SecondaryColor); position: relative; z-index: 1; overflow-x: hidden; }
.product:before { content: ''; position: absolute; width: 100%; height: 100%; background: url(../images/product-bg.png)center center no-repeat; opacity: 10%; z-index: -1; top: 0; left: 0; background-size: cover; }
.productListing { padding: 120px 0 0 0; }
.productListing a { text-decoration: none; }
.productTop .description { color: var(--WhiteColor); }
.productList { display: flex; align-items: center; justify-content: space-between; position: relative; padding: 35px 0; cursor: pointer; transition: all 0.3s; border-bottom: 1px solid rgb(255 255 255 / 25%); }
.productImage { position: absolute; right: 200px; border-radius: 30px; overflow: hidden; transform: scale(0); transition: all 0.3s; opacity: 0; visibility: hidden; }
.productList:hover .productImage { transform: scale(1); opacity: 1; visibility: visible; }
.productList:hover { padding-left: 20px; }
.productList .titleText { transition: all 0.3s; text-decoration: none; }
.productList:hover .titleText { color: var(--PrimaryColor); }
.rightLongArrow { color: var(--WhiteColor); font-size: var(--Font20); transition: all 0.3s; }
.productList:hover .rightLongArrow { color: var(--PrimaryColor); }

/* .rightArrows { position: absolute; top: 100px; left: calc(100% - 250px); } */

/* .leftArrows{transform: rotate(-90deg);} */
.leftArrows:first-child { position: absolute; left: 0; }
.leftArrows:last-child { position: absolute; right: 0; }

/* .rightArrows img { margin-right: -30px; transition: all 0.7s; opacity: 0; visibility: hidden;  } */
.leftArrows { display: flex; flex-direction: column; }
.leftArrows img { transition: all 0.7s; }

/* .rightArrows img:not(:last-child) { margin-right: -90px; opacity: 0; visibility: hidden; } */
.leftArrows img:not(:last-child) { margin-bottom: -30px; opacity: 0; visibility: hidden; }
section.product.in-viewport .leftArrows img:not(:last-child) { margin-bottom: 0; opacity: 1; visibility: visible; }

/* section.product.in-viewport .productArrows img { margin: 0; opacity: 1; visibility: visible; } */

/* industries css */
.industries { background-color: var(--PrimaryColor); }
.industriesTop { padding: 120px 0; }
.industriesTop .description { color: var(--SecondaryColor); }
.slideImage { overflow: hidden; }
.slideContent:hover .slideImage img { transform: scale(1.2); }
.slideImage img { width: 100%; transition: all 0.3s; }
.slideContent { position: relative; z-index: 2; }
.slideContent::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--SecondaryColor); opacity: 0; visibility: hidden; z-index: 1; transition: all 0.3s; }
.slideContent .titleText { position: absolute; z-index: 1; bottom: -100%; left: 0; transition: all 0.3s; padding: 60px 40px; display: block; z-index: 2; }
.slideContent:hover .titleText { bottom: 0; }
.slideContent:hover::before { opacity: 0.8; visibility: visible; }
.industriesSwiperControl a { width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: var(--PrimaryColor); color: var(--WhiteColor); font-size: 20px; }
.industriesSwiperControl a { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); }
.industriesSwiperControl .swiperPrev { left: 80px; }
.industriesSwiperControl .swiperNext { right: 80px; }

/* hovertoChange css */
.hovertoChange { padding: 120px 0; }
.imageList { position: absolute; top: 0; width: 100%; opacity: 0; visibility: hidden; transform: scale(0.7); transition: all 0.4s; }
.imageDiv { border-radius: 30px; overflow: hidden; width: 80%; }
.imageDiv img { width: 100%; object-fit: cover; }
.imageList .description { background-color: var(--PrimaryColor); position: absolute; width: 60%; z-index: 1; bottom: 40px; right: 80px; color: var(--WhiteColor); padding: 40px; border-radius: 30px; }
.imageListing { position: relative; }
.imageList.activeImage { transform: scale(1); opacity: 1; visibility: visible; }
.hovertoChangeDetail ul { list-style: decimal-leading-zero; margin: 40px 0 0 0; }
.hovertoChangeDetail ul li::marker { font-size: var(--Font24); font-family: "Montserrat", system-ui; font-weight: var(--Font600); color: var(--PrimaryColor); }
.hovertoChangeDetail ul li a { text-decoration: none; margin: 10px 0 10px 20px; display: inline-block; transition: all 0.3s; font-weight: var(--Font600); }
.hovertoChangeDetail ul li a:hover { color: var(--PrimaryColor); }
.blackTitleText.activeA { color: var(--PrimaryColor); }

/* whyChooseJika css */
.downArrows { display: flex; flex-direction: column; align-items: center; position: absolute; bottom: 0; transform: rotate(180deg); right: 100px; }
.whyChooseJika { position: relative; overflow-x: hidden; }
.downArrows img:not(:first-child) { margin-top: -80px; }
.downArrows img { opacity: 0; visibility: hidden; transition: all 0.7s; }
.whyChooseJika.in-viewport .downArrows img { margin: 0; opacity: 1; visibility: visible; }

/* contact css */
.contact { padding: 80px 0; background-color: var(--bgColor); margin-top: 50px; }
.contactInner { display: flex; align-items: center; justify-content: space-between; }
.contactUl ul { display: flex; list-style: none; margin: 0; padding: 0; }
.contactUl ul li a { font-size: 26px; width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; background-color: var(--PrimaryColor); border-radius: 14px; margin: 0 0 0 50px; color: var(--WhiteColor); border: 1px solid var(--PrimaryColor); transition: all 0.3s; }
.contactUl ul li a:hover { background-color: transparent; color: var(--PrimaryColor); }
.wpcf7-form-control-wrap { position: relative; display: block !important; }
.wpcf7-not-valid-tip { position: absolute; bottom: 10px; font-size: 14px; }

/* footer css */
footer { padding: 100px 0 0 0; background-color: var(--SecondaryColor); }
.footerInner { padding: 0 0 80px 0; }
.firstUl ul li a { width: 50px; display: flex; height: 50px; background-color: var(--WhiteColor); border-radius: 50%; align-items: center; justify-content: center; font-size: var(--Font24); color: var(--SecondaryColor); border: 1px solid var(--WhiteColor); transition: all 0.3s; margin: 0 10px 0 0; }
.firstUl ul { margin: 20px 0 0 0; padding: 0; list-style: none; display: flex; align-items: center; }
h4.footerHeading { font-size: 18px; color: var(--PrimaryColor); font-weight: 500; font-family: "Montserrat", system-ui; }
.footerUl ul { margin: 0; padding: 0; list-style: none; }
.footerUl ul li a { color: var(--WhiteColor); text-decoration: none; font-size: 18px; font-family: "Montserrat", system-ui; }
.footerAddress span { color: var(--WhiteColor); font-family: "Montserrat", system-ui; }
.copyRight { background-color: var(--PrimaryColor); padding: 10px 0; }
.copyRightInner { display: flex; align-items: center; justify-content: space-between; color: var(--WhiteColor); }
.SecoundUl ul { column-count: 2; }
.footerUl ul li a { padding: 5px 0; display: inline-block; transition: all 0.3s; }
.footerUl ul li a:hover { color: var(--PrimaryColor); }
.footerUl ul li svg { color: var(--PrimaryColor); padding: 0 10px 0 0; }
.footerUl ul li:nth-child(2) svg { opacity: 0; visibility: hidden; }
span.brand a img { width: 50px; display: inline-block; }
span.brand { font-size: 16px; width: 145px; display: flex; align-items: center; line-height: 1.2; }
.footerLogo { width: 150px; }

/* ==================== */

/* About Us css */

/* ==================== */

/* subBanner css */
section.subBanner { margin: 130px 0 0 0; position: relative; }
.subBannerInner { position: relative; border-radius: 30px; overflow: hidden; }
.subBannerInner:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to right, #00000091, transparent); z-index: 0; }
.subBannerInner span.subBannerText { width: 50%; }

/* secondSec css */
.secondSec { padding: 120px 0; position: relative; }
.textImageWrapperInner .textWrapper { padding: 0 40px 0 0; }
.textImageWrapper { overflow: hidden; }
.textImageWrapper .row { display: flex; align-items: center; }
.textImageWrapper .imageWrapperInner { margin-left: auto; }
.secondSecLeftArrows { position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
.secondSecRightArrows { position: absolute; top: 50%; left: calc(100% - 250px); transform: translateY(-50%); }
.secondSecLeftArrows img:not(:first-child) { margin-left: -80px; }
.secondSecLeftArrows img, .secondSecRightArrows img { transition: all 0.7s; opacity: 0; visibility: hidden; }
.secondSecRightArrows img:not(:last-child) { margin-right: -80px; }
.in-viewport .secondSecLeftArrows img, .in-viewport .secondSecRightArrows img { opacity: 1; visibility: visible; margin: 0; }

/* coreValue css */
.coreValue { margin: 120px 0; position: relative; z-index: 1; }
.coreValue::before { content: ''; position: absolute; background: url(../images/core-value-bg.png)center center no-repeat; background-size: cover; width: 100%; height: 100%; opacity: 0.07; z-index: 0; top: 0; left: 0; }
.coreValue .primaryBlackTitleText span { display: inline-block; }

/* purpose css */
.purpose { padding-bottom: 120px; position: relative; z-index: 1; overflow: clip; }
.purpose:before { content: ''; position: absolute; background: url(../images/right-angle-green-arrow.svg)left top no-repeat; background-size: 300px; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; }
.purpose::after { content: ''; position: absolute; background: url(../images/up-angle-green-arrow.svg)right bottom no-repeat; background-size: 800px; width: 100%; height: 100%; top: -200px; right: -200px; z-index: -1; }
.timeLineWrapper ul { margin: 0 auto; padding: 0; list-style: none; max-width: 80%; position: relative; }
.timeLineWrapper ul li { width: 50%; padding-block: 50px; position: relative; animation: blur 15s linear; animation-timeline: view(); }
@keyframes blur {
	0% { filter: blur(10px); }
	35%, 60% { filter: blur(0); }
	100% { filter: blur(10px); }
}
.timeLineWrapper ul li:nth-child(even) { margin-left: auto; padding-left: 70px; }
.timeLineWrapper ul:before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 2px; height: 100%; background-color: var(--PrimaryColor); z-index: -2; animation: timeLine 15s linear; animation-timeline: view(30% 10%); }
@keyframes timeLine {
	from { height: 0; }
	to { height: 100%; }
}
.timeLineWrapper { padding: 80px 0 0 0; }
.timeLineWrapper ul li:not(:nth-child(even)) { text-align: right; padding-right: 70px; }
.timeLineWrapper ul li:before { content: ''; position: absolute; width: 36px; height: 36px; background-color: var(--WhiteColor); border-radius: 50%; top: 46px; border: 8px solid var(--PrimaryColor); animation: scaleDot 15s linear; animation-timeline: view(70% 0%); }
@keyframes scaleDot {
	from { transform: scale(0); }
	to { transform: scale(1); }
}
.timeLineWrapper ul li:not(:nth-child(even)):before { right: -18px; }
.timeLineWrapper ul li:nth-child(even):before { left: -19px; }

/* ==================== */

/* GOP css */

/* ==================== */

.GOPBanner { position: relative; }
.bgImage { position: absolute; width: 500px; left: -50px; }
.bgImage img { width: 100%; height: 100%; }
.tabContainer { position: relative; }
.bgImageGreen { position: absolute; bottom: 630px; right: -400px; width: 1000px; z-index: -1; }
.bgImageGreen img { width: 100%; }
.mobile-tab-title { display: none; }
ul.tab-titles { display: flex; align-items: center; justify-content: center; list-style-type: none; border-bottom: 1px solid var(--Gray88); border-top: 1px solid var(--Gray88); padding: 0; margin: 0; }
ul.tab-titles li { margin: 0 0 -1px 0; position: relative; }
.details { padding: 100px 0 0 0; }
.tabing-main { overflow-x: hidden; }
.tabing-main .col-lg-12:first-child { z-index: 2; background-color: var(--WhiteColor); }
.tabing-main .blackTitleText { text-decoration: none; transition: all 0.3s; padding: 20px; display: inline-block; text-align: center; }
.tabing-main .blackTitleText:hover { color: var(--SecondaryColor); }
.details .imageTextWrapper, .details .textImageWrapper { padding: 100px 0 0 0; }
ul.tab-titles li:before { content: ''; position: absolute; bottom: -1px; left: 0; width: 0; height: 3px; background-color: var(--PrimaryColor); transform-origin: center center; border-radius: 10px; transition: all 0.3s; left: 50%; transform: translateX(-50%); }
li.active-li:before { width: 100% !important; }
ul.tab-titles li:hover:before { width: 100%; }

/* iconTextListing css */
.iconTextListing { padding: 120px 0; background-color: var(--bgColor); margin: 120px 0 0 0; }
.iconTextBox { display: flex; align-items: center; margin-bottom: 50px; }
.iconBox { background-color: var(--PrimaryColor); width: 55px; height: 55px; display: flex; align-items: center; justify-content: center; border-radius: 14px; }
.iconTextBox span { display: inline-block; width: calc(100% - 75px); margin-left: auto; font-size: var(--Font20); font-weight: var(--Font600); font-family: "Montserrat", system-ui; }
.iconTextBoxs { padding: 120px 0 0 0; }

/* strategicImportance css */
.strategicImportance { padding: 200px 0; background: url(../images/india-map-bg.png)right center no-repeat; background-size: 800px; width: 100%; height: 100%; }
.strategicImportance .blackPrimaryHeading { width: 50%; }
.innovationHub { padding: 120px 0 !important; background-color: var(--bgColor); margin: 100px 0 0 0; position: relative; overflow: hidden; }
.innovationHubArrowWrap { position: absolute; bottom: -200px; left: -100px; display: flex; }
.innovationHubArrowWrap img { width: 220px; transition: all 0.5s; opacity: 0; visibility: hidden; }
.innovationHubArrowWrap img:not(:first-child) { margin-left: -160px; }
.in-viewport .innovationHubArrowWrap img { margin-left: 0; opacity: 1; visibility: visible; }
.in-viewport .innovationHubArrowWrap img:nth-child(2) { opacity: 0.6; }
.in-viewport .innovationHubArrowWrap img:nth-child(3) { opacity: 0.4; }
.in-viewport .innovationHubArrowWrap img:last-child { opacity: 0.2; }

/* ==================== */

/* why jika css */

/* ==================== */
.multiImageText { overflow: hidden; }
.multiImageText .imageTextWrapper { padding: 45px 0 0 0; }
.onlyDesc { margin: 100px 0; padding: 70px 0; background-color: var(--bgColor); }
.multiImageText .imageTextWrapperInner:nth-child(even) .row { flex-direction: row-reverse; }
.multiImageText .imageTextWrapperInner { padding: 75px 0; overflow: hidden; }
.multiImageText .imageTextWrapperInner:nth-child(even) { background-color: var(--bgColor); position: relative; }

/* .multiImageText .imageTextWrapperInner:nth-child(even)::before { content: ''; position: absolute; background: url(../images/right-angle-green-arrow.svg)left center no-repeat; background-size: contain; width: 240px; height: 100%; top: 0; transition: all 0.5s; opacity: 0; visibility: hidden; left: 0;}  */

/* .multiImageText .imageTextWrapperInner:nth-child(4n + 2) { background-color: var(--bgColor); position: relative;  padding: 75px 0;} */
.multiImageText .imageTextWrapperInner:nth-child(4n + 2)::before { content: ''; position: absolute; background: url(../images/right-angle-green-arrow.svg)left center no-repeat; background-size: contain; width: 240px; height: 100%; top: 0; transition: all 0.5s; opacity: 0; visibility: hidden; left: -100px; }
.multiImageText .imageTextWrapperInner:nth-child(4n + 2).in-viewport::before { left: 0; opacity: 1; visibility: visible; }
.multiImageText .imageTextWrapperInner:nth-child(4n)::before { content: ''; position: absolute; background: url(../images/up-angle-green-arrow.svg)bottom right no-repeat; background-size: contain; width: 700px; height: 300px; right: 0 !important; bottom: -100px; transition: all 0.5s; }
.multiImageText .imageTextWrapperInner:nth-child(4n).in-viewport::before { bottom: 0; opacity: 1; visibility: visible; }
.imageListing { display: flex; flex-wrap: wrap; }
.imageListMobile { display: none; }
.imageList  a.blackTitleText { text-decoration: none; display: none; }

/* twoCardWrapper css */
.twoCardWrapper { padding: 100px 0; }
.twoCardListing { padding: 100px 0 0 0; }
.twoCardImage { border-radius: 30px; overflow: hidden; height: 400px; }
.twoCardImage img { width: 100%; height: 100%; object-fit: cover; }
.twoCardDeail { padding: 30px 0 0 0; }
.twoCardDeail .heading { width: 85%; }
.greenBg { background-color: var(--PrimaryColor); }

/* imageTextWrapper2 css */
.imageTextWrapper2 { padding: 120px 0; overflow: hidden; }
.imageTextWrapper2Inner { padding: 100px 0 0 0; }
.imageTextWrapper2Inner .row { align-items: center; justify-content: space-between; }
.trackRecord { background-color: var(--PrimaryColor); }
.imageWrapper2 { border-radius: 30px; overflow: hidden; }
.imageWrapper2 img { width: 100%; height: 100%; object-fit: cover; }
.textWrapper2 .description { margin: 20px 0 40px 0; }
.trackRecord .textWrapper2 .description { color: var(--WhiteColor); }
.moreInfo { margin: 80px 0 0 0; display: flex; align-items: center; justify-content: center; }
.whyjikaimg  span strong { display: block; font-size: var(--Font24); font-weight: 700; margin: 20px 0; }
.whyjikaimg  .textWrapper2 { color: var(--WhiteColor); font-family: "Montserrat", system-ui; }
.capabilities  span strong { display: block; font-size: var(--Font24); font-weight: 700; margin: 20px 0; color: var(--PrimaryColor); }
.capabilities  .textWrapper2 { color: var(--Gray88); font-family: "Montserrat", system-ui; }

/* ==================== */

/* data center page css */

/* ==================== */

.productText .description { width: 60%; display: block; }
.dataCenter { margin: 120px 0 0 0; }

/* jikaForData css */
.jikaForData { background-color: var(--WhiteColor); }
.jikaForData .primaryBlackTitleText span { display: unset; }
.jikaForData .iconTextCard { background-color: var(--bgColor); }

/* typeOfData css */
.typeOfData { padding: 120px 0; }
.typeOfDataBlock { padding: 80px 0 0 0; }
.typeOfDataBlockInner .bannerHeading { height: 90px; line-height: 90px; overflow: hidden; }

/* .typeOfDataBlockInner .bannerHeading span { animation: animate 12s steps(4) infinite; } */
.typeOfDataBlockInner .bannerHeading span { position: relative; padding: 0 2px 0 0; }
.typeOfDataBlockInner .bannerHeading span::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--WhiteColor); border-left: 2px solid var(--SecondaryColor); animation: typing 3s steps(10) infinite; }
@keyframes typing {
	40%, 60% { left: calc(100% - 2px); }
	100% { left: 0; }
}

/* globalPresence css */
.globalPresence { padding: 160px 0; background-color: var(--bgColor); position: relative; overflow: hidden; z-index: 1; }
.globalPresence::before { content: ''; position: absolute; background: url(../images/data-center-map.png)left center no-repeat; background-size: contain; width: 1000px; height: 100%; top: 0; right: -270px; z-index: -1; }
.globalPresenceImage { padding: 150px 0 0 0; }
.globalPresenceImage img { transform: rotate(-90deg); transition: all 0.5s; opacity: 0; visibility: hidden; }
.globalPresenceImage img:not(:first-child) { margin-left: -200px; }
.globalPresence.in-viewport .globalPresenceImage img:not(:first-child) { margin-left: -150px; }
.globalPresence.in-viewport .globalPresenceImage img { opacity: 1; visibility: visible; }

/* .contactUs css */
.contactUs { padding: 120px 0; background-color: var(--bgColor); }
span.bannerHeading span { color: var(--SecondaryColor); font-weight: 300; text-transform: lowercase; }

/* ==================== */

/* resources page css */

/* ==================== */

.iconTextDescListing { padding: 80px 0; }
.resources .secondSecInner .heading { color: var(--PrimaryColor); }
.iconTextDescBoxTop { display: flex; align-items: center; padding: 0 0 20px 0; }
.iconTextDescBoxTop .blackTitleText { margin: 0 0 0 20px; }
.iconTextDescBox { margin: 0 0 30px 0; }
.downloadBtn { display: flex; align-items: center; justify-content: center; }

/* ==================== */

/* data hall page css */

/* ==================== */

.dataHallSecondSec { margin-bottom: 0; }
.keyFeatures { background-color: var(--WhiteColor); }
.keyFeatures .iconTextCard { background-color: var(--bgColor); }

/* inquiryWrapper css */
.inquiryWrapper { padding: 120px 0; }

/* specificationsFeatures css */
.specificationsFeatures { padding: 120px 0; background-color: var(--bgColor); position: relative; }
.specificationsFeaturesTable ul { margin: 0; padding: 0; list-style: none; }
.specificationsFeaturesTable ul li { padding: 0 0 15px 30px; position: relative; margin: 0 0 15px 0; border-bottom: 1px solid #cccc; }
.specificationsFeaturesTable ul li::before { content: ''; position: absolute; top: 10px; left: 0; width: 15px; height: 15px; background-color: var(--PrimaryColor); border-radius: 50%; }
.specificationsFeaturesTable ul li .blackTitleText { display: block; }
.specificationsFeaturesTable { padding: 50px 0 0 0; width: 85%; }
.specificationsFeaturesArrow { position: absolute; top: 0; right: 100px; display: flex; flex-direction: column; }
.specificationsFeaturesArrow img:not(:first-child) { margin-top: -70px; }
.specificationsFeaturesArrow img { opacity: 0; visibility: hidden; transition: all 0.5s; }
.in-viewport .specificationsFeaturesArrow img { opacity: 1; visibility: visible; margin: 0; }
.cardimage { border-radius: 30px; overflow: hidden; }
.cardimage img { transition: all 0.8s; }
.cardcontent { background-color: var(--SecondaryColor); border-radius: 20px; padding: 20px; z-index: 2; position: absolute; width: 90%; bottom: -30px; left: 50%; transform: translateX(-50%); max-height: 100px; transition: max-height 0.5s linear; overflow: hidden; }
.cardheader { display: flex; align-items: flex-start; justify-content: space-between; margin: 0 0 20px 0; padding: 0 0 20px 0; border-bottom: 1px solid var(--PrimaryColor); }
.maininfo .description { display: block; color: var(--WhiteColor); }
.iconwrap svg { width: 30px; height: 30px; }
.itemcard { margin-bottom: 120px; position: relative; cursor: pointer; display: inline-block; }
section.managementTeam { position: relative; }
.managementTeamArrows img:first-child { left: 0; top: 40%; width: 400px; transform: translateY(-50%); }
.managementTeamArrows img { position: absolute; }
.managementTeamArrows img:last-child { right: 0; width: 400px; bottom: 200px; }
.cardbody { opacity: 0; visibility: hidden; transition: all 0.5s; transition-delay: 0.1s; }
.cardbody span { color: var(--WhiteColor); }
.itemcard:hover .cardcontent { max-height: 500px; }
.itemcard:hover .cardbody { opacity: 1; visibility: visible; }
.itemcard:hover .cardimage img { transform: scale(1.15); }

/* ==================== */

/* BOD css */

/* ==================== */

.content .cardheader { width: 70%; margin: 0; padding: 20px; border: none; background-color: var(--SecondaryColor); border-radius: 20px; margin: 0 0 20px 0; }
.content .cardheader svg { color: var(--WhiteColor); }
.image img { width: 100%; height: 100%; }
.image { width: 90%; border-radius: 30px; overflow: hidden; }
.BOD { padding: 0 0 120px 0; overflow: hidden; }
.BOD .imageTextWrapperInner { padding: 70px 0; }
.BOD .imageTextWrapperInner:nth-child(even) .row { flex-direction: row-reverse; }
.BOD .imageTextWrapperInner:nth-child(even) .row .image { margin-left: auto; }
.BOD .imageTextWrapperInner { position: relative; }
.BOD .imageTextWrapperInner:before { content: ''; position: absolute; width: 100vw; height: 100%; background-color: var(--PrimaryColor); top: 0; border-radius: 0 50px 50px 0; right: 200%; transition: all 0.8s; }
.BOD .imageTextWrapperInner:nth-child(even)::before { left: 200%; right: auto; border-radius: 50px 0 0 50px; }
.imageTextWrapperInner.in-viewport::before { right: calc(70% + 10px); }
.BOD .imageTextWrapperInner:nth-child(even).in-viewport::before { left: calc(70% + 10px); right: auto; }

/* ==================== */

/* contact page css */

/* ==================== */
.haveaQuestionText { padding: 100px 50px 0 0; }
.haveaQuestion { padding: 100px 0; background-color: var(--bgColor); position: relative; overflow: hidden; z-index: 1; }
.haveaQuestion .innovationHubArrowWrap img { width: 300px; }
.haveaQuestion .innovationHubArrowWrap { z-index: -1; }
.formDesign { box-shadow: 0px 0px 20px 0px #0000001A; background-color: #fff; border: 1px solid var(--Gray88); border-radius: 30px; padding: 60px 50px; text-align: center; }
.formDesign label { display: none; }
.formDesign input:not([type="submit"]), .formDesign textarea, .formDesign select { width: 100%; margin: 0 0 30px 0; padding: 15px 30px; border-radius: 15px; border: 1px solid var(--Gray88); color: var(--Gray88); }
.formDesign input:focus-visible, .formDesign textarea:focus-visible, .formDesign select:focus-visible { border-color: var(--PrimaryColor); outline: var(--PrimaryColor); }
textarea { height: 120px; }
.dnd-upload-status .dnd-upload-details .dnd-progress-bar span { background: var(--PrimaryColor); }
.formDesign form { margin: 50px 0 0 0; }
.haveaQuestionText .blackPrimaryHeading { width: 65%; }
.partnership { background-color: var(--WhiteColor); }
.partnership .innovationHubArrowWrap { right: -100px; left: auto; transform: rotate(180deg); }
.partnership .haveaQuestionText { padding: 100px 0 0 50px; }
.wpcf7-spinner { position: absolute; bottom: -40px; left: 50%; transform: translateX(-50%); margin: 0; }

/* generalContact css */
.generalContact { padding: 120px 0; overflow: hidden; }
.generalContactInner .row { padding: 70px 0 0 0; align-items: center; }
.generalContactInner iframe { border-radius: 30px; width: 100%; height: 350px; }
.generalContactText ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.addDetails ul li a { display: flex; }
.generalContactText ul li a { text-decoration: none; color: var(--SecondaryColor); transition: all 0.3s; }
.generalContactText ul li a:hover { color: var(--PrimaryColor); }
.generalContactText ul li a svg { padding: 0 5px 0 0px; color: var(--PrimaryColor); }
.addDetails ul li a svg { padding: 4px 5px 0 0px; }
.contactDetails { padding: 0 0 30px 0; margin: 0 0 30px 0; border-bottom: 1px solid var(--Gray88); }
.contactDetails.borderTop { padding: 30px 0 0 0; margin: 30px 0 0 0; border-top: 1px solid var(--Gray88); border-bottom: 0; }
.contactDetails.borderTop ul li { padding: 0 30px 0 0; }
.generalContactText { padding: 0 0 0 50px; }
.contactDetails ul li a { display: inline-block; padding: 0 30px 0 0; }

/* joinTeam css */
.joinTeam { padding: 120px 0; background-color: var(--bgColor); }
.joinTeam .formDesign { margin: 70px 0 0 0; }
.joinTeam .primaryBtn { width: auto; margin: 0 auto; }

/* ==================== */

/* industries page css */

/* ==================== */
.industriesCardWrapper .cardcontent { max-height: 120px; }

/* bottomSection css */
.bottomSection { position: relative; padding: 120px 0; }
.bottomSectionInner .primaryBtn { margin: 30px 0 0 0; }

/* ==================== */

/* Product detail page css */

/* ==================== */

/* productDetailWrapper css */
section.productDetailWrapper, .productListingWrapper { padding: 150px 0 0 0; font-family: "Inter", sans-serif; }
.breadcrumb { margin: 0; }
.breadcrumb-item+.breadcrumb-item::before { content: '\f105'; font-family: 'FontAwesome'; }
.gallery-thumbs { height: 550px; }
.productSwiper { display: flex; flex-direction: row-reverse; }
.productSwiper .swiper-slide { border: 2px solid #EEEEEE; cursor: pointer; }
.gallery-thumbs .swiper-slide-thumb-active { border: 2px solid #b4d235; }
.productSwiper .swiper-slide img { width: 100%; height: 100%; object-fit: contain; }
.productSwiper .gallery-top { width: calc(100% - 150px); }
.productDetailContent { padding: 50px 0 0 0; }
.productVariants { padding: 40px 0 0 0; margin: 30px 0 0 0; border-top: 1px solid var(--Gray88); }
.oneVariant { padding: 0 0 40px 0; }
.oneVariant ul { list-style: none; margin: 0 0 0 -10px; padding: 0; display: flex; flex-wrap: wrap; row-gap: 20px }
.oneVariant ul li, .variantBtn { padding: 15px 30px; font-size: var(--Font18); font-weight: var(--Font500); background-color: #EEEEEE; border: 1px solid #EEEEEE; font-family: 'Montserrat'; line-height: 1; cursor: pointer; transition: all 0.3s; }
.oneVariant span, .variantBlock h6 { font-size: var(--Font18); font-weight: var(--Font600); font-family: 'Montserrat'; margin: 0 0 10px 0; display: inline-block; }
.firstSection { margin-bottom: 120px; }
.activeVariant, .variantOptions .active { background-color: transparent !important; border-color: var(--Gray88) !important; }
.productDescription h6, .productHeading { font-size: var(--Font26); font-weight: var(--Font600); font-family: 'Montserrat'; margin: 0 0 30px 0; color: var(--PrimaryColor); }
.productDescription ul { font-family: 'Montserrat'; }
.productDescription h6, .productHeading { display: block; background-color: #f5f5f5; width: 100%; padding: 10px; padding-left: 15px; border-left: 5px solid; }
.productDescription ul { margin: 20px 0 3% 0; }
.productDescription ul li { font-weight: 500; }
.secondSection { padding: 0; margin: 0 0 70px 0; }
section.thirdSection { margin: 40px 0 0 0; }
.thirdSection { margin: 70px 0; padding: 70px 0; border-top: 1px solid var(--Gray88); border-bottom: 1px solid var(--Gray88); }
.applicationListing { display: flex; width: max-content; justify-content: space-between; width: 100%; }
.applicationListing span { display: inline-block; padding: 10px 15px; font-family: 'Montserrat'; font-weight: 600; border-radius: 6px; border: 2px solid #b4d235; position: relative; }
.selectedApplication { padding-left: 35px !important; }
.selectedApplication:before { content: ''; position: absolute; width: 15px; aspect-ratio: 1; background-color: #b4d235; top: 50%; left: 10px; transform: translateY(-50%); }
.NonselectedApplication:before { content: ''; position: absolute; width: 15px; aspect-ratio: 1; border: 2px solid #979797; top: 50%; left: 10px; transform: translateY(-50%); }
.NonselectedApplication { padding-left: 35px !important; border: 2px solid #979797 !important; }

/* ==================== */

/* Product listing page css */

/* ==================== */

.productListingWrapper { background-color: var(--bgColor); }
input[type=checkbox] { position: relative; border: 2px solid var(--SecondaryColor); border-radius: 2px; background: none; cursor: pointer; line-height: 0; margin: 0 .6em 0 0; outline: 0; padding: 0 !important; vertical-align: text-top; height: 20px; width: 20px; -webkit-appearance: none; opacity: .5; }
input[type=checkbox]:hover { opacity: 1; }
input[type=checkbox]:checked { background-color: var(--PrimaryColor); opacity: 1; border-color: var(--PrimaryColor); }
input[type=checkbox]:before { content: ''; position: absolute; right: 50%; top: 50%; width: 6px; height: 13px; border: solid #FFF; border-width: 0 2px 2px 0; margin: -1px -1px 0 -1px; transform: rotate(45deg) translate(-50%, -50%); z-index: 2; }
.filterType ul li { cursor: pointer; margin: 0 0 10px 0; }
.productPageListing { padding: 40px 0 0 0; margin: 30px 0 0 0; border-top: 1px solid #D9D9D9; }
.filterBoxHeading { display: flex; align-items: center; justify-content: space-between; }
.filterBoxHeading h3 { margin: 0; font-family: 'Montserrat'; font-weight: 600; }
.filterBoxHeading a { color: var(--SecondaryColor); }
.filterType ul { margin: 0; padding: 10px 0 0 0; list-style: none; }
span.filterHeading { color: var(--PrimaryColor); font-family: 'Montserrat'; font-weight: 600; font-size: 18px; }
.filterType { padding: 20px 0; }
.productCardLink { text-decoration: none; }
.productCardContent span.blackTitleText { font-size: var(--Font18); display: block; margin: 10px 0 0 0; padding: 10px 0 0 0; border-top: 1px solid var(--Gray88); }
.productCardContent .description { text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; }
.productCard { background-color: var(--WhiteColor); padding: 20px; box-shadow: 0px 0px 10px 0px #0000001f; height: 100%; }
.productCardImg img { width: 100%; height: 100%; object-fit: cover; }
.productCardImg { width: 100%; height: 170px; }
.productCardContent { padding: 20px 0 0 0; display: flex; flex-direction: column; justify-content: space-between; height: calc(100% - 170px); }
.productPageListing .row .row .col-lg-3 { margin: 0 0 30px 0; }
.filterBox { position: sticky; top: 150px; }

/* ==================== */

/* investor persona page css */

/* ==================== */
.personaTabbing { padding: 70px 0; }
.personaTabbing .tab-titles { padding: 0; flex-direction: column; }
.personaTabbing ul.tab-titles { border: none; background-color: #EEEEEE; }
.personaTabbing ul.tab-titles li { width: 100%; }
.personaTabbing ul.tab-titles li:before { display: none; }
.personaTabbing ul.tab-titles li.active-li a { background-color: var(--PrimaryColor); color: var(--WhiteColor); }
.personaTabbing ul.tab-titles li a { transition: all 0.3s; font-size: var(--Font16); font-weight: var(--Font500); color: var(--SecondaryColor); text-decoration: none; padding: 15px 20px; display: block; }
.personaTabbing .tabing-main2 { overflow: hidden; }
.personaTabbing .tabing-main2 .tab-content-main .tabContent { padding: 20px; background-color: #FEFEFE; min-height: 500px; border: 1px solid #888888; }
.personaTabbing .tabing-main2 .details { padding: 0; }
.personaTabbing .tabing-main2 .blackTitleText { padding: 10px 0; }
.personaTabbing h3 { font-size: var(--Font26); font-weight: var(--Font600); font-family: 'Montserrat'; margin: 0 0 30px 0; color: var(--SecondaryColor); }
.personaTabbing .tabing-main2 .details ul { list-style: none; margin: 0; padding: 0; }
.personaTabbing .tabing-main2 .details ul li a { text-decoration: none; color: var(--SecondaryColor); transition: all 0.3s; position: relative; display: flex; align-items: center; padding: 0 0 0 30px; margin: 0 0 25px 0; font-weight: var(--Font600); opacity: 0.6; }
.pdfIcon { padding: 0 15px 0 0; width: 35px; height: 35px; }
.pdfIcon img { width: 100%; height: 100%; }
.personaTabbing .tabing-main2 .details ul li a:before { content: '\f105'; font-family: 'FontAwesome'; position: absolute; top: 50%; left: 0; width: 20px; height: 20px; background-color: var(--PrimaryColor); border-radius: 50%; transform: translateY(-50%) translateX(-10px); display: flex; align-items: center; justify-content: center; font-size: var(--Font14); color: var(--WhiteColor); opacity: 0; transition: all 0.3s; }
.personaTabbing .tabing-main2 .details ul li a:hover:before { opacity: 1; transform: translateY(-50%) translateX(0); }
.personaTabbing .tabing-main2 .details ul li a:hover { opacity: 1; }

/*  */
.imageWrapperInner { border-radius: 18px; overflow: clip; width: 100%; height: 370px; }
.imageWrapper iframe { width: 100%; height: 100%; object-fit: cover; }
.imageWrapper { position: relative; }
.imageWrapper:before { content: ''; position: absolute; width: 350px; height: 200px; background-color: var(--PrimaryColor); border-radius: 18px; left: -10px; top: -10px; z-index: -1; }
.imageWrapper:after { content: ''; position: absolute; width: 350px; height: 200px; background-color: var(--PrimaryColor); border-radius: 18px; right: -10px; bottom: -10px; z-index: -1; }
.iconCardVideo { position: relative; z-index: 1; }
.iconCardVideo:before { content: ''; position: absolute; width: 40%; height: 200px; background-color: var(--PrimaryColor); border-radius: 18px; left: 50%; transform: translateX(-50%); top: -10px; z-index: -1; }
.iconCardVideo:after { content: ''; position: absolute; width: 40%; height: 200px; background-color: var(--PrimaryColor); border-radius: 18px; left: 50%; transform: translateX(-50%); bottom: -10px; z-index: -1; }
.iconCardVideoInner { border-radius: 18px; overflow: clip; width: 60%; height: 480px; margin: 0 auto; }
.iconCardVideo { margin: 75px 0 0 0; }
.iconCardVideoInner iframe { width: 100%; height: 100%; }