/*.dropdown-menu a {
    text-decoration: none;
    color: #000000;
}

    .dropdown-menu a .d-flex {
        transition: all 0.5s;
    }

.dropdown-menu .col-sm-6:nth-child(1) a:hover .d-flex {
    background-color: var(--bs-warning-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(2) a:hover .d-flex {
    background-color: var(--bs-danger-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(3) a:hover .d-flex {
    background-color: var(--bs-success-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(4) a:hover .d-flex {
    background-color: var(--bs-secondary-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(5) a:hover .d-flex {
    background-color: var(--bs-tertiary-bg);
}

.dropdown-menu .col-sm-6:nth-child(6) a:hover .d-flex {
    background-color: var(--bs-info-bg-subtle);
}

@media only screen and (min-width: 992px) {
    .dropdown-menu {
        width: 55vw;
    }

    .dropdown:hover .dropdown-menu {
        display: flex;
    }

    .dropdown-menu.show {
        display: flex;
    }
}
*/

/*.dropdown-menu a {
    text-decoration: none;
    color: #000000;
    position:relative;
}

    .dropdown-menu a .d-flex {
        transition: all 0.5s;
    }

.dropdown-menu .col-sm-6:nth-child(1) a:hover .d-flex {
    background-color: var(--bs-warning-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(2) a:hover .d-flex {
    background-color: var(--bs-danger-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(3) a:hover .d-flex {
    background-color: var(--bs-success-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(4) a:hover .d-flex {
    background-color: var(--bs-secondary-bg-subtle);
}

.dropdown-menu .col-sm-6:nth-child(5) a:hover .d-flex {
    background-color: var(--bs-tertiary-bg);
}

.dropdown-menu .col-sm-6:nth-child(6) a:hover .d-flex {
    background-color: var(--bs-info-bg-subtle);
}

@media only screen and (min-width: 992px) {
    .dropdown-menu {
        width: 55vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .dropdown:hover .dropdown-menu {
        display: flex;
    }

    .dropdown-menu.show {
        display: flex;
    }
}

*/


/*.dropdown-menu a {
    text-decoration: none;
    color: #000000;
}

    .dropdown-menu a .d-flex {
        transition: all 0.5s;
    }

.dropdown-menu .col-lg-3:nth-child(odd) a:hover .d-flex {
    background-color: var(--bs-warning-bg-subtle);
}

.dropdown-menu .col-lg-3:nth-child(even) a:hover .d-flex {
    background-color: var(--bs-info-bg-subtle);
}*/

/* Icon size */
/*.services-mega-menu .icon {
    font-size: 1.75rem;
    width: 48px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}*/

/* Title size */
/*.services-mega-menu h5 {
    font-weight: 700;
    font-size: 12px;
    margin-bottom: 2px;

}*/

/* Description size */
/*.services-mega-menu .text div {
    color: #6c757d;
    font-size: 10px;
    line-height: 1.4;
}

@media only screen and (min-width: 992px) {
    .services-mega-menu {
        width: 75vw;
        max-width: 1140px;
        width: 55vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .dropdown:hover .services-mega-menu {
        display: flex;
    }

    .services-mega-menu.show {
        display: flex;
    }
}*/

/*.dropdown-menu a {
    text-decoration: none;
    color: #000000;

}

    .dropdown-menu a .d-flex {
        transition: all 0.5s;
    }

.dropdown-menu .col-service:nth-child(odd) a:hover .d-flex {
    background-color: var(--bs-warning-bg-subtle);
}

.dropdown-menu .col-service:nth-child(even) a:hover .d-flex {
    background-color: var(--bs-info-bg-subtle);
}*/

/* Custom 5-per-row column (20% width) */
/*.col-service {
    width: 100%;
}

@media (min-width: 1500px) {
    .col-service {
        width: 100%;
    }
}

@media (min-width: 1000px) {
    .col-service {
        flex: 0 0 5%;
        max-width: 100%;
        justify-content: center;
    }
}*/

/* Icon size */
/*.services-mega-menu .icon {
    font-size: 1.75rem;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.services-mega-menu .icon img {
    width: 32px;
    height: 100px;
    object-fit: contain;
}*/  

