Files
wdipl-redesign/assets/css/style-new.css
2025-01-29 15:26:37 +05:30

4530 lines
85 KiB
CSS

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');
/* start from here */
p {
word-spacing: 2px;
}
.gr-txt {
background: linear-gradient(90deg, #E5195E 48.5%, #3365F6 100%);
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
}
.bg-black {
background-color: #000;
}
.bg-grey {
background-color: #12121257;
}
.bg-dark-grey {
background-color: #1A1A1A;
}
.pink-txt {
color: #E5195E;
}
.grey-para {
color: #D3D3D3;
font-size: clamp(15px, 1.33333vw, 16px);
word-spacing: 1px;
}
.semi-grey-para {
color: #d3d3d3e8;
font-size: clamp(15px, 1.33333vw, 16px);
word-spacing: 1px;
}
.dark-grey-para {
color: #A7A7A7;
font-size: clamp(15px, 1.33333vw, 16px);
}
.mini-head-para {
font-size: clamp(17px, 1.33333vw, 20px);
margin-bottom: 6px;
font-weight: 500;
color: #fff;
}
.micro-head-para {
font-size: clamp(16px, 1.33333vw, 18px);
margin-bottom: 6px;
font-weight: 500;
color: #fff;
}
.mid-para {
font-size: clamp(19px, 1.33333vw, 20px);
margin-bottom: 6px;
}
.head {
font-size: clamp(40px, 1.33333vw, 46px);
color: #fff;
line-height: 130%;
font-weight: 700;
letter-spacing: 1px;
}
.mid-head {
font-size: clamp(30px, 1.33333vw, 34px);
color: #fff;
line-height: 40px;
font-weight: 600;
letter-spacing: 0.5px;
word-spacing: 1px;
margin-bottom: 20px;
}
.mini-head {
font-size: clamp(17px, 1.33333vw, 19px);
color: #fff;
line-height: 30px;
font-weight: 500;
}
.p-top {
padding-top: 180px !important;
background-repeat: no-repeat;
background-position: bottom;
background-size: cover;
}
.strategic-sec {
background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(../images/new-img/strategic-bg.svg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.strategic-sec .strategic-side {
display: flex;
align-items: center;
justify-content: center;
}
.strategic-sec .lets_talk {
margin-top: 40px;
}
.crafting-sec {
background-image: url(../images/new-img/craft-bg.svg);
background-repeat: no-repeat;
background-position: left;
background-size: cover;
}
.crafting-sec .mid-head {
margin-bottom: 40px;
}
.crafting-sec .box-main {
display: flex;
gap: 10px;
}
.crafting-sec .box-main :nth-child(2) {
flex: 1;
}
.crafting-sec .box-main-second {
display: flex;
gap: 10px;
margin-top: 10px;
}
.crafting-sec .box-main-second :nth-child(1) {
flex: 1;
}
.crafting-sec .box {
padding: 12px 30px;
border-radius: 10px;
text-align: center;
width: 230px;
background: rgba(27, 27, 27, 0.5);
border: none;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(10px) saturate(180%);
-webkit-backdrop-filter: blur(10px) saturate(180%);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.crafting-sec .box .gr-txt {
font-size: 2rem;
font-weight: 700;
}
.crafting-sec .box p {
font-size: 1.1rem;
}
.craft-content-main {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
}
.tooltip-container {
position: relative;
display: inline-block;
}
.tooltip {
visibility: hidden;
opacity: 0;
background-color: #333;
color: #fff;
text-align: center;
border-radius: 4px;
padding: 5px 10px;
position: absolute;
bottom: 100%;
left: 50%;
transform: translateX(-50%);
white-space: nowrap;
z-index: 10;
transition: opacity 0.3s;
}
.tooltip-container:hover .tooltip {
visibility: visible;
opacity: 1;
}
.cloud-box {
background: linear-gradient(to bottom, #1E1E1EE5, #000000E5);
padding: 25px 15px;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.cloud-box .mini-head {
margin-bottom: 6px;
}
.cloud-box .dark-grey-para {
margin-bottom: 30px;
}
.cloud-logo-main {
display: flex;
align-items: center;
gap: 40px;
flex-wrap: wrap;
}
.cloud-logo-main img {
width: 45px;
height: 45px;
}
.double-cloud-box {
display: flex;
justify-content: space-between;
flex-direction: column;
height: 100%;
gap: 40px;
}
.cloud-box.cloud-side {
position: relative;
height: 300px;
}
.cloud-box .mid-head {
margin-bottom: 30px;
}
.cloud-box.cloud-side {
position: relative;
height: 320px;
overflow: hidden;
flex: 1;
}
.cl-downside-img {
position: absolute;
right: 0;
width: 100%;
height: 100%;
}
.award-content-main {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 40px;
margin-top: 60px;
}
.award-rec-sec .award-content {
display: flex;
flex-direction: column;
gap: 10px;
align-items: center;
text-align: center;
transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
}
.award-rec-sec .award-content:hover img {
transform: scale(1.06);
-webkit-transform: scale(1.06);
-moz-transform: scale(1.06);
-ms-transform: scale(1.06);
-o-transform: scale(1.06);
transition: transform 0.3s ease-in;
-webkit-transition: transform 0.3s ease-in;
-moz-transition: transform 0.3s ease-in;
-ms-transition: transform 0.3s ease-in;
-o-transition: transform 0.3s ease-in;
}
.award-rec-sec img {
width: 88%;
height: auto;
margin-bottom: 16px;
transition: transform 0.3s ease-in;
-webkit-transition: transform 0.3s ease-in;
-moz-transition: transform 0.3s ease-in;
-ms-transition: transform 0.3s ease-in;
-o-transition: transform 0.3s ease-in;
}
.team-aug-sec {
background: #121212;
}
/* Dual slider */
.dual-slider {
background-color: #101316;
height: calc(100vh - 97px);
position: relative;
overflow: hidden;
}
.two_slider_main {
position: absolute;
bottom: 80px;
left: 50%;
transform: translateX(-50%);
width: 100%;
}
.bg-content {
display: flex !important;
justify-content: space-between !important;
}
.bg-content-left {
padding-top: 60px;
max-width: 50%;
}
.bg-content-left .logo img {
max-width: 250px;
height: auto;
margin-bottom: 20px;
}
.bg-content-right {
display: flex;
align-items: start;
justify-content: center;
}
.bg-content-right img {
width: 75%;
height: 100%;
}
.bg-content-right .for-full-w {
width: 100%;
}
/* #card_slide .slick-slide {
display: flex !important;
align-items: center;
justify-content: center;
} */
#card_slide .slick-slide img {
transform: scale(0.9);
width: 90%;
height: auto;
border-radius: 8px;
filter: grayscale(100%) brightness(0.8) contrast(1);
-webkit-filter: grayscale(100%) brightness(0.8) contrast(1);
transition: transform 0.5s ease, filter 0.5s ease, opacity 0.5s ease;
-webkit-transition: transform 0.5s ease, filter 0.5s ease, opacity 0.5s ease;
opacity: 0.8;
}
#card_slide .slick-slide.slick-current.slick-active img {
filter: grayscale(0) brightness(1) contrast(1);
-webkit-filter: grayscale(0) brightness(1) contrast(1);
transform: scale(1);
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
opacity: 1;
}
button.slick-arrow {
background-color: transparent;
border: none;
color: #fff;
font-size: 16px;
width: 36px;
height: 36px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
transition: border-color 0.3s ease;
border: 1px solid #fff;
-webkit-transition: border-color 0.3s ease;
-moz-transition: border-color 0.3s ease;
-ms-transition: border-color 0.3s ease;
-o-transition: border-color 0.3s ease;
}
button.slick-arrow:hover {
border-color: #E5195E;
}
/* Adjust arrow positions */
button.prev_arrow,
button.next_arrow {
position: absolute;
bottom: -50%;
transform: translate(-50%, 0);
z-index: 10;
-webkit-transform: translate(-50%, 0);
-moz-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
}
button.prev_arrow {
left: 46%;
}
button.next_arrow {
left: 54%;
}
/* for sloider */
.team-left-content-inn {
display: flex;
align-items: start;
gap: 10px;
margin-bottom: 20px;
}
.team-left-content-inn p {
margin-top: -4px;
}
.team-left-content-inn img {
width: 24px;
height: 24px;
}
.team-aug-sec .row {
justify-content: space-between;
margin-top: 40px;
}
.team-right-content {
border: 1px solid #383838;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
}
.team-right-content .tab-content {
background: linear-gradient(to bottom, #3f3f3fe5, #000000E5) !important;
}
.team-right-content .team-left-content-inn {
margin-bottom: 0;
padding: 6px 0;
}
.team-right-content .nav-tabs {
justify-content: space-between;
background-color: #1d1d1d;
border-bottom: 1px solid #4f4f4f;
}
.team-right-content .tab-content {
background: linear-gradient(to bottom, #1E1E1EE5, #000000E5) !important;
}
.team-right-content .nav-item {
flex: 1;
}
.team-right-content .nav-tabs .nav-link {
color: #ffffff;
border-color: transparent;
width: 100%;
padding: 10px;
}
.team-right-content .nav-tabs .nav-link.active {
font-weight: 500;
background-color: #3D3D3D;
border-bottom: 2px solid #E5195E;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.team-right-content-main .lets_talk a {
justify-content: center !important;
width: 100%;
}
.we-serve-sec {
background-color: #242424;
}
.map-location-main {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 40px;
}
.map-location {
background-repeat: no-repeat;
background-position: center;
background-size: 100%;
padding: 30px 0;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.first {
background-image: url(../images/new-img/mapone.webp);
}
.second {
background-image: url(../images/new-img/maptwo.webp);
}
.third {
background-image: url(../images/new-img/mapthree.webp);
}
.fourth {
background-image: url(../images/new-img/mapfour.webp);
}
.we-serve-sec .contact-info {
display: flex;
gap: 15px;
align-items: center;
margin-bottom: 8px;
}
.we-serve-sec .contact-info .grey-para {
margin-bottom: 0;
}
.we-serve-sec .contact-info img {
width: 16px;
height: 16px;
}
.we-serve-pink {
color: #E5195E;
font-size: 24px;
}
.lets-collaborate-sec .lets_talk {
display: flex;
justify-content: center;
margin: 50px 0 30px 0;
}
.lets-collaborate-sec .lets_talk a {
width: 30%;
justify-content: center;
}
.choose-your-path-sec {
background-image: url(../images/new-img/choose-your-path-bg.webp);
background-repeat: no-repeat;
background-size: cover;
}
.choose-your-path-sec .mid-para {
font-size: 1.8rem;
}
.choose-your-path-main {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 30px;
margin: 30px 0;
}
.choose-your-path-box {
padding: 20px;
border-radius: 10px;
background: rgba(27, 27, 27, 0.5);
border: none;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(10px) saturate(180%);
-webkit-backdrop-filter: blur(10px) saturate(180%);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
border-top: 3px solid #E5195E;
gap: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.choose-your-path-box .choose-your-path-box-img {
width: 40px;
height: 40px;
margin-bottom: 10px;
}
.choose-your-path-box .lets_talk {
margin: 0;
}
/* ***** Ai page start ***** */
/* circle */
.develope-ai-sec .col-md-5 img {
scale: 1.3;
}
.ai-client-review-main {
display: flex;
align-items: center;
padding: 40px 0;
}
.ai-review-circle {
background: #000000ef;
color: #fff;
border-radius: 50%;
width: 170px;
height: 170px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
position: relative;
margin-left: -10px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.ai-review-circle:first-child {
margin-left: 0;
}
.ai-review-circle::before {
content: '';
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
border-radius: 50%;
z-index: -1;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
/* First circle gradient border */
.ai-review-circle:nth-child(1)::before {
background: linear-gradient(164.5deg, #FFFFFF 10.86%, #4393E1 90.79%);
}
/* Second circle gradient border */
.ai-review-circle:nth-child(2)::before {
background: linear-gradient(188deg, #E8155D 6.16%, #373737 86.3%);
}
/* Third circle gradient border */
.ai-review-circle:nth-child(3)::before {
background: linear-gradient(164.5deg, #FFFFFF 10.86%, #4393E1 90.79%);
}
/* Fourth circle gradient border */
.ai-review-circle:nth-child(4)::before {
background: linear-gradient(188deg, #E8155D 6.16%, #373737 86.3%);
}
.ai-review-circle p:first-child {
font-size: 24px;
font-weight: bold;
color: #E8155D;
margin: 0;
position: relative;
}
.ai-review-circle p:first-child span {
position: absolute;
top: -12px;
}
.ai-review-circle p:last-child {
font-size: 16px;
color: #FFFFFF;
margin: 0;
}
.look-app-dev {
padding: 60px 0;
background-image: url(../images/new-img/app-dev-bg.webp);
background-repeat: no-repeat;
background-size: cover;
margin: 40px 0;
background-position: bottom;
padding-bottom: 0px;
}
.look-app-dev .col-md-6:first-child {
display: flex;
flex-direction: column;
justify-content: center;
}
.look-app-dev .mid-para {
font-size: 2rem;
color: #fff;
margin-bottom: 20px;
}
/* Mobile App dev page start */
/* .mobile-banner-sec {
background: linear-gradient(to bottom, #080808, #000);
position: relative;
overflow: hidden;
} */
/* .mobile-banner-sec::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 20%;
background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
filter: blur(10px);
pointer-events: none;
} */
.mobile-banner-sec .col-md-6:last-child {
display: flex;
align-items: center;
}
.mobile-banner-content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.design-principal .transform-box-main .transform-box:last-child {
grid-column: span 2;
}
.mobile-banner {
width: auto;
height: 400px;
position: relative;
overflow: hidden;
}
/* .mobile-banner::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 32%;
background: linear-gradient(to top, rgb(0, 0, 0, 9), transparent);
pointer-events: none;
} */
.mobile-download-main {
display: flex;
gap: 50px;
margin: 0 0 30px;
width: 100%;
align-items: center;
position: absolute;
bottom: -60px;
left: 14%;
background: #000000f9;
box-shadow: 23px -6px 20px 11px rgba(0, 0, 0, 9);
padding: 20px;
border-radius: 10px;
z-index: 1;
}
.mobile-download-main .head {
font-weight: 700;
margin-bottom: 6px;
font-size: 3.4rem;
background: linear-gradient(to bottom, #FFFFFF, #2B2B2B);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
}
.transform-box-main {
display: grid;
grid-template-columns: repeat(2, 1fr);
margin-top: 30px;
grid-gap: 30px;
}
.transform-box {
border: 1px solid #e5195e6b;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
-ms-border-radius: 6px;
-o-border-radius: 6px;
background-color: #171717;
padding: 24px 15px;
}
.transform-box .transform-inn-content {
display: flex;
align-items: start;
gap: 8px;
margin-bottom: 16px;
}
.transform-box .transform-inn-content .mid-para {
margin-bottom: 0;
font-weight: 500;
}
.four-grid .transform-box-main .transform-box .transform-inn-content .mid-para {
min-height: 58px;
}
.transform-box img,
.innovating-box img {
width: 30px;
height: 30px;
margin-top: 1px;
}
.innovating-box-main {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 30px;
margin: 40px 0 0;
}
.web-innovating .lets_talk {
margin-top: 40px;
}
.innovating-box {
padding: 20px;
border-radius: 8px;
border: 1px solid transparent;
transition: border 0.3s ease;
-webkit-transition: border 0.3s ease;
-moz-transition: border 0.3s ease;
-ms-transition: border 0.3s ease;
-o-transition: border 0.3s ease;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.innovating-box:hover {
border: 1px solid #e5195e6b;
}
.innovating-box img {
margin-bottom: 16px;
}
.innovating-box .mid-para {
line-height: 28px;
margin-bottom: 20px;
}
/* Contact page start */
.get-in-touch-sec .col-md-2 {
display: flex;
justify-content: end;
}
.get-in-icons {
display: flex;
flex-direction: column;
gap: 10px;
}
.get-in-icons .get-in-icon {
padding: 5px 10px;
border: 1px solid #B7B7B7;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.get-in-icons img {
width: 16px;
height: 16px;
}
.get-in-touch-sec .lets_talk {
margin-top: 30px;
}
.get-in-touch-sec .lets_talk a {
width: 100%;
justify-content: center;
}
.home-form .lets_talk {
display: flex;
justify-content: center;
margin: 50px 0;
}
.lets_talk {
margin-top: 30px;
}
.home-form .lets_talk a,
.home-form .lets_talk button {
width: 30%;
justify-content: center;
}
.cmm-inputs-main {
margin: 30px 0;
}
.cmm-inputs-main input,
.cmm-inputs-main textarea {
border: none;
background-color: transparent;
resize: none;
padding: 12px;
border-bottom: 1px solid #4b4b4b;
width: 100%;
border-radius: 0;
color: #fff;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
.cmm-inputs-main input:focus,
.cmm-inputs-main textarea:focus {
outline: none;
box-shadow: none;
border-bottom: 1px solid #4b4b4b;
}
.cmm-inputs-main input::placeholder,
.cmm-inputs-main textarea::placeholder {
color: #fff;
}
.cmm-inputs-main input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px transparent inset !important;
box-shadow: 0 0 0 1000px transparent inset !important;
background-color: transparent !important;
-webkit-text-fill-color: #fff !important;
/* White text */
color: #fff !important;
/* Fallback for non-WebKit browsers */
caret-color: #fff !important;
/* White cursor */
transition: background-color 5000s ease-in-out 0s;
}
.cmm-inputs-main .row {
margin-bottom: 20px;
}
/* .cmm-inputs-main select:focus option {
background-color: #555;
} */
.cmm-inputs-main select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background: transparent url(../images/new-img/arrow-down-bold.svg) no-repeat right 10px center;
background-size: 18px 18px;
/* Adjust as per your image size */
border: none;
border-bottom: 1px solid #4b4b4b;
padding: 12px;
width: 100%;
color: #fff;
font-size: 16px;
cursor: pointer;
}
.cmm-inputs-main select:focus {
outline: none;
box-shadow: none;
border-bottom: 1px solid #fff;
}
.cmm-inputs-main select option {
color: #000;
background-color: #fff;
}
.get-in-touch-sec .opts-choose {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 20px;
}
.opts-choose .form-check-input {
appearance: none;
width: 19px;
height: 19px;
border: 1px solid #E5195E;
border-radius: 50%;
outline: none;
background-color: transparent;
transition: border 0.3s ease, background-color 0.3s ease;
cursor: pointer;
-webkit-transition: border 0.3s ease, background-color 0.3s ease;
-moz-transition: border 0.3s ease, background-color 0.3s ease;
-ms-transition: border 0.3s ease, background-color 0.3s ease;
-o-transition: border 0.3s ease, background-color 0.3s ease;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
/* Add custom pink dot when selected */
.opts-choose .form-check-input:checked {
background-color: #E5195E;
border-color: #E5195E;
}
.opts-choose .form-check-input:checked::before {
content: '';
display: block;
width: 9px;
height: 9px;
margin: 3px;
background-color: white;
border-radius: 50%;
transform: translate(1px, 1px);
-webkit-transform: translate(1px, 1px);
-moz-transform: translate(1px, 1px);
-ms-transform: translate(1px, 1px);
-o-transform: translate(1px, 1px);
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.for-checkbox .form-check-input:checked::before {
background-color: transparent;
}
.opts-choose .form-check-label {
margin-left: 10px;
font-size: 16px;
}
.opts-choose .form-check-input:checked[type=radio] {
background-image: inherit !important;
}
.form-check-input:checked {
background-color: #E5195E;
border-color: #E5195E;
}
.attachment-upload {
margin: 30px 0;
}
.attachment-upload input {
border: 1px dashed #D8D8D8;
width: 100%;
padding: 20px 15px;
}
.attachment-upload span {
color: #C2C2C2;
font-size: 12px;
}
.range-slider {
margin: 30px 0;
}
.range-slider .form-range {
-webkit-appearance: none;
width: 100%;
height: 2px;
background: #999999;
outline: none;
position: relative;
border-radius: 10px;
transition: background 0.3s ease;
-webkit-transition: background 0.3s ease;
-moz-transition: background 0.3s ease;
-ms-transition: background 0.3s ease;
-o-transition: background 0.3s ease;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.range-slider .form-range::-webkit-slider-runnable-track {
height: 6px;
background: transparent;
}
.range-slider .form-range::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 15px;
height: 15px;
border-radius: 50%;
background-color: white;
border: 4px solid #E5195E;
cursor: pointer;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.range-slider .form-range::-moz-range-track {
height: 6px;
background: transparent;
}
.range-slider .form-range::-moz-range-thumb {
width: 15px;
height: 15px;
border-radius: 50%;
background-color: white;
border: 4px solid #E5195E;
cursor: pointer;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.range-slider .form-range::-ms-track {
height: 6px;
background: transparent;
border-color: transparent;
border-width: 8px 0;
color: transparent;
}
.range-slider .form-range::-ms-thumb {
width: 15px;
height: 15px;
border-radius: 50%;
background-color: white;
border: 4px solid #E5195E;
cursor: pointer;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.range-slider .labels {
display: flex;
justify-content: space-between;
margin-top: 10px;
padding-left: 18%;
}
.range-slider .dot {
width: 6px;
height: 6px;
background-color: #E5195E;
border-radius: 50%;
position: absolute;
top: 14px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
pointer-events: none;
}
.range-slider .slider-container {
position: relative;
}
.range-slider .hidden {
visibility: hidden;
}
.book-appointment-sec {
background-color: #1C1C1C;
}
.book-app-img {
width: 300px;
height: 300px;
}
.book-appointment-sec .lets_talk a {
justify-content: center;
width: 100%;
}
.book-appointment-sec .col-md-6:last-child {
display: flex;
align-items: center;
justify-content: center;
}
/* Container styling */
.details-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
padding: 20px 0;
grid-gap: 40px;
background-color: #000;
color: #fff;
position: relative;
}
/* Content styling */
.details-content {
display: flex;
flex-direction: column;
position: relative;
opacity: 0;
/* Initially hidden */
animation: show-content 1s ease forwards;
/* Content visibility animation */
}
.details-content:nth-child(1) {
animation-delay: 0s;
/* Show immediately with the first dot */
}
.details-content:nth-child(2) {
animation-delay: 2s;
/* Trigger after the second dot blinks */
}
.details-content:nth-child(3) {
animation-delay: 4s;
/* Trigger after the third dot blinks */
}
.details-img img {
width: 30px;
height: 30px;
margin: 30px 0 20px;
}
/* Dot */
.details-container .dot {
width: 8px;
height: 8px;
background-color: #e5195e;
border-radius: 50%;
position: relative;
opacity: 0;
animation: fade-in 1s ease forwards;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.details-content:nth-child(2) .dot {
animation-delay: 1s;
}
.details-content:nth-child(3) .dot {
animation-delay: 3s;
}
/* Line Animation */
.details-content:not(:last-child)::after {
content: '';
position: absolute;
width: 0;
height: 8px;
background-color: #e5195e;
top: 4px;
left: 0px;
transform: translateY(-50%);
transform-origin: left;
animation: line-grow 1s ease forwards;
border-radius: 10px;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.details-content:nth-child(1)::after {
animation-delay: 1s;
}
.details-content:nth-child(2)::after {
animation-delay: 3s;
}
/* Keyframes */
@keyframes fade-in {
0% {
opacity: 0;
transform: scale(0);
}
100% {
opacity: 1;
transform: scale(1);
}
}
@keyframes line-grow {
0% {
width: 0;
}
100% {
width: 452px;
/* Adjust based on spacing */
}
}
@keyframes show-content {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.got-a-project-sec .lets_talk {
display: flex;
align-items: center;
justify-content: center;
margin: 50px 0 20px 0;
}
.got-a-project-sec .lets_talk a {
display: flex;
align-items: center;
justify-content: center;
width: 50%;
}
.join-our-team-sec {
background-image: url(../images/new-img/join-our-team-bg.webp);
background-repeat: no-repeat;
background-size: cover;
padding: 60px 0;
}
.join-our-team-sec .grey-para {
line-height: 30px;
}
.join-our-team-sec .lets_talk {
display: flex;
align-items: center;
justify-content: center;
margin-top: 40px;
}
.join-our-team-sec .lets_talk a {
display: flex;
align-items: center;
justify-content: center;
width: 70%;
}
.join-our-team-sec .col-md-6:last-child {
display: flex;
justify-content: center;
flex-direction: column;
}
.custum-file-upload {
height: 100px;
display: flex;
flex-direction: column;
align-items: space-between;
gap: 20px;
cursor: pointer;
align-items: center;
justify-content: center;
border: 2px dashed #a2a2a2;
background-color: transparent;
padding: 1rem;
}
.custum-file-upload .icon {
display: flex;
align-items: center;
justify-content: center;
gap: 20px;
}
.custum-file-upload .icon img {
width: 25px;
height: 25px;
}
.custum-file-upload .text {
display: flex;
align-items: center;
justify-content: center;
}
.custum-file-upload .text span {
font-weight: 400;
color: #E7E7E7;
font-size: 16px;
}
.custum-file-upload input {
display: none;
}
/* Hire mobile app developer? */
.faqs_section .inn_data h3 i {
background-color: #212121;
padding: 6px 8px;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
height: 30px;
}
.faqs_section .inn_data {
border-bottom: 1px solid #717171;
}
.faqs_section .accordion_sec .inn_data {
background-color: transparent;
transition: background-color 0.3s ease;
-webkit-transition: background-color 0.3s ease;
-moz-transition: background-color 0.3s ease;
-ms-transition: background-color 0.3s ease;
-o-transition: background-color 0.3s ease;
}
.inn_data h3 {
padding: 10px 20px 20px 20px;
}
.faqs_section .inn_data {
padding-bottom: 0px;
}
.faqs_section .accordion_sec .inn_data .accordion_content .grey-para {
padding: 10px 6px;
margin-bottom: 0px;
}
.faqs_section .accordion_sec .inn_data .h3_heading.active+.accordion_content {
background-color: #271219;
}
.faqs_section .accordion_sec .inn_data .h3_heading.active {
background-color: #271219;
border-bottom: 1px solid #E5195E;
}
.hire-expert-sec {}
.hire-expert-sec .lets_talk {
margin-top: 30px;
}
.hire-expert-sec .mid-head {
font-size: 2.2rem;
word-spacing: 2px;
}
/* .why-hire-sec {
background-color: #121212;
} */
.why-hire-sec .transform-box-main {
grid-template-columns: repeat(3, 1fr);
}
.why-hire-sec .transform-box {
border: none;
background-color: inherit;
}
.why-hire-sec .transform-box img {
width: 30px;
}
.steps-main {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 20px;
margin-top: 25px;
}
.steps-main .step {
padding: 10px 15px;
overflow: hidden;
}
.steps-main .step-number {
color: #E5195E;
font-size: 2.2rem;
font-weight: 700;
position: relative;
}
.steps-main .step .step-number:not(:last-child)::after {
content: '';
display: block;
width: 100%;
height: 1px;
background: linear-gradient(to right, #E5195E 33%, transparent 33%, transparent 66%, #E5195E 66%, #E5195E);
background-size: 8px 1px;
position: absolute;
top: 26px;
left: 66px;
}
.steps-main .step:last-child .step-number::after {
content: none !important;
}
.hire-developer-sec .lets_talk {
display: flex;
align-items: center;
justify-content: center;
margin-top: 60px;
}
.hire-developer-sec .lets_talk a {
width: 250px;
justify-content: center;
}
.why-hiring-dev-box-main {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 30px;
margin-top: 40px;
}
.why-hiring-dev-box {
background-color: #282828;
padding: 12px 15px;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.why-hiring-dev-box .mid-para {
font-size: 1.3rem;
min-height: 63px;
line-height: 28px;
}
.why-hiring-dev-box img {
width: 40px;
height: 40px;
margin-bottom: 14px;
}
.why-hiring-dev-box .mini-head-para {
color: #ffffff;
text-decoration: none;
font-size: 1rem;
display: flex;
align-items: center;
gap: 8px;
}
.why-hiring-dev-box .mini-head-para img {
width: 20px;
height: 18px;
margin-bottom: -4px;
}
.craft-scalable-sec {
background-image: url(../images/new-img/craft-scalable-bg.webp);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.craft-scalable-sec .col-md-7 {
display: flex;
flex-direction: column;
justify-content: center;
}
.craft-scalable-sec .mid-head {
margin-bottom: 20px;
}
.craft-scalable-sec .lets_talk {
margin-top: 15px;
}
.craft-scalable-content-main {
border: 1px solid #828282;
padding: 20px 15px;
border-radius: 10px;
background: rgba(0, 0, 0, 0.22);
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(5px) saturate(180%);
-webkit-backdrop-filter: blur(5px) saturate(180%);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.craft-scalable-content {
display: flex;
gap: 20px;
align-items: start;
justify-content: space-between;
}
.craft-scalable-content img {
width: 18px;
height: 18px;
}
.why-choose-us-sec {
background-color: #121212;
}
.why-choose-us-sec .lets_talk {
display: flex;
align-items: center;
justify-content: center;
margin-top: 50px;
}
.why-choose-us-sec img.arrow_up {
width: 24px;
height: 24px;
margin: 0px 0px -2px 8px;
}
.why-choose-us-content-main {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 30px;
margin: 30px 0;
}
.why-choose-us-content-main .why-choose-us-content {
padding: 16px 12px;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.why-choose-us-content-main .why-choose-us-content .mini-head-para {
font-size: 1.2rem;
margin-top: 80px;
}
.why-choose-us-content {
background-size: cover;
background-position: bottom;
transition: transform 0.3s ease-in-out;
-webkit-transition: transform 0.3s ease-in-out;
-moz-transition: transform 0.3s ease-in-out;
-ms-transition: transform 0.3s ease-in-out;
-o-transition: transform 0.3s ease-in-out;
}
.why-choose-us-content:hover {
transform: scale(1.03);
-webkit-transform: scale(1.03);
-moz-transform: scale(1.03);
-ms-transform: scale(1.03);
-o-transform: scale(1.03);
}
.why-choose-us-content-main .first {
background-image: url(../images/new-img/why-choose-first.webp);
}
.why-choose-us-content-main .second {
background-image: url(../images/new-img/why-choose-second.webp);
}
.why-choose-us-content-main .third {
background-image: url(../images/new-img/why-choose-third.webp);
}
/* Styles for the collaborate-table */
.collaborate-table {
width: 100%;
overflow-x: auto;
margin: 20px auto;
padding: 10px;
}
/* Table styles */
.collaborate-table table {
width: 100%;
border-collapse: collapse;
color: #fff;
}
.collaborate-table th,
.collaborate-table td {
padding: 15px;
text-align: center;
border: 1px solid #909090;
background: #141414;
}
.collaborate-table thead th:first-child {
text-align: start;
max-width: 220px;
}
.collaborate-table thead th:first-child .grey-para {
font-weight: 400;
font-size: 14px;
}
.collaborate-table thead th span {
font-weight: 400;
font-size: 12px;
}
.collaborate-table tbody tr:nth-child(odd) {
background-color: #222;
/* Alternating row colors for better readability */
}
.collaborate-table tbody tr:nth-child(even) {
background-color: #111;
}
p.btn-sym {
background: #E5195E;
padding: 8px;
border-radius: 3px;
font-weight: 500;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
}
.collaborate-with-sec .request_the_price_sec .box {
background: #171717;
}
.collaborate-with-sec .request_the_price_sec .plus_minus_main button {
background: #626262;
color: #fff;
}
.collaborate-with-sec .request_the_price_sec .plus_minus_main input {
background: transparent;
color: #fff;
}
.collaborate-with-sec .request_the_price_sec .inner_requst {
gap: 24px;
}
.collaborate-with-sec .request_the_price_sec .inner_requst {
margin-top: 0px;
}
.collaborate-with-sec .request_the_price_sec .box {
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-ms-border-radius: 0px;
-o-border-radius: 0px;
}
.collaborate-with-sec .request_the_price_sec .plus_minus_main p {
font-size: 16px;
}
.collaborate-with-sec .mini-head-para {
margin-bottom: 20px;
}
.question {
background-color: #171717;
padding: 20px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
margin-bottom: 24px;
}
.question .form-check {
margin-bottom: 24px;
}
.request-price .mini-head-para {
font-weight: 400;
}
.question label {
display: block;
margin-bottom: 10px;
font-size: 0.9em;
cursor: pointer;
}
.question input[type="radio"],
.question input[type="checkbox"] {
margin-right: 10px;
}
.collaborate-with-sec .lets_talk {
display: flex;
align-items: center;
justify-content: center;
}
.collaborate-with-sec .lets_talk button {
display: flex;
align-items: center;
justify-content: center;
width: 250px;
}
.team div {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid #333;
}
.team div:last-child {
border-bottom: none;
}
.team span {
font-size: 1em;
}
.team button {
background-color: #444;
color: #fff;
border: none;
border-radius: 5px;
padding: 5px 10px;
cursor: pointer;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
}
.team button:hover {
background-color: #e91e63;
}
/* Style the checkbox */
.cmm-checkbox {
appearance: none;
-webkit-appearance: none;
background: transparent;
border: 1px solid #E5195E;
border-radius: 2px !important;
width: 18px;
height: 18px;
cursor: pointer;
position: relative;
outline: none;
-webkit-border-radius: 2px !important;
-moz-border-radius: 2px !important;
-ms-border-radius: 2px !important;
-o-border-radius: 2px !important;
}
/* Style for the checked state */
.cmm-checkbox:checked {
background: #E5195E;
border-color: #E5195E;
}
.cmm-checkbox:checked::after {
content: "";
position: absolute;
top: 2px;
left: 6px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
}
/* Techonology page start */
.tech-banner-sec .col-md-6 {
display: flex;
flex-direction: column;
justify-content: center;
}
/* .tech-banner-sec .col-md-5 img {
scale: 1.1;
} */
.flutter-exp-main {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 50px 80px;
margin-top: 40px;
}
.flutter-exp img {
width: 20px;
height: 20px;
margin-top: 3px;
}
.flutter-exp-inn-content {
display: flex;
gap: 10px;
}
.flutter-exp .grey-para {
padding-left: 30px;
}
.our-flutter-team-left-img {
width: 94%;
height: 380px;
}
.our-flutter-team-side-content {
display: flex;
flex-direction: column;
gap: 20px;
}
.our-flutter-team-side {
display: flex;
align-items: start;
gap: 10px;
}
.our-flutter-team-sec .grey-para {
margin-bottom: 40px;
}
.our-flutter-team-sec .mini-head-para {
margin-bottom: 26px;
}
.our-flutter-team-side img {
width: 20px;
height: 20px;
margin-top: 2px;
}
.consulting-box {
background-color: #292929;
padding: 20px 16px;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.consulting-box img {
width: 30px;
height: 30px;
}
.consulting-box-inn-content {
display: flex;
align-items: center;
gap: 10px;
border-bottom: 2px solid #E5195E;
padding-bottom: 16px;
margin-bottom: 20px;
}
.consulting-box .mini-head-para {
color: #fff;
font-size: 0.9rem;
}
.consulting-box .mini-head-para img {
width: 18px;
height: 18px;
margin-left: 4px;
}
/* Container for the underline */
.solution-tab .nav {
position: relative;
padding-bottom: 10px;
justify-content: space-between;
}
.solution-tab .stepper-line {
position: absolute;
bottom: -2px;
left: 0;
height: 3px;
background: linear-gradient(90deg, #E5195E 0%, #094EFF 100%);
transition: width 0.3s ease;
z-index: 1;
-webkit-transition: width 0.3s ease;
-moz-transition: width 0.3s ease;
-ms-transition: width 0.3s ease;
-o-transition: width 0.3s ease;
}
/* Star (Arrow-like) at the right end of the Stepper Line */
.solution-tab .stepper-line::after {
content: '';
position: absolute;
height: 18px;
width: 18px;
background: url(../images/new-img/star.svg) no-repeat center center;
background-size: contain;
bottom: -8px;
right: -9px;
transition: right 0.3s ease;
z-index: 2;
-webkit-transition: right 0.3s ease;
-moz-transition: right 0.3s ease;
-ms-transition: right 0.3s ease;
-o-transition: right 0.3s ease;
}
.solution-tab-main .nav-link {
color: #ffffff;
border-color: transparent;
width: 100%;
padding: 10px !important;
font-weight: 400;
transition: color 0.3s ease, border-color 0.3s ease, font-weight 0.3s ease;
position: relative;
z-index: 2;
-webkit-transition: color 0.3s ease, border-color 0s ease, font-weight 0.3s ease;
-moz-transition: color 0.3s ease, border-color 0s ease, font-weight 0.3s ease;
-ms-transition: color 0.3s ease, border-color 0s ease, font-weight 0.3s ease;
-o-transition: color 0.3s ease, border-color 0s ease, font-weight 0.3s ease;
border: 0px solid transparent;
}
.solution-tab-main .nav-link:hover {
color: #E5195E;
transition: color 0.3s ease;
font-weight: normal;
}
.solution-tab-main .nav-link.active {
color: #E5195E;
background-color: transparent;
border-bottom: 2px solid #E5195E;
font-weight: 500;
transition: color 0.3s ease, border-color 0.3s ease, font-weight 0.3s ease;
-webkit-transition: color 0.3s ease, border-color 0.3s ease, font-weight 0.3s ease;
-moz-transition: color 0.3s ease, border-color 0.3s ease, font-weight 0.3s ease;
-ms-transition: color 0.3s ease, border-color 0.3s ease, font-weight 0.3s ease;
-o-transition: color 0.3s ease, border-color 0.3s ease, font-weight 0.3s ease;
}
.solution-tab-main .nav-tabs {
justify-content: space-between;
}
.solution-tab-main .sol-tab-first-content ul {
padding-left: 1rem;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 20px;
margin-top: 30px;
}
.solution-tab-main .sol-tab-first-content ul li {
list-style: disc;
line-height: 36px;
}
.how-we-work-steps {
display: flex;
flex-direction: column;
gap: 30px;
margin-top: 35px;
}
.step-count-main {
display: flex;
align-items: start;
gap: 30px;
}
.step-count-main {
display: flex;
align-items: start;
gap: 30px;
}
.step-count-main .step-count {
text-align: center;
}
.step-count-main .step-count-content {
padding: 10px 15px;
background-color: #191919;
width: 100%;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.step-count-main .step {
background-color: #E5195E;
padding: 10px 19px;
border-radius: 50%;
font-weight: 600;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
}
.step-count-main .dark-grey-para {
font-size: 12px;
}
.consulting-look-sec {
margin: 70px 0 40px;
background-image: url(../images/new-img/app-dev-bg.webp);
background-repeat: no-repeat;
background-size: cover;
background-position: bottom;
padding: 0;
}
.consulting-content {
display: flex;
align-items: center;
justify-content: space-between;
}
.consulting-look-sec .mid-para {
font-weight: 500;
font-size: 28px;
}
.consulting-look-sec .left-sec {
max-width: 70%;
}
.consulting-look-sec .right-sec {
position: relative;
width: 300px;
height: 260px;
}
.consulting-look-sec .consulting-side-img img {
width: 340px;
height: 320px;
position: absolute;
bottom: 0px;
}
.consulting-craft {
background-image: url(../images/new-img/craft-scalable-bg-second.webp);
}
/* company page strat from here */
.company-banner-sec {
background-image: url(../images/new-img/company-banner.webp);
}
.company-banner-sec .col-md-7 {
padding-top: 100px;
border-right: 1px solid #262626;
padding-right: 0;
}
.comp-count-main {
display: flex;
justify-content: space-between;
gap: 30px;
margin: 50px 0;
border-top: 1px solid #262626;
}
.comp-count-main .comp-count {
padding-right: 40px;
border-right: 1px solid #262626;
padding-top: 30px;
}
.comp-count-main .comp-count .mini-head-para {
font-size: 1.6rem;
}
.company-banner-side-content {
padding: 0 0 0 40px;
display: flex;
flex-direction: column;
align-items: start;
justify-content: end;
height: 100%;
padding-bottom: 40px;
}
.company-banner-side-content .group-side {
width: 180px;
height: auto;
margin-bottom: 20px;
}
.company-banner-side-content .lets_talk a {
background-color: #141414;
color: #E5195E;
border: 1px solid #262626;
border-radius: 8px;
padding: 12px 25px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.company-banner-side-content .lets_talk a img.arrow_up {
width: 20px;
height: 15px;
}
.company-sets-apart .transform-box-main {
grid-template-columns: repeat(2, 1fr);
}
.company-sets-apart .transform-box-main .transform-box {
background-color: #191919;
}
.who-wdi-logo {
margin-bottom: 20px;
}
.who-wdi-logo img {
width: 70px;
height: 70px;
}
.who-we-are-sec .row {
align-items: center;
}
.who-we-are-left .grey-para {
line-height: 30px;
}
.who-we-are-content-main {
display: flex;
flex-direction: column;
gap: 20px;
}
.who-we-are-content {
display: flex;
align-items: start;
gap: 16px;
background-color: #1A1A1A;
padding: 10px 16px;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.mission-img img {
width: 40px;
height: 40px;
}
.our-values-sec {
background-color: #121212;
}
.our-values-box img {
width: 40px;
height: 40px;
margin-bottom: 16px;
}
.our-values-box-main {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 30px;
border-top: 1px solid #262626;
margin: 40px 0;
}
.our-values-box {
padding-right: 30px;
border-right: 1px solid #262626;
padding-top: 30px;
}
.our-values-box:last-child {
padding-right: 0px;
border-right: none;
}
.our-values-box img {
width: 35px;
height: 35px;
margin-bottom: 16px;
}
/* Portfolio page start from here */
.we-are-proud-sec {
background-image: url(../images/new-img/we-are-proud-bg.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.star-rate-box {
display: flex;
align-items: center;
gap: 4px;
}
.star-rate-box img {
width: 10px !important;
height: 10px !important;
}
/* Portfolio page start from here */
.web-experiences-sec {
background-image: url(../images/new-img/web-exp-bg.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
}
.web-experiences-sec .col-md-6 {
display: flex;
flex-direction: column;
justify-content: center;
}
.web-dev .transform-box-main .transform-box:first-child {
grid-column: span 2;
}
.web-innovating {
background-color: #121212;
}
.banner-col {
min-height: 60vh;
display: flex;
flex-direction: column;
justify-content: center;
}
/* product page */
.modern-tools-sec {
background-image: url(../images/new-img/modern-tolls-bg.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
}
/* streamline-sec page */
.streamline-sec {
background-image: url(../images/new-img/project-man-bg.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.product-page .transform-box-main {
grid-template-columns: repeat(2, 1fr);
}
.product-page .transform-box {
background-color: #292929;
}
.fintech-sec img {
width: 40px;
height: 40px;
margin-bottom: 20px;
}
.fintech-sec .row {
justify-content: space-between;
align-items: center;
}
.fintech-sec .row .col-md-8 {
border-left: 1px solid #262626;
}
.fintech-right-box-main {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 20px;
padding: 0 0 0 40px;
}
.fintech-right-box {
background-color: #1A1A1A;
padding: 20px 16px;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.our-product-sec {
background-color: #000;
}
.four-grid .transform-box-main {
grid-template-columns: repeat(4, 1fr);
}
.four-grid .transform-box .transform-inn-content {
flex-direction: column;
}
.four-grid .transform-box-main .transform-box {
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
.app-built-for .col-md-7 {
display: flex;
justify-content: center;
align-items: center;
}
.project-man-built {
background-image: url(../images/new-img/project-man-built-bg.webp);
background-repeat: no-repeat;
background-size: cover;
padding: 60px 0 100px;
}
.project-man-built .col-md-6 {
display: flex;
justify-content: center;
align-items: center;
}
.built-for-scale-sec .col-md-5 {
display: flex;
flex-direction: column;
justify-content: center;
}
.built-for-scale-sec .lets_talk a {
font-size: 15px;
font-weight: 300;
padding: 8px 25px;
}
.built-for-scale-sec {
overflow: hidden;
padding: 80px 0 50px;
}
.built-for-scale-sec .col-md-6:first-child {
display: flex;
align-items: center;
justify-content: center;
}
.built-for-ios {
display: flex;
justify-content: center;
}
.built-for-scale-sec .built-for-ios img {
width: 250px;
height: auto;
scale: 2;
}
/* Complete Digital Transformation start */
.digital-banner-sec {
background-image: url(../images/new-img/digital-banner-bg.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.transforming-concept .transform-box:first-child {
grid-column: span 2;
}
.app-modern-bg {
background-image: url(../images/new-img/app-modern-bg.webp);
}
.ui-ux-bg {
background-image: url(../images/new-img/ui-ux-bg.svg);
}
.ai-app-bg {
background-image: url(../images/new-img/ai-apps-bg.webp);
}
.block-main {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 20px;
margin-top: 40px;
}
.block-main .block-one {
display: flex;
flex-direction: column;
gap: 20px;
}
/* .block-main .block-one .block-content:first-child{
flex: 1 !important;
} */
.block-head {
border: 1px solid #E8155D;
padding: 10px 15px;
border-radius: 8px;
background-color: #232323;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.block-content {
padding: 20px 15px;
background-color: #191919;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.build-block-sec .block-content {
min-height: 200px;
}
.block-content .mini-head-para {
margin-bottom: 14px;
}
.block-content ul {
padding-left: 1.2rem;
}
.block-content ul li {
list-style: disc;
font-size: 14px;
margin-bottom: 10px;
}
.trnsformtion-plan .block-content {
padding: 10px 12px;
border-radius: 0;
flex: 1;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
.trnsformtion-plan .block-one {
position: relative;
overflow: hidden;
}
.trnsformtion-plan .block-content .grey-para {
margin-bottom: 0;
}
.trnsformtion-plan .block-one::after {
content: '';
display: block;
width: 2px;
height: 100%;
background: linear-gradient(to bottom, #E5195E 33%, transparent 33%, transparent 66%, #E5195E 66%, #E5195E);
background-size: 1px 8px;
position: absolute;
top: 50px;
left: 50%;
transform: translateX(-50%);
z-index: -1;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
}
.illustrat-box-main {
display: flex;
align-items: start;
gap: 20px;
flex-direction: column;
margin-top: 30px;
}
.illustrat-box {
display: flex;
align-items: start;
gap: 16px;
background-color: #191919;
border-radius: 8px;
padding: 12px 15px;
width: 100%;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.illustrat-box img {
width: 20px;
height: 20px;
}
/* .futuretech-sec .col-md-5 {
display: flex;
justify-content: center;
flex-direction: column;
} */
.futuretech-sec .col-md-7 {
border-left: 1px solid #262626;
}
/* Solution use cases */
.mid-head sup img {
width: 28px;
height: 28px;
}
.solution-tab {
background: #141414;
padding: 30px 20px;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
margin-top: 35px;
}
.solution-tab .nav-link {
color: #B4B4B4;
flex: 1;
padding: 8px 0px;
transition: color 0.3s ease, font-weight 0.3s ease;
border: none;
-webkit-transition: color 0.3s ease, font-weight 0.3s ease;
-moz-transition: color 0.3s ease, font-weight 0.3s ease;
-ms-transition: color 0.3s ease, font-weight 0.3s ease;
-o-transition: color 0.3s ease, font-weight 0.3s ease;
}
.solution-tab .nav-link:hover {
color: #E5195E;
}
.solution-tab .nav-tabs .nav-link:hover {
border-color: transparent;
}
.solution-tab .nav {
justify-content: space-between;
padding-bottom: 20px;
}
.solution-tab .nav-tabs .nav-item.show .nav-link,
.solution-tab .nav-tabs .nav-link.active {
color: #E5195E;
background-color: transparent;
position: relative;
border-color: transparent;
/* padding: 8px 25px 8px 16px; */
}
.solution-tab .nav-link img {
filter: grayscale(100%) !important;
-webkit-filter: grayscale(100%) !important;
margin-right: 2px;
width: 20px;
height: 20px;
}
.solution-tab .nav-link.active img {
filter: grayscale(0%) !important;
-webkit-filter: grayscale(0%) !important;
}
/* accordion */
.inn_data .h3_heading {
cursor: pointer;
}
.solution-tab .inn_data {
box-shadow: inset 0px 2px 5px rgba(255, 255, 255, 0.1);
border-radius: 8px;
margin-bottom: 20px;
background-color: #2b2b2b;
transition: transform 0.3s ease;
-webkit-transition: transform 0.3s ease;
-moz-transition: transform 0.3s ease;
-ms-transition: transform 0.3s ease;
-o-transition: transform 0.3s ease;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.solution-tab .inn_data:hover {
transform: scale(1.01);
box-shadow: inset 0px 2px 5px rgba(255, 255, 255, 0.25);
}
.solution-tab .accordion_content {
display: none;
padding: 0 20px 20px 20px;
}
.solution-tab .h3_heading.active .accordion_content {
display: block;
}
.solution-tab .h3_heading {
display: flex;
align-items: center;
justify-content: space-between;
color: #959595;
font-weight: 400 !important;
font-size: 18px;
margin-bottom: 0;
padding: 20px;
}
.solution-tab .h3_heading.active {
color: #fff;
margin-bottom: 6px;
}
.solution-tab .h3_heading img {
width: 20px;
height: 20px;
transition: transform 0.3s ease;
-webkit-transition: transform 0.3s ease;
-moz-transition: transform 0.3s ease;
-ms-transition: transform 0.3s ease;
-o-transition: transform 0.3s ease;
}
.solution-tab .h3_heading.active img {
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
}
.solution-tab .tab-content>.active {
display: block;
padding-top: 40px;
}
.custom-list {
list-style-type: none;
padding-left: 0;
}
.custom-list li {
position: relative;
padding-left: 1.8em;
margin-bottom: 18px;
font-size: 15px;
}
.custom-list li::before {
content: "";
background-image: url("../images/new-img/li-check.svg");
background-size: contain;
background-repeat: no-repeat;
width: 20px;
height: 20px;
position: absolute;
left: 0;
top: 2px;
}
.learn-ai-sec .col-md-6 {
display: flex;
align-items: center;
justify-content: center;
}
.learn-ai-sec .col-md-6 .head {
font-size: 3rem;
}
.learn-ai-sec .col-md-6 img {
width: 60%;
}
.industries-we-serve-box-main {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 30px;
margin-top: 35px;
}
.industries-we-serve-box {
border-radius: 8px;
padding: 20px;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
-ms-border-radius: 8px;
-o-border-radius: 8px;
}
.industries-we-serve-box:hover {
scale: 1.03;
}
.industries-we-serve-box .mid-para {
font-weight: 500;
}
.industries-we-serve-box .grey-para {
font-size: 14px;
margin-bottom: 0;
}
.industries-we-serve-box-main .first {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/ind-first.webp);
}
.industries-we-serve-box-main .second {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/ind-second.webp);
}
.industries-we-serve-box-main .third {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/ind-third.webp);
}
.industries-we-serve-box-main .fourth {
background-image: url(../images/new-img/real.webp);
}
.industries-we-serve-box-main .fifth {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/ed-tech.webp);
}
.industries-we-serve-box-main .six {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/travel.webp);
}
.industries-we-serve-box-main .seven {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/travel.webp);
}
.industries-we-serve-box-main .eight {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/retail.webp);
}
.industries-we-serve-box-main .nine {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url(../images/new-img/entertain.webp);
}
.how_we_leverage {
width: 100%;
position: relative;
}
.how_we_leverage .bann_img {
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
object-fit: cover;
}
.how_we_leverage .mini-head {
margin-bottom: 0;
}
.how_we_leverage .main_box {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
margin-top: 35px;
}
.how_we_leverage .main_box .inn_box {
background-color: #322f32;
padding: 20px;
border-radius: 17px;
-webkit-border-radius: 17px;
-moz-border-radius: 17px;
-ms-border-radius: 17px;
-o-border-radius: 17px;
background: rgba(255, 255, 255, 0.17);
border: none;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(10px) saturate(180%);
}
.how_we_leverage .main_box .para_img {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 12px;
}
.how_we_leverage .main_box img {
width: 40px;
height: 40px;
}
/* pooooooooooooooooooooooooooooooooooooooooooooooooooooooooo */
.portfolio-box-main {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 30px;
margin-top: 40px;
}
.portfolio-box {
position: relative;
overflow: hidden;
}
.portfolio-box-inner img {
width: 100%;
height: auto;
display: block;
}
.on-hover-show {
position: absolute;
bottom: -100%;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.85);
backdrop-filter: blur(8px);
color: white;
padding: 25px;
display: flex;
flex-direction: column;
justify-content: start;
align-items: flex-start;
transition: bottom 0.5s ease, opacity 0.5s ease;
opacity: 0;
-webkit-transition: bottom 0.5s ease, opacity 0.5s ease;
-moz-transition: bottom 0.5s ease, opacity 0.5s ease;
-ms-transition: bottom 0.5s ease, opacity 0.5s ease;
-o-transition: bottom 0.5s ease, opacity 0.5s ease;
}
.on-hover-show .logo-container {
display: flex;
justify-content: flex-start;
margin-bottom: 30px;
}
.on-hover-show .logo-container .logo {
max-width: 120px;
height: auto;
}
.on-hover-show .app-categories {
display: flex;
gap: 22px;
flex-wrap: wrap;
margin-bottom: 20px;
}
.on-hover-show .category {
background: rgba(255, 255, 255, 0.2);
padding: 5px 10px;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #d9d9d9;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
}
.on-hover-show .app-description .mid-para {
font-weight: 600;
font-size: 1.7rem;
}
.on-hover-show .location-rating {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
flex-direction: column;
gap: 20px;
}
.on-hover-show .location {
display: flex;
align-items: center;
gap: 10px;
}
.on-hover-show .location img {
width: 35px;
height: auto;
}
.on-hover-show .rating img {
width: 50px;
height: auto;
}
.on-hover-show .rating-main {
color: #fff;
font-size: 14px;
background-color: rgba(255, 255, 255, 0.12);
padding: 5px 15px;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
}
.on-hover-show .rating {
display: flex;
gap: 10px;
}
.on-hover-show .technologies {
margin: 20px 0;
}
.on-hover-show .technologies .mini-head-para {
margin-bottom: 22px;
}
.on-hover-show .technologies img {
width: 30px;
margin-right: 20px;
height: 30px;
}
.portfolio-box:hover .on-hover-show {
bottom: 0;
opacity: 1;
overflow-y: auto;
}
/* for bottom content on image */
.port-bot-content {
position: absolute;
bottom: 0;
left: 0;
background: #00000040;
width: 100%;
padding: 26px;
opacity: 0.9;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
transition: opacity 0.3s ease, visibility 0.3s ease;
visibility: visible;
}
.port-bot-content .mid-para {
font-size: 1.5rem;
font-weight: 600;
margin: 4px;
}
.port-bot-content .grey-para {
font-size: 1.1rem;
color: #C8C8C8;
font-weight: 500;
margin: 0;
}
.portfolio-box:hover .port-bot-content {
display: none;
visibility: hidden;
}
.bg-content-mob {
display: none;
}
.ios-banner-sec {
background-image: url(../images/new-img/ios-banner.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
}
.ios-sec .col-md-7 {
display: flex;
justify-content: center;
flex-direction: column;
}
.ios-sec .look-side-img {
display: flex;
justify-content: center;
height: 100%;
}
.ios-sec .look-side-img img {
width: 300px;
height: auto;
}
.craft-ios {
background-image: url(../images/new-img/craft-ios-bg.webp);
}
.craft-android {
background-image: url(../images/new-img/craft-android.webp);
}
.sitemap-col-main {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 40px;
align-content: space-between;
margin-top: 80px;
}
.sitemap-col-main .foot2 h2 {
color: #E5195E;
font-size: 16px;
font-weight: 500;
}
.sitemap-col-main .foot2 a {
font-size: 14px;
line-height: 3;
}
.project-cta {
background-image: url(../images/new-img/project-side.webp);
background-size: cover;
background-repeat: no-repeat;
}
.consulting-sec {
background-image: url(../images/new-img/consulting-bg.webp);
background-size: cover;
background-repeat: no-repeat;
}
.ai-mix-blend img {
mix-blend-mode: hard-light;
}
.wdi-guarantee-sec .accordion_content ul {
padding-left: 40px;
}
.wdi-guarantee-sec .accordion_content ul li {
padding-left: 10px;
list-style-type: disc;
}
.mobile_view_img {
display: none;
}
.android-banner-sec {
background-image: url(../images/new-img/android-banner.webp);
}
.native-banner-sec {
background-image: url(../images/new-img/native-banner.webp);
}
.hybrid-banner-sec {
background-image: url(../images/new-img/hybrid-banner.webp);
}
.built-android .built-for-left-img img,
.built-native .built-for-left-img img {
scale: 1.25;
}
.hybrid-side-bg {
background-image: url(../images/new-img/hybrid-side-bg.webp);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
/* Technology page */
.tech-side {
display: flex;
align-items: center;
justify-content: center;
}
.tech-side img {
width: 400px;
height: auto;
}
.developer-cards {
display: grid;
align-items: center;
grid-template-columns: repeat(3, 1fr);
grid-gap: 40px;
margin: 40px 0 30px;
}
.dev-card {
background-color: #191919;
padding: 36px 60px;
}
.features-table {
width: 100%;
overflow-x: auto;
}
.features-table table {
width: 100%;
border-spacing: 0;
min-width: 600px;
}
.features-table th,
.features-table td {
text-align: center;
padding: 15px;
color: #fff;
}
.features-table thead th {
background-color: #E5195E;
font-size: 18px;
font-weight: 500;
}
.features-table thead th:not(:last-child) {
border-right: 1px solid #fff;
}
.features-table tbody tr {
background-color: #191919;
}
.features-table tbody tr:nth-child(odd) {
background-color: #2C2C2C;
}
.features-table tbody tr:hover {
background-color: #444444;
}
.features-table tbody td {
font-size: 16px;
}
.features-table tbody td:not(:last-child) {
border-right: 1px solid rgba(229, 25, 94, 0.27);
}
.features-table tbody tr td:first-child {
text-align: left;
padding-left: 20px;
}
.features-table tbody tr:hover td {
background-color: #7B7B7B;
}
/* hire uiux */
.hire-uiux-sec {
background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url(../images/new-img/uiux-banner.webp);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.experience-count-sec {
padding: 80px 0;
}
.experience-count-main {
display: flex;
align-items: center;
justify-content: space-around;
gap: 40px;
flex-wrap: wrap;
}
.experience-count {
display: flex;
align-items: center;
gap: 20px;
}
.experience-count-img {
padding: 14px;
background-color: #333333;
border-radius: 4px;
}
.experience-count img {
width: 30px;
height: 30px;
}
.experience-count-inn .mid-para {
font-weight: 700;
font-size: 1.8rem;
margin-bottom: 2px;
}
.experience-count-inn .grey-para {
margin-bottom: 0;
}
/* ***** Media screen ***** */
@media (min-width:1680px) {
.dual-slider {
height: calc(100vh - 200px);
}
}
@media (max-width:1400px) {
.solution-tab .nav {
overflow-x: auto;
width: 100%;
flex-wrap: nowrap;
overflow-x: auto;
scroll-behavior: smooth;
white-space: nowrap;
position: relative;
height: 100%;
overflow-y: hidden;
border-bottom: none;
}
.solution-tab .tab-content>.active {
padding-top: 30px;
}
.solution-tab .nav::-webkit-scrollbar {
width: 0px;
height: 0;
background: transparent;
}
.solution-tab .stepper-line {
bottom: 8px;
}
.four-grid .transform-box-main {
grid-template-columns: repeat(3, 1fr);
}
.four-grid .transform-box-main .transform-box .transform-inn-content .mid-para {
min-height: 100%;
}
.mobile-download-main {
gap: 30px;
}
.mobile-download-main .head {
font-size: 2.4rem;
}
}
@media (max-width:1367px) {
.head {
font-size: 2.5rem;
font-weight: 600;
letter-spacing: 0.5px;
}
.mid-head {
font-size: 1.8rem;
font-weight: 500;
letter-spacing: normal;
word-spacing: normal;
}
.bg-content-left .logo img {
max-width: 150px;
height: auto;
margin-bottom: 15px;
}
.bg-content-left .mid-head {
font-size: 1.8rem;
margin-bottom: 15px;
}
.two_slider_main {
bottom: 60px;
}
}
@media (max-width:1199px) {
.web-innovating .innovating-box-main {
grid-template-columns: repeat(2, 1fr);
}
.mobile-banner {
height: 380px;
}
.ai-review-circle p:last-child {
font-size: 14px;
}
.ai-review-circle {
width: 145px;
height: 145px;
}
.four-grid .transform-box-main {
grid-template-columns: repeat(2, 1fr);
}
.block-main {
grid-template-columns: repeat(2, 1fr);
}
div#card_slide .next_arrow {
right: 43%;
}
.solution-tab {
padding: 20px 12px;
}
.solution-tab .nav-link {
padding: 6px 10px;
flex: none;
font-size: 14px;
}
.solution-tab .nav-link:hover {
padding: 6px 10px;
}
.solution-tab .nav-tabs .nav-item.show .nav-link,
.solution-tab .nav-tabs .nav-link.active {
padding: 8px 12px;
}
.solution-tab .nav-link img {
width: 16px;
height: 16px;
}
}
@media (max-width:1081px) {
.why-hiring-dev-box-main {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width:1024px) {
.consulting-look-sec .consulting-side-img img {
right: -10%;
}
}
@media (max-width:991px) {
.experience-count {
gap: 10px;
}
.experience-count-main {
gap: 20px;
}
.experience-count-inn .mid-para {
font-size: 1.5rem;
}
.experience-count-inn .grey-para {
margin-bottom: 0;
font-size: 14px;
}
.developer-cards {
grid-template-columns: repeat(2, 1fr);
}
.port-bot-content {
padding: 20px;
}
.port-bot-content .mid-para {
font-size: 1.4rem;
margin: 2px;
}
.port-bot-content .grey-para {
font-size: 1rem;
}
.consulting-look-sec .consulting-side-img img {
right: -25%;
}
.consulting-look-sec .consulting-side-img img {
width: 300px;
height: 300px;
}
.mobile-banner-sec .col-md-6:last-child {
display: none;
}
.mobile-banner-sec .mobile_view_img img {
max-width: 100%;
max-height: 100%;
}
.mobile_view_img {
display: flex;
justify-content: center;
}
.mobile_view_img img {
display: block;
max-width: 400px;
max-height: 400px;
}
.innovating-box-main {
grid-template-columns: repeat(2, 1fr);
}
.mobile-download-main {
gap: 85px;
}
.mobile-banner {
margin-bottom: 40px;
}
@keyframes line-grow {
0% {
width: 0;
}
100% {
width: 300px;
}
}
.why-hiring-dev-box-main {
grid-template-columns: repeat(2, 1fr);
}
.why-hire-sec .transform-box-main {
grid-template-columns: repeat(2, 1fr);
}
.develope-ai-sec .row,
.mobile-banner-sec .row {
flex-direction: column-reverse;
}
.ai-review-circle {
width: 170px;
height: 170px;
}
.we-see-solution-sec .row {
flex-direction: column;
gap: 20px;
}
.banner-col {
min-height: 100%;
}
.develope-ai-sec .col-md-7,
.develope-ai-sec .col-md-5,
.we-see-solution-sec .col-md-6,
.mobile-banner-sec .col-md-6,
.banner-col {
width: 100%;
}
.strategic-sec .strategic-side {
display: none;
}
.develope-ai-sec .col-md-5 img {
scale: 1;
display: none;
}
.why-choose-us-content-main {
grid-template-columns: repeat(2, 1fr);
}
.look-app-dev .col-md-6:last-child {
position: relative;
}
.look-app-dev .look-side-img {
position: absolute;
bottom: 0;
}
.craft-scalable-sec .row {
flex-direction: column;
gap: 20px;
}
.craft-scalable-sec .row .col-md-7,
.craft-scalable-sec .row .col-md-5 {
width: 100%;
}
.craft-scalable-sec .row .col-md-5 {
width: 100%;
}
.craft-scalable-content-main {
margin-bottom: 22px;
}
.industries-we-serve-box-main {
grid-template-columns: repeat(2, 1fr);
}
.choose-your-path-main {
grid-template-columns: repeat(2, 1fr);
}
.content-download-sec {
gap: 10px;
}
.map-location-main {
grid-template-columns: repeat(2, 1fr);
}
.get-in-touch-sec .opts-choose {
grid-template-columns: repeat(3, 1fr);
}
.award-content-main {
grid-template-columns: repeat(2, 1fr);
}
div#card_slide .next_arrow {
right: 40%;
}
.home-form .br-txt span {
padding: 0 40px 20px 40px;
}
/* .solution-tab .stepper-line {
bottom: 0px;
} */
.solution-tab .nav {
padding-bottom: 16px;
}
.bg-content-right img {
display: none !important;
}
.bg-content-left {
padding-top: 40px;
max-width: 100%;
}
}
@media (max-width:767px) {
br {
display: none;
}
.section {
padding: 40px 0;
}
.experience-count-main {
gap: 30px;
align-items: center;
}
.experience-count {
justify-content: center;
flex-direction: column;
text-align: center;
}
.developer-cards {
grid-template-columns: repeat(1, 1fr);
}
.tooltip {
left: 0;
transform: translateX(0%);
}
.home-form {
margin-top: 45px;
}
.home-form .lets_talk {
margin: 20px 0 0;
}
.company-banner-sec .col-md-7 {
padding-top: 0px;
}
.transforming-concept .transform-box:first-child {
grid-column: span 1;
}
.flutter-exp-main {
grid-template-columns: repeat(1, 1fr);
grid-gap: 36px 40px;
}
.mobile-banner-content .transform-box-main .transform-box:first-child {
grid-column: span 1;
}
.web-innovating .innovating-box-main {
grid-template-columns: repeat(1, 1fr);
margin: 0;
}
.innovating-box {
padding: 12px;
}
/* .mob-wrapper {
display: none;
} */
.look-side-img {
display: none !important;
}
.learn-ai-sec .col-md-6 img {
display: none;
}
.learn-ai-sec {
background-color: #12121257;
}
.dual-slider button.prev_arrow,
button.next_arrow {
bottom: -50%;
}
.project-man-built .row {
gap: 20px;
}
.details-content:not(:last-child)::after {
display: none;
}
.details-img .dot {
display: none;
}
.details-container {
grid-template-columns: repeat(1, 1fr);
grid-gap: 10px;
}
.consulting-look-sec .right-sec {
display: none;
}
.mobile-download-main .head {
font-size: 2.8rem;
}
.solution-tab-main .nav-tabs {
width: 100%;
flex-wrap: nowrap;
overflow-x: auto;
overflow-y: hidden;
padding-bottom: 1px;
}
.solution-tab-main .nav-tabs .nav-item {
flex-grow: 1;
text-align: center;
white-space: nowrap;
}
.steps-main {
grid-template-columns: repeat(2, 1fr);
}
.why-hire-sec .transform-box-main {
grid-template-columns: repeat(1, 1fr);
}
.consulting-look-sec .container {
max-width: 720px;
}
.consulting-look-sec .consulting-side-img img {
width: 225px;
height: 200px;
}
.design-principal .transform-box-main .transform-box:last-child {
grid-column: span 1;
}
.futuretech-sec .pink-txt {
padding-left: 0 !important;
padding-top: 20px !important;
}
.our-flutter-team-left-img {
width: 100%;
height: auto;
}
.built-for-left-img img {
width: 100%;
}
.our-flutter-team-sec .row,
.app-built-for .row {
gap: 20px;
}
.our-flutter-team-side-content {
margin-top: 20px;
}
.futuretech-sec .col-md-7 {
border-left: none;
}
.learn-ai-sec .row,
.app-built-for .row {
flex-direction: column-reverse;
}
.learn-ai-sec .col-md-6 .head {
font-size: 2.5rem;
margin-top: 20px;
}
.how_we_leverage .main_box {
grid-template-columns: repeat(2, 1fr);
}
.why-choose-us-content-main {
grid-template-columns: repeat(1, 1fr);
}
.fintech-sec {
padding-top: 20px;
}
.fintech-right-box-main {
padding: 0;
}
.fintech-sec .row .col-md-8 {
border-left: none;
}
.our-values-box-main {
grid-template-columns: repeat(2, 1fr);
border-top: none;
}
.our-values-box:last-child {
border-right: 1px solid #262626;
}
.web-dev .transform-box-main .transform-box:first-child {
grid-column: span 1;
}
.look-side-img {
display: none;
}
.built-for-scale-sec .row {
padding: 0 20px;
}
.built-for-scale-sec .built-for-ios img {
scale: 1.2;
}
.company-sets-apart .transform-box-main {
grid-template-columns: repeat(1, 1fr);
}
.cl-downside-img {
position: inherit;
}
.portfolio-box-main {
grid-template-columns: repeat(1, 1fr);
}
.home-form .br-txt span {
padding: 0 10px 12px 10px;
font-size: 1.1rem;
}
.home-form .br-txt {
margin-bottom: 40px;
}
.develope-ai-sec .col-md-5 img {
scale: 1;
}
.get-in-touch-sec .opts-choose {
grid-template-columns: repeat(2, 1fr);
}
.get-in-icons {
flex-direction: row;
gap: 10px;
margin-top: 20px;
}
.join-our-team-sec {
padding: 40px 0;
}
.got-a-project-sec .lets_talk a {
width: 100%;
}
.join-our-team-sec .lets_talk a {
width: 100%;
}
.cmm-inputs-main .row {
margin-bottom: 0px;
}
.cloud-logo-main {
gap: 30px;
}
.lets-collaborate-sec .lets_talk a {
width: 100%;
}
.crafting-sec .row,
.cloud-sec .row,
.team-aug-sec .row {
gap: 30px;
}
.look-app-dev {
background-position: right;
}
.ai-client-review-main {
padding: 40px 0;
flex-wrap: wrap;
justify-content: center;
}
.ai-review-circle p:first-child {
font-size: 18px;
}
.ai-review-circle p:last-child {
font-size: 12px;
}
.ai-review-circle {
width: 100px;
height: 100px;
}
.transform-box-main {
grid-template-columns: repeat(1, 1fr);
}
.innovating-box-main {
grid-template-columns: repeat(1, 1fr);
margin: 0;
}
.mobile-download-main {
gap: 30px;
}
.cmm-inputs-main input,
.cmm-inputs-main select,
.cmm-inputs-main textarea {
padding: 12px 12px 20px 10px;
margin-bottom: 20px;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
.book-appointment-sec .book-app-img {
display: none;
}
/* #card_slide .slick-slide img {
width: 85%;
height: auto;
} */
.block-main {
grid-template-columns: repeat(1, 1fr);
grid-gap: 40px;
}
}
@media (max-width:576px) {
.head {
font-size: 2.4rem;
line-height: 120%;
}
/* .two_slider_main {
height: 100vh;
} */
.mobile-banner {
margin-bottom: 10px;
}
.why-hiring-dev-box-main {
grid-template-columns: repeat(1, 1fr);
}
.comp-count-main .comp-count {
padding-right: 0px;
padding-top: 20px;
}
.consulting-content {
flex-direction: column-reverse;
}
.consulting-look-sec .left-sec {
max-width: 100%;
}
.crafting-sec .box {
padding: 12px 18px;
}
.our-values-box {
padding-right: 20px;
padding-top: 20px;
}
.built-for-scale-sec .built-for-ios img {
scale: 1;
}
.four-grid .transform-box-main {
grid-template-columns: repeat(1, 1fr);
}
.choose-your-path-box {
backdrop-filter: blur(-1px) saturate(180%);
-webkit-backdrop-filter: blur(-1px) saturate(180%);
}
.industries-we-serve-box {
padding: 28px 20px;
}
.industries-we-serve-box .mid-para {
margin-bottom: 24px;
}
.industries-we-serve-box-main {
grid-template-columns: repeat(1, 1fr);
}
.choose-your-path-main {
grid-template-columns: repeat(1, 1fr);
}
div#card_slide .prev_arrow {
left: 40%;
}
div#card_slide .next_arrow {
right: 32%;
}
.map-location-main {
grid-template-columns: repeat(1, 1fr);
gap: 30px;
}
.get-in-touch-sec .opts-choose {
grid-template-columns: repeat(1, 1fr);
}
.range-slider .labels {
font-size: 12px;
padding-left: 14%;
}
.award-content-main {
grid-template-columns: repeat(1, 1fr);
}
#card_slide .slick-slide {
display: flex !important;
justify-content: center !important;
}
#card_slide .slick-slide img {
width: 90%;
height: auto;
}
.mobile-download-main {
left: 12%;
bottom: -8px;
margin: 0;
}
.mobile-download-main .head {
font-size: 1.8rem;
}
.mobile-download-main {
gap: 22px;
text-align: center;
}
.home-form .br-txt span {
display: inline-block;
}
}
@media (max-width:481px) {
.mobile-download-main {
left: 8%;
gap: 15px;
}
.home-form {
padding: 16px;
}
.how_we_leverage .main_box {
grid-template-columns: repeat(1, 1fr);
}
.strategic-sec .strategic-side img {
width: 100%;
height: auto;
}
#card_slide .slick-slide img {
width: 80%;
height: auto;
}
.slick-slider {
margin-bottom: 0px !important;
}
}
@media (max-width:451px) {
.mobile-download-main {
left: 6%;
}
}
@media (max-width:420px) {
.steps-main {
grid-template-columns: repeat(1, 1fr);
}
.steps-main .step .step-number:not(:last-child)::after {
content: none;
}
.innovating-box-main {
grid-template-columns: repeat(1, 1fr);
}
.fintech-right-box-main {
grid-template-columns: repeat(1, 1fr);
}
.bg-content-left .logo img {
max-width: 180px;
margin-bottom: 16px;
}
.mid-head {
font-size: 1.8rem;
}
.dual-slider {
height: calc(100vh - 87px);
}
.mobile-download-main {
left: 3%;
}
}
@media (max-width:376px) {
/* .two_slider_main {
bottom: 55px;
} */
.dual-slider button.prev_arrow,
button.next_arrow {
bottom: -56%;
}
.bg-content-left {
padding-top: 30px;
}
}