@media only screen and (max-width: 1800px) { }
@media only screen and (max-width: 1680px) { 
    .header .servicesMenu .submenu .servicesBox a span { font-size: var(--Font-size-14); line-height: 20px;}
    .header .servicesMenu .submenu .zohoBox ul li img { width: 92px;}
}
@media only screen and (max-width: 1570px) { 
    .wrap-inner { max-width: 1440px;}

    .bolgList .blog { height: 480px;}
    .bolgList .blog .imgBox { clip-path: inset(0 0 180px 0);}
    .bolgList .blog .blogInfo { min-height: 180px;}
}
@media only screen and (max-width: 1440px) { 
    .wrap-inner { max-width: 1366px;}

    .innerBanner.solutionsBanner,
    .innerBanner.servicesBanner,
    .innerBanner.technologyBanner {background-position: top right;}
}
@media only screen and (max-width: 1439px) { 
    .header .servicesMenu .submenu .zohoBox ul.logoBox { display: none;}
    .header .servicesMenu .submenu .servicesBox a span { display: none;}

    .header .technologiesMenu .submenu .imagesBox { width: 30%;}
    .header .technologiesMenu .submenu .menuBox { width: 17.5%;}

    .header .industriesMenu .submenu .menuBox { max-width: 960px;}
    .header .industriesMenu .submenu .imagesBox {width: calc(100% - 960px);}

    .homeCounter ul { width: calc(100% - 490px);}

    .contactBox .cnt { width: 100%; max-width: 880px;}
}
@media only screen and (max-width: 1366px) { 
    
}
@media only screen and (max-width: 1365px) { 

}
@media only screen and (max-width: 1280px) {
    h2 {font-size: var(--Font-size-40);}

    .smallService li { width: calc(33.33% - 20px);}
    .smallService li:has(img) { display: none;}

    .innerBanner.solutionsBanner,
    .innerBanner.servicesBanner,
    .innerBanner.technologyBanner {background-position: -320px 0;}

    .header .nav .nav-links { gap: 18px;}
    .header .industriesMenu.zohoMenu .submenu .imagesBox { display: none;}
    .header .industriesMenu.zohoMenu .submenu .menuBox { width: 100%; max-width: 100%;}

 }