/* Title size */
/*.services-mega-menu h6 {
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 1px;
}*/
/* Description size */
/*.services-mega-menu .text div {
    color: #6c757d;
    font-size: 7px;
    line-height: 1.4;
}

@media only screen and (min-width: 992px) {
    .services-mega-menu {
        width: 75vw;
        max-width: 1237px;
        left: 90%;
        transform: translateX(-50%);
    }
    .dropdown:hover .services-mega-menu {
        display: flex;
    }

    .services-mega-menu.show {
        display: flex;
    }
}*/




/*trial css by v*/

/*.dropdown-menu a {
    text-decoration: none;
    color: #000000;
}

    .dropdown-menu a .d-flex {
        transition: all 0.5s;
    }

.dropdown-menu .col-service:nth-child(odd) a:hover .d-flex {
    background-color: var(--bs-warning-bg-subtle);
}

.dropdown-menu .col-service:nth-child(even) a:hover .d-flex {
    background-color: var(--bs-info-bg-subtle);
}*/

/* Custom 3-per-row column (33.33% width) */
/*.col-service {
    width: 100%;
    box-sizing: border-box;
}

@media (min-width: 1000px) {
    .col-service {
        flex: 0 0 33.333%;
        max-width: 33.333%;
        justify-content: flex-start;
        box-sizing: border-box;
    }
}*/

/* Icon size */
/*.services-mega-menu .icon {
    font-size: 1.75rem;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

    .services-mega-menu .icon img {
        width: 32px;
        height: 32px;
        object-fit: contain;
    }*/

/* Title size */
/*.services-mega-menu h6 {
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 1px;
}*/

/* Description size */
/*.services-mega-menu .text div {
    color: #6c757d;
    font-size: 7px;
    line-height: 1.4;
}

@media only screen and (min-width: 992px) {
    .services-mega-menu {
        width: 75vw;
        max-width: 1237px;
        left: 90%;
        transform: translateX(-50%);
        flex-wrap: wrap;
    }

    .dropdown:hover .services-mega-menu {
        display: none;
    }

    .services-mega-menu.show {
        display: flex;
    }
}*/


/* =====================================================================
   NOTE: All the old commented-out experimental blocks from earlier trial
   rounds have been removed for clarity. Only the active/live styles remain
   below, with fixes applied. If you want to keep the history of previous
   attempts, keep a copy of your original file - nothing here needs the old
   commented blocks to function.
   ===================================================================== */

.dropdown-menu a {
    text-decoration: none;
    color: #000000;
}

    .dropdown-menu a .d-flex {
        transition: all 0.5s;
    }

.dropdown-menu .col-service:nth-child(odd) a:hover .d-flex {
    background-color: var(--bs-warning-bg-subtle);
}

.dropdown-menu .col-service:nth-child(even) a:hover .d-flex {
    background-color: var(--bs-info-bg-subtle);
}

/* ---------------------------------------------------------------------
   Column layout for each service item inside the mega-menu
   - Mobile-first: single column by default
   - 2-per-row on small/medium (tablet) widths
   - 3-per-row from 1000px up (desktop)
   --------------------------------------------------------------------- */
.col-service {
    width: 100%;
    box-sizing: border-box;
}

/* FIX: added a tablet-width tier. Previously there was nothing between
   "100% width" (mobile) and 1000px (desktop 3-column), so a tablet in the
   576px-999px range showed all 14 services stacked in one long column. */
@media (min-width: 576px) and (max-width: 999.98px) {
    .col-service {
        flex: 0 0 50%;
        max-width: 50%;
        box-sizing: border-box;
    }
}

@media (min-width: 1000px) {
    .col-service {
        flex: 0 0 33.333%;
        max-width: 33.333%;
        justify-content: flex-start;
        box-sizing: border-box;
    }
}

/* Icon size */
.services-mega-menu .icon {
    font-size: 1.75rem;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    
}

    .services-mega-menu .icon img {
        width: 32px;
        height: 32px;
        object-fit: contain;
    }

/* Title size */
.services-mega-menu h6 {
    font-weight: 700;
    font-size: 13px;
    margin-bottom: 1px;
}

/* Description size */
.services-mega-menu .text div {
    color: #eef9ff;
    font-size: 7px;
    line-height: 1.4;
}

/* ---------------------------------------------------------------------
   Desktop (navbar not collapsed): position + reveal the mega-menu
   --------------------------------------------------------------------- */
