/* ============================== 1. default ============================== */ ul{margin:0;padding:0;list-style:none;} p:last-child, li:last-child{margin-bottom: 0px !important;border-bottom: none !important;} p,li{font-size: 17px;color: #444444;font-weight:400;line-height: 1.53;} :after,:before,a,.card,img,button,svg{-webkit-transition:all 250ms linear;-moz-transition:all 250ms linear;-o-transition:all 250ms linear;-ms-transition:all 250ms linear;transition:all 250ms linear} .bg-1{background:var(--tc-light)}.bg-2{background:var(--theme-color);}strong{font-weight: 600;font-size: 97%;}a{text-decoration:none; color: currentColor;} .themebtn{background: #081f56;font-size: 16px;font-weight: 600;color: #FFFFFF;padding: 14px 32px;overflow: hidden;z-index: 1;border: none;display: inline-block;border-radius: 0;position: relative;} .themebtn::after {content: ""; background: #0066B4; position: absolute; width: 200%; height: 500%; z-index: -1; border-radius: 100%; -webkit-transform: translate(30%, 10%) translateZ(0); transform: translate(30%, 10%) translateZ(0); -webkit-transition: 0.36s cubic-bezier(0.4, 0, 1, 1); transition: 0.36s cubic-bezier(0.4, 0, 1, 1); } .themebtn:hover:after{ -webkit-transform: translate(-45%, -34%) translateZ(0); transform: translate(-45%, -34%) translateZ(0); } .title :is(h1, h2, h3, h4) {color: var(--title-color);font-size: var(--title-font-size);margin-bottom: var(--title-mb);line-height: 1.154;font-family: var(--title-font-family);} .subtitle :is(h1, h2, h3, h4) {color: var(--subtitle-color);font-size: var(--subtitle-font-size);margin-bottom: var(--title-mb);line-height: 1.32;font-family: var(--title-font-family);} .text-white * {--subtitle-color: #ffffff;--title-color: #ffffff;color: #ffffff;} .tmb-0{--title-mb:0} /* ============================== 2. Pre Loader & Go top ============================== */ #preloader{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;color: #0066B4;background-repeat:no-repeat;background-color:#FFF;background-position:center;} #preloader .flex-center{display:flex;flex-direction:column;align-items:center;justify-content:center; height:100%;} #back-to-top{cursor:pointer;position:fixed;bottom: 0px;right: 0px;z-index:1111;display:none;color: #ffffff!important;background: #0066B4;padding: 9px 12px 1px 12px;border-radius: 24px 24px 0px 0px;max-width: 40px;overflow: hidden;border: solid 1px #ffffff;border-bottom: none;} /* ============================== 3. home css ============================== */ .themeheader{top: 0;z-index: 999;position: sticky;background: var(--theme-color);} .homepage>section{padding-top: var(--section-py); padding-bottom: var(--section-py); position: relative; } .subpage>section{padding-top: calc(0.75 * var(--section-py));padding-bottom: calc(0.75 * var(--section-py)); position: relative;} .headtop {position: relative;padding-right: 21px;background-color: #051740;} .headtop li,.headtop a{display: flex;align-items: center;} .headtop li a{font-size: 15px;font-weight: 500;padding: 12px 16px 10px;text-transform: uppercase;color: rgb(255 255 255 / 85%);--bs-nav-link-hover-color: #ffffff;} .rightnav .themebtn{margin-left: 28px;margin-right: 28px;padding: 12px 21px;border-radius: 0px;color: #051740;background: #fff;font-weight: 600;display: block;text-transform: uppercase;} .rightnav .themebtn>img{width: 24px;height: auto;margin: 0;padding: 0;border-radius: 0;background: transparent;} .rightnav .themebtn:hover>img{-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);} .rightnav .themebtn:hover, .hero-content .themebtn:hover, .themebtn:hover{color: #FFFFFF;} .ltranslator .nav-link.dropdown-toggle {padding: 12px 8px 10px;} .ltranslator .dropdown-menu-end{right: 0;left: auto;margin: 0;padding: 0;width: 100%;top: 100%;border: none;min-width: 114px;max-height: 220px;overflow-y: auto;background: white;-webkit-box-shadow: 0px 7px 21px rgb(0 0 0 / 25%);box-shadow: 0px 7px 21px rgb(0 0 0 / 25%);visibility: hidden;display: block !important;-webkit-transition: 0.5s;transition: 0.5s;clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%);} .ltranslator ul>li>a,.ltranslator ul>div>a{font-size: 13px;font-weight: 500;color: #656565;padding: 8px 12px 8px;background: transparent;border-bottom: solid 1px #e2f1f7;--bs-dropdown-link-hover-color: #081f56;} .ltranslator .dropdown-menu.show{visibility: visible; clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); } .hero-section {position: relative; z-index: 1; overflow: clip; } .hero-section .zooming svg { width: 100%; height: 100%; } .hero-section .zooming .hsc-img-path { fill: #081f56; opacity: 0; -webkit-transition: all 250ms linear;transition: all 250ms linear; } .hero-section .zooming {z-index: 1; position: relative; transform-origin: 60% 50%; } .section-wrap{display: flex;position: sticky;z-index: 2;top: 80px;/* padding-top: 30px; */} .section-wrap .sectionleft{width: 50%;flex-shrink: 0;position: relative;} .section-wrap .sectionleftpic{position: absolute;left: 0;bottom: -1px;width: calc(100% - 62%);} .section-wrap .sectionright{width: 50%;position: sticky;height: calc(100vh - 81px);top: 0;padding-top: 30px;/* min-height: calc(100vh - 81px); */} .hero-content{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;display: flex;align-items: flex-end;padding-bottom: 19vh;} .hero-content h1{color: #ffffff;font-weight: 600;line-height: 0.94;font-family: var(--title-font-family);font-size: var(--hero-title-fsize);} .hero-content h1 span,.hero-content h1 strong{font-weight: 200;display: block;} .hero-content p{color: #ffffff;line-height: 1.47;max-width: 921px;letter-spacing: 0.65px;margin: 28px 0px 32px;font-size: clamp(1rem, 0.6484rem + 0.9766vw, 1.625rem);} .hero-content .themebtn{color: #051740;font-weight: 600;background: #ffffff;} .about-content{position: absolute;top: 0;left: 0;opacity: 0;z-index: 2;width: 100%;height: 100%;display: flex;align-items: center;/* padding: 82px 0px 8px; */transform: translate(150vw , 100vh);} .about-content .sectionpic{max-width: 1146px;width: 100%;margin: auto;} .about-content .sectionpic>img{height: 76vh;margin: auto;display: block;width: fit-content;object-fit: cover;} .about-content .sectiondesc{max-width: 1200px;text-align: center;margin: 30px auto 0px;} .about-content .sectoprect{position: absolute;top: 0;left: 0;opacity: 0;z-index: -1;pointer-events: none;width: calc(100% - 81%);-webkit-transition: all 250ms linear;transition: all 250ms linear;transform: translateY(-100%);} .about-content[style*="opacity:1"], .about-content[style*="opacity: 1"]{background-color: var(--tc-light); } .about-content[style*="opacity:1"] .sectoprect, .about-content[style*="opacity: 1"] .sectoprect{opacity: 1; transform: translateY(0); } .grid-rect{display: grid;grid-template-columns: repeat(6, 16.666%);width: 100vw;max-width: 954px;float: right;clear: both;} .grid-rect-item{display: flex;align-items: center;justify-content: center;position: relative;aspect-ratio: 1 / 1;width: 100%;/* height: 160px; */} .grid-rect-item svg{width: 100%; height: 100%; position: absolute; -webkit-transition: opacity 0.5s ease; transition: opacity 0.5s ease; -webkit-animation: scaleY 2s 0s forwards; animation: scaleY 2s 0s forwards; -webkit-transform-origin: top center; transform-origin: top center; } .grid-rect-item svg path{opacity: 0.65;} .grid-rect-item svg+svg{transform-origin: bottom center;} .grid-rect-item:nth-child(1) svg, .grid-rect-item:nth-child(9) svg, .grid-rect-item:nth-child(14) svg {transform-origin: bottom center;} .grid-rect-item:nth-child(8) svg{transform-origin: center center;} .grid-rect-item:nth-child(11) svg{animation-name: scaleX; transform-origin: left center;} section.aboutus {z-index: 1;padding-top: calc(0.75 * var(--section-py));padding-bottom: calc(0.75 * var(--section-py));} .aboutus .sectionpic{max-width: 1146px;width: 100%;margin: auto;} .aboutus .sectiondesc{max-width: 1200px;text-align: center;margin: 0px auto 0px;} .aboutus .secbtmrect{position: absolute;bottom: -1px;left: 0;pointer-events: none;z-index: -1;width: calc(100% - 81%);} .aboutus .secbtmrect svg, .about-content .sectoprect svg, .sectiongrid svg{width: 100%; height: 100%; } .sectiongrid{position: absolute;pointer-events: none;z-index: -1;width: calc(100% - 78.28%);} .sectiongrid.bigrid{width: calc(100% - 50.29%);} .sectiongrid>img{width: 100%; height: auto; } .sec3dimg{position: absolute;pointer-events: none;z-index: -1;opacity: 0.1; height: 100%; width: calc(100% - 75%); mix-blend-mode: multiply;} .sec3dimg.bigrid{width: calc(100% - 50%);} .sec3dimg>img{width: 100%;height: 100%;object-fit: contain;} .next-section {z-index: 1;} .next-section::after{content: "";position: absolute;left: 0;bottom: 0;width: 100%;height: 51.5%;z-index: -2;background: var(--tc-light);} .builton{display: flex;min-height: 117.52vh;min-height: 100vh;align-items: center;position: relative;overflow: hidden;} .builton .title {padding-bottom: 0px;} .builton .title p{line-height: 1.65; margin-top: 8px;} .carousel__slider{position: relative;width: 100%;min-height: 60vh;z-index: 1;} .carousel__item{width: 100%;min-height: 550px;min-height: 60vh;padding: 48px;background: #fff;border: 1px solid #B9B7B7;position: absolute;z-index: -1;display: flex;flex-direction: column;transition: all 100ms linear;} .carousel__item .itemicon{flex: 1 1 auto; } .carousel__item .itemdesc h4{color: #0066B4;line-height: 1.65;margin-bottom: calc(var(--title-mb) - 4px);font-size: calc(var(--subtitle-font-size) - 5px);} .carousel__item.active{z-index: 2;box-shadow: 1px 10px 20px rgb(0 0 0 / 16%);} .carousel__item.active+.carousel__item{opacity: 0.35 !important;transition-delay: 1ms;} .weworks {z-index: 1;width: 100%;min-height: 100vh;overflow: hidden;position: relative;display: flex;flex-direction: column;justify-content: center;} .weworks .sectiongrid, .scalex-1 {-webkit-transform: scaleX(-1); transform: scaleX(-1); } .panelwrap{gap: 34px;display: flex;/* height: 100vh; */width: max-content;padding-right: 34px;} .panelwrap .panel{flex: none;width: 25vw;display: flex;justify-content: center; -webkit-transition:350ms;transition:350ms;} .panelwrap .panel .card{width: 100%; border: none;border-radius: 0; background: rgb(255 255 255 / 98%);} .panelpic{position: relative;z-index: 1;overflow: hidden;} .panelpic::after{content: "";right: 0;bottom: 0;width: 100%;height: 46%;z-index: 1;position: absolute;background: linear-gradient(0deg,rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);} .panelpic img{width: 100%;max-height: 52.3vh;aspect-ratio: 1/1;object-fit: cover;-webkit-transition: all 1s ease;transition: all 1s ease;} .panel:hover .panelpic:after{height: 100%;} .panel:hover .panelpic img{-webkit-transform: scale(1.07) translateZ(0); transform: scale(1.07) translateZ(0); } .panel .card-body{position: absolute;left: 0;bottom: 0;z-index: 2;width: 100%;padding: 32px 38px;display: flex;column-gap: 12px;align-items: center;justify-content: space-between;} .panel .card-body h5{font-weight: 400;color: #ffffff;margin-bottom: 0;font-size: var(--subtitle-font-size);} .panel.swiper-slide.swiper-slide-prev{opacity: 0; } .swiper-wrapper .panel.swiper-slide:nth-last-child(2) {opacity: 1; } #animatecapability{padding: 72px 0px 48px;overflow-y:hidden;min-height: 100vh;display: flex;align-items: center;justify-content: center;background: var(--tc-light);} #animatecapability .steps-wrapper {margin: auto;max-width: 1280px;position: relative;padding-top: 48px;} #animatecapability .steps-wrapper .line-wrapper{position:absolute;top: 140px;left: 0;width: 100%;height:312px} #animatecapability .steps-wrapper .line-wrapper .line-desktop svg {width: 100%; height: auto; } #animatecapability .steps-wrapper .step .line-wrapper span.icon svg *{-webkit-transition:350ms;-moz-transition:350ms;-o-transition:350ms;transition:350ms;fill:#E1E1E1!important} ul.footer-soc li,ul.footer-soc li a{transition:.3s ease-in-out} #animatecapability .steps-wrapper .step .icon-wrapper span.icon svg.inactive *{fill: #999999 !important;} #animatecapability .steps-wrapper .step .icon-wrapper span.icon svg.active *{fill: #0066B4 !important;} #animatecapability .steps-wrapper .step .icon-wrapper span.icon svg{height:72px;width:auto;max-width:100px} #animatecapability .line-wrapper .line-desktop .icon-active{position:relative;top: -320px;} #animatecapability .line-wrapper .line-desktop .icon-active svg{display:block;stroke-dasharray:2653px;stroke-dashoffset:2653px} #animatecapability .line-wrapper .line-mobile,#animatecapability .line-wrapper .line-tablet,#office-images,#product-application .mason-mobile-wrap,#sus_grid .sus-slider-mobile,.mng-wrap .mng-img .linkd,.rc-road-wrap-mobile,.show-on-mobile-only{display:none} #animatecapability .steps-wrapper .step{padding:0 40px;width: 20%!important;float:left;text-align:center} #animatecapability .steps-wrapper .flex-row-reverse{margin-top: 148px;display:flex;flex-direction:row-reverse} #animatecapability .steps-wrapper .step .icon-wrapper{position:relative;display:inline-block;vertical-align:middle;font-size:0} #animatecapability .steps-wrapper .step .icon-wrapper span.icon{display:block;/* height:120px; */margin-bottom: 56px;/* margin-top:30px; */position:relative;text-align:center} #animatecapability .steps-wrapper .step .icon-wrapper p{font-size: 18px;color: #444444;font-weight: 600;margin:0 0 0 -5px;} #animatecapability .steps-wrapper .step .icon-wrapper span.icon svg.casting.inactive *{fill: transparent !important; stroke: #999999 !important;} #animatecapability .steps-wrapper .step .icon-wrapper span.icon svg.casting.active *{fill: transparent !important; stroke: #0066B4 !important;} #animatecapability .explorebtn{position: relative;z-index: 2;text-align: center;grid-column: 1 / span 2;} .application {z-index: 1; overflow: hidden; clip-path: border-box; } .application .viewbtn{position: absolute; left: 34px; bottom: 34px; z-index: 2; } .application .sectiongrid{-webkit-transform: scaleX(-1); transform: scaleX(-1); } .hover-reveal_images-wrapper {padding-top: calc(0.6 * var(--section-py));} .hover-reveal_images-wrapper .hover-reveal-image{position: relative; z-index: 90; } .hover-reveal_images-wrapper .hover-wrap{z-index: -1; width: 23.4vw; aspect-ratio: 346 / 217; position: fixed; top: 0; left: 0; opacity: 0; pointer-events: none; overflow: hidden; transition: opacity 0.1s ease; filter: drop-shadow(1px 25px 50px rgb(0 0 0 / 24%)); } .hover-reveal_images-wrapper .hover-wrap.animate{opacity: 1; } .hover-reveal_images-wrapper .hover-wrap .hover-wrap-inner{position: relative; width: 100%; height: 100%; clip-path: inset(0 0 0 18vw); transition: clip-path 0.2s; } .hover-reveal_images-wrapper .hover-wrap.animate .hover-wrap-inner{clip-path: inset(0 0 0 0); } .hover-reveal_images-wrapper .hover-wrap .hover-wrap-inner .hover-reveal_image{position: absolute; object-fit: cover; width: 100%; height: auto; top: 0; left: 0; } .hover-reveal_text .z-nine {z-index: 90; } .hover-reveal_text ul li{z-index: 1;position: relative;display: flex;column-gap: 12px;align-items: center;justify-content: space-between;padding: 18px 24px 18px 84px;font-size: var(--subtitle-font-size);border-bottom: solid 1px rgb(0 0 0 / 22%);} .hover-reveal_text ul li>a{flex: auto;display: flex;column-gap: 12px;align-items: center;justify-content: space-between;} .hover-reveal_text ul li::before{content: "";position: absolute;top: 50%;left: 36px;width: 18px;aspect-ratio: 1/1;border-radius: 50%;background: #0066B4;transform: translateY(-50%);box-shadow: -12px 0px 0px #B0CFE8;width: clamp(1.125rem, 0.7734rem + 0.9766vw, 1.75rem);} .hover-reveal_text ul li:hover::before{left: 24px;box-shadow: -5px 0px 0px #B0CFE8;transition: all 0.3s ease-in-out;} .hover-reveal_text ul li::after{content: "";top: 0;left: 50%;opacity: 0;z-index: -1;width: 100vw;height: 0;position: absolute;pointer-events: none;background: #ffffff;transform: translateX(-50%);} .hover-reveal_text ul li:hover::after, .hover-reveal_text ul li.hover::after{opacity: 1; height: 100%; transition: all 0.3s ease-in-out;} .launched .swiper-slide{height: auto; } .launched .card{height: 100%; border-radius: 0; border-color: #C2C2C2;} .launched .card p{color: #0066B4;font-size: 18px;transition: all 250ms linear;} .launched .card h5{color: #444444;font-size: 28px;text-decoration: underline;transition: all 250ms linear;} .launched .card-body{padding: 48px 36px;padding: 4vh 4vh;transition: all 250ms linear;} .launched .card:hover p{color: #ffffff;} .launched .card:hover h5{color: #ffffff;} .launched .card:hover .card-body{background: #0066B4; } .launched .cardpic{position: relative;overflow: hidden;z-index: 1;} .launched .cardpic img{width: 100%;height: 45vh;aspect-ratio: 308 / 207;object-fit: cover;-webkit-transition: all 1s ease-out;transition: all 1s ease-out;} .launched .card:hover .cardpic img {-webkit-transform: scale(1.07) translateZ(0); transform: scale(1.07) translateZ(0); } .slidernav{display: flex;column-gap: 16px;align-items: center;} .slidernav a{font-size: 15px;font-weight: 600;color: #081F56;display: inline-flex;align-items: center;column-gap: 2px;margin-left: 8px;} .slidernav a>svg{width: 10px;height: 10px;fill: #0066B4;} .slide-prev, .slide-next{position: relative;z-index: 2;display: block; outline: none;} .slide-prev svg, .slide-next svg{width: 20px;height: 20px;fill: #A8C7E4;-webkit-transform: scale(1.4);transform: scale(1.4);} .slide-prev:hover svg, .slide-next:hover svg{fill: #0066B4;} .slidernav a:hover{column-gap: 4px;color: #0066B4;margin-right: -6px;letter-spacing: 0.5px;} .video-wrap {margin: 0 auto; position: relative; width: 100%; } .video-wrap video {display: block;height: auto;margin: auto;position: relative;width: 100%;height: 83.58vh;object-fit: cover;} lottie-player{max-width: 124px; height: auto; } .footer{z-index: 1;position: relative;overflow: hidden;padding: calc(0.7 * var(--section-py));padding-bottom: 0px;background: var(--tc-light) url(../images/sectiongrid-b.svg) no-repeat;background-size: auto;background-attachment: fixed;background-position: left bottom;} .footer .sectiongrid.bigrid{opacity: 0; visibility: hidden; } .footertop{padding: 48px 38px;} .footertop h5 {color: #0066B4;margin-bottom: 16px;font-size: 18px;font-weight: 600;text-transform: uppercase;} .footertop p, .footertop ul>li, .footertop ul>li>a {font-size: 18px;font-weight: 500;line-height: 1.558;position: relative;white-space: pre-line;} .contlist+.contlist h5 {margin-top: 28px;margin-bottom: 8px;} .footertop .navlist li {margin: 7px 0;white-space: nowrap;} .footertop ul>li>a{white-space: nowrap; } .footertop ul>li>a:before {content: "";position: absolute;background: rgb(0 0 0 / 17%);right: 0;left: 0;bottom: 0px;width: 0px;height: 1px;margin: auto;visibility: hidden;} .footertop ul>li>a:hover {color: var(--theme-color);} .footertop ul>li>a:hover:before {width: 100%;visibility: visible;} .footer-logo{padding: 5px 38px 6px;} .footermid{padding: 42px 38px 41px;border-top: 1px solid rgb(0 0 0 / 17%);} .footermid ul>li, .footermid ul>li>a {font-size: 15px;font-weight: 500;text-transform: uppercase;} .social li a{margin-left: 14px;} .social li a>img{-webkit-transition:all 250ms linear; transition:all 250ms linear; } .social li a:hover>img{-webkit-transform: scale(0.9);transform: scale(0.9);} .copyrights{padding: 35px 38px;border-top: 1px solid rgb(0 0 0 / 17%);} .copyrights p {font-size: 15px;font-weight: 400;color: rgb(68 68 68 / 85%);line-height: normal;} .copyrights p a>img{max-width: 28px; margin-left: 4px; -webkit-filter: invert(1) grayscale(1) brightness(2) opacity(0.56); filter: invert(1) grayscale(1) brightness(2) opacity(0.56); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .copyrights p:hover a>img{-webkit-filter: invert(1) grayscale(1) brightness(2) opacity(0.86); filter: invert(1) grayscale(1) brightness(2) opacity(0.86); } .btn-whatsapp-pulse{background:#25d366;color:#fff;position:fixed;left: 14px;bottom: 14px;font-size:30px;display: inline-flex;justify-content:center;align-items:center;width:0;height:0;z-index:9;padding:30px;text-decoration:none;border-radius:50%;animation-name:whatsapppulse;animation-duration:1.5s;animation-timing-function:ease-out;animation-iteration-count:infinite} @-webkit-keyframes whatsapppulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}80%{box-shadow:0 0 0 14px rgba(37,211,102,0)}}@keyframes whatsapppulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}80%{box-shadow:0 0 0 14px rgba(37,211,102,0)}} .mf-cursor{position:fixed;top:0;left:0;z-index:250;direction:ltr;contain:layout style size;pointer-events:none;transition:opacity .3s,color .4s}.mf-cursor:before{content:"";position:absolute;top:-24px;left:-24px;display:block;width:48px;height:48px;transform:scale(0.2);background:currentColor;border-radius:50%;transition:transform .25s ease-in-out,opacity .1s}.mf-cursor.-inverse{color:#fff}@supports(mix-blend-mode: exclusion){.mf-cursor.-exclusion{mix-blend-mode:exclusion}.mf-cursor.-exclusion:before{background:#fff}}.mf-cursor.-pointer:before{transform:scale(0.15)}.mf-cursor.-text:before{opacity:.85;transform:scale(1.7)}.mf-cursor.-text.-active:before{transform:scale(1.6);transition-duration:.2s}.mf-cursor.-icon:before{transform:scale(1.5)}.mf-cursor.-icon.-active:before{transform:scale(1.4)}.mf-cursor.-hidden:before{transform:scale(0)}.mf-cursor-text{position:absolute;top:-18px;left:-18px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;transform:scale(0) rotate(10deg);opacity:0;color:#fff;font-size:16px;line-height:20px;text-align:center;transition:opacity .4s,transform .3s}.mf-cursor.-text .mf-cursor-text,.mf-cursor.-icon .mf-cursor-text{opacity:1;transform:scale(1)}.mf-cursor-media{position:absolute;width:400px;height:400px;margin:-200px 0 0 -200px}.mf-cursor-media img,.mf-cursor-media video{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:50%}@supports(object-fit: cover){.mf-cursor-media img,.mf-cursor-media video{position:static;width:100%;height:100%;object-fit:cover;transform:translateZ(0)}}.mf-cursor-media-box{position:relative;width:100%;height:100%;overflow:hidden;transform:scale(0) translateZ(0);padding:1px;opacity:0;border-radius:50%;transition:transform .35s,opacity .2s .2s}.mf-cursor.-media .mf-cursor-media-box{opacity:1;transform:scale(0.696);transition-duration:.4s,.4s;transition-delay:0s,0s} .mf-cursor.-text.-inverse .mf-cursor-text{color: #212529; } .mf-cursor.-hidden .mf-cursor-text {transform: scale(0); } /* ============================== 4. sub page css ============================== */ main.subpage {width: 100%; overflow: clip; } .sub-banner {z-index: 1;min-height: 128px;position: relative;overflow: hidden;display: grid;column-gap: 12px;align-items: end;grid-template-columns: 1fr 1fr;background-color: var(--tc-light);} .sub-banner .banner-inner {top: 0;left: 0;z-index: 2;width: 100%;height: 100%;position: absolute;padding: 32px 0px;display: flex;align-items: center;} .sub-banner .banner-inner h4{font-size: var(--title-font-size);color: var(--title-color);font-weight: 600;margin-bottom: 4px;font-size: calc(var(--title-font-size) + 25%);} .sub-banner .banner-inner .breadcrumb li, .sub-banner .banner-inner .breadcrumb li a{color: #444444;font-weight: 500;font-size: 19px;--bs-breadcrumb-divider-color: #d7d7d7;} .sub-banner .banner-inner .breadcrumb {padding: 0px 0px;margin-bottom: 0;} .sub-banner .breadwrap {display: flex;flex-wrap: wrap;column-gap: 24px;align-items: center;justify-content: space-between;} .sub-banner .breadcrumb li{position: relative;padding-right: 13px;margin-right: 8px;} .sub-banner .breadcrumb li:before {content: "/";position: absolute;right: -1px;top: 1px;padding: 0;} .sub-banner .breadcrumb li:last-child:before{display: none; } .sub-banner .breadcrumb li+li{padding-left: 0;} .sub-banner .grid-rect{opacity: 0.07;mix-blend-mode: hard-light;} .sub-banner .sectiongrid {opacity: 0.7;-webkit-transform: scaleX(-1);transform: scaleX(-1);mix-blend-mode: hard-light;width: calc(100% - 77.8%);} .banner-bg-img{content: ""; position: absolute; width: 100%; height: 100%; left: 0; top: 0; opacity: .2; background-repeat: repeat-x; background-size: auto 100%; background-position: 0 0;} /* .banner-bg-img{-webkit-animation: scrollBackground 20s linear infinite; animation: scrollBackground 20s linear infinite; } @-webkit-keyframes scrollBackground{0%{background-position:0 0}100%{background-position:100% 0}} @keyframes scrollBackground{0%{background-position:0 0}100%{background-position:100% 0}} */ .themeaccordion {--bs-accordion-btn-bg: transparent; --bs-accordion-bg: transparent; } .themeaccordion .accordion-button:not(.collapsed) {color: #081f56;padding: 24px 16px 12px;background: rgb(243 242 250 / 35%);box-shadow: none;} .themeaccordion .accordion-button{font-size: 20px;font-weight: 500;color: #444444;padding: 20px 16px;-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;} .themeaccordion .accordionicon{position: absolute;width: 40px;flex-shrink: 0;left: 2px;-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;} .themeaccordion .accordion-body{background: rgb(243 242 250 / 35%);padding: 0px 16px 22px;} .themeaccordion .accordion-button:not(.collapsed) .accordionicon{width: 0px; opacity: 0; } .themeaccordion .accordion-button::after{background-image: none;content: "+";line-height: 21px;text-align: center;font-size: 96%;} .themeaccordion .accordion-button:not(.collapsed)::after{background-image: none;content: "-";} .themeaccordion .accordion-item{border: none; border-radius: 0; } .themeaccordion .accordion-item+.accordion-item {border-top: solid 1px rgb(0 0 0 / 12%);} .themelist li{position: relative;padding-left: 30px;margin-bottom: 8px;} .themelist li::before{content: "";position: absolute;top: 13px;left: 7px;width: 10px;aspect-ratio: 1/1;border-radius: 50%;background: #0066B4;transform: translateY(-50%);box-shadow: -5px 0px 0px #B0CFE8;} .themelist li:hover::before{left: 4px;box-shadow: -2px 0px 0px #B0CFE8;} .column-2{display: grid; column-gap: 24px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); } .thememodal .modal-fullscreen .modal-content{background: #f8f9fa;background-size: cover;} .thememodal .modal-fullscreen .modal-body{display: flex;flex-wrap: wrap;align-items: center;justify-content: center; } .thememodal .modal-wrap{width: 100%;max-width: 1240px;background: #ffffff;border-radius: 0px 48px;box-shadow: 0px 7px 32px rgb(0 0 0 / 10%);} .thememodal .modalpic {margin: 9px;overflow: hidden;position: relative;padding: 48px 42px;height: calc(100% - 18px);border-radius: 0px 0px 0px 40px;} .thememodal .contactinfo{background: #efe6dd;} .thememodal .themeform{padding: 48px 42px; } .themeoffcanvas.offcanvas{opacity: 0;padding: 32px;max-width: 890px;border-radius: 24px;--bs-offcanvas-width: 100%;border: solid 14px transparent;transform-origin: top right;transform: scale(.3) translate(0) !important;--bs-offcanvas-transition: all 0.3s ease-in-out;} .themeoffcanvas.offcanvas.show{opacity: 1;visibility: visible;pointer-events: auto;transform: scale(1) translate(0) !important;} .themeoffcanvas .canvaswrap{height: 100%;margin: auto;max-width: 740px;display: flex;align-items: center;justify-content: center;} .offcanvas-backdrop {background: rgba(0, 0, 0, 0.25); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); transition: all 0.3s ease-in-out; } .offcanvas-backdrop.show{opacity: 1; } .close-button {width: 48px;height: 48px;background: none;right: 9px;top: 9px;z-index:2;position: absolute;text-indent: -9999px;box-shadow: none !important;} .close-button:before, .close-button:after {content: '';width: 55%;height: 2px;background: #000;position: absolute;top: 48%;left: 22%;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;} .close-button:after {-webkit-transform: rotate(45deg);transform: rotate(45deg);-webkit-transition: all 0.3s ease-out;transition: all 0.3s ease-out;} .close-button:hover:before, .close-button:hover:after {-webkit-transform: rotate(180deg);transform: rotate(180deg);} .readmorebtn {display: inline-flex;vertical-align: middle;align-items: center;column-gap: 12px;flex-shrink: 0;font-size: 14px;font-weight: 500;color: #0066B4;} .readmorebtn svg, .readmorebtn img{width: 45px; } .readmorebtn .ring{stroke-dashoffset: 6;stroke-dasharray: 148px;-webkit-transition: all 0.35s ease;transition: all 0.35s ease;} .readmorebtn .arrow{-webkit-transition: all 0.35s ease; transition: all 0.35s ease; backface-visibility: hidden; } .readmorebtn:hover .ring{stroke-dashoffset: -8;stroke-dasharray: 107px;} .readmorebtn:hover .arrow{-webkit-transform: translate(817px , 1900px);transform: translate(817px , 1900px);} .viewbtn{display: inline-flex;align-items: center;justify-content: center;font-size: 16px;font-weight: 400;color: #000000; width: 75px;height: 75px; border-radius: 50%;background: rgb(255 255 255 / 90%);} .viewbtn:hover{color: #ffffff; background: #0066B4;} .marqueeSwiper .swiper-wrapper{-webkit-transition-timing-function: linear !important; transition-timing-function: linear !important; } .marqueeSwiper .swiper-slide{text-align: center;background: #fff;display: flex;justify-content: center;align-items: center;width: auto;position: relative;overflow: hidden;padding: 0 50px;color:transparent;font-size: calc(var(--title-font-size) + 25%);font-weight:900;font-family: var(--title-font-family);-webkit-text-stroke-width: 1px;-webkit-text-stroke-color: rgb(8 31 86 / 25%);} .marqueeSwiper .swiper-slide:before{content: "*"; position: absolute; right: -4.2vw; top: 64%; transform: translateY(-50%); } .marqueeSwiper .swiper-slide:last-child::before{display: none; } .gsap-clip-path {width: 100%;overflow: hidden;background: #ffffff;/* padding: 0px !important; */background: linear-gradient(0deg,rgba(255, 255, 255, 1) 50%, rgba(243, 242, 250, 1) 50%);} [gsap-clip-path="component"] {padding: 0;width: 100%;height: 100vh;/* width: 100vw; */height: auto;display: flex;align-items: center;justify-content: center;} [gsap-clip-path="wrapper"] {width: 100%;height: 100%;width: 100vw;height: auto;/* background: #ffffff; */overflow: hidden;position: absolute;position: relative;/* display: flex; *//* align-items: center; *//* justify-content: center; */} [gsap-clip-path="wrapper"].is-active {/* width: 60%; *//* height: 80%; *//* box-shadow: 0px 7px 32px rgb(0 0 0 / 24%); */margin: 0 auto;flex-shrink: 0;padding: calc(0.75 * var(--section-py));} [gsap-clip-path="image"] {width: 100%;height: 100%;height: auto;object-fit: cover;box-sizing: border-box;} .subpage .aboutus .secbtmrect{width: calc(100% - 86%); } .legacy .card {height: 100%;padding: 18px;flex-direction: row;border-color: #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .legacy .cardicon{width: 100%;flex-shrink: 0;max-width: 112px;} .legacy .card h4{margin-bottom: 12px;/* font-size: calc(var(--subtitle-font-size) - 25%); */} .legacy .yearsofx{column-gap: 4px;--subtitle-color: #0066b4;} .legacy .yearsofx .cardicon{max-width: 134px;} .capability .card{height: 100%;border-color: #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);--bs-card-spacer-y: 28px;--bs-card-spacer-x: 28px;} .capability .card h5{font-size: 22px;color: #444444;line-height: 1.32;margin-bottom: 12px;} .capability .cardpic{position: relative;overflow: hidden;z-index: 1;margin: -1px;} .capability .cardpic img{width: 100%; aspect-ratio: 5/3; object-fit: cover; -webkit-transition: all 1s ease; transition: all 1s ease;} .capability .card:hover .cardpic img{-webkit-transform: scale(1.1) translateZ(0); transform: scale(1.1) translateZ(0); } .gsourcing{position: relative;z-index: 1;height: 100%;padding: 32px;overflow: hidden;border-radius: 18px;background: var(--theme-color);} .gsourcing::after{content: "";position: absolute;top: 0;left: 0;z-index: -1;width: 100%;height: 100%;opacity: 0.5;background: url(../sub-images/global-bg.jpg);background-repeat: no-repeat;background-size: cover;} .quality{position: relative;z-index: 1;padding: 32px;overflow: hidden;border-radius: 18px 18px 0px 18px;background: var(--theme-color);} .quality .qltycertifct{display: block;background: #fff;height: auto;border-radius: 12px;padding: 18px 8px;text-align: center; height: 100%;} .quality .qltycertifct img{aspect-ratio: 1/1;object-fit: cover;max-width: 100px;margin: auto;} .quality .qltycertifct h5{font-size: 16px;color: #444444;margin-top: 14px;margin-bottom: 0;text-align: center;} .quality .swiper-slide{height: auto; } .sliderwrap{position: relative;margin-left: auto;margin-right: -32px;margin-bottom: -32px;max-width: fit-content;padding-top: 20px;padding-left: 20px;} .sliderwrap .wrapinner{background: var(--tc-light);padding: 24px 1px 1px 24px;border-radius: 24px 0px 0px 0px;} .sliderwrap:before, .sliderwrap:after { content: ""; position: absolute; background-color: transparent; box-shadow: 0 20px 0 0 var(--tc-light); left: 0; bottom: 0; height: 40px; width: 20px; } .sliderwrap:before { right: 0; left: initial; top: -20px; bottom: initial; -webkit-border-radius: 0; border-radius: 0; border-bottom-right-radius: 20px; } .sliderwrap:after { left: 0; right: initial; top: initial; bottom: 0; -webkit-border-radius: 0; border-radius: 0; border-bottom-right-radius: 20px; } .meetteam{z-index: 1;overflow: clip;} .meetteam .sectionleft{position: sticky; top: 124px; z-index: 1; } .ourteam .card{height: 100%;--bs-card-spacer-y: 28px;--bs-card-spacer-x: 28px;border-color: #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .ourteam .card h5{font-size: 22px;color: #444444;line-height: 1.32;margin-bottom: 4px;} .ourteam .card p{font-size: 16px;color: #757575;} .ourteam .cardpic{position: relative;margin: -1px -1px 1px -1px;} .ourteam .cardpic>img{width: 100%;aspect-ratio: 180 / 156;object-fit: cover;border-radius: 4px 4px 0px 0px;4px 4px 0pxcontain-intrinsic-block-size: auto 100px;} .ourteam .card-body{position: relative; z-index: 1; } .ourteam .row div:nth-child(even) .card{-webkit-transform: translateY(32px);transform: translateY(32px);} .socials{right: 5%;z-index: 2;position: absolute;text-align: center;pointer-events: none;bottom: -21px;} .trigger-icon{display: block; position: absolute; bottom: 0; left: 0; padding: 11px 11px; border-radius: 25px; background-color: #081f56; } .social-list{max-width: 50px; overflow: hidden; border-radius: 25px; pointer-events: auto; } .social-list ul{padding: 12px 0px; position: relative; background-color: #081f56; -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: transform 0.6s cubic-bezier(.77,0,.01,.98); transition: transform 0.6s cubic-bezier(.77,0,.01,.98); } .card:hover .social-list ul{-webkit-transform: translateY(0); transform: translateY(0); } .social-list ul li a{display: block; padding: 12px 16px; color: #fff; pointer-events: none; } .social-list ul li a img{width: 18px; height: auto; } .social-list ul li:hover a{pointer-events: auto; } .custom-tooltip { --bs-tooltip-bg: var(--theme-color); --bs-tooltip-color: var(--bs-white); } .snapsection {width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; text-align: center; } .panelsnap { scroll-snap-align: center; } .img_parallax{overflow: hidden; } .corevalues h5{font-size: 22px;color: #444444;line-height: 1.53;margin-bottom: 16px;} .corevalues .cardicon{position: sticky;overflow: hidden;z-index: 1;padding: 10px;max-width: 168px;margin: auto;top: 114px;} .corevalues .sectiondesc{padding-left: 48px; } .corevalues .cvaluesbox{position: relative;z-index: 1;padding-top: 38px;padding-bottom: 38px;border-top: solid 1px rgb(0 0 0 / 14%);} .corevalues .cvaluesbox::after{content: "";position: absolute;height: 100%;width: 1px;top: 0;left: calc(25% + 1px);background: rgb(0 0 0 / 14%);} .corevalues .cvaluesbox:last-child{padding-bottom: 8px; } .corevalues .mission .cardicon{transform: scale(0.92);backface-visibility: hidden;} .big-thank{overflow: hidden;position: relative;border-bottom: 1px solid #e9e8f1;} .big-thank h4{color: #0066B4; line-height: 1.65; margin-bottom: 0; font-size: calc(var(--subtitle-font-size) - 62%); } .lfounder {--subtitle-color: #081f56; } .lfounder .sectionpic{width: 50vw;clear: both;height: 100%;position: relative;background:var(--tc-light);} .lfounder .sectionpic>img{width: 100%; height: 100%; object-fit: cover;} .lfounder .btmtouch{height: calc(100% + 0.75 * var(--section-py));} .lfounder .sectionpic::after{content: "";right: 0;bottom: 0;width: 100%;height: 46%;z-index: 1;position: absolute;background: linear-gradient(0deg, rgb(0 0 0 / 68%) 0%, rgba(0, 0, 0, 0) 100%);} .lfounder .sectionpic .splittext{left: 8%;right: 8%;bottom: 8%;z-index: 2;position: absolute;color: #ffffff;line-height: 1.65;margin-bottom: 0;font-weight: 500;text-align: center;font-size: calc(var(--subtitle-font-size) - 50%);} .csr .video-wrap video{height: auto; aspect-ratio: 3 / 2; } .reveal{visibility: hidden; position: relative; overflow: hidden; } .reveal img{height: 100%;width: 100%;object-fit: cover;transform-origin: left;} .splittext{overflow-wrap: normal; word-break: normal; } .text-animated > h2 > div, .text-animated > h4 > div{background: linear-gradient(to right, rgb(68 68 68) 50%, rgb(211 211 211) 50%); background-size: 200% 100%; background-position-x: 100%; -webkit-background-clip: text; background-clip: text; color: transparent; } .themeform .form-control, .themeform .form-select{border: none;height: 56px;font-weight: 500;border-radius: 0px;padding-left: 4px;padding-bottom: .35rem !important;border-bottom: solid 2px #ccd5dd;background-color: transparent;} .themeform span textarea.form-control{resize: none;height: 124px;} .themeform .form-floating>label {color: #444;font-size: 16px;font-weight: 500;padding-left: 0px;--bs-body-bg: transparent;} .themeform .form-select{padding-top: 23px;box-shadow: none !important;} .thememap {width: 100%;z-index: 1;padding: 12px;box-shadow: none;position: relative;background: var(--theme-color);border-bottom: solid 1px #c7d0d7;border-radius: 14px 14px 0px 0px;} .thememap .ratio{border-radius: 12px 12px 0px 0px;overflow: hidden;max-height: 568px;min-width: 280px;height: 100%;} .contact {z-index: 1; background: #F3F2FA; background: linear-gradient(0deg, rgba(243, 242, 250, 1) 0%, rgba(255, 255, 255, 1) 100%);} .contact .contactbox{min-width: 50vw;position: sticky;top: calc(0.75 * var(--section-py) + 2.5vh);} .contact .themeform{padding: 48px;border-radius: 12px;background: #ffffff;border: solid 1px #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .contact .card{padding: 18px;border-radius: 12px;border-color: #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .contact .card h5{font-size: 26px;color: #081f56;margin-bottom: 12px;} .contact .card li{margin-top: 8px;line-height: 1.68;} .contact .imglogo{width: 100%;max-width: 320px;margin-bottom: 21px;} .contact .card+.card{margin-top: 34px; } .file-drop-area { z-index: 2; } .file-drop-area .file-message { position: absolute; z-index: -1; color: #313131; font-weight: 500; bottom: 0; left: 0; } .file-drop-area .file-input { opacity: 0; } .file-drop-area input[type=file]::-webkit-file-upload-button { display: none; } .file-drop-area input[type=file]::file-selector-button { display: none; } .infrastructure {overflow: hidden; } .infrastructure .subtitle h1, .infrastructure .subtitle h2{font-weight: 400;margin-bottom: 0;} .infrastructure .hover-reveal_text ul li::after{background: var(--tc-light);} .infrastructure .hover-reveal_text ul li small{color: rgb(68 68 68 / 80%);} .policies {z-index: 1;/* min-height: 100vh; */overflow: clip;position: relative;/* display: flex; *//* flex-direction: column; *//* justify-content: center; */} .policies .card{height: 100%;overflow: hidden;border-radius: 8px;border-color: #dfdde9;background: rgb(243 242 250);box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .policies .card h5{margin-bottom: 0;display: flex;align-items: center;column-gap: 12px;font-size: 18px;color: #081f56;font-weight: 500;} .policies .card h5>img{width: 26px;backface-visibility: hidden;filter: drop-shadow(-1px 1px 2px #ffffff);} .policies .cardpic{height: 100%;padding: 12px 12px 0px;position: relative;overflow: hidden;border-bottom: solid 1px #e9e8f1;} .policies .cardpic>img{width: 100%;height: 100%;object-fit: cover;aspect-ratio: 478 / 650;object-position: top center;} .policies .card-body{padding: 24px 24px;background: #f3f2fa;} .policies .panelwrap{padding-top: calc(0.3 * var(--section-py));padding-bottom: calc(0.3 * var(--section-py));} .policies .panelwrap .panel:nth-child(odd){transform: translateY(calc(-0.3 * var(--section-py))); } .policies .panelwrap .panel:nth-child(even){transform: translateY(calc(0.3 * var(--section-py)));} .content-text-wrapper h5{color: #444444; font-size: 28px; line-height: 1.35; } .content-text-wrapper p{color: #0066B4; font-size: 18px; } .content-section-reveal+.content-section-reveal{margin-top: 42px; } .char-reveal-heading{display: inline-block; overflow: hidden; } .char-reveal-heading .word { white-space: nowrap; display: inline-block; } .char-reveal-heading .char{display: inline-block; opacity: 0; transform: translateY(20px) rotateX(90deg); will-change: transform, opacity; } .applicard{display: block;padding: 30px;overflow: hidden;position:relative;border-radius: 12px;background-color: #ffffff;border: solid 1px #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .applicard .applioverlay{position:absolute;inset:0;border-radius:12px;opacity:0;visibility:hidden;-webkit-transition:.4s ease-in-out;transition:.4s ease-in-out;background-repeat:no-repeat;background-size:cover;background-position:center center} .applicard:hover .applioverlay{opacity:1;visibility:visible} .applicard .applioverlay:before{content:'';position:absolute;inset:0;background: var(--tc-light);z-index:3;border-radius:inherit;-webkit-transition:.4s ease-out;transition:.4s ease-out} .applicard:hover .boximg,.applicard:hover .applioverlay:before{-webkit-transform:translate(100%,-100%);-ms-transform:translate(100%,-100%);transform:translate(100%,-100%)} .applicard .applioverlay:after{content:"";position:absolute;inset:0;border-radius:inherit;background: -webkit-linear-gradient(bottom, rgb(0 0 0 / 70%), rgb(0 0 0 / 35%));background: linear-gradient(0deg, rgb(0 0 0 / 70%), rgb(0 0 0 / 35%));z-index:2} .applicard .boxcontent{position:relative;z-index:4;filter: drop-shadow(4px 4px 16px rgb(0 0 0 / 7%));} .applicard .boxicon{position:relative;width: 68px;height: 68px;line-height: 68px;background-color: #0066b4;border-radius:50%;text-align:center;margin-bottom:30px;z-index:2;-webkit-transition:.4s ease-in-out;transition:.4s ease-in-out} .applicard .boxicon:before{content:"";position:absolute;inset:0;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);border-radius:50%;background-color: var(--tc-light);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition:.5s cubic-bezier(.62, .21, .45, 1.52);transition:.5s cubic-bezier(.62, .21, .45, 1.52);z-index:-1} .applicard:hover .boxicon:before{-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1)} .applicard .boxicon img{-webkit-filter: brightness(0) invert(1);filter: brightness(0) invert(1);-webkit-transition:.4s ease-in-out;transition:.4s ease-in-out;max-width: 38px;height:auto;width: 100%;} .applicard:hover .boxicon img{-webkit-filter: brightness(1) invert(0);filter: brightness(1) invert(0);-webkit-transform:rotateY(180deg);transform:rotateY(180deg)} .applicard .boximg{position:absolute;top:-30px;right:-30px;max-width: 143px;aspect-ratio:13/10;clip-path:path("M0 0 C47.19 0 94.38 0 143 0 C143 71.24957555 143 71.24957555 123.69921875 91.40234375 C110.17737399 104.34879086 94.37700065 110.65462329 75.74243164 110.47314453 C56.91429553 109.84400967 41.6674239 100.25320706 28.9375 86.875 C7.48210949 62.39772351 0 31.92530583 0 0 Z")} .applicard .boximg>img{width: 102%;height: 102%;object-fit:cover} .applicard h5{color: #081f56;margin-bottom: 10px;font-size:24px;line-height: 1.4;font-weight:500;} .applicard:hover p,.applicard:hover h5{color:var(--bs-white)} .subpage .application .sectiongrid{-webkit-transform: scaleX(1); transform: scaleX(1); } .masonry{column-count: 3; column-gap: 3rem; } @media (max-width: 992px) { .masonry { column-count: 2; } } @media (max-width: 576px) { .masonry { column-count: 1; } } .masonry-item { opacity: 0; break-inside: avoid; margin-bottom: 3rem; transform: translateY(30px); transition: all 0.2s ease; } .errorbox, .thankbox{max-width: fit-content;margin: auto;text-align: center;background: #fff;padding: 4% 8%;border-radius: 4px;border: solid 1px #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .error-title{position: relative;display: inline-block;font-size: 10vw;line-height: 1.2;font-weight: 600;color: #0066b4;z-index: 2;} .thank-icon{position: relative; width: 32%; max-width: 148px; margin: 24px auto; } .facilities{z-index: 1;width: 100%;overflow: hidden;} .facilities .card{border: none;border-radius: 0;justify-content: center;background: rgb(255 255 255 / 98%);} .facilities .cardpic{position: relative;z-index: 1;overflow: hidden;} .facilities .cardpic::after{content: "";right: 0;bottom: 0;width: 100%;height: 46%;z-index: 1;position: absolute;background: linear-gradient(0deg,rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);} .facilities .cardpic img{width: 100%;aspect-ratio: 1/1;object-fit: cover;-webkit-transition: all 1s ease;transition: all 1s ease;} .facilities .card:hover .cardpic:after{height: 100%;} .facilities .card:hover .cardpic img{-webkit-transform: scale(1.07) translateZ(0); transform: scale(1.07) translateZ(0); } .facilities .card .card-body{position: absolute;left: 0;bottom: 0;z-index: 2;width: 100%;padding: 32px 38px;display: flex;column-gap: 12px;align-items: center;justify-content: space-between;} .facilities .card .card-body h5{color: #ffffff;margin-bottom: 0;font-size: var(--subtitle-font-size);} .materialin{z-index: 1; width: 100%; min-height: 100vh; overflow: hidden; position: relative; } .materialin .card{border: none; border-radius: 0; overflow: hidden; } .gallery{width:100%;height:100%;overflow:hidden;background-color:#fff;} .gallery .thumbox{cursor:pointer;position:relative;overflow:hidden;display: block;z-index: 1;} .gallery .full{top:0; width:100%; height:100%; z-index:100; font-size:0; display:none; position:fixed; overflow:hidden; background:#fff; } .gallery .fullImg{pointer-events:none;position:absolute;max-width: 80%;max-height: 80%;top:50%;left:50%;box-shadow: 0px 7px 32px rgb(0 0 0 / 25%);-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);} .gallery .prev, .gallery .next{cursor:pointer;background-color:#ddd;color:#fff;font-size:30px;line-height:0;position:absolute;width: 56px;height: 48px;top:50%;-webkit-transform: translateY(-50%);transform:translateY(-50%);padding: 21px 12px;} .packaging{z-index: 1;overflow: clip;} .packaging h5{font-size: 22px;color: #444444;line-height: 1.32;margin: 14px 0px;} .packaging .sectionleft{position: sticky; top: 124px; z-index: 1; } .packimages .cardpic{overflow: hidden;position: relative;border-radius: 0px;} .packimages .cardpic>img{width: 100%;aspect-ratio: 3 / 2;object-fit: cover;-webkit-transition: all 1s ease;transition: all 1s ease;} .packimages .row div:nth-child(even) .cardpic{-webkit-transform: translateY(24px);transform: translateY(24px);} .packimages .cardpic::after{content: "";right: 0;bottom: 0;z-index: 1;width: 100%;height: 100%;position: absolute;mix-blend-mode: darken;background: rgb(0 0 0 / 7%);} .packimages .cardpic:hover:after{background: rgb(0 0 0 / 24%);} .packimages .cardpic:hover img{-webkit-transform: scale(1.08) translateX(0);transform: scale(1.08) translateX(0);} .Mfacilities.sticky{position: relative;z-index: 1;border-radius: 64px 64px 0 0;} .Mfacilities .sectionpic{z-index: 1;overflow: hidden;position: relative;border-radius: 12px;background: rgb(8 31 86 / 5%);} .Mfacilities .sectionpic img{aspect-ratio: 3/2;object-fit: cover;} .Mfacilities .sectiongrid.top-0{mix-blend-mode: hard-light;top: var(--section-py) !important;} .Mfacilities.bg-white{box-shadow: 0px 0px 32px rgb(0 0 0 / 10%);} .Mfacilities.bg-1{border-top: solid 1px #e9e9f3;box-shadow: 0 -10px 30px 0 rgba(0, 0, 0, .032);} .morepics .cardpic{display: block;overflow: hidden;position: relative;border-radius: 8px;outline: none;} .morepics .cardpic>img{width: 100%;aspect-ratio: 3 / 2;object-fit: cover;-webkit-transition: all 1s ease;transition: all 1s ease;} .morepics .cardpic::after{content: "";right: 0;bottom: 0;z-index: 1;width: 100%;height: 100%;position: absolute;mix-blend-mode: darken;background: rgb(0 0 0 / 7%);} .morepics .cardpic:hover:after{background: rgb(0 0 0 / 24%);} .morepics .cardpic:hover img{-webkit-transform: scale(1.08) translateX(0);transform: scale(1.08) translateX(0);} .qoverview .sectionpic{width: 50vw;clear: both;top: 128px;position: sticky;overflow: hidden;background:var(--tc-light);border-radius: 0px 16px 16px 0px;} .qoverview .sectionpic>img{width: 100%; height: 100%; object-fit: cover;} .qoverview .sectionpic .splittext{left: 8%;right: 13%;bottom: 8%;z-index: 2;position: absolute;color: #ffffff;line-height: 1.65;margin-bottom: 0;font-weight: 500;text-align: center;font-size: calc(var(--subtitle-font-size) - 50%);} .qprocess {overflow: hidden; z-index: 1;} .process-info{position: relative;overflow: hidden;padding-top: calc(0.6 * var(--section-py));} .process-info .panelwrap .panel{background-color: transparent;position: relative;width: 17.5vw;width: 320px;} .process-info .single-process img{max-width: 64px;display: block;margin: 0px auto 24px;} .process-info .single-process h4{font-size: 17px;font-weight: 600;text-transform: capitalize;color: #0066b4;margin-bottom: 0;} .process-info .single-process{width: 100%;max-width: 180px;display: flex;align-items: center;justify-content: center;flex-direction: column;border-radius: 16px;position: relative;padding: 32px 12px;background: #FFFFFF;box-shadow: 0 10px 30px 0 rgb(0 0 0 / 5%);} .process-info .panelwrap .panel:after{position: absolute;content: "";top: 50%;-webkit-transform: translateY(-50%) rotate(-30deg);transform: translateY(-50%) rotate(-30deg);left: 92%;width: 100%;max-width: 81px;aspect-ratio: 1/1;background: url(../sub-images/arrow-long.svg) no-repeat;background-size: contain;} .process-info .panelwrap .panel:last-child:after{display: none; } .progress-bar{margin: 4rem 0 0;width: 100%;height: 3px;background-color: #fff;position: relative;border-radius: 4px;} .progress-line{position: absolute;left: 0;height: 100%;background-color: #d2d0df;width: 100%;border-radius: 4px;} .qmanagement{--subtitle-color: #081f56;padding-top: calc(0.8 * var(--section-py));} .qmanagement .card{border-color: #e9e8f1;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);--bs-card-spacer-y: 28px;--bs-card-spacer-x: 28px;} .qmanagement .card h5{font-size: 22px;color: #444444;line-height: 1.32;margin-bottom: 14px;} .tinstrument .gallery{overflow: hidden;position: relative;z-index: 1; background: var(--tc-light);} .tinstrument .thumbs{padding: 0;} .tinstrument .thumbox>img{width: 100%; aspect-ratio: 4/3; object-fit: cover; } .certifbox{height: 100%;display: flex;flex-direction: column;padding: 0px 14px 20px;border-radius: 8px;background: #F3F2FA;background: linear-gradient(0deg,rgba(243, 242, 250, 1) 0%, rgba(255, 255, 255, 1) 100%);} .certifbox h5{font-size: 22px;color: #444444;line-height: 1.32;margin-bottom: 0;text-align: center;padding-top: 21px;} .certifbox>img{box-shadow: 0px -5px 14px rgb(0 0 0 / 7%);border-radius: 8px;margin-bottom: auto;} .sidenavbar{position: sticky;z-index: 0;top: 72px;margin-bottom: calc(-0.75 * var(--section-py));} .sidenavbar::before, .sidenavbar::after{content: '';position: absolute;z-index: -1;height: 100%;width: 36vw;background-color: var(--tc-light);right: 25%;top: 0;} .sidenavbar::after{background: url('../images/sectiongrid-b.svg') no-repeat;background-position: left center;background-size: cover;opacity: 0.8;} .sidenavbar .accordion{padding-top: 36px; padding-bottom: calc(0.75 * var(--section-py)); } .policy-list{background-color: #ffffff; box-shadow: 4px 7px 32px rgb(0 0 0 / 7%); padding: 9px 28px; border-radius: 8px; } .policy-list li{padding: 15px 4px 14px;position: relative;} .policy-list li + li{border-top: 1px solid #dfdfdf;} .policy-list li a{color: #444444; line-height: 1.4; display: block; font-weight: 500; font-size: 18px; } .policy-list li.active a, .policy-list li a:hover{color: #0066b4;} .policydesc h2, .policydesc h3{margin-bottom: 12px;margin-top: 27px;} .policypdf{max-width: 418px;width: 100%;padding-top: 42px;} .subpage .launched .card-body{padding: 24px;background: #f8f8fb;} .subpage .launched .cardpic img{height: auto; } .subpage .launched .card p{margin-bottom: 8px; } .subpage .launched .card h5{font-size: 27px;line-height: 1.4;margin-bottom: 4px;} .subpage .launched .creverse{--bs-gutter-y: 2rem; --bs-gutter-x: 2rem;} .subpage .launched .creverse div:nth-child(even) .card{flex-direction: column-reverse;} .flip-box{height: 100%;transform-style: preserve-3d;-webkit-transform-style: preserve-3d;perspective: 1500px;-webkit-perspective: 1500px;} .flip-box-front, .flip-box-back{height: 100%; transition: transform 0.7s cubic-bezier(.4,.2,.2,1); -webkit-transition: transform 0.7s cubic-bezier(.4,.2,.2,1); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .flip-box-front{-webkit-transform: rotateY(0deg); transform: rotateY(0deg); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; background-color: #ffffff; } .flip-box:hover .flip-box-front{-webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .flip-box-back{position: absolute;top: 0;left: 0;width: 100%;background-color: #e7e9f8;-webkit-transform: rotateY(180deg);transform: rotateY(180deg);-webkit-transform-style: preserve-3d;transform-style: preserve-3d;} .flip-box:hover .flip-box-back{-webkit-transform: rotateY(0deg); transform: rotateY(0deg); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .flip-box-back .innertext{position: absolute;left: 0;top: 50%;width: 100%;padding: 42px;max-height: 90%;overflow-y: auto;-webkit-perspective: inherit;perspective: inherit;z-index: 2;transform: translateY(-50%) translateZ(60px) scale(.96);-webkit-transform: translateY(-50%) translateZ(60px) scale(.96);} .innertext p{font-size: 18px; line-height: 1.5; } .themepagination{padding: calc(0.65 * var(--section-py)) 16px 0px; } .themepagination ul{margin: auto;padding: 5px 21px;max-width: fit-content;background: #F3F2FA;background: linear-gradient(90deg,rgba(255, 255, 255, 0) 0%, rgba(243, 242, 250, 1) 20%, rgba(243, 242, 250, 1) 80%, rgba(255, 255, 255, 0) 100%);} .themepagination ul li a{border: none;color: #081f56;font-weight: 600;font-size: 18px;padding: 8px 16px;border-radius: 4px;box-shadow: none !important;background: transparent;} .themepagination ul li:last-child a, .themepagination ul li:first-child a{font-size: 26px;padding: 0px 9px 4px;border-radius: 4px !important;} .themepagination ul li a:hover{background: #0066b4; color: #ffffff; } .themepagination ul li.active a{background: #0066b4; color: #ffffff; } .csrpics{padding-top: 48px;width: calc(50vw - 21px);} .csrpic{position: relative;overflow: hidden;display: block;border-radius: 8px;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .csrpic>img{width: 100%;object-fit: cover;-webkit-transition: all 1s ease;transition: all 1s ease;} .csrpic:hover img{-webkit-transform: scale(1.08) translateX(0);transform: scale(1.08) translateX(0);} .csrpic h5{position: absolute;bottom: -24px;left: 0;z-index: 2;width: 100%;opacity: 0;padding: 12px 16px;color: #ffffff;font-size: 21px;font-weight: 500;text-align: center;transition: all 250ms linear;} .csrpic:hover h5{bottom: 12px;opacity: 1;} .csrpic::after{content: "";right: 0;bottom: 0;width: 100%;height: 40%;z-index: 1;opacity: 0;position: absolute;background: linear-gradient(0deg, rgb(0 0 0 / 35%) 0%, rgba(0, 0, 0, 0) 100%);} .csrpic:hover:after{height: 100%;opacity: 1;} .sectionpic .csrpic{box-shadow: -2px -2px 32px 0 rgb(8 31 86 / 12%);} .csr .sectiongrid.bigrid{width: calc(100% - 52%); } .csrpics .csrpic>img{aspect-ratio: 296/287;} .applidetails{padding-top: calc(0.5 * var(--section-py));position: relative;z-index: 1;} .applidetails .sectionpic{top: 124px;width: 45vw;clear: both;overflow: hidden;position: sticky;border-radius: 0 18px 18px 0;background: var(--tc-light);} .applinner .subtitle h1{white-space: pre-line; } .navigation {width: 100%;z-index: 9; position: relative;} .navigation:not(.--jsfied) { overflow-x: auto; -webkit-overflow-scrolling: touch; } .navigation .dropdown-toggle::after, .navigation .nav__hidden{display: none; } .navigation .dropdown-toggle svg{width: 20px;height: 20px;fill: #ffffff;-webkit-transition: 0.25s;transition: 0.25s;} .navigation .dropdown-toggle.show svg{-webkit-transform: rotate(90deg); transform: rotate(90deg); } .navigation .dropdown-menu{--bs-position: end; } .navigation .nav__list__more{top: 5px !important;border-color: #dfdde9;padding: 4px 0px;box-shadow: 0px 7px 24px rgb(0 0 0 / 7%);} .navigation .nav__list__more li{border-bottom: solid 1px #dfdde9; } .navigation .nav__list__more li>a{font-size: 16px;color: #444444;border-radius: 0;padding: 8px 16px;white-space: nowrap;} .themetab{padding: 7px;border-radius: 32px;background: #081f56;border: solid 1px rgb(8 31 86 / 20%);box-shadow: 0 0px 32px 0 rgb(0 0 0 / 10%);} .themetab .nav-link{color: #e9ebfa;font-weight: 500;font-size: 16px;padding: 8px 12px;border-radius: 24px;transition: all .7s linear;} .themetab .dropdown-toggle:hover{background: #ffffff;} .themetab .dropdown-toggle:hover svg{fill: #081f56;} .themetab .tablist-slider{bottom: 0; z-index: -1; width: 30px; height: 100%; display: inline-block; border-radius: 24px; position: absolute; background: #ffffff; transition: all .4s linear; } .themetab .nav-link.active{color: #081f56;background: transparent !important;box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .032);} .fbusiness{padding: 16px;background: #fff;border-radius: 12px;border: solid 1px #f0f0ff;box-shadow: -5px 0px 30px 0px rgba(0, 0, 0, 0.04);} .fbusiness h4 small{display: block; font-size: .8em; margin-top: 4px;} .fbusiness .factorypic{width: 100%;border-radius: 8px;overflow: hidden;position: relative;} .factorypic .splittext{left: 0;bottom: 0;z-index: 2;color: #081f56;font-weight: 600;position: absolute;background: #ffffff;padding: 8px 14px 2px 2px;border-top-right-radius: 12px;font-size: calc(var(--subtitle-font-size) - 25%);} .differentiator .text-animated h4 span,.differentiator .text-animated h4 strong{display: inline-block;color: #444444;font-weight: 500;font-size: var(--subtitle-font-size);} .piechart, .piechart svg{position: relative; z-index: 1; } .piechart svg {width: 100%;max-width: 720px;aspect-ratio: 1/1;} .piechart::after{content: "";position: absolute;width: 2px;height: 45%;background: #fff;z-index: 1;top: 5%;left: calc(50% - 1px);} .piechart .piece-1{transform: scale(1.1);transform-origin: center;} .piechart #topCirclePath{transform: scale(1.12);transform-origin: center;} .piechart .piecounter{position: absolute;top: 56%;left: 50%;transform: translate(-50%, -50%);font-size: calc(var(--subtitle-font-size) + 50%);font-weight: 700;color: #444444;z-index: 2;mix-blend-mode: plus-lighter;} .globalmap{position: sticky;top: 148px;z-index: 1;display: flex;justify-content: end;} .globalmap svg{width: 100%;height: auto;display: block;flex-shrink: 0;filter: drop-shadow(0px 0px 32px rgb(0 0 0 / 5%));} .globalmap .land {fill: #F3F2FA;stroke: rgb(156 168 182 / 56%);stroke-width: 1;outline: none;cursor: pointer;scroll-margin-top: 168px;-webkit-transition: all 250ms linear;-o-transition: all 250ms linear;transition: all 250ms linear;} .globalmap .seleted{fill: #081f56;} .globalmap .land.active, .globalmap .land:hover,.globalmap .land:focus {fill: #0066b4;stroke: #0066b4;} .globalmap path#IN {fill: #FF671F;stroke: #FF671F;} .worldwide li a{font-weight: 500; } .worldwide li a.active{color: #0791CB; } .worldwide ul{display: grid;column-gap: 24px;grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));} .custom-tooltip{--bs-tooltip-bg: #ffffff; --bs-tooltip-color: #081f56; --bs-tooltip-opacity:1; --bs-tooltip-zindex:11; box-shadow: 0px 4px 21px 0px rgba(0, 0, 0, 0.16); font-weight: 500;} /* privacy policy */ .privacy-policy h5{ color: var(--subtitle-color); } /* ======== 29-07-2025 ======== */ .creverse .col-lg-4:nth-child(-n+3) .flip-box .flip-box-front .card .card-body { background-color: #0066B4; } .creverse .col-lg-4:nth-child(-n+3) .flip-box .flip-box-front .card .card-body p, .creverse .col-lg-4:nth-child(-n+3) .flip-box .flip-box-front .card .card-body h5{ color: #fff; } .creverse .col-lg-4:nth-child(-n+3) .flip-box .flip-box-back{ background-color: #0066B4; } .creverse .col-lg-4:nth-child(-n+3) .flip-box .flip-box-back .innertext p{ color: #fff;} /* career page */ .join-team .join-team-inr{ padding-bottom: 150px; } .career-form { background: rgb(255 255 255); padding: 65px 55px 60px 55px; margin-left: auto; margin-right: auto; width: 86%; outline: 10px solid rgb(0 0 0 / 10%); outline-offset: 20px; position: relative; z-index: 1; box-shadow: 0px 0px 40px -4px rgb(0 0 0 / 12%); margin-top: -200px; max-width: 1050px; } .callmail{gap: 12px;margin-top: 20px;display: grid;grid-template-columns: 1fr 1fr;} .callmail li img{width: 18px;filter: contrast(0.25) grayscale(1);} .callmail li a{display: block;text-align: center;padding: 8px 16px;border-radius: 24px;border: solid 1px #ebebf4;} .callmail li a:hover{background: #081f56;color: #ffffff;border-color: #081f56;} .callmail li a:hover>img{filter: contrast(1) grayscale(0);} .callmail li:first-child img{margin-top: -2px;width: 19px;} .form-floating span > .form-control-plaintext:focus, .form-floating span > .form-control-plaintext:not(:placeholder-shown), .form-floating span > .form-control:focus, .form-floating span > .form-control:not(:placeholder-shown) { padding-top: 1.625rem; padding-bottom: .625rem; } .form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control:focus ~ label::after, .form-floating > .form-select ~ label::after, .form-floating.active label::after { background-color: var(--clr-blue); } .form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-select ~ label, .form-floating.active label { transform: scale(.85) translateY(-.5rem) translateX(.15rem); } .form-floating span > .form-control, .form-floating span > .form-control-plaintext, .form-floating span > .form-select { height: calc(3.5rem + calc(var(--bs-border-width) * 2)); min-height: calc(3.5rem + calc(var(--bs-border-width) * 2)); line-height: 1.25; } /*.form-floating span > .form-control, .form-floating span > .form-control-plaintext { padding: 1rem .75rem; }*/ .privacy-policy .subtitle h4{margin: 24px 0px 8px;} .privacy-policy .subtitle h4:first-child{margin-top: 0px; } .privacy-policy .subtitle h4 strong{font-size: 105%;color: #333;} .privacy-policy p a, .privacy-policy .themelist li a{color: #0066B4; } .themelist li ul{margin-top: 9px;} .themelist li ul li{padding-left: 18px;} .themelist li ul li:before{left: 0;width: 8px;background: #B0CFE8;box-shadow: none !important;}