@media only screen and (max-width: 1279px) { 
    .header .menu-toggle { display: block;}
    .header .logo { z-index: 1111;}

    .nav.active { scroll-behavior: auto; overscroll-behavior: none; scrollbar-width: none; -ms-overflow-style: none;}
    .nav.active::-webkit-scrollbar { display: none; }

    :not(.nav.active) .logo { background-color: transparent; transition: all .2s ease;} 
    :has(.nav.active) .logo { background-color: #fff; width: 340px; padding: 10px 0 0 20px; margin: -10px 0 0 -25px; transition: all .2s ease; }
    :has(.nav.active) .header { position: fixed; z-index: 9999;}
    /* :not(.mainManu.open) > .submenu { display: none;}
    :has(.mainManu.open) > .submenu { display: block;} */
    @supports (-webkit-touch-callout: none) {
        :not(.mainManu.open) > .submenu { display: none; background-color: red;}
        :has(.mainManu.open) > .submenu { display: block; background-color: green;}
    }

    .nav { position: fixed; top: 0; left: -360px; width: 340px; height: 100vh; background: #fff; box-shadow: 3px 0 10px rgba(0, 0, 0, 0.15); flex-direction: column; justify-content: flex-start; padding-top: 70px; overflow-y: auto; transition: all 0.4s ease; z-index: 1000;}
    .nav.active { left: 0;}
    .nav-links {flex-direction: column;gap: 0;padding: 0;}
    .nav-links li {width: 100%;}
    .nav-links a {display: block;padding: 12px 20px;border-bottom: 1px solid #eee;}
    .submenu {display: none;position: static;box-shadow: none;padding-left: 15px;background: #fafafa;}
    .submenu.active {display: block;}
    .mainManu::after {content: "+";float: right;font-size: 18px;transition: transform 0.3s ease;}
    .mainManu.open::after {content: "−";}
    .nav-overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.4);opacity: 0;visibility: hidden;transition: all 0.3s ease;z-index: 999;}
    .nav-overlay.active {opacity: 1;visibility: visible;}

    .header .submenu label { width: auto; margin-left: 20px; margin-top: 20px;}
    .header .submenu { padding-top: 0 !important;}
    .header .submenu .menuBox { width: 100% !important; padding: 0 !important; background-color: transparent !important; float: left; display: block;}
    .header .submenu .imagesBox { display: none;}

    .header .servicesMenu .submenu .servicesBox ul { width: 100%;}
    .header .servicesMenu .submenu .servicesBox ul li { width: 100%;}
    .header .servicesMenu .submenu .zohoBox ul li a span { display: none;}
    .header .servicesMenu .submenu .zohoBox label,
    .header .servicesMenu .submenu .zohoBox ul li a { color: var(--primary-color);}
    .header .industriesMenu .submenu .menuBox ul li { width: 100%;}
    .header .productsMenu .submenu .menuBox { display: none;}
    .header .productsMenu .submenu .menuBox.productsLink { display: block;}
    .header .productsMenu .submenu .menuBox a { font-size: var(--Font-size-16); font-family: var(--font-family); font-weight: 500; display: block; margin-bottom: 10px;}
    .header .companyMenu .submenu .menuBox.certifiedBox,
    .header .companyMenu .submenu .succeedBox { display: none;}
    .nav-links li.menu-item-btn { padding: 20px;}

    /* .menu-item:hover > .submenu { display: none !important;} */
    .header .nav .nav-links .menu-item .mainManu { font-size: var(--Font-size-16); padding: 15px 20px;}
    .header .submenu .menuBox ul li { padding: 0 !important; margin: 0 !important;}
    .header .submenu .menuBox ul li a { font-size: var(--Font-size-16); color: var(--primary-color) !important;}
    .header .submenu .menuBox ul li a:hover { color: var(--secondary-color) !important;}
    .header .nav .nav-links { gap: 0;}

    .homeCounter .titleBox { width: 100%; margin-bottom: 40px;}
    .homeCounter ul { width: 100%;}

    .homeTestimonials ul li { width: calc(50% - 15px);}
    /* .homeTestimonials ul li:last-child { display: none;} */
    
    .accordionSolutions li .acclink {align-items: self-start; }
    .accordionSolutions li .acclink h3 { width: 285px;}
    .accordionSolutions li .acclink div {width: calc(100% - 340px);}
    .accordionSolutions li .accord-detail { padding: 0 75px 25px 355px;}

    .bolgList .blog { width: calc(50% - 30px);  height: 480px;}

    .fullwidthProcess .processBox { width: calc(100% / 3); position: relative;}
    .fullwidthProcess::before { display: none;}
    .fullwidthProcess .processBox::before { content: ""; width: 100%; height: 2px;position: absolute; left: 0; top: 62px; background-color: #D9D9D9;}
    .fullwidthProcess .processBox:nth-child(1),
    .fullwidthProcess .processBox:nth-child(2),
    .fullwidthProcess .processBox:nth-child(3) { margin-bottom: 35px;}

    .bannerCareers::before { background: linear-gradient(90deg,#001525 70%, #ed860050 90%, #00152525); opacity:.9;}
}
@media only screen and (max-width: 1170px) { 
    .homeIndustries .owl-carousel .owl-nav { position: relative; width: 100%; top: auto; right: auto; margin-top: 10px;}
}
@media only screen and (max-width: 1024px) { 

    h2 { font-size: var(--Font-size-36);}

    .boxSpace { padding: 70px 0;}
    .boxSpaceT { padding: 70px 0 0 0;}
    .boxSpaceB { padding:0 0 70px 0;}

    .getInTouchBox {gap: 50px;}
    .getInTouchBox .contactUs,
    .getInTouchBox .formBox { width: 100%;}

    .smallService li .services h3 { font-size: var(--Font-size-22);}

    .caseStudy { flex: 1 1 calc(33.33% - 20px);}

    .featuresIconBox li { flex: 1 1 calc(50% - 15px);}

    .ourOffices li { width: calc(50% - 15px);}

    .contactBox { flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: 20px;}

}
@media only screen and (max-width: 1023px) { 

    .footer .footerLink .linkBox { width: calc(50% - 10px);}

    .twoColBox { gap: 30px;}
    .twoColBox .colTwo { width: 100%; position: relative;}
    .twoColBox:has(.imgBox) .cntBox { padding: 0;}

    .smallService li { width: calc(50% - 15px);}
    .smallService li:has(img) { display: block;}

    .devService.no-carousel .item { width: 100%; flex: auto; padding: 30px; min-height: auto;}

    .whatWeDoInd .imgBox { max-height: unset; position: relative; top: 0; }

    
}
@media only screen and (max-width: 999px)  { }
@media only screen and (max-width: 960px)  { 
    ul.ourTeam li { width: calc(100% / 4);}
}
@media only screen and (max-width: 959px)  {
    a.caseStudiesItem {width: 100%; flex-direction: row;}
    a.caseStudiesItem:nth-child(8n+3) { flex-direction: row-reverse;}
    a.caseStudiesItem .images { width: 50%; min-height: 100%; max-height: 100%;}
    a.caseStudiesItem .description { width: 50%;}
    a.caseStudiesItem:nth-child(8n+7) .description { width: 100%; padding: 72px 36px; }

    .popupContent.letsTalkPopup { background: #fff; padding: 25px; width: 400px; max-height: 90%; border-radius: 10px; overflow-y: scroll; position: relative;}
    .letsTalkPopup .letsTalkImg { display: none;}
    .letsTalkPopup .letsTalkForm { width:auto; background-color:#fff; padding: 0;}
}
@media only screen and (max-width: 839px)  { 
    .bolgList .blog { width: 100%;  height:390px; gap: 20px;}
    .bolgList .blog .imgBox { clip-path: inset(0 0 140px 0);}
    .bolgList .blog .blogInfo { min-height: 140px;}
}
@media only screen and (max-width: 768px)  {
    
    .accordionSolutions li .acclink { padding: 25px;}
    .accordionSolutions li .accord-detail { padding: 0 75px 25px 330px;}

 }
@media only screen and (max-width: 767px)  { 
    .smallService { gap: 15px;}
    .smallService li { width: 100%;}

    .homeCounter ul { width: 100%; gap: 10px;}
    .homeCounter ul li { width: 100%;}

    .homeTestimonials ul li { width: 100%;}

    .footer .companyInfo .social { margin-top: 20px;}

    .caseStudy { flex: 1 1 calc(100% - 0px); min-height: auto;}

    .fullwidthProcess .processBox { width: calc(100% / 2);}

    .fullwidthProcess .processBox:nth-child(4) { margin-bottom: 35px;}

    .featuresIconBox li { flex: 1 auto;}

    a.caseStudiesItem { flex-wrap: wrap;}
    a.caseStudiesItem .images { width: 100%; min-height: 280px; max-height: 280px;}
    a.caseStudiesItem .description { width: 100%;}
    a.caseStudiesItem:nth-child(4n+1) .description, a.caseStudiesItem:nth-child(8n+1) .description { min-height: auto;}
}
@media only screen and (max-width: 640px)  {  
}
@media only screen and (max-width: 639px)  { 

    h1 { font-size: var(--Font-size-34);}
    h2 {font-size: var(--Font-size-32); font-weight: 700;}

    .innerBanner .cntBox h1 { font-size: var(--Font-size-34);}

    .homeBanner::before {background: linear-gradient(90deg,#001525, #00152520); opacity: 0.9;}
    .homeBanner .cntBox label { font-size: var(--Font-size-14);}
    .homeBanner .cntBox h1 { font-size: var(--Font-size-34);}
    .homeBanner .cntBox p { font-size: var(--Font-size-16);}

    .accordionSolutions li .acclink { padding: 20px; position: relative;}
    .accordionSolutions li .acclink h3 { width: 100%; padding: 0; margin-bottom: 10px; }
    .accordionSolutions li .acclink div {width: 100%;}
    .accordionSolutions li .acclink .moreArrow { position: absolute; top: 15px; right: 15px; z-index: 2;}
    .accordionSolutions li .accord-detail { padding: 0 20px 20px 20px;}

    .accordion li .acclink { padding: 20px;}
    .accordion li .accord-detail { width: 100%; padding: 0 20px 25px 20px;}

    .getInTouchBox .formBox { padding: 20px;}
    .getInTouchBox .cForm li.col2 { width: 100%;}

    .devService .item { min-height: auto; padding: 30px;}

    .ourOffices li { width: 100%;}

    ul.ourTeam li { width: calc(100% / 3);}
}
@media only screen and (max-width: 599px)  { }
@media only screen and (max-width: 480px)  { 
    .titleBox { margin-bottom: 25px;}
    .contactBox { padding: 40px;}
    .contactBox h2, 
    .contactBox h2.small { font-size: var(--Font-size-32);}
    .contactBox p { font-size: var(--Font-size-20);}

    .bolgList .blog { height:310px; gap: 10px;}
    .bolgList .blog .imgBox { clip-path: inset(0 0 160px 0);}
    .bolgList .blog .blogInfo { min-height: 160px;}

    .bolgList .blog .blogInfo h3 {font-size: var(--Font-size-22);}

    .fullwidthProcess .processBox { width: 100%; margin-bottom: 35px;}
    .fullwidthProcess::before { display: block; height: 100%; min-height: 100%; max-height: 100%; width: 6px; top: 0; left: 0; background: linear-gradient(180deg,#001525, #FF7700); background-size: 300% 300%; -webkit-animation: AnimationName 20s ease infinite; -moz-animation: AnimationName 20s ease infinite; animation: AnimationName 20s ease infinite;}
    .fullwidthProcess .processBox::before { display: none;}
    .fullwidthProcess .processBox:nth-child(6) { margin-bottom: 0;}
    .fullwidthProcess .processBox span { margin-bottom: 12px;}

    .innerBanner.solutionsBanner,
    .innerBanner.servicesBanner,
    .innerBanner.technologyBanner {background-position: top right;}

    .bannerImages::before {opacity: 0.95;}

    .featuresIconBox li { padding: 40px 30px;}

    .twoColBox .imgBox img.fixed { height: auto;}
    .innerBanner::before { background:linear-gradient(120deg,#001525 25%, #00152545); opacity:.85;}

}
@media only screen and (max-width: 479px)  {
    .footer .footerLink label { margin-bottom: 20px; background: #002440; padding: 8px 15px; margin-left: -15px; margin-right: -15px;}
    .footer .footerLink .linkBox { width: 100%; margin:5px 0; }
    .footer:has(.social) { border-bottom: 0 none;}
    .footer:has(.footerLink) { padding-top: 0;}
 }
@media only screen and (max-width: 440px)  { 

    h2 {font-size: var(--Font-size-30);}

    .boxSpace { padding: 55px 0;}
    .boxSpaceT { padding: 55px 0 0 0;}
    .boxSpaceB { padding:0 0 55px 0;}

    .logo { width: 260px !important;}

    .caseDtlBox .caseMenu { gap: 18px;}

    .popupContent.letsTalkPopup ul.cForm li label { display: none;}

}
@media only screen and (max-width: 428px)  { }
@media only screen and (max-width: 414px)  { }
@media only screen and (max-width: 410px)  { 
    h2 {font-size: var(--Font-size-26);}
    .contactBox:has(h2.small) {padding: 40px 10px;}
}
@media only screen and (max-width: 380px)  {
    
 }
@media only screen and (max-width: 360px)  { }
@media only screen and (max-width: 320px)  { }