.bg-background-1:before, .banner1:before {
    background: white!important;
}
@media((max-width: 991px)) {
    .horizontalMenu > .horizontalMenu-list > li > a.active {
        color: white!important;
    }
}

.dropdown-menu-end .dropdown-item:hover{
    color: #1a4080;
}   
.headerProfileImg {
    width: 25px;
    height: 25px;
    object-fit: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 50%; /* Optional: to make it circular */
    transition: all 0.2s ease-in-out; /* Smooth transition for hover and click effects */
    outline: 2px solid white; 
}

/* Hover effect: white outline and subtle shadow */
.headerProfileImg:hover {
    /* White outline */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); /* Subtle shadow */
}

/* Active effect: scale down slightly to mimic click */
.headerProfileImg:active {
    transform: scale(0.9); /* Slight scale down for click effect */
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2); /* Slightly reduced shadow on click */
}
.header-main {
        height: 79px;
        z-index: 9998 !important;
    }
@media only screen and (max-width: 992px) {
    .header-main {
        height: 54px;
    }
}

.scrollShadow {
    box-shadow : 0px 4px 6px rgba(0,0,0,0.15),0px 0px 2px rgba(0,0,0,0.15);
    transition: all 0.3s ease-in-out;
}

@media (min-width: 992px) {
    .horizontalMenu>.horizontalMenu-list>li>a{
        font-size:15px !important;
    }
}

.horizontalMenu > .horizontalMenu-list > li > a.active-link {
    color: #F07F19 !important;
    font-weight: 600 !important;
}

.sub-menu > li > a.active-link {
    color: #F07F19 !important;
    font-weight: 600 !important;
}


@media (max-width: 991px) {
    .horizontalMenu {
        height: 100vh !important;
        visibility: visible;
        pointer-events: none;
        overflow: hidden;
        opacity: 1;
        contain: layout style paint;
    }

    .horizontalMenu-list {
        display: flex;
        flex-wrap: wrap;
        gap: 15px;
        padding: 0;
        list-style: none;
        padding: 8px !important;
    }

    .horizontalMenu-list li {
        background-color: #fff !important;
        border-radius: 12px;
        transition: all 0.1s;
        margin: 20px 0px !important;

        
    }

    .horizontalMenu-list li a {
        display: block;
        color: #35578C; /* primary color */
        font-weight: 600;
        text-decoration: none;
        text-align: center;
        padding: 15px !important;
    }

    .horizontalMenu-list li:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.2);
        transform: translateY(-2px);
    }

    .horizontalMenu > .horizontalMenu-list > li > .sub-menu {
        background-color: #fff;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        border-radius: 10px;
        padding: 10px !important;
    }

    .horizontalMenu-list li a.active-link,
    .sub-menu li a.active-link {
        color: #F78031 !important;
        border-radius: 12px; 
        padding: 16px !important;
    }

    .horizontalMenu>.horizontalMenu-list{
        width: 300px !important;
        background-color:#F1F1F1 !important;
        margin-left: 0 !important;
        min-height: 100vh;
        transform: translate3d(-100%, 0, 0);
        opacity: 0.98;
        transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms ease !important;
        will-change: transform, opacity;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
    }
    .horizontal-overlapbg{
        width: calc(100% - 300px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 280ms ease, visibility 0s linear 280ms;
        will-change: opacity;
    }

    .horizontalMenu > .horizontalMenu-list > li > a.active-link{
        color: white !important;
    }

    .horizontalMenu>.horizontalMenu-list>li>.horizontalMenu-click>i{
        margin:15px !important;
        font-weight: 600 !important;
        color: inherit !important;
    }
    #marginA{
        padding :0px !important
    }

    .horizontalMenucontainer {
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }

    .active .horizontalMenucontainer {
        margin-left: 0 !important;
        transform: none !important;
    }

    .active .horizontalMenu {
        pointer-events: auto;
        overflow-y: auto;
    }

    .active .horizontalMenu > .horizontalMenu-list {
        margin-left: 0 !important;
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }

    .active .horizontalMenu .horizontal-overlapbg {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity 280ms ease;
    }

}