@media screen and (min-width: 320px) and (max-width: 767px) {

    /********************************************
        Common CSS Here
    ********************************************/
    .body-wrap {
        width: 100%;
        padding: 0 12px;
        margin: 0;
    }

    .mob-view {display: block;}
    .desk-view {display: none;}

    /********************************************
        Header Begin Here
    ********************************************/
    #header {padding-bottom: 0.5rem;}
    .left-header {width: 110px;}

    /********************************************
        Top Header Begin Here
    ********************************************/
    .top-header {
        height: 36px;
        margin-bottom: 0.5rem;
    }
    .top-header > .container {justify-content: space-between !important;}
    /* .top-header .social-media {gap: 12px;} */

    /********************************************
        Navbar Begin Here
    ********************************************/
    #navbar {height: 48px;}

    #navbar .nav-content {
        gap: 20px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    #mobile-menu {
        font-size: 23px;
        line-height: 100%;
        /* border: 1px solid #f1f1f1; */
        background-color: #00388b;
        color: #f1f1f1;
        padding: 6px 14px;
        border-radius: 3px;
    }

    #overlay-bg {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9998;
        background-color: rgba(0, 0, 0, 0.5);
        min-width: 100%;
        min-height: 100%;
        height: 100vh;
        opacity: 0;
    }    

    #close-menu {
        color: #707070;
        font-size: 14px;
        font-weight: 400;
        border-bottom: 1px solid #dadada;
        background-color: var(--light-gray-color);
        padding: 8px 20px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 38px;
        position: fixed;
        z-index: 9;
        width: 95%;
        background-color: #fff;
    }

    #close-menu span {
        font-size: 18px;
        line-height: 21px;
        width: 21px;
        text-align: center;
        cursor: pointer;
    }

    #navbar-menu {
        position: fixed;
        top: 0;
        left: -100%;
        z-index: 9999;
        width: 95%;
        min-height: 100%;
        height: 100vh;
        background-color: #fff;
        transition: all 0.3s;
        overflow-y: auto;
    }
    #navbar-menu.active {left: 0;}

    .menu {
        flex-direction: column;
        align-items: start;
        gap: 0;
        padding: 15px;
        margin-top: 38px;
    }

    .menu > .menu-item {width: 100%;}

    .menu > .menu-item > a, .menu > .menu-item > a:hover {
        align-items: start;
        color: #2c2e35;
        border-bottom: 1px solid #f7f7f7;
        padding: 14px 0;
    }

    .menu .menu-item a {
        font-size: 15px !important;
        font-weight: 400;
    }

    .sub-menu .menu-item a:hover {
        color: #2c2e35;
        background-color: transparent;
    }

    .menu-item-has-children > a::before {
        content: "";
        border: 1px solid #585858;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        position: absolute;
        top: 4px;
        right: 0;
    }

    .menu-item-has-children > a::after {
        content: '';
        border: 1px solid;
        border-color: var(--dark-black);
        border-top: none;
        border-left: none;
        width: 8px;
        height: 8px;
        position: absolute;
        top: 10px;
        right: 7px;
        transform: rotate(-45deg);
        transition: all 0.1s linear;
    }
    .menu-item-has-children:hover > a::after {border-color: var(--dark-black);}

    .menu-item-has-children.active > a::after {
        top: 8px;
        right: 6px;
        transform: rotate(45deg);
        transition: all 0.1s linear;
    }

    .menu-item-has-children:hover > a::after, .menu-item-has-children:hover > a::before {background-color: transparent;}
    .menu-item-has-children:hover > a::before {transform: scale(1);}
    .menu-item-has-children:hover .sub-menu {transition: none;}

    .sub-menu {
        background-color: #f7f7f7;
        position: static;
        max-width: 100%;
        min-width: 100%;
        border-radius: 0;
        border-top: none;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        display: none;
    }

    .sub-menu::before, .sub-menu::after {display: none;}
    .sub-menu .menu-item a {color: #2c2e35;}

    .directory-btn a {
        font-size: 11px;
        padding: 4px 8px;
    }

    .directory-btn .btn-icon img {width: 24px;}
    .directory-btn a .btn-txt .hindi {font-size: 15px;}
    
    #navbar-menu .upcoming-btn {
        padding: 20px;
        padding-top: 0;
    }

    /********************************************
        Web Info Begin Here
    ********************************************/
    .web-info {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
    .web-info .container {flex-direction: column-reverse;}

    .info-right-col {
        width: 100%;
        padding: 32px 20px;
    }

    .info-right-col h3 {
        font-size: 1.2rem;
        line-height: normal;
    }

    .info-right-col h2 {
        font-size: 1.6rem;
        line-height: normal;
    }

    .info-right-col p {font-size: 1rem;}
    .info-right-pills li {font-size: 0.68rem;}
    .info-left-col {width: 100%;}
    .info-left-pills li {font-size: 0.7rem;}
    .info-left-col h1 {font-size: 2rem;}

    .info-left-col p {
        font-size: 15px;
        font-weight: 400;
        line-height: normal;
    }

    .web-info .serv-list li {
        font-size: 0.75rem;
        line-height: normal;
    }

    .web-info .serv-list li i {font-size: 1.1rem;}
    .web-info .info-btn {flex-direction: column;}

    .web-info .info-btn a {
        width: 100%;
        text-align: center;
    }

    /********************************************
        Counter Begin Here
    ********************************************/
    .counter {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .counter-list {
        gap: 12px;
        align-items: center;
    }

    .single-counter {width: calc(33.33% - 8px);}
    .single-counter h4 {font-size: 22px;}
    .single-counter p {font-size: 12px;}

    /********************************************
        Services Section Begin Here
    ********************************************/
    .services {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .services h2 {
        font-size: 1.75rem;
        line-height: normal;
    }

    .services h5 {
        font-size: 15px;
        font-weight: 400;
    }

    .services-list .single-service {flex-direction: column;}
    .single-service:nth-child(even) .single-service-block {flex-direction: column-reverse;}

    .single-service .service-info, .service-thumb-info {
        width: 100%;
        padding: 1rem;
    }

    .single-service-tab i {font-size: 14px;}
    .single-service-tab p {font-size: 12px;}
    .single-service .service-thumb {width: 100%;}
    .key-benefits {padding: 1.5rem 1rem;}

    .key-benefits ul {
        flex-direction: column;
        gap: 12px;
    }

    .key-benefits ul li {width: 100%;}
    .services .serviceBtn {margin-top: 2rem;}

    /********************************************
        Partners Section Begin Here
    ********************************************/
    .partners {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .partner-head-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .partners h2 {font-size: 1.65rem;}
    .partners h6 {width: 100%;}
    .partners-box {margin-top: 3rem;}
    .partners-box h3 {font-size: 1.4rem;}

    .partners-block {
        flex-wrap: wrap;
        gap: 1rem;
    }

    .single-partners-block {width: calc(50% - 0.5rem);}
    .single-partners-block .tab-pills i {font-size: 12px;}
    .single-partners-block .tab-pills span {display: none;}

    .single-partners-block .partner-icon {
        font-size: 34px;
        padding-right: 0;
    }

    .single-partners-block h5 {
        font-size: 0.7rem;
        line-height: normal;
    }

    .partner-cat-tabs ul li {font-size: 13px;}
    .partner-cat-tabs ul li i {font-size: 16px;}
    .partners-list {flex-direction: column;}
    .single-partner-info {width: 100%;}

    .single-partner-info .partner-info-icon {
        width: 35px;
        height: 35px;
        line-height: 36px;
        font-size: 20px;
    }
    .single-partner-info .partner-info-text {width: calc(100% - 83px);}

    .single-partner-info .partner-info-text h4 {
        font-size: 13px;
        margin-bottom: 5px;
    }
    .single-partner-info .partner-info-text p {font-size: 12px;}

    .single-partner-info .partner-users i:first-child {
        top: 0.2rem;
        right: 0.7rem;
        font-size: 10px;
    }
    .become-partner-btn {margin-top: 2rem;}

    .become-partner-btn a {
        font-size: 0.8rem;
        line-height: normal;
    }

    /********************************************
        Institutional Consultation Begin Here
    ********************************************/
    .institutional-consultation {
        padding-top: 4rem;
        padding-bottom: 3rem;
    }
    
    .institutional-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .institutional-consultation h2 {
        font-size: 1.5rem;
        line-height: normal;
    }

    .institutional-form-address {
        flex-direction: column;
        margin-top: 3rem;
    }

    .institutional-form {width: 100%;}
    .institutional-form-head {
        padding: 1rem;
        margin-bottom: 2rem;
    }

    .institutional-form-head h3 {
        font-size: 16px;
        margin-bottom: 1rem;
    }

    .institutional-form-head h3 i {font-size: 22px;}
    .consultationform .error {font-size: 0.75rem;}

    .institutional-address {
        border-radius: 0.75rem;
        width: 100%;
        padding: 1rem;
    }
    .institutional-address-head h2 {font-size: 20px;}

    .institutional-address-head p {
        font-size: 0.65rem;
        padding: 0.25rem 0.75rem;
        margin-bottom: 0;
    }
    .single-contact-info {gap: 16px;}

    .single-contact-info.address {
        border-left: 3px solid #4D1782;
        padding-left: 15px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
    .single-contact-info h4 {font-size: 15px;}
    
    .single-contact-info .contact-icon {
        width: 31px;
        height: 31px;
        line-height: 34px;
        font-size: 17px;
    }
    .single-contact-info .contact-text {width: calc(100% - 47px);}

    .single-contact-info .contact-text h5 {
        font-size: 15px;
        font-weight: 500;
    }
    .single-contact-info .contact-text p, .single-contact-info .contact-text p a {font-size: 0.85rem;}

    /********************************************
        Inner Top Info Begin Here
    ********************************************/
    .inner-top-info {padding-top: 4rem;}

    .inner-top-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .inner-top-info h2 {
        font-size: 1.9rem;
        line-height: normal;
    }

    .inner-top-info p {
        font-size: 0.95rem;
        line-height: 1.5rem;
    }

    .inner-top-button a {
        font-size: 13px;
        height: 2.7rem;
        padding: 0 1.8rem;
    }

    /********************************************
        Digital Growth Begin Here
    ********************************************/
    .digital-growth-info > h2 {
        font-size: 1.55rem;
        padding-bottom: 1rem;
    }
    .digital-growth-block {flex-direction: column;}

    .single-digital-growth {
        width: 100%;
        padding: 1.25rem;
    }

    .digital-growth-head i {
        font-size: 21px;
        width: 39px;
        height: 39px;
        line-height: 40px;
    }

    .digital-growth-head h6 {font-size: 1.1rem;}
    .single-digital-growth p {font-size: 14px;}

    /********************************************
        Branding Strategy Begin Here
    ********************************************/
    .branding-strategy .container {
        flex-direction: column;
        gap: 3rem;
    }
    .branding-strategy-left, .branding-strategy-right {width: 100%;}

    .branding-strategy-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .branding-strategy-left h2 {
        font-size: 1.55rem;
        line-height: normal;
    }

    .branding-strategy-icon {
        font-size: 17px;
        width: 31px;
        height: 31px;
        line-height: 32px;
    }

    .branding-strategy-info {width: calc(100% - 43px);}
    .branding-strategy-info h4 {font-size: 14px;}
    .single-branding-strategy:last-child {margin-bottom: 1rem;}
    .branding-strategy-right img {max-width: 100%;}

    /********************************************
        Content Marketing Begin Here
    ********************************************/
    .content-marketing {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .content-marketing-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .content-marketing-head h2 {
        font-size: 1.35rem;
        line-height: normal;
        margin-bottom: 1rem;
    }
    .content-marketing-head p {font-size: 14px;}

    .content-marketing-block {
        flex-direction: column;
        margin-top: 3rem;
    }

    .single-content-marketing {width: 100%;}
    .content-marketing-info h5 {font-size: 1.05rem;}
    .content-marketing-button {margin-top: 2.5rem;}

    .content-marketing-button a {
        font-size: 12px;
        font-weight: 500;
    }
    .backToHome a {font-size: 12px;}

    /********************************************
        Mobile Application Begin Here
    ********************************************/
    .mobile-application .container {flex-direction: column;}
    .mobile-application.healthcare-chatbot .container {flex-direction: column-reverse;}
    .mobile-application-left, .mobile-application-right {width: 100%;}

    .mobile-application-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .mobile-application-left h2 {
        font-size: 1.6rem;
        line-height: normal;
    }

    .single-mobile-application h4 {font-size: 14px;}
    .mobile-application-button a {font-size: 12px;}

    /********************************************
        Website Development Begin Here
    ********************************************/
    .website-development-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }
    .website-development-head {margin-bottom: 2.5rem;}

    .website-development-head h2 {
        font-size: 1.55rem;
        line-height: normal;
    }
    .website-development-head p {font-size: 14px;}

    .website-development-head h5 {
        font-size: 1rem;
        margin-top: 2.5rem;
    }

    /********************************************
        Information Systems Begin Here
    ********************************************/
    .information-systems-pills span {
        font-size: 0.7rem;
        padding: 0.25rem 0.75rem;
    }

    .information-systems-head h2 {
        font-size: 1.55rem;
        line-height: normal;
    }

    .information-systems-head p {font-size: 14px;}
    .information-systems-block {flex-direction: column;}
    
    .single-information-systems {
        width: 100%;
        padding: 1.25rem;
    }

    .top-information-systems i {
        width: 49px;
        height: 49px;
        line-height: 50px;
        font-size: 28px;
    }
    .information-systems-info {width: calc(100% - 65px);}

    .information-systems-info h4 {
        font-size: 1.1rem;
        line-height: normal;
    }

    .information-pills {
        font-size: 0.65rem;
        padding: 0.2rem 0.7rem;
        padding-bottom: 0.15rem;
    }
    .single-information-systems p {font-size: 14px;}

    /********************************************
        Hospital Planning Approaches Begin Here
    ********************************************/
    .hospital-planning-block {flex-direction: column;}

    .single-hospital-planning {
        width: 100%;
        padding: 1rem;
    }

    .top-hospital-planning i {
        font-size: 17px;
        width: 35px;
        height: 35px;
        line-height: 35px;
    }
    .top-hospital-planning h4 {font-size: 1.1rem;}

    .single-hospital-planning p {
        font-size: 15px;
        font-weight: 400;
    }
    
    /********************************************
        Build Projects Begin Here
    ********************************************/
    .build-projects-block {max-width: 100%;}
    .single-build-projects {padding: 1.25rem;}

    .top-build-projects i {
        font-size: 28px;
        width: 49px;
        height: 49px;
        line-height: 49px;
    }

    .top-build-projects h4 {font-size: 1.3rem;}
    .single-build-projects ul {flex-direction: column;}

    .single-build-projects ul li {
        width: 100%;
        font-size: 14px;
        padding: 0.75rem;
    }
    .single-build-projects ul li i {font-size: 15px;}

    /********************************************
        Project Process Begin Here
    ********************************************/
    .project-process-block {
        flex-direction: column;
        max-width: 100%;
    }
    .single-project-process {width: 100%;}

    .project-counter {
        width: 42px;
        height: 42px;
        line-height: 44px;
        font-size: 16px;
    }

    .single-project-process h6 {
        font-size: 1rem;
        line-height: normal;
    }
    
    /********************************************
        Streamline Hospital Operations Begin Here
    ********************************************/
    .streamline-hospital {padding-top: 4rem;}
    .streamline-hospital-info h2 {font-size: 1.55rem;}

    .streamline-hospital-info p {
        font-size: 15px;
        font-weight: 400;
    }

    /********************************************
        Key Solutions Begin Here
    ********************************************/
    .key-solutions-info h2 {
        font-size: 1.5rem;
        line-height: normal;
        padding-bottom: 0;
    }
    .key-solutions-block {flex-direction: column;}

    .single-key-solutions {
        width: 100%;
        padding: 1rem;
    }

    .key-solutions-head i {
        font-size: 21px;
        width: 35px;
        height: 35px;
        line-height: 35px;
    }

    .key-solutions-head h6 {
        font-size: 1rem;
        line-height: normal;
    }
    .single-key-solutions p {font-size: 14px;}


    /********************************************
        Footer Begin Here
    ********************************************/
    .footer-block {
        flex-direction: column;
        gap: 35px;
    }

    .footer-info, .footer-menu, .footer-contact {width: 100%;}
    .footer-block h3 {margin-bottom: 0.75rem;}

}

@media (min-width: 767px) and (max-width: 1023px) {
    .web-info, .services, .partners, .institutional-consultation {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .info-left-col h1 {font-size: 3rem;}
    .web-info .info-btn a {padding: 0.7rem 1.5rem;}
    .single-counter {width: calc(33.33% - 30px);}
    .single-service-block {flex-direction: column;}
    .single-service .service-info, .single-service .service-thumb {width: 100%;}
    .services-list .single-service:nth-child(even) .single-service-block {flex-direction: column-reverse;}
    .partners-block {flex-wrap: wrap;}
    .single-partners-block {width: calc(33.33% - 12px);}
    .single-partner-info {width: calc(50% - 9px);}
    .single-footer-contact {gap: 14px;}
    .single-footer-contact .contact-text {width: calc(100% - 36px);}
    .single-digital-growth {width: calc(50% - 15px);}
    .branding-strategy .container {align-items: center;}
    .branding-strategy-right img {width: 100%;}
    .hospital-planning-block {flex-direction: column;}
    .single-hospital-planning {width: 100%;}
}

@media (min-width: 640px) {
    .container {
        max-width: 640px;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 768px;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 1024px;
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@media (min-width: 1280px) {
    .container {
        max-width: 1280px;
    }
}

@media (min-width: 1536px) {
    .container {
        max-width: 1536px;
    }
}

@media screen and (min-width: 1920px) {
    .container {
        max-width: 1400px;
        margin-left: auto;
        margin-right: auto;
    }
}