a, abbr, acronym, address, applet, article, aside, audio, b, blockquote, big, body, button, center, canvas, caption, cite, code, command, datalist, dd, del, details, dfn, dl, div, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, keygen, label, legend, li, meter, nav, object, ol, output, p, pre, progress, q, s, samp, section, small, span, source, strike, strong, sub, sup, table, tbody, tfoot, thead, th, tr, tdvideo, tt, u, ul, var { background: transparent; border: 0 none; margin: 0; padding: 0; line-height: 16px; vertical-align: baseline; outline: none; font-size: 100%; font-family: inherit; font-weight: normal; font-style: normal } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block } blockquote, q { quotes: none } blockquote:before, q:before { content: ''; content: none } blockquote:after, q:after { content: ''; content: none } ins { text-decoration: none } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help } table { border-collapse: collapse; border-spacing: 0 } hr { display: block; height: 1px; border: 0; border-top: 1px solid #606060; margin: 12px 0 20px; padding: 0; width: 100%; float: left } input, select, textarea { vertical-align: middle; margin: 0; font-family: 'Josefin Sans', sans-serif; font-weight: 400 } ol, ul, li { list-style: none } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% } html { -ms-content-zooming: none; -ms-touch-action: pan-x pan-y } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: rgba(255, 255, 255, 0) } ::-moz-selection { background-color: #fe6571; color: #FFF } ::selection { background-color: #fe6571; color: #FFF } .clearfix:before, .clearfix:after { content: ""; display: table } .clearfix:after { clear: both } .clearfix { clear: both } body { color: #000; font-family: 'Josefin Sans', sans-serif; font-size: 16px; font-weight: 400; line-height: normal; overflow-x: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } /* body::-webkit-scrollbar{ display:none; } :focus{ outline:0 none } */ a { text-decoration: none; color: #0072C6; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s; font-family: 'Josefin Sans', sans-serif } a:hover { text-decoration: none !important; color: #000; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } @supports (-ms-ime-align:auto) { :focus, a, a:hover { transition: none; -moz-transition: none; -webkit-transition: none; -o-transition: none } } h1, h2, h3, h4, h5, h6 { font-weight: 400; line-height: normal; font-family: 'Josefin Sans', sans-serif; font-weight: 700; color: #000; font-size: 32px } p { font-size: 16px; line-height: 22px; padding: 0 0 15px; font-family: 'Josefin Sans', sans-serif } strong { font-family: 'Josefin Sans', sans-serif; font-weight: 700 } em { font-style: italic } img { max-width: 100% } ::-webkit-input-placeholder { color: #666 } :-moz-placeholder { color: #666 } ::-moz-placeholder { color: #666 } :-ms-input-placeholder { color: #666 } .clear { clear: both } .floatL { float: left } .floatR { float: right } .full-width { float: left; width: 100% } .hide { display: none !important } .img-responsive { max-width: 100%; height: auto } .btn { display: inline-block; font-size: 16px; color: #FFF; line-height: 55px; text-transform: uppercase; padding: 0 35px; background: #0072C6; float: left; font-weight: 600; font-family: 'Josefin Sans', sans-serif; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; cursor: pointer; border: 0; position: relative } .btn:hover { background: #000; color: #FFF } .btn:before { content: ""; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 100%; height: 100%; background: rgb(0 114 198 / 15%); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; animation: pulse-border 1500ms ease-out infinite } .btn:after { content: ""; position: absolute; z-index: 1; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); display: block; width: 100%; height: 100%; background: transparent; border-radius: 5px; transition: all 200ms } @font-face { font-family: 'Brittany Signature'; src: url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/BrittanySignatureRegular.eot'); src: url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/BrittanySignatureRegular.eot?#iefix') format('embedded-opentype'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/BrittanySignatureRegular.woff2') format('woff2'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/BrittanySignatureRegular.woff') format('woff'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/BrittanySignatureRegular.ttf') format('truetype'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/BrittanySignatureRegular.svg#BrittanySignatureRegular') format('svg'); font-weight: normal; font-style: normal; font-display: swap } @font-face { font-family: 'Futura PT'; src: url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/FuturaPT-Heavy.eot'); src: url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/FuturaPT-Heavy.eot?#iefix') format('embedded-opentype'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/FuturaPT-Heavy.woff2') format('woff2'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/FuturaPT-Heavy.woff') format('woff'), url('https://d1qa1ziodjk9pt.cloudfront.net/fonts/FuturaPT-Heavy.ttf') format('truetype'); font-weight: 900; font-style: normal; font-display: swap } @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap'); @font-face { font-family: 'Ginora_Light'; src: url('../fonts/GinoraSans-Light.eot'); src: url('../fonts/GinoraSans-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/GinoraSans-Light.woff2') format('woff2'), url('../fonts/GinoraSans-Light.woff') format('woff'), url('../fonts/GinoraSans-Light.ttf') format('truetype'), url('../fonts/GinoraSans-Light.svg#GinoraSans-Light') format('svg'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Ginora_Regular'; src: url('../fonts/GinoraSans-Regular.eot'); src: url('../fonts/GinoraSans-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/GinoraSans-Regular.woff2') format('woff2'), url('../fonts/GinoraSans-Regular.woff') format('woff'), url('../fonts/GinoraSans-Regular.ttf') format('truetype'), url('../fonts/GinoraSans-Regular.svg#GinoraSans-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Ginora_Semi_Bold'; src: url('../fonts/GinoraSans-SemiBold.eot'); src: url('../fonts/GinoraSans-SemiBold.eot?#iefix') format('embedded-opentype'), url('../fonts/GinoraSans-SemiBold.woff2') format('woff2'), url('../fonts/GinoraSans-SemiBold.woff') format('woff'), url('../fonts/GinoraSans-SemiBold.ttf') format('truetype'), url('../fonts/GinoraSans-SemiBold.svg#GinoraSans-SemiBold') format('svg'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Ginora_Bold'; src: url('../fonts/GinoraSans-Bold.eot'); src: url('../fonts/GinoraSans-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/GinoraSans-Bold.woff2') format('woff2'), url('../fonts/GinoraSans-Bold.woff') format('woff'), url('../fonts/GinoraSans-Bold.ttf') format('truetype'), url('../fonts/GinoraSans-Bold.svg#GinoraSans-Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'gilroy-regular'; src: url('../fonts/Gilroy-Regular.otf'); src: url('../fonts/Gilroy-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Gilroy-Regular.woff2') format('woff2'), url('../fonts/Gilroy-Regular.woff') format('woff'), } @font-face { font-family: 'Gilroy-Medium'; src: url('../fonts/Gilroy-Medium.otf'); src: url('../fonts/Gilroy-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Gilroy-Medium.woff2') format('woff2'), url('../fonts/Gilroy-Medium.woff') format('woff'), } @font-face { font-family: 'Gilroy-SemiBold'; src: url('../fonts/Gilroy-SemiBold.otf'); src: url('../fonts/Gilroy-SemiBold.eot?#iefix') format('embedded-opentype'), url('../fonts/Gilroy-SemiBold.woff2') format('woff2'), url('../fonts/Gilroy-SemiBold.woff') format('woff'), } @font-face { font-family: 'ClashDisplay-Semibold'; src: url('../fonts/ClashDisplay-Semibold.woff2') format('woff2'), url('../fonts/ClashDisplay-Semibold.woff') format('woff'); font-weight: 600; font-display: swap; font-style: normal; } @font-face { font-family: 'Brittany Signature'; src: url('../fonts/BrittanySignatureRegular.woff2') format('woff2'), url('../fonts/BrittanySignatureRegular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'ClashDisplay-Variable'; src: url('../fonts/ClashDisplay-Variable.woff2') format('woff2'), url('../fonts/ClashDisplay-Variable.woff') format('woff'); font-weight: 200 700; font-display: swap; font-style: normal; } @font-face { font-family: 'ClashDisplay-Extralight'; src: url('../fonts/ClashDisplay-Extralight.woff2') format('woff2'), url('../fonts/ClashDisplay-Extralight.woff') format('woff'); font-weight: 200; font-display: swap; font-style: normal; } @font-face { font-family: 'ClashDisplay-Light'; src: url('../fonts/ClashDisplay-Light.woff2') format('woff2'), url('../fonts/ClashDisplay-Light.woff') format('woff'); font-weight: 300; font-display: swap; font-style: normal; } @font-face { font-family: 'ClashDisplay-Regular'; src: url('../fonts/ClashDisplay-Regular.woff2') format('woff2'), url('../fonts/ClashDisplay-Regular.woff') format('woff'); font-weight: 400; font-display: swap; font-style: normal; } @font-face { font-family: 'ClashDisplay-Medium'; src: url('../fonts/ClashDisplay-Medium.woff2') format('woff2'), url('../fonts/ClashDisplay-Medium.woff') format('woff'); font-weight: 500; font-display: swap; font-style: normal; } @font-face { font-family: 'Mundial Demibold'; src: url('../fonts/Mundial-Demibold.woff2') format('woff2'), url('../fonts/Mundial-Demibold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; } @font-face { font-family: 'Formula Condensed Bold'; src: url('../fonts/FormulaCondensed-Bold.woff2') format('woff2'), url('../fonts/FormulaCondensed-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Josefin Sans Bold'; src: url('../fonts/JosefinSans-Bold.woff2') format('woff2'), url('../fonts/JosefinSans-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } ::-webkit-scrollbar { width: 7px; background: transparent } ::-webkit-scrollbar-thumb { background: #fe6571; border-radius: calc(15px / 2) } ::-webkit-scrollbar-thumb:hover { background: #fe6571 } ::-webkit-scrollbar-thumb:active { background: #fe6571 } .changeCursor::-webkit-scrollbar { width: 7px; background: #141414; transition: 0s } .changeCursor::-webkit-scrollbar-thumb { background: #141414; border-radius: calc(15px / 2); transition: 0s } .changeCursor::-webkit-scrollbar-thumb:hover { background: #141414; transition: 0s } .changeCursor::-webkit-scrollbar-thumb:active { background: #141414; transition: 0s } .body.changeCursor { overflow: hidden } .wrapper { width: 100%; float: left; position: relative; overflow: hidden } .container { width: 100%; margin: 0 auto; display: block; padding-right: 5%; padding-left: 5% } @media (max-width:1200px) { .container { padding-right: 15px; padding-left: 15px } .greatplace img { width: 3.7em; } .greatplace { padding-bottom: 16px; } } .row { display: flex; flex-direction: row; margin: 0 -15px; } .col-25 { max-width: 25%; flex: 25%; padding: 0 15px; } .col-33 { max-width: 33.33%; flex: 33.33%; } .col-50 { max-width: 50%; flex: 50%; padding: 0 15px; } .col-75 { max-width: 75%; flex: 75%; padding: 0 15px; } .col-100 { max-width: 100%; flex: 100%; padding: 0 15px; } .home-page #particles-js { z-index: 11 } #particles-js { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; z-index: 11 } #particles-js-second { position: fixed; top: 100%; left: 0; right: 0; bottom: 0; width: 100%; z-index: 22 } .greatplace { padding-bottom: 64px; } .section1 { float: left; width: 100%; height: 100vh; position: relative } .section1 .header .default-button, .section1 .header .logo { transition: 0.5s } .section1 .header { padding: 35px 0; position: fixed; z-index: 111; min-height: 160px; display: flex; justify-content: center; align-items: center; width: 100%; font-family: 'Josefin Sans', sans-serif } .section1 .header .fishleft:hover svg { transform: scale(1.2); transition: opacity 0.25s ease; transition: 0.5s } .section1 .header .fishleft { float: left; max-width: 30px; padding: 29px 0 0; transition: opacity 0.25s ease; transition: 0.5s; position: relative; z-index: 1 } .section1 .header .fishleft img { float: left; width: 100% } .section1 .header .texttypo { padding: 0 0 0 50px; margin: -27px 0 0 0; max-width: 380px; display: flex; position: fixed } .section1 .header .texttypo p { padding: 0; text-transform: uppercase; line-height: 30px; font-size: 14px; letter-spacing: 2.5px; font-weight: 600 } .section1 .header .texttypo p span { color: #fe6571; font-weight: 600 } .about_banner .texttypo .Typewriter__cursor { font-weight: 100 !important; position: relative; top: -10px } .about-us #tetimonial button.owl-dot { border-color: #141414; } .about-us #tetimonial button.owl-dot.active span { background: #141414; } .section1 .header .texttypo p span.Typewriter__cursor { margin: 5px 0 0 2px; float: right } .header .logo { display: block; margin: 0 auto; max-width: 225px; padding-right: 0; position: relative; top: 13px; text-align: center } .header .container, .humberger-toggle-menu { max-width: 1680px; padding-right: 15px; padding-left: 15px; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .sticky-header .logo { visibility: hidden; opacity: 0; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out } /* .section1 .header .default-button.btn_hiring{visibility:visible !important;opacity:1 !important;margin: -10px 80px -15px 0 !important;} */ .header.sticky-header .logo, .header.sticky-header .default-button { display: none } .section1 .header .left_icon { padding: 29px 30px 0 0; display: flex; justify-content: flex-end } .section1 .header .left_icon img { float: left; width: 100px } .section1 .header .default-button { float: right; margin: 22px 190px 0 0; letter-spacing: 2.6px; font-size: 14px; padding: 20px 0 20px 0 } .section1 .banner_caption { width: 100%; position: absolute; top: 60%; left: 50%; transform: translate(-50%, 390%); text-align: center; z-index: 99 } .anchor-tag-btn { display: inline-block !important } .anchor-tag-btn .text { padding-top: 18px !important } .section1 .banner_caption h2 { font-size: 100px; line-height: 1.6; text-transform: uppercase; margin: 0 0 40px } .section1 .banner_caption .default-button { letter-spacing: 2px; font-size: 14px } @media screen and (max-width:1200px) { .section1 .banner_caption h2 { font-size: 70px } } /* Home Mobile particle slider */ @media screen and (max-width:767px) { /* 28-02 madhvi */ #home-mobile-slider.owl-carousel .owl-animated-in { /* opacity: 0; display: none; */ /* z-index: 0; */ } #home-mobile-slider.owl-carousel .owl-animated-out { /* opacity: 1; display: block; */ /* z-index: 1; */ } #home-mobile-slider .owl-carousel .owl-item.active img { opacity: 1; } #home-mobile-slider .owl-carousel .owl-item img { opacity: 0; } /* end */ .mobile-particle-slider { height: calc(100vh - 88px); position: relative; z-index: 11 } #home-mobile-slider { height: calc(100vh - 88px - 88px); display: flex; align-items: center; position: relative } #home-mobile-slider::before, #home-mobile-slider::after { content: ""; width: 1px; background-color: #fe6571; position: absolute; min-height: 230px } /* a.btn_hiring{position: fixed;right: 0;align-items: center;pointer-events: none;margin: -7px 10px 0 0!important; float: right;background-color: #e0effd;} */ /* a.btn_hiring{margin:auto 0px !important; background: #e0effd;border-radius: 0;color: #232323;display: inline-block;font-size: 1rem;height: 50px;line-height: 50px;position: fixed;right: 0;text-align: center;text-decoration: none;text-transform: uppercase;-moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-o-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform-origin: bottom right;width: 150px;} */ #home-mobile-slider::before { left: 0; bottom: -13vh; transform: rotate(40deg) } #home-mobile-slider::after { right: 0; top: -13vh; transform: rotate(40deg) } .mobile-slider-button { text-align: center } #home-mobile-slider>.item:first-child { display: flex; align-items: center; justify-content: center } #home-mobile-slider>.item:first-child img { height: 156px } #home-mobile-slider>.item { width: 100%; display: none; text-align: center } #home-mobile-slider.owl-carousel .owl-item img { width: auto; text-align: center; margin: 0 auto; max-width: 260px } } .default-button { text-transform: uppercase; position: relative; height: 48px; --button-duration: .45s; cursor: pointer; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); font-weight: 400; letter-spacing: 2.5px; border: 0 } .default-button .button-background .left, .default-button .button-background .right { position: absolute; left: 0; top: 0; width: 48px; height: 100%; z-index: 1; display: flex; justify-content: flex-end; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0) } .default-button .button-background .left:before, .default-button .button-background .right:before { content: ""; width: 48px; display: block; height: 48px; border-radius: 50%; background-color: var(--color-sub-white-1); -webkit-transform: scale(0); transform: scale(0); transition: -webkit-transform .45s var(--primary-ease); transition: transform .45s var(--primary-ease); transition: transform .45s var(--primary-ease), -webkit-transform .45s var(--primary-ease) } .default-button .button-background .center { position: absolute; left: 0; right: 0; top: 0; width: 0; height: 100%; background-color: var(--color-sub-white-1); z-index: 1; -webkit-transform-origin: right; transform-origin: right; transition: width .45s var(--primary-ease) .45s, -webkit-transform .45s var(--primary-ease); transition: width .45s var(--primary-ease) .45s, transform .45s var(--primary-ease); transition: width .45s var(--primary-ease) .45s, transform .45s var(--primary-ease), -webkit-transform .45s var(--primary-ease) } .default-button .button-background .left { transition: all .45s var(--primary-ease) } .default-button .button-background .right { transition: all .45s var(--primary-ease) .45s } @media screen and (min-width:769px) { .default-button:hover .left { -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); width: 100%; transition-duration: calc(.45s - .15s); transition-timing-function: var(--custom-ease-3); transition-delay: .45s } .default-button:hover .center { width: 100%; -webkit-transform: scaleX(0); transform: scaleX(0); transition: width .45s var(--primary-ease), -webkit-transform calc(.45s - .15s) var(--custom-ease-3) .45s; transition: width .45s var(--primary-ease), transform calc(.45s - .15s) var(--custom-ease-3) .45s; transition: width .45s var(--primary-ease), transform calc(.45s - .15s) var(--custom-ease-3) .45s, -webkit-transform calc(.45s - .15s) var(--custom-ease-3) .45s } .default-button:hover .right { -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); width: 100%; transition-delay: 0s } } .default-button .text { display: inline-block; position: relative; z-index: 3; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); transition: all .75s var(--primary-ease); opacity: 0 } .default-button .plus-icon { position: relative; width: 7px; height: 7px; display: inline-block; margin-left: 28px; z-index: 2; opacity: 0; transition: opacity .85s var(--primary-ease) } .default-button .plus-icon:after, .default-button .plus-icon:before { content: ""; position: absolute; top: calc(50% - 2px); left: 0; width: 100%; height: 1px; background-color: #000 } .default-button .plus-icon:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: center; transform-origin: center } .default-button.theme-white { color: #000 } .default-button.theme-white .button-background .center, .default-button.theme-white .button-background .left:before, .default-button.theme-white .button-background .right:before { background-color: #e0effd } .about-us .black-theme-section .default-button.theme-white, .blog-listing .black-theme-section .default-button.theme-white, .blog-detail .black-theme-section .default-button.theme-white { color: #fff } .about-us .black-theme-section .button-background .center, .about-us .black-theme-section .button-background .left:before, .about-us .black-theme-section .button-background .right:before, .blog-listing .black-theme-section .button-background .center, .blog-listing .black-theme-section .button-background .left:before, .blog-listing .black-theme-section .button-background .right:before, .blog-detail .black-theme-section .button-background .center, .blog-detail .black-theme-section .button-background .left:before, .blog-detail .black-theme-section .button-background .right:before { background-color: #373737 } .btn-octa-gone .lab { position: relative; color: #141414 } .btn-octa-gone { width: 49px; height: 49px; background: #e0effd; position: relative; right: 0; left: 0; z-index: 99; display: flex; align-items: center; justify-content: center; font-size: 28px; border-radius: 50%; margin: 20px 0 0 0 } .default-button.theme-white .plus-icon:after, .default-button.theme-white .plus-icon:before { background-color: #141414 } .default-button.animate .left:before, .default-button.animate .right:before { -webkit-transform: scale(1); transform: scale(1) } .default-button.animate .text { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1; font-size: 14px; padding-top: 4px; letter-spacing: 2.5px; font-weight: 400 } .default-button.animate .plus-icon { opacity: 1 } :root { --custom-ease-1: cubic-bezier(0.475, 0.425, 0, 0.995); --custom-ease-2: cubic-bezier(0.835, -0.005, 0.06, 1); --custom-ease-3: cubic-bezier(0.19, 1, 0.22, 1); --custom-ease-4: cubic-bezier(0.63, 0.03, 0.21, 1); --primary-ease: var(--custom-ease-1) } .section2 { float: left; width: 100%; height: 100vh; /* background:url(https://d1qa1ziodjk9pt.cloudfront.net/images/main_bg.jpg) no-repeat;*/ background-size: cover; position: relative } .section2 .header { padding: 0; position: relative; z-index: 100; min-height: 160px; display: flex; justify-content: center; align-items: center } .section2 .header .fishleft { float: left; max-width: 30px } .section2 .header .fishleft img { float: left; width: 100% } .section2 .header .left_icon { float: right; max-width: 30px } .section2 .header .left_icon img { float: left; width: 100px } .section2 .botom_left { position: absolute; left: 2%; bottom: 80px; transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg) } .section2 .botom_left p { font-size: 14px; color: #FFF; font-weight: 300; text-transform: uppercase; letter-spacing: 1.5px } .section2 .banner_caption { width: 100%; position: absolute; top: 60%; left: 50%; transform: translate(-50%, -50%); text-align: center } .section2 .banner_caption h1 { font-size: 100px; line-height: 1.6; text-transform: uppercase; margin: 0 0 140px; color: #FFF; letter-spacing: 6px } .section2 .banner_caption p { font-size: 24px; line-height: 1.6; color: #FFF; font-weight: 300; letter-spacing: 0.6px; padding: 0 } @media screen and (max-width:1200px) { .section2 .banner_caption h1 { font-size: 70px } } body { margin: 0; padding: 0; min-height: 10000px; position: relative; transition: all 1200ms ease-out } #particle-slider { width: 100%; position: absolute; top: 0; bottom: 0; margin: auto; z-index: 11 } .dg.ac { display: none } #particle-slider .draw { width: 100% } .line-wrap .rail.rail-1 { height: 580px } .line-wrap .rail.rail-1 span { background-color: #fc8088; width: 3px; height: 100vh; position: absolute } .text-center { text-align: center } .banner-section { position: relative } .our-purpose-section .content-width { max-width: 970px; margin: 0 auto; padding-left: 15px; padding-right: 15px } .our-purpose-section .content-width h1 { letter-spacing: 0; word-spacing: 0; font-weight: 300; margin-bottom: 36px } .our-purpose-section { padding: 100px 0; position: relative; display: flex; width: 100% } @media screen and (min-width:1024px) { .our-purpose-section { padding: 175px 0 245px 0 } } h6 { font-size: 14px; letter-spacing: 2.5px; color: #000000; font-weight: 600; line-height: 48px; text-transform: uppercase; padding-bottom: 33px; margin-bottom: 0 } h2 { font-weight: 300; font-size: 35px; line-height: 42px; margin-bottom: 30px } .our-purpose-section h1 span { color: #fe6571 } .our-purpose-section p { line-height: 36px; font-weight: 300; font-size: 24px; max-width: 900px; padding-bottom: 20px; letter-spacing: 1px } .our-purpose-section .default-button { margin-top: 60px } .bussiness-strategy-section { padding: 150px 0 210px 0; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; max-width: 100% !important; min-width: 100% !important } .bussiness-strategy-section .contant-width { width: 100%; float: left } .bussiness-strategy-section h6 { position: relative; z-index: 11; color: #fff; text-align: center; margin: calc(100vh - 1060px) 0 0 } .content-width { margin: 0 auto; max-width: 1400px; padding: 0 15px } .bussiness-strategy-section .content-width { max-width: 100%; margin: 0; padding-left: 15px; padding-right: 15px } .bussiness-strategy-section .bussiness-text h2 span { font-size: 72px; letter-spacing: 10px; line-height: 100px; color: #141414; font-weight: 700; text-transform: uppercase; max-width: 670px } .bussiness-strategy-section .scroller-img { width: 565px; height: 665px; margin: 0 auto; position: absolute; left: 0; right: 0; top: -90px; bottom: 0; text-align: center; z-index: 1 } .bussiness-strategy-section .bussiness-text h2 span:first-child { margin-right: 85px } .bussiness-strategy-section .bussiness-text h2 span:last-child { position: relative; z-index: 1 } .bussiness-strategy-section .slick-dots { bottom: auto; top: 50%; right: calc(100% - 1580px); max-width: 30px } .bussiness-strategy-section .slick-dots li { margin: 10px 5px } .bussiness-strategy-section .slick-dots li button:before { font-size: 12px } .bussiness-text { position: relative; display: flex; justify-content: space-evenly; min-height: 510px; align-items: center } .bussiness-text .strategy-text { position: relative } .bussiness-desc { max-width: 470px; margin-left: auto; margin-right: 310px; margin-top: -150px; background-color: transparent; position: relative; z-index: 3 } .bussiness-desc p, .mutual-firm-work p { line-height: 36px; font-weight: 300; font-size: 24px; max-width: 740px; padding-bottom: 30px; min-height: 120px; letter-spacing: 0.50px } .bussiness-desc button { margin-top: 20px } .bussiness-scroller h6 { padding-bottom: 0 } .bussiness-scroller .pin-spacer { width: 100% !important; padding: 0 !important } .bussiness-scroller { background-color: #141414; float: left } /* bussiness-strategy-section-mobile */ .bussiness-strategy-section-mobile { background-color: #141414; padding: 60px 0; height: 100vh } .bussiness-strategy-section-mobile h6 { color: #fff } #home-service-mobile { position: relative } .bussiness-strategy-section-mobile .bussiness-scroller .owl-carousel .owl-item img { width: 100%; max-width: 100%; height: 40vh; object-fit: cover; object-position: center; opacity: 50% } .bussiness-strategy-section-mobile .bussiness-scroller .carousel-caption { margin: -9vh 30px 0; position: relative; z-index: 1 } .bussiness-strategy-section-mobile .bussiness-scroller .carousel-caption h2 { font-size: 36px; margin: 0; padding: 0 0 30px 0; line-height: 48px; color: #fff; font-weight: 600 } .bussiness-strategy-section-mobile .bussiness-scroller .carousel-caption p { color: #fff; padding-bottom: 60px; line-height: 26px } .bussiness-strategy-section-mobile .bussiness-scroller .owl-nav { position: absolute; right: 30px; top: 50px } .bussiness-strategy-section-mobile .bussiness-scroller .owl-nav button { width: 6vw; height: 6vw; margin: 0 1rem; background-color: #141414; color: #fff; border-radius: 50px; font-size: 5vw } .bussiness-strategy-section-mobile .bussiness-scroller { position: relative; z-index: 11; float: left; width: 100% } .bussiness-strategy-section-mobile .default-button.theme-white { color: #fff } .bussiness-strategy-section-mobile .default-button.theme-white .button-background .center, .bussiness-strategy-section-mobile .default-button.theme-white .button-background .left:before, .bussiness-strategy-section-mobile .default-button.theme-white .button-background .right:before { background-color: #373737 } .bussiness-strategy-section-mobile .owl-dots { position: absolute; top: 30px; right: 20px } .bussiness-strategy-section-mobile .owl-carousel button.owl-dot.active { background: transparent; border: 2px solid #fff; border-radius: 50%; height: 15px; width: 15px; margin: 0 10px; position: relative; opacity: 1 } .bussiness-strategy-section-mobile .owl-carousel button.owl-dot.active span { background: #fff; height: 5px; width: 5px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border-radius: 50% } .bussiness-strategy-section-mobile .owl-carousel .owl-nav button.owl-next, .bussiness-strategy-section-mobile .owl-carousel .owl-nav button.owl-prev, .bussiness-strategy-section-mobile .owl-carousel button.owl-dot { background: transparent; border: 2px solid #fff; border-radius: 50%; height: 15px; width: 15px; margin: 0 10px; position: relative; opacity: 50% } .bussiness-strategy-section-mobile .default-button.theme-white .plus-icon:after, .bussiness-strategy-section-mobile .default-button.theme-white .plus-icon:before { background-color: #fff } .parallax-sliding { padding: 110px 0 } .mutual-firm-work { padding: 200px 0 200px 0; } .mutual-firm-work.mutual-firm-work-one { padding: 0 0 150px 0 } .mutual-firm-work img { max-width: 100% } .mutual-firm-work .content-width { max-width: 1365px; margin: 0 auto; padding-left: 15px; padding-right: 15px } .mutual-firm-work .custom-row { display: flex; flex-direction: row; align-items: center } .mutual-firm-work .custom-row .column-50 { max-width: 50%; flex: 50%; padding: 0 15px } .switch-sticky { position: fixed; width: 100% } .site-footer-black-theme { background-color: #141414; transition: 1s } .site-footer { padding: 130px 0 40px 0; display: block; width: 100%; transition: 1s; background-color: #141414 } .site-footer .content-width { max-width: calc(100vw / 2 + 860px / 1.5); margin: 0 auto; padding-left: 15px; padding-right: 15px; position: relative } .site-footer .custom-row { display: flex; flex-direction: row } .site-footer .custom-row .column-50 { max-width: 50%; flex: 50% } .site-footer .social-menu { display: flex; align-items: baseline; margin: 120px 0 0 } .site-footer .social-menu li { margin: 0 7px } .site-footer .social-menu li a { font-size: 23px; color: #5b5b5b } /* 27-02 madhvi */ .partner_logo_section.partner_logo_section_bg.remove-sp { padding-bottom: 0 !important; } .splide--rtl { direction: rtl; } .marquee__group .splide__track { overflow: visible; } .meet-our-client .splide__track { overflow: visible; } .site-footer .social-menu li a .f-twitter path { fill: #5b5b5b; } .site-footer .social-menu li a:hover .f-twitter path { fill: #fff; } .footer-css .site-footer .social-menu li a:hover .twitter-x.w-twitter path, .footer-css .site-footer .social-menu li a:hover .thread-ic.w-twitter path { fill: #000; opacity: 1; } .footer-css .site-footer .social-menu li a .twitter-x.w-twitter path, .footer-css .site-footer .social-menu li a .thread-ic.f-twitter path { fill: #5b5b5b !important; } .overlay-menu .menu-location #tabs ul li.active .tab { color: #fff !important; opacity: 1; } /* end */ .site-footer ul li a:hover { color: #fff !important } .site-footer h3 { margin-top: 40px; font-weight: 300; color: #fff; font-size: 32px } .site-footer .get-in-touch h3, .site-footer .location h3 { color: #fff; margin-top: 25px; margin-bottom: 8px; font-weight: 400; font-size: 14px; text-transform: uppercase; letter-spacing: 3px; line-height: 36px } .site-footer .texttypo { margin-top: 30px; margin-bottom: 20px; color: #fd6571 } .site-footer .texttypo p { font-size: 36px; font-weight: 600 } .site-footer .custom-row .column-50 { max-width: 33%; flex: 33%; } .greatplace-footer img { width: auto; } .media-custom { display: none; } .greatplace-footer { display: flex; align-items: end; text-align: right; justify-content: center; } .get-in-touch a { display: block; margin-bottom: 20px; color: #ffffff61; font-size: 24px; font-weight: 300; line-height: 36px } .get-in-touch a i { color: #fff; font-size: 18px } .tabs { display: flex; flex-wrap: wrap } .tabs li { margin: 0 40px 0 0; padding: 0; cursor: pointer } .contact-us-form-inner .tabs li { margin: 0 15px 0 } .contact-us-form-inner .tabs li.resp-tab-active span { border-bottom: 2px solid #141414; padding-top: 5px; display: inline-block } .get-in-touch { margin-bottom: 30px } .tab-content { display: none } .tab-content.active { display: block !important } .tab-link { color: #ffffff61; text-transform: uppercase; letter-spacing: 3px; position: relative; font-size: 14px } .site-footer .tab-link { color: #ffffff61 } body .site-footer .tab-link.active:hover+.tab-content { display: block !important } .tab-link::after { content: ""; background-color: #494949; width: 5px; height: 5px; border-radius: 50%; position: absolute; top: 0; bottom: 0; right: 0; margin: auto } .tab-link:last-child:after { display: none } .tab-link.active { color: #fff } .site-footer .tab-link.active a { color: #fff } .site-footer .tab-link a { color: #ffffff61 } .site-footer .footer-menu a img { max-width: 180px } .tab-content { color: #fff } .content-wrapper { margin-top: 20px } .tab-content a { color: #6d6d6d; font-size: 18px; max-width: 380px; line-height: 28px } .copyright-text1 { float: right; color: #FFFFFF4D; width: 50%; text-transform: uppercase; font-size: 14px; letter-spacing: 2px; line-height: 30px; font-weight: 300; padding: 18px 0 0 } .copyright-text1 a { color: #fff; opacity: 30%; margin: 0 5px; font-weight: 300 } .copyright-text1 a:hover { opacity: 1 } .copyright-text { display: flex; flex-wrap: wrap; align-items: center; color: #ffffff61; text-transform: uppercase; font-size: 14px; letter-spacing: 3px; line-height: 30px; font-weight: 300; max-width: 840px } .copyright-text p, .copyright-text a { font-weight: 300; font-size: 14px; margin: 0 } .footer-css .copyright-text, .footer-css .copyright-text1 { color: #000; opacity: 50% } .footer-css .copyright-text1 { opacity: 100% } .footer-css .copyright-text1 a { opacity: 0.7; color: #000 } .footer-css .copyright-text1 a:hover { opacity: 1 } .copyright-text a { color: #fff; opacity: 0.6; margin: 0 0 } .copyright-text a:hover { opacity: 1 } .copyright { padding-top: 200px; position: relative } .copyright img { position: absolute; left: -90px; bottom: 0 } .color-black { background-color: #141414 } .footer-css .black-theme-section { background-color: #141414 } .section[data-bg="black"] { background-color: #141414 } .black-theme-section { background-color: #141414; padding: 160px 0; transition: 0.5s } .black-theme-section-bg-black { background-color: #141414; transition: 0.5s } .our-purpose-section, .bussiness-strategy-section, .mutual-firm-work, .look-what-we-work-section, .black-theme-section, .our-thoughts-perspective, .site-footer { position: relative; /* z-index:11;*/ } .particle-js-up { position: relative; background: #fff; z-index: 22 } .mutual-firm-work, .our-thoughts-perspective { background-color: #fff } .mutual-firm-work-one { background-color: transparent !important; margin-top: 0 !important } .our-purpose-section .content-width, .bussiness-strategy-section .content-width, .mutual-firm-work .content-width, .look-what-we-work-section .content-width, .black-theme-section .content-width, .our-thoughts-perspective .content-width, .site-footer .content-width { position: relative; z-index: 99 } .black-theme-section .content-width { max-width: calc(100vw / 2 + 850px / 1.5); margin: 0 auto; padding-left: 15px; padding-right: 15px; position: relative } .why-with-uswork h6 { color: #fff; text-align: center } .why-with-uswork { text-align: center } .why-with-uswork .slide-item-sub { display: flex; align-items: center } .why-with-uswork .slide-item-sub span:nth-of-type(2) { margin-top: -10px } .why-with-uswork button { margin-top: 50px; color: #fff !important } .thousand-counter { display: flex; justify-content: center } .why-with-uswork .counter-wrapper { display: flex; flex-wrap: wrap; margin: 60px 0 30px 0 } .about-us .why-with-uswork .counter-wrapper { margin: 60px 0 60px 0 } .why-with-uswork .counter-wrapper .slide-item { display: flex; align-items: center; justify-content: center; max-width: 25%; flex: 25%; padding: 40px 20px 20px 20px; flex-direction: column; border-right: 2px solid #494949 } .why-with-uswork .counter-wrapper .slide-item:last-child { border-right: 0 !important } .why-with-uswork .counter-wrapper .slide-item span { font-size: 72px; letter-spacing: 2px; line-height: 24px; color: #fe6571; font-weight: 400; text-align: center; display: block; margin-bottom: 0; line-height: normal } .why-with-uswork .counter-wrapper .slide-item h5 { font-size: 14px; letter-spacing: 2.4px; line-height: 24px; color: #676767; font-weight: 400; text-align: center; text-transform: uppercase } .client-review-section { padding: 100px 0; text-align: center; position: relative; z-index: 99 } .client-review-section { max-width: 850px; margin: 70px auto; text-align: center; padding: 100px } .client-review-section .slick-slide img { display: inherit; margin-bottom: 30px } .client-review-section p { font-size: 25px; line-height: 40px; color: #ffffff; letter-spacing: 1px } .client-review-section h3 { font-size: 36px; line-height: 60px; color: #fe6571; text-align: center; font-family: 'Brittany Signature'; font-weight: 400 } .client-review-section span { font-size: 14px; letter-spacing: 2.5px; line-height: 36px; color: #8a8a8a; font-weight: 400; text-transform: uppercase } .mutual-firm-work-one .column-50 { padding: 0 100px 0 0 !important } .mutual-firm-work-one p, .mutual-firm-work-one h6 { color: #fff } .black-theme-section .default-button.theme-white .button-background .center, .black-theme-section .default-button.theme-white .button-background .left:before, .black-theme-section .default-button.theme-white .button-background .right:before { background-color: #373737 } .black-theme-section .plus-icon:after, .black-theme-section .plus-icon:before { background-color: #fff !important } .team-building h6 { color: #fff; margin: 0 0 10px 0; padding-bottom: 0; min-height: 30px } .team-building p { color: #fff; padding: 0 0 0 0; min-height: 66px } .team-building { display: flex; align-items: center; justify-content: center; margin: 0 auto; padding-left: 250px; position: relative; min-height: 190px } .team-building .icon_img { background: rgba(255, 255, 255, 0.15); width: 190px; height: 190px; float: left; text-align: center; line-height: 190px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; position: absolute; left: 0; right: 0; font-size: 0 } .team-building .textbox { margin: -20px 0 0 } #team-building-slider .team-building .icon_img img { margin: 0 auto; width: 100px; vertical-align: middle; display: inline-block } #team-building-slider { max-width: 980px; margin: 0 auto } #tetimonial .item img { display: block; width: auto; height: auto; margin: 0 auto 20px auto } #team-building-slider .owl-dots { margin: -20px 0 0 calc(50% - 225px) } #team-building-slider button.owl-dot.active { opacity: 1 } #team-building-slider button.owl-dot.active span { background: #fff; height: 4px; width: 4px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border-radius: 50% } #team-building-slider .owl-nav button.owl-next, #team-building-slider .owl-nav button.owl-prev, #team-building-slider button.owl-dot { background: transparent; border: 1px solid #fff; border-radius: 50%; height: 12px; width: 12px; margin: 0 10px; position: relative; opacity: 50% } #tetimonial .owl-dots { margin: 30px 0 0 } #tetimonial button.owl-dot.active, #home-popup-slider button.owl-dot.active { opacity: 1 } #tetimonial button.owl-dot.active span, #home-popup-slider button.owl-dot.active span { background: #fff; height: 4px; width: 4px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border-radius: 50% } #tetimonial button.owl-dot, #home-popup-slider button.owl-dot { background: transparent; border: 1px solid #fff; border-radius: 50%; height: 12px; width: 12px; margin: 0 10px; position: relative; opacity: 50% } #tetimonial .owl-nav button.owl-next, #tetimonial .owl-nav button.owl-prev, #home-popup-slider .owl-nav button.owl-next, #home-popup-slider .owl-nav button.owl-prev { font-size: 30px; color: #000; background-color: rgb(255 255 255 / 50%); width: 50px; height: 50px; border-radius: 50%; display: none } #tetimonial .owl-nav button.owl-prev, #home-popup-slider .owl-nav button.owl-prev { position: absolute; top: 50%; transform: translateY(-50%); left: -100px } #tetimonial .owl-nav button.owl-next, #home-popup-slider .owl-nav button.owl-next { position: absolute; top: 50%; transform: translateY(-50%); right: -100px } #home-popup-slider button.owl-dot { margin: 0 5px; } #home-popup-slider .owl-dots { position: absolute; bottom: auto; left: 2%; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 10px; } #home-popup-slider.owl-carousel .owl-item img.un-banner { max-width: 100%; } .client-review-section:hover>#tetimonial .owl-nav button.owl-next, .client-review-section:hover>#tetimonial .owl-nav button.owl-prev { display: block } .black-theme-section .default-button.theme-white { font-size: 14.1px; color: #fff } .our-thoughts-perspective { padding: 150px 0 100px 0; position: relative; z-index: 11 } .blog-listing .our-thoughts-perspective { padding: 150px 0 260px 0 } .blog-listing .our-thoughts-perspective .custom-row { padding: 0 } .our-thoughts-perspective h6 { text-align: center } .our-thoughts-perspective .custom-row { display: flex; flex-direction: row; padding: 0 0 50px 0; justify-content: center; flex-wrap: wrap } .our-thoughts-perspective .custom-row.subscribe-form { text-align: center; margin: 0 auto } .blog-listing .our-thoughts-perspective .custom-row .column-50:nth-child(2n+2) { margin-top: 160px } .our-thoughts-perspective .custom-row .column-50 { max-width: 50%; flex: 50%; transform: none; padding: 0 10px } .our-thoughts-perspective .custom-row .column-50 a { display: block } .our-thoughts-perspective .content-width { max-width: 1400px; margin: 0 auto; padding-left: 15px; padding-right: 15px; position: relative } .our-thoughts-perspective .cards { text-align: center; padding: 50px 110px; position: relative } .our-thoughts-perspective .cards .blog-img { position: relative } .our-thoughts-perspective .cards:hover .blog-img { position: relative } .our-thoughts-perspective .cards .blog-img img { width: 100%; display: block } .our-thoughts-perspective .blog-img::after { content: ""; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -webkit-transition: opacity .5s ease-in-out; display: none } .our-thoughts-perspective .blog-img:hover::after { opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -webkit-transition: opacity .5s ease-in-out } .our-thoughts-perspective .cards p, .blog-content .card-body p { font-size: 16px; letter-spacing: 1px; line-height: 30px; color: #000000; font-weight: 400; text-align: left; padding-bottom: 0 } .portfolio-list .our-thoughts-perspective .cards p { font-size: 24px; line-height: 36px; font-weight: 300 } .portfolio-list .our-thoughts-perspective h6 { font-size: 14px; font-weight: 400; letter-spacing: 0.5px; line-height: 36px; text-align: left; padding: 20px 0 } .our-thoughts-perspective .cards p span, .blog-content .card-body p span { font-size: 14px; letter-spacing: 3px; line-height: 30px; color: #3098f3; font-weight: 400; text-transform: uppercase } .our-thoughts-perspective .cards h5, .blog-content .card-body h5 { font-size: 14px; letter-spacing: 3px; line-height: 30px; color: #000; font-weight: 400; text-align: left } .our-thoughts-perspective .cards .card-body { padding-top: 40px } .portfolio-list .our-thoughts-perspective h3 { background: none; color: #141414 } .our-thoughts-perspective h3 { font-size: 34px; line-height: 48px; font-weight: 600; font-family: "Josefin Sans"; text-align: center; position: absolute; top: 41%; transform: translateY(-50%); left: 0; right: 0; z-index: 1; background: linear-gradient(to right, #000000 111px, #ffffff 109px, #ffffff 535px, #ffffff 550px, #000000 0%); color: transparent; -webkit-background-clip: text; background-clip: text } .our-purpose-section { margin-top: calc(4400px + 100vh) } /* .look-what-we-work-section{padding:100px 0;position:relative;overflow:hidden;background-color:#fff;z-index:11} */ .header-text h6 { text-align: center; position: relative; z-index: 9 } marquee { width: 100%; overflow: visible; display: table-row-group; margin-top: 50px } .all-cases-button { position: relative; z-index: 9 } .home-page .look-what-we-work-section h6 { margin-bottom: 0 } h6 { margin: 0; position: relative; z-index: 1 } .marquee-scroller { padding-bottom: 50px; position: relative; z-index: 1 } .marquee-scroller .item { max-width: 25%; position: relative; margin: 30px 80px; display: flex; align-items: center; justify-content: center; min-width: 510px } .marquee-block .item { max-width: 100% } .marquee-scroller .transparent-text { -webkit-text-stroke: 1px #000; color: #fff; font-size: 5vw; padding: 0; min-height: 115px; min-width: 0; max-width: 100%; display: flex; align-items: center; font-weight: bold; font-family: 'Futura PT'; font-weight: 900; position: relative } .marquee-scroller .hover-img { position: absolute; top: -70px; right: -50px; max-width: 318px } .marquee-scroller .hover-img { width: 500px; top: 50%; right: 0; left: calc(-50% - -150px); max-width: 247px; transform: rotate(30deg) translateY(-50%); margin: 0 auto; display: none } .marquee-scroller .hover-img img { width: 100% } .marquee-scroller .hover-img { opacity: 0; transition: 0.3s } /*.marquee-scroller .hovered-active .hover-img{opacity:1;transition:0.3s;z-index:100} .marquee-scroller .hovered-active .transparent-text{position:relative;z-index:99;display:inline-block;margin:0;line-height:90px;display:flex} .home-marquee .marquee-scroller .to-left .mq .marquee-item:nth-child(1) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-left .mq .marquee-item:nth-child(4) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-right .mq .marquee-item:nth-child(2) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-right .mq .marquee-item:nth-child(5) .hovered-active .transparent-text{background:linear-gradient(120deg,#fff calc(100% - 118px),#ffcc00 calc(100% - 168px))!important;background-clip:text;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent} .home-marquee .marquee-scroller .to-left .mq .marquee-item:nth-child(2) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-left .mq .marquee-item:nth-child(5) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-right .mq .marquee-item:nth-child(3) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-right .mq .marquee-item:nth-child(6) .hovered-active .transparent-text{background:linear-gradient(120deg,#fff calc(100% - 118px),#fe6571 calc(100% - 168px))!important;background-clip:text;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent} .home-marquee .marquee-scroller .to-left .mq .marquee-item:nth-child(3) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-left .mq .marquee-item:nth-child(6) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-right .mq .marquee-item:nth-child(1) .hovered-active .transparent-text, .home-marquee .marquee-scroller .to-right .mq .marquee-item:nth-child(4) .hovered-active .transparent-text{background:linear-gradient(120deg,#fff calc(100% - 118px),#3098f3 calc(100% - 168px))!important;background-clip:text;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent} */ .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(1) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(7) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(10) .transparent-text:hover, .marquee-scroller .to-right .js-marquee .marquee-item:nth-child(2) .transparent-text:hover, .marquee-scroller .to-right .js-marquee .marquee-item:nth-child(4) .transparent-text:hover, .marquee-scroller .to-right .js-marquee .marquee-item:nth-child(5) .transparent-text:hover { color: #fe6571; -webkit-text-stroke: 0px #000 } .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(2) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(4) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(5) .transparent-text:hover, .marquee-scroller .to-right .js-marquee .marquee-item:nth-child(3) .transparent-text:hover, .marquee-scroller .to-right .js-marquee .marquee-item:nth-child(6) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(11) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(8) .transparent-text:hover { color: #ffcc00; -webkit-text-stroke: 0px #000 } .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(3) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(6) .transparent-text:hover, .marquee-scroller .to-right .js-marquee .marquee-item:nth-child(1) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(9) .transparent-text:hover, .marquee-scroller .to-left .js-marquee .marquee-item:nth-child(12) .transparent-text:hover { color: #3098f3; -webkit-text-stroke: 0px #000 } .our-thoughts-perspective .blog-img-one h3 { min-width: 603px; left: -81px } .our-thoughts-perspective .blog-img-two h3 { min-width: 563px; left: -60px } .blog-img span { letter-spacing: 0.4px } .wrapperrrr { width: 300px; height: 300px; position: relative; margin: 60px auto } .parent, .child { position: absolute } .parent { width: 100%; height: 100%; background: black } .child { width: 200px; height: 100px; background: green; right: -50px; bottom: -20px } .testimonial-desc { padding-bottom: 30px; min-height: auto; display: flex; align-items: center; justify-content: center } .cursor { position: absolute; height: 10px; width: 10px; border-radius: 50%; transform: translateX(-50%) translateY(-50%); z-index: 99999; pointer-events: none } /* slider ----------------------*/ .slide-wrap { margin: 0; width: 100% } .slide-mask { position: relative; overflow: hidden; height: 130px } .slide-group { position: absolute; top: 0px; left: 0; width: 100% } .slide-wrap .slide { height: 130px; font: 100 90px/135px "lato"; font-size: 2em; color: #fff; text-align: center; text-transform: uppercase; margin-top: 0 } .inner_page_section { height: 100% } .about_banner { width: 100%; float: left; padding: 300px 0 0; position: relative; z-index: 11 } .about_banner .content-width { max-width: calc(100vw / 2 + 873px / 1.5); margin: 0 auto } .about_banner .texttypo p { font-size: 5.208333333333333vw; font-weight: 700; line-height: 6.5vw; text-transform: uppercase } .blog-detail .about_banner .texttypo p { line-height: 6vw } .about_banner .texttypo p>span { display: block } .about_banner .texttypo p span { line-height: normal; font-size: inherit; font-weight: 700; color: #fe6571 } .about_banner .texttypo p span.Typewriter__cursor { font-weight: 400 } .video-custom-play { position: relative; z-index: 111; overflow: hidden; } .img_banner { float: left; width: 100%; padding: 163px 0 0; position: relative; line-height: 0 } .about_section { margin: 0; display: flex; justify-content: center; align-items: center; padding: 160px 0 } .about_section .content-width { max-width: 970px } .about_section .text-left { float: left; width: 100% } .about_section .text-left h2 { margin: 0 0 40px; color: #141414; line-height: 35px; font-size: 25px } .about_section .text-left p { font-size: 24px; line-height: 36px; color: #141414; max-width: inherit; padding: 0 0 75px } .blog-content p.padd0 { padding-bottom: 0 } .blog-content p b { font-weight: 700 } .blog-content p i { font-style: italic } .about_section .default-button .text { letter-spacing: 2.20px } .about_section .content-width { position: relative; z-index: 111 } .blog-content-img { padding: 20px 0 } .blog-content-img img { margin: 0 auto; display: block } .blog-content-img iframe { width: 100%; height: 520px; border: 0; display: block } .blog-content ul { padding: 30px 0 } .blog-content ul li { font-size: 18px; padding-bottom: 20px } .blog-content ul.social_icon { padding: 15px 0 30px; float: left; width: 100% } .blog-content ul.social_icon li { font-size: 18px; padding-bottom: 20px; width: 33.3333%; float: left } .blog-content ul.social_icon li a { width: 100%; float: left; line-height: 1.5 } .case-study .img_banner { position: relative } .blog-detail .img_banner { position: relative; width: 100%; height: 100vh; max-height: 900px; overflow: hidden } .blog-detail strong { line-height: 33px; font-size: 18px; padding-bottom: 20px; display: block } .img_banner img { width: 100% } .case-study #particles-js { /* z-index:0 */ } .case-study .img_banner img { width: 100%; height: 960px; position: static; left: 0; right: 0; object-fit: cover; object-position: top } .img_banner .content-width { z-index: 3; max-width: 1470px } .img_banner .text_box { position: absolute; right: 240px; top: 30px; background: #fe6571; padding: 55px 60px 60px; max-width: 440px; z-index: 11 } .img_banner .text_box p { color: #FFF; font-size: 24px; line-height: 36px; font-weight: 300; letter-spacing: 0.60px; padding: 0 0 22px } .img_banner .text_box hr { width: 30px; height: 2px; border: solid 2px rgba(255, 255, 255, 0.50); margin: 12px 0 0 } .vision_section { padding: 200px 0; background-color: rgba(0, 0, 0, 0.05); height: auto; display: flex; justify-content: center; align-items: center } .vision_section .content-width { max-width: calc(100vw / 2 + 895px / 1.5); margin: 0 auto; padding-left: 15px; padding-right: 15px; z-index: 111; position: relative; width: 100% } .vision_section img { max-width: 100%; display: block; margin: 43px auto 0 } .vision_section h6 { color: #141414 } .vision_section p:nth-of-type(1) { padding-bottom: 40px } .vision_section p { font-size: 25px; color: #141414; font-weight: 300; line-height: 33px; padding: 0; max-width: 595px; letter-spacing: 1px } .vision_section .custom-row { display: flex; flex-direction: row; align-items: center } .vision_section .custom-row .column-50 { max-width: 50%; flex: 50%; padding: 0 15px } /* nav ----------------------*/ .slide-wrap .slide-nav { text-align: center } .slide-wrap .slide-nav ul { margin: 0; padding: 0 } .slide-wrap .slide-nav li { display: inline-block; width: 10px; height: 10px; background: rgb(175, 56, 56); cursor: pointer; margin-left: .5em } .slide-wrap .slide-nav li.current { background: rgb(144, 39, 39) } .bussiness-scroller .nav-dots { position: fixed; top: 50%; right: 5%; transform: translateY(-50%); margin: 0; padding: 0; cursor: pointer } .nav-dots ul li { margin: 25px 0; display: flex; justify-content: center } .nav-dots ul li a { background-color: #b9b9b9; width: 5px; height: 5px; border-radius: 50%; display: block } .nav-dots ul li a.active { background-color: #141414; width: 10px; height: 10px; border-radius: 50%; display: block } .bussiness-scroller .nav-dot { width: 12px; height: 12px; border: 2px solid #52616a; border-radius: 50%; list-style: none; background: #c9d6de; transition: all 0.3s } .bussiness-scroller .section { display: grid; justify-content: center; align-content: center; height: 100vh } .swiper-wrapper .swiper-slide:last-child { display: block } .swiper-container-autoheight .swiper-wrapper { overflow-y: hidden !important } #switch-container { width: 100%; height: 100%; position: relative; min-height: 678px } .header svg { width: 30px; height: 30px; transition: 0.5s } .cls-1-mobile { fill: #141414 } .cls-2-mobile { fill: #f16572 } .panel.description { position: relative } :root { --black: #000; --white: #fff; --color-1: #000; --gutter: 2rem; --replace-offset: 50%; --replace-offset-2: calc((100% - var(--replace-offset)) * 1) } .header__logo.js-replace svg .cls-1 { fill: #fff } .header__logo.js-replace svg .cls-2 { fill: #f16572 } .header__logo.js-replace.js-replace--reverse svg .cls-1 { fill: #141414 } .header__logo.js-replace.js-replace--reverse svg .cls-2 { fill: #f06472 } .header__logo.js-replace i { color: #fff; } .header__logo.js-replace.js-replace--reverse i { color: #141414; } .portfolio-ocfx p, .portfolio-ocfx h6, .portfolio-ocfx .menu-toggle .la-bars, .portfolio-ocfx .header__logo.js-replace.js-replace--reverse i { color: #fff; } /* .header__logo.js-replace .default-button.btn_hiring{color:#fff;} .header__logo.js-replace.js-replace--reverse .default-button.btn_hiring{color:#141414;} .header__logo.js-replace .default-button.btn_hiring .button-background .center, .header__logo.js-replace .default-button.btn_hiring .button-background .left:before, .header__logo.js-replace .default-button.btn_hiring .button-background .right:before{background-color:#141414;} .header__logo.js-replace.js-replace--reverse .default-button.btn_hiring .button-background .center, .header__logo.js-replace.js-replace--reverse .default-button.btn_hiring .button-background .left:before, .header__logo.js-replace.js-replace--reverse .default-button.btn_hiring .button-background .right:before{background-color:#e0effd;} */ /* .header__logo.js-replace .default-button.btn_hiring{} */ .header__logo.js-replace .js-replace__item .texttypo p .typewriter, .header__logo.js-replace.js-replace--reverse .js-replace__item .texttypo p .typewriter { color: #f16572 !important } .header__logo.js-replace .texttypo p { color: #fff } .header__logo.js-replace.js-replace--reverse .texttypo p { color: #141414 } .js-replace { display: grid; position: fixed; max-width: 1680px; width: 100% } .menu-wrapper { right: 150px } .js-replace__item { grid-row: -1 / 1; grid-column: -1 / 1; will-change: transform } .js-replace__item { transform: translateY(calc(var(--replace-offset) * 1)) } .js-replace__content { border: 1px solid transparent; will-change: transform; transform: translateY(calc(var(--replace-offset) * -1)) } .js-replace__item--active { transform: translateY(calc(var(--replace-offset-2) * 1)) } .js-replace__item--active .js-replace__content { transform: translateY(calc(var(--replace-offset-2) * -1)) } .js-replace--reverse .js-replace__item { transform: translateY(calc(var(--replace-offset-2) * 1)); overflow: visible } .js-replace--reverse .js-replace__content { transform: translateY(calc(var(--replace-offset-2) * -1)) } .js-replace--reverse .js-replace__item--active { transform: translateY(calc(var(--replace-offset) * 1)) } .js-replace--reverse .js-replace__item--active .js-replace__content { transform: translateY(calc(var(--replace-offset) * -1)) } .strategies-block-bg-pink, .strategies-block-bg-yellow, .strategies-block-bg-blue { position: absolute; right: 0; top: 60px; bottom: 0; left: 0; max-width: 330px; max-height: 515px; transform: rotate(30deg); margin: 0 auto } .strategies-block-bg-pink { background-color: #fe6571 } .strategies-block-bg-yellow { background-color: #ffcc00 } .strategies-block-bg-blue { background-color: #3098f3 } /* About Us Page */ .we-are-mutual-firm-about .content-width { max-width: 1920px; padding-left: 30px; padding-right: 30px; position: relative; z-index: 22 } .we-are-mutual-firm-about { padding: 150px 0; position: relative } .we-are-mutual-firm-about .header-text { text-align: center } .we-are-mutual-firm-about .custom-row { display: flex; flex-direction: row } .we-are-mutual-firm-about .custom-row .col-md-33 { max-width: 33%; flex: 33% } .about-us, .footer-css { min-height: auto } .strategies-block { margin: 0 auto; text-align: center; position: relative; line-height: 0; max-width: 297px } .strategies-block img { width: auto !important } .senior-strategies-block { position: relative; padding-top: 175px } .emly-title { transform: rotate(-92deg) translate(210px, -167px); position: absolute; left: 0; bottom: 0; min-width: 400px; font-size: 18px; text-transform: uppercase; color: #fff } .strategies-block-bg-pink .emly-title span, .strategies-block-bg-yellow .emly-title span, .strategies-block-bg-blue .emly-title span { font-family: 'Brittany Signature'; font-weight: normal; font-size: 72px; background: linear-gradient(182deg, #fe6571 calc(100% - 105px), #fff calc(87% - 133px)); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: capitalize } .strategies-block-bg-yellow .emly-title span { font-family: 'Brittany Signature'; font-weight: normal; font-size: 72px; background: linear-gradient(182deg, #ffcc00 calc(100% - 105px), #fff calc(87% - 133px)); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: capitalize } .strategies-block-bg-blue .emly-title span { font-family: 'Brittany Signature'; font-weight: normal; font-size: 72px; background: linear-gradient(182deg, #3098f3 calc(101% - 106px), #fff calc(100% - 133px)); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: capitalize } .senior-text { position: absolute; right: -50px; top: 115px; transform: rotate(-88deg); font-size: 14px; font-weight: normal; line-height: 24px; text-transform: uppercase; opacity: 0; transition: opacity 0.5s; -webkit-transition: opacity 0.5s; width: 160px; text-align: right } .team-partner-content-block .senior-text { right: -34px; top: 70px } .social-media-icon { position: absolute; bottom: 0; right: calc(50% - 240px) } .social-media-icon { opacity: 0 } .senior-strategies-block:hover .senior-text, .senior-strategies-block:focus .senior-text, /* .senior-strategies-block:hover .emly-title, .senior-strategies-block:focus .emly-title, */ .senior-strategies-block:hover .social-media-icon, .senior-strategies-block:focus .social-media-icon { transition: opacity 0.5s; -webkit-transition: opacity 0.5s; opacity: 1 !important } #our-founders .owl-item.active.center .senior-strategies-block.senior-text, #our-founders .owl-item.active.center .senior-strategies-block .senior-text, #our-founders .owl-item.active.center .senior-strategies-block .emly-title, #our-founders .owl-item.active.center .senior-strategies-block .emly-title, #our-founders .owl-item.active.center .social-media-icon { transition: opacity 0.5s; -webkit-transition: opacity 0.5s; opacity: 1 } #our-founders .owl-item.active.center .senior-strategies-block .senior-text, #our-founders .owl-item.active.center .senior-strategies-block .senior-text { opacity: 0.5 !important } #our-founders .owl-item.active.center { position: relative; z-index: 2 } .we-are-mutual-firm-about .header-text { position: relative; z-index: 9 } .we-are-mutual-firm-about .header-text h6 { margin-bottom: -120px } .the-way-we-work h6, .meet-our-valuable-partner h6 { color: #fff; text-align: center } .the-way-we-work .header-text p { color: #fff; max-width: 740px; text-align: center; margin: 0 auto; font-size: 18px; line-height: 25px; padding: 0 0 40px 0; letter-spacing: 1px } .the-way-we-work ul { display: flex; flex-wrap: wrap; box-sizing: border-box; position: relative } .the-way-we-work ul::after { content: ""; width: 100%; height: 1px; background-color: #141414; position: absolute; bottom: 0 } .ask-icon { margin-bottom: 20px } .the-way-we-work ul li { max-width: 33%; flex: 33%; color: #fff; text-align: center; margin: 30px 0; padding: 30px 40px; position: relative; min-height: 300px; display: flex; align-items: center } .the-way-we-work ul li::after { content: ""; width: 1px; height: 100%; background-color: #ffffff78; opacity: 0.5; position: absolute; right: 0; top: 0 } .the-way-we-work ul li::before { content: ""; width: 85%; height: 1px; background-color: #ffffff78; opacity: 0.5; position: absolute; right: 0; left: 0; bottom: -30px; margin: 0 auto } .about-us #tetimonial p { color: #141414 } .the-way-we-work ul li:nth-child(3n+3)::after { display: none } .the-way-we-work ul li i { color: #fe6571; font-size: 45px } .the-way-we-work ul li span { font-size: 36px; line-height: 45px; display: block; margin-bottom: 30px } .hover-to-show p { color: #fff; opacity: 0.5; letter-spacing: 1px } .hover-to-show span { opacity: 0; position: absolute; line-height: 20px; transition: all 0.5s ease-in-out } .hover-to-show { position: relative; display: block; height: 0; overflow: hidden; -moz-transition: height 0.5s ease; -webkit-transition: height 0.5s ease; -o-transition: height 0.5s ease; transition: height 0.5s ease } .hover-to-show-link:hover .hover-to-show span { -webkit-animation: show 0.5s forwards; -moz-animation: show 0.5s forwards; -o-animation: show 0.5s forwards; animation: show 0.5s forwards } .hover-to-show-link:hover .hover-to-show { -webkit-animation: grow 0.5s forwards; -moz-animation: grow 0.5s forwards; -o-animation: grow 0.5s forwards; animation: grow 0.5s forwards; transition: grow 0.5s forwards; height: 110%; } @-webkit-keyframes show { 0% { opacity: 0 } 100% { opacity: 1 } } @-moz-keyframes show { 0% { opacity: 0 } 100% { opacity: 1 } } @-o-keyframes show { 0% { opacity: 0 } 100% { opacity: 1 } } @keyframes show { 0% { opacity: 0 } 100% { opacity: 1 } } @-webkit-keyframes grow { 0% { height: 0; transition: height 0.5s ease } 100% { height: 100px; transition: height 0.5s ease } } @-moz-keyframes grow { 0% { height: 0; transition: height 0.5s ease } 100% { height: 100px; transition: height 0.5s ease } } @-o-keyframes grow { 0% { height: 0; transition: height 0.5s ease } 100% { height: 100px; transition: height 0.5s ease } } @keyframes grow { 0% { height: 0; transition: height 0.5s ease } 100% { height: 100px; transition: height 0.5s ease } } .client-review-section .default-button { margin-top: 50px } .client-name { -webkit-text-stroke: 1px #000; color: #fff; font-size: 80px; margin-top: 5vw; margin-bottom: -10px; font-family: 'Futura PT'; font-weight: 900 } .why-with-uswork-one ul li { border-right: 1px solid #14141430 !important } .why-with-uswork-one { padding-bottom: 180px; position: relative; z-index: 11 } .why-with-uswork-one .default-button { color: #141414 !important } #partner-slider .owl-item img { width: 100px; margin: 0 auto; max-width: 100px } #partner-slider .item { display: flex; align-items: center; vertical-align: middle; min-height: 130px; filter: grayscale(1) } #partner-slider .owl-item.active.center .item { filter: grayscale(0) } .about-us #partner-slider .item { opacity: 0.5 } .about-us #partner-slider .owl-item.active.center .item { opacity: 1 } .meet-our-valuable-partner .content-width { max-width: 1640px; z-index: 111 } #partner-slider { margin: 130px 0 } .lets-make-thing { text-align: center; min-height: 600px; display: flex; align-items: center; padding-top: 120px; position: relative; z-index: 111 } .lets-make-thing h2 { color: #fe6571; font-size: 100px; font-weight: bold; margin-bottom: 60px } .lets-make-thing a { text-decoration: none; color: #141414; font-size: 36px; border-bottom: 2px solid } .lets-make-thing a:hover { color: #fe6571; text-decoration: none } .footer-css .site-footer { background-color: #fff; font-family: 'Josefin Sans', sans-serif } .footer-css .sandcup-side-logo { color: #141414 } .sandcup-side-logo { bottom: 90px; position: absolute; transform: rotate(-90deg); color: #fff; left: -140px; text-transform: uppercase; font-size: 14px; font-weight: 300; letter-spacing: 4px } .footer-css .site-footer .column-50 h3 { color: #000; opacity: .7 } /* .footer-css .site-footer .column-50:first-child h3{font-size:36px;line-height:60px} */ .footer-css .site-footer .column-50 .get-in-touch h3, .footer-css .site-footer .column-50 .location h3 { opacity: 1 } .footer-css .site-footer .tab-link.active { color: #000; opacity: 1; font-weight: 600 } .footer-css .site-footer .tab-link { color: #000; opacity: 0.7 } .footer-css .site-footer .tab-link:hover { color: #000; opacity: 1 } .footer-css .site-footer .copyright-text a:hover { opacity: 1 } .footer-css .site-footer .copyright-text a { color: #000; opacity: .7; font-weight: 600 } .footer-css .site-footer ul li a { color: #000; opacity: 30% } .footer-css .site-footer ul li a:hover { color: #000 !important; opacity: 1 } .footer-css .get-in-touch a { color: #000; opacity: 50% } .footer-css .get-in-touch a:hover { opacity: 100% } .footer-css .site-footer .tab-content a { color: #000; opacity: 0.7; max-width: 420px; display: block; line-height: 30px } .subscriber-block h4 { font-size: 100px; font-family: 'Brittany Signature'; font-weight: normal; color: #fe6571; text-align: center; margin-bottom: -30px } .subscriber-block h6 { font-size: 24px; color: #fff; text-align: center } .subscriber-block { text-align: center } .subscriber-block .default-button { margin-top: 100px } .popup-subscribe { padding-top: 120px; } .subscirber-form { max-width: 700px; margin: 10px auto } .subscirber-form input { font-size: 24px; letter-spacing: 0.25px; line-height: 60px; background-color: transparent; border-top: 1px solid #ffffff45; border-bottom: 1px solid #ffffff45; border-left: 0; border-right: 0; padding: 0 10px; width: 100%; color: #ffffff52; outline: 0 } .social-media-icons { margin-bottom: 20px } .social-media-icons a { padding: 20px; border: 1px solid #fff; border-radius: 50%; width: 50px; height: 50px; background-color: transparent; color: #fff; font-size: 20px; display: inline-flex; align-items: center; justify-content: center; margin: 0 5px } .blog-content { padding: 150px 0; position: relative; z-index: 11 } .blog-content h2 { margin: 50px 0 } .blog-content h2 a { color: #141414; text-decoration: underline } .blog-content .content-width { max-width: 940px } .blog-content p { font-size: 18px; line-height: 30px; font-weight: 400; opacity: 0.7; padding: 0 0 25px } .blog-content h4 { font-size: 24px; line-height: 36px; letter-spacing: 0.25px; margin: 10px 0 20px 0; opacity: 0.7 } .subscriber-with-us .our-thoughts-perspective { padding: 0; background-color: transparent } .subscriber-with-us .column-50 { margin-top: 0 !important } .subscriber-with-us .our-thoughts-perspective h3, .subscriber-with-us .our-thoughts-perspective .cards p, .subscriber-with-us .our-thoughts-perspective .cards h5 { color: #fff } .subscriber-with-us .our-thoughts-perspective .cards p { opacity: 0.7 } .subscriber-with-us .our-thoughts-perspective .cards h5 { opacity: 0.9 } .subscriber-with-us .our-thoughts-perspective { text-align: center } .subscriber-with-us .default-button { margin-top: 50px } .blog-detail .img_banner .text_box p { font-size: 14px; text-transform: uppercase; margin-bottom: -10px; font-weight: normal } .website-banner { position: relative } .blog-detail .about_banner .texttypo p { text-transform: none } .case-study-banner .texttypo span { color: #fe6571; font-size: 36px } .university-icon { position: absolute; right: 20px; top: 20px; font-size: 28px; color: #fff } .case-study-img-banner .custom-row, .automation-solution .custom-row { display: flex; flex-direction: row } .case-study-img-banner .custom-row .column-50:first-child { max-width: 40%; flex: 40%; padding-top: 60px } .case-study-img-banner .custom-row .column-50:last-child { max-width: 69%; flex: 100% } .automation-solution .custom-row .column-50:first-child { max-width: 50%; flex: 56% } .automation-solution .custom-row .column-50:last-child { max-width: 62%; flex: 62% } .case-study-img-banner.img_banner .content-width { position: relative; z-index: 3; max-width: 1910px !important; padding-right: 0; padding-left: 13% } .case-study-img-banner .text_box { margin-right: 13%; right: 0; top: -120px } .case-study.footer-css .black-theme-section { z-index: -1 } .inner-sidebar { padding: 0; position: relative; top: 90px } .inner-sidebar h6 { margin-bottom: 20px } .inner-sidebar .menu-1 { display: block; margin-bottom: 70px } .inner-sidebar .menu-2 span, .inner-sidebar .menu-1 span { display: block; margin-bottom: 25px; font-weight: 300; font-size: 18px } .visit-button { min-height: 70px; display: flex; align-items: flex-end } .visit-button button { font-size: 14px } .case-study .about_banner .texttypo p { text-transform: none } .case-study .case-study-banner .text_box p { text-transform: none; font-size: 24px } .automation-solution { padding: 100% 0 220px 0; max-width: 810px; margin-top: 0; z-index: 2; position: relative } .automation-solution .content-width { max-width: 1540px } .automation-solution p { font-size: 18px; font-weight: 300; line-height: 30px } .automation-solution h2 span { color: #fe6571 } .new-legend-scroller { position: relative; min-height: 960px; padding: 70px 0; z-index: 11; display: flex; align-items: center } .new-legend-scroller::before { content: ""; background-color: #141414; min-width: calc(50vw - 350px); height: 100%; position: absolute; left: 0; top: 0; z-index: -1 } .frame-scroller { border: 10px solid #141414; height: 85vh !important; overflow-y: clip; scroll-behavior: smooth; line-height: 0; background-color: #fff; width: 100% } .challenging-brief { padding: 250px 0; position: relative; z-index: 11 } .challenging-brief .content-width { max-width: 920px } .challenging-brief p { font-size: 24px; font-weight: 300; line-height: 36px; letter-spacing: 0.25px } .seamlessly-responsive { padding: 250px 0; position: relative; z-index: 11 } .seamlessly-responsive .custom-row, .refreshed-brands .custom-row, .key-result .custom-row { display: flex; flex-direction: row } .seamlessly-responsive .custom-row .column-50, .refreshed-brands .custom-row .column-50, .key-result .custom-row .column-50 { max-width: 50%; flex: 50% } .refreshed-brands .custom-row .column-50 { display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center } .refreshed-brands .custom-row .column-50:last-child { padding-left: 90px } .seamlessly-responsive p { max-width: 600px; font-size: 24px; font-weight: 300; line-height: 36px; letter-spacing: 0.25px } .mobile-img-two, .mobile-img-three { text-align: right; padding-right: 230px } .mobile-img-two { padding-bottom: 180px; margin-top: -130px } .mobile-img-one { text-align: right; padding-right: 120px; padding-top: 150px } .refreshed-brands { background-color: #f3f3f3; padding: 150px 0 } .refreshed-brands .content-width { position: relative; z-index: 11 } .refreshed-brands p { font-size: 18px; font-weight: 300; line-height: 25px } .inviting-typography .custom-row .column-50:last-child { padding-left: 0; padding: 30px 0 40px 20px; background-color: #fff } .inviting-typography .custom-row .column-50:first-child { padding-left: 200px } .lagend-full-banner { padding-top: 50px; position: relative; z-index: 11 } .lagend-full-banner .content-width { line-height: 0 } .key-result h6 { color: #fff } .key-result p { color: #fff; font-size: 20px; font-weight: 300; line-height: 35px; opacity: 0.7 } .key-result ul li span { color: #fe6571; font-size: 72px; font-weight: 500; display: block; line-height: normal; position: relative } .key-result ul li span::after { content: "%"; display: inline-block } .key-result ul { display: flex; list-style-type: none; flex-wrap: wrap; position: relative } .key-result ul li { max-width: 50%; flex: 50%; margin-bottom: 80px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative; padding-top: 30px } .key-result ul li::before { content: ""; background-color: #ffffff52; width: 78%; height: 1px; position: absolute; bottom: -40px; right: 35px } .key-result ul li::after { content: ""; background-color: #ffffff52; width: 1px; height: 100%; position: absolute; top: 0; right: 0 } .key-result ul::after { content: ""; background-color: #141414; height: 1px; width: 100%; position: absolute; bottom: -40px } .key-result ul li:nth-child(2n+2)::after { display: none } .key-result ul li:nth-child(3), .key-result ul li:nth-child(4) { margin-bottom: 0 } .key-result .custom-row .column-50:first-child { display: flex; flex-direction: column; justify-content: center } .case-study #tetimonial p { color: #fff } .case-study .client-review-section { margin: 70px auto 0 auto; padding: 100px 0 0 0 } .explore-more-project { background-color: #f3f3f3; padding: 30px 0; position: relative; z-index: 11; overflow: hidden } .explore-more-project .marquee-scroller .hover-img { width: auto; top: 40%; right: auto; left: auto; max-width: initial; transform: rotate(30deg) translate(-40%, -40%) } .explore-more-project .look-what-we-work-section { background-color: transparent } .explore-more-project .marquee-scroller { padding: 0px } .explore-more-project .marquee-scroller .transparent-text { font-size: 5vw } .explore-more-project .marquee-scroller ul li { margin: 30px 70px; padding: 0 } .explore-more-project .marquee-scroller .transparent-text { color: transparent } /* contact us */ .contact-banner { margin-top: 220px; position: relative; z-index: 11; padding-bottom: 110px } .contact-banner-content { display: flex; align-items: center } .contact-banner-content .contact-small-text { font-size: 36px; line-height: normal; font-weight: 600; padding-right: 70px; min-width: 450px } .contact-banner li h1 { font-size: 98px; font-weight: bold; line-height: 100px; /* border-bottom:3px solid;*/ margin-bottom: 20px } .contact-banner li a { font-size: inherit; font-size: inherit; color: inherit; font-weight: inherit; text-decoration: none } .contact-large-text-title { display: flex; align-items: flex-start } .contact-banner-content .join-the-team { font-size: 100px; line-height: 150px; opacity: 0.15; text-transform: uppercase; font-weight: bold } .contact-bg-section { background-color: #f3f3f3; min-height: 570px; width: 100%; display: flex; justify-content: center; padding: 120px 0 0 0 } .contact-banner .nav-tab .tabs { display: block } .contact-banner .tab-link::after, .contact-us-form .tab-link::after { display: none } .contact-banner .tabs li { margin: 0 0 20px 0 } .contact-banner i { font-size: 40px; padding-left: 10px; color: #141414 } .contact-us-form-inner { background-color: #fff; padding: 70px 20px 100px 20px; position: absolute; width: 100%; top: -330px } .contact-us-form { position: relative; z-index: 22 } .contact-us-form .content-width { position: relative } .contact-banner .tabs li { opacity: 0.15 } .contact-banner .tab-link.active { opacity: 1 !important } .contact-banner .tab-link.active i { color: #fd6470 } .contact-banner .tab-link.active h1 { border-bottom: 2px solid #141414 !important } .contact-us-form .tabs { justify-content: flex-end } .contact-us-form .tab-link { color: #141414; opacity: 0.5 } .contact-us-form .tab-link.active { opacity: 1 !important } .contact-us-form .tab-link.active span { border-bottom: 2px solid #141414 !important; line-height: normal } .contact-us-form .tabs.visible .tab-link.active span { border-bottom: 2px solid #141414 !important; line-height: normal } .contact-us-form .tab-link span a { font-size: inherit; color: inherit; font-weight: inherit } .contact-us-form .tab-link i { font-size: 25px } .contact-us-form .input-group { display: flex; align-items: center; flex-wrap: wrap; margin-left: -10px } .contact-us-form .input-row .input-col { max-width: 50%; flex: 50%; padding: 20px 10px; margin: 0 } .contact-us-form .text-area .input-col { max-width: 100%; flex: 100% } .contact-us-form .input-radio-row .input-col { max-width: 25%; flex: 25% } .contact-us-form .input-col { max-width: 50%; flex: 50%; padding: 20px 10px; margin: 0 } .contact-us-form .attach-document .input-col { width: 100%; max-width: 100% } .contact-us-form .attach-document .input-col input { width: 100% !important; font-size: 18px } .contact-us-form .input-row .input-col input { width: 100%; padding: 5px 10px; min-height: 40px; color: #333 !important; font-weight: 700; font-size: 20px !important; background: #f6f6f6; color: #999; border: 2px solid transparent; border-radius: 6px; padding: 1rem 1.4rem .6rem 1.4rem; -webkit-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; border: 2px solid transparent } .contact-us-form .input-row .input-col input:focus, .contact-us-form .input-col textarea:focus { border: 2px solid #fd6470 } .contact-us-form .input-col textarea { width: 100%; min-height: 100px; padding: 5px 10px; color: #333 !important; font-weight: 700; font-size: 18px !important; background: #f6f6f6; color: #999; border: 2px solid transparent; border-radius: 6px; padding: 2rem 1.4rem .6rem 1.4rem; -webkit-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; resize: none } .select .selectBtn { color: #333 !important; font-weight: 700; font-size: 18px !important; background: #f6f6f6; color: #999; border: 2px solid transparent; border-radius: 6px; padding: 5px 10px; min-height: 50px } .select .selectDropdown { color: #333 !important; font-weight: 700; font-size: 18px !important; background: #f6f6f6; color: #999; border: 2px solid transparent; border-radius: 6px; padding: 10px 0 } .contact-us-form .contact-page { padding-top: 30px; max-width: 650px } .contact-us-form .contact-page h3 { padding: 30px 0 0 0; font-weight: 400 } .contact-us-form .contact-page h3 span { color: #f06472 } .contact-us-form .contact-page .input-col h3 { padding-bottom: 30px } .contact-us-form .custom-radio [type=radio] { position: absolute; opacity: 0; width: 0; height: 0 } .contact-us-form .custom-radio .radio-item { display: flex; flex-direction: column; justify-content: center; align-items: center; border: 1px solid #fff; background: #f6f6f6; position: relative; border-radius: 6px } .contact-us-form .custom-radio .label-icon { padding: 15px 0; text-align: center; justify-content: center; display: flex; align-items: center; color: #919191; width: 100%; font-size: 18px; line-height: normal; font-weight: 400 } /* IMAGE STYLES */ [type=radio]+.label-icon { cursor: pointer } /* CHECKED STYLES */ [type=radio]:checked+.label-icon { background: #fd6470; color: white } .contact-us-form .form-label { width: 100%; display: block; color: #141414; font-size: 14px; font-weight: normal; line-height: normal; padding: 0 10px; text-transform: uppercase; letter-spacing: 1px } .contact-us-form .form-control { width: 100%; margin: auto; min-height: 55px; font-size: 22px; letter-spacing: 1px; color: #141414; padding: 10px 10px; border: 0; outline: 0; border-bottom: 1px solid #14141447; resize: none; position: relative; z-index: 11 } .contact-us-form .comments-area .form-control { min-height: 150px } .is-underline { border-bottom: 1px solid #14141429; display: block; opacity: 0.15 } .contact-us-form .input-group { padding-top: 20px } .contact-us-form .recaptcha-block { width: 100% } .contact-us-form .input-group-col { display: flex; width: 100%; flex-wrap: wrap; max-width: 100%; flex: 100%; justify-content: end } .contact-us-form .recaptcha-block .recaptcha-img { display: flex; align-items: center; padding-right: 30px } .contact-us-form .recaptcha-block .recaptcha-img i { font-size: 25px; margin-left: 10px } .contact-us-form .recaptcha-block .recaptcha-text { max-width: 50%; flex: 50%; position: relative } .comments-area { display: block } .comments-area .input-group-col { max-width: 100%; flex: 100% } .comments-area textarea { width: 100% !important } .arow-submit-button { display: flex; justify-content: left; padding-right: 0; padding-top: 30px; margin: 0 auto } .arow-submit-button .btn-octa-gone { width: 70px; height: 70px; cursor: pointer; transition: 0.5s; border-radius: 50% } .arow-submit-button .btn-octa-gone:hover, .arow-submit-button .btn-octa-gone:focus { transform: scale(1.2); transition: 0.5s } #home_subscribe_form .effect-16 { padding: 15px 0; font-size: 20px } /* .arow-submit-button .btn-octa-gone:before{width:70px;border-bottom:20px solid #e0effd;border-left:20px solid #fff;border-right:20px solid #fff} .arow-submit-button .btn-octa-gone:after{width:70px;border-top:20px solid #e0effd;border-left:20px solid #fff;border-right:20px solid #fff} */ .arow-submit-button .btn-octa-gone i { transform: translate(10%, 0%) rotate(-40deg) } .contact-us .black-theme-section { padding: 25% 0 0 0 } .arow-submit-button .btn-octa-gone .paper-hover { display: none } .custom-select { width: 100%; position: relative; margin: 10px 0 5px 0 } .custom-select select { display: none } .custom-select label { margin-top: -20px } .selected-item { color: #333 !important; font-weight: 700; font-size: 18px !important; background: #f6f6f6; border: 2px solid transparent; border-radius: 6px; padding: 5px 10px; min-height: 50px; cursor: pointer; z-index: 99; line-height: 30px; width: 100%; margin: auto; min-height: 45px; font-size: 19px; letter-spacing: 1px; opacity: 1; padding: 10px 10px; border: 0 } .selected-item:after { font-family: 'Line Awesome Free'; font-weight: 900; content: "\f107"; font-size: 20px; position: absolute; right: 10px; transition: 0.5s } .arrowanim.selected-item:after { transform: rotate(180deg) } .custom-select .item { color: #000; border-top: 1px solid #f6f6f6; cursor: pointer; opacity: 0.5; padding: 10px 10px } .custom-select .item:hover { background-color: #f6f6f6 } .contact-us-form input:-moz-placeholder, .contact-us-form textarea:-moz-placeholder { color: #141414; opacity: 0.15 } .contact-us-form input::-webkit-input-placeholder, .contact-us-form textarea::-webkit-input-placeholder { color: #141414; opacity: 0.15 } .contact-us-form input:-moz-placeholder, .contact-us-form textarea:-moz-placeholder { color: #141414; opacity: 0.15 } .all-items { position: absolute; top: 50px; left: 0; width: 100%; z-index: 100; background-color: #f6f6f6 } .all-items-hide { display: none } .contact-form-tabbing { padding: 250px 0 120px 0 } .contact-form-tabbing .content-width { position: relative; z-index: 111 } .contact-form-tabbing .contact-row { display: flex; justify-content: space-between } .contact-form-tabbing .contact-row .contact-sticky { max-width: 46%; flex: 46% } .contact-form-tabbing .contact-row .contact-form-right { max-width: 46%; flex: 46% } .contact-form-tabbing ul { display: flex } .contact-form-tabbing ul li { list-style-type: none } .contact-form-tabbing ul li::after { display: none } .contact-form-tabbing .contact-form-right h2 { font-size: 5vw; line-height: 115px; font-weight: 700; color: #f06472; margin: 0 } .contact-large-text-title { padding: 5px 0 35px 0 } .contact-us-form .input-group-col { margin: 0 10px } /* .contact-large-text-title{justify-content:flex-end} */ .contact-form-tabbing .tab-wrapper .tabs { margin: 0 100px 0 0 } .contact-form-tabbing .tab-wrapper .tabs li { margin: 0; text-align: right; display: flex; justify-content: end; width: 100% } .contact-form-tabbing .content-wrapper { margin: 0 } .contact-us-form .tab-link.active { color: #f06472 } .contact-us-form .tab-link.active h1 { color: #f06472 } .significant-achievement { background-color: #f3f3f3; padding: 200px 0; position: relative; z-index: 11 } .tab-bg-color { background-color: #f3f3f3; display: flex } .industry-tab-content-sec { position: relative; z-index: 11 } .industry-tab-content { padding: 150px 0 } .industry-tab-nav .tab-link::after { content: ""; width: 1px; height: 60%; position: absolute; background-color: #dcdcdc; top: 0; bottom: 0; right: 0 } .industry-tab-nav .tab-link { text-align: center; margin: 0; position: relative; transition: 1s } .industry-tab-nav .tab-link:hover i { color: #fd6470; transition: 1s; transform: rotate(360deg) } .industry-tab-nav .tab-link:hover { color: #141414; opacity: 1 } .industry-tab-nav .tab-link.current::before { content: ""; width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 15px solid #fff; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto } .industry-tab-nav .tab-link i { font-size: 30px } .industry-tab-nav .tab-link.current { color: #141414; opacity: 1 !important } .industry-tab-nav .tab-link.current i { color: #fd6470 } .industry-tab-nav .tab-link { color: #14141459; padding: 0; min-height: 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 170px } .industry-tab-nav .tab-link span { line-height: normal; font-size: 12px; font-weight: 600; letter-spacing: 1.5px; display: block; margin-top: 8px } .industry-tab-content-sec .tab-content { display: none; padding: 25px 0 !important } .industry-tab-content-sec .tab-content.current { display: inherit } .industry-tab-content .content-width { max-width: 893px } .industry-tab-content p { color: #141414; font-size: 22px; font-weight: 400; line-height: 32px } .industry-tab-content h3 { font-size: 100px; font-weight: bold } .industry-tab-content .default-button.theme-white { font-size: 14px; letter-spacing: 1px } .tabs-button { margin-top: 50px } .industry-tab-content h4 { font-size: 36px; line-height: 60px; margin-bottom: 20px } .significant-achievement .custom-row { display: flex; flex-direction: row; align-items: center } .significant-achievement .custom-row .column-50 { max-width: 50%; flex: 50% } .significant-achievement .custom-row .column-50:first-child p { font-size: 36px; font-weight: 300; line-height: 48px } .significant-achievement ul { text-align: center } .significant-achievement ul li:first-child { margin-bottom: 100px; position: relative } .significant-achievement ul li:first-child::after { content: ""; height: 1px; width: 45%; position: absolute; bottom: -40px; left: 0; right: 0; background-color: #141414; opacity: 0.15; margin: 0 auto } .significant-achievement ul li span { font-size: 72px; color: #fd6470; line-height: normal; display: block; margin-bottom: 0 } .significant-achievement ul li p { font-size: 14px; opacity: 0.5; color: #141414 } .look-what-industry, .look-what-industry .explore-more-project { background-color: transparent } .look-what-industry { position: relative; z-index: 11; background: #fff } .it-solution-block .custom-row { display: flex; flex-direction: row; align-items: center } .it-solution-block .custom-row .column-50 { max-width: 50%; flex: 50% } .it-solution-block .custom-row .column-50:first-child { padding-left: 120px } .it-solution-block h6 { color: #fff } .it-solution-block .service-title { font-size: 14px; font-weight: 600; color: #fff; line-height: 48px; padding-bottom: 40px; text-align: center; text-transform: uppercase; letter-spacing: 2.5px } .service-scroller-img { display: flex; min-height: 140px; align-items: center; flex-grow: 1 } .service-scroller-content { min-height: 180px } .it-solution-block ul { display: flex; align-items: center; justify-content: center } .it-solution-block ul li { padding: 20px 30px } .it-solution-block ul li img { opacity: 0.8; max-width: 90px } .it-solution-block ul li:last-child { margin-bottom: 0 } .it-solution-block ul li span { font-size: 18px; line-height: 30px; color: #fff; text-transform: uppercase; letter-spacing: 2.5px; display: block; margin-top: 40px; margin-bottom: 15px } .it-solution-block ul li p { font-size: 18px; color: #fff; line-height: 30px; max-width: 470px; font-weight: 300; letter-spacing: 1px } .technology-we-use { background-color: #f3f3f3; padding: 150px 0; position: relative; height: 100vh; display: flex; align-items: center; justify-content: center } .technology-we-use h6 { color: #141414 } .industry-client-review { position: relative; z-index: 11 } .industry-client-review p { color: #141414 } .marquee-wrapper { text-align: center } .marquee-wrapper .marquee-block { --total-marquee-items: 5; min-height: 600px; box-sizing: border-box; position: relative; margin: 0 auto } .marquee-inner { display: block; width: 10000%; position: absolute; top: 50%; transform: translateY(-50%) } .marquee-inner .text-white { font-weight: 800; font-size: 30px; font-family: cursive } /* .marquee-inner.to-left{animation:marqueeLeft 30s linear infinite} .marquee-inner.to-right{animation:marqueeRight 30s linear infinite} */ .marquee-item { height: auto; display: inline-block; margin: 0 10px; float: left; transition: all .2s ease-out } /* @keyframes marqueeLeft{ 0%{left:0} 100%{left:-100%} } @keyframes marqueeRight{ 0%{left:-100%} 100%{left:0} } */ .become-a-partner .default-button { margin-top: 70px } .partner-logo-box { padding: 175px 0; position: relative; z-index: 11; float: left; width: 100% } .become-a-partner { clear: both } .partner-logo-section1, .partner-logo-section2 { float: left; width: 100%; position: relative } .partner-logo-section1 ul { float: left; width: 100% } .partner-logo-section1 ul li { width: 50%; display: flex; align-items: center } .partner-logo-section1 ul li:nth-child(1) { margin: 0 auto; justify-content: center; width: 75% } .partner-logo-section1 ul li:nth-child(2), .partner-logo-section1 ul li:nth-child(3) { width: 22%; display: inline-flex; padding-left: 545px; margin-top: -40px; margin-bottom: -30px } .partner-logo-section1 ul li:nth-child(3) { margin-left: -140px; padding-right: 65px } .partner-logo-section1 ul li:nth-child(4), .partner-logo-section1 ul li:nth-child(5) { width: 30%; display: inline-flex; padding-left: 324px; margin-top: -105px } .partner-logo-section1 ul li:nth-child(6) { width: 75%; justify-content: flex-end; margin-top: -140px; margin-left: 477px } .partner-logo-section1 ul li:nth-child(7) { width: 85%; justify-content: flex-end; margin-left: 200px; margin-top: -55px } .partner-logo-section1 ul li:nth-child(1) .partner-content { padding-left: 100px } .partner-logo-section1 ul li:nth-child(2) .partner-content { position: relative; left: -400px; top: -170px; width: 430px } .partner-logo-section1 ul li:nth-child(3) .partner-content { position: relative; top: -380px; width: 430px } .partner-logo-section1 ul li:nth-child(4) .partner-content { position: relative; left: -370px; top: -150px; width: 360px } .partner-logo-section1 ul li:nth-child(5) .partner-content { position: relative; right: -370px; top: -150px; width: 360px } .partner-logo-section1 ul li:nth-child(6) .partner-content { width: 75%; justify-content: flex-end; margin-top: -240px; padding-left: 356px } .partner-logo-section1 ul li:nth-child(7) .partner-content { position: relative; right: -60px; top: 10px } .partner-logo-section2 ul li:nth-child(1), .partner-logo-section2 ul li:nth-child(2) { justify-content: center; display: inline-flex; margin-top: -36px; margin-bottom: -10px } .partner-logo-section2 ul li:nth-child(1) { width: 38% } .partner-logo-section2 ul li:nth-child(2) { width: 21% } .partner-logo-section2 ul li:nth-child(3), .partner-logo-section2 ul li:nth-child(4) { justify-content: flex-end; display: inline-flex; position: relative; margin-bottom: -30px } .partner-logo-section2 ul li:nth-child(3) { margin-top: -16px; margin-left: 21px; width: 43% } .partner-logo-section2 ul li:nth-child(4) { margin-top: -27px; width: 30% } .partner-logo-section2 ul li:nth-child(5) { width: 60%; display: inline-flex; justify-content: flex-end; padding-left: 522px } .partner-logo-section2 ul li:nth-child(5) .partner-logo-li { position: relative } .partner-logo-section2 ul li:nth-child(6) { width: 34%; display: inline-flex; padding-left: 113px; margin-bottom: -50px; position: relative } .partner-logo-section2 ul li:nth-child(7), .partner-logo-section2 ul li:nth-child(8) { justify-content: flex-end; display: inline-flex; position: relative; margin-bottom: -30px } .partner-logo-section2 ul li:nth-child(7) { margin-top: -46px; margin-left: 27px; width: 43% } .partner-logo-section2 ul li:nth-child(8) { margin-top: -34px; width: 30% } .partner-logo-section2 ul li:nth-child(9) { width: 75%; justify-content: flex-end; margin-top: -4px; margin-left: 540px } .partner-logo-section2 ul li:nth-child(10) { width: 85%; justify-content: flex-end; margin-left: 195px; margin-top: -50px; display: flex } .partner-logo-section2 ul li:nth-child(1) .partner-content { position: absolute; top: -160px; left: 70px } .partner-logo-section2 ul li:nth-child(2) .partner-content { position: absolute; top: 40px; right: 120px } .partner-logo-section2 ul li:nth-child(3) .partner-content { position: absolute; top: 80px; left: -110px } .partner-logo-section2 ul li:nth-child(4) .partner-content { position: absolute; top: 80px; right: -390px } .partner-logo-section2 ul li:nth-child(5) .partner-content { position: absolute; left: -380px; top: 70px } .partner-logo-section2 ul li:nth-child(6) .partner-content { position: absolute; right: -130px; top: -130px } .partner-logo-section2 ul li:nth-child(7) .partner-content { position: absolute; top: 80px; left: -110px } .partner-logo-section2 ul li:nth-child(8) .partner-content { position: absolute; top: 80px; right: -390px } .partner-logo-section2 ul li:nth-child(9) .partner-content { width: 75%; justify-content: flex-end; margin-top: -240px; padding-left: 356px } .partner-logo-section2 ul li:nth-child(10) .partner-content { position: relative; right: -60px; top: 10px } .partner-logo-section1 ul li .partner-logo-li { float: left; position: relative } .partner-logo { height: 241px; width: 100px; background: none; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; border-top: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc; margin: 0 100px; padding: 100px 0; transition: all 0.8s; display: inline-block; vertical-align: middle } .partner-content p { font-size: 22px; line-height: 30px; font-weight: 300 } .partner-content { display: inline-block; vertical-align: middle } .partner-logo:before, .partner-logo:after, .partner-logo span { content: ""; position: absolute; height: inherit; width: inherit; background: inherit; -webkit-box-sizing: inherit; box-sizing: inherit; border: inherit; top: -1px; z-index: -1 } .partner-logo span img { display: block; margin: 0 auto; transform: rotate(-90deg) scale(1.2); transition: all 0.8s } .partner-logo:before { left: -100%; transform: rotate(-45deg); transform-origin: top right } .partner-logo:after { left: 100%; transform: rotate(45deg); transform-origin: top left } .partner-logo span { height: inherit; width: inherit; background: inherit; transform: rotate(90deg); display: flex; align-items: center } .partner-logo { filter: gray; -webkit-filter: grayscale(1); -webkit-filter: grayscale(100%); filter: url(resources.svg#desaturate); filter: grayscale(100%) } .partner-logo:hover { filter: gray; -webkit-filter: grayscale(0); -webkit-filter: grayscale(0); filter: url(resources.svg#desaturate); filter: grayscale(0) } .partner-logo-section1 ul li .partner-content, .partner-logo-section2 ul li .partner-content { opacity: 0; transition: all 0.8s } .partner-logo-section1 ul li .partner-logo:hover+.partner-content, .partner-logo-section2 ul li .partner-logo:hover+.partner-content { opacity: 1; transition: all 0.8s } .services-roadmap { padding: 250px 0; position: relative; z-index: 11 } .services-roadmap .content-width { max-width: 1100px; padding: 0 15px } .services-roadmap h2 { font-size: 2vw; line-height: 6vh } .services-roadmap p { font-size: 24px; line-height: 36px; letter-spacing: 0.25px; font-weight: 300 } .services-roadmap h2 span { color: #fe6571 } .services-roadmap .default-button { margin-top: 50px } .market-research-section { padding: 250px 0 270px 0; overflow: hidden } .market-research-section .sidebar-scroller h2 { font-size: 30px; line-height: 36px; color: #141414; font-weight: 600; padding-top: 20px; margin-bottom: 0; letter-spacing: 0.75px } .market-research-section .sidebar-scroller p, .market-research-section .sidebar-scroller ul li { font-size: 22px; line-height: 32px; letter-spacing: 1px; font-weight: 300 } .market-research-section .sidebar-scroller .default-button { margin-top: 30px; position: unset } .market-research-section .sidebar-scroller .default-button.theme-white .button-background .center, .market-research-section .sidebar-scroller .default-button.theme-white .button-background .left:before, .market-research-section .sidebar-scroller .default-button.theme-white .button-background .right:before { position: fixed } .cms-it-services { background-color: #f3f3f3; padding: 150px 0 } .cms-it-services .content-width { position: relative; z-index: 11 } .cms-it-services h6, .cms-it-services p, .cms-it-services span { color: #141414 !important } .home-page .look-what-we-work-section .marquee-wrapper .marquee-block { min-height: 200px } .look-what-we-work-section .marquee-wrapper .marquee-block { min-height: 235px } .look-what-we-work-section .content-width { max-width: 100%; padding: 0; position: relative; z-index: 22 } .services-page .look-what-we-work-section .marquee-wrapper .marquee-block, .technology-page .look-what-we-work-section .marquee-wrapper .marquee-block, .industry-page .look-what-we-work-section .marquee-wrapper .marquee-block, .case-study .look-what-we-work-section .marquee-wrapper .marquee-block { min-height: 600px } #content section { font-size: 80px; letter-spacing: -0.4px; text-align: center; text-shadow: 1px 5px 10px #fff; height: 100%; position: absolute; width: 100% } .has-offcanvas { position: fixed } .Site-interface { position: relative; z-index: 999 } .humberger-toggle-menu { margin: 0 auto } .header .default-button .text { margin-top: -1px; padding-top: 0; display: block } .headers { position: fixed; left: auto; z-index: 9999; width: 0%; padding: 15px 0; right: 95px; top: 60px } .header-row { position: relative; display: flex; align-items: center; justify-content: flex-end } .hamburger-toggle { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; /* width:60px; height:60px;*/ -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background-color: transparent; cursor: pointer; outline: none } .hamburger-menu { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; width: 30px; height: 20px; margin-top: -15px; color: #fff; font-size: 30px } .line { display: block; width: 100%; height: 2px; background-color: #fff } .line--middle { width: 80% } .line--bottom { width: 60% } .hamburger-toggle__circle { width: 60px; height: 60px; fill: #141414; pointer-events: none; transform: scale(1) translateZ(1%, 1%, 0); transform-origin: center; transition: transform 0.5s; position: relative; right: 115px; top: 45px } .has-offcanvas .hamburger-toggle__circle { transform: scale(75) translate3d(1%, 1%, 0) } .headers .hamburger-toggle { top: 20px; right: 10px } .offcanvas { position: fixed; top: 0; left: 0; z-index: 1; display: flex; align-items: center; justify-content: flex-end; width: 100%; min-height: 100vh; pointer-events: none; opacity: 0; transform: translateY(0); transition: opacity 0.5s, transform 0.3s } .has-offcanvas .offcanvas { pointer-events: auto; opacity: 1; transform: none } .has-offcanvas .toggle-circle { opacity: 1 } .offcanvas-nav { position: absolute; left: 0; right: 0; top: calc(50% - 300px); transform: translate(10px, 25%); bottom: 0; margin: 0 auto; display: inline-flex; align-items: center; justify-content: center; max-height: 390px; width: 1100px } .offcanvas-nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap } .offcanvas-nav__item { font-size: 32px; text-align: left; text-transform: uppercase; line-height: normal; margin: 20px 0 } @media screen and (min-width:1024px) { .offcanvas-nav__item { max-width: 50%; flex: 50%; padding: 0 30px } } @media screen and (min-width:1400px) { .offcanvas-nav__item { font-size: 64px } } .button_container { position: relative; top: 0; right: 0; height: 27px; width: 35px; cursor: pointer; z-index: 999; transition: opacity 0.25s ease; transition: 0.5s } .button_container:hover { transform: scale(1.1); transition: 0.5s } .button_container.active .top { transform: translateY(11px) translateX(0) rotate(45deg); background: #FFF } .button_container.active .middle { opacity: 0; background: #FFF } .button_container.active .bottom { transform: translateY(-11px) translateX(0) rotate(-45deg); background: #FFF } .button_container svg .cls-1 { fill: #000 } .button_container svg .cls-2 { fill: #FF5252 } .button_container span { background: #FF5252; border: none; height: 5px; width: 100%; position: absolute; top: 0; left: 0; transition: all 0.35s ease; cursor: pointer } .button_container span:nth-of-type(2) { top: 11px } .button_container span:nth-of-type(3) { top: 22px } .overlay { position: fixed; background: #141414; top: 0; left: 0; width: 100%; height: 0%; opacity: 0; visibility: hidden; transition: opacity 0.35s, visibility 0.35s, height 0.35s; overflow: hidden; font-family: 'Josefin Sans', sans-serif } .overlay.open { opacity: 1; visibility: visible; height: 100%; z-index: 9999 } .overlay nav { position: relative; top: 50%; transform: translateY(-50%); font-size: 2.5vw } .overlay ul { list-style: none; padding: 0; margin: 0 auto; display: flex; flex-wrap: wrap; position: relative; max-width: 70% } .overlay-menu .greatplace { padding-bottom: 50px; } .overlay ul li { display: block; max-width: 58%; flex: 100%; text-align: left; padding: 20px 0 } .overlay ul li a { color: #ffffff6b; text-decoration: none; font-weight: 700; line-height: normal; position: relative; text-transform: uppercase } .overlay ul li a:hover:after, .overlay ul li a:focus:after, .overlay ul li a:active:after { width: 100% } .overlay ul li a:after { content: ""; position: absolute; bottom: 0; left: 50%; width: 0%; transform: translateX(-50%); height: 2px; background: #fff; transition: 0.35s } @keyframes fadeInRight { 0% { opacity: 0; left: 50% } 100% { opacity: 1; left: 0 } } #overlay .toggle-close { position: fixed; top: 70px; right: 135px; color: #fff; font-size: 28px } .overlay ul li a { color: #ffffff6b; text-decoration: none; font-weight: 700; line-height: normal; text-align: center } .overlay ul li a:hover { color: #fff } .menu-social-box { position: absolute; right: 0; max-width: 35vw; bottom: 0 } .menu-social-box a { display: block; line-height: 45px; color: #f06472; font-size: 26px } .menu-social-box ul { max-width: 100% !important; padding-top: 15px } #mainnav>ul>li { display: inline-block; padding: 15px 6px } #mainnav ul li { padding: 15px 10px } #mainnav>ul>li.home>a { color: #18ba60 } #mainnav>ul>li>a { position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out } #mainnav ul.submenu { display: block; flex-wrap: inherit; position: absolute; left: 340px; top: 0; max-width: 350px; text-align: left; z-index: 9999; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out } #mainnav ul.submenu li:first-child { border-top: none } #mainnav ul.submenu>li { max-width: 100% } #mainnav ul li ul li { margin-left: 0 } #mainnav ul.submenu>li>a { display: inline-block; color: #fff; text-decoration: none; padding: 0px; line-height: 45px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 0.6; text-align: left; font-size: 20px } #mainnav ul.submenu>li>a:hover { opacity: 1 } #mainnav ul li:hover a { color: #fff } #mainnav ul li:hover>ul.submenu { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; visibility: visible } .menu-text-rotate { color: #fff; position: absolute; transform: rotate(-90deg); left: 10%; top: 38px; opacity: 0.5; font-size: 18px; letter-spacing: 5px; text-transform: uppercase } .menu-social-icon .social-menu li { max-width: 55px !important; flex: 20% !important } .menu-location { min-height: 130px } .menu-location #tabs { display: inline-block } .menu-location #tabs ul li { display: inline-block !important; max-width: none; flex: auto; font-size: 21px; color: #fff; padding: 0 } .menu-location #tabs ul li.active .tab, .location #tabs ul li.active .tab { color: #fff !important } .footer-css .location #tabs ul li.active .tab { color: #141414 !important; opacity: 1 } .menu-location #tabs ul li.active .tabcontent, .location #tabs ul li.active .tabcontent { opacity: 1 } .menu-location #tabs ul li p { color: #fff } .menu-location #tabs li:hover .tab { color: #f06472 !important } .menu-location #tabs li { position: static } .menu-location #tabs .tab, .menu-location #tabs li.tab1:first-child { width: auto !important } .menu-location #tabs .tabcontent { top: 60px } .menu-social-icon .social-menu li { padding: 0 !important } .parallax-object { background-size: auto; background-position: center center; width: 100%; min-height: 970px; background-repeat: no-repeat; } .parallax-background { overflow: hidden; position: relative; width: 100%; height: auto } .parallax-background video { border-radius: 40px; min-width: 1080px; height: 660px; object-fit: cover; border: 4px solid #000; margin: 0 auto; display: block; } #expand { min-height: auto; min-width: 60%; max-width: 100%; right: 0; position: absolute; will-change: width; transition: 1s; height: 960px; overflow: hidden; object-fit: cover; object-position: center; filter: grayscale(1) } .expands-active { filter: grayscale(0) !important; transition: 1s } #expand1 { position: absolute; width: 0; height: 100%; top: 0; bottom: 0; left: 0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left; transform-origin: left; background-color: #fff; transition-duration: 2s; transition-timing-function: cubic-bezier(0.49, 0.55, 0.5, 0.57) } #expand1.visible { width: 20%; -webkit-transform: scaleX(100%); transform: scaleX(100%); -webkit-transform-origin: left; transform-origin: left; background-color: #fff } #expand { position: absolute; width: 0; height: 100%; top: 0; bottom: 0; left: auto; right: 0; -webkit-transform: scaleX(100%); transform: scaleX(100%); -webkit-transform-origin: right; transform-origin: right; background-color: transparent; transition-duration: 2s; transition-timing-function: cubic-bezier(0.49, 0.55, 0.5, 0.57) } #expand.visible { width: 100%; -webkit-transform: scaleX(100%); transform: scaleX(100%); -webkit-transform-origin: right; transform-origin: right; background-color: transparent; filter: grayscale(0) } @media screen and (max-width:1023px) { #expand1, #expand { display: block; position: relative; width: 100% } } .verticle-scroller { max-height: 570px; overflow: hidden } .selected-item.active { opacity: 1 } .black-theme-section svg { position: relative; z-index: 11 } .porfolio_lising h3 { position: relative; background: transparent; color: #000; text-align: left; top: 0; padding: 25px 0 0; transform: none } .portfolio-list .our-thoughts-perspective { padding: 150px 0 400px 0 } /* .changeCursor{overflow:hidden} */ .map-section { background-image: url("https://d1qa1ziodjk9pt.cloudfront.net/images/full-map.svg"); width: 100%; min-height: 1220px; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; z-index: 11 } .map-section ul { display: flex; align-items: center; justify-content: center; text-align: center } .map-section ul li { max-width: 25%; flex: 100%; position: relative; height: 52vh } .map-section ul li .hover-map-img { opacity: 0; transition: 0.5s } .map-section ul li .hover-map-img:hover { opacity: 1; transition: 0.5s } .map-hover-card a { color: #fff; display: block; padding: 5px 0; font-size: 24px; line-height: 30px; letter-spacing: 0.50px } .map-hover-card { opacity: 0; transition: 0.5s } .map-hover-card .map-user-img { display: block; margin: 20px auto } .map-text-card a { font-size: 14px; line-height: 24px; letter-spacing: 2px; color: #fff } .map-section ul li .map-li-4 .hover-map-img { width: 188px; fill: #373737; transition: 0.5s; position: absolute; height: 100%; top: 379px; left: 117px } .map-text-card4 { color: #fff; position: absolute; top: auto; bottom: 121px; z-index: 111; left: 0 } .map-li-4 { position: absolute; top: -206px; right: auto; left: -209px; bottom: auto; width: 100%; height: 100vh } .map-section ul li .map-li-4 .map-text-card4 span { width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-bottom: 22px solid #f06472; position: absolute; bottom: -40px } .map-section ul li .map-li-4 .map-hover-card4 { opacity: 0; transition: 0.5s; position: absolute; top: auto; left: 0; bottom: 170px; right: 100px; min-height: 200px; z-index: 1111 } .map-card4:hover .map-hover-card4, .map-card4:hover .map-hover-card4 span { opacity: 1; transition: 0.5s } .map-li-4:hover .map-text-card4 div { opacity: 0; transition: 0.5s } .map-li-4:hover .map-text-card4 span { border-bottom: 22px solid #fff !important; opacity: 1; transition: 0.5s } .map-section ul li .map-li-4:hover .map-hover-card4 { opacity: 1 } .map-section ul li .map-li-3 .hover-map-img { width: 115px; fill: #373737; transition: 0.5s; position: absolute; height: 100%; top: 0; left: 0 } .map-text-card3 { color: #fff; position: absolute; top: 500px; bottom: auto; z-index: 111; left: -85px } .map-li-3 { position: absolute; top: -164px; right: auto; left: -20px; bottom: auto; width: 100%; height: 100vh } .map-section ul li .map-li-3 .map-text-card3 span { width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-bottom: 22px solid #f06472; position: absolute; bottom: -40px } .map-section ul li .map-li-3 .map-hover-card3 { opacity: 0; transition: 0.5s; position: absolute; top: 250px; left: -230px; bottom: auto; right: 0; min-height: 200px; z-index: 1111 } .map-card3:hover .map-hover-card3, .map-card3:hover .map-hover-card3 span { opacity: 1; transition: 0.5s } .map-li-3:hover .map-text-card3 div { opacity: 0; transition: 0.5s } .map-li-3:hover .map-text-card3 span { border-bottom: 22px solid #fff !important; opacity: 1; transition: 0.5s } .map-section ul li .map-li-3:hover .map-hover-card3 { opacity: 1 } .map-section ul li .map-li-2 .hover-map-img { width: 550px; fill: #373737; transition: 0.5s; position: absolute; height: 100%; top: 0; left: 0 } .map-text-card2 { color: #fff; position: absolute; top: 608px; bottom: auto; z-index: 111; left: 130px } .map-li-2 { position: absolute; top: -230px; right: 0; left: -343px; bottom: auto; width: 100%; height: 100vh } .map-section ul li .map-li-2 .map-text-card2 span { width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-bottom: 22px solid #f06472; position: absolute; bottom: -40px } .map-section ul li .map-li-2 .map-hover-card2 { opacity: 0; transition: 0.5s; position: absolute; top: 340px; left: -280px; bottom: auto; right: 0; min-height: 200px; z-index: 1111 } .map-card2:hover .map-hover-card2, .map-card2:hover .map-hover-card2 span { opacity: 1; transition: 0.5s } .map-li-2:hover .map-text-card2 div { opacity: 0; transition: 0.5s } .map-li-2:hover .map-text-card2 span { border-bottom: 22px solid #fff !important; opacity: 1; transition: 0.5s } .map-section ul li .map-li-2:hover .map-hover-card2 { opacity: 1 } .map-section ul li .map-li-1 .hover-map-img { width: 375px; fill: #373737; transition: 0.5s; position: absolute; height: 100%; top: 0; left: 0 } .map-text-card1 { color: #fff; position: absolute; top: 80px; bottom: auto; z-index: 111; left: -70px } .map-li-1 { position: absolute; top: -60px; right: auto; left: 158px; bottom: auto; width: 100%; height: 24vh } .map-section ul li .map-li-1 .map-text-card1 span { width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-bottom: 22px solid #f06472; position: absolute; bottom: -40px } .map-section ul li .map-li-1 .map-hover-card1 { opacity: 0; transition: 0.5s; position: absolute; top: 190px; left: -230px; bottom: auto; right: 0; min-height: 200px; z-index: 1111 } .map-card1:hover .map-hover-card1, .map-card1:hover .map-hover-card1 span { opacity: 1; transition: 0.5s } .map-li-1:hover .map-text-card1 div { opacity: 0; transition: 0.5s } .map-li-1:hover .map-text-card1 span { border-bottom: 22px solid #fff !important; opacity: 1; transition: 0.5s } .map-section ul li .map-li-1:hover .map-hover-card1 { opacity: 1 !important } .map-section ul li:first-child { height: 52vh; z-index: 99; top: 480px } .map-section-mobile a { font-size: 16px; line-height: 24px; letter-spacing: 2px; color: #fff; opacity: 0.5; display: block } .map-section-mobile ul li { padding-bottom: 20px } .map-section-mobile h3 { color: #fff; padding: 10px 0; font-size: 25px } .parent-class-add { transform: none !important } .scroller-y-none { display: none !important } .data-scroller { background-color: #f3f3f3 } .data-scroller #app { position: relative; z-index: 11 } .home-sandcup-text { font-size: 14px; line-height: 48px; letter-spacing: 5px; font-weight: 300; color: #fff; position: absolute; left: calc(50% - 865px); bottom: 120px; transform: rotate(-90deg); text-transform: uppercase } .team-partners { padding: 0 0 150px 0; clear: both } .team-partners .content-width { position: relative; z-index: 11 } .team-partners .row { display: flex; flex-wrap: wrap } .team-partners .row .column-50 { max-width: 50%; flex: 50% } .team-partners .row .column-50:nth-child(2n+2) { padding-top: 280px; padding-bottom: 30px } .team-partners .team-card { display: flex; flex-wrap: wrap; align-items: center; justify-content: center } .team-partners .team-card .team-card-img { width: 280px; height: 280px; position: relative; border-radius: 50%; overflow: hidden } .team-partners .team-card .team-card-img img { position: absolute; width: 100%; height: 100% } .team-partners .team-card .team-card-img .card-hover-img { transition: opacity 1s; -webkit-transition: opacity 1s; opacity: 0 } .team-partners .team-card .team-card-img:hover .card-hover-img { transition: opacity 1s; -webkit-transition: opacity 1s; opacity: 1 } .team-partners .team-card .team-card-img:hover .card-normal-img { transition: opacity 1s; -webkit-transition: opacity 1s; opacity: 0 } .team-partners .team-card .team-card-content { padding-left: 50px } .team-partners .team-card .team-card-content a { display: inline-block } .team-partners .team-card .team-designation { font-size: 25px; padding-bottom: 20px; line-height: 35px; max-width: 250px } .team-partners .team-card .team-title { font-size: 35px; padding-bottom: 40px; line-height: 35px; max-width: 250px } .our-sub-team-section .content-width { position: relative; z-index: 11; max-width: calc(100vw / 2 + 835px / 1.5) } .our_team_list { display: flex; flex-wrap: wrap; justify-content: center } .our_team_item { margin: 0 3.5% 2.2em; width: 10%; padding-bottom: 10%; height: 0; border-radius: 50%; overflow: hidden; position: relative; -webkit-transition: transform .4s ease; -moz-transition: transform .4s ease; -ms-transition: transform .4s ease; -o-transition: transform .4s ease; transition: transform .4s ease } .our_team_item:hover { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2) } .our_team_bleak { flex-basis: 100% } .our_team_info { position: absolute; text-align: center; width: 100%; left: 0; bottom: -100px; font-weight: bold; line-height: 1.6; z-index: 6 } .our_team_name { font-size: 1.4vw; line-height: 35px; padding-bottom: 10px } .our_team_position { font-size: .98vw; color: #f06472 } .our_team_item img { display: block; -webkit-transition: opacity .4s ease; -moz-transition: opacity .4s ease; -ms-transition: opacity .4s ease; -o-transition: opacity .4s ease; transition: opacity .4s ease; position: absolute; z-index: 1; top: 0; left: 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden } .our_team_hover_img { opacity: 0; z-index: 2 } .our_team_item:hover .our_team_hover_img { opacity: 1 } .parallax_box { position: absolute; top: 0; text-align: center; margin: 0 auto; left: 0; right: 0; z-index: -1 } .bio_title { position: absolute; top: 110px; left: 0; right: 0; bottom: 0; margin: auto; text-align: center; font-weight: bold; line-height: 0.95; color: #f06472; opacity: 0.2; max-width: 70%; font-size: 9.02vw } .get-back-section .content-width { position: relative; z-index: 11 } .our-sub-team-section { padding: 0 0 210px 0 } .team-form h2 { text-align: center; color: #fff } .get-in-touch-form .input-group { display: flex; justify-content: flex-end; padding-bottom: 0 } .get-in-touch-form .input-group .effect-16 { padding: 15px 0; width: 100%; color: #fff } .get-in-touch-form .effect-16~.focus-border { background-color: #fff; bottom: 6px } .get-in-touch-form .effect-16~label { color: #fff !important } .get-in-touch-form .selected-item { color: #fff !important; padding: 10px 0 } .get-in-touch-form .custom-select { margin: -5px 0 5px 0; border-bottom: 1px solid #fff } .get-in-touch-form .btn-send { color: #fff; margin-right: 3% } .send-button { margin-right: 4% } .team-form p { color: #fff; text-align: center } .team-form-submit-msg { max-width: 1250px; margin: 0 auto; text-align: center; font-size: 18px; line-height: 50px; color: #fff } .get-back-section .team-form-submit-msg { padding-top: 50px } .team-form-submit-msg h3 { color: #fff } .team-form-submit-msg ul { padding-top: 20px } .team-form-submit-msg ul li { line-height: 30px } .content-wrapper .contact-form-submit-msg { text-align: center; padding-top: 90px } .content-wrapper .contact-form-submit-msg p { color: #000; font-size: 18px } .content-wrapper .contact-form-submit-msg ul li { color: #000; font-size: 18px; line-height: 30px } .js-page-content a { color: #fff !important } .c-fluid-reveal { --fluid-reveal-section-height: 140vh; height: calc(var(--fluid-reveal-section-height) * var(--items)) } .c-fluid-reveal__inner { display: block; min-height: 100vh; width: 100% } .c-fluid-reveal__item { align-content: center; display: grid; grid-auto-flow: column; grid-gap: 0rem; grid-template-columns: 3fr 2fr; grid-template-rows: 1fr; margin: 0; position: absolute; top: 0; width: 100%; background-color: #141414; color: #fff; overflow: hidden; height: auto } .c-fluid-reveal__item-media { display: block; margin-top: 0; overflow: visible; top: 0; right: 0; left: auto; width: 100%; object-fit: cover; position: relative; z-index: 1 } svg.c-fluid-reveal__item-media { width: calc(100vw - 50vw); height: 100%; object-fit: cover; object-position: center } svg.c-fluid-reveal__item-media img { height: 100vh; width: 100vw; object-fit: cover } .c-fluid-reveal__item-media #mask-1, .c-fluid-reveal__item-media #mask-2, .c-fluid-reveal__item-media #mask-3, .c-fluid-reveal__item-media #mask-4 { width: 100%; height: 100% } .c-fluid-reveal__content { align-content: center; display: grid; grid-column: 2 / 1; max-height: 100vh; will-change: opacity, transform; padding-left: calc(50% - 265px); padding-top: calc(50% - 265px); color: #fff; z-index: 11; overflow: hidden; transform: translate(0%, -0.6541%) translate3d(0px, 0px, 0px) !important } .c-fluid-reveal__content_sub { overflow: hidden; padding: 20px 0 } .c-fluid-reveal__content h2 { font-size: 5.208333333333333vw; color: #fff; font-weight: 700; line-height: normal; text-transform: capitalize; letter-spacing: 1px } .c-fluid-reveal__content p { font-size: 1.3vw; line-height: 35px; max-width: 35vw; padding-bottom: 50px; font-weight: 300; letter-spacing: 1px; min-height: 155px } .c-fluid-reveal__content .default-button.theme-white { color: #fff } .c-fluid-reveal__content .default-button.theme-white .button-background .center, .c-fluid-reveal__content .default-button.theme-white .button-background .left:before, .c-fluid-reveal__content .default-button.theme-white .button-background .right:before { background: #373737 } .c-fluid-reveal__content .default-button.theme-white .plus-icon:after, .c-fluid-reveal__content .default-button.theme-white .plus-icon:before, .c-fluid-reveal__content .default-button.theme-white .plus-icon:after, .c-fluid-reveal__content .default-button.theme-white .plus-icon:before { background-color: #fff } .services-title { padding: 13.5em 0 0 13em } .home-page .pin-spacer { /* height:616vh!important;*/ height: auto; z-index: 11 !important } .gallery.grid-gallery { left: 50%; position: relative; transform: translateX(-50%); display: flex; width: 150vw } .gallery.grid-gallery .photo-grid { flex: 0 0 25%; position: relative; padding: 5px } .gallery.grid-gallery .photo-grid:nth-child(2), .gallery.grid-gallery .photo-grid:nth-child(4) { top: -20vw } .gallery.grid-gallery { padding-top: 30vw } .gallery.grid-gallery figure { padding-bottom: 5px } .career-big-photo { margin-top: -40vw } .our-hiring-requirement .content-width { position: relative; z-index: 11 } .our-hiring-requirement { padding: 6vw 0 } .careers__grid-inner { display: flex } .our-hiring-requirement .careers__grid-item { max-width: 33%; flex: 33%; padding: 2vw; box-shadow: 0px 0px 10px 0px #c1c1c1; border-radius: 10px; transition: 1s; margin: 0 20px; cursor: pointer } .our-hiring-requirement .careers__grid-item:hover { transform: scale(1.1); transition: 1s } .our-hiring-requirement .careers__grid-item .careers__grid-title { font-size: 1.2vw; line-height: 2.5vw } .our-hiring-requirement .careers__grid-item .position__city { font-size: 1vw; color: #c1c1c1 } .our-hiring-requirement .careers__grid-item .careers__grid-description { padding: 20px 0; line-height: 20px } .our-hiring-requirement .careers__grid-item a { color: #000 } .carrers-content-box .content-width { position: relative; z-index: 11 } .p_pb { padding-bottom: 54px !important; } .extra_pb { padding-bottom: 80px !important; } .carrers-content-box .job-descriptions { display: flex; gap: 50px; } .carrers-content-box .job-descriptions .job-description-item { max-width: 50%; flex: 50%; padding: 0; } .carrers-content-box .job-descriptions .job-description-item h3 { padding: 0 0 30px; line-height: 45px } .carrers-content-box .job-descriptions .job-description-item p { font-size: 18px; line-height: 27px; position: relative; padding: 20px 0 30px 0; min-height: 50px } .carrers-content-box .job-descriptions .job-description-item p::before { content: ""; width: 80px; height: 1px; position: absolute; top: 0; left: 0; background: #c1c1c1 } .g-recaptcha { display: flex; justify-content: center; } .applying-section { padding: 60px 0; position: relative; margin: 120px 0 0 0 } /* .applying-section::after{content:"";position:absolute;top:12vh;width:100%;min-height:30vh;background-color:#c1c1c147} */ .applying-section .content-width { position: relative; z-index: 11 } .applying-section h2 { font-size: 5vw; color: #f06472; font-weight: normal; line-height: normal; margin: 0; text-align: center; padding-bottom: 50px } .applying-section { font-size: 1vw } .applying-section .applying-sec-sub span, .applying-section .applying-sec-sub p { text-align: center; font-size: 25px; display: block; padding: 0 0 50px 0 } .applying-section .all-items { top: 45px } div#popup2 { padding: 30px; background: #fff; border-radius: 5px; min-width: 500px } div#popup2 h3 { text-align: center; font-weight: 300; font-size: 35px; line-height: 42px; margin-bottom: 30px } #home_subscribe_form .input-group-col.col-3 { width: 100%; margin: 20px 0 30px 0 } #home_subscribe_form .input-group-col input { width: 100%; padding: 5px 10px; min-height: 40px; color: #333 !important; font-weight: 700; font-size: 18px !important; background: #f6f6f6; color: #999; border: 2px solid transparent; border-radius: 6px; padding: 1rem 1.4rem .6rem 1.4rem; -webkit-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; border: 2px solid transparent } #tabs { position: relative; height: 40px; width: 900px; margin: 0 auto; border-radius: 5px; padding: 0 } #tabs ul { position: absolute; list-style: none; display: flex } #tabs li.tab1 .tab, #tabs li.tab2 .tab, #tabs li.tab3 .tab, #tabs li.tab4 .tab { z-index: 2; line-height: 40px; width: auto; text-transform: uppercase; font-size: 14px; letter-spacing: 2px; opacity: 30% } /**L S***/ #tabs .tabcontent { position: absolute; z-index: 1; height: 60px; width: auto; top: 50px; left: 0 } /**L E***/ #tabs .tabcontent p { line-height: 36px; font-size: 18px; letter-spacing: 0.5px; font-weight: 300; margin: 0 } #tabs li.tab1:hover .tab, #tabs li.tab2:hover .tab, #tabs li.tab3:hover .tab, #tabs li.tab4:hover .tab { z-index: 2; color: #000 } #tabs li.tab1:hover, #tabs li.tab2:hover, #tabs li.tab3:hover, #tabs li.tab4:hover { z-index: 2; font-weight: normal; color: #fff } li.tab1:first-child { width: auto } #tabs li.tab1 .tabcontent, #tabs li.tab2 .tabcontent, #tabs li.tab3 .tabcontent, #tabs li.tab4 .tabcontent { opacity: 0 } #tabs:hover .tabcontent, #tabs:focus .tabcontent, #tabs:active .tabcontent { opacity: 0; -webkit-transition: opacity 0s ease-in } #tabs li.tab1:hover .tabcontent, #tabs li.tab1:focus .tabcontent, #tabs li.tab1:active .tabcontent, #tabs li.tab2:hover .tabcontent, #tabs li.tab2:focus .tabcontent, #tabs li.tab2:active .tabcontent, #tabs li.tab3:hover .tabcontent, #tabs li.tab3:focus .tabcontent, #tabs li.tab3:active .tabcontent, #tabs li.tab4:hover .tabcontent, #tabs li.tab4:focus .tabcontent, #tabs li.tab4:active .tabcontent { z-index: 3; color: black; opacity: 1; -webkit-transition: opacity 0s ease-in } .home-page #tabs li .tab { color: #fff; opacity: 30% } .home-page #tabs li .tab:hover, .home-page #tabs li .tab:focus { color: #fff; opacity: 1 } .home-page #tabs .tabcontent p { color: #fff; opacity: 30% } .home-page #tabs li.active .tab { color: #f06472; opacity: 1 } .menu-social-box p { margin: 0; padding: 0 } .padding_tb_non { padding: 20px 0 } .team_certificat { background: #141414 } .team_certificat h6 { color: #FFF; padding: 0 0 25px; margin: 0 } .team_certificat .default-button.animate .text { color: #FFF } .team_certificat .default-button.theme-white .button-background .center, .team_certificat .default-button.theme-white .button-background .left:before, .team_certificat .default-button.theme-white .button-background .right:before { background: #373737 } .team_certificat .default-button.theme-white .plus-icon:after, .team_certificat .default-button.theme-white .plus-icon:before { background: #FFF } .team_certificat .meet-our-client .js-marquee .item img { max-width: 250px; min-width: 100px; opacity: 0.70 } .team_certificat .meet-our-client .js-marquee { width: 230vw } /*Team Block*/ .team-block { padding-bottom: 90px; padding-top: 60px; position: relative; z-index: 11 } .team-block [class*='col-'] { padding-bottom: 15px; padding-top: 15px } .lets-make-thing h2 { font-size: 60px !important; } @media (max-width:991.98px) { .lets-make-thing h2 { font-size: 40px !important; } .team-block [class*='col-']:nth-child(even) { clear: left } } @media (min-width:992px) and (max-width:1199.98px) { .team-block [class*='col-']:nth-child(4n+2) { clear: left } } .team-block img { height: 100%; width: 100%; object-fit: cover } .team-block figure { position: relative; padding: 0 0 74px; float: left; width: 100% } .team-block figcaption { position: absolute; bottom: 0; width: 100%; text-align: center; z-index: 2 } .team-block figcaption .heading-quaternary { display: block; line-height: normal; font-size: 48px; font-family: 'Brittany Signature'; color: rgba(20, 20, 20, 0.50); background: linear-gradient(to top, #000000 44px, #ffffff 44px, #ffffff 200px, #ffffff 300px, #000000 0%); color: transparent; -webkit-background-clip: text; background-clip: text } .team-block .heading-quinary { text-transform: uppercase; font-size: 14px; letter-spacing: 2.50px; color: #141414; white-space: nowrap; display: block; padding: 0 0 15px } @media (max-width:991.98px) { .team-block .heading-quinary { white-space: normal } } .team-block .team-card { padding-bottom: 100%; position: relative; width: 100% } .team-block .team-card:hover .card-front { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg) } .team-block .team-card:hover .card-back { -webkit-transform: rotateY(0); transform: rotateY(0) } .team-block .no-effect .team-card:hover .card-front { -webkit-transform: rotateY(0); transform: rotateY(0); -moz-transform: rotateY(0); -ms-transform: rotateY(0); -o-transform: rotateY(0) } .team-block .no-effect .team-card:hover .card-back { -webkit-transform: rotateY(0); transform: rotateY(0); -moz-transform: rotateY(0); -ms-transform: rotateY(0); -o-transform: rotateY(0) } .team-block .team-card .card-front, .team-block .team-card .card-back { bottom: 0; left: 0; position: absolute; right: 0; top: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: 0.3s; transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s } .team-block .team-card .card-front:after { content: ""; background: rgba(0, 0, 0, 0.20); position: absolute; top: 0; left: 0; right: 0; bottom: 0 } @media screen and (prefers-reduced-motion:reduce) { .team-block .team-card .card-front, .team-block .team-card .card-back { -webkit-transition: none; transition: none } } .team-block .team-card .card-back { overflow: hidden; -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg) } .team-block .team-card .card-back img { bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100% } .team-block .hire-block { display: block; position: relative; width: 100%; -webkit-transition: 0.3s; transition: 0.3s } @media screen and (prefers-reduced-motion:reduce) { .team-block .hire-block { -webkit-transition: none; transition: none } } .team-block .hire-block:hover { opacity: .7 } .team-block .hire-block .hire-content { bottom: 25px; color: #fff; display: block; font-size: 25px; left: 15px; position: absolute; text-align: left; z-index: 9 } .left_align { object-position: left; } .right_align { object-position: right; } @media (min-width:768px) and (max-width:1199.98px) { .team-block .hire-block .hire-content { left: 25px } } @media (min-width:1200px) { .team-block .hire-block .hire-content { bottom: 30%; font-size: 32px; left: 30px } .greatplace img { width: 2.5em; } } .team-block .hire-block .hire-content:after { background: rgba(255, 255, 255, 0.3); content: ''; display: block; height: 10px; position: absolute; bottom: 0; left: 0; width: 100%; z-index: -1 } @media (min-width:576px) { .team-block .hire-block .hire-content:after { bottom: 2px } } .team-block .section-number-wrap { text-align: left } @media (min-width:1400px) { .team-block .section-number-wrap .section-number { top: 92px } } .explore-block { overflow: hidden } @media (min-width:1675px) { .explore-block .section-number.screen-lg { top: 40px } /* .greatplace img { width: 4.8em; } */ } .explore-block .work-wrap { float: right; padding-bottom: 15px } @media (min-width:768px) { .explore-block .work-wrap { float: left; padding-bottom: 0 } } .explore-block .client-wrap { float: left } @media (min-width:768px) { .explore-block .client-wrap { float: right } } @media (min-width:576px) { .explore-block .explore-body { max-width: 85% } } @media (min-width:1400px) { .explore-block .explore-body { max-width: 45% } } .explore-block .explore-feature { position: relative } @media (max-width:767.98px) { .explore-block .explore-feature { display: none } .applying-section { margin: 0 } } .explore-block .explore-feature .explore-img { height: auto; width: 100% } @media (min-width:768px) { .explore-block .explore-feature .explore-img { bottom: 0; left: 0; max-width: 850px; position: absolute; right: 0; top: 0; width: auto } } .explore-block .explore-feature .explore-img-offset { bottom: 0; left: -10%; position: absolute; z-index: 9 } @media (max-width:767.98px) { .explore-block .explore-feature .explore-img-offset { display: none } .carrers-content-box .job-descriptions .job-description-item h3 { font-size: 25px } } .team-block .row-item { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; padding: 20px 20px } .team-block .team-row { text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -25px; margin-left: -25px } .applying-sec-sub { text-align: center; padding-top: 20px } .applying-section .effect-16 { padding: 15px 0; position: relative; z-index: 11; width: 100%; font-size: 18px } /* .applying-section .arow-submit-button{padding-right:30px} */ .applying-section .selected-item { padding: 8px 10px; line-height: 29px; min-height: 20px } .applying-section .input-group { display: flex; justify-content: center } .applying-section .input-group .input-col { max-width: 33%; flex: 33%; padding: 0 25px 50px 25px } @media screen and (max-width:767px) { .applying-section .input-group .input-col { max-width: 100% !important; flex: 100% !important; padding: 0 0 50px 0 !important } } @media screen and (max-width:1023px) { .applying-section .input-group { flex-wrap: nowrap } .applying-section .input-group .input-col { max-width: 45%; flex: 45%; padding: 0 0 50px 0; margin: 0 5px } .applying-section .effect-16 { padding: 15px 10px } } @media screen and (max-width:767px) { .applying-section .input-group { flex-wrap: wrap } .applying-section .input-group .input-col { max-width: 100%; flex: 100%; padding: 0 0 50px 0 } .applying-section .effect-16 { padding: 15px 10px } } .applying-section .input-group { display: flex; justify-content: center } .applying-section .input-group .input-col { max-width: 33%; flex: 33%; padding: 0 25px 50px 25px } .applying-section .arow-submit-button { justify-content: center } .applying-section .file-uploading { width: 100%; margin: 0 } .applying-section .file-uploading .form-controls { width: 100%; padding: 5px } .what-we-deliver { padding: 0 0 150px 0 } .what-we-deliver .content-width { position: relative; z-index: 111; max-width: 1528px } .what-we-deliver .flex { display: flex; gap: 3em; justify-content: center; flex-flow: row wrap } .what-we-deliver .flex>* { flex-grow: 1; flex-basis: 0 } .what-we-deliver .card { display: flex; flex-direction: column; min-width: 25rem; max-width: calc(12.5rem + 15vw); background: #fff; border-radius: 0; overflow: hidden; box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.1); transition: transform 270ms ease; position: relative } .what-we-deliver .card:hover::before { opacity: 1 } .what-we-deliver .card:hover { transform: scale(1.05) } .what-we-deliver img { display: block; max-width: 100%; aspect-ratio: 16 / 9; object-fit: cover; height: auto; margin-bottom: 1em } .what-we-deliver .card-body { height: auto; padding: 1em 1.5em } .what-we-deliver h3 { text-align: left; color: #f06472; font-size: 1rem; margin-bottom: 0.5rem; text-transform: uppercase } .what-we-deliver p { color: #141414; font-style: normal; font-weight: 700; text-align: left } .comming-soon { display: flex; align-items: flex-end; justify-content: center; min-height: 50vh } .comming-soon h1 { font-size: 5vw } .overlay-menu ul li ul { visibility: hidden; opacity: 0; display: none } .overlay-menu ul li a:hover>ul, .overlay-menu ul li ul:hover { visibility: visible; opacity: 1; display: block } .overlay-menu .menu-social-icon { padding-top: 80px !important; } .meet-our-team { text-align: center; padding-top: 60px } .our_values { float: left; width: 100%; padding: 140px 0; position: relative; z-index: 22; background-color: #f3f3f3; overflow: hidden } .our_values .content-width { max-width: 940px } .our_values .sticky_title { float: left; max-width: 410px; position: -webkit-sticky; position: sticky; top: 50px } .our_values .sticky_title h2 { font-weight: 300; font-size: 35px; line-height: 48px; margin: 0; letter-spacing: 1px } .our_values .sticky_title h2 span { font-size: 14px; letter-spacing: 2.5px; display: block; text-transform: uppercase; padding: 0 0 35px; font-weight: 600 } .our_values .floatR { float: right; max-width: 410px; position: relative; z-index: 22 } .our_values .floatR ul { float: left; width: 100% } .our_values .floatR ul li { float: left; width: 100%; margin-bottom: 65px } .our_values .floatR ul li:last-child { margin: 0 } .our_values .floatR ul li h3 { font-weight: 400; font-size: 18px; line-height: 30px; letter-spacing: 2.5px; margin: 0 0 3px; text-transform: uppercase; color: #141414 } .our_values .floatR ul li p { font-weight: 300; font-size: 18px; line-height: 30px; letter-spacing: 0.75px; color: #141414 } .our_values .value-circle { width: 1000px; height: 1000px; background: #FFF; border-radius: 50%; opacity: 0.30 } .our_values .circle-container { position: absolute; top: -40%; left: 0; right: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; opacity: 1 !important } .home_service_section .our_values .content-width { max-width: 1300px } .home_service_section .our_values .floatR { max-width: 700px } .home_service_section .our_values .floatR ul li h3 { font-size: 30px; line-height: 40px; margin-bottom: 25px; color: #fff; font-weight: 600 } .home_service_section .our_values .floatR ul li p { color: #ffffff94; font-size: 20px } .home_service_section .our_values { background-color: transparent } .home_service_section { background-color: #141414 } .home_service_section .our_values .sticky_title h2 { color: #fff } .home_service_section .our_values .value-circle { background-color: #ffffff3d } .home_service_section .our_values .floatR ul li { min-height: 35vh } .home_service_section .default-button.theme-white { color: #ffffff94; margin-top: 20px } .home_service_section .default-button.theme-white .button-background .center, .home_service_section .default-button.theme-white .button-background .left:before, .home_service_section .default-button.theme-white .button-background .right:before { background-color: #373737 } .home_service_section .default-button.theme-white .plus-icon:after, .home_service_section .default-button.theme-white .plus-icon:before { background-color: #ffffff94 } .home_service_section .our_values { z-index: 11 } .banner_wrapper { position: relative; z-index: 22; width: 100%; float: left; padding: 140px 0 0; margin: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none } .banner_wrapper h2 { font-weight: 300; font-size: 35px; line-height: 48px; margin: 0; letter-spacing: 1px; text-align: center; padding: 0 0 60px } .banner_wrapper h2 span { font-size: 14px; letter-spacing: 2.5px; display: block; text-transform: uppercase; padding: 0 0 35px; font-weight: 600 } .banner_wrapper .swiper-slide { text-align: center; display: flex; justify-content: center; align-items: center; height: 550px; overflow: hidden } .banner_wrapper .swiper-slide img { display: block; margin: 0 auto } .banner_wrapper .swiper { padding: 0 0 80px } .banner_wrapper>.text_btn { text-align: center } .banner_wrapper>.text_btn a { margin: 0 auto } :root { --swiper-theme-color: #f06472 } .swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1 } .swiper-vertical>.swiper-wrapper { flex-direction: column } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box } .swiper-android .swiper-slide, .swiper-wrapper { transform: translate3d(0px, 0, 0) } .swiper-pointer-events { touch-action: pan-y } .swiper-pointer-events.swiper-vertical { touch-action: pan-x } .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform } .swiper-slide-invisible-blank { visibility: hidden } /* Auto Height */ .swiper-autoheight, .swiper-autoheight .swiper-slide { height: auto } .swiper-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height } /* 3D Effects */ .swiper-3d, .swiper-3d.swiper-css-mode .swiper-wrapper { perspective: 1200px } .swiper-3d .swiper-wrapper, .swiper-3d .swiper-slide, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-cube-shadow { transform-style: preserve-3d } .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10 } .swiper-3d .swiper-slide-shadow { background: rgba(0, 0, 0, 0.15) } .swiper-3d .swiper-slide-shadow-left { background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)) } .swiper-3d .swiper-slide-shadow-right { background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)) } .swiper-3d .swiper-slide-shadow-top { background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)) } .swiper-3d .swiper-slide-shadow-bottom { background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)) } /* CSS Mode */ .swiper-css-mode>.swiper-wrapper { overflow: auto; scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ } .swiper-css-mode>.swiper-wrapper::-webkit-scrollbar { display: none } .swiper-css-mode>.swiper-wrapper>.swiper-slide { scroll-snap-align: start start } .swiper-horizontal.swiper-css-mode>.swiper-wrapper { scroll-snap-type: x mandatory } .swiper-vertical.swiper-css-mode>.swiper-wrapper { scroll-snap-type: y mandatory } .swiper-centered>.swiper-wrapper::before { content: ''; flex-shrink: 0; order: 9999 } .swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child { margin-inline-start: var(--swiper-centered-offset-before) } .swiper-centered.swiper-horizontal>.swiper-wrapper::before { height: 100%; min-height: 1px; width: var(--swiper-centered-offset-after) } .swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child { margin-block-start: var(--swiper-centered-offset-before) } .swiper-centered.swiper-vertical>.swiper-wrapper::before { width: 100%; min-width: 1px; height: var(--swiper-centered-offset-after) } .swiper-centered>.swiper-wrapper>.swiper-slide { scroll-snap-align: center center } .swiper-virtual.swiper-css-mode .swiper-wrapper::after { content: ''; position: absolute; left: 0; top: 0; pointer-events: none } .swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after { height: 1px; width: var(--swiper-virtual-size) } .swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after { width: 1px; height: var(--swiper-virtual-size) } .swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)) } .swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none } .swiper-button-prev, .swiper-rtl .swiper-button-next { left: 10px; right: auto } .swiper-button-next, .swiper-rtl .swiper-button-prev { right: 10px; left: auto } .swiper-button-lock { display: none } .swiper-pagination { position: absolute; text-align: center; transition: 300ms opacity; transform: translate3d(0, 0, 0); z-index: 10 } .swiper-pagination.swiper-pagination-hidden { opacity: 0 } /* Bullets */ .swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0 } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transform: scale(0.33); position: relative } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active { transform: scale(1) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { transform: scale(1) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { transform: scale(0.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { transform: scale(0.33) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { transform: scale(0.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { transform: scale(0.33) } .swiper-pagination-bullet { width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px)); height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px)); display: inline-block; border-radius: 50%; background: var(--swiper-pagination-bullet-inactive-color, #000); opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2) } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer } .swiper-pagination-bullet:only-child { display: none !important } .swiper-pagination-bullet-active { opacity: var(--swiper-pagination-bullet-opacity, 1); background: var(--swiper-pagination-color, var(--swiper-theme-color)) } .swiper-vertical>.swiper-pagination-bullets, .swiper-pagination-vertical.swiper-pagination-bullets { right: 10px; top: 50%; transform: translate3d(0px, -50%, 0) } .swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet { margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0; display: block } .swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; transform: translateY(-50%); width: 8px } .swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; transition: 200ms transform, 200ms top } .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px) } .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; transform: translateX(-50%); white-space: nowrap } .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms left } .swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { transition: 200ms transform, 200ms right } /* Progress */ .swiper-pagination-progressbar { background: rgba(0, 0, 0, 0.25); position: absolute } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top } .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { transform-origin: right top } .swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0 } .swiper-vertical>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-vertical, .swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite { width: 4px; height: 100%; left: 0; top: 0 } .swiper-pagination-lock { display: none } /* Scrollbar */ .swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1) } .swiper-horizontal>.swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98% } .swiper-vertical>.swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98% } .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0 } .swiper-scrollbar-cursor-drag { cursor: move } .swiper-scrollbar-lock { display: none } .swiper-zoom-container { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; text-align: center } .swiper-zoom-container>img, .swiper-zoom-container>svg, .swiper-zoom-container>canvas { max-width: 100%; max-height: 100%; object-fit: contain } .swiper-slide-zoomed { cursor: move } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; transform-origin: 50%; animation: swiper-preloader-spin 1s infinite linear; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff } .swiper-lazy-preloader-black { --swiper-preloader-color: #000 } @keyframes swiper-preloader-spin { 100% { transform: rotate(360deg) } } .swiper .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000 } .swiper-free-mode>.swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto } .swiper-grid>.swiper-wrapper { flex-wrap: wrap } .swiper-grid-column>.swiper-wrapper { flex-wrap: wrap; flex-direction: column } .swiper-fade.swiper-free-mode .swiper-slide { transition-timing-function: ease-out } .swiper-fade .swiper-slide { pointer-events: none; transition-property: opacity } .swiper-fade .swiper-slide .swiper-slide { pointer-events: none } .swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto } .swiper-cube { overflow: visible } .swiper-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; transform-origin: 0 0; width: 100%; height: 100% } .swiper-cube .swiper-slide .swiper-slide { pointer-events: none } .swiper-cube.swiper-rtl .swiper-slide { transform-origin: 100% 0 } .swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto } .swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-next, .swiper-cube .swiper-slide-prev, .swiper-cube .swiper-slide-next+.swiper-slide { pointer-events: auto; visibility: visible } .swiper-cube .swiper-slide-shadow-top, .swiper-cube .swiper-slide-shadow-bottom, .swiper-cube .swiper-slide-shadow-left, .swiper-cube .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden } .swiper-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; opacity: 0.6; z-index: 0 } .swiper-cube .swiper-cube-shadow:before { content: ''; background: #000; position: absolute; left: 0; top: 0; bottom: 0; right: 0; filter: blur(50px) } .swiper-flip { overflow: visible } .swiper-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1 } .swiper-flip .swiper-slide .swiper-slide { pointer-events: none } .swiper-flip .swiper-slide-active, .swiper-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto } .swiper-flip .swiper-slide-shadow-top, .swiper-flip .swiper-slide-shadow-bottom, .swiper-flip .swiper-slide-shadow-left, .swiper-flip .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden } .swiper-creative .swiper-slide { -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; transition-property: transform, opacity, height } .swiper-cards { overflow: visible } .swiper-cards .swiper-slide { transform-origin: center bottom; -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden } .banner_wrapper .swiper-button-prev, .banner_wrapper .swiper-button-next { width: 40px; height: 40px } @media (max-width:767px) { .banner_wrapper .swiper-slide { min-height: 485px } } @media (max-width:600px) { .lets-make-thing h2 { font-size: 22px !important; } .banner_wrapper .swiper-slide { min-height: 330px } } @media (max-width:500px) { .banner_wrapper .swiper-slide { max-height: 400px } } .sticky-description { max-width: 30%; flex: 30%; padding: 0 40px 0 0; display: flex; flex-direction: column; justify-content: center } .scroll-testimonial { max-width: 70%; flex: 70% } .scroll-testimonial ul { display: flex; flex-wrap: wrap } .scroll-testimonial ul li { max-width: 31%; flex: 31%; border: 1px solid #0000002e; margin: 0 20px 20px 0; padding: 25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; display: flex; flex-direction: column } .testi-discription { flex-grow: 1 } .testi-discription p { line-height: 25px } .testi-photos { display: flex; align-items: center; padding: 20px 0 0 0 } .testi-img { max-width: 80px; max-height: 80px; margin-right: 20px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; overflow: hidden } .testi-photos h4 { font-size: 14px; font-weight: 400; line-height: 25px; text-transform: uppercase; letter-spacing: 1px } .sticky-description p { font-size: 35px; line-height: 48px } .meet-our-valuable-partner #partner-slider .owl-item img { width: 90px; max-width: 90px } .meet-our-valuable-partner #partner-slider .item { min-height: 200px } .team_certificat .meet-our-valuable-partner { position: relative; z-index: 111 } .team_certificat .meet-our-valuable-partner #partner-slider .owl-item img { width: 160px; max-width: 160px } .services-page .meet-our-valuable-partner #partner-slider .owl-item img { width: 100px; max-width: 100px } .carrers_text_section .content-width { max-width: 940px } .carrers_text_section .default-button { margin-top: 0 } .careers_value { overflow: hidden; z-index: 11 } .careers_value .content-width { max-width: calc(100vw / 2 + 850px / 1.5) } .careers_value .sticky_title { max-width: 650px } .careers_value .floatR { max-width: 660px; width: 100% } .careers_value .floatR ul li { border-top: solid 1px #b0b0b0; border-bottom: solid 1px #b0b0b0; margin: -1px 0 0; padding: 0; min-height: 180px; position: relative } .careers_value .floatR ul li h3 span { color: #fe6571 } .careers_value .floatR ul li .front { position: absolute; left: 0; top: 50%; transform: translateY(-50%); padding: 40px 110px 40px 0; z-index: 1; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out } .careers_value .floatR ul li .front a { display: block } .careers_value .floatR ul li .front a.link { position: absolute; right: 15px; top: 50%; transform: translateY(-50%) rotate(-45deg); color: #141414; line-height: 24px; font-size: 18px } .careers_value .floatR ul li .back { opacity: 0; position: absolute; left: 0; top: 50%; transform: translateY(-50%); padding: 0 200px 0 0; width: 100%; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out } .careers_value .floatR ul li .back a { position: absolute; right: 15px; top: 50%; transform: translateY(-50%) } .careers_value .floatR ul li p.text_box { text-transform: uppercase; font-size: 14px; letter-spacing: 2px } .careers_value .floatR ul li p.text_box span { color: #fe6571 } .careers_value .floatR ul li:hover .back { opacity: 1; z-index: 2; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out } .careers_value .floatR ul li:hover .front { opacity: 0; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out } .careers_value .floatR ul li p { padding: 0 } .career_gallery { padding: 160px 0 } .career-process { z-index: 11 } .perks_section .sticky_title1 { float: left; max-width: 410px; position: -webkit-sticky; position: sticky; top: 50px } .perks_section .sticky_title1 h2 { font-weight: 300; font-size: 35px; line-height: 48px; margin: 0; letter-spacing: 1px } .perks_section .sticky_title1 h2 span { font-size: 14px; letter-spacing: 2.5px; display: block; text-transform: uppercase; padding: 0 0 35px; font-weight: 600 } .perks_section .perks-circle { width: 1000px; height: 1000px; background: #FFF; border-radius: 50%; opacity: 0.30 } .perks_section .circle-container1 { position: absolute; top: -40%; left: 0; right: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; opacity: 1 !important } .team_certificat #partner-slider .item { opacity: 0.5 } .team_certificat #partner-slider .owl-item.active.center .item { opacity: 1 } .employee-testimonials { padding: 120px 0 } .employee-testimonials .content-width { position: relative; z-index: 11; max-width: 940px } #testimonial-area .section-heading h2 { font-size: 48px; line-height: 58px } #testimonial-area>h3 { font-size: 14px; letter-spacing: 2.5px; color: #141414; position: absolute; left: 54.555%; top: 60px; display: block; text-transform: uppercase; padding: 0 0 35px; font-weight: 600; margin: 0; padding: 0 } .testi-wrap { position: relative; height: 600px } .testi-wrap:after { content: ""; position: absolute; top: 0; bottom: 0; left: 55%; transform: translateX(-55%); width: 1px; height: 100%; background: #b8b8b8; margin: 0 0 0 -60px } .client-single { width: 100px; height: 100px; text-align: left; position: absolute } .client-single .client-img { width: 100px; height: 100px; overflow: hidden; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; cursor: pointer } .client-single .client-comment { max-width: 410px; padding: 25px 0 0; position: absolute; top: 50%; right: 0; opacity: 0; visibility: hidden; -webkit-transform: scale(0) translateY(-50%); transform: scale(0) translateY(-50%) } .client-single .client-comment p { font-size: 24px; line-height: 36px; color: #141414; font-weight: 300; padding: 0 0 60px } .client-single .client-comment h3 { font-size: 48px; line-height: 48px; color: #fe6571; font-family: 'Brittany Signature'; margin: 0 } .client-single .client-comment h3 span { font-size: 14px; line-height: 48px; color: #141414; letter-spacing: 2.5px; font-family: 'Josefin Sans', sans-serif; display: block; font-weight: 400; text-transform: uppercase } .client-single:not(.active) { z-index: 99 } .client-single.active { width: 100%; height: 100% } .client-single.active .client-img { width: 160px; height: 160px; position: absolute; top: 50%; transform: translateY(-50%); left: 20% } .client-single.active .client-comment { opacity: 1; visibility: visible; -webkit-transform: scale(1) translateY(-50%); transform: scale(1) translateY(-50%); -webkit-transition: all 1s ease; transition: all 1s ease } .client-single.position-2 { top: 30px; left: 250px } .client-single.position-3 { top: 130px; left: 50px } .client-single.position-4 { top: 380px; left: 50px } .client-single.position-5 { top: 475px; left: 250px } @media only screen and (max-width:991px) { #testimonial-area>h3 { left: 240px } .testi-wrap { height: 540px } .testi-wrap:after { left: 160px; transform: translateX(0); margin: 0 } .client-single { width: 80px; height: 80px } .client-single .client-img { width: 80px; height: 80px } .client-single img { width: 100% } .client-single .client-comment { max-width: 100%; position: relative } .client-single.active { padding: 0 0 0 220px } .client-single.position-2 { top: 140px; left: 20px } .client-single.position-3 { top: 240px; left: 20px } .client-single.position-4 { top: 340px; left: 20px } .client-single.position-5 { top: 440px; left: 20px } .client-single.active .client-img { width: 100px; height: 100px; top: 20px; transform: translateY(0); left: 10px } } @media only screen and (max-width:767px) { #testimonial-area>h3 { left: 118px } .testi-wrap { height: 400px } .testi-wrap:after { display: none } .client-single { width: 40px; height: 40px } .client-single .client-img { width: 40px; height: 40px } .client-single .client-comment { padding: 0 } .client-single .client-comment p { font-size: 16px; line-height: 26px; padding: 0 0 35px; margin: 0 } .client-single .client-comment h3 { font-size: 28px; line-height: 28px } .client-single.active { padding: 0 0 0 85px } .client-single.position-2 { top: 100px; left: 10px } .client-single.position-3 { top: 160px; left: 10px } .client-single.position-4 { top: 220px; left: 10px } .client-single.position-5 { top: 280px; left: 10px } .client-single.active .client-img { width: 60px; height: 60px; left: 0px; top: 20px } } @media only screen and (max-width:500px) { #testimonial-area>h3 { left: inherit; position: relative; top: inherit; text-align: center } .client-single.position-2 { top: 120px } .client-single.position-3 { top: 180px } .client-single.position-4 { top: 240px } .client-single.position-5 { top: 300px } .client-single.active .client-img { top: 40px } .team-block figure { padding: 0 0 65px } .team-block .row-item { padding: 10px } .team-block .heading-quinary { letter-spacing: 2px } .team-block figcaption .heading-quaternary { font-size: 34px; background: linear-gradient(to top, #000000 34px, #ffffff 34px, #ffffff 150px, #ffffff 300px, #000000 0%); -webkit-background-clip: text; background-clip: text } } .marquee_text_left, .marquee_text_right { position: relative } .meet-our-valuable-partner { position: relative; z-index: 111 } .technology_scrollig_icon { display: flex; min-height: 350px; align-items: center } .technology_scrollig_icon .marquee_text_left { display: flex; flex-direction: row } .technology_scrollig_icon .js-marquee-wrapper { display: flex; flex-direction: row } .technology_scrollig_icon .js-marquee { display: flex; width: 220vw } .technology_scrollig_icon .js-marquee .item { max-width: 100%; flex: 100%; text-align: center; display: flex; align-items: center; justify-content: center } .technology_scrollig_icon .js-marquee .item img { max-width: 260px; min-width: 110px } /* .meet-our-client{display:flex;min-height:350px;align-items:center} */ .meet-our-client { display: block; /* min-height: 350px; */ align-items: center } .meet-our-client .marquee_text_left { display: flex; flex-direction: row } .meet-our-client .js-marquee-wrapper { display: flex; flex-direction: row; padding: 45px 0; } .meet-our-client .js-marquee { display: flex; width: 220vw } .meet-our-client .js-marquee .item { max-width: 100%; flex: 100%; text-align: center; display: flex; align-items: center; justify-content: center } /* .meet-our-client .js-marquee .item img{max-width:260px;min-width:110px} */ .meet-our-client .js-marquee .item img { max-width: 260px; min-width: 110px; } .privacy-policy-act, .privacy-policy-sect, .terms-of-use-act, .terms-of-use-sect { float: left; width: 100%; padding: 140px 0; position: relative; z-index: 12 } .privacy-policy-sect, .terms-of-use-sect { padding: 0 0 140px } .privacy-policy-sect.last_pad, .terms-of-use-sect.last_pad { padding: 0 0 40px } .privacy-policy-act h2, .terms-of-use-act h2, .privacy-policy-sect h2, .terms-of-use-sect h2 { font-weight: 300; font-size: 35px; line-height: 48px; margin: 0; letter-spacing: 1px; text-align: center; padding: 0 0 30px } .terms-of-use-act p, .privacy-policy-act p, .privacy-policy-sect p, .terms-of-use-sect p { font-weight: 300; font-size: 18px; line-height: 30px; margin: 0; letter-spacing: 0.75px; text-align: left; color: #141414; padding: 0 0 30px } .privacy-policy-sect p strong, .terms-of-use-sect p strong { font-weight: 400; font-size: 18px; line-height: 30px; letter-spacing: 2.5px; margin: 0 0 3px; text-transform: uppercase; color: #141414 } .privacy-policy-sect ul.common-ul-num, .privacy-policy-sect ul.common-ul-li { float: left; width: 100%; margin-bottom: 30px; list-style: none; counter-reset: my-awesome-counter } .privacy-policy-sect ul.common-ul-num>li, .privacy-policy-sect ul.common-ul-li>li { float: left; width: 100%; margin-bottom: 30px; list-style: none; position: relative; padding: 0 0 0 30px; counter-increment: my-awesome-counter } .privacy-policy-sect ul.common-ul-num>li:last-child, .privacy-policy-sect ul.common-ul-li>li:last-child { margin-bottom: 0 } .privacy-policy-sect ul.common-ul-num>li:last-child ul, .privacy-policy-sect ul.common-ul-li>li:last-child ul { margin-bottom: 0 } .privacy-policy-sect ul.common-ul-num>li::before { content: "0"; counter: (my-awesome-counter); font-size: 18px; font-weight: 400; margin-right: 0.5rem; line-height: 1; position: absolute; left: 0; top: 5px; color: #f06472 } .privacy-policy-sect ul.common-ul-li>li { padding: 0 0 0 25px; margin: 0 } .privacy-policy-sect ul.common-ul-li>li p { padding: 4px 0 } .privacy-policy-sect ul.common-ul-li>li::before { content: "→"; font-size: 18px; font-weight: 400; margin-right: 0.5rem; line-height: 1; position: absolute; left: 0; top: 10px; color: #f06472 } .terms-of-use-sect ul.common-ul-li { float: left; width: 100%; margin-bottom: 30px; list-style: none; counter-reset: my-awesome-counter } .terms-of-use-sect ul.common-ul-li>li { float: left; width: 100%; margin-bottom: 0; list-style: none; position: relative; padding: 0 0 0 30px; counter-increment: my-awesome-counter } .terms-of-use-sect ul.common-ul-li>li p { padding: 4px 0 } .terms-of-use-sect ul.common-ul-li>li:last-child { margin-bottom: 0 } .terms-of-use-sect ul.common-ul-li>li:last-child ul { margin-bottom: 0 } .terms-of-use-sect ul.common-ul-li>li::before { content: "0"; counter: (my-awesome-counter); font-size: 18px; font-weight: 400; margin-right: 0.5rem; line-height: 1; position: absolute; left: 0; top: 10px; color: #f06472 } .privacy-policy-sect table { float: left; width: 100%; margin-bottom: 30px } .privacy-policy-sect table td { padding: 10px; vertical-align: top; font-weight: 300; font-size: 18px; line-height: 30px; margin: 0; letter-spacing: 0.75px; text-align: left; color: #141414 } .privacy-policy-sect table td p { padding: 0; font-weight: 300; font-size: 18px; line-height: 30px; margin: 0; letter-spacing: 0.75px; text-align: left; color: #141414 } .privacy-policy-sect table td strong { font-weight: 400; font-size: 18px; line-height: 30px; letter-spacing: 2.5px; margin: 0 0 3px; text-transform: uppercase; color: #141414 } input[type="file"] { color: #141414 } input[type="file"]::-webkit-file-upload-button { visibility: hidden } input[type="file"]::before { content: 'Attach Your Profile'; color: black; display: inline-block; border: 2px solid #fff; background: #f6f6f6; border-radius: 3px; padding: 10px 10px; outline: none; white-space: nowrap; -webkit-user-select: none; cursor: pointer; text-shadow: 1px 1px #fff; font-weight: 700; font-size: 16px; max-width: 170px; width: 100% } .applying-section input[type="file"]::before { content: "Attach Your Profile" } #contact_project_form input[type="file"]::before { content: "Attach Your Doc" } input[type="file"]:hover::before { border-color: #f06472 } input[type="file"]:active { outline: 0 } input[type="file"]:active::before { background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9) } .select { position: relative } .select .selectBtn { padding: 15px 20px; box-sizing: border-box; border-radius: 3px; width: 100%; cursor: pointer; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .select .selectBtn:after { content: ""; position: absolute; top: 45%; right: 15px; width: 6px; height: 6px; -webkit-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); border-right: 2px solid #666; border-bottom: 2px solid #666; transition: 0.2s ease } .select .selectBtn.toggle { border-radius: 3px 3px 0 0 } .select .selectBtn.toggle:after { -webkit-transform: translateY(-50%) rotate(-135deg); transform: translateY(-50%) rotate(-135deg) } .select .selectDropdown { position: absolute; top: 100%; width: 100%; border-radius: 0 0 3px 3px; overflow: hidden; z-index: 1; -webkit-transform: scale(1, 0); transform: scale(1, 0); -webkit-transform-origin: top center; transform-origin: top center; visibility: hidden; transition: 0.2s ease; box-shadow: 0 } .select .selectDropdown .option { padding: 10px; box-sizing: border-box; cursor: pointer } .select .selectDropdown.toggle { visibility: visible; -webkit-transform: scale(1, 1); transform: scale(1, 1) } .overflow { overflow: hidden } .contact_testi { float: left; width: 100%; padding: 50px 100px 0 0 } .contact_testi img { width: 200px; float: right; margin: 0 auto 30px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100% } .contact_testi .Contact_quote { width: 100%; float: left; font-size: 32px; line-height: 42px; font-weight: 300; padding: 0 0 15px; text-align: right } .contact_testi .Contact_author { width: 100%; float: left; font-size: 18px; line-height: 32px; font-weight: 600; text-align: right } @media screen and (max-width:767px) { .contact_testi { padding: 50px 0 60px } .contact_testi .Contact_quote { font-size: 24px; line-height: 34px } } .form-controls { padding: 10px; border: #F0F0F0 1px solid; border-radius: 4px; background-color: #FFF; width: 50% } .error { background-color: #f8d7da; border: #f8d7da 1px solid; padding: 1rem 1rem; color: #842029; border-radius: 4px } .success { background-color: #d1e7dd; border: #d1e7dd 1px solid; padding: 1rem 1rem; color: #0f5132; border-radius: 4px } .info { font-size: .8em; color: #fd6470; letter-spacing: 2px; padding-left: 5px } #mail-status-project, #mail-status-join, #mail-status-sayhi, #mail-status-home-subscribe, #mail-status-portfolio-subscribe, #mail-status-career-post, #mail-status-blog-subscribe, #mail-status-reachout { padding: 40px 0 0; color: #000 } #mail-status-career-post { max-width: 500px; margin: 0 auto } #loader-icon-project, #loader-icon-join, #loader-icon-sayhi { position: absolute; bottom: 39px; left: 140px; max-width: 60px } #loader-icon-home-subscribe { position: absolute; bottom: 65px; left: 230px; max-width: 60px } #loader-icon-career-post { position: absolute; bottom: 38px; left: 0; right: -280px; margin: 0 auto; max-width: 60px } .blog_listing #loader-icon-blog-subscribe { position: absolute; bottom: 40px; right: 0; left: 20% } .blog_listing #loader-icon-blog-subscribe img { width: 50px; height: 50px; object-fit: cover; border-radius: 50px } .contact-tab-sub { position: relative } .home_services_section .pined-content-culture { display: flex } .home_services_section .pined-content-culture .floatR { width: 570px } .home_services_section .pined-content-culture .floatR ul { overflow: hidden } .home_services_section .pined-content-culture .floatR ul li { min-height: 600px; display: flex; flex-direction: column; justify-content: center } .home_services_section .pined-content-culture .home_service_sticky ul { overflow: hidden } .home_services_section .pined-content-culture .home_service_sticky ul>li { height: 100%; display: flex; flex-direction: column; justify-content: center } .portfolio_listing #loader-icon-portfolio-subscribe { position: absolute; bottom: 35px; right: 0; left: 20% } .portfolio_listing #loader-icon-portfolio-subscribe img { width: 50px; height: 50px; object-fit: cover; border-radius: 50px } .automation-solution h2 i { color: #04C5A6 } .truvisit_btm_bg { padding-top: 50px; position: relative; z-index: 11; height: 100vh } .truvisit_btm_bg img { width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; right: 0; bottom: 0; top: 0; float: left } .threebox_slider { float: left; width: 100%; position: relative; z-index: 2; padding: 30px 0 140px; overflow: hidden } .threebox_slider:before { content: ''; background: #F6F7FB; height: 50vh; width: 100%; position: absolute; left: 0; bottom: 0; right: 0 } .threebox_slider:after { content: ''; background: url('https://d1qa1ziodjk9pt.cloudfront.net/images/portfolio-image/tru_three_mob_screen.png') no-repeat; height: 829px; width: 414px; position: absolute; left: 0; top: 20px; right: 0; z-index: 2; background-size: 100%; margin: 0 auto; box-shadow: 0px 0px 30px 0px rgba(24, 32, 39, 0.10); -webkit-box-shadow: 0px 0px 30px 0px rgba(24, 32, 39, 0.10); -moz-box-shadow: 0px 0px 30px 0px rgba(24, 32, 39, 0.10); -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px } .threebox_slider h2 { color: #E6E9EE; font-size: 150px; font-weight: 700; opacity: 30%; line-height: normal; position: absolute; left: -100px; top: 100px } .threebox_slider .item { width: 60%; display: block; margin: 11% auto 0; font-size: 0 } .threebox_slider .item img { display: block; box-shadow: 0px 0px 30px 0px rgba(24, 32, 39, 0.10); -webkit-box-shadow: 0px 0px 30px 0px rgba(24, 32, 39, 0.10); -moz-box-shadow: 0px 0px 30px 0px rgba(24, 32, 39, 0.10); -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px; border: 0 } .threebox_slider .center .item { width: 70%; margin: 0 auto 0; font-size: 0 } .threebox_slider .center .item img { display: block; box-shadow: inherit; -webkit-box-shadow: inherit; -moz-box-shadow: inherit; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px } .prob_solustion { float: left; width: 100%; padding: 0; background: #F6F7FB; position: relative; z-index: 2 } .prob_solustion h2 { font-size: 48px; font-weight: 700; text-align: center; color: #182027; margin: 0 0 10px } .prob_solustion p.subtitle { font-size: 18px; font-weight: 400; text-align: center; color: #182027 } .core_function { float: left; width: 100%; padding: 100px 0 100px; height: 100vh; background: #182027; position: relative; z-index: 2; justify-content: center; align-items: center; display: flex; overflow: hidden } .core_function:before { content: ''; background: url('https://d1qa1ziodjk9pt.cloudfront.net/images/portfolio-image/tru_core_function_img.png') no-repeat; height: 100%; width: 50%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 2; background-size: 100%; float: left } .core_function .right_box { float: right; width: 40%; padding: 0 0 0 40px } .core_function .right_box h2 { font-size: 48px; font-weight: 700; color: #FFF; margin: 0 0 20px; line-height: normal } .core_function .right_box p { font-size: 18px; font-weight: 400; color: #AAB2BD } .four_box_Section { float: left; width: 100%; padding: 0px; position: relative; z-index: 2 } .four_box_Section .item { width: 100%; float: left; height: 100%; padding-top: 100%; position: relative; justify-content: center; align-items: center; display: flex; border-right: solid 2px #E6E9EE } .four_box_Section .col { width: 100%; float: left; position: absolute; left: 0; top: 50%; transform: translateY(-50%); right: 0; padding: 50px 50px 50px } .four_box_Section .col svg { width: 80px; float: left; clear: both } .four_box_Section .col h3 { width: 100%; float: left; font-size: 26px; font-weight: 500; color: #000; line-height: 1.5; padding: 30px 0 15px } .four_box_Section .col p { width: 100%; float: left; font-size: 0px; font-weight: 400; color: #000; line-height: 1.5; opacity: 0; visibility: hidden } .four_box_Section .item:hover { border-right: solid 0px #E6E9EE } .four_box_Section .item:hover .col { background: #04C5A6; height: 140%; box-shadow: 0px 0px 30px 0px rgba(4, 197, 166, 0.50); -webkit-box-shadow: 0px 0px 30px 0px rgba(4, 197, 166, 0.50); -moz-box-shadow: 0px 0px 30px 0px rgba(4, 197, 166, 0.50); padding-top: 130px } .four_box_Section .item:hover .col p { opacity: 1; color: #E6E9EE; visibility: visible; font-size: 20px } .four_box_Section .item:hover .col h3 { color: #FFF } .four_box_Section .item:hover .col svg path { fill: #FFF } .four_box_Section .owl-carousel .owl-stage-outer { overflow: visible } .truapp_section { float: left; width: 100%; padding: 100px 0; position: relative; z-index: 2 } .truapp_section #mySwipe div b { display: block; font-weight: bold; color: #14ADE5; font-size: 20px; text-align: center; margin: 10px; padding: 100px 10px; box-shadow: 0 1px #EBEBEB; background: #fff; border-radius: 3px; border: 1px solid; border-color: #E5E5E5 #D3D3D3 #B9C1C6 } .truapp_section .swipe { overflow: hidden; visibility: hidden; position: relative; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .truapp_section .swipe-wrap { overflow: hidden; position: relative; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .truapp_section .swipe-wrap>div { float: left; width: 100%; position: relative } .truapp_section .swipe-wrap .screen1 { padding: 0 10% 0 0; justify-content: end; align-items: center; display: flex; min-height: 640px } .truapp_section .swipe-wrap .screen1 img { float: left; width: 400px; position: absolute; left: 0 } .truapp_section .swipe-wrap .screen1 .box_right { float: right; width: 60% } .truapp_section .swipe-wrap .screen1 .box_right .box1 { float: left; width: 35%; clear: both; padding: 30px 35px 30px 70px; border-bottom: solid 1px #E6E9EE; position: relative } .truapp_section .swipe-wrap .screen1 .box_right .box1:after { content: ''; width: 1px; height: calc(100% - 60px); background: #AAB2BD; position: absolute; top: 50%; transform: translateY(-50%); left: 35px } .truapp_section .swipe-wrap .screen1 .box_right .box1 h2 { font-size: 72px; font-weight: 700; line-height: normal; margin: 0; padding: 0; color: #04C5A6 } .truapp_section .swipe-wrap .screen1 .box_right .box1 p { font-size: 20px; font-weight: 400; line-height: 30px; margin: 0; padding: 0; color: #434A54 } .truapp_section .swipe-wrap .screen1 .box_right .box2 { margin: 0 0 0 160px } .truapp_section .swipe-wrap .screen1 .box_right .box2 h2 { color: #FFC700 } .truapp_section .swipe-wrap .screen1 .box_right .box3 { margin: 0 0 0 300px } .truapp_section .swipe-wrap .screen1 .box_right .box3 h2 { color: #FF004E } .truapp_section .swipe-wrap .screen2 { padding: 0 0 0 10%; justify-content: start; align-items: center; display: flex; min-height: 640px } .truapp_section .swipe-wrap .screen2 img { float: right; width: 400px; position: absolute; right: 0 } .truapp_section .swipe-wrap .screen2 .box_right { float: left; width: 60% } .truapp_section .swipe-wrap .screen2 .box_right h2 { font-size: 50px; font-weight: 700; line-height: normal; margin: 0; padding: 0 0 15px; color: #182027 } .truapp_section .swipe-wrap .screen2 .box_right p { font-size: 20px; font-weight: 400; line-height: 30px; margin: 0; padding: 0 0 35px; color: #434A54 } .truapp_section .screen1_btn { position: absolute; top: 50%; transform: translateY(-50%); left: 290px; opacity: 1; visibility: visible; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .truapp_section .screen2_btn { position: absolute; top: 50%; transform: translateY(-50%); right: 310px; opacity: 1; visibility: visible; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .truapp_section .screen1_btn.active { opacity: 0; visibility: hidden; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .truapp_section .screen2_btn.active { opacity: 0; visibility: hidden; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s } .octa_slider_Section { float: left; width: 100%; padding: 100px 0; background: #182027; height: 100vh; justify-content: start; align-items: center; display: flex } .octa_slider_Section .octa_sub_section { position: relative; width: 100%; height: 100vh; display: flex; align-items: center } .octa_slider_Section .container { position: relative; z-index: 11 } .octa_slider_Section h3, .octa_slider_Section h4 { color: #E6E9EE; font-size: 150px; font-weight: 700; position: absolute; text-align: center; margin: 0 auto; transform: rotate(-45deg); opacity: 10% } .octa_slider_Section h3 { left: -300px; right: 0; top: 45% } .octa_slider_Section h4 { right: -300px; left: 0; bottom: 45% } .octa_slider_Section .owl-item:odd .item { background-color: #F00 } .octa_slider_Section .owl-item:even .item {} .octa_slider_Section .item { float: left; width: 100%; text-align: center; position: relative } .octa_slider_Section .item .gon img { width: 80px; display: inline-block; margin: 0 auto; vertical-align: middle } .octa_slider_Section .item1 { padding: 30px 30px 80px } .octa_slider_Section .item1 h2 { padding: 40px 0 0; color: #FFF; font-size: 30px; font-weight: 500; margin: 0 0 10px } .octa_slider_Section .item1 p { padding: 0; color: #AAB2BD; font-size: 18px; font-weight: 400; line-height: 1.5; display: none; position: absolute; bottom: 0; left: 30px; right: 30px } .octa_slider_Section .item1:hover p { display: block } .octa_slider_Section .item1:hover h2 { opacity: 0 } .octa_slider_Section .item1 .gon { width: 220px; height: 220px; background: #FFC700; margin: 0 auto; line-height: 220px; text-align: center; font-size: 0px; transition: color 500ms ease, text-shadow 500ms ease } .octa_slider_Section .item1 .gon:hover { color: #fff; text-shadow: 0 0 10px white } .octa_slider_Section .item1 .octa { -webkit-clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); -moz-clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); -ms-clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%) } .octa_slider_Section .item2 { padding: 80px 30px 30px } .octa_slider_Section .item2 h2 { padding: 0 0 35px; color: #FFF; font-size: 30px; font-weight: 500; margin: 0 } .octa_slider_Section .item2 p { padding: 0 0 35px; color: #AAB2BD; font-size: 18px; font-weight: 400; line-height: 1.5; display: none; position: absolute; top: 0; left: 30px; right: 30px } .octa_slider_Section .item2:hover p { display: block } .octa_slider_Section .item2:hover h2 { opacity: 0 } .octa_slider_Section .item2 .gon { width: 220px; height: 220px; background: #FFC700; margin: 0 auto; line-height: 220px; text-align: center; font-size: 0px; transition: color 500ms ease, text-shadow 500ms ease } .octa_slider_Section .item2 .gon:hover { color: #fff; text-shadow: 0 0 10px white } .octa_slider_Section .item2 .octa { -webkit-clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); -moz-clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); -ms-clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); clip-path: polygon(29% 0, 71% 0, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0 71%, 0 29%); clear: both } .work_process_section { padding: 155px 0 } .work_process_section .container { position: relative; z-index: 11 } .work_process_section .title_head { text-align: center; padding: 0 0 45px } .work_process_section .title_head h2 { font-weight: 700; font-size: 48px; line-height: 44px; padding: 0 0 10px; margin: 0 } .work_process_section .title_head p { font-weight: 400; font-size: 18px; letter-spacing: 0.5px; line-height: 44px } #work_process_slider { position: relative; z-index: 11 } #work_process_slider .item { width: 100%; min-height: 650px; background-color: #000; position: relative } #work_process_slider .item::before { content: ""; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100% } #work_process_slider .owl-item .item .work_pro_caption { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); background-color: #fff; right: 0; min-height: 400px; max-width: 400px; padding: 60px 55px; display: none } #work_process_slider .owl-item.active .item .work_pro_caption { display: block } #work_process_slider .item .work_pro_caption h3 { font-weight: 600; font-size: 30px; line-height: 44px; letter-spacing: 0.5px; padding: 0 0 34px; margin: 0; color: #182027 } #work_process_slider .item .work_pro_caption p { font-weight: 400; font-size: 16px; line-height: 26px; color: #434A54 } .work_process_content { padding: 160px 0 0 } .work_process_content .container { max-width: 815px; padding: 0 15px; position: relative; z-index: 11 } .work_process_content h4 { font-weight: 400; font-size: 30px; line-height: 50px; color: #182027; padding: 0 0 30px } .work_process_content p { font-weight: 400; font-size: 16px; line-height: 36px; letter-spacing: 0.5px; color: #434A54 } .work_process_content p:last-child { padding: 0 } /* .prob_solu_slide nav{display:block;position:absolute;top:50%;right:0;padding:2em;z-index:99;transform:translateY(-50%);width:50vw} */ .prob_solu_slide .right_icon_group h4 { font-size: 20px; font-weight: 600; line-height: 24px; padding: 0 0 10px } .prob_solu_slide .right_icon_group { padding-left: 40px } .prob_solu_slide .right_icon_group p { font-size: 16px; line-height: 24px; letter-spacing: 0.5px; width: 330px } .prob_solu_slide .item { display: flex; align-items: center; padding: 0 0 40px } .prob_solu_slide .right_icon_group p:last-child { padding: 0 } .prob_solu_slide .icon_group { padding: 20px; background-color: #E6E9EE; border-radius: 50%; line-height: 0 } .prob_solu_slide .icon_group i { font-size: 33px; line-height: normal } .prob_solu_slide .slick-slide { display: flex; align-items: center; padding: 0 0 58px } .prob_solu_slide .slick-list.draggable { overflow: hidden } .full-screen { display: block; width: 100%; height: 100vh; overflow: hidden } #intro { display: flex; flex-direction: column; justify-content: center } #masthead { position: fixed; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; padding: 140px 0 0; height: 100vh; z-index: 9 } #masthead a .js-marquee { font-weight: 700 } #panels #panels-container { height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; padding: 0; overflow: hidden } #panels #panels-container .panel { position: relative; width: 100%; height: 100vh; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; color: #333; text-align: left; padding: 330px 2.2% 0 } #panels #panels-container .panel img { max-width: 100%; height: auto; display: block } #panels #panels-container .panel .panels-navigation { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end } #panels #panels-container .panel .anchor-panel, #panels #panels-container .panel .nav-panel { color: #000; text-transform: uppercase; margin-right: 2rem } #panels #panels-container .panels-navigation { position: absolute; width: 100%; bottom: 2rem; right: 2rem } .anchor-nav { position: absolute; top: 290px; height: 55vh; width: 66%; right: 0; text-align: right; display: flex; background-color: #fff } .anchor-nav ul { display: flex; justify-content: end; margin-right: -170px; align-items: center } .anchor-nav ul li { padding: 0 0 0 200px } .anchor-nav ul li a { overflow: hidden; padding: 1rem 2rem; display: flex; align-items: center; justify-content: center; transform: rotate(-45deg); font-weight: 700 } .anchor-nav ul li a.anchor1 { background-color: #FF004E; color: #fff; font-size: 100px; font-weight: 700; line-height: 133px; letter-spacing: 0.5px; width: 320px; height: 320px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50% } .anchor-nav ul li a.anchor2 { background-color: #FFC700; color: #182027; font-size: 18px; font-weight: 700; line-height: 21px; letter-spacing: 0.5px; width: 200px; height: 200px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50% } .anchor-nav ul li a.anchor3 { background-color: #009EFF; color: #fff; font-size: 16px; font-weight: 700; line-height: 21px; letter-spacing: 0.5px; width: 320px; height: 320px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg) } .anchor-nav ul li a .js-marquee-wrapper { display: flex } .problem_solution_block { width: 100%; height: 100vh; max-width: 1920px; margin: 0 auto } .problem_solution_block .pin-spacer { padding: 0px 0px 4800px !important; overflow: hidden !important } @media screen and (max-width:1800px) { .automation-solution { padding: 100% 0 220px 0 } .threebox_slider:after { height: 692px; width: 345px; border-radius: 40px; top: 25px } .threebox_slider .owl-carousel .owl-item img { width: 99% } .truapp_section .swipe-wrap .screen1 .box_right .box1, .truapp_section .swipe-wrap .screen1 .box_right .box2 { width: 50% } .greatplace img { width: 2.5em; } } @media screen and (max-width:1600px) { .threebox_slider:after { height: 591px; width: 295px; border-radius: 40px; top: 25px } .threebox_slider .item img { border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px } .truapp_section .swipe-wrap .screen1 .box_right .box1, .truapp_section .swipe-wrap .screen1 .box_right .box2 { width: 75% } .octa_slider.owl-carousel.owl-drag .owl-item.active.center p { display: block } .octa_slider_Section .item2 h2 { margin: 50px 0 0 } .octa_slider_Section .item1 h2 { margin: 0 0 50px } .truapp_section .swipe-wrap .screen2 { padding: 0 0 0 5% } .truapp_section .swipe-wrap .screen2 .box_right { width: 45% } .core_function:before { width: 60% } .work_process_content .container { max-width: 815px !important } .greatplace { padding-bottom: 16px; } .portfolio-vts .approch_section_bg_white { padding: 0 0 100px; } .portfolio-vts .approch_section_bg_white.dash-bg { padding: 50px 0 100px; } } @media screen and (max-width:1366px) { .threebox_slider:after { height: 580px; width: 295px; border-radius: 40px; display: none } .threebox_slider .item img { border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px } .core_function:before { width: 62% } .truapp_section .swipe-wrap .screen1 .box_right { width: 50% } .truapp_section .swipe-wrap .screen1 .box_right .box1, .truapp_section .swipe-wrap .screen1 .box_right .box2, .truapp_section .swipe-wrap .screen1 .box_right .box3 { width: 100% } .truapp_section .swipe-wrap .screen1 .box_right .box2 { margin: 0 0 0 100px } .truapp_section .swipe-wrap .screen1 .box_right .box3 { margin: 0 0 0 200px } .truapp_section .swipe-wrap .screen2 { padding: 0 0 0 5% } .truapp_section .swipe-wrap .screen2 .box_right { width: 45% } #work_process_slider .item { min-height: 530px } .core_function .right_box p br { display: none } .octa_slider.owl-carousel.owl-drag .owl-item.active.center p { display: block } .octa_slider_Section .item2 h2 { margin: 50px 0 0 } .octa_slider_Section .item1 h2 { margin: 0 0 50px } .work_process_content { padding: 100px 0 0 } .work_process_section { padding: 100px 0 } .greatplace img { width: 3em; } } @media screen and (max-width:1023px) { .three_mob_slider.owl-carousel .owl-item img { max-width: 300px; margin: 30px auto } .threebox_slider:after { height: 635px; width: 318px; border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; display: none } .threebox_slider { padding: 0 0 50px } .core_function { padding: 130% 0 170px } .core_function:before { width: 100% } .core_function .right_box { width: 100%; padding: 0 } .core_function .right_box h2 { font-size: 30px } .core_function .right_box p br { display: none } .truapp_section .swipe-wrap .screen1 { padding: 0 } .truapp_section .swipe-wrap .screen1 .box_right { width: 50% } .truapp_section .swipe-wrap .screen1 .box_right .box1, .truapp_section .swipe-wrap .screen1 .box_right .box2, .truapp_section .swipe-wrap .screen1 .box_right .box3 { width: 100% } .truapp_section .swipe-wrap .screen1 .box_right .box1, .truapp_section .swipe-wrap .screen1 .box_right .box2, .truapp_section .swipe-wrap .screen1 .box_right .box3 { margin: 0 } .truapp_section .swipe-wrap .screen2 { padding: 0 0 0 30px } .truapp_section .swipe-wrap .screen2 .box_right { width: 45% } .truapp_section .screen2_btn { right: 250px } .truapp_section .screen1_btn { left: 220px } .truapp_section .swipe-wrap .screen1 .box_right .box1 h2 { font-size: 40px } .octa_slider_Section .item1 p, .octa_slider_Section .item2 p { display: block } .octa_slider_Section .item1:hover p, .octa_slider_Section .item2:hover p { display: block } .octa_slider_Section .item1:hover h2, .octa_slider_Section .item2:hover h2 { opacity: 1 } .octa_slider_Section .item1 h2 { margin: 0 0 50px } .octa_slider_Section .item2 h2 { margin: 50px 0 0 } .work_process_section { padding: 60px 0 } .work_process_section .title_head h2 { font-size: 30px } .work_process_section .title_head p { line-height: 28px } #work_process_slider.owl-carousel .owl-item img { max-width: 100% } #work_process_slider .owl-item .item .work_pro_caption { position: relative; top: 40px; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; padding: 30px 30px; max-width: 100%; min-height: 250px } .work_process_content { padding: 70px 0 0 } .work_process_content h4 { font-size: 25px; line-height: 35px } .work_process_content p { line-height: 30px } } @media screen and (max-width:767px) { .case-study .img_banner .text_box { position: relative; padding: 30px 20px 0 } .img_banner .text_box p { color: #fff } .university-icon { top: 10px; color: #000 } .threebox_slider:after { width: 184px; height: 368px; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; display: block } .core_function { padding: 600px 0 170px } .core_function:before { width: 100% } .core_function .right_box { width: 100%; padding: 0 } .truapp_section { padding: 0 } .truapp_section .swipe-wrap .screen1 { display: block; padding: 0 } .truapp_section .swipe-wrap .screen1 img { position: relative; width: 100% } .truapp_section .swipe-wrap .screen1 .box_right { width: 100%; padding: 50px 0 0 } .truapp_section .swipe-wrap .screen1 .box_right .box1 { width: 100% } .truapp_section .swipe-wrap .screen1 .box_right .box2, .truapp_section .swipe-wrap .screen1 .box_right .box3 { margin: 0 } .truapp_section .swipe-wrap .screen1 .box_right .box1 h2 { font-size: 30px } .truapp_section .swipe-wrap .screen1 .box_right .box1 p { font-size: 18px } .truapp_section .screen1_btn { top: 0; left: 30px } .truapp_section .swipe-wrap .screen2 { display: block; padding: 0 } .truapp_section .swipe-wrap .screen2 img { position: relative; width: 100% } .truapp_section .swipe-wrap .screen2 .box_right { width: 100%; padding: 50px 20px 0 } .truapp_section .swipe-wrap .screen2 .box_right .box1 { width: 100% } .truapp_section .swipe-wrap .screen2 .box_right .box2, .truapp_section .swipe-wrap .screen2 .box_right .box3 { margin: 0 } .truapp_section .swipe-wrap .screen2 .box_right .box1 h2 { font-size: 30px } .truapp_section .swipe-wrap .screen2 .box_right .box1 p { font-size: 18px } .truapp_section .screen2_btn { top: 0; right: 30px } .truapp_section .swipe-wrap .screen2 .box_right h2 { font-size: 30px } .core_function .right_box h2 { font-size: 30px } .core_function .right_box p br { display: none } .four_box_Section .col svg { width: 50px } .four_box_Section .col h3 { font-size: 20px } .four_box_Section .item { padding-top: 80% } .octa_slider_Section .item1 p, .octa_slider_Section .item2 p { display: block } .octa_slider_Section .item1:hover p, .octa_slider_Section .item2:hover p { display: block } .octa_slider_Section .item1:hover h2, .octa_slider_Section .item2:hover h2 { opacity: 1 } .octa_slider_Section .item1 h2 { margin: 0 0 50px } .octa_slider_Section .item2 h2 { margin: 50px 0 0 } .work_process_section { padding: 60px 0 } .work_process_section .title_head h2 { font-size: 30px } .work_process_section .title_head p { line-height: 28px } #work_process_slider.owl-carousel .owl-item img { max-width: 100% } #work_process_slider .owl-item .item .work_pro_caption { position: relative; top: 40px; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; padding: 30px 30px; min-height: 300px } #work_process_slider .item { min-height: 590px } .work_process_content { padding: 60px 0 0 } .work_process_content h4 { font-size: 25px; line-height: 38px } .portfolio-vts .approch_section_bg_white { padding: 0 0 50px; } .device-space { margin-top: 30px; } .portfolio-vts .approch_section_bg_white.dash-bg { padding: 0px 0 50px; } .sainfra_scripting .vts_script_col, .sainfra_scripting .vts_script_col_two { width: 100%; max-width: 100%; flex: 100%; } .ceo-name { margin-top: 30px } } .cb-video-container { position: relative } .play-pause--click-area { width: 100%; height: 100%; top: 0; position: absolute; display: flex; align-items: center; justify-content: center } .play-pause--container { position: relative; width: 30px; height: 30px } .play-pause--container .play-pause--icon { margin: auto; right: 0; left: 0; position: absolute; filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.5)) } .play-pause--container .play-icon { width: 0; height: 0; border: 0 solid transparent; border-bottom-width: 15px; border-top-width: 15px; border-left: 25px solid #fff } .play-pause--container .pause-icon { background-color: #fff; width: 10px; height: 30px; left: -10px; position: absolute } .play-pause--container .pause-icon:after { content: ""; background: inherit; width: 10px; height: 30px; left: 15px; position: absolute } #chris_vid_btn { width: 50px; height: 50px; background-color: #fff; border-radius: 50%; color: #fe6571; font-size: 36px; position: absolute; top: 48px; right: 0; left: 95px; margin: 0 auto; display: flex; align-items: center; justify-content: center; cursor: pointer } .client-review-section iframe { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; margin: 0 } /* Overlay Styles */ .overlayBg { position: fixed; left: 0; top: 0; z-index: 5; width: 100vw; height: 100vh; display: none } .overlayBg.open { display: block } [overlay] { position: fixed; top: 166px; left: 0; right: 0; margin: 0 auto; z-index: 10; width: 85%; height: calc(100vh - 200px); padding: 30px; background-color: white; box-shadow: 0 3px 5px #0005; visibility: hidden; opacity: 0; transition: visibility 0s linear 0.4s, opacity 0.4s, transform 0.4s } [overlay].open { visibility: visible; opacity: 1; transition: opacity 0.7s, transform 0.7s } [overlay] button.test_close { background: none; border: none; position: absolute; right: -20px; top: -20px; font-size: 27px; color: #fe6571; cursor: pointer; outline: none; background-color: #fff; width: 50px; height: 50px; border-radius: 50% } [overlay] button.test_close:hover, [overlay] button.test_close:focus { color: #000 } .testimonial_body_hidden { overflow: hidden } @media screen and (max-width:1200px) { .client-review-section iframe { object-fit: contain } [overlay] { height: auto; top: 50%; transform: translateY(-50%); padding: 10px } } #our-founders.owl-carousel .owl-stage { margin: 0 auto } .the_team_believes { padding: 100px 0 } .the_team_believes .content-width { position: relative; z-index: 11 } .the_team_believes h2 { font-weight: 600; font-size: 35px } .the_team_believes h3 { font-weight: 400 } .the_team_believes ul { margin: 50px 0; display: flex; flex-wrap: wrap } .the_team_believes ul li { font-size: 20px; padding: 0 0 20px; max-width: 50%; flex: 50%; line-height: 27px } .the_team_believes h4 { padding: 0 0 30px } @media screen and (max-width:767px) { .the_team_believes h2 { font-size: 25px } .the_team_believes h3 { font-size: 25px } .the_team_believes ul li { max-width: 100%; flex: 100% } .the_team_believes h4 { font-size: 25px } } .sandcupmeta_text { position: absolute; transform: translateY(-50%) rotate(-90deg); left: calc(10% + 1px - 120px); font-size: 22px; top: 50%; z-index: 111 } .sandcupmeta_text a { color: #fe6571; -webkit-animation: mover 2s linear infinite; animation: mover 2s linear infinite; display: block } @-webkit-keyframes mover { 0% { transform: translateX(0px) } 50% { transform: translateX(20px) } 100% { transform: translateX(0px) } } @keyframes mover { 0% { transform: translateX(0px) } 50% { transform: translateX(20px) } 100% { transform: translateX(0px) } } @media screen and (min-width:1200px) and (max-width:1500px) { .team-partners .content-width { max-width: 890px; margin: 0 auto } } #page { position: relative; z-index: 12; visibility: visible } .fullscreen-wall-showcase { float: left; width: 100%; height: 100vh; position: relative } .fw-projects { position: fixed; top: 55%; left: 7.5%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); display: block; width: 70%; z-index: 1 } /* .fw-projects .fwt-line{overflow:hidden} */ .fw-images { position: fixed; top: 56%; right: 0; width: 50.5%; height: 70%; pointer-events: none; transform: translateY(-50%) } .portfolio-showcase .fw-images .plyr__video-wrapper { width: calc((100vh) * 1.77777778) } .fw-images .fw-project-image, .fw-images .fw-project-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: top; object-position: top; transform: translate(0, 0) !important } .fw-images .fw-project-image { position: absolute; top: 0; right: 0 } .fw-project { display: inline-block; padding: 20px 0; cursor: pointer; overflow: hidden; padding-right: 5px; line-height: 40px } .fw-project a { text-decoration: none; color: #191b1d; display: inline-block; transform: none !important } body.dark .fw-project a, .fullscreen-wall-showcase.dark .fw-project a { color: #fff } .fw-projects .fw-project-image { display: none } .fw-project .fw-project-category { display: none } .fw-project-title { font-size: 60px; font-weight: 700; letter-spacing: -.06em; display: inline-block; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease } .fw-project.opdown .fw-project-title { opacity: .2 } .fw-project.active.opdown .fw-project-title { opacity: 1 } .fw-project-image-wrap { position: absolute; top: 0; right: 0; width: 0%; height: 100%; overflow: hidden } .fw-project::after { content: "/"; display: inline-block; font-size: 60px; margin: 0 20px; font-weight: 700; color: rgba(25, 27, 29, .2); transform: none !important; position: relative; top: 7 } .fwt-line .fw-project:last-child::after { display: none } .fw-cat { font-size: 20px; font-weight: 700; letter-spacing: -.05em; color: rgba(25, 27, 29, .6); overflow: hidden } .fw-cat span div { transform: translate(0, 0) !important } body.dark .fw-cat, .fullscreen-wall-showcase.dark .fw-cat, .portfolio-showcase.fullscreen-carousel-showcase { width: 100%; display: block; position: relative } .swiper-slide.cs-project { height: 100vh; display: block; position: relative; border-right: 1px solid #e4e4e4; cursor: pointer } .cs-project .cs-project-image { display: none } .cs-images { position: fixed; display: block; width: 100%; height: 100vh; top: 0; left: 0; z-index: -1 } .cs-images .cs-project-image img, .cs-images .cs-project-image { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; position: absolute; top: 0; left: 0 } .cs-project-dets { position: absolute; top: 50%; left: 10%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .cs-project-title { display: block; font-size: 50px; font-weight: 700; letter-spacing: -.06em; max-width: 75%; line-height: 55px; margin-bottom: 10px } .cs-project-cat { font-size: 20px; font-weight: 700; letter-spacing: -.05em; color: #616161 } .cs-project-excerpt { display: block; overflow: hidden; max-height: 0; max-width: 70%; font-size: 14px; line-height: 28px; margin: 0; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease } .cs-project.hovered .cs-project-excerpt { max-height: 100px; margin: 20px 0 } .cs-rpoject-button { display: none } .swiper-slide.cs-project::after { content: ""; display: block; position: absolute; top: 0; left: 0; background: rgb(255 255 255/50%); width: 100%; height: 100%; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); z-index: -1; opacity: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease } .swiper-slide.cs-project.hovered::after { opacity: 1 } .portfolio-showcase.showcase-classic { width: 83%; display: block; margin: auto; position: relative; padding-top: 10%; overflow: hidden } .sc-projects-wrapper { position: relative; width: 75%; float: right; overflow: hidden; height: 100%; display: block } .sc-project-image { width: 45%; height: 100% } .sc-project-image img { width: 100%; -o-object-fit: cover; object-fit: cover } .sc-project { display: block; margin-bottom: 100px; float: left; width: 100% } .sc-project:nth-child(even) { text-align: right } .sc-project:nth-child(even) .sc-project-image { float: right } .sc-project-title { display: block; font-size: 40px; font-weight: 700; letter-spacing: -.06em } .sc-project-cat { font-size: 25px; font-weight: 700; letter-spacing: -.05em; color: #8f8d8d } .sc-project-meta { margin-top: 15px; padding-left: 15px; display: block; width: 100% } .sc-project:nth-child(even) .sc-project-meta { float: right; padding-left: 0; padding-right: 15px } .showcase-footer { position: absolute; bottom: 10%; width: 83%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); pointer-events: none } .showcase-footer-left, .showcase-footer-right { display: block; float: left; width: 50%; height: 100%; pointer-events: all } .showcase-footer-right { text-align: right; float: right; pointer-events: all } .fw-project::after { transform: none !important } .portfolio_cat .header__logo.js-replace svg .cls-1 { fill: #000 } .a-plus-button { position: relative; display: inline-block; cursor: pointer; width: 50px; height: 50px } .a-plus-button::before { content: ""; display: block; position: absolute; width: 100%; height: 1px; background: #191b1d; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .a-plus-button::after { content: ""; display: block; position: absolute; width: 1px; height: 50px; background: #191b1d; left: 50%; top: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: -webkit-transform .6s ease; transition: -webkit-transform .6s ease; -o-transition: transform .6s ease; transition: transform .6s ease; transition: transform .6s ease, -webkit-transform .6s ease } .a-plus-button:hover::after { -webkit-transform: translateX(-50%) rotate(270deg); -ms-transform: translateX(-50%) rotate(270deg); transform: translateX(-50%) rotate(270deg) } .a-plus-button a { display: block; width: 100%; height: 100%; white-space: nowrap; color: #191b1d; font-size: 12px; overflow: hidden; font-weight: 600 } .a-plus-button a>span { display: inline-block; position: absolute; top: 30%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; overflow: hidden } .a-plus-button a>span>span { display: block; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .3s ease .3s; transition: -webkit-transform .3s ease .3s; -o-transition: transform .3s ease .3s; transition: transform .3s ease .3s; transition: transform .3s ease .3s, -webkit-transform .3s ease .3s } .a-plus-button:hover a>span>span { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } @media screen and (max-width:1500px) { .fw-project-title { font-size: 40px } .fw-project { line-height: 30px; padding: 10px 0 } } @media screen and (max-width:1366px) { .fw-project-title { font-size: 30px } .fw-project { line-height: 20px; padding: 10px 0 } } @media screen and (max-width:1024px) { .fw-project-title { font-size: 30px } .fw-project { line-height: 20px; padding: 10px 0 } .greatplace img { width: 2.8em; } } @media screen and (max-width:900px) { .fw-project-title { font-size: 20px } .fw-project { line-height: 0; padding: 10px 0 } .fw-images { top: 0; width: 100%; height: 100%; transform: none } } body.socialmedia { min-height: calc(100vh - 308px) } body.socialmedia .intro { height: calc(100vh - 230px) } body.socialmedia .section1 { height: calc(100vh - 308px) } body.socialmedia .look-what-we-work-section { padding: 30px 0 } body.socialmedia .look-what-we-work-section h6 { padding: 0 } body.socialmedia .social_icon .text-white .transparent-text img { width: 30px } body.socialmedia .social_icon .marquee-scroller .item { margin: 10px; min-width: 350px } body.socialmedia .marquee-scroller { padding: 0 } body.socialmedia .left_icon { visibility: hidden; opacity: 0 } body.socialmedia .section1 .header .default-button { margin: 22px 40px 0 0 } @media screen and (max-width:1200px) { body.socialmedia { min-height: auto } } @media screen and (max-width:767px) { body.socialmedia .mobile-header .fishleft { display: none } body.socialmedia .mobile-particle-slider { height: calc(100vh - 88px - 195px) } body.socialmedia #home-mobile-slider { height: calc(100vh - 88px - 195px) } body.socialmedia.home-page .look-what-we-work-section .marquee-wrapper .marquee-block { min-height: 100px !important } body.socialmedia .social_icon .marquee-scroller .item { min-width: 140px } .greatplace { padding-bottom: 0; } .menu-social-box { right: 50px; } } /* New Portfolio CSS */ .portfolio_banner_text { padding: 255px 0 205px; } .portfolio_banner_text .content-width { max-width: 1405px; margin: 0 auto; position: relative; z-index: 11; } .portfolio_banner_text span { font-size: 24px; line-height: 28px; color: #000000; font-family: 'Josefin Sans', sans-serif; font-weight: 500; padding: 0 0 20px; display: block; margin: 0; } .portfolio_banner_text h1 { font-family: 'Ginora_Regular'; font-style: normal; font-weight: 500; font-size: 80px; line-height: 100px; color: #000000; } .portfolio_banner { line-height: 0; } .portfolio_banner img { width: 100%; } .launch_projects { padding: 265px 0 135px; } .launch_projects .content-width { max-width: 1238px; margin: 0 auto; position: relative; z-index: 11; } .launch_projects .project_row { display: flex; flex-direction: row; } .launch_projects .project_col:first-child { width: 360px; } .launch_projects .project_col:last-child { width: 857px; } .launch_projects ul li { font-family: 'Ginora_Light'; font-style: normal; font-weight: 400; font-size: 24px; line-height: 50px; color: rgba(0, 0, 0, 0.5); } .launch_projects p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000; } .launch_projects .all-cases-button { margin-top: 75px; display: block; } .project_scroller { background-color: #141414; } .approch_section { padding: 330px 0 250px; } .approch_section div span { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 500; font-size: 30px; line-height: 50px; color: #000; display: inline-block; padding-right: 15px; } .approch_section .content-width div { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000; padding: 0 0 30px; max-width: 1090px; margin: 0; } .approch_section .saurav-shekhar-bio { padding-top: 80px !important; } .approch_section .saurav-shekhar-bio h4 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 400; font-size: 24px; line-height: 24px; color: #000000; margin: 0 0 15px; } .approch_section .saurav-shekhar-bio span { display: block; font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 20px; line-height: 20px; color: #000000; } .solution_section { background-color: #141414; padding: 325px 0; } .solution_section .solution_row { display: flex; flex-direction: row; } .solution_section .solution_col:first-child { max-width: 25%; flex: 25%; } .solution_section .solution_col:last-child { max-width: 75%; flex: 75%; } .solution_section h2 { font-family: 'Ginora_Semi_Bold'; font-style: normal; font-weight: 500; font-size: 30px; line-height: 70px; color: #D3951E; } .solution_section p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #FFFFFF; flex: none; order: 0; flex-grow: 0; } .parallax_section { background-color: #141414; padding: 0 0 95px; } .parallax_section .content-width { max-width: 1600px; margin: 0 auto; } .parallax_section .parallax_row { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; } .parallax_section .parallax_col { max-width: 50%; flex: 50%; padding: 0 40px; } .parallax_section .parallax_col img { width: 100%; } .parallax_section h2 { font-family: 'Ginora_Light'; font-style: normal; font-weight: 300; font-size: 24px; line-height: 45px; text-align: center; color: #FFFFFF; margin: 60px auto !important; max-width: 428px; } .service_slider_section .scroll-slider { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; height: 100vh; } .service_slider_section .scroll-wrapper { position: relative; display: flex; flex-wrap: nowrap; height: 100%; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent; transform: translate3d(0, -80px, 0); } .service_slider_section .scroll-slide { flex: 1 0 30vw; max-width: 30vw; height: 100%; } .service_slider_section .item { display: flex; justify-content: center; align-items: center; height: 100%; } .service_slider_section .item-container { position: relative; } .service_slider_section .item-title { font-size: 4vw; font-weight: bold; line-height: 1; } @media (min-width: 40em) { .service_slider_section .item-body { position: absolute; left: 100%; top: 50%; width: 50%; transform: translate(-25%, -50%); } } .service_slider_section .tag { margin-right: 0.5rem; } .service_slider_section .tag>a { display: block; padding: 0.25rem 0.5rem; font-size: 0.75rem; text-transform: uppercase; background: rgba(255, 255, 255, 0.25); color: #fff; } .service_slider_section .scroll-slider .scroll-slide:nth-child(2n+2) { padding: 200px 0 0; } .sainfra_img_section { background-color: #141414; padding: 95px 0 250px; } .parallax_section2 { padding: 0; background-color: #141414; } .parallax_section2 .content-width { position: relative; z-index: 11; } .parallax_section2 .parallax_row { display: flex; flex-direction: row; margin: 0 -25px; } .parallax_section2 .parallax_row .parallax_col:first-child { width: 45%; } .parallax_section2 .parallax_row .parallax_col:last-child { width: 55%; } .parallax_section2 .parallax_row .parallax_col { padding: 0 25px; } .parallax_section2 .parallax_row .parallax_col img { width: 100%; } .parallax_section2 h2 { font-family: 'Ginora_Light'; font-style: normal; font-weight: 300; font-size: 24px; line-height: 45px; text-align: center; color: #FFFFFF; max-width: 415px; margin: 30px auto; text-align: center; } .project_sections {} .project_sections .section { height: 100%; display: flex; } .project_sections .one { width: 1920px; background: linear-gradient(to top, #051937, #203168, #48499a, #7b5fcc, #b673fc); } .project_sections .two { width: 1920px; } .project_sections .parallax-content { background-image: url('https://images.unsplash.com/Ys-DBJeX0nE.JPG?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2670&q=80'); position: relative; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; z-index: -1; } .project_sections .three { width: 1920px; background: linear-gradient(to top, #051937, #203168, #48499a, #7b5fcc, #b673fc); } .project_sections .four { width: 1920px; background: linear-gradient(to top, #b673fc, #7b5fcc, #48499a, #203168, #051937); } .project_sections .five { width: 1920px; background: linear-gradient(to top, #051937, #203168, #48499a, #7b5fcc, #b673fc); } .project_sections .six { width: 1920px; background: linear-gradient(to top, #b673fc, #7b5fcc, #48499a, #203168, #051937); } .project_sections .textchange { position: fixed; z-index: 99; top: 30px; left: 50%; -ms-transform: translateX(-50%); transform: translateX(-50%); font-family: rubik; font-weight: 700; font-size: 40px; color: #fff; } .project_sections .marker { position: relative; top: 10px; opacity: 0; } .project_sections #middle { left: 100%; } .project_sections #end { left: 100%; } .project_sections .active-btn { width: 250px; height: 50px; border: none; outline: none; color: #111; background: #fff; cursor: pointer; position: absolute; top: 40%; left: 50%; z-index: 0; padding: 0; margin: 0; } .project_sections { background-color: #141414; padding: 180px 0 180px; } .projects_sub { position: relative; z-index: 11; } .project_sections .project_title { font-family: 'Ginora_Light'; font-style: normal; font-weight: 300; font-size: 230px; line-height: 265px; color: #FFFFFF; position: absolute; top: -150px; z-index: 11; width: 100%; text-align: center; } .project_sections h2 { font-family: 'Ginora_Regular'; font-style: normal; font-weight: 400; font-size: 30px; line-height: 35px; letter-spacing: 0.02em; color: #000000; text-align: center; } .project_sections .bg_sub_box { background-color: #fff; padding: 40px 30px; } .project_sections .project_slider { overflow: visible; } .project_sections .project_slider .swiper-slide { line-height: 0; } .project_sections .project_slider .swiper-slide:nth-child(2n+1) { position: relative; z-index: 11; } .launch_projects_bg_white { padding: 270px 0 275px; } .launch_projects_bg_white .content-width { max-width: 1238px; margin: 0 auto; position: relative; z-index: 11; } .launch_projects_bg_white .project_row { display: flex; flex-direction: row; } .launch_projects_bg_white .project_col:first-child { width: 360px; } .launch_projects_bg_white .project_col:last-child { width: 857px; } .launch_projects_bg_white ul li { font-family: 'Ginora_Regular'; font-style: normal; font-weight: 400; font-size: 24px; line-height: 50px; color: rgba(0, 0, 0, 0.5); } .launch_projects_bg_white p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000; } .launch_projects_bg_white .all-cases-button { margin-top: 75px; display: block; } .launch_projects_bg_white a { color: #000; } .launch_projects_bg_white .default-button.theme-white { color: #000; } .launch_projects_bg_white .default-button.theme-white .button-background .center, .launch_projects_bg_white .default-button.theme-white .button-background .left:before, .launch_projects_bg_white .default-button.theme-white .button-background .right:before { background-color: #EEEEEE; } .launch_projects_bg_white .default-button.theme-white .plus-icon:after, .launch_projects_bg_white .default-button.theme-white .plus-icon:before { background-color: #000; } .launch_projects .content-width { max-width: 1400px; } .website_video {} .website_video .content-width { background-color: #EFEFEF; padding: 145px 15px; max-width: 1650px; } .website_video img { width: 80%; border-radius: 40px; margin: 0 auto; display: block; } .approch_section_bg_white { padding: 100px 0 255px; } .approch_section_bg_white div span { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 500; font-size: 30px; line-height: 50px; color: #000; display: inline-block; padding-right: 15px; text-transform: uppercase; } .approch_section_bg_white div { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000; padding: 0 0 30px; } .yofo .approch_section_bg_white { padding: 255px 0 255px; } .parallax_section_bg_white { background-color: #fff; } .parallax_section_bg_white .parallax_col { padding: 0 30px; } .parallax_section_bg_white .parallax_col:first-child img:nth-child(1) { padding: 0 0 50px; } .parallax_section_bg_white h2 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; text-align: center; color: #000000; max-width: 608px; } .solution_section_bg_white { background-color: #fff; } .solution_section_bg_white .content-width { max-width: 1440px; } .solution_section_bg_white .solution_col:first-child { max-width: 45%; flex: 55%; padding-right: 30px; } .solution_section_bg_white h2 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 500; font-size: 30px; line-height: 48px; color: #000000; } .solution_section_bg_white p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000000; flex: none; order: 0; flex-grow: 0; } .parallax_section2_bg_white { background-color: #fff; padding: 250px 0 0; } .parallax_section2_bg_white .parallax_col:first-child img:nth-child(1), .parallax_section2_bg_white .parallax_col:first-child img:nth-child(2), .parallax_section2_bg_white .parallax_col:last-child img:nth-child(1) { padding: 0 0 50px; } .portfolio_two_boxes { padding: 0; } .portfolio_two_boxes .portfolio_row { display: flex; flex-direction: row; margin-left: -50px; } .portfolio_two_boxes .portfolio_col { max-width: 50%; flex: 50%; padding: 0 40px; } .left_scroller { padding: 0 0 200px; } .left_scroller img { width: 100%; } .case-study .look-what-we-work-section .marquee-wrapper .marquee-block { min-height: 350px; } .case-study .look-what-we-work-section .marquee-wrapper .marquee-inner { transform: translateY(-15%); } .animation_section iframe { width: 100%; height: 900px } .animation_section video { width: 100%; } .error-template { padding: 40px 15px; text-align: center; } .error-actions { margin-top: 15px; margin-bottom: 15px; } .error-actions .btn { margin-right: 10px; } .left_scroller iframe { width: 100%; height: 787px; } .left_scroller video { width: 100%; } /* SAInfra */ .sainfra_page { padding: 0 0 130px; } .sainfra_case_study { padding: 0 0 130px; } .sainfra_scripting { padding: 0 0 150px; } .sainfra_scripting .sainfra_script_row { display: flex; margin: 0 -40px; } .sainfra_scripting .sainfra_script_col { max-width: 50%; flex: 50%; padding: 0 40px; } .sainfra_innerpage_img { padding: 0 0 150px; } .sainfra_left_side { padding: 0 0 150px; } .sainfra_left_side .sainfra_left_side_row { display: flex; margin-left: -30px; } .sainfra_left_side .sainfra_left_side_col { max-width: 50%; flex: 50%; padding: 0 40px; } .sainfra_left_side .sainfra_left_side_col:last-child { padding-top: 30px; } .sainfra_left_side p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000000; } .paynship_global_sec { padding: 200px 0 345px; height: auto; text-align: center; } .wordmark_section .wordmark_row { display: flex; margin: 0 -40px; flex-wrap: wrap; } .wordmark_section .wordmark_col { max-width: 50%; flex: 50%; padding: 0 40px 65px; } .latest_work { background-color: #141414; padding: 150px 0; position: relative; overflow: hidden; } .latest_work h3 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 36px; line-height: 36px; color: #FFFFFF; margin: 50px 0 35px; } .latest_work span { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 600; font-size: 16px; line-height: 16px; letter-spacing: 0.21em; text-transform: uppercase; color: #898989; display: block; position: relative; padding: 0 0 0 25px; } .latest_work span::before { content: ""; width: 8px; height: 8px; background-color: #FE6571; position: absolute; left: 0; top: 2px; } #sectionPin { overflow: hidden; display: flex; background-color: #141414; height: 100vh; align-items: flex-end; padding: 0 0 100px; } #sectionPin .pin-wrap { display: flex; flex-direction: row; padding-left: 190px; } #sectionPin .scroll_item { width: 800px; padding: 0 20px; } .latest_work h2 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 700; font-size: 128px; line-height: 128px; color: #FFFFFF; position: fixed; top: 200px; left: 0; right: 0; text-transform: uppercase; text-align: center; z-index: 1; opacity: 0; display: none; } .getintouch_pinkbg { background-color: #FE6571; height: 100vh; display: flex; align-items: center; text-align: center; } .getintouch_pinkbg h2 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 700; font-size: 100px; line-height: 130%; text-align: center; letter-spacing: -0.02em; color: #141414; margin: 0 0 30px; } .getintouch_pinkbg a { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 400; font-size: 36px; line-height: 130%; text-align: center; color: #FFFFFF; text-decoration: underline; } .paynship_card_section { padding: 0 0 80px; } .paynship_greenbg_section {} .paynship_greenbg_section .content-width { max-width: 1670px; } .paynship_greenbg_sub { background-color: #1BB26B; padding: 100px 0; } .paynship_greenbg_sub img { width: 1058px; margin: 0 auto; display: block; border-radius: 15px; } .portfolio_short_discription { padding: 225px 0; } .portfolio_short_discription .content-width { max-width: 1046px; } .portfolio_short_discription p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000000; } .one_click_solution { padding: 0 0 150px; } .one_click_solution .content-width { max-width: 1670px; } .paynship_global_keeps {} .paynship_global_keeps .content-width { max-width: 1670px; } .paynship_global_keeps .wordmark_row { display: flex; flex-direction: row; margin: 0 -40px; } .paynship_global_keeps .wordmark_col { max-width: 50%; flex: 50%; padding: 0 40px; } .everything_at_your { padding: 150px 0; } .everything_at_your .content-width { max-width: 1670px; } .dashboard_section .content-width { max-width: 1670px; } .portfolio_solution_discription { padding: 375px 0; } .portfolio_solution_discription .content-width { max-width: 1330px; } .portfolio_solution_discription .content-width p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; color: #000000; } .portfolio_solution_discription .content-width b { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 500; font-size: 30px; line-height: 50px; color: #000000; } .paynship_profile_dash { padding: 150px 0; } .paynship_profile_dash .content-width { max-width: 1670px; } .paynship_profile_dash .row { margin: 0 -40px; } .paynship_profile_dash .col-50 { padding: 0 40px; } .paynship_profile_dash2 .content-width { max-width: 1670px; } body { overflow-x: hidden; overflow-y: scroll; } .mobile_screen_with_logo { padding: 0 0 150px; position: relative; } .mobile_screen_with_logo .content-width { max-width: 100%; margin-right: 105px; } .mobile_screen_with_logo img { height: 800px; width: 1265px; } .mobile_screen_with_logo .col-75 { padding-left: 0; } .mobile_screen_with_logo .col-25 { display: flex; align-items: center; } .mobile_screen_with_logo p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 28px; line-height: 50px; color: #000000; } .mobile_screen_with_logo .mobile_scre_log { position: absolute; right: calc(50% - 422px); top: 160px; width: 286px; height: 136px; } .case-study-poppins .content-width { max-width: 100%; } .case-study-poppins img { width: 100%; } .dairy_that_section { padding: 150px 0; } .dairy_that_section .content-width { max-width: 1670px; } .amazingbaby_global_sec { padding: 0 0 150px; } .amazingbaby_global_sec .content-width { max-width: 1670px; } .amazing_mobile_screen .content-width { max-width: 1670px; } .amazing_mobile_screen img { width: 100%; } .amazing_mobile_screen h2 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 30px; line-height: 50px; text-align: center; color: #000000; max-width: 550px; margin: 65px auto 0; } .amazing_mobile_screen .row { margin-left: -40px; } .amazing_mobile_screen .row .col-50 { padding: 0 40px; } .amazing_mobile_screen .row .col-50:first-child { max-width: 43%; flex: 43%; } .amazing_mobile_screen .row .col-50:last-child { max-width: 58%; flex: 58%; } .amazing_mobile_screen .row .col-50:last-child img:first-child { margin-bottom: 80px; } .freez_childhood { padding: 150px 0; } .freez_childhood .content-width { max-width: 1670px; } .amazing_home_about { padding: 150px 0; } .amazing_home_about .content-width { max-width: 1670px; } .amazingbaby_slide_section { padding: 0 0 120px; } .amazingbaby_slide_section .content-width { max-width: 1670px; } .amazingbaby_slide_section .row { margin: 0 -42px; } .amazingbaby_slide_section .col { padding: 0 42px; } .amazingbaby_slide_section .col-75 { max-width: 60%; flex: 60%; } .amazingbaby_slide_section .col-25 { max-width: 40%; flex: 40%; } .amazingbaby_slide_section img { width: 100%; height: 100%; } .amazingbaby_mobile_screen {} .amazingbaby_mobile_screen .black_background { background-color: #000; padding: 135px 93px; } .amazingbaby_mobile_screen .content-width { max-width: 1670px; } .amazingbaby_mobile_screen .row { margin: 0 -35px; } .amazingbaby_mobile_screen .col { padding: 0 35px; } .amazingbaby_mobile_screen img { width: 100%; } @media screen and (max-width: 1600px) { .portfolio_banner_text { padding: 255px 0 100px; } .portfolio_banner_text h1 { font-size: 70px; line-height: 80px; } .launch_projects_bg_white { padding: 150px 0 150px; } .approch_section_bg_white { padding: 0 0 30px; } .solution_section { padding: 150px 0; } .parallax_section2_bg_white { padding: 150px 0; } .website_video { margin: 0 0 150px; } .parallax_section2 { padding: 0; } } @media screen and (max-width: 1366px) { .portfolio_banner_text { padding: 200px 0 100px; } .portfolio_banner_text h1 { font-size: 40px; line-height: 50px; } .launch_projects_bg_white { padding: 60px 0; } .launch_projects_bg_white .all-cases-button { margin-top: 30px; } .approch_section_bg_white { padding: 0; } .parallax_section { padding: 0; } .parallax_section_bg_white h2 { font-size: 25px; } .solution_section { padding: 60px 0; } .solution_section_bg_white h2 { font-size: 25px; line-height: 40px; } .solution_section_bg_white p { font-size: 25px; line-height: 40px; } .parallax_section2_bg_white { padding: 60px 0 0; } .portfolio_two_boxes { padding: 0 0 60px; } .portfolio_two_boxes .portfolio_col { padding: 0 10px; } .website_video { margin: 0 0 60px; } .parallax_section_bg_white .parallax_col { padding: 0 10px; } .parallax-background video { border-radius: 10px; min-width: auto; width: 100%; height: auto; object-fit: contain; border: 2px solid #000; } .launch_projects_bg_white ul li { font-size: 20px; line-height: 45px; } .launch_projects_bg_white p { font-size: 25px; line-height: 40px; } .amazingbaby_global_sec { padding: 0 0 100px; } .mobile_screen_with_logo img { object-fit: contain; } .mobile_screen_with_logo .row { margin: 0; } .mobile_screen_with_logo .col-75 { max-width: 65%; flex: 65%; } .mobile_screen_with_logo .col-25 { max-width: 35%; flex: 35%; } .mobile_screen_with_logo .mobile_scre_log { display: none; } .mobile_screen_with_logo .content-width { margin-right: 20px; } .mobile_screen_with_logo { padding: 0; } .portfolio_short_discription { padding: 100px 0; } .portfolio_short_discription p { font-size: 25px; line-height: 40px; } .website_video .content-width { padding: 100px 15px; } .dairy_that_section { padding: 100px 0; } .freez_childhood { padding: 100px 0 0; } .amazing_home_about { padding: 0 0 100px; } .amazingbaby_mobile_screen .black_background { padding: 50px 50px; } .approch_section { padding: 50px 0 130px; } .approch_section .content-width div { font-size: 25px; line-height: 40px; } .latest_work { padding: 0; } #sectionPin .pin-wrap { padding-left: 10px; } #sectionPin .scroll_item { width: 460px; } .latest_work h3 { font-size: 25px; margin: 30px 0 20px; } #sectionPin { padding: 0; align-items: center; } .getintouch_pinkbg { height: 50vh; } .getintouch_pinkbg h2 { font-size: 32px; line-height: 128%; } .getintouch_pinkbg a { font-size: 22px; } .paynship_greenbg_sub img { width: 80%; } .portfolio_solution_discription { padding: 120px 0; } .paynship_profile_dash2 { padding: 0 0 70px; } } @media screen and (max-width: 1200px) { .portfolio_banner_text { padding: 100px 0; } .portfolio_banner_text h1 { font-size: 40px; line-height: 50px; } .launch_projects_bg_white { padding: 60px 0; } .launch_projects_bg_white .all-cases-button { margin-top: 30px; } .approch_section_bg_white { padding: 0; } .parallax_section { padding: 0; } .parallax_section_bg_white h2 { font-size: 25px; } .solution_section { padding: 60px 0; } .solution_section_bg_white h2 { font-size: 25px; line-height: 40px; } .solution_section_bg_white p { font-size: 25px; line-height: 40px; } .parallax_section2_bg_white { padding: 60px 0 0; } .portfolio_two_boxes { padding: 0 0 60px; } .portfolio_two_boxes .portfolio_col { padding: 0 10px; } .website_video { margin: 0 0 60px; } .parallax-background video { border-radius: 10px; min-width: auto; width: 100%; height: auto; object-fit: contain; border: 2px solid #000; } } @media screen and (max-width: 1024px) { .portfolio_banner_text { padding: 60px 0; } .portfolio_banner_text h1 { font-size: 30px; line-height: 40px; } .portfolio_banner_text span { font-size: 22px; line-height: 30px; } .parallax-background { height: auto; } .launch_projects_bg_white { padding: 60px 0; } .launch_projects_bg_white .project_row { display: block; } .launch_projects_bg_white .project_col:first-child, .launch_projects_bg_white .project_col:last-child { width: 100%; } .launch_projects_bg_white ul { padding: 0 0 30px; display: flex; flex-wrap: wrap; } .launch_projects_bg_white ul li { max-width: 50%; flex: 50%; font-size: 20px; line-height: 35px; } .launch_projects_bg_white p { font-size: 22px; line-height: 35px; } .launch_projects_bg_white .all-cases-button { margin-top: 30px; } .website_video .content-width { padding: 30px 20px; } .approch_section_bg_white { padding: 60px 0 0; } .approch_section_bg_white div { font-size: 22px; line-height: 35px; padding: 0 15px 30px; } .approch_section_bg_white div span { font-size: 22px; line-height: 35px; } .parallax_section_bg_white h2 { font-size: 22px; line-height: 35px; margin: 50px auto !important; } .parallax_section { padding: 0; } .solution_section { padding: 60px 0; } .solution_section_bg_white h2 { font-size: 20px; line-height: 35px; } .solution_section_bg_white p { font-size: 22px; line-height: 35px; } .parallax_section2_bg_white { padding: 60px 0 0; } .portfolio_two_boxes { padding: 0 0 60px; } .left_scroller { margin: 0 0 60px; } .parallax-background video { border-radius: 10px; min-width: auto; width: 100%; height: auto; object-fit: contain; border: 2px solid #000; } .mobile_screen_with_logo .col-75 { max-width: 65%; flex: 65%; } .mobile_screen_with_logo .col-25 { max-width: 35%; flex: 35%; } .mobile_screen_with_logo img { height: 350px; object-fit: contain; } .mobile_screen_with_logo p { font-size: 20px; line-height: 35px; } .mobile_screen_with_logo .mobile_scre_log { display: none; } .mobile_screen_with_logo .content-width { margin-right: 35px; } .amazingbaby_global_sec { padding: 0 0 60px; } .mobile_screen_with_logo { padding: 0 0 100px; } .portfolio_short_discription { padding: 100px 0; } .portfolio_short_discription p { font-size: 25px; line-height: 40px; } .dairy_that_section { padding: 60px 0 100px; } .amazing_mobile_screen .row .col-50:first-child, .amazing_mobile_screen .row .col-50:last-child { max-width: 50%; flex: 50%; padding: 15px; } .amazing_mobile_screen .row .col-50:last-child img:first-child { margin-bottom: 75px; } .amazing_mobile_screen .row { margin: 0; } .amazing_mobile_screen h2 { font-size: 25px; line-height: 39px; margin: 20px auto 0; } .freez_childhood { padding: 90px 0 0; } .amazing_home_about { padding: 0 0 100px; } .amazingbaby_slide_section { padding: 0 0 100px; } .amazingbaby_mobile_screen { padding: 0 0 100px; } .amazingbaby_mobile_screen .black_background { padding: 25px 25px; } .amazingbaby_mobile_screen .row { margin: 0 -15px; } .amazingbaby_mobile_screen .col { padding: 0 15px; } .approch_section { padding: 60px 0 50px; } .left_scroller { padding: 0 0 40px; } .approch_section .content-width div { font-size: 25px; line-height: 40px; } .latest_work { padding: 0; } #sectionPin .pin-wrap { padding-left: 10px; } #sectionPin .scroll_item { width: 460px; } .latest_work h3 { font-size: 25px; margin: 30px 0 20px; } #sectionPin { padding: 0; align-items: center; } .getintouch_pinkbg { height: 50vh; } .getintouch_pinkbg h2 { font-size: 32px; line-height: 128%; } .getintouch_pinkbg a { font-size: 22px; } .paynship_global_sec img { width: 45%; } .paynship_greenbg_sub img { width: 80%; } .one_click_solution { padding: 0 0 60px; } .everything_at_your { padding: 60px 0; } .portfolio_solution_discription { padding: 80px 0; } .portfolio_solution_discription .content-width p, .portfolio_solution_discription .content-width b { font-size: 25px; line-height: 35px; } .paynship_profile_dash { padding: 50px 0; } .wordmark_section .wordmark_row { margin: 0; } .yofo .approch_section_bg_white { padding: 30px 0 0; } .sainfra_scripting .sainfra_script_row { margin: 0 -15px; } .sainfra_scripting .sainfra_script_col { padding: 0 15px; } .sainfra_scripting { padding: 0; } .sainfra_innerpage_img { padding: 0 0 100px; } .sainfra_left_side { padding: 0 0 100px; } } @media screen and (max-width: 767px) { .portfolio_banner_text { padding: 60px 0; } .portfolio_banner_text h1 { font-size: 25px; line-height: 30px; } .portfolio_banner_text span { font-size: 19px; line-height: 20px; } .parallax-background { height: auto; } .launch_projects_bg_white { padding: 60px 0; } .launch_projects_bg_white .project_row { display: block; } .launch_projects_bg_white .project_col:first-child, .launch_projects_bg_white .project_col:last-child { width: 100%; } .launch_projects_bg_white ul { padding: 0 0 30px; display: flex; flex-wrap: wrap; } .launch_projects_bg_white ul li { max-width: 50%; flex: 50%; font-size: 20px; line-height: 35px; } .launch_projects_bg_white p { font-size: 22px; line-height: 35px; } .launch_projects_bg_white .all-cases-button { margin-top: 30px; } .website_video .content-width { padding: 30px 20px; } .yofo .parallax-object { background-size: cover; min-height: 350px; } .approch_section_bg_white { padding: 60px 0 0; } .approch_section_bg_white div { font-size: 22px; line-height: 35px; padding: 0 15px 30px; } .approch_section_bg_white div span { font-size: 22px; line-height: 35px; } .parallax_section .parallax_row { display: block; } .parallax_section_bg_white .parallax_col:first-child img:nth-child(1) { padding: 0 0 30px; } .parallax_section .parallax_col { max-width: 100%; flex: 100%; padding: 0 0 30px; transform: none !important; } .parallax_section .parallax_col:last-child { padding: 0; } .parallax_section_bg_white h2 { font-size: 22px; line-height: 35px; margin: 50px auto !important; } .parallax_section { padding: 0; } .solution_section { padding: 60px 0; } .solution_section .solution_row { flex-wrap: wrap; } .solution_section_bg_white .solution_col:first-child, .solution_section .solution_col:last-child { max-width: 100%; flex: 100%; padding: 0; } .solution_section_bg_white h2 { font-size: 20px; line-height: 35px; } .solution_section_bg_white p { font-size: 22px; line-height: 35px; } .parallax_section2_bg_white { padding: 60px 0 0; } .parallax_section2 .parallax_row { display: block; } .parallax_section2 .parallax_row .parallax_col:first-child, .parallax_section2 .parallax_row .parallax_col:last-child { max-width: 100%; flex: 100%; width: 100%; padding: 0; transform: none !important; } .parallax_section2_bg_white .parallax_col:first-child img:nth-child(1), .parallax_section2_bg_white .parallax_col:first-child img:nth-child(2), .parallax_section2_bg_white .parallax_col:first-child img:nth-child(3), .parallax_section2_bg_white .parallax_col:last-child img:nth-child(1) { padding: 0 0 30px; } .portfolio_two_boxes { padding: 0 0 60px; } .portfolio_two_boxes .portfolio_row { display: block; } .portfolio_two_boxes .portfolio_col { max-width: 100%; flex: 100%; padding: 0 0 30px; } .portfolio_two_boxes .portfolio_col:last-child { padding: 0; } .parallax-background video { border-radius: 10px; min-width: auto; width: 100%; height: auto; object-fit: contain; border: 2px solid #000; } .mobile_screen_with_logo .mobile_scre_log { display: none; } .mobile_screen_with_logo .row { display: block; margin: 0; } .mobile_screen_with_logo img { height: auto; width: 100%; } .mobile_screen_with_logo .col-75, .mobile_screen_with_logo .col-25 { max-width: 100%; flex: 100%; padding: 0 0 30px; } .mobile_screen_with_logo .content-width { margin-right: auto; } .mobile_screen_with_logo { padding: 0; } .amazingbaby_global_sec { padding: 0; } .mobile_screen_with_logo p { font-size: 24px; line-height: 35px; } .portfolio_short_discription { padding: 40px 0; } .portfolio_short_discription p { font-size: 24px; line-height: 35px; } .dairy_that_section { padding: 0 0 60px; } .amazing_mobile_screen .row { display: block; margin: 0; } .amazing_mobile_screen .row .col-50:first-child, .amazing_mobile_screen .row .col-50:last-child { max-width: 100%; padding: 0; } .amazing_mobile_screen h2 { font-size: 24px; line-height: 35px; margin: 30px auto 30px; } .amazing_mobile_screen .row .col-50:last-child img:first-child { margin-bottom: 50px; } .freez_childhood { padding: 50px 0 0; } .amazing_home_about { padding: 0 0 50px; } .amazingbaby_slide_section { padding: 0 0 50px; } .amazingbaby_mobile_screen .black_background { padding: 15px; } .amazingbaby_mobile_screen .row { margin: 0; display: block; } .amazingbaby_mobile_screen .col { padding: 0 0 15px; max-width: 100%; } .approch_section { padding: 40px 0 30px; } .left_scroller { padding: 0; } .approch_section .content-width div { font-size: 24px; line-height: 35px; padding: 0 0 30px !important; } .latest_work { padding: 0; } #sectionPin .pin-wrap { padding-left: 10px; } #sectionPin .scroll_item { width: 460px; } .latest_work h3 { font-size: 25px; margin: 30px 0 20px; } #sectionPin { padding: 0; align-items: center; } .getintouch_pinkbg { height: 50vh; } .getintouch_pinkbg h2 { font-size: 32px; line-height: 128%; } .getintouch_pinkbg h2 br { display: none; } .getintouch_pinkbg a { font-size: 22px; } .paynship_global_sec img { width: 60%; } .paynship_global_sec { padding: 60px 0 70px; } .wordmark_section .wordmark_row { margin: 0; display: block; } .wordmark_section .wordmark_col { max-width: 100%; flex: 100%; padding: 0 0 40px; } .paynship_greenbg_sub { padding: 40px 0; } .paynship_greenbg_sub img { width: 100%; padding: 0 20px; } .one_click_solution { padding: 0 0 60px; } .paynship_global_keeps .wordmark_row { display: block; margin: 0; } .paynship_global_keeps .wordmark_col { max-width: 100%; flex: 100%; padding: 0; } .everything_at_your { padding: 60px 0; } .portfolio_solution_discription { padding: 70px 0; } .portfolio_solution_discription .content-width p, .portfolio_solution_discription .content-width b { font-size: 25px; line-height: 35px; } .paynship_profile_dash { padding: 60px 0; } .paynship_profile_dash .row { margin: 0; display: block; } .paynship_profile_dash .col-50 { padding: 0; max-width: 100%; flex: 100%; } .yofo .approch_section_bg_white { padding: 50px 0 30px; } .parallax_section2 .parallax_row { margin: 0; } .portfolio_two_boxes .portfolio_row { margin: 0; } .sainfra_page { padding: 0 0 60px; } .sainfra_case_study { padding: 0 0 60px; } .sainfra_scripting .sainfra_script_row { display: block; margin: 0; } .sainfra_scripting .sainfra_script_col { padding: 0; max-width: 100%; padding: 0 0 60px; } .sainfra_scripting .sainfra_script_col:last-child { padding: 0; } .sainfra_scripting { padding: 0; } .sainfra_innerpage_img { padding: 0 0 60px; } .sainfra_left_side .sainfra_left_side_row { display: block; margin: 0; } .sainfra_left_side .sainfra_left_side_col { max-width: 100%; padding: 0; } .sainfra_left_side { padding: 0 0 60px; } .sainfra_left_side p { font-size: 25px; line-height: 35px; } } /* StartUp Page */ .Bold_subtext { color: #fe6571; } .texttypo.transformText p { font-size: 72px; line-height: 90px; text-transform: inherit; } .startup_banner { width: 100%; float: left; padding: 60px 0 0; position: relative; z-index: 111; } .startup_banner .content-width { max-width: calc(100vw / 2 + 873px / 1.5); margin: 0 auto; } .startup_banner .content-width p { font-size: 25px; line-height: 36px; font-weight: 300; } .subtext { width: 62%; } .mutual-firm-work.section span { color: #fe6571; font-family: 'Josefin Sans'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 14px; letter-spacing: 0.2em; text-transform: uppercase; } .mutual-firm-work.section h4 { padding-top: 40px; font-family: 'Josefin Sans'; font-style: normal; font-weight: 600; font-size: 42px; line-height: 48px; } .align-row { display: flex; flex-direction: row; /* align-items:center; */ } .align-row .column-50 { max-width: 49%; } .mutual-firm-work.section .align-row span { color: black; } .Upheading { max-width: 40%; } .startUpdetail { /* height:100vh; */ padding-left: 0px; background-color: black; } .startUpdetail h2 { color: #FE6571; padding-top: 146px; } .startUpdetail p { color: white; } /*************swiper Slider*********/ .start-up-service { width: 100%; height: 100vh; background-color: #000; } .start-up-service.swiper-slide { position: relative; } .start-up-service .slide-1 { margin-left: 8%; background-position-x: center; background-position-y: center; background-image: url('https://d1qa1ziodjk9pt.cloudfront.net/images/image_11.png'); background-repeat: no-repeat; } .start-up-service .slide-2 { margin-left: 0%; background-position-x: center; background-position-y: center; background-image: url('https://d1qa1ziodjk9pt.cloudfront.net/images/image_11.png'); background-repeat: no-repeat; } .start-up-service .slide-3 { margin-left: 0%; background-position-x: center; background-position-y: center; background-image: url('https://d1qa1ziodjk9pt.cloudfront.net/images/image_11.png'); background-repeat: no-repeat; } .start-up-service .slide-4 { margin-left: -5%; background-position-x: center; background-position-y: center; background-image: url('https://d1qa1ziodjk9pt.cloudfront.net/images/image_11.png'); background-repeat: no-repeat; } .start-up-service .slide-5 { margin-left: 4%; background-position-x: center; background-position-y: center; background-image: url('https://d1qa1ziodjk9pt.cloudfront.net/images/image_11.png'); background-repeat: no-repeat; } .start-up-service .slide-6 { margin-left: 1%; background-position-x: center; background-position-y: center; background-image: url('https://d1qa1ziodjk9pt.cloudfront.net/images/image_11.png'); background-repeat: no-repeat; } /* Slide captions */ .start-up-service .slide-captions { width: 463px; height: 312px; /* width: 22%; */ position: absolute; left: 390px; top: 520px; color: black; z-index: 999; transform: translateY(-50%); background-color: #FE6571; padding: 26px; font-size: 20px; /* height: 30%; */ } .start-up-service.slide-captions .current-title { position: absolute; font-size: 48px; font-weight: 300; color: white; top: -41% !important; } .start-up-service .slide-captions .current-title span { color: #FE6571; font-size: 27px; } .start-up-service .slide-captions .current-subtitle { font-size: 19px; padding: 30px; font-weight: 300; line-height: 32px; color: white; } .start-up-service .slide-captions .current-subtitle button { margin-top: 63px; font-size: 23px; } /* Swiper arrows */ .start-up-service .swiper-pagination-bullet-active { background-color: #fff; } /* Swiper pagination */ .start-up-service .swiper-button-prev, .swiper-button-next { color: #fff; } .start-up-service .swiper-pagination { width: 50%; } .start-up-service .swiper-pagination.swiper-pagination-clickable { background-color: white; } .start-up-service .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets { display: none; padding: 20px; } .start-up-service .swiper-button-prev, .swiper-button-next { display: none; } .step-description { font-size: 0.8rem; } .shivi_guru .swiper-container-wrapper { position: relative; } .shivi_guru .swiper-container-wrapper--timeline .swiper-slide { display: flex; align-items: center; justify-content: center; border-radius: 10px; } .shivi_guru .swiper-container-wrapper--timeline .swiper-slide .container { padding: 0; width: 100%; } .shivi_guru .swiper-container-wrapper--timeline .swiper-slide .title { font-size: 18px; opacity: 0; transition: 0.5s ease 0.5s; } .shivi_guru .swiper-container-wrapper--timeline .swiper-slide-active .title { opacity: 1; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-progressbar { position: relative; margin-bottom: 70px; background-color: transparent; height: 4px; border-bottom: 1px solid #888; width: 75%; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-progressbar-fill { background-color: #FE6571; height: 3px; top: 2px; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-progressbar:before { position: absolute; top: 2px; left: -100%; width: 100%; height: 3px; background-color: #000; content: ""; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-progressbar:after { position: absolute; top: 3px; right: -100%; width: 100%; height: 1px; background-color: #888; content: ""; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom { position: relative; list-style: none; margin: 1rem 0; padding: 0; display: flex; line-height: 1.66; bottom: 0; z-index: 11; width: 75%; display: flex; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch { position: relative; width: 100%; height: 30px; line-height: 30px; display: block; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch .switch-title { position: absolute; font-weight: 400; right: 0; transform: translateX(50%); transition: 0.2s all ease-in-out; transition-delay: 0s; cursor: pointer; z-index: 1; color: #FE6571; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch .switch-title:after { position: absolute; top: calc(100% + 19px); right: 50%; transform: translateX(50%) translateY(-50%); width: 12px; height: 12px; background: #FE6571; border-radius: 2rem; content: ""; transition: 0.2s all ease-in-out; transition-delay: 0s; z-index: 1; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active .switch-title { font-weight: 400; transition-delay: 0.4s; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active .switch-title:after { background: #FE6571; width: 25px; height: 25px; transition-delay: 0.4s; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active~.swiper-pagination-switch .switch-title { color: #F3F3F3; font-weight: 16px; } .shivi_guru .swiper-container-wrapper--timeline .swiper-pagination-custom .swiper-pagination-switch.active~.swiper-pagination-switch .switch-title:after { background: #F3F3F3; } .shivi_guru { background-color: #141414; padding: 200px 0; } .shivi_guru .shivi_guru_content, .shivi_guru .shivi_guru_slider { position: relative; z-index: 111; } .shivi_guru .container { position: relative; z-index: 111; max-width: 1463px; padding: 0 15px; } .shivi_guru .shivi_guru_content h2 { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 400; font-size: 36px; line-height: 48px; letter-spacing: 0.15em; text-transform: uppercase; color: #FE6571; margin: 0; padding: 0 0 30px; } .shivi_guru .shivi_guru_content p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 24px; line-height: 36px; color: #FFFFFF; max-width: 675px; } .shivi_guru_content { padding: 0 0 200px; } .pagination_process { display: block; position: absolute; width: 100%; bottom: -180px; } .content_block { background-color: #FE6571; width: 463px; height: 300px; padding: 30px; position: absolute; bottom: 40px; left: -150px; } .content_block p { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 300; font-size: 24px; line-height: 36px; color: #FFFFFF; padding: 0 0 35px; } .content_block .slider_text_style strong { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 400; font-size: 48px; line-height: 48px; text-transform: uppercase; color: #FFFFFF; } .content_block .slider_text_style span { font-family: 'Josefin Sans', sans-serif; font-style: normal; font-weight: 400; font-size: 24px; line-height: 24px; text-transform: uppercase; color: #FE6571; } .content_block .slider_title { position: absolute; top: -80px; width: 100%; display: flex; align-items: center; } .slider_image_block { width: 800px; height: 563px; margin-left: auto; height: 100%; } .slider_image_block img { width: 100%; } .partner_logo_section { padding: 0px 0px 80px 0; background-color: white; } .partner_logo_section .partner_logo ul { display: flex; flex-wrap: wrap; justify-content: center } .partner_logo_section .partner_logo ul li { max-width: 20%; flex: 20%; padding: 10px 0; padding: 10px 0 } .partner_logo_section .partner_logo ul li:nth-child(9), .partner_logo_section .partner_logo ul li:nth-child(18), .partner_logo_section .partner_logo ul li:nth-child(27) { margin-right: 1% } .partner_logo_section .partner_logo ul li img { width: 300px } .look-what-we-work-section h6 { text-align: center; margin: 0; position: relative; z-index: 1; margin-bottom: -90px; } .look-what-we-work-section { padding: 0px 0; position: relative; overflow: hidden; background-color: #fff; z-index: 11 } .menu-toggle .la-bars { font-size: 24px; font-weight: bolder; } .header__logo.js-replace .texttypo .la-bars { color: white; } /* a.btn_hiring {margin: -3px 60px 0 0;color: black;border-radius: 51px;} a.btn_hiring.default-button.type-comp2.theme-white.animate.false.anchor-tag-btn {margin: -7px 140px 0 0;padding: 0px;} */ /* .marquee { --duration: 60s; --gap: var(--space); padding: 20px; display: flex; overflow: hidden; user-select: none; } */ .marquee__group { padding: 15px 0 15px 0; z-index: 20; } .js-marquee-wrapper { display: flex; } .js-marquee { display: flex; } .marquee__group .marquee_img { padding: 0 20px; } /* .marquee__group .marquee_img img { width: 230px; max-width: 230px; } */ .project_marquee1 { padding: 25px 0 25px; } /* .marquee__group .marquee_img img{ display: flex; align-items: center; } */ @media (prefers-reduced-motion: reduce) { .marquee__group { animation-play-state: paused; } } .marquee__group .marquee_img { object-fit: cover; border-radius: 1rem; } .marquee__group p { background-image: linear-gradient(75deg, hsl(240deg 70% 49%) 0%, hsl(253deg 70% 49%) 11%, hsl(267deg 70% 49%) 22%, hsl(280deg 71% 48%) 33%, hsl(293deg 71% 48%) 44%, hsl(307deg 71% 48%) 56%, hsl(320deg 71% 48%) 67%, hsl(333deg 72% 48%) 78%, hsl(347deg 72% 48%) 89%, hsl(0deg 73% 47%) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .marquee--borders { border-block: 3px solid dodgerblue; padding-block: 0.75rem; } .marquee--reverse .marquee__group { animation-direction: reverse; animation-delay: calc(var(--duration) / -2); } @keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(calc(-100% - var(--gap))); } } .header_popup { text-align: center; width: 200px; z-index: 9999; position: fixed; color: #FE6571; float: left; bottom: 20px; left: 20px; background: #FFFFFF; border: 1.5px solid #000000; border-radius: 20px; } .header_popup img { align-items: center; margin: auto; text-align: center; padding: 15px 29px 0 29px; } .header_popup a { text-align: center; display: block; color: #FE6571; padding-bottom: 10px; font-weight: 500; } .header_popup a i.las.la-arrow-right { color: #000000; padding: 3px 8px; font-size: 18px; } h6.newadd_client { padding-bottom: 100px; } /********latest**************/ .cust_video_wrapper { position: relative; z-index: 11; } .cust_video_wrapper video { width: 100%; height: auto !important; } .client-review-section #tetimonial { margin-top: 90px; } .banner_wrapper>.text_btn { margin-top: 50px; } .banner_wrapper .swiper-slide .img_block { display: flex; flex-direction: column; gap: 30px; } .technology_scrollig_icon { min-height: 200px; } .explore-more-project .look-what-we-work-section { padding: 100px 0; } .services-page .look-what-we-work-section .marquee-wrapper .marquee-block { min-height: 450px; } .header_popup .popup-title .highlight-color { color: #fe6571; font-weight: 600; } /* .header_popup { border-color: #FE6571; transform: translateX(-120%); transition: transform 0.5s linear; transform-origin: left; } */ .content-loaded .header_popup { transform: translateX(0); } /* .header_popup a { color: #000; padding: 20px; } */ .header_popup .popup-title { font-family: 'Josefin Sans', sans-serif; font-size: 18px; font-weight: 500; color: #000; display: block; margin-top: 15px; line-height: 1.5; } .twitter-x { width: 18px; height: 25px; } .twitter-x path { fill: #fff; transition: all 0.5s ease-in; } .social-menu li a:hover .twitter-x path { fill: #fff; } .footer-css .site-footer .social-menu li a:hover .twitter-x path { fill: #000; } .portfolio-ocfx { background: #000000; } .portfolio-ocfx .launch_projects_bg_white { padding: 200px 0 200px; } .text-white, .portfolio-ocfx .launch_projects_bg_white ul li, .portfolio-ocfx .launch_projects_bg_white a { color: #fff; } .portfolio_banner_text.ocfx { background: url(../images/portfolio-image/ocfx/p-ocfx-bg.png) center no-repeat; position: relative; width: 100%; height: 120vh; padding: 255px 80px 205px; } .p-ocfx-content { display: flex; align-items: center; justify-content: center; height: 100%; } .portfolio-ocfx h4 { font-size: 36px; font-weight: 400; line-height: 1.2; } .portfolio-ocfx .project-text { margin-bottom: 35px; } .portfolio-vts p, .portfolio-ocfx h6 { font-size: 24px; line-height: 1.3; color: #404040; font-weight: 300; } .portfolio-ocfx p, .portfolio-ocfx h6, .portfolio-ocfx .menu-toggle .la-bars { color: #fff; } .portfolio-ocfx h6 { font-weight: 400; text-transform: capitalize; } .portfolio-ocfx .cls-1-mobile { fill: #fff; } .visit-btn { font-size: 24px; font-weight: 400; margin-top: 40px; display: inline-block; } .visit-btn span { text-decoration: underline; } .visit-btn svg { margin-left: 5px; } .portfolio-ocfx .launch_projects_bg_white .default-button.theme-white { color: #fff; } .portfolio-ocfx .launch_projects_bg_white .default-button.theme-white .button-background .right:before, .portfolio-ocfx .default-button.theme-white .button-background .center, .portfolio-ocfx .default-button.theme-white .button-background .left:before { background: #373737; } .portfolio-ocfx .launch_projects_bg_white .default-button.theme-white .plus-icon:after, .portfolio-ocfx .launch_projects_bg_white .default-button.theme-white .plus-icon:before { background-color: #fff; } .ocfx-logos-banner { padding: 0 50px; } .logo-banner { margin-bottom: 50px; } .ocfx-me.launch_projects_bg_white .project_col:last-child { width: 100%; } .sainfra_script_col_four { max-width: 40%; flex: 40%; padding: 0 20px; } .sainfra_script_col_six { max-width: 60%; flex: 60%; padding: 0 20px; } .ocfx-logos-banner .sainfra_script_col { padding: 0 20px; } .solution-bg, .elevate-bg { background: #333333; padding: 70px 70px 0; border-radius: 20px; margin: 0 20px 50px; text-align: center; } .solution-img { position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; } .elevate-bg { background: #E43120; } .solution-bg { position: relative; height: 888px; } .elevate-inner { display: flex; align-items: center; justify-content: center; height: 100%; } .ocfx-logos-banner .elevate-img { height: 888px; object-fit: cover; border-radius: 20px; } .approch_section_bg_white.quote-bg .quote-icon { font-size: 128px; font-weight: 500; position: absolute; top: -4%; left: -3%; color: #fff; } .approch_section_bg_white.quote-bg .ceo-desc { position: relative; font-size: 36px; padding: 0 0 0 10px; } .approch_section_bg_white.quote-bg .ceo-name { font-size: 40px; color: #2FBC9E; } .quote-bg .ceo-name { margin-top: 80px; } .ceo-designation { margin-top: 16px; } .approch_section_bg_white.quote-bg { padding: 200px 0 200px; } .approch_section_bg_white.quote-bg div { padding: 0; } .ocfx-masonary-grid { padding: 0 50px; } .ocfx-masonary-grid .row { max-width: 100%; width: 100%; flex-wrap: wrap; } .ocfx-masonary-grid .col-40 { width: 40%; flex: 0 0 auto; padding: 0 15px; } .ocfx-masonary-grid .col-60 { width: 60%; flex: 0 0 auto; padding: 0 15px; } .ocfx-masonary-grid .col-80 { width: 80%; flex: 0 0 auto; padding: 0 15px; } .ocfx-masonary-grid .col-20 { width: 20%; flex: 0 0 auto; padding: 0 15px; } .ocfx-masonary-grid .grid-sizer, .ocfx-masonary-grid .grid-item { width: 50%; } .grid-item.portrait { width: 50%; } .grid-item.portrait-sm { width: 20%; } .grid-item.landscape-sm { width: 30%; } .grid-item.landscape, .grid-item.square { width: 40%; } .portfolio-ocfx .header__logo.js-replace.js-replace--reverse .texttypo p, .portfolio-ocfx .default-button.theme-white { color: #fff; } .portfolio-ocfx .header__logo.js-replace.js-replace--reverse svg .cls-1 { fill: #fff; } .mb-30 { margin-bottom: 30px; } .portfolio-ocfx .header .launch_projects_bg_white .default-button.theme-white .button-background .right:before, .portfolio-ocfx .header .default-button.theme-white .button-background .center, .portfolio-ocfx .header .default-button.theme-white .button-background .left:before, .portfolio-ocfx .header .default-button.theme-white .button-background .center, .portfolio-ocfx .header .default-button.theme-white .button-background .left:before, .portfolio-ocfx .header .default-button.theme-white .button-background .right:before { background: rgb(153 153 153 / 45%); } .sainfra_scripting .sainfra_script_row.elevate { margin: 0 -20px; } @media(max-width:1600px) { .solution-img { width: 80%; } .elevate-bg, .solution-bg { padding: 30px 30px 0; } .solution-bg { height: 788px; } } @media(max-width:1500px) { .approch_section_bg_white.quote-bg { padding: 200px 70px 200px 70px; } .portfolio-ocfx .latest_work { padding: 0; } .tracking-desc { padding: 150px 30px 150px; } } @media(max-width:1440px) { .portfolio-ocfx .launch_projects .content-width { padding: 0 15px; } .portfolio-ocfx .launch_projects_bg_white .project_col:first-child { width: 30%; padding: 0 15px; } .portfolio-ocfx .launch_projects_bg_white .project_col:last-child { width: 70%; padding: 0 15px; } .portfolio-ocfx .launch_projects_bg_white { padding: 150px 0 150px; } .portfolio-ocfx .launch_projects_bg_white.tracking-desc { padding: 150px 30px 150px; } .approch_section_bg_white.quote-bg { padding: 150px 70px 150px 70px; } .approch_section_bg_white.quote-bg .ceo-desc { width: 100%; } } @media(max-width:1199px) { .solution-bg { height: 588px; } } @media(max-width:1024px) { .portfolio-ocfx .launch_projects_bg_white .project_row { display: flex; } .portfolio-ocfx .launch_projects_bg_white.tracking-desc { padding: 100px 0px 100px; } .portfolio-ocfx .launch_projects_bg_white ul { flex-direction: column; flex-wrap: nowrap; } .portfolio-ocfx .launch_projects_bg_white ul li { max-width: 100%; flex: 100%; } .ocfx-masonary-grid { padding: 0 30px; } .ocfx-logos-banner { padding: 0 30px; } .approch_section_bg_white.quote-bg { padding: 100px 50px 100px 50px; } .solution-bg { height: 530px; } } @media(max-width:991px) { .portfolio-ocfx .launch_projects_bg_white .project_col:first-child, .portfolio-ocfx .launch_projects_bg_white .project_col:last-child { width: 100%; } .portfolio-ocfx .launch_projects_bg_white .project_row { flex-direction: column; } .overview-text { margin-bottom: 20px; } .sainfra_script_row.elevate .sainfra_script_col_four, .sainfra_script_row.elevate .sainfra_script_col_six { max-width: 100%; flex: 100%; } .sainfra_script_row.elevate { flex-direction: column; } .solution-img { position: static; width: 80%; } .elevate-bg { padding: 60px; } .solution-bg { height: auto; } } @media(max-width:767px) { .portfolio-ocfx .launch_projects .content-width { padding: 0; } .portfolio-ocfx .launch_projects_bg_white.tracking-desc { padding: 70px 0px 70px; } .portfolio-ocfx .launch_projects .content-width.device-space { padding: 0 15px; } .approch_section_bg_white.quote-bg { padding: 70px 30px 70px 30px; } .ocfx-logos-banner { padding: 0 15px; } .logo-banner { margin-bottom: 30px; } .portfolio-ocfx .sainfra_scripting .sainfra_script_col:first-child { padding: 0; } .portfolio-ocfx .sainfra_scripting .sainfra_script_col:last-child { margin-top: 30px; } .ocfx-masonary-grid { padding: 0 15px; } .portfolio_banner_text.ocfx { height: 100vh; } .elevate-bg { padding: 30px; } .solution-bg { padding: 30px 0px 0; } } @media(max-width:575px) { .approch_section_bg_white.quote-bg { padding: 50px 15px 50px 15px; } .approch_section_bg_white.quote-bg { padding: 50px 15px 50px 15px; } .portfolio-ocfx .launch_projects_bg_white.tracking-desc { padding: 50px 0px 50px; } .portfolio_banner_text.ocfx { height: 70vh; } .portfolio-ocfx h4 { font-size: 30px; } .portfolio-ocfx .ceo-name { margin-top: 30px; } .approch_section_bg_white.quote-bg .ceo-desc { font-size: 30px; } .logo-banner { margin-bottom: 15px; } .portfolio-ocfx .sainfra_scripting .sainfra_script_col:last-child { margin-top: 15px; } .portfolio_banner_text.ocfx { background: url(../images/portfolio-image/ocfx/p-ocfx-bg.png) top 20% center no-repeat; } .greatplace { padding-bottom: 0; } .overlay-menu .greatplace { padding-bottom: 0; } } .cust_video_wrapper { position: relative; z-index: 11; } .cust_video_wrapper video { width: 100%; height: auto !important; } .twitter-x, .thread-ic { width: 20px; height: 20px; } .twitter-x path, .thread-ic path { fill: #fff; transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; } .home-page .site-footer ul li a:hover .twitter-x path, .home-page .site-footer ul li a:hover .thread-ic path, .menu-social-box ul li a:hover .twitter-x path, .menu-social-box ul li a:hover .thread-ic path { fill: #fff; } .site-footer ul li a:hover .twitter-x path, .site-footer ul li a:hover .thread-ic path { fill: #000; } /* indore popup banner*/ .popup-banner { background: url('/images/popup-pattern.png') no-repeat center; background-size: cover; padding: 100px 60px 150px; margin: 0 auto; width: 100%; } .popup-banner .twitter-x path, .popup-banner .thread-ic path { fill: #fff; } .popup-banner ul.social-menu li a .twitter-x, .popup-banner ul.social-menu li a .thread-ic { width: 20px; height: 20px; } /* .twitter-x path, .thread-ic path { fill: #fff; } */ .twitter-x path:hover, .thread-ic path:hover { fill: #fff; } ul.social-menu li a .twitter-x, ul.social-menu li a .thread-ic { width: 20px; height: 20px; } .mfp-inline-holder .mfp-content { margin: 0 auto; width: 1200px; } .popup-banner .mfp-close { opacity: 1 !important; right: -3% !important; top: 0 !important; color: #fff !important; width: 28px !important; height: 28px !important; line-height: 28px !important; background: rgba(46, 47, 50, 0.6) !important; } .center-r { justify-content: center; align-items: center; height: 100%; } .popup-banner .content-popup { display: flex; text-align: center; justify-content: center; align-items: center; flex-direction: column; gap: 40px; padding-top: 50px; } .popup-banner .text-popup { font-family: 'Gilroy-SemiBold'; color: #FFF; text-align: center; font-size: 28px; font-weight: 400; letter-spacing: 2.24px; } .i-text { color: #FE6571; font-family: 'Gilroy-SemiBold'; } .popup-banner .bg-color { background: #FE6571; display: flex; padding: 10px 20px; justify-content: center; align-items: center; gap: 10px; } .popup-banner ul.social-menu { gap: 20px; } .bg-color .date-text { font-family: 'Gilroy-SemiBold'; font-size: 24px; color: #fff; } .popup-banner .discription { font-family: 'Gilroy-Regular'; font-size: 20px; line-height: 1.3; font-weight: 400; color: #fff; } .popup-banner .caption { font-size: 20px; } ul.social-menu { display: flex; align-items: center; } ul.social-menu li { margin: 0 7px; } ul.social-menu li a { font-size: 30px; color: #fff; } ul.social-menu li a .twitter-x { width: 16px; height: 30px; } img.year-img { box-shadow: 0px 4px 4px 0px #00000040; } .year-text { font-family: 'Brittany Signature'; color: #FFF; font-size: 50px; font-weight: 400; } .popup-banner .banner-image { display: flex; align-items: flex-end; justify-content: center; margin-bottom: 30px; } .popup-banner .title-year { margin-bottom: 47px; margin-left: -40px; } .content-desc { position: relative; } .text-desc { font-family: 'ClashDisplay-Semibold'; font-size: 80px; font-weight: 600; color: #FE6571; text-align: center; } .white-text { position: absolute; top: 0; padding: 0 120px; } .w-text { font-family: 'Brittany Signature'; font-size: 80px; color: #FFF; font-weight: 400; } /* podcast 1-03 madhvi */ .popup-banner .title-podcast h2 { font-size: 18px; font-weight: 700; text-align: center; margin: 6px 0; color: #fff; line-height: 24px; } .title-podcast { margin: 0 auto; text-align: center; } /* .popup-banner .title-podcast h2, .popup-banner .title-podcast p, .popup-banner .reg-btn { text-transform: uppercase; }*/ .title-podcast h4 span.vibex_text { color: #FF09BA; font-size: 57px; vertical-align: middle; } .popup-banner .reg-btn { font-family: 'Josefin Sans Bold'; font-weight: 600; font-size: 14px; color: #000; background: #fff; border: 1px solid #fff; padding: 15px 20px 12px; line-height: normal; border-radius: 0; display: inline-block; text-transform: uppercase; position: relative; margin-top: 20px; } .popup-banner .reg-btn:hover { background: #fff; } .popup-banner .title-podcast p { font-size: 14px; color: #fff; padding-bottom: 0; } .d-block { display: block; } .title-podcast { margin: 0 auto; text-align: center; } .title-podcast h4 { color: #E9FE01; font-size: 57px; margin: 10px 0 0; font-family: 'Formula Condensed Bold'; } .meetup-date { font-size: 14px; position: relative; color: #fff; display: inline-block; } .meetup-date .m-vector { position: absolute; left: 0; bottom: -6px; } /*******Popup Slider*****/ #home-popup-slider { width: 100%; height: 100%; } #home-popup-slider .item { width: 100%; height: 300px; } .pre-meetup-live { background: url(../images/podcast-anilsir/pre-meetup-bg.png); background-size: cover; width: 100%; height: 300px; padding: 0 20px; } .pre-meetup-live .un-banner.top { top: 5%; left: 3%; width: 74px; } .pre-meetup-live .un-banner.bottom { width: 66px; bottom: 49%; right: 3%; left: auto; } .popup-banner .pre-meetup-live .reg-btn { margin: 20px 0 10px; } .popup-banner .pre-meetup-bt-line.one { margin: 30px 0 0; } .popup-banner .pre-meetup-bt-line.two { margin: 6px 0 0; } .popup-banner .pre-meetup-bt-line { font-size: 16px; font-weight: 700; text-align: center; color: #fff; line-height: 24px; } .popup-banner .pre-meetup-live .title-podcast p { font-size: 16px; } .popup-banner .pre-meetup-live .reg-btn { font-size: 21px; } /* end */ @font-face { font-family: 'Kanit semibold'; src: url('../fonts/Kanit-SemiBold.woff2') format('woff2'), url('../fonts/Kanit-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; } /****Anniversary Banner****/ /* .mini-popup-banner.lg-anniversary { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); right: auto; bottom: auto; width: 1120px; height: 545px; background: url(../images/bg-anniversary.jpg); background-size: cover; z-index: 999; overflow: hidden; padding: 80px; } .ani-date-label { font-size: 20px !important; background: #FE6571; padding: 10px 20px !important; height: auto; line-height: inherit; display: inline-block; margin: 0 auto; } .mini-popup-banner.lg-anniversary .anni-desc { font-size: 20px; margin-top: 40px !important; text-transform: capitalize !important; } .anni-title { font-size: 28px; margin-bottom: 24px; } .stat-tuned { margin-top: 40px; } .stat-tuned .social-menu { margin-bottom: 20px; justify-content: center; } .stat-tuned p { color: #FE6571 !important; text-transform: capitalize !important; font-size: 20px!important; } .stat-tuned .social-menu { margin-top: 20px; margin-bottom: 0; } .col-md-6 { width: 50%; padding: 0 16px; } */ .mini-popup-banner { position: fixed; right: auto; left: 1%; bottom: 15%; width: 300px; height: 300px; background: url(../images/designthon-banner.png); background-size: cover; z-index: 999; overflow: hidden; padding: 30px 30px; } .mini-popup-banner .popup-banner { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 0 0; background: none; position: relative; z-index: 2; } .popup-banner .title-podcast .sandskriti-title { font-family: 'Mundial Demibold'; font-size: 18px; color: #fff; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 5px; } .mini-popup-banner .close-ic { position: absolute; top: 10px; right: 10px; cursor: pointer; z-index: 99; } .mini-popup-banner.close-popup { display: none; } .location-places { display: flex; justify-content: space-between; margin: 25px 30px; } .location #tabs .tabcontent { width: 100%; } .des-title { width: 90%; } .mini-popup-banner .popup-banner .banner-image .year-img { width: 50px; } .mini-popup-banner .popup-banner .banner-image { margin-bottom: 0; } .mini-popup-banner .popup-banner .title-year { margin-bottom: 10px; margin-left: 0; } .mini-popup-banner .year-text { font-size: 18px; } .mini-popup-banner .popup-banner .text-desc { font-size: 22px; } .mini-popup-banner .white-text { position: absolute; top: auto; padding: 0; bottom: -30%; left: 50%; transform: translateX(-50%); } .mini-popup-banner .w-text { font-size: 20px; } .un-banner { position: absolute; left: 0; } .un-banner.top { top: 0; } .un-banner.bottom { bottom: -5px; } /************CSR page css*****************/ .csr-row { display: flex; flex-wrap: wrap; width: 100%; } .csr-row .csr-item, .csr-row .csr-item .cr-img { height: 100%; } .csr-row .csr-item img { width: 100%; height: 100%; max-width: 100%; object-fit: cover; } .csr-row .csr-item.f-row { height: 395px; } .csr-row .csr-item.s-row { height: 480px; } .csr-row .csr-item.t-row { height: 396px; } .csr-row .csr-item.fr-row { height: 480px; } .csr-row .csr-item.first { width: 30%; } .csr-row .csr-item.sec { width: 38%; } .csr-row .csr-item.third { width: 32%; } .csr-row .csr-item.four { width: 30%; } .csr-row .csr-item.five { width: 30%; } .csr-row .csr-item.six { width: 40%; } .csr-row .csr-item.seven { width: 60%; } .csr-row .csr-item.eight { width: 40%; } .csr-row .csr-item.nine { width: 38%; } .csr-row .csr-item.ten { width: 27%; } .csr-row .csr-item.eleven { width: 35%; } .team-block .csr-row figure { padding: 0; } .greatplace-footer { position: absolute; right: 7%; top: 0; display: inline-flex; } /**********Portfolio VTS***********/ .vts-content-width { /* width: 1670px; */ margin: 0 auto; } .mt-40 { margin-top: 40px; } .mb-100 { margin-bottom: 100px; } .pb-100 { padding-bottom: 100px; } .sainfra_scripting .vts_script_col { max-width: 38.5%; flex: 38.5%; padding: 0 42.5px; } .sainfra_scripting .vts_script_col_two { max-width: 61.5%; flex: 61.5%; padding: 0 42.5px; } .ceo-name { font-weight: 400; font-size: 24px; line-height: 24px; margin-top: 80px } .ceo-designation { font-weight: 300; font-size: 20px; line-height: 20px; margin-top: 16px; } .ceo-desc { width: 80%; font-weight: 300; font-size: 30px; line-height: 50px; } .sainfra_scripting.vts-assign-block { padding: 0; } .cust_video_wrapper { position: relative; z-index: 11; } .cust_video_wrapper video { width: 100%; height: auto !important; } .portfolio_banner_text.vts { background: url(../images/portfolio-image/vts/p-vts-bg.png); position: relative; width: 100%; height: 100vh; padding: 255px 80px 205px; } .p-vts-content { position: absolute; bottom: 20%; width: 45%; } .p-vts-content h4 { font-size: 36px; font-weight: 400; margin-top: 30px; color: #fff; line-height: 1.3; } .p-vts-content span { text-transform: uppercase; color: #fff; font-size: 18px; font-weight: 500; letter-spacing: 0.2em; } .portfolio-vts .launch_projects .project_col, .portfolio-ocfx .launch_projects .project_col { display: flex; flex-direction: column; justify-content: space-between; } .portfolio-vts h5, .portfolio-ocfx h5 { font-size: 28px; font-weight: 400; } .portfolio-vts .approch_section_bg_white h5, .portfolio-ocfx .approch_section_bg_white h5 { margin-bottom: 40px; } .portfolio-vts .launch_projects .project_col .p-icon, .portfolio-ocfx .launch_projects .project_col .p-icon { border-top: 9px solid transparent; border-left: 11px solid #053EFF; border-bottom: 9px solid transparent; display: inline-block; margin-right: 15px; } .portfolio-vts .launch_projects_bg_white ul li { font-family: 'Josefin Sans', sans-serif; color: #4E4E4E; } .portfolio-vts .launch_projects_bg_white p, .portfolio-ocfx .launch_projects_bg_white p { font-size: 28px; } .portfolio-ocfx .launch_projects .project_col .p-icon { border-left-color: #E43120; } .portfolio-vts p, .portfolio-ocfx h6 { font-size: 24px; line-height: 1.3; color: #404040; font-weight: 300; } .portfolio-vts .approch_section_bg_white { padding: 100px 0 130px; } .trip-schedule { position: relative; /* background: url(../images/portfolio-image/vts/trip-schedule.jpg) no-repeat; */ /* height: 1320px; /* padding: 60px 45px; */ /* margin: 0 80px; */ } .trip-schedule .trip-content { width: 24%; /* margin-left: auto; */ position: absolute; top: 3%; z-index: 99; right: 3%; } .trip-schedule .trip-content h4 { color: #000; font-family: 'Josefin Sans'; font-size: 30px; font-weight: 400; line-height: 30px; margin: 0; } .trip-schedule.mb-100 { margin-bottom: 50px; padding: 0; } .trip.content svg.alarm-img { width: 40%; margin-left: 50px; } .trip-content .schedule-box { display: flex; align-items: center; gap: 15px; margin-bottom: 15px; justify-content: flex-end; /* flex-direction: column; */ } .trip-content p { color: #000; font-weight: 400; text-align: right; font-size: 21px; } .trip-alerts { position: relative; padding: 60px 0 60px 80px; background: #EEEEEE; } .trip-alerts .trip-content { /* margin-right: auto; margin-left: 0; */ width: 26%; position: absolute; top: 3%; z-index: 99; left: 3%; } .trip-alerts .trip-content .schedule-box { justify-content: flex-start; } .trip-alerts .trip-content p { text-align: left; } .trip-alerts .schedule-box h4 { color: #000; font-family: 'Josefin Sans'; font-size: 30px; font-weight: 400; line-height: 30px; margin: 0; } .trip-alerts .alert-img { display: block; margin: 0 0 0 auto; width: 86%; } .sec-margin { margin: 0 80px; } .vts_script_row { display: flex; margin: 0 -24px; } .vts_script_row .sainfra_script_col_fourty { max-width: 40%; flex: 40%; padding: 0 24px; } .vts_script_row .sainfra_script_col_sixty { max-width: 60%; flex: 60%; padding: 0 24px; } img.alert-img { height: 100%; object-fit: cover; } .trip-summary-wrapper { padding: 50px 0; } .trip-summary-wrapper .status_details { background: #EEEEEE; height: 100%; display: flex; justify-content: center; flex-direction: column; align-items: center; } .trip-summary-wrapper .star-emoji h5 { color: #404040; font-family: 'Josefin Sans'; font-size: 24px; font-weight: 300; line-height: 38px; width: 63%; } .trip-summary-wrapper .star-emoji { display: flex; align-items: center; gap: 15px; margin-bottom: 70px; } .trip-summary-wrapper .progressbar { margin: 50px 0 80px 0; } .trip-summary-wrapper .summery_img { margin: 90px 0 0 0; } .subscription { padding: 120px 0 120px 0; background: #EEEEEE; position: relative; } .subscription .trip-content { padding-left: 120px; width: 32%; position: absolute; bottom: 60px; z-index: 99; left: 0; } .subscription .trip-content h4 { color: #000; font-family: 'Josefin Sans'; font-size: 30px; font-weight: 400; line-height: 30px; margin: 0; } .subscription .trip-content p { color: #000; font-weight: 400; text-align: start; font-size: 21px; } .subscription .subscrip-img { padding: 120px 0 0 0; } .subscription .sub-img { margin-top: 120px; } .vts .p-vts-content span { padding: 0 0 10px; } .vts .blue-line { width: 40px; border-bottom: 4px solid #053EFF; } .s-tracking-gif { padding: 0 100px 50px 100px; } .features_of_vts { padding: 0 80px; } .features_of_vts .p-rl { padding: 0 0 40px 0; } .features_of_vts .p-r { padding: 0 0 0px 0; } .features_of_vts .row.remove { margin: 0; } /* .features_col_thirty { max-width: 30%; flex: 30%; margin: 0 20px; } */ .col-media { max-width: 70%; flex: 70%; } .col-media .features_col_thirty { max-width: 50%; flex: 50%; margin: 0 20px; display: flex; flex-direction: column; } .row_1 { display: flex; flex-direction: row; } .row_1.m-b { margin-bottom: 40px; } .features_col_seventy { max-width: 30%; flex: 30%; margin: 0 20px; } .features_of_vts .smart-product-card { background: #FDC022; padding: 0 100px; height: 450px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow: hidden; } .features_of_vts h3 { color: #000; font-family: 'Josefin Sans'; font-size: 41px; font-style: normal; font-weight: 400; line-height: 61px; margin-bottom: 30px; } .features_of_vts h4 { font-size: 47px; font-family: 'Josefin Sans'; font-weight: 400; line-height: 61px; margin: 35px; } .features_of_vts .strategy_line { position: relative; /* padding: 40px; */ } .features_of_vts svg.line-strategy { position: absolute; top: 0; left: -17%; } .features_of_vts .smart-product-card .card-h { transition: all .5s cubic-bezier(.4, .01, .14, .99); } .features_of_vts .smart-product-card:hover .card-h { transform: rotate(5deg) scale(1.1); } .features_of_vts .strategy_frame { position: relative; top: 4%; right: 87%; } .features_of_vts svg.frame-strategy { position: absolute; } .features_of_vts .user-bg-img { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow-x: hidden; } /* .features_of_vts .user-bg-img img{ width: 100%; height: 450px; } */ .features_of_vts .user-bg-img { background-image: url(../images/portfolio-image/vts/user-r&d.png); height: 450px; background-position: center; } .features_of_vts .user-bg-img .user-card { position: absolute; border-radius: 119px; background: #FFF; height: 105px; justify-content: center; align-items: center; display: inline-flex; padding: 30px 40px; } .features_of_vts .user-card h4 { font-family: 'Josefin Sans'; font-size: 29px; font-style: normal; font-weight: 400; line-height: 33px; margin: 0; } .features_of_vts .user-card span { display: block; line-height: 33px; } .features_of_vts .user-card { transition: all .5s cubic-bezier(.4, .01, .14, .99); } .features_of_vts .user-bg-img:hover .user-card { transform: rotate(-10deg); } .features_of_vts .p-rl.last { padding: 0; height: 100%; } .features_of_vts .bg-black { background-color: #000; margin: 0 20px; } .features_of_vts .bourdin-card { /* width: 480px; */ padding: 0 70px 0 70px; display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .features_of_vts .bourdin-card h3 { color: #fff; font-size: 29px; font-style: normal; font-weight: 600; line-height: 46px; text-transform: uppercase; margin-bottom: 25px; } .features_of_vts .bourdin-card h3 span { display: block; line-height: 46px; } .features_of_vts .bourdin-card h5 { color: #1ABC00; font-size: 21px; font-weight: 400; } .features_of_vts .bourdin-card p { font-size: 31px; color: #fff; font-weight: 400; padding: 0 0 80px 0; } .features_of_vts .bourdin-card .img_bourdin .v-bourdin { background-color: #FF9898; height: 130px; width: 130px; border-radius: 70px; margin: 80px 0 30px 0; display: inline-block; position: relative; } .features_of_vts .bourdin-card .img_bourdin .v-bourdin .face-img { background-image: url(../images/portfolio-image/vts/bourdin-img.png); position: absolute; height: 100%; width: 100%; left: -3px; top: 7px; } .features_of_vts .bourdin-card:hover .img_bourdin .v-bourdin .face-img { background-image: url(../images/portfolio-image/vts/bourdin2-img.png); left: -1px; top: 11px; } .features_of_vts .green_circle { background-color: #1ABC00; width: 10px; height: 10px; border-radius: 70px; display: inline-flex; align-items: center; } .features_of_vts .green_circle h5 { margin-left: 30px; } .features_of_vts .track-card { /* width: 470px; */ height: 450px; display: flex; justify-content: center; align-items: center; flex-direction: column; } .features_of_vts .track-card { background-image: url(../images/portfolio-image/vts/track-bg.png); background-repeat: no-repeat; height: 450px; } .features_of_vts .track-card:hover .t-card { transform: translateY(30px); } .features_of_vts .track-card .t-card { transition: all .5s cubic-bezier(.4, .01, .14, .99); } .features_of_vts .track-card h5 { color: #fff; font-family: 'Josefin Sans'; font-size: 47px; font-style: normal; font-weight: 400; line-height: 61px; margin-top: 30px; } .features_of_vts .items_feature { background: #053EFF; height: 450px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .features_of_vts .items_feature .img_items img { padding: 10px 10px; } .features_of_vts .items_feature .img_items img.h-track { transition: transform .3s ease-in; padding: 12px; } .features_of_vts .items_feature:hover .img_items img.h-track { transform: scale(0.8); } .features_of_vts .items_feature .img_items .custom-track { background-color: #fff; width: 102.407px; height: 102.407px; border-radius: 20px; margin: 10px; } .features_of_vts .img_items.d-flex { display: flex; align-items: center; gap: 12px; } .gilroy_section { padding-bottom: 50px; } .gilory_script_row { display: flex; margin: 0 -24px; } .gilroy_row { display: flex; padding: 0 -24px; } .gilroy_section .sainfra_script_col_sixty { max-width: 60%; flex: 60%; padding: 0 24px; } .gilroy_section .sainfra_script_col_fourty { max-width: 40%; flex: 40%; padding: 0 24px; } .gilroy_section .portrait_box { display: flex; } .gilroy_section .black-man { margin: 0 50px 0 0; height: 700px; } .gilroy_section .black_gilroy { background-color: #000; /* width: 500px; */ padding: 90px 80px; display: flex; flex-direction: column; justify-content: space-between; height: 100%; } /* .gilroy_section .b-content{ padding: 0; height: 100%; } */ .gilroy_section .black_gilroy .title_gilroy h3 { color: #FFF; font-family: 'Gilroy'; font-size: 80px; font-style: normal; font-weight: 600; line-height: normal; margin-bottom: 0; } .gilroy_section .black_gilroy .title_gilroy h5 { color: #A0A0A0; font-family: 'Gilroy'; font-size: 28px; font-style: normal; font-weight: 500; line-height: normal; } .gilroy_section .b-content .black_gilroy .title_gilroy { transition: transform .2s ease-in; transform-origin: left; } .gilroy_section .b-content:hover .black_gilroy .title_gilroy { transform: scale(1.2); transform-origin: left; } .gilroy_section .black_gilroy .b-letter h4 { color: #FFF; font-family: 'Gilroy'; font-size: 109px; font-style: normal; font-weight: 600; line-height: normal; margin: 0; display: inline-block; } .gilroy_section .black_gilroy .b-letter h4.f-weight { font-weight: 400; } .gilroy_section .bg-blue-image { background: #053EFF; display: flex; justify-content: center; align-items: center; height: 100%; } .gilroy_section .bg-blue-image .mobile_gif { width: 60%; } .gilroy_section .sainfra_script_col_twentyfive { max-width: 25%; flex: 25%; } .gilroy_section .box-color-code { margin-top: 40px; height: 250px; } .gilroy_section .box-color-code h3 { justify-content: flex-start; color: #FFF; font-family: 'Josefin Sans'; font-size: 24px; font-weight: 400; line-height: normal; transform: rotate(-90deg); display: flex; height: 100%; align-items: end; padding: 0 0 30px 30px; margin: 0; } .gilroy_section .box-color-code h3 { transition: all .5s cubic-bezier(.4, .01, .14, .99); } .gilroy_section .h-gilroy:hover .box-color-code h3 { transform: none; margin: 0; padding: 0 0 30px 90px; justify-content: flex-start; } .gilroy_section .box-color-code h3.text_b { color: #585757; } .gilroy_section .box-color-code.blue { background-color: #053EFF; } .gilroy_section .box-color-code.black { background: #040404; } .gilroy_section .box-color-code.gray { background: #F3F3F3; } .gilroy_section .box-color-code.white { background: #FFF; } .geo_fence { padding: 50px 0; } .geo_fence .sainfra_script_col_fifty { max-width: 50%; flex: 50%; padding: 0 24px; } .geo_fence img.fence-img { height: 100%; object-fit: fill; } .geo_fence .geo_content img.geo-img { height: 430px; } .geo_fence .geo_content { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 830px; background: #EEE; padding: 0 50px; } .geo_fence .star-emoji { display: flex; align-items: center; gap: 15px; margin-top: 100px; margin-right: auto; } .geo_fence .star-emoji h5 { color: #404040; font-family: 'Josefin Sans'; font-size: 24px; font-weight: 300; line-height: 38px; width: 100%; } .addition_features { padding: 100px 0; } .addition_features .vts_script_row { display: flex; margin: 0; flex-wrap: wrap; } .addition_features .add_card { border: 1.185px solid rgba(31, 31, 31, 0.20); background: #FFF; height: 450px; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: start; padding: 50px 50px; } .addition_features .add_card.l-purple { background: rgba(5, 62, 255, 0.07); } .addition_features .add_card h3 { color: #000; font-family: 'Josefin Sans'; font-size: 28px; font-weight: 400; line-height: normal; margin: 50px 0 30px 0; } .addition_features .add_card p { color: #404040; font-family: 'Josefin Sans'; font-size: 22px; font-weight: 300; line-height: 31px; padding: 0; } .addition_features .addition-title { margin: 0 30px 90px 0; display: flex; justify-content: space-between; align-items: center; } .addition_features .addition-title h2 { color: #000; font-family: 'Josefin Sans'; font-size: 45px; font-weight: 400; line-height: 60px; margin: 0; } .our_process { padding: 100px 0; } .our_process .title_process { margin: 50px 0 0 100px; width: 64%; } .our_process .b-our { text-align: end; } .our_process .our-circle { display: flex; justify-content: center; padding: 100px 0; } .our_process .our-circle .circle-grid { width: 260px; height: 260px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.20); display: flex; align-items: center; justify-content: center; position: relative; } /* new hover code start */ .outer-line.b-bottom:hover::after { border-bottom: 2px solid #053EFF; border-left-width: 2px; border-top-width: 2px; transform: rotate(308deg); transition: transform 0.9s linear 0s, border-left-width 0s linear 0.9s; } .outer-line.b-bottom:hover::before { border-left-color: #053EFF; border-top-color: #053EFF; border-right-color: #053EFF; transition: border-top-color 0.15s linear, border-right-color 0.15s linear 0.10s, border-bottom-color 0.15s linear 0.20s; } .outer-line.b-right:hover::after { border-right: 2px solid #053EFF; border-bottom-width: 2px; border-left-width: 2px; transform: rotate(373deg); transition: transform 0.9s linear 0s, border-left-width 0s linear 0.9s; } .outer-line.b-right:hover::before { border-bottom-color: #053EFF; border-left-color: #053EFF; border-top-color: #053EFF; transition: border-right-color 0.3s, border-top-color 0.3s, border-left-color 0.7s, border-bottom-color 0.7s; } /* new hover code end */ .our_process .our-circle .circle-grid.b-bottom::before { border-bottom-color: #053EFF; transition: border-bottom-color 0.3s, border-right-color 0.3s, border-top-color 0.7s, border-left-color 0.7s; } .our_process .our-circle .circle-grid.b-right::before { border-right-color: #053EFF; transition: border-right-color 0.3s, border-top-color 0.3s, border-left-color 0.7s, border-bottom-color 0.7s; } .b-bottom img.svg-a { left: 13%; width: 15px; position: absolute; top: 85%; transform: rotate(140deg); } .b-right img.svg-a { left: 83%; width: 15px; position: absolute; top: 83%; transform: rotate(44deg); } .b-bottom:hover img.svg-a { display: none; } .b-right:hover img.svg-a { display: none; } .outer-line.b-bottom::after { border: 0 solid transparent; } .outer-line.b-bottom::before { border: 2px solid transparent; } .outer-line.b-right::after { border: 0 solid transparent; } .outer-line.b-right::before { border: 2px solid transparent; } .circle-grid.outer-line:hover { color: #053EFF; } .circle-grid::before, .circle-grid::after { position: absolute; content: ''; width: 100%; height: 101%; border-radius: 291px; box-shadow: none; box-sizing: border-box; } /* .outer-line.b-bottom:hover::before { border-left-color: #053EFF; border-top-color: #053EFF; border-right-color: #053EFF; border-width: 2px; transition: border-left-color 0.2s, border-top-color 1s, border-right-color 1s; } .outer-line.b-right:hover::before { border-bottom-color: #053EFF; border-left-color: #053EFF; border-top-color: #053EFF; transition: border-bottom-color 0.2s, border-left-color 1s, border-top-color 1s; border-width: 2px; } */ .our_process .our-circle .circle-grid.m-l { margin-left: -3%; } .our_process .our-circle .circle-grid h4 { color: #000; text-align: center; font-family: 'Josefin Sans'; font-size: 24px; font-weight: 400; line-height: normal; margin: 0; } .our_process .our-circle .circle-grid h4 { transition: all .5s cubic-bezier(.4, .01, .14, .99); } .our_process .our-circle .circle-grid:hover h4 { transform: translateY(13px); color: #053EFF; } /* .our_process .our-circle .circle-grid.outer-line{ height: 256px; width: 16%; } */ .outer-line::before, .outer-line::after { top: 0; left: 0; } /* .outer-line::before{ border: 2px solid transparent; } .outer-line::after { border: 0 solid transparent; } */ /* .outer-line.b-right:hover::after { transform: rotate(270deg); border-bottom-color: #053EFF; border-bottom-width: 3px; } */ /* .outer-line.b-bottom:hover::after { transition: transform 0.8s; transform: rotate(270deg); border-left-color: #053EFF; border-left-width: 3px; } */ .gray_truck_image { background-color: #000; position: relative; } .gray_truck_image .content_topdown { position: absolute; top: 50%; transform: translateY(-50%); padding: 0 220px; } .gray_truck_image h3 { color: #fff; font-family: 'Josefin Sans'; font-size: 36px; font-weight: 300; line-height: 50px; width: 90%; } .gray_truck_image h4 { color: #053EFF; font-family: 'Josefin Sans'; font-size: 40px; font-weight: 400; line-height: 50px; } .gray_truck_image h5 { color: #fff; font-family: 'Josefin Sans'; font-size: 20px; font-weight: 300; line-height: 50px; } .gray_truck_image .flex-topdown { position: relative; margin-bottom: 70px; } .gray_truck_image .flex-topdown svg { position: absolute; left: -3%; top: -6%; } .shake-bottom:hover { -webkit-animation: shake-bottom 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; animation: shake-bottom 0.8s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; } .object_fill { object-fit: fill !important; } /* Chrome, Safari, Edge, Opera */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type=number] { -moz-appearance: textfield; } /** * ---------------------------------------- * animation shake-bottom * ---------------------------------------- */ @-webkit-keyframes shake-bottom { 0%, 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } 10% { -webkit-transform: rotate(2deg); transform: rotate(2deg); } 20%, 40%, 60% { -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 30%, 50%, 70% { -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -webkit-transform: rotate(-2deg); transform: rotate(-2deg); } 90% { -webkit-transform: rotate(2deg); transform: rotate(2deg); } } @keyframes shake-bottom { 0%, 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } 10% { -webkit-transform: rotate(2deg); transform: rotate(2deg); } 20%, 40%, 60% { -webkit-transform: rotate(-4deg); transform: rotate(-4deg); } 30%, 50%, 70% { -webkit-transform: rotate(4deg); transform: rotate(4deg); } 80% { -webkit-transform: rotate(-2deg); transform: rotate(-2deg); } 90% { -webkit-transform: rotate(2deg); transform: rotate(2deg); } } .terms-of-use-sect.user-consent p strong { text-transform: capitalize !important; } /* footer design style */ .gap_row { justify-content: space-between; } .col_gap { margin-right: 100px; } .copyright-text1 { margin-right: 100px; max-width: 33%; } .copyright-text { max-width: 44%; } .site-footer.section--bg .get-in-touch a:hover { color: #fff; } .our-sub-team-section .team-row.wrap_reverse { /* flex-wrap: wrap-reverse; */ } .our_values.careers_value .mobile_view.floatR { display: none; }