html, body {overflow-x: hidden;}
html {overflow-y: scroll;}
/* Whatsapp-chat */
.wp-chat { margin-top: 16px !important;color: #fff !important;}
.chat { position: fixed; width: 60px; height: 60px; bottom: 40px; right: 40px; background-color: #25d366 !important; color: #FFF !important; border-radius: 50px; text-align: center; font-size: 30px; box-shadow: 2px 2px 3px #999; z-index: 999999 !important;}
.bounce2 { animation: bounce2 2s ease infinite;}
@keyframes bounce2 { 0%, 20%, 50%, 80%, 100% {transform: translateY(0); }
40% {transform: translateY(-30px);}
60% { transform: translateY(-15px);}}
/* Font-display */
@font-face { font-family: "bootstrap-icons"; src: url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/fonts/bootstrap-icons.woff2") format("woff2"), url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/fonts/bootstrap-icons.woff") format("woff"); font-display: swap; font-weight: normal; font-style: normal;}
@font-face { font-family: "Phosphor"; src: url("https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.0.0/src/regular/Phosphor.woff2") format("woff2"); font-display: swap; font-weight: normal; font-style: normal;}
/* Text */
p{font-family: "Lato", sans-serif; font-size: 17px;line-height: 27px; }
/* Primary-button */
.primary-button a{text-decoration: none; display: inline-flex; align-items: center; justify-content: center; padding: 11px 28px; background: linear-gradient(90deg, #007BFF 0%, #00C6FF 100%); color: #fff; font-size: 17px; font-weight: 500; border: none; border-radius: 50px;text-decoration: none;transition: all 0.3s ease; box-shadow: 0 4px 10px rgba(0, 123, 255, 0.3);text-wrap: nowrap;}
.primary-button a:hover{transform: translateX(6px); box-shadow: 0 6px 15px rgba(0, 123, 255, 0.4); background: linear-gradient(90deg, #0066FF 0%, #00D4FF 100%);color: #fff;}
/* Secondary-button */
.secondary-button a{text-decoration: none; font-size: 17px; color: #2776EA; font-weight: 500;border-radius:50px; border:2px solid#2776EA; padding:11px 21px; transition: all 0.3s ease; align-items: center; justify-content: center; box-shadow: 0 4px 10px rgba(163, 204, 248, 0.3);}
.secondary-button a:hover{box-shadow: 0 6px 15px rgba(0, 123, 255, 0.4); background: linear-gradient(90deg, #0066FF 0%, #00D4FF 100%); color: #fff; border: none;}
/* Tertiary-button */
.tertiary-button a{text-decoration: none; font-size: 17px; font-weight: 400;border-radius:50px; border:2px solid#D9D9D9; padding:11px 21px; transition: all 0.3s ease; align-items: center; justify-content: center; color: #000;}
.tertiary-button a:hover{box-shadow: 0 6px 15px rgba(0, 123, 255, 0.4); background: linear-gradient(90deg, #0066FF 0%, #00D4FF 100%); color: #fff; border: none;}
/* Header */
.hero{background-image: url(../images/banner-1.webp);overflow: hidden; background-size: cover;}
.navbar-nav li{padding: 12px;}
.nav-item a{ font-family: "Lato", sans-serif; color: #000 !important;font-size: 16px;}
.nav-item a:hover{color: #2776EA !important;}
.navbar-toggler{border: none !important;}
.navbar-toggler, .navbar-toggler:focus, .navbar-toggler:active { outline: none !important; box-shadow: none !important; border: none !important;}
.dropdown-toggle::after {display: none !important;}
.services-dropdown { width: 572px; padding: 20px; border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1); border: none !important; }
.dropdown-grid { margin: 20px; display: grid; grid-template-columns: repeat(2, 1fr);margin-top: 10px; margin-bottom: 10px;}
.service-item { display: flex; align-items: flex-start; gap: 14px; transition: all 0.3s ease; padding: 10px; text-decoration: none;}
.service-item:hover { background-color: #f8f8f8; border-radius: 5px; }
.service-item .icon { padding: 8px; display: flex; align-items: center; justify-content: center; border-radius: 7px; color: #fff; flex-shrink: 0; }
.service-item .icon i{font-size: 20px;}
.service-item h6{font-family: "DM Sans", sans-serif; margin: 0; font-size: 14px; font-weight: 600; color: #000; text-decoration: none;}
.service-item h6:hover{color: #000;}
.service-item p { margin: 2px 0 0; font-family: "Lato", sans-serif; font-size: 12px; color: #000;line-height: 18px;}
.nav-item.dropdown:hover .dropdown-menu { display: block;}
.nav-item.dropdown { position: relative;}
.nav-item .dropdown-menu { left: 100% !important; transform: translateX(-38%) !important;}
/* ...........................................Home............................................... */
/* Banner */
.home-banner{margin-top: 80px; margin-bottom: 225px;}
.banner h1{font-family: "Gabarito", sans-serif;font-size: 85px; font-weight: 600;padding-right: 250px;padding-bottom: 15px;}
.banner p{padding-bottom: 50px; margin-bottom: 0;}
.floating-icon { position: absolute; z-index: 1; width: 90px; opacity: 0.9;animation: float 6s ease-in-out infinite, rotate 10s linear infinite;}
@keyframes float {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-15px); }}
.sphere { top: 15%; left: 30%; animation-delay: 0s; }
.gear { top: 25%; right: 10%; width: 100px; animation-delay: 1s; }
.browser { bottom: 10%; left: 25%; width: 100px; animation-delay: 2s; }
.triangle { bottom: 15%; right: 25%; width: 100px; animation-delay: 3s; }
.sphere { animation: pulse 3s ease-in-out infinite;}
@keyframes pulse {
0%, 100% { transform: scale(1); }
50% { transform: scale(1.15); }}
.gear { animation: rotate 10s linear infinite;}
@keyframes rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }}
.browser {animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
.triangle { animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
/* Solutions */
.solutions {margin-top: 70px;}
.solutions h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 36px;}
.solution-card { position: relative; width: 380px; height: 393px; border-radius: 25px; overflow: hidden; transition: all 0.5s ease; background-color: white; margin: 0 15px; flex-shrink: 0;}
.learn-more-bg { position: absolute; width: 249px; height: 96px; background-color: #163558; border-radius: 0px 90px 0px 25px; bottom: 0; left: 0; transition: all 0.5s ease; z-index: 1;}
.solution-card-content { position: relative; padding: 30px; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.solution-card-content h4 {font-family: "DM Sans", sans-serif; font-size: 30px; font-weight: 600; margin-top: 15px; margin-bottom: 50px;}
.web-design{color: #163558;}
.ui-ux{color: #2776EA;}
.product-design{color: #BB31D5;}
.graphic-design{color: #137173;}
.custom-software{color: #FF8800;}
.mobile-app{color: #02A0D2;}
.website-development{color: #00B5B2;}
.solution-card-content p { color: #000; margin-bottom: 30px;}
.solution-card-content a { display: flex; align-items: center; color: #fff; font-size: 19px; font-family: "Lato", sans-serif; text-decoration: none; width: fit-content; padding: 10px 0;}
.solution-card-content a:hover{color: #fff;}
.solution-card-content a i { margin-left: 5px;transition: transform 0.3s ease;}
.solution-card:hover .learn-more-bg { width: 100%; height: 100%; border-radius: 25px;}
.solution-card:hover .solution-card-content a i { transform: translateX(5px);}
.solution-card:hover .solution-card-content h4,
.solution-card:hover .solution-card-content p {color: white;}
.slider-section { position: relative; width: 100%; display: flex; align-items: center; justify-content: center;}
.slider-container { position: relative; overflow: hidden; width: 100%; max-width: 1260px;}
.slider-wrapper { display: flex; transition: transform 0.5s ease;}
.slider-btn { position: absolute; top: 50%; transform: translateY(-50%); background-color: #2776EA; color: white; border: none; width: 40px; height: 40px; border-radius: 50%; display: flex; justify-content: center; align-items: center; cursor: pointer; transition: all 0.3s ease; font-size: 20px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); z-index: 10;}
.slider-btn:disabled { background-color: #cccccc; cursor: not-allowed; transform: translateY(-50%); box-shadow: none;}
#prevBtn {left: -0px;}
#nextBtn {right: -0px;}
/* Success-stories */
.cases {margin-top: 100px;}
.cases h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;text-align: center;}
.cases p{text-align: center;}
.servicepro-case{display: flex; justify-content: center; margin-top: 50px;transition: all 0.5s ease;}
.servicepro-case-img{position: relative;}
.case-img{width: 940px;}
.case-content{position: absolute; left: 250px; transform: translateY(80px);}
.case-content h3{color: #fff; font-size: 30px; font-family: "DM Sans", sans-serif; font-weight: 600; text-align: left !important;}
.case-content h6{color: #fff; font-size: 24px; font-family: "DM Sans", sans-serif; font-weight: 500;padding-top: 50px;padding-right: 750px;}
.readmore-btn a{color: #fff; border-radius: 50px; border: 1px solid #fff; text-decoration: none; padding: 11px 23px; font-size: 17px; font-family: "Lato", sans-serif; font-weight: 500;}
.readmore-btn a:hover{color: #fff;}
.readmore-btn{margin-top: 50px;}
/* Why-choose-us */
.why-choose-bg{background-image: url(../images/blue-bg.jpg); overflow: hidden; background-repeat: no-repeat; background-size: cover; margin-top: 100px;background-attachment: fixed;}
.Why-choose-content{padding-top: 90px; color: #fff; padding-bottom: 90px;}
.Why-choose-content h1{font-size: 85px; font-family: "DM Sans", sans-serif; font-weight: bold;}
.why-choose-discription{font-family: "Lato", sans-serif; font-size: 30px; line-height: 43px; font-weight: 400;padding-top: 50px;padding-bottom: 20px;}
.Why-choose-content p{padding-right: 100px;}
.kpi{transform: translateX(180px);}
.kpi h4{font-size: 54px; font-family: "DM Sans", sans-serif; font-weight: bold; padding-top: 30px; }
.kpi span{font-size: 20px; font-family: "DM Sans", sans-serif; font-weight: 500;}
.kpi-years, .kpi-clients{padding-top: 30px;}
.kpi div {opacity: 0; transform: translateY(50px); transition: all 0.8s ease-out;}
.kpi.show div { opacity: 1; transform: translateY(0);}
.kpi div:nth-child(1) { transition-delay: 0.1s;}
.kpi div:nth-child(2) { transition-delay: 0.3s;}
.kpi div:nth-child(3) { transition-delay: 0.8s;}
/* Testimonial */
.testimonial{margin-top: 100px;}
.testimonial h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;text-align: center;}
.star-rating .star {cursor: pointer; font-size: 24px; color: orange;}
.testimonial .row{margin-top: 40px;}
.testimonial-card { background-color: #D9E9FF; border-radius: 10px; padding: 24px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); transition: all 0.3s ease; height: 100%;}
.testimonial-card:hover { transform: translateY(-4px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);}
.stars { color: #FDCC0D; font-size: 20px; margin-bottom: 12px;}
.testimonial-card p { margin-bottom: 20px;}
.testimonial-card .name { font-weight: 600; color: #000; margin-bottom: 4px;}
.testimonial-card .role { color: #6c757d; font-size: 14px;}
/* Clients */
.clients{margin-top: 100px;}
.clients h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;text-align: center;}
.clients .row{margin-top: 50px;align-items: center; justify-content: center;}
.clients img{width: 120px;}
.clients .col-lg-2{text-align: center;}
/* Faq */
.faq{margin-top: 100px;}
.faq h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;text-align: center;}
.faq-container { width: 70%; margin: auto; margin-top: 70px ;}
.faqs { background-color: white; color: black; border-radius: 15px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04); margin: 30px 0;}
.question { font-family: "DM Sans", sans-serif; font-size:20px; font-weight: 500; padding: 35px 35px 35px 35px; position: relative; display: flex; align-items: center; cursor: pointer;}
.question::after { content: "\002B"; font-size: 2.2rem; position: absolute; right: 35px; transition: 0.2s;}
.question.active::after { transform: rotate(45deg);}
.answercont { max-height: 0; overflow: hidden; transition: 0.3s;}
.answer {padding: 0 35px 35px;}
/* Footer */
.footer-bg{background-color: #000; margin-top: 100px;}
.footer{padding-top: 90px;}
.footer h1{font-family: "DM Sans", sans-serif; font-size:40px; font-weight:bold; color: white;padding-bottom: 30px;}
.footer .row{padding-top: 80px;}
.footer .row .col-lg-4 p{color: white;padding-top: 30px;padding-right: 30px;}
.footer h6{font-family: "DM Sans", sans-serif; font-size:20px; font-weight: 500; color: white;padding-bottom: 27px;}
.footer a{text-decoration: none;}
.services{transform: translateX(130px);}
.social-icons{transform: translateX(100px);}
.services p{padding-top: 0 !important;}
.footer i{font-size: 26px; text-decoration: none; color: white;}
.footer hr{color: white;margin-top: 40px; margin-bottom: 40px;}
.copyright p{text-align: center; color: white; margin-bottom: 0; padding-bottom: 40px;}
.seo-links a{color: #000 !important; font-size: 17px; font-family: "Lato", sans-serif;}
.seo-links a:hover{color: #000 !important;}
/* ...........................................About............................................... */
/* Banner */
.banner{margin-top: 80px; margin-bottom: 200px;}
.banner h6{font-size: 35px; font-family: "Gabarito", sans-serif; font-weight: 500;}
.banner h2{font-family: "Gabarito", sans-serif;font-size: 60px; font-weight: 500;padding-right: 250px;padding-bottom: 100px;padding-top: 70px;}
.about-sphere { top: 15%; left: 30%; animation-delay: 0s; }
.about-gear { top: 25%; right: 10%; width: 100px; animation-delay: 1s; }
.about-browser { bottom: 10%; left: 25%; width: 100px; animation-delay: 2s; }
.about-triangle { bottom: 15%; right: 25%; width: 100px; animation-delay: 3s; }
.about-sphere {animation: pulse 3s ease-in-out infinite;}
@keyframes pulse { 0%, 100% {transform: scale(1);}
50% {transform: scale(1.15);}}
.about-gear {animation: rotate 10s linear infinite;}
@keyframes rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }}
.about-browser {animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
.about-triangle {animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
/* Kpi */
.kpi-container{padding-top: 100px;}
.kpi-about{margin: 0 auto; justify-content: center;}
.kpi-about .col-lg-3{border-left: 1px solid#D9D9D9 ; padding-top: 0 !important; padding: 0 44px;}
.kpi-about h4{font-size: 54px; font-family: "DM Sans", sans-serif; font-weight: bold;}
.kpi-about span{font-size: 20px; font-family: "DM Sans", sans-serif; font-weight: 500;}
.kpi-container hr{color: #bcbcbc; margin-top: 60px;}
/* About */
.about{padding-top: 100px;}
.about-content {background-color: #F2F7FF;border-radius: 15px;}
.about-content h6{font-size: 20px; font-family: "DM Sans", sans-serif; font-weight: 500;}
.about-content h5 {font-size: 27px; font-family: "DM Sans", sans-serif; font-weight: 600;padding-top: 10px;}
.about-content p{padding-bottom: 30px;line-height: 1.7;}
.experience-badge { position: absolute; top: 57px; left: -79px; background-color: #2776EA; color: #fff; font-weight: 600;padding: 10px 25px; border-radius: 0 23px 0 23px; font-family: "DM Sans", sans-serif; box-shadow: 0 4px 10px rgba(0,0,0,0.1);}
/* Mission-story */
.mission-story{padding-top: 100px;}
.mission-story h2{font-size: 30px; font-family: "DM Sans", sans-serif;}
.mission-story p{padding-right: 40px;}
/* ...........................................Services............................................... */
/* Banner */
.services-hero{background-image: url(../images/banner-2-short.jpg);overflow: hidden; background-size: cover;}
.gear-services { top: 25%; right: 10%; width: 100px; animation-delay: 1s; }
.browser-services { top: 15%; left: 30%; animation-delay: 0s; }
.gear-services {animation: rotate 10s linear infinite;}
@keyframes rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }}
.browser-services {animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
/* Website-design */
.service-banner{margin-bottom: 120px;}
.left-side span{font-size: 20px; font-family: "DM Sans", sans-serif; border-radius: 30px; padding: 2px 13px; color: #fff;}
.left-side h3{font-size: 48px; font-family: "DM Sans", sans-serif; font-weight: bold;padding-top: 30px;padding-bottom: 30px}
.left-side p{padding-right: 80px;}
.tertiary-buttons{margin-top: 50px;margin-bottom: 35px;gap: 12px;}
.ui-ux-design, .product-design-service, .graphic-design-service, .custom-software-service, .app-development-service, .website-development-service{padding-top: 100px !important;}
/* ...........................................Website-design.......................................... */
/* Banner */
.web-design-banner{margin-top: 80px; margin-bottom: 40px !important;}
.image{ top: 25%; right: 10%; width: 100px; animation-delay: 1s; }
.code{ top: 70%; left: 50%; animation-delay: 0s; }
.image{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.code{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
/* Approach */
.approach h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;}
.approach h6{font-family: "DM Sans", sans-serif;font-size: 27px;font-weight: bold;padding-bottom: 15px;padding-top: 15px;}
.approach img{width:55px;}
.approach .row{padding-top: 20px;}
.approach .col-lg-3{padding: 30px 30px 10px 30px;}
.approach hr{margin-top: 50px; color: #b7b7b7;}
/* Challenge */
.challenge{margin-top: 100px;}
.challenge .row{gap: 50px;}
.challenge h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 10px;}
.challenge li{font-family: "Lato", sans-serif; font-size: 17px;line-height: 27px;padding-top: 10px; }
.challenge-content{padding-top: 30px;}
.challenge ul{padding-left: 17px;padding-top: 25px;}
/* What-you-get */
.what-you-get-bg{background-image: url(../images/blue-bg.jpg);margin-top: 100px; overflow: hidden;background-size: cover; color: #fff;background-attachment: fixed;}
.what-you-get h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-top: 90px;}
.what-you-get .row{gap: 120px;padding-bottom: 90px; padding-top: 20px;}
.check-list{padding-top: 20px;}
.check-list i{font-size: 35px;}
/* Works */
.works{margin-top: 100px;}
.works h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 60px;}
.project-card {position: relative; border-radius: 10px; border: 1px solid#D9D9D9; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);}
.project-img {position: relative;overflow: hidden;}
.project-img img {width: 100%;display: block;}
.hover-button {position: absolute; top: 85%; left: 50%; transform: translate(-50%, -50%) scale(0.9); opacity: 0; background: #fff; border: none; border-radius: 50px; padding: 10px 25px; font-weight: 600; font-size: 18px; display: flex; align-items: center; justify-content: center; gap: 400px; box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);transition: all 0.4s ease; }
.project-card:hover .hover-button { opacity: 1; transform: translate(-50%, -50%) scale(1);}
.project-img a{text-decoration: none; color: #000;}
.project-img a:hover{color: #000;}
.hover-button i {background: #007bff; color: #fff; border-radius: 50%; padding: 8px; display: flex;
align-items: center;justify-content: center;}
.project-card:hover .hover-img {opacity: 1;}
.project-content {padding: 30px;}
.project-tags {font-family: "Lato", sans-serif; display: inline-block; background: #F5F5F5; border: 1px solid#E0E0E0; border-radius: 25px; padding: 6px 16px; font-size: 15px; font-weight: 500; margin-bottom: 20px;}
.project-title {font-weight: 700; font-size: 40px;font-family: "DM Sans", sans-serif;}
.project-desc {font-family: "Lato", sans-serif; font-size: 17px; margin-top: 10px; line-height: 27px;}
.works hr{margin: 25px 0;color: #b2b0b0;}
.industry {margin-bottom: 5px;font-size: 17px;font-family: "Lato", sans-serif;}
.industry-type {font-weight: 600; font-size: 17px;font-family: "Lato", sans-serif;}
/* ...........................................UI/UX-design.......................................... */
/* Banner */
.uiux-design-banner{margin-top: 80px; margin-bottom: 70px !important;}
.ui-image{ top: 25%; right: 10%; width: 100px; animation-delay: 1s; }
.ui-code{ top: 70%; left: 50%; animation-delay: 0s; }
.ui-image{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.ui-code{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
/* Approach */
.ui-ux-approach h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.approach-card h5{font-size: 25px; font-weight: 500; font-family: "DM Sans", sans-serif;padding-bottom: 10px;}
.ui-ux-approach p{text-align: center; max-width: 553px; margin: 0 auto 60px; word-break: keep-all;}
.ui-ux-approach .row{ margin-top: 50px;}
.approach-card {background: #fff; border-radius: 20px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06), 0 2px 6px rgba(0, 0, 0, 0.04); padding: 40px 30px; margin-bottom: 30px; transition: all 0.3s ease; height: 292px;}
.approach-card:hover { transform: translateY(-8px); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);}
.icons {width: 70px;height: 70px;border-radius: 50%;margin: 0 auto 20px;display: flex;align-items: center;justify-content: center;}
.icons i {font-size: 30px;}
.icon-purple { background-color: #f5e6fb;color: #a22bc5;}
.icon-blue { background-color: #e3edff;color: #2f73e0;}
.icon-green { background-color: #d9f7f3; color: #00a58c;}
.icon-yellow {background-color: #ffefd4;color: #e78a00;}
/* What-you-get */
.what-you-get-ui{margin-top: 100px;}
.what-you-get-ui h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.what-you-get-ui span{font-size: 17px; font-family: "Lato", sans-serif; font-weight: 700; text-wrap: nowrap;}
.what-you-get-ui i{font-size: 22px; color: #2776EA; font-weight: 900;}
.what-you-get-ui hr{margin-left: 10px; transform: translateY(-40px); margin-bottom: 0;}
.what-you-get-ui-left p{padding-right: 150px;}
.what-you-get-ui-right p{padding-top: 10px;}
.what-you-get-ui-right .row{gap: 60px;}
/* ...........................................Product-design.......................................... */
/* Banner */
.product-design-banner{margin-top: 80px; margin-bottom: 60px !important;}
.graph{ top: 25%; right: 10%; width: 100px; animation-delay: 1s; }
.dashboard{ top: 60%; left: 30%; animation-delay: 0s; width: 100px;}
.graph{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.dashboard{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
/* Web & digital-applications */
.digital-applications h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;text-align: center; max-width: 650px; margin: 0 auto 60px; word-break: keep-all;}
.digital-applications hr{margin-top: 80px; color: #c2c2c2;}
/* Approach */
.product-design-approach{margin-top: 100px;}
.product-design-approach h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.product-design-approach p{padding-right: 50px;}
.approach-item img{background-color: #BB31D5; border-radius: 10px;padding: 10px; width: 60px; height: 60px;}
.approach-item h5{font-size: 23px; font-weight: 600;font-family: "DM Sans", sans-serif;padding-top: 5px; text-wrap: wrap;}
.approach-item p{padding-top: 25px;}
/* Challenge */
.product-design-challenge{margin-top: 100px;}
.product-design-challenge h3{padding-top: 0;font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.product-design-challenge li{font-family: "Lato", sans-serif; font-size: 17px;line-height: 27px;padding-top: 10px; }
.challenge-content{padding-top: 30px;}
.product-design-challenge ul{padding-left: 17px;padding-top: 25px;}
/* What-you-get */
.what-you-get-product{margin-top: 100px;}
.what-you-get-product h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.what-you-get-product p{padding-right: 578px;}
.what-you-get-product .row{padding-top: 50px; padding-left: 10px;}
.what-you-get-product .row .col-lg-4{border-left: 1px solid#E0E0E0; padding: 10px 36px;}
.what-you-get-product .row .col-lg-4 span{font-size: 25px; font-weight: bold;font-family: "Lato", sans-serif;}
.what-you-get-product .row .col-lg-4 h6{font-size: 23px; font-weight:600 ;font-family: "Lato", sans-serif;padding-top: 10px; padding-bottom:7px ;}
.what-you-get-product .row .col-lg-4 p{padding-right: 90px;}
/* ...........................................Graphic-design.......................................... */
/* Banner */
.graphic-design-banner{margin-top: 80px; margin-bottom: 60px !important;}
.bulb{ top: 40%; right: 10%; width: 100px; animation-delay: 1s; }
.pentool{ top: 20%; left: 30%; animation-delay: 0s; width: 100px;}
.bulb{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.pentool{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
/* Why-graphic-design */
.why-graphic-design h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;padding-top: 50px;}
.why-graphic-design p{padding-right: 30px;}
/* How-we-work */
.how-we-work{margin-top: 100px;}
.how-we-work h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;text-align: center;}
.how-we-work p{ text-align: center; max-width: 750px; margin: 0 auto 60px; word-break: keep-all;}
.work-box { margin: 0 auto; width: 1070px; background: #fff; border-radius: 10px; box-shadow: 0 8px 25px rgba(0,0,0,0.08);padding: 50px 60px;}
.timeline {position: relative;display: flex;flex-direction: column;}
.timeline::before {content: "";position: absolute;left: 25px;top: 10px;bottom: 44px;width: 2px;
background-color: #0f6156;}
.step {display: flex;position: relative;}
.divider {margin-top: 30px; margin-bottom: 10px; width: 823px; border-top: 1px solid #e6e6e6; margin-left: 89px;}
.icon-box {position: relative;z-index: 1;width: 50px;height: 50px;border-radius: 50%;background-color: #0f6156;display: flex;align-items: center;justify-content: center;color: #fff;font-size: 26px;flex-shrink: 0;margin-top: 10px;}
.content {padding-left: 40px;flex: 1;}
.content h5 {padding-top: 20px;font-size: 23px;font-family: "Lato", sans-serif;font-weight: 600;margin-bottom: 8px;}
.content p {padding-left: 40px;padding-top: 20px;margin-bottom: 0;text-align: left;}
/* What-you-get */
.what-you-get-graphic-bg{background-color: #164384;margin-top: 100px;color: white; background-image: url(../images/grid-white.png);background-repeat: no-repeat;overflow: hidden;}
.what-you-get-graphic h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;text-align: center;padding-top: 90px;}
.what-you-get-graphic .row {display: flex; justify-content: center; gap: 40px; padding-top: 35px;padding-bottom: 80px;}
.what-you-get-graphic p{text-align: center;max-width: 750px; margin: 0 auto 60px; word-break: keep-all; margin-bottom: 20px;}
.what-you-get-graphic .row p{text-align: left;}
/* Footer */
.graphic-design-footer{margin-top: 0 !important;}
/* ...........................................Custom-software.......................................... */
/* Banner */
.custom-software-banner{margin-top: 80px; margin-bottom: 60px !important;}
/* Custom-software-development */
.custom-software-development h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.custom-software-development p{padding-top: 20px;}
/* How-we-work */
.how-we-work-software{margin-top: 100px;}
.how-we-work-software h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.how-we-work-software p{padding-right: 400px;}
.how-we-work-software .row{padding-top: 50px; gap: 50px;}
.how-we-work-software .row p{padding-right: 0;}
.how-we-work-software .row .col-lg-3{background-color: #fff; border-radius: 10px; padding: 40px 31px 20px;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08); transition: all 0.3s ease;}
.how-we-work-software .row .col-lg-3:hover{box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
transform: translateY(-5px);}
.how-we-work-software .row .col-lg-3 i{background-color: #FF8800;padding: 13px; color: white;font-size: 30px;border-radius: 10px;}
.how-we-work-software .row .col-lg-3 h6{font-size: 23px; font-family: "DM Sans", sans-serif; font-weight: 600; padding-top: 30px;}
/* Challenge */
.software-challenge{margin-top: 100px;}
.software-challenge h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.challenge-box{ gap: 20px; padding-top: 20px;}
.challenge-box div{border-radius: 10px; padding: 12px 24px; background: #fff; z-index: 0; position: relative;}
.challenge-box div::before{content: ""; position: absolute; inset: 0; padding: 1px; border-radius: 10px; background: linear-gradient(90deg, #ffa726, #ff6b00); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude;pointer-events: none;}
.challenge-box p{margin-bottom: 0;}
/* ...........................................Mobile-app.......................................... */
/* Banner */
.app-banner{background-image: url(../images/grid.png); background-repeat: no-repeat;overflow: hidden; background-size: contain;}
.app-banner h6{font-size: 35px; font-family: "Gabarito", sans-serif; font-weight: 500;}
.app-banner h2{font-family: "Gabarito", sans-serif;font-size: 60px; font-weight: 500;padding-right: 250px;padding-top: 70px; padding-bottom: 52px;}
.mobile-app-service span{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;}
.app-code{ top: 40%; right: 10%; width: 100px; animation-delay: 1s; }
.app-image{ top: 20%; left: 30%; animation-delay: 0s; width: 100px;}
.app-code{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.app-image{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
/* How-we-build */
.how-we-build h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.how-we-build p{padding-right: 50px;}
.timeline-2 {position: relative;padding-left: 40px;}
.timeline-2::before { content: ""; position: absolute; left: 9px; top: 0; bottom: 115px; width: 2px; background: #00a6e3;}
.timeline-item { position: relative; margin-bottom: 40px; padding-left: 30px;}
.timeline-item::before { content: ""; position: absolute; left: -11px; top: 50px; width: 18px; height: 18px; border: 3px solid #00a6e3; background-color: #fff; border-radius: 50%; z-index: 1;}
.timeline-card { background-color: #EBFAFF; border-radius: 10px; box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.05); padding: 20px; transition: transform 0.3s ease, box-shadow 0.3s ease;}
.timeline-card:hover { transform: translateY(-5px); box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1);}
.timeline-card h5 { font-weight: 600; color: #0a0a0a; margin-bottom: 8px;font-size: 23px;}
.timeline-card p { margin: 0;}
/* Challenge */
.challenge h3{padding-top: 40px;}
/* What-you-get */
.what-you-get-app{background-color: #EBFAFF; border-radius: 30px;margin-top: 100px; padding: 70px 90px !important;}
.what-you-get-app .row{padding-top: 30px; gap: 130px;}
.what-you-get-app h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px; padding-right: 189px;padding-top:20px ;}
.what-you-get-app i{color: #02A0D2; font-size: 25px; font-weight: 800;}
.what-you-get-app .col-lg-5 p{padding-bottom: 20px;}
/* .........................................Website-development........................................ */
/* Banner */
.navbar .container-fluid{--bs-gutter-x: 0;}
.web-banner{margin-top: 80px; margin-bottom: 80px !important;}
.web-image{ top: 70%; right: 10%; width: 100px; animation-delay: 1s; }
.web-image{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.web-code{ top: 25%; left: 31%; animation-delay: 0s; }
.web-code{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
.web-development-service{padding-top: 0; padding-bottom: 30px;}
.web-development-service span{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;}
/* Why-website */
.why-website h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.feature-list { border-left: 1px solid#e6e6e6 !important;}
.feature-item { display: flex; align-items: flex-start; margin-bottom: 25px;}
.feature-item i { color: #00B5B2; font-size: 30px; margin-right: 15px; margin-top: 5px; flex-shrink: 0;}
.feature-item p { margin: 0;}
.feature-item strong {font-weight: 600;}
/* Development-process */
.process{margin-top: 100px;}
.process h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.process .row{ padding-top: 40px;}
.process-step {border-right: 1px solid #eee;padding: 20px 30px;}
.process-step:nth-child(3n) {border-right: none;}
.process-step span {font-family: "DM Sans", sans-serif;display: block;font-weight: 600;color: #7CAEF7;font-size: 23px;}
.process-step h5 {font-family: "DM Sans", sans-serif; font-size: 23px; font-weight: 600; color: #2776EA; margin: 10px 0;}
.process-step p { margin-bottom: 0; padding-right: 100px;}
/* ................................................Works............................................. */
/* Works */
.work-card { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 100px;}
.work-img { width: 90%; border-radius: 12px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05); margin-bottom: 25px; transition: transform 0.6s ease, box-shadow 0.6s ease; transform-origin: center;}
.work-card:hover .work-img { transform: scale(1.02); box-shadow: 0 18px 35px rgba(0, 0, 0, 0.12);}
.work-content h4 { font-family: "DM Sans", sans-serif; font-weight: 600; font-size:33px; padding-top: 20px; margin-bottom: 10px;}
.work-content h5 {font-family: "Lato", sans-serif; font-weight: 500; font-size: 25px; margin-bottom: 10px;}
.work-content p { margin-bottom: 0; padding-right: 55px;}
.right-column { margin-top: 200px !important;}
.work-card:last-child{margin-bottom: 0;}
/* ..............................................Case-study........................................... */
/* Banner */
.case-study-hero{background-image: url(../images/banner-2.jpg); background-size: cover; overflow: hidden;}
.case-study-banner{margin-bottom: 80px !important;}
.case-gear{ top: 50%; right: 10%; width: 100px; animation-delay: 1s; }
.case-gear{animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.case-browser{ top: 25%; left: 31%; animation-delay: 0s; }
.case-browser{animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
.case-studies img{width: 550px;}
/* Cases */
.case-studies h4{ font-family: "DM Sans", sans-serif; font-weight: 600; font-size:40px; padding-top: 20px; margin-bottom: 10px;}
.case-studies p{ padding-right: 35px; padding-bottom: 30px;}
.case-row-2{margin-top: 110px !important;}
/* ..............................................Contact........................................... */
/* Form */
.contact{margin-top: 80px;}
.contact h2{font-size: 60px; font-weight: bold; font-family: "DM Sans", sans-serif;}
.contact p{padding-bottom: 40px;}
.contact-block {margin-bottom: 50px;}
.contact-block h4 { font-weight: 600; font-size: 25px; margin-bottom: 25px; font-family: "Lato", sans-serif !important;}
input, textarea { font-family: "Lato", sans-serif !important; border: 1px solid #ddd; color: #555 !important; border-radius: 10px !important; padding: 15px 18px !important; font-size: 17px !important; width: 100%; outline: none; transition: border-color 0.3s ease, box-shadow 0.3s ease;}
input:focus, textarea:focus {box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05) !important;}
textarea {resize: none !important;}
.secondary-button button{text-decoration: none; font-size: 17px; color: #2776EA; font-weight: 500;border-radius:50px; border:2px solid#2776EA; padding:11px 35px; transition: all 0.3s ease; align-items: center; justify-content: center; box-shadow: 0 4px 10px rgba(163, 204, 248, 0.3); background-color: transparent; font-family: "Lato", sans-serif;margin-top: 30px;}
.secondary-button button:hover{box-shadow: 0 6px 15px rgba(0, 123, 255, 0.4); background: linear-gradient(90deg, #0066FF 0%, #00D4FF 100%); color: #fff; border: none;}
/* ..............................................Servicepro-case-study................................. */
/* Banner */
.servicepro-case-study-banner{margin-bottom: 115px;}
.servicepro-case-study-banner h2{padding-right: 327px; padding-bottom: 40px;}
.servicepro-service{padding-top: 0; padding-bottom: 30px;}
.servicepro-service span{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;}
/* About-the-project */
.about-the-project h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;text-align: center; padding-top: 90px;}
.about-the-project p{text-align: center; max-width: 788px; margin: 0 auto 60px; word-break: keep-all;}
/* Challenges */
.servicepro-case-challenges{margin-top: 100px;}
.servicepro-case-challenges h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.gradient-box { background: linear-gradient(90deg, #d7e6ff, #8edcff); padding: 22px 26px; border-radius: 16px; color: #000; font-size: 16px; line-height: 1.6;margin-top: 10px; transition: all 0.3s ease;}
.gradient-box:hover {transform: translateY(-6px);}
.gradient-box p{padding-right: 49px !important; margin-bottom: 0 !important;}
/* Our-solutions */
.our-solution{margin-top: 100px;}
.our-solution h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.customer-facing-website{padding-top: 40px;}
.our-solution p{padding-bottom: 40px;}
.our-solution h5{font-size: 35px; font-family: "DM Sans", sans-serif; font-weight: 500; padding-top: 70px;}
.our-solution ul{padding-left: 18px !important;}
.our-solution li{font-family: "Lato", sans-serif; font-size: 17px; padding-top: 20px;}
.our-solution-bg{background-color: #f8f8f8;}
.our-solution-bg .our-solution{padding-top: 80px; padding-bottom: 80px;}
/* Image */
.mobile-app-img{margin-top: 100px;}
/* Objectives */
.objectives{margin-top: 100px;}
.objectives h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.objectives i{ background: linear-gradient(135deg, #3a7bff, #11c7f4); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 50px; margin-bottom: 20px;}
.objectives .row{padding-top: 40px;}
/* ..............................................Auxbuild-case-study................................. */
/* Banner */
.auxbuild-case-study-bg{background: linear-gradient(90deg, #fff5df 0%, #fdf9e9 20%, #eefcff 60%, #d8f3ff 100%); padding-top: 80px;padding-bottom: 1px;}
.auxbuild-case-study-banner h6{font-size: 35px; font-family: "Gabarito", sans-serif; font-weight: 500;}
.auxbuild-case-study-banner h2{font-family: "Gabarito", sans-serif;font-size: 60px; font-weight: 500;padding-right: 250px;padding-top: 70px;}
.auxbuild-case-study-banner{margin-bottom: 115px;}
.auxbuild-case-study-banner h2{padding-right: 19px; padding-bottom: 40px;}
.auxbuild-service{padding-top: 0; padding-bottom: 30px;}
.auxbuild-service span{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;}
/* Challenges */
.auxbuild-challenges{margin-top: 100px;}
.auxbuild-challenges h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.challenge-list {list-style: none;padding: 0; margin-top: 50px;}
.challenge-list li { display: flex; align-items: flex-start; gap: 25px; margin-bottom: 19px; font-size: 17px; font-family: "Lato", sans-serif;}
.challenge-list li::before { content: "✦"; color: #ff9500; font-size: 30px; line-height: 1; margin-top: 2px;}
/* Our-solution */
.our-solution-auxbuild{margin-top: 100px;}
.our-solution-auxbuild h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.user-workforce{padding-top: 40px;}
.our-solution-auxbuild h5{font-size: 35px; font-family: "DM Sans", sans-serif; font-weight: 500; padding-top: 30px;}
.solution-list{list-style: none;padding: 0; margin-top: 30px;}
.solution-list li { display: flex; align-items: flex-start; gap: 25px; margin-bottom: 16px; font-size: 17px; font-family: "Lato", sans-serif;}
.solution-list li::before { content: "✦"; color: #ff9500; font-size: 30px; line-height: 1; margin-top: 2px;}
.our-solution p{padding-bottom: 0%;}
.our-solution-auxbuild-content{ margin-top: 100px !important;}
.our-solution-auxbuild-img{padding-top: 30px;}
.our-solution-auxbuild-content-2{padding-top: 20px}
/* Objectives */
.auxbuild-objectives{background-color: #FFF3E4; background-repeat: no-repeat; background-size: cover;margin-top: 100px;padding: 100px 90px !important; border-radius: 30px; padding-bottom: 70px !important;}
.auxbuild-objectives h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.auxbuild-objectives .row{gap: 120px;}
.objectives-list{list-style: none;padding: 0; margin-top: 30px;}
.objectives-list li { display: flex; align-items: flex-start; gap: 25px; margin-bottom: 35px; font-size: 17px; font-family: "Lato", sans-serif;}
.objectives-list li::before { content: "✦"; color: #ff9500; font-size: 30px; line-height: 1; margin-top: 2px;}
/* ..........................................Humanitz-case-study....................................... */
/* Banner */
.humanitz-case-study-banner h6{font-size: 35px; font-family: "Gabarito", sans-serif; font-weight: 500;}
.humanitz-case-study-banner h2{font-family: "Gabarito", sans-serif;font-size: 60px; font-weight: 500;padding-top: 70px; padding-bottom: 40px;}
.humanitz-case-study-banner{margin-bottom: 30px; margin-top: 80px;}
.humanitz-service{padding-top: 0; padding-bottom: 30px;}
.humanitz-service span{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;}
/* Challenges */
.humanitz-case-challenges{margin-top: 100px;}
.humanitz-case-challenges h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 40px;}
.challenge-item { display: flex; flex-direction: column; gap: 15px;}
.humanitz-challenge-icon { width: 22px; height: 22px; border-radius: 4px; flex-shrink: 0;}
/* Solutions */
.our-solution-humantiz{margin-top: 100px;}
.our-solution-humantiz h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.our-solution-humantiz h5{font-size: 35px; font-family: "DM Sans", sans-serif; font-weight: 500; padding-top: 30px;}
.humantiz-list{list-style: none;padding: 0; margin-top: 30px;}
.humantiz-list li { display: flex; align-items: flex-start; gap: 25px; margin-bottom: 16px; font-size: 17px; font-family: "Lato", sans-serif;}
.humantiz-list li::before { content: "✦"; color: #1C519F; font-size: 30px; line-height: 1; margin-top: -3px;}
.employees-app-content{padding-top: 50px;}
.management-web-portal-img{padding-top: 70px; padding-bottom: 70px;}
.our-solution-humantiz-content{padding-top: 80px;}
/* Image */
.humantiz-img{margin-top: 100px;}
/* Objectives */
.humantiz-objectives{background-color: #E4ECF5; background-repeat: no-repeat; background-size: cover;margin-top: 100px;padding: 100px 90px !important; border-radius: 30px; padding-bottom: 70px !important;}
.humantiz-objectives h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.humantiz-objectives .row{gap: 120px;}
.humantiz-objectives-list{list-style: none;padding: 0; margin-top: 30px;}
.humantiz-objectives-list li { display: flex; align-items: flex-start; gap: 25px; margin-bottom: 35px; font-size: 17px; font-family: "Lato", sans-serif;}
.humantiz-objectives-list li::before { content: "✦"; color: #1C519F; font-size: 30px; line-height: 1; margin-top: 2px;}
/* ........................................Stayoffers-case-study...................................... */
/* Banner */
.stayoffers-case-study-banner h6{font-size: 35px; font-family: "Gabarito", sans-serif; font-weight: 500;}
.stayoffers-case-study-banner h2{font-family: "Gabarito", sans-serif;font-size: 60px; font-weight: 500;padding-top: 70px; padding-bottom: 40px;}
.stayoffers-case-study-banner{margin-bottom: 30px; margin-top: 80px;}
.stayoffers-service{padding-top: 0; padding-bottom: 30px;}
.stayoffers-service span{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;}
/* Challenges */
.stayoffers-case-challenges{margin-top: 100px;}
.stayoffers-case-challenges h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 14px;}
.stayoffers-case-challenges .row {background-color: #F3F3F4; border-radius: 30px;}
.stayoffers-case-challenges .col-lg-6:first-child{padding-left: 0; padding-right: 0;}
.stayoffers-case-challenges-content{padding-top: 60px;}
.stayoffers-case-challenges-content ul{padding-left: 20px; font-family: "Lato", sans-serif; font-size: 17px; line-height: 27px; padding-right: 50px;}
.stayoffers-case-challenges-content li{padding-top: 15px;}
/* Solutions */
.tour-package-content{padding-top: 40px;}
.stayoffers-our-solution h5{font-family: "DM Sans", sans-serif;font-size: 40px;font-weight: 500;}
.stayoffers-our-solution ul{padding-left: 20px;font-family: "Lato", sans-serif; font-size: 17px;}
.stayoffers-our-solution li{padding-top: 20px;}
.tour-plan-content{padding-top: 149px;}
.stayoffers-our-solution-bg{background-color: #f8f8f8; margin-top: 60px;}
.stay-package{padding-top: 50px;}
.stay-pacakge-content{padding-top: 60px;}
/* Objectives */
.stayoffers-objectives{margin-top: 100px;}
.stayoffers-objectives h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px;}
.stayoffers-objectives .row{gap: 25px; padding-top: 20px;}
.stayoffers-objectives .col{background-color: #F3F3F3; border-radius: 30px; padding: 30px 20px 30px 30px; transition: 0.3s;}
.stayoffers-objectives .col:hover{transform: translateY(-4px);}
.stayoffers-objectives .col h6{font-family: "DM Sans", sans-serif;font-size: 30px;font-weight: 600;padding-bottom: 18px;}
/* ..........................................Web-design-landing-page.................................... */
/* Why-choose-us */
.Why-choose-content-2{padding-top: 90px; padding-bottom: 34px;}
.Why-choose-content-2 h3{font-size:48px; font-family: "DM Sans", sans-serif; font-weight: bold;padding-bottom: 18px;}
.Why-choose-content-2 h5{font-family: "Lato", sans-serif; font-size: 23px; line-height: 43px; font-weight: 400;padding-bottom: 20px;}
.Why-choose-content-2 p{padding-right: 100px;}
.kpi-2 h4{font-size: 54px; font-family: "DM Sans", sans-serif; font-weight: bold; padding-top: 30px; }
.kpi-2 span{font-size: 20px; font-family: "DM Sans", sans-serif; font-weight: 500;}
.kpi-2 .col-lg-3 {opacity: 0; transform: translateY(50px); transition: all 0.8s ease-out;}
.kpi-2.show .col-lg-3 { opacity: 1; transform: translateY(0);}
.kpi-2 .col-lg-3:nth-child(1) { transition-delay: 0.1s;}
.kpi-2 .col-lg-3:nth-child(2) { transition-delay: 0.3s;}
.kpi-2 .col-lg-3:nth-child(3) { transition-delay: 0.8s;}
/* Core-services */
.learn-more-bg-2 { position: absolute; width: 0; height: 0; background-color: #163558; border-radius: 0px 90px 0px 25px; bottom: 0; left: 0; transition: all 0.5s ease; z-index: 1;}
.solution-card:hover .learn-more-bg-2 { width: 100%; height: 100%; border-radius: 25px;}
.web-design-solutions .solution-card{margin: 0;}
/* Works */
.digital-transformations{margin-top: 100px;}
.digital-transformations h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 50px;}
/* Serving all of UAE */
.serving-all{margin-top: 100px;}
.serving-all h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px; text-align: center;}
.key-tags{padding-top: 20px; text-align: center;}
.key-tag a{font-family: "Lato", sans-serif; font-size: 17px;border-radius: 30px; border: 1px solid#000; padding: 10px 23px;margin-right: 20px;text-decoration: none; color: #000;}
.key-tag a:hover{box-shadow: 0 6px 15px rgba(0, 123, 255, 0.4); background: linear-gradient(90deg, #0066FF 0%, #00D4FF 100%); color: #fff; border: none;}
/* Pricing */
.pricng{margin-top: 100px;}
.pricng h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 18px; text-align: center;}
.pricng .row{margin-top: 14px;}
.price-card { border: 1px solid #e4e9f2; padding: 30px; border-radius: 20px; background: #fff; height: 100%; transition: 0.3s;}
.price-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.08);}
.price-card h6 { font-size: 25px; font-weight: 600; font-family: "DM Sans", sans-serif; margin: 0;}
.price-card p { font-size: 15px; color: #555; margin-bottom: 15px;}
.price-card span { font-family: "DM Sans", sans-serif; background: #e6f0ff; color: #2776EA; padding: 6px 10px; border-radius: 5px; font-size: 20px; font-weight: 600;}
.features-row { display: flex; gap: 30px;}
.features-row ul { padding: 0; margin: 0; list-style: none;}
.features-row ul li { font-family: "Lato", sans-serif; font-size: 15px; color: #333; margin-bottom: 12px; padding-left: 25px; position: relative;}
.features-row ul li::before { content: "✔"; position: absolute; left: 0; top: 0; color: #2d8cff; font-size: 14px;}
.starter-website .features-row{margin-bottom: 20px;}
.business-website .features-row{margin-bottom: 7px;}
.ecommerce-website .features-row{ margin-bottom: 54px;}
.custom-website .features-row{margin-bottom: 20px;}
.btn-cta { width: 100%; background: #2776EA; border: none; padding: 12px; border-radius: 30px; font-size: 17px; color: #fff; font-weight: 600; transition: 0.3s;}
.btn-cta:hover {background: transparent; color: #2776EA; border: 1px solid #2776EA;}
.business-website .price-card{background-color: #E7F0FD; border:1px solid #2776EA;}
.modal-header{border-bottom: 0 !important; padding-bottom: 5px !important;}
.modal-header h1{font-family: "Lato", sans-serif !important; font-size: 25px !important; font-weight: 600 !important;}
.modal-sub{padding: 0 0 0 16px;}
.modal-sub p{font-family: "Lato", sans-serif !important; font-size: 17px !important; color: #000 !important;}
.modal-body form::placeholder{font-size: 17px !important; font-family: "Lato", sans-serif !important; color: #555555 !important;}
.modal-body form .form-control{border: 1px solid #E7E7E7 !important;}
.modal-footer{border-top:0 !important; padding-top: 0 !important;}
.btn-primary{background-color: #2776EA !important; border-radius: 30px !important; padding: 7px 20px !important;}
.modal-content{padding: 4px !important;}
.custom-select{ border-radius: 10px !important; border: 1px solid #E7E7E7 !important; padding: 15px 18px !important; font-size: 17px !important; font-family: "Lato", sans-serif !important; color: #555555!important; background-color: #fff; box-shadow: none;}
.custom-select:focus{ box-shadow: none !important;}
/* ..................................It-company-malappuram-landing-page.............................. */
/* Banner */
.it-company-banner{background-image: url(../images/banner-2.jpg); background-size: cover; overflow: hidden;}
.sphere-2 { top: 10%; left: 30%; animation-delay: 0s; width: 80px;}
.gear-2 { top: 25%; right: 10%; width: 80px; animation-delay: 1s; }
.browser-2 { bottom: 25%; left: 25%; width: 80px; animation-delay: 2s; }
.triangle-2 { bottom: 25%; right: 25%; width: 80px; animation-delay: 3s; }
.sphere-2 {animation: pulse 3s ease-in-out infinite;}
@keyframes pulse { 0%, 100% {transform: scale(1);}
50% {transform: scale(1.15);}}
.gear-2 {animation: rotate 10s linear infinite;}
@keyframes rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }}
.browser-2 {animation: bounce 3s ease-in-out infinite;}
@keyframes bounce {
0%, 100% { transform: translateY(0); opacity: 1; }
50% { transform: translateY(-10px); opacity: 0.8; }}
.triangle-2 {animation: rotatePulse 3s ease-in-out infinite;}
@keyframes rotatePulse {
0%, 100% { transform: rotate(0deg) scale(1); }
50% { transform: rotate(10deg) scale(1.1); }}
.it-company-hero{margin-bottom: 50px;}
/* ..................................Malappuram-web-design-company.............................. */
/* Malappuram-company */
.malappuram-company{margin-top: 100px;}
.malappuram-company h3{font-family: "DM Sans", sans-serif;font-size: 48px;font-weight: bold;padding-bottom: 40px; text-align: center;}
/* /////////////////////////////////////////////RESPONSIVE////////////////////////////////////////// */
/* Home */
@media (min-width:1200px) and (max-width:1399.98px){
.banner h1{font-size: 69px;}
.browser { bottom: -2% !important;}
.Why-choose-content h1{font-size: 76px;}
.case-content{left: 150px; transform: translateY(80px);}
.case-content h6{padding-right: 600px;padding-top: 28px;}
.services{transform: translateX(100px);}
.social-icons{transform: translateX(150px);}
}
@media (min-width:992px) and (max-width:1199.98px){
.nav-item .dropdown-menu{transform: translateX(-38%) !important;}
.banner{margin-bottom: 129px;}
.banner h1{font-size: 61px;}
.browser { bottom: 5% !important;width: 90px;}
.sphere{width: 80px;}
.solutions h3, .cases h3, .testimonial h3, .clients h3, .faq h3{font-size: 43px;margin-bottom: 0;padding-bottom: 47px;}
.cases h3{padding-bottom: 18px;}
.case-content{left: 60px; transform: translateY(80px);}
.case-content h6{padding-right: 550px;padding-top: 28px;}
.Why-choose-content h1{font-size: 65px;}
.why-choose-discription{ font-size: 26px;}
.Why-choose-content p{padding-right: 27px;}
.testimonial h3{padding-bottom: 10px;}
.testimonial .row{ margin-top: 15px;}
.clients h3, .faq h3{padding-bottom:0;}
.clients .row{margin-top: 31px;}
.faq-container{width: 87%;}
.services{transform: translateX(70px);}
}
@media (min-width:768px) and (max-width:991.98px){
.navbar {position: relative; z-index: 1000; padding: 15px 20px;}
.navbar-nav li{padding: 9px 20px;}
.navbar-collapse {position: relative; background: #fff; width: 100%; border-radius: 12px; margin-top: 10px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);}
.navbar-toggler { border: none; background: none;}
.navbar-toggler:focus { box-shadow: none;}
.primary-button-md {width: 100%; margin-top: 20px;margin-left: 22px;margin-bottom:30px;}
.nav-item .dropdown-menu{transform: translateX(-1%) !important;}
.banner h1{padding-right: 0; font-size: 59px;}
.sphere {top: 18%; left: 30%; width: 80px; }
.gear {top: 25%; right: 10%; width: 80px;}
.browser {bottom: 5%; left: 30%; width: 80px;}
.triangle {bottom: 15%; right: 25%; width: 80px;}
.solutions{margin-top: 57px;}
.solutions h3, .cases h3, .testimonial h3, .clients h3, .faq h3{font-size: 43px;margin-bottom: 0;padding-bottom: 47px;}
.solution-card{width: 320px !important;}
.cases h3{padding-bottom: 10px;}
.case-content{left: 40px; transform: translateY(70px);}
.case-content h3{font-size: 35px ;}
.case-content h6{padding-right: 400px;padding-top: 8px; font-size: 20px;}
.Why-choose-content h1{font-size: 65px;}
.why-choose-discription{ font-size: 26px; padding-top: 27px;}
.Why-choose-content p{padding-right: 27px;}
.kpi{display:flex ; transform: translateX(0px); gap: 40px;}
.kpi-years, .kpi-clients{padding-top:0;}
.testimonial h3, .clients h3, .faq h3{padding-bottom: 0;}
.faq-container{width: 95%;}
.services{transform: translateX(40px);}
.social-icons{transform: translateX(30px);}
}
@media (min-width:576px) and (max-width:767.98px){
.navbar {position: relative; z-index: 1000; padding: 15px 20px;}
.navbar-nav li{padding: 9px 20px;}
.navbar-collapse {position: relative; background: #fff; width: 100%; border-radius: 12px; margin-top: 10px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);}
.navbar-toggler { border: none; background: none;}
.navbar-toggler:focus { box-shadow: none;}
.primary-button-md {width: 100%; margin-top: 20px;margin-left: 22px;margin-bottom:30px;}
.nav-item .dropdown-menu{transform: translateX(-1%) !important; width: 459px;}
.dropdown-grid {grid-template-columns: repeat(1, 1fr);}
.banner{margin-bottom: 100px;}
.banner h1{padding-right: 0; font-size: 45px;}
.sphere {top: 14%; left: 30%; width: 60px; }
.gear {top: 17%; right: 10%; width: 60px;}
.browser {bottom: 25%; left: 40%; width: 60px;}
.triangle {bottom: 45%; right: 25%; width: 60px;}
.solutions h3, .cases h3, .testimonial h3, .clients h3, .faq h3{font-size: 33px;margin-bottom: 0;padding-bottom: 47px;}
.solution-card{width: 400px !important;}
.cases h3{padding-bottom: 10px;}
.case-content{left: 30px; transform: translateY(35px);}
.case-content h3{font-size: 25px !important;}
.case-content h6{padding-right: 280px;padding-top: 8px; font-size: 18px;}
.Why-choose-content h1{font-size: 65px;}
.why-choose-discription{ font-size: 26px; padding-top: 27px;}
.Why-choose-content p{padding-right: 27px;}
.kpi{display:flex ; transform: translateX(0px); gap: 40px;}
.kpi-years, .kpi-clients{padding-top:0;}
.testimonial h3, .clients h3, .faq h3{padding-bottom: 0;}
.testimonial .row{ margin-top: 15px;}
.faq-container{width: 95%;}
.question{font-size: 17px;padding: 29px;}
.answer{padding-left:29px ;}
.services{transform: translateX(0);}
.social-icons{transform: translateX(0);}
.footer h6{margin-bottom: 0; padding-top: 30px; padding-bottom: 16px;}
.services a p{margin-bottom: 8px;}
}
@media (min-width:0) and (max-width:575.98px){
.remove-aos-mobile { opacity: 1 !important; transform: none !important; overflow: visible !important; height: auto !important;}
.hero .container{padding-left: 0 !important; padding-right: 0 !important;}
.default-navbar{ display: none !important;}
.mobile-navbar { position: relative; z-index: 1200;}
.mobile-header { display: flex; align-items: center; justify-content: space-between; padding: 15px 10px;}
.mobile-menu-btn {background: none;border: none;font-size: 30px; color: #000;cursor: pointer;}
.mobile-menu-overlay { position: fixed; top: 0; left: 0; width: 0; height: 100vh; background: rgba(0, 0, 0, 0.4); opacity: 0; transition: all 0.3s ease; z-index: 1040;}
.mobile-menu-overlay.active { width: 100%; opacity: 1;}
.mobile-menu { position: fixed; top: 0; left: -100%; width: 100%; height: 100vh; background: #fff; z-index: 1050; padding: 50px 30px 40px; transition: all 0.4s ease; overflow-y: auto; border-radius: 0;}
.mobile-menu.active {left: 0;}
.mobile-menu .close-btn { position: absolute;top: 25px; right: 25px; background: none; border: none; font-size: 26px; color: #000; cursor: pointer;}
.mobile-nav { list-style: none;padding: 0; margin: 0; }
.mobile-nav li { margin-bottom: 20px;}
.mobile-nav a { text-decoration: none;font-family: "Lato", sans-serif; color: #000; display: block; transition: 0.3s;}
.mobile-nav a:hover {color: #2776EA;}
.mobile-dropdown.active .mobile-dropdown-menu {display: block;}
.nav-item .dropdown-menu{left:0 !important; width: 100vw !important;}
.navbar {position: relative; z-index: 1000; padding: 15px 20px;}
.navbar-nav li{padding: 9px 20px;}
.service-item .icon{margin-bottom: 10px; width: 40px; height: 40px;}
.service-item .icon i{ font-size: 25px;}
.primary-button-md {width: 100%; margin-top: 20px;margin-left: 22px;margin-bottom:30px;}
.primary-button-md a{padding: 11px 21px;}
.nav-item .dropdown-menu{transform: translateX(-8%) !important; width: 251px;}
.dropdown-grid {grid-template-columns: repeat(1, 1fr);}
.banner{margin-bottom: 44px;}
.banner h1{padding-right: 0; font-size: 35px;}
.sphere {display: none;}
.gear {top: 10%; right: 10%; width: 60px;}
.browser {bottom: 32% !important; left: 54%; width: 60px;}
.triangle {display: none;}
.banner{margin-top: 49px;}
.solution-card{height: 350px;}
.solution-card-content {padding: 20px;}
.solution-card-content h4 {font-size: 22px;margin-bottom: 20px;}
.slider-btn {width: 35px;height: 35px;}
.solutions{margin-top: 12px;}
.solutions h3, .cases h3, .testimonial h3, .clients h3, .faq h3{font-size: 26px;margin-bottom: 0;padding-bottom: 37px;}
.cases, .testimonial, .clients{margin-top: 65px;}
.learn-more-bg{width: 200px;}
.cases h3, .testimonial h3{padding-bottom: 20px;}
.servicepro-case{display: none;}
.cases-mobile-view{display: block;}
.cases-mobile-view div{padding-bottom: 30px;}
.cases-buttons{display: flex; flex-direction: column;align-items: center;}
.Why-choose-content h1{font-size: 40px;}
.why-choose-discription{ font-size: 20px; padding-top: 27px; line-height: 31px;}
.Why-choose-content p{padding-right:0;}
.kpi{transform: translateX(0px);}
.kpi h4{font-size: 40px;}
.kpi-years, .kpi-clients{padding-top: 15px;}
.testimonial .row{margin-top: -1px;}
.testimonial h3{text-wrap: nowrap;}
.clients .row{margin-top: 38px;display: grid; grid-template-columns: repeat(2, 1fr);}
.clients img{width: 90px;}
.clients .row .col-lg-2{ justify-content: center; align-items: center; text-align: center;}
.faq{margin-top: 77px;}
.faq-container{width: 100%;margin-top:0;}
.faq h3{padding-bottom:20px;}
.answer{padding-left:20px ; padding-bottom: 10px;}
.question{font-size: 17px;padding: 20px;text-wrap: balance;}
.question::after {right: 12px; top: 7px;}
.footer-bg{ margin-top: 80px;}
.services{transform: translateX(0);}
.social-icons{transform: translateX(0);}
.footer h6{margin-bottom: 0; padding-top: 30px; padding-bottom: 16px;}
.services a p{margin-bottom: 8px;}
}
/* About */
@media (min-width:1200px) and (max-width:1399.98px){
.banner{ margin-bottom: 56px;}
.about-sphere { top: 15%; left: 30%; animation-delay: 0s; width: 80px;}
.about-gear { top: 25%; right: 10%; width: 80px; animation-delay: 1s; }
.about-browser { bottom: 10%; left: 32%; width: 80px; animation-delay: 2s; }
.about-triangle { bottom: 15%; right: 25%; width: 80px; animation-delay: 3s; }
.about-content p{margin-bottom: 0;padding-bottom: 0;}
.about-content h6{margin-top:0 !important;}
.about-content h5{margin-bottom: 10px !important;}
.experience-badge{top: 10px;}
.solution-card{width: 328px; height: 379px;}
.solution-card-content a{padding: 5px 0px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.banner h2{ font-size: 50px; padding-bottom: 0;}
.about-sphere { top: 15%; left: 30%; animation-delay: 0s; width: 80px;}
.about-gear { top: 25%; right: 10%; width: 80px; animation-delay: 1s; }
.about-browser { bottom: 10%; left: 25%; width: 80px; animation-delay: 2s; }
.about-triangle { bottom: 15%; right: 25%; width: 80px; animation-delay: 3s; }
.kpi-about span{ text-wrap: nowrap;}
.about-content p{margin-bottom: 0;padding-bottom: 0;}
.about-content h6{margin-top:0 !important;}
.about-content h5{margin-bottom: 10px !important;}
.experience-badge{ position: static;display: inline-block;margin-top: 15px;}
.about-image{transform: translateY(-35px);}
.solutions h3{font-size: 43px !important;}
.solution-card{width: 273px !important; height: 346px !important;}
.learn-more-bg{ width: 231px; height: 81px;}
.solution-card-content h4{ font-size: 23px; margin-bottom: 18px;}
.solution-card-content a{ padding: 0;}
}
@media (min-width:768px) and (max-width:991.98px){
.navbar{padding-top: 15px !important;}
.mobile-navbar {display: none !important;}
.banner h2{ font-size: 41px;padding-right: 0; padding-bottom: 47px !important;}
.about-sphere { top: 15%; left: 30%; animation-delay: 0s; width: 80px;}
.about-gear { top: 25%; right: 10%; width: 80px; animation-delay: 1s; }
.about-browser { bottom: 10%; left: 25%; width: 80px; animation-delay: 2s; }
.about-triangle { bottom: 15%; right: 25%; width: 80px; animation-delay: 3s; }
.kpi-container{padding-top: 0;}
.kpi-about span{ font-size: 17px; text-wrap: nowrap;}
.kpi-container .row{gap: 0 !important; align-items: center; margin: 0 auto;}
.kpi-about .col-lg-3{padding: 0; border-left: 0;}
.kpi-container hr{ margin-top: 44px;}
.about{ padding-top: 66px;}
.about-content p{padding-bottom: 0;}
.about-image img{width: 100%;}
.experience-badge{top: -37px;left: 223px;}
.mission-story p{padding-right: 0;}
.about-services{display: grid; grid-template-columns: repeat(2, 1fr);}
.about-services .py-5{padding-top: 0 !important; padding-bottom: 0 !important;}
.about-services .col-lg-4{padding-bottom: 30px;}
}
@media (min-width:576px) and (max-width:767.98px){
.navbar{padding-top: 15px !important;}
.mobile-navbar {display: none !important;}
.banner h2{ font-size: 33px; padding-right: 0; padding-bottom: 14px; padding-top: 30px;}
.banner h6{ font-size: 24px;}
.about-sphere { top: 15%; left: 30%; animation-delay: 0s; width: 70px;}
.about-gear { top: 25%; right: 10%; width: 70px; animation-delay: 1s; }
.about-browser {bottom: 27%; left: 7%; width: 70px; animation-delay: 2s; }
.about-triangle {bottom: 34%; right: 17%; width: 70px; animation-delay: 3s; }
.kpi-container{ padding-top: 69px;}
.kpi-about span{ font-size: 17px; text-wrap: nowrap;}
.kpi-container .row{gap: 0 !important; align-items: center; margin: 0 auto;}
.kpi-about .col-lg-3{padding: 0; border-left: 0;}
.kpi-container hr{ margin-top: 44px;}
.about{ padding-top: 66px;}
.about-content p{padding-bottom: 0;}
.about-image img{width: 100%;}
.experience-badge{top: -37px;left: 150px;}
.about-services .col-lg-4{padding-left: 0 !important;padding-bottom: 20px;}
.mission-story .border-start{border-left: 0 !important;}
.about-services .py-5{padding-top: 0 !important; padding-bottom: 0 !important;}
}
@media (min-width:0) and (max-width:575.98px){
.banner h2{ font-size: 30px;padding-right: 0; padding-top: 26px;padding-bottom: 18px;}
.banner h6{ font-size: 24px;}
.about-gear { top: 15%; right: 10%; width: 71px; animation-delay: 1s; }
.about-browser { bottom: 37%; left: 27%; width: 65px; animation-delay: 2s; }
.about-triangle {display: none;}
.about-sphere {display: none;}
.kpi-container, .about, .mission-story{padding-top: 60px;}
.about-content p{padding-bottom: 0;}
.experience-badge{top: -37px;left: 45px;}
.mission-story h2{font-size: 26px;}
.mission-story p{padding-right: 0;}
.about-services .col-lg-4{padding-left: 0 !important;padding-bottom: 20px;}
.about-services .py-5{padding-top: 0 !important; padding-bottom: 0 !important;}
.learn-more-bg{ height: 77px;}
.solution-card-content a{ padding: 5px 0;}
.about-services .solution-card{width: 96% !important;}
}
/* Services */
@media (min-width:992px) and (max-width:1199.98px){
.browser-services{top: 20%; width: 70px;}
.gear-services {width: 70px;}
.left-side h3{font-size: 43px;margin-bottom: 0;}
.website-development-service{padding-top: 60px !important;}
}
@media (min-width:768px) and (max-width:991.98px){
.service-banner{margin-bottom: 0 !important;}
.browser-services{top: 20%; width: 80px;}
.gear-services { top: 50%;width: 80px;}
.left-side{padding-top: 30px;}
.left-side h3{font-size: 43px;padding-bottom: 18px;}
.right-side img{width: 100%;}
.right-side{order: 1;}
.left-side{order: 2;}
.app-development-service{padding-top: 60px !important;}
.website-development-service{padding-top: 60px !important;}
}
@media (min-width:576px) and (max-width:767.98px){
.browser-services{top:15%; width: 65px; left: 20px;}
.gear-services {top: 42%;width: 65px;}
.left-side h3{font-size: 33px; padding-bottom: 3px; padding-top: 23px;}
.right-side img{order: 1;}
.left-side{order: 2;}
.left-side{padding-top: 30px;}
.app-development-service{padding-top: 60px !important;}
.website-development-service{padding-top: 60px !important;}
}
@media (min-width:0) and (max-width:575.98px){
.browser-services{top:18%; width: 60px; left: 129px;}
.gear-services { top: 38%;width: 56px;}
.website-design{padding-top: 30px;}
.ui-ux-design, .product-design-service, .graphic-design-service, .custom-software-service{padding-top: 90px;}
.app-development-service{padding-top: 50px !important;}
.website-development-service{padding-top: 50px !important;}
.left-side{order: 2; padding-top: 20px;}
.left-side h3{font-size: 26px; padding-bottom: 3px; padding-top: 23px;}
.left-side p{padding-right: 0 !important;}
.left-side span{ font-size: 16px;}
.right-side img{order: 1;}
.tertiary-button a{ font-size: 15px; padding: 9px 19px;}
.tertiary-buttons{margin-bottom: 20px;display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 37px;}
.tertiary-buttons .tertiary-button{margin-bottom: 10px;}
.website-development-service .tertiary-buttons{display: flex; flex-direction: column;}
}
/* Website-design */
@media (min-width:1200px) and (max-width:1399.98px){
.banner h2{padding-right: 0;}
.image{ top: 20%; right: 10%; width: 100px; animation-delay: 1s; }
.code{ top: 70%; left: 60%; animation-delay: 0s; }
.bnx .hover-button{gap: 363px !important;}
.servicepro .hover-button{gap: 307px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.approach{margin-top: 78px;}
.approach .col-lg-3{ padding: 30px 10px 10px 20px;}
.approach h3, .challenge h3, .what-you-get h3, .works h3{font-size: 43px}
.banner h2{padding-right: 0;}
.image{ top: 20%; right: 10%; width: 100px; animation-delay: 1s; }
.code{ top: 74%; left: 48%; animation-delay: 0s; }
.approach h6{ font-size: 22px;}
.challenge-content{padding-top: 0;}
.challenge ul{padding-top: 0;}
.what-you-get .row{gap: 96px;}
.works h3{padding-bottom: 40px;}
.bnx .hover-button{gap: 285px !important;}
.servicepro .hover-button{gap: 234px;}
.project-desc{font-size: 15px;}.project-title{font-size: 33px;}
}
@media (min-width:768px) and (max-width:991.98px){
.web-design-banner{margin-bottom: 0 !important;}
.approach .border-end{border-right: 0 !important;}
.approach .col-lg-3{padding: 30px 30px 10px 15px;}
.approach h3{font-size: 43px;}
.border-end{border-right:none !important;}
.challenge h3{padding-top:0 !important;}
.challenge img{width: 100%;}
.challenge ul{padding-top: 0;}
.what-you-get .row{gap: 0;}
.works .row .col-lg-6{width: 100%;}
.works .row{gap: 40px;}
.bnx .hover-button{gap: 499px;}
.servicepro .hover-button{gap: 450px;}
}
@media (min-width:576px) and (max-width:767.98px){
.image{ top: 20%; right: 10%; width: 70px; animation-delay: 1s; }
.code{ top: 57%; left: 50%; animation-delay: 0s; width: 70px; }
.approach h3, .challenge h3, .works h3{font-size: 33px;}
.approach .border-end{border-right: 0 !important;}
.approach .col-lg-3{padding: 30px 30px 10px 15px;}
.challenge img{width: 100%;}
.challenge ul{padding-top: 0;}
.challenge-content{padding-top: 0;}
.what-you-get .row{gap: 0;}
.works .row{gap: 40px;}
.bnx .hover-button{gap: 320px;}
.servicepro .hover-button{gap: 270px;}
}
@media (min-width:0) and (max-width:575.98px){
.web-design-banner{ margin-bottom: 94px !important;}
.mobile-header{padding-left: 0 !important; padding-right: 0 !important;}
.services-hero .container{padding-left: 0 !important; padding-right: 0 !important;}
.image{ top: 12%; right: 39%; width: 60px;}
.code{ top: 51%; left: 75%; width: 60px;}
.approach .border-end{border-right: 0 !important;}
.approach .col-lg-3{padding: 30px 30px 10px 15px;}
.approach h3, .challenge h3, .works h3, .what-you-get h3{font-size: 26px;}
.approach h6{font-size:18px ;padding-bottom: 0;}
.challenge ul{padding-top: 0;}
.check-list i{font-size: 29px;}
.what-you-get-bg{ margin-top: 70px;}
.what-you-get .row{gap: 0; padding-bottom: 66px;}
.works h3{ padding-bottom: 20px;}
.hover-button{top: 81% !important;}
.bnx .hover-button{gap: 221px !important; padding: 5px 15px;}
.servicepro .hover-button{gap: 171px !important;padding: 5px 15px;}
.works .row{gap: 40px;}
.project-tags{font-size: 13px;}
.project-title{font-size: 30px;}
}
/* UI/UX-design */
@media (min-width:1200px) and (max-width:1399.98px){
.ui-code{top: 83%; width: 90px;}
.banner h2{ padding-bottom: 74px;}
.what-you-get-ui-left p{ padding-right: 97px;}
.what-you-get-ui-right .row{gap: 40px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.ui-image{top: 21%; right: 60%; width: 90px; animation-delay: 1s; }
.ui-code{top: 70%; left: 67%; width: 90px;}
.ui-ux-approach h3, .challenge h3, .what-you-get-ui h3{font-size: 43px;}
.approach-card {height: 322px;}
.approach-card h5{font-size: 22px;}
.what-you-get-ui-left p{padding-right: 45px;}
.what-you-get-ui-right .row{gap: 42px;}
.what-you-get-ui span{text-wrap: wrap;}
.what-you-get-ui hr{margin-top: 30px; width: 483px;}
}
@media (min-width:768px) and (max-width:991.98px){
.ui-ux-approach h3, .what-you-get-ui h3{font-size: 43px;}
.approach-card h5{ font-size: 21px;}
.approach-card { height: 322px;}
.challenge-content{padding-top: 10px;}
.what-you-get-ui-right .row{gap: 10px;}
.what-you-get-ui hr{margin-top: 55px;}
.what-you-get-ui-left p{padding-bottom: 20px;}
}
@media (min-width:576px) and (max-width:767.98px){
.ui-image{ top: 19%; right: 10%; width: 70px; animation-delay: 1s; }
.ui-code{ top: 56%; left: 37%; width: 70px;}
.what-you-get-ui-right .row{gap: 10px;}
.what-you-get-ui hr{display: none;}
.ui-ux-approach h3, .what-you-get-ui h3{font-size: 33px;}
.challenge, .what-you-get-ui, .works{margin-top: 60px;}
.works h3{padding-bottom: 30px;}
}
@media (min-width:0) and (max-width:575.98px){
.uiux-design-banner{margin-bottom: 90px !important;}
.ui-image{ top: 19%; right: 10%; width: 70px; animation-delay: 1s; }
.ui-code{ top: 56%; left: 37%; width: 70px;}
.ui-ux-approach h3, .what-you-get-ui-left h3{font-size: 26px;}
.approach-card{height: 323px;}
.approach-card h5{ font-size: 20px; font-weight: 600;}
.challenge, .works{margin-top: 56px;}
.challenge-content{padding-top: 10px;}
.what-you-get-ui{margin-top: 55px;}
.what-you-get-ui-left p{padding-right: 0;}
.what-you-get-ui hr{display: none;}
.what-you-get-ui-right .row{gap: 10px;}
}
/* Product-design */
@media (min-width:1200px) and (max-width:1399.98px){
.dashboard{top: 70%;}
.challenge-content{padding-top:0;}
.what-you-get-product p{ padding-right: 388px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.product-design-approach, .what-you-get-product, .product-design-challenge{margin-top: 70px;}
.digital-applications h3, .product-design-approach h3, .what-you-get-product h3, .product-design-challenge h3, .works h3{font-size: 43px;}
.approach-item h5{font-size: 21px;}
.challenge-content{padding-top:0;}
.what-you-get-product p{ padding-right: 231px;}
.what-you-get-product .row .col-lg-4 p{ padding-right: 16px;}
.what-you-get-product .row .col-lg-4 h6{font-size: 21px;}
}
@media (min-width:768px) and (max-width:991.98px){
.product-design-banner{margin-bottom: 0 !important;}
.graph{width: 80px;}
.digital-applications h3, .product-design-approach h3, .product-design-challenge h3, .what-you-get-product h3, .works h3{font-size: 43px;}
.digital-applications, .product-design-approach, .product-design-challenge, .what-you-get-product, .works{margin-top: 60px;}
.product-design-approach .col-lg-6 p { padding-top: 8px;}
.product-design-approach .col-lg-7 .col-lg-6{padding-bottom: 20px;}
.product-design-approach .col-lg-7 .col-lg-6:last-child{padding-bottom:0;}
.product-design-approach .col-lg-7 .row{padding-bottom: 0;}
.product-design-approach .col-lg-6 h6{ padding-top: 13px;}
.challenge img{order: 1;}
.challenge-content{order: 2;}
.product-design-challenge img {width: 100%;}
.product-design-challenge h3{padding-top: 20px;}
.product-design-challenge ul{padding-top: 0;}
.what-you-get-product p{ padding-right: 102px;}
.what-you-get-product .row:last-child{padding-top: 0;}
}
@media (min-width:576px) and (max-width:767.98px){
.dashboard{top: 48%;}
.graph{width: 70px; top: 19%;}
.digital-applications h3, .product-design-approach h3, .product-design-challenge h3, .what-you-get-product h3, .works h3{font-size: 30px;}
.digital-applications, .product-design-approach, .product-dessign-challenge, .what-you-get-product, .works{margin-top: 60px;}
.digital-applications h3{ margin: 0 auto 10px;}
br {display: none;}
.digital-applications hr{ margin-top: 57px;}
.approach-item h5{ padding-top: 15px;}
.approach-item p{ padding-top: 12px;}
.product-design-approach .col-lg-7 .col-lg-6:last-child{padding-bottom:0;}
.product-design-approach .col-lg-6 h6{ padding-top: 15px; font-size: 21px;}
.product-design-approach .col-lg-7 .row{padding-bottom:20px;}
.product-design-approach .col-lg-7 .col-lg-6{padding-bottom: 20px;}
.product-design-approach .col-lg-6 p{ padding-top: 18px;}
.product-design-challenge h3{padding-top: 20px;}
.product-design-challenge img {width: 100%;}
.challenge img{order: 1;}
.challenge-content{order: 2;}
.product-design-challenge ul{padding-top: 0;}
.what-you-get-product .row{ padding-top: 15px;}
.what-you-get-product p{padding-right: 45px;}
.what-you-get-product .row .col-lg-4 p{padding-right: 0;}
.what-you-get-product .row:last-child{padding-top: 0;}
.what-you-get-product .row .col-lg-4 h6{ font-size: 18px;}
.what-you-get-product .row .col-lg-4{border-left: 0; padding-left: 0;}
}
@media (min-width:0) and (max-width:575.98px){
.digital-applications{margin-top: 90px !important;}
.graph {top: 12%; right: 79%; width: 62px;}
.dashboard{top: 47%; left: 74%; width: 69px;}
.product-design-banner{ margin-bottom: 2px !important;}
.digital-applications h3{ margin: 0 auto 10px;}
.digital-applications h3, .product-design-approach h3, .product-design-challenge h3, .what-you-get-product h3, .works h3{font-size: 26px;}
.digital-applications, .product-design-approach, .product-design-challenge , .what-you-get-product, .works{margin-top: 60px;}
.digital-applications hr{ margin-top: 62px;}
.product-design-approach p{padding-right: 0;}
.approach-item h5{ font-size: 19px;}
.approach-item p{ padding-top: 10px;}
.challenge img{order: 1;}
.challenge-content{order: 2;}
.product-design-challenge ul{padding-top: 0;}
.what-you-get-product p{padding-right: 0 !important;}
.what-you-get-product .row .col-lg-4 h6{ font-size: 20px;}
.what-you-get-product .row .col-lg-4{border: none;padding: 0;}
.what-you-get-product .row{ padding-top: 3px;}
.what-you-get-product .row .col-lg-4{padding-top: 20px;}
.what-you-get-product .row:last-child{padding-top: 0;}
}
/* Graphic-design */
@media (min-width:1200px) and (max-width:1399.98px){
.bulb{ top: 56%; right: 20%; width: 87px;}
.pentool{ top: 25%; width: 84px;}
.why-graphic-design .row{gap: 60px;}
.why-graphic-design h3{padding-top: 10px;}
.why-graphic-design p{padding-right: 0;}
.how-we-work p{ max-width: 776px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.bulb{ top: 56%; right: 20%; width: 87px;}
.pentool{ top: 25%; width: 84px;}
.why-graphic-design .row{gap: 30px;}
.why-graphic-design h3{padding-top:0;}
.why-graphic-design h3, .how-we-work h3, .what-you-get-graphic h3{font-size: 43px;}
.why-graphic-design p{padding-right: 0;}
.work-box{ width: 904px;}
.divider{ width: 641px;}
}
@media (min-width:768px) and (max-width:991.98px){
.graphic-design-banner{margin-bottom: 0 !important;}
.why-graphic-design h3, .how-we-work h3, .what-you-get-graphic h3{font-size: 43px;}
.pentool{ top: 20%; left: 37%; width: 84px;}
.bulb{ top: 46%; right: 1%; width: 73px;}
.banner h2{ padding-bottom: 150px !important;}
.why-graphic-design img{width: 100%;}
.work-box {width: 700px; padding: 35px 25px;}
.what-you-get-graphic .row{gap: 0;}
.what-you-get-graphic p{ margin: 0;}
.timeline::before { bottom: 58px;left: 25px;}
.icon-box { width: 50px; height: 50px; font-size: 20px;}
.content { padding-left: 25px;}
.divider {margin-left: 70px; width: 558px;}
.content h5{padding-top: 10px;}
}
@media (min-width:576px) and (max-width:767.98px){
.why-graphic-design img{width: 100%;}
.pentool{ left: 44%; width: 81px;}
.bulb{ right: 10%; width: 65px;}
.why-graphic-design h3, .how-we-work h3, .what-you-get-graphic h3{font-size: 33px;}
.why-graphic-design p{padding-right: 0;}
.how-we-work{ margin-top: 60px;}
.work-box { padding: 25px 20px; width: 500px;}
.timeline::before { left: 22px; bottom: 63px; top: 18px;}
.icon-box { width: 45px; height: 45px; font-size: 16px; margin-top: 17px;}
.content { padding-left: 20px; }
.content h5 { font-size: 16px; }
.content p {padding-top: 16px;}
.divider {margin-left: 60px; width: 392px;}
.what-you-get-graphic .row{gap: 0;}
}
@media (min-width:0) and (max-width:575.98px){
.pentool{ top: 13%; left: 3%; width: 61px;}
.bulb{ top: 38%; right: 4%; width: 53px;}
.why-graphic-design h3, .how-we-work h3, .what-you-get-graphic h3{font-size: 26px;}
.why-graphic-design h3{padding-bottom: 0;}
.why-graphic-design p{padding-right: 0;}
.how-we-work{ margin-top: 50px;}
.how-we-work p{margin: 0 auto 40px;}
.timeline::before {display: none;}
.work-box {width: 100%; padding: 20px; padding-bottom: 15px; padding-top: 52px !important;}
.step {flex-direction: column; align-items: flex-start; margin-top: -6px;}
.icon-box { margin-bottom: 10px; margin-top: 0; font-size: 20px; height: 40px;width: 40px;}
.content {flex-direction: column;padding-left: 0;}
.content h5 { font-size: 18px; padding-top: 10px;}
.content p {padding-left: 0;padding-top: 10px;}
.divider {display: none;}
.what-you-get-graphic .row{gap: 0;}
.what-you-get-graphic-bg{margin-top: 50px;}
}
/* Custom-software */
@media (min-width:992px) and (max-width:1199.98px){
.custom-software-development{padding-top: 40px;}
.custom-software-development h3, .how-we-work-software h3, .software-challenge h3, .what-you-get h3{font-size: 43px;}
.how-we-work-software .row .col-lg-3{width: 300px;}
.how-we-work-software .row{gap: 20px;}
}
@media (min-width:768px) and (max-width:991.98px){
.custom-software-banner{margin-bottom: 0 !important;}
.custom-software-development h3, .how-we-work-software h3, .software-challenge h3, .what-you-get h3{font-size: 43px;}
.how-we-work-software{margin-top: 55px;}
.custom-software-development h3{padding-bottom: 0;}
.how-we-work-software p{padding-right: 0;}
.how-we-work-software .row{gap:30px;}
.how-we-work-software .row .col-lg-3{width: 345px;}
}
@media (min-width:576px) and (max-width:767.98px){
.custom-software-development h3, .how-we-work-software h3, .software-challenge h3, .what-you-get h3{font-size: 33px;}
.custom-software-development h3{padding-bottom: 0;}
.how-we-work-software{margin-top: 60px;}
.how-we-work-software p {padding-right: 0;}
.how-we-work-software .row{gap:30px; padding-top: 30px;}
}
@media (min-width:0) and (max-width:575.98px){
.custom-software-banner{margin-bottom: 0 !important;}
.custom-software-development h3, .how-we-work-software h3, .software-challenge h3, .what-you-get h3{font-size: 26px;}
.custom-software-development, .how-we-work-software, .what-you-get{margin-top: 50px;}
.custom-software-development{margin-top: 100px;}
.software-challenge{margin-top: 80px;}
.how-we-work-software .row{ padding-top: 24px;}
.how-we-work-software .row{ gap: 20px;}
.custom-software-development h3{padding-bottom: 0;}
.main-row .col-lg-3{width: 93% !important; margin-left: 15px;}
.how-we-work-software{margin-top: 60px;}
.how-we-work-software p {padding-right: 0;}
.how-we-work-software .row .col-lg-3 h6{font-size: 20px;}
.challenge-box { flex-direction: column;}
.what-you-get h3{padding-top: 30px;}
}
/* Mobile-app */
@media (min-width:1200px) and (max-width:1399.98px){
.how-we-build{margin-top: 80px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.mobile-app-service{margin-top: 60px;}
.app-code{ width: 66px;}
.app-image{ width: 74px;}
.how-we-build h3, .what-you-get-app h3{font-size: 43px;}
.what-you-get-app .row{ gap: 95px;}
.what-you-get-app{padding: 50px 60px !important;}
}
@media (min-width:768px) and (max-width:991.98px){
.app-code{ width: 61px; top: 61%;}
.app-image{ width: 74px;}
.mobile-app-banner{margin-bottom: -21px !important;}
.mobile-app-service{transform: translateY(-90px);}
.mobile-app-service span:last-child {margin-top: 20px; display: inline-block;}
.mobile-app-service span{text-wrap: nowrap;}
.how-we-build h3, .challenge h3, .what-you-get-app h3{font-size: 43px;}
.timeline-2{padding-top: 40px;}
.timeline-2::before { top: 40px; bottom: 78px;}
.what-you-get-app h3{padding-right: 0;}
.what-you-get-app{ padding: 50px 60px !important;}
.what-you-get-app .row{ gap: 0;}
}
@media (min-width:576px) and (max-width:767.98px){
.app-code{ top: 47%; right: 5%; width: 71px;}
.app-image{ width: 66px;}
.mobile-app-service{margin-top: 50px;}
.mobile-app-service span:nth-child(2) {margin-top: 20px !important;display: inline-block;}
.mobile-app-service span:last-child {margin-top: 15px; display: inline-block;}
.mobile-app-service span{text-wrap: nowrap; font-size: 17px !important;}
.how-we-build h3, .what-you-get-app h3{font-size: 33px;}
.how-we-build p{padding-right: 0;}
.timeline-2{padding-top: 40px;}
.timeline-2::before { top: 40px; bottom: 103px;}
.challenge h3{padding-top:0;}
.what-you-get-app h3{padding-right: 0;}
.what-you-get-app{padding: 40px 50px !important;}
.what-you-get-app .row{ gap: 0;}
}
@media (min-width:0) and (max-width:575.98px){
.mobile-app-mobile-header{padding-left: 10px !important; padding-right: 10px !important;}
.app-code{top: 50%; right: 5%; width: 60px;}
.app-image{ width: 66px; top: 17%; left: 40%;}
.mobile-app-service{margin-top: 36px;}
.how-we-build h3{margin-bottom: 0;}
.mobile-app-service span:nth-child(2) {margin-top: 20px !important;display: inline-block;}
.mobile-app-service span:last-child {margin-top: 10px; display: inline-block;}
.mobile-app-service span{text-wrap: nowrap; font-size: 17px !important;}
.how-we-build{margin-top: 40px;}
.how-we-build h3, .what-you-get-app h3{font-size: 26px;}
.timeline-card h5{font-size: 20px;}
.how-we-build p{padding-right: 0;}
.timeline-2::before {display: none;}
.timeline-item::before {display: none;}
.timeline-item{padding-left: 0; margin-bottom: 21px;}
.challenge h3{padding-top: 0;}
.what-you-get-app h3 {padding-right: 0;}
.what-you-get-app{ padding: 20px 20px !important; border-radius: 0; margin-top: 73px;}
.what-you-get-app .row{ gap: 0;}
.project-content{padding: 20px;}
}
/* Website-development */
@media (min-width:1200px) and (max-width:1399.98px){
.why-website{margin-top: 80px;}
.why-website h3{text-wrap: nowrap;}
}
@media (min-width:992px) and (max-width:1199.98px){
.web-code{ top: 30%; width: 80px; left: 36%;}
.web-image{width: 80px !important; left: 91%;}
.web-development-service{padding-top:30px; padding-bottom: 0;}
.process-step h5{ font-size: 19px;}
br{display: none;}
.why-website h3, .process h3{font-size: 43px;}
.challenge h3{padding-top: 0;}
}
@media (min-width:768px) and (max-width:991.98px){
.web-banner{ margin-bottom: -54px !important;}
.web-code{top: 10%; width: 80px;}
.web-image{top: 58%; right: 4%; width: 71px;}
.web-development-srvc{display: flex; transform: translateY(-120px);}
.web-development-service span:last-child{margin-top: 22px;}
.web-development-service span{text-wrap: nowrap; font-size: 17px !important; }
.why-website h3, .process h3{font-size: 43px;}
.feature-list{border-left:none !important;}
.process-step{border-right: none !important;}
.process .row{padding-top: 0;}
.process-step h5{ font-size: 20px;}
.process{ margin-top: 66px;}
}
@media (min-width:576px) and (max-width:767.98px){
.web-code{top: 10%; width: 80px;}
.web-image{top: 58%; right: 18%; width: 71px;}
.web-development-srvc{padding-top: 30px;}
.web-development-service{ padding-bottom: 20px;}
.web-development-service span:last-child, .web-development-services span:last-child {margin-top: 13px; display: inline-block;}
.web-development-service span{text-wrap: nowrap; font-size: 17px !important;}
.web-development-service span:nth-child(2), .web-development-services span:nth-child(2) {margin-top: 20px !important;display: inline-block;}
.why-website h3, .process h3{font-size: 33px;}
.feature-list{border-left:none !important;}
.process-step{border-right: none !important;}
.process .row{padding-top: 10px;}
.process{ margin-top: 66px;}
}
@media (min-width:0) and (max-width:575.98px){
.web-banner{padding-left: 0 !important;}
.web-code{top: 11%;width: 65px;}
.web-image{top: 50%; right: 10%; width: 71px;}
.web-development-srvc{padding-top: 30px;}
.web-development-service{ padding-bottom: 20px;}
.web-development-service span:last-child, .web-development-services span:last-child {margin-top: 13px; display: inline-block;}
.web-development-service span{text-wrap: nowrap; font-size: 17px !important;}
.web-development-service span:nth-child(2), .web-development-services span:nth-child(2) {margin-top: 20px !important;display: inline-block;}
.web-banner{ margin-bottom: 52px !important;}
.why-website h3, .process h3{font-size: 26px;}
.process{ margin-top: 45px;}
.process .row{padding-top:0;}
}
/* Works */
@media (min-width:992px) and (max-width:1199.98px){
.work-content h4{ font-size: 27px; padding-top: 8px;}
.work-content h5{ font-size: 23px; font-weight: 500;}
}
@media (min-width:768px) and (max-width:991.98px){
.work-img{width: 100%;}
.work-content p{padding-right: 0;}
.work-card{ margin-bottom: 80px;}
.right-column{ margin-top: 80px !important;}
}
@media (min-width:576px) and (max-width:767.98px){
.work-img{width: 100%;}
.work-content h4{ font-size: 27px; padding-top: 8px;}
.work-content h5{ font-size: 20px;}
.work-content p{padding-right: 0;}
.work-card{ margin-bottom: 64px;}
.right-column{ margin-top: 64px !important;}
}
@media (min-width:0) and (max-width:575.98px){
.work-img{width: 100%;}
.work-content h4{ font-size: 27px; padding-top: 8px;}
.work-content h5{ font-size: 20px;}
.work-content p{padding-right: 0;}
.work-card{ margin-bottom: 64px;}
.right-column{ margin-top: 64px !important;}
}
/* Case-study */
@media (min-width:1200px) and (max-width:1399.98px){
.case-browser { top: 18%; left: 42%; width: 80px;}
.case-gear {top: 66%; right: 11%; width: 80px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.case-browser { top: 18%; left: 42%; width: 70px;}
.case-gear {top: 56%; right: 11%; width: 70px;}
}
@media (min-width:768px) and (max-width:991.98px){
.case-study-banner{margin-bottom: 0 !important;}
.case-browser { top: 18%; left: 42%; width: 70px;}
.case-gear {top: 56%; right: 11%; width: 70px;}
.case-studies .row .col-lg-6 img{width: 100% !important;}
.case-studies h4{ font-size: 40px; padding-top: 20px;}
.case-studies p{ padding-bottom: 14px;}
.case-studies .row{gap: 90px;}
.case-row-2{margin-top: 90px !important;}
}
@media (min-width:576px) and (max-width:767.98px){
.case-browser { top: 18%; left: 42%; width: 70px;}
.case-gear {top: 43%; right: 11%; width: 70px;}
.case-studies h4{ font-size: 27px; padding-top: 20px;}
.case-studies p{ padding-bottom: 14px;}
.case-studies .row{gap: 90px;}
.case-row-2{margin-top: 90px !important;}
}
@media (min-width:0) and (max-width:575.98px){
.case-browser { top: 18%; left: 42%; width: 59px;}
.case-gear {top: 43%; right: 11%; width: 50px;}
.case-studies h4{ font-size: 27px; padding-top: 20px;}
.case-studies p{ padding-bottom: 14px;}
.case-studies .row{gap: 90px;}
.case-row-2{margin-top: 90px !important;}
}
/* Contact */
@media (min-width:992px) and (max-width:1199.98px){
.contact h2{font-size: 50px;}
}
@media (min-width:768px) and (max-width:991.98px){
.contact h2{font-size: 50px;}
}
@media (min-width:576px) and (max-width:767.98px){
.contact h2{font-size: 45px;}
}
@media (min-width:0) and (max-width:575.98px){
.contact h2{font-size: 35px;}
.contact{ margin-top: 48px;}
.contact-block h4{ font-size: 21px;}
}
/* Servicepro-case-study */
@media (min-width:992px) and (max-width:1199.98px){
.about-the-project h3, .servicepro-case-challenges h3, .our-solution h3, .objectives h3{font-size: 43px; padding-top: 56px; padding-bottom: 8px;}
.servicepro-case-challenges, .our-solution, .objectives{ margin-top: 5px;}
.servicepro-services{padding-top: 40px;}
.gradient-box p{padding-right: 0 !important;}
.our-solution h5{ padding-top: 10px;}
.our-solution li{ padding-top: 12px;}
.our-solution h5{ font-size: 30px;}
.our-solution-bg{margin-top: 50px;}
.our-solution-bg .our-solution{ padding-bottom: 57px;}
.our-solution-bg{margin-bottom: 50px;}
}
@media (min-width:768px) and (max-width:991.98px){
.servicepro-case-study-banner { margin-bottom: 91px;}
.about-the-project h3, .servicepro-case-challenges h3, .our-solution h3, .objectives h3{font-size: 43px; padding-top: 56px; padding-bottom: 8px;}
.servicepro-case-challenges, .our-solution, .objectives{ margin-top: 5px;}
.servicepro-case-challenges .py-4{padding-top: 0 !important; padding-bottom: 0 !important;}
.gradient-box p{padding-right: 0 !important;}
.our-solution img{width: 100%;}
.our-solution-bg .our-solution img{order: 1;}
.dashboard-content{order: 2;}
.our-solution p{ padding-bottom: 10px;}
.our-solution h5{ font-size: 20px; padding-top: 36px;}
.our-solution ul{padding-top: 0;}
.our-solution li{ padding-top: 8px;}
.our-solution-bg{margin-top: 50px;}
.our-solution-bg .our-solution{padding-top: 58px; padding-bottom: 58px; margin-bottom: 50px;}
.mobile-app-img{ margin-top: 58px;}
.objectives i{ font-size: 40px;}
.objectives .row{gap: 30px;}
}
@media (min-width:576px) and (max-width:767.98px){
.servicepro-services{padding-top: 0;}
.servicepro-service{ padding-bottom:0;}
.servicepro-service span:last-child, .servicepro-service span:last-child {margin-top: 13px; display: inline-block;}
.servicepro-service span{text-wrap: nowrap; font-size: 17px !important;}
.servicepro-service span:nth-child(2), .servicepro-service span:nth-child(2) {margin-top: 20px !important;display: inline-block;}
.about-the-project h3, .servicepro-case-challenges h3, .our-solution h3, .objectives h3{font-size: 26px; padding-top: 56px; padding-bottom: 8px;}
.servicepro-case-challenges, .our-solution, .objectives{ margin-top: 5px;}
.servicepro-case-challenges .row{gap: 10px;}
.servicepro-case-challenges .py-4{padding-top: 0 !important; padding-bottom: 0 !important;}
.our-solution img{width: 100%;}
.our-solution-bg .our-solution img{order: 1;}
.dashboard-content{order: 2;}
.our-solution p{ padding-bottom: 10px;}
.our-solution h5{ font-size: 20px; padding-top: 36px;}
.our-solution ul{padding-top: 0;}
.our-solution li{ padding-top: 8px;}
.our-solution-bg{margin-top: 50px;}
.our-solution-bg .our-solution{padding-top: 58px; padding-bottom: 58px; margin-bottom: 50px;}
.mobile-app-img{ margin-top: 58px;}
.objectives i{ font-size: 40px;}
.objectives .row{gap: 30px;}
}
@media (min-width:0) and (max-width:575.98px){
.servicepro-services{padding-top: 0;}
.servicepro-service{ padding-bottom:0;}
.servicepro-service span:last-child, .servicepro-service span:last-child {margin-top: 13px; display: inline-block;}
.servicepro-service span{text-wrap: nowrap; font-size: 17px !important;}
.servicepro-service span:nth-child(2), .servicepro-service span:nth-child(2) {margin-top: 20px !important;display: inline-block;}
.about-the-project h3, .servicepro-case-challenges h3, .our-solution h3, .objectives h3{font-size: 26px; padding-top: 56px; padding-bottom: 8px;}
.servicepro-case-challenges, .our-solution, .objectives{ margin-top: 5px;}
.servicepro-case-challenges h3{ padding-top: 41px;}
.servicepro-case-challenges .row{gap: 10px;}
.servicepro-case-challenges .py-4{padding-top: 0 !important; padding-bottom: 0 !important;}
.our-solution-bg .our-solution img{order: 1;}
.dashboard-content{order: 2;}
.our-solution p{ padding-bottom: 10px;}
.our-solution h5{ font-size: 20px; padding-top: 36px;}
.our-solution ul{padding-top: 0;}
.our-solution li{ padding-top: 8px;}
.our-solution-bg{margin-top: 50px;}
.our-solution-bg .our-solution{padding-top: 58px; padding-bottom: 58px; margin-bottom: 50px;}
.mobile-app-img{ margin-top: 58px;}
.objectives i{ font-size: 40px;}
.objectives .row{gap: 30px;}
.footer-bg { margin-top: 65px;}
}
/* Auxbuild-case-study */
@media (min-width:992px) and (max-width:1199.98px){
.auxbuild-case-study-banner h2{font-size: 50px;}
.our-solution-auxbuild h5{font-size: 30px;}
.our-solution-auxbuild-content{ margin-top: 48px !important;}
.our-solution-auxbuild-content-2{padding-top: 0%;}
.our-solution-auxbuild{ margin-top: 74px;}
.auxbuild-objectives{padding: 50px 30px !important;}
.auxbuild-objectives{ padding: 40px 30px !important;}
}
@media (min-width:768px) and (max-width:991.98px){
.auxbuild-case-study-banner h2 {font-size: 41px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.challenge-img{order: -1;}
.challenge-img .float-end{ float: left !important;}
.auxbuild-challenges .col-lg-6:first-child{margin-top: 40px;}
.challenge-list{ margin-top: 29px;}
.auxbuild-challenges, .our-solution-auxbuild, .auxbuild-objectives {margin-top: 50px;}
.our-solution-auxbuild h5{ font-size: 20px;}
.our-solution-auxbuild-img{order: 1;}
.our-solution-auxbuild-content{order: 2;}
.our-solution-auxbuild-img .float-end{float: left !important;}
.our-solution-auxbuild-content{ margin-top: -29px !important; margin-bottom: 40px;}
.auxbuild-objectives{padding: 50px 30px !important;}
.auxbuild-objectives .row{gap: 0;}
}
@media (min-width:576px) and (max-width:767.98px){
.auxbuild-case-study-banner h6{font-size: 24px;}
.auxbuild-case-study-banner h2 { font-size: 33px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.auxbuild-service{padding-top: 30px;}
.auxbuild-challenges h3, .our-solution-auxbuild h3, .auxbuild-objectives h3 {font-size: 33px;}
.auxbuild-challenges, .auxbuild-objectives {margin-top: 70px;}
.challenge-list{ margin-top: 29px;}
.auxbuild-challenges h3{padding-top: 30px;}
.challenge-img{order: -1;}
.our-solution-auxbuild{margin-top: 12px;}
.our-solution-auxbuild h5{ font-size: 20px;}
.our-solution-auxbuild-img{order: 1;}
.our-solution-auxbuild-content{order: 2;}
.our-solution-auxbuild-content{ margin-top: -36px !important; margin-bottom: 40px;}
.auxbuild-objectives{padding: 50px 30px !important; border-radius: 20px;}
.auxbuild-objectives .row{gap: 0;}
}
@media (min-width:0) and (max-width:575.98px){
.auxbuild-case-study-banner h6{font-size: 24px;}
.auxbuild-case-study-banner h2 { font-size: 30px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.auxbuild-service span{text-wrap: nowrap; font-size: 17px !important; margin-right: 4px;}
.auxbuild-service span:last-child { display: inline-block; margin-top: 15px;}
.auxbuild-challenges h3, .our-solution-auxbuild h3, .auxbuild-objectives h3 {font-size: 26px;}
.auxbuild-challenges, .our-solution-auxbuild, .auxbuild-objectives {margin-top: 50px;}
.challenge-list{ margin-top: 30px;}
.challenge-img{order: -1;}
.auxbuild-challenges h3{padding-top: 30px;}
.our-solution-auxbuild h5{ font-size: 20px;}
.our-solution-auxbuild-content{ margin-top: 28px !important; margin-bottom: 40px;}
.our-solution-auxbuild-img{order: 1;}
.our-solution-auxbuild-content{order: 2;}
.our-solution-auxbuild-content h5{padding-top: 0;}
.auxbuild-objectives{padding: 50px 30px !important; border-radius: 0;}
.auxbuild-objectives .row{gap: 0;}
}
/* Humanitz-case-study */
@media (min-width:992px) and (max-width:1199.98px){
.humanitz-case-study-banner h2 { font-size: 50px; padding-right: 0; padding-bottom: 18px;}
.humanitz-service {margin-top: 40px;}
.humanitz-case-study-banner .float-end{float: left !important;}
.humanitz-case-challenges h3, .our-solution-humantiz h3, .humantiz-objectives h3 {font-size: 43px;}
.humanitz-case-challenges, .our-solution-humantiz, .humantiz-img{margin-top: 70px;}
.employees-app-content{padding-top: 0;}
.our-solution-humantiz-content{padding-top: 60px;}
}
@media (min-width:768px) and (max-width:991.98px){
.humanitz-case-study-banner h2 { font-size: 42px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.humanitz-service {margin-top: 40px;}
.humanitz-case-study-banner .float-end{float: left !important;}
.humanitz-case-challenges h3, .our-solution-humantiz h3, .humantiz-objectives h3 {font-size: 43px;}
.humanitz-case-challenges, .our-solution-humantiz, .humantiz-img{margin-top: 70px;}
.our-solution-humantiz h5{ font-size: 20px; padding-top: 0;}
.management-web-portal-img{order: 1;}
.our-solution-humantiz-content{order: 2; padding-top: 0;}
.humantiz-objectives{padding: 50px 30px !important;}
.humantiz-objectives .row{gap: 0;}
.management-web-portal-img .float-end{float: left !important;}
}
@media (min-width:576px) and (max-width:767.98px){
.humanitz-case-study-banner h6{ font-size: 24px;}
.humanitz-case-study-banner h2 { font-size: 33px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.humanitz-service span{text-wrap: nowrap; font-size: 17px !important;}
.humanitz-case-challenges h3, .our-solution-humantiz h3, .humantiz-objectives h3 {font-size: 33px;}
.humanitz-case-challenges, .our-solution-humantiz, .humantiz-img{margin-top: 70px;}
.our-solution-humantiz h5{ font-size: 20px; padding-top: 0;}
.management-web-portal-img{order: 1;}
.our-solution-humantiz-content{order: 2; padding-top: 0;}
.humantiz-objectives{padding: 50px 30px !important; border-radius:20px;}
.humantiz-objectives .row{gap: 0;}
.management-web-portal-img .float-end{float: left !important;}
}
@media (min-width:0) and (max-width:575.98px){
.humanitz-case-study-banner h6{ font-size: 24px;}
.humanitz-case-study-banner h2 { font-size: 30px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.humanitz-service span{text-wrap: nowrap; font-size: 17px !important;}
.humanitz-case-challenges h3, .our-solution-humantiz h3, .humantiz-objectives h3 {font-size: 26px;}
.humanitz-case-challenges, .our-solution-humantiz, .humantiz-img{margin-top: 70px;}
.our-solution-humantiz h5{ font-size: 20px; padding-top: 0;}
.management-web-portal-img{order: 1;}
.our-solution-humantiz-content{order: 2; padding-top: 0;}
.humantiz-objectives{padding: 50px 30px !important; border-radius: 0;}
.humantiz-objectives .row{gap: 0;}
}
/* Stayoffers-case-study */
@media (min-width:1200px) and (max-width:1399.98px){
.stayoffers-case-challenges-content{ padding-top: 41px;padding-bottom: 30px;}
.tour-package-content{padding-top: 0;}
.tour-plan-content{ padding-top: 70px;}
.stay-pacakge-content{ padding-top: 30px;}
.stayoffers-objectives{ margin-top: 36px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.stayoffers-service span:last-child { display: inline-block; margin-top: 15px;}
.stayoffers-case-study-banner h2 {padding-right: 0; padding-top: 26px; padding-bottom: 18px; font-size: 50px;}
.stayoffers-service{padding-top: 30px;}
.stayoffers-case-challenges h3, .stayoffers-objectives h3{font-size: 43px;}
.stayoffers-our-solution h5{font-size: 30px;}
.tour-plan-content{padding-top: 30px;}
.stayoffers-our-solution{padding-top: 40px; padding-bottom: 50px;}
.stay-package{padding-top: 0;}
.stay-pacakge-content{padding-top: 40px !important;}
.stayoffers-case-challenges-content{ padding-top: 41px;padding-bottom: 30px;}
.stayoffers-objectives{ margin-top: 50px;}
}
@media (min-width:768px) and (max-width:991.98px){
.stayoffers-case-study-banner h2 {padding-right: 0; padding-top: 26px; padding-bottom: 18px; font-size: 41px;}
.stayoffers-service{padding-top: 30px;}
.stayoffers-case-study-banner img{width: 100%; padding-top: 30px;}
.stayoffers-case-challenges h3, .stayoffers-objectives h3{font-size: 43px;}
.stayoffers-case-challenges img{width: 100%;}
.stayoffers-case-challenges-content{ padding-top: 41px;padding-bottom: 30px;}
.stayoffers-case-challenges .col-lg-6:first-child{padding-right: 0;}
.tour-plan-content{padding-top:0; order: 2;}
.stayoffers-our-solution h5{font-size: 20px;}
.stayoffers-our-solution-bg {padding-bottom: 30px;}
.stay-package{padding-top: 12px;}
.stay-pacakge-content{padding-top: 0;}
.tour-package-content{padding-top: 0;}
.stayoffers-objectives{ margin-top: 50px;}
}
@media (min-width:576px) and (max-width:767.98px){
.stayoffers-case-study-banner h6{font-size: 24px;}
.stayoffers-case-study-banner h2 { font-size: 33px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.stayoffers-service{padding-top: 30px;}
.stayoffers-case-study-banner img{width: 100%; padding-top: 30px;}
.stayoffers-case-challenges h3, .stayoffers-objectives h3{font-size: 33px;}
.stayoffers-case-challenges-content{ padding-top: 41px;padding-bottom: 30px;}
.stayoffers-our-solution h5{font-size: 20px;}
.tour-package-content{padding-top: 0;}
.tour-plan-content{padding-top:0; order: 2;}
.stayoffers-our-solution-bg {padding-bottom: 30px;}
.stay-pacakge-content{padding-top: 0;}
.stayoffers-objectives{margin-top: 40px;}
.stayoffers-objectives .row{display: grid; grid-template-columns: repeat(1, 1fr); margin-left: 1px; margin-right: 1px;}
}
@media (min-width:0) and (max-width:575.98px){
.stayoffers-case-study-banner h6{ font-size: 24px;}
.stayoffers-case-study-banner h2 { font-size: 30px; padding-right: 0; padding-top: 26px; padding-bottom: 18px;}
.stayoffers-service span{text-wrap: nowrap; font-size: 17px !important; margin-right: 5px;}
.stayoffers-service span:last-child { display: inline-block; margin-top: 15px;}
.stayoffers-case-challenges h3, .stayoffers-objectives h3 {font-size: 26px;}
.stayoffers-case-challenges{margin-right: 10px !important;}
.stayoffers-case-challenges-content{ padding-top: 38px;padding-bottom: 30px;}
.stayoffers-our-solution h5{font-size: 20px;}
.tour-package-content{padding-top: 0;}
.tour-plan-content{padding-top: 20px; order: 2;}
.stayoffers-our-solution-bg {padding-bottom: 30px;}
.stay-pacakge-content{ padding-top: 19px;}
.stayoffers-objectives{margin-top: 40px;}
.stayoffers-objectives .row{display: grid; grid-template-columns: repeat(1, 1fr); margin-left: 1px; margin-right: 1px;}
}
/* Web-design-landing-page */
@media (min-width:1200px) and (max-width:1399.98px){
.web-design-solutions .solution-card{margin: 0; height: 420px !important;}
.web-design-solutions .solution-card-content h4{ font-size: 26px;}
.starter-website .features-row{ margin-bottom: 41px;}
.ecommerce-website .features-row{ margin-bottom: 32px;}
}
@media (min-width:992px) and (max-width:1199.98px){
.Why-choose-content-2 h3, .digital-transformations h3, .pricng h3, .serving-all h3{font-size: 43px;}
.Why-choose-content-2 h5{ font-size: 20px;}
.Why-choose-content-2 p{padding-right: 0;}
.web-design-solutions .solution-card{margin: 0; height: 420px !important;}
.digital-transformations{ margin-top: 63px;}
.starter-website .features-row{ margin-bottom: 42px;}
.ecommerce-website .features-row{ margin-bottom: 83px;}
}
@media (min-width:768px) and (max-width:991.98px){
.Why-choose-content-2 h3, .digital-transformations h3, .pricng h3, .serving-all h3{font-size: 43px;}
.Why-choose-content-2 h5{ font-size: 26px;}
.Why-choose-content-2 p{padding-right: 0;}
.web-design-solutions .solution-card{margin: 0;}
.web-design-solution{display: grid; grid-template-columns: repeat(2, 1fr);}
.web-design-solution .py-5{padding-top: 0 !important; padding-bottom: 0 !important;}
.web-design-solution .col-lg-4{padding-bottom: 30px;}
.ecommerce-website .features-row{ margin-bottom: 22px;}
}
@media (min-width:576px) and (max-width:767.98px){
.Why-choose-content-2 h3, .digital-transformations h3, .pricng h3, .serving-all h3{font-size: 33px;}
.Why-choose-content-2 h5{ font-size: 26px;}
.Why-choose-content-2 p{padding-right: 0;}
.web-design-solutions .solution-card{margin: 0;}
.web-design-solutions .row{gap: 30px;}
.web-design-solutions .py-5{padding-top: 34px !important;}
.digital-transformations{ margin-top: 30px;}
.digital-transformations h3{ padding-bottom: 22px;}
.pricng h3{padding-bottom: 0;}
.serving-all{margin-top: 70px;}
.key-tags{text-wrap: balance; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;}
.key-tags a{margin-bottom: 5px !important; margin-right: 0;}
}
@media (min-width:0) and (max-width:575.98px){
.sphere-2, .triangle-2{display: none;}
.gear-2, .browser-2{width: 70px;}
.Why-choose-content-2{ padding-top: 34px !important;}
.Why-choose-content-2 h3, .digital-transformations h3, .pricng h3, .serving-all h3{font-size: 26px;}
.Why-choose-content-2 h5{font-size: 20px; line-height: 31px;}
.Why-choose-content-2 p{padding-right: 0;}
.kpi-2 h4{font-size: 40px; margin-bottom: 0%;}
.web-design-solutions .solution-card{margin: 0;}
.web-design-solutions .row{gap: 30px;}
.web-design-solutions .py-5{padding-top: 34px !important;}
.digital-transformations{ margin-top: 25px;}
.digital-transformations h3{ padding-bottom: 25px;}
.pricng { margin-top: 60px;}
.pricng h3{padding-bottom: 0;}
.features-row{ display: block;}
.price-card h6{ font-size: 20px;}
.price-card span{font-size: 19px;}
.business-website .price-card span{padding: 0;}
.ecommerce-website .features-row{ margin-bottom: 22px;}
.serving-all{margin-top: 58px;}
.serving-all h3{padding-bottom: 0%;}
.key-tags{text-wrap: balance; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;}
.key-tags a{margin-bottom: 5px !important;}
}