@media only screen and (min-width: 992px) {
    .services-mega-menu {
        width: 75vw;
        max-width: 1237px;
        /* FIX: was left: 90% + translateX(-50%), which pushed a 75vw-wide
           panel almost entirely off the right edge of the viewport. Centered
           it under the navbar instead. If you specifically want it aligned
           to the right edge of the nav item rather than centered on the
           viewport, use "left: auto; right: 0;" and drop the transform. */
        left: 50%;
        transform: translateX(-50%);
        flex-wrap: wrap;
    }

        /* FIX: removed the old rule
         .dropdown:hover .services-mega-menu { display: none; }
       It was directly contradicting the ".show" rule below - the menu would
       get told to hide itself the moment the mouse was over the trigger,
       which is likely why it appeared to "not work" / flicker shut. Reveal
       is now driven entirely by the jQuery hover script toggling the "show"
       class (see _Layout.cshtml), matched by the rule below. */

        .services-mega-menu.show {
            display: flex;
        }
}

/* ---------------------------------------------------------------------
   Mobile / collapsed navbar (< 992px): let the mega-menu flow naturally
   inside the collapsed hamburger menu instead of trying to absolutely
   position a 75vw-wide panel, which would overflow the screen.
   --------------------------------------------------------------------- */
@media (max-width: 991.98px) {
    .services-mega-menu {
        position: static;
        width: 100%;
        max-width: 100%;
        left: auto;
        transform: none;
    }
}


/*for responsive changes on 3-08*/

@media (max-width: 991px) {
    .navbar-brand img,
    .navbar img {
        width: 170px;
        height: auto;
       
    }
}


/*@media (max-width: 991px) {
    .navbar img  {
    background: black;

    }
}*/


@media (max-width: 991px) {

    .services-mega-menu {
        position: static !important;
        width: 100% !important;
        min-width: 100% !important;
        box-shadow: none;
        border: none;
        padding: 0;
    }

        .services-mega-menu .row {
            display: block;
        }

        .services-mega-menu .col-service {
            width: 100%;
            margin-bottom: 5px;
        }

        .services-mega-menu .d-flex {
            padding: 10px;
        }

        .services-mega-menu .icon img {
            width: 28px;
            height: 28px;
            background: white;
        }
}

/*responsive for mobile at 4-08*/

@media (max-width: 991.98px) {
    #navbarCollapse {
        display: none !important;
    }

        #navbarCollapse.menu-open {
            display: flex !important;
            flex-direction: column;
            width: 100%;
        }

    .navbar .nav-item.dropdown .dropdown-menu {
        display: none;
        position: static;
        float: none;
        width: 100%;
        box-shadow: none;
        border: 0;
    }

    .navbar .nav-item.dropdown.mobile-open > .dropdown-menu {
        display: block;
    }

    .navbar .nav-item.dropdown > .dropdown-toggle {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
}



/*css for a toggle click in responsive menu click on 13-08*/

.business-services-link {
    display: flex;
    align-items: center;
}

    .business-services-link > .nav-link {
        flex: 1;
    }

.business-services-caret {
    background: none;
    border: none;
    color: inherit;
    padding: 8px 10px;
    cursor: pointer;
}

    .business-services-caret i {
        font-size: 11px;
        transition: transform 0.2s ease;
    }

.nav-item.dropdown.mobile-open .business-services-caret i {
    transform: rotate(180deg);
}




/*layout old style */

#SkypeButton_Call_srinivas_1 img {
    width: 50px;
}

/* Parent dropdown link + separate mobile caret */
.dropdown-parent-link {
    display: flex;
    align-items: center;
}

    .dropdown-parent-link > .nav-link {
        flex: 1 1 auto;
    }

.business-services-caret {
    background: transparent;
    border: none;
    color: #fff;
    padding: 8px 10px;
    cursor: pointer;
}

    .business-services-caret i {
        color: #fff;
        font-size: 12px;
        font-weight: bold;
        transition: transform 0.2s ease;
    }

.nav-item.dropdown.mobile-open .dropdown-caret i {
    transform: rotate(180deg);
}

@media (max-width: 991.98px) {
    .dropdown-parent-link {
        width: 100%;
    }

    .dropdown-caret {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
    }
}

#SkypeButton_Call_srinivas_1 p {
    text-align: right;
    margin-top: -66px;
}