*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
   
   .jit_nav-main{
    display: flex;
    flex-wrap: wrap;
    background-image: url("home/nav/water_mark.png");
}
.jit_logo_main{
    display: flex;
    align-items: center;
    margin-left: 6%;
    flex-wrap: wrap;
}
.jit_logo{
     float: left; 
     height: 98px;
     width: 98px;
     border-radius: 50%;
     width: fit-content;
     margin-top: 3%;
}
.jit_logo img{
  height: 100%;
  width: 100%;
}
.jit_school_name{
    width: 238px; 
    font-size:28px;
    color: rgb(5, 5, 114);
    font-weight: bold;
}


.jit_nav_manu{
    display: flex;
    text-align: center;
    justify-content: center;
    width:67%;
  
}
.jit_nav-links {
    list-style: none;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
 
}

.jit_nav-links li {
    position: relative;
    margin: 0 15px;
  
}

.jit_nav-links li a {
    color: rgb(5, 5, 114);
    text-decoration: none;
    font-size: 18px;
    padding: 5px 10px;
  
}

.jit_nav-links li a:hover {
    color: rgb(19, 146, 61);
    border-radius: 4px;
}

.jit_dropdown:hover .jit_dropdown-content {
    display: block;
}

.jit_dropdown .jit_dropdown-content {
    display: none;
    position: absolute;
    top: 27px;
    left: 0;
    background-color: #f3f2f2;
    min-width: 160px;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    z-index:999;
    
}

.jit_dropdown .jit_dropdown-content a {
    color: rgb(5, 16, 73);
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    border-bottom: 1px solid  #21cf11;
}

.jit_dropdown .jit_dropdown-content a:hover {
    background-color:#a7b993;
   color: rgb(255, 255, 255);
}
    


     /* Custom styles for the hamburger icon animation */
        .hamburger-line {
            width: 28px; /* Slightly wider lines */
            height: 3px;
            background-color: #333; /* Darker color for visibility against white background */
            display: block;
            margin: 6px auto; /* Increased margin for better spacing */
            transition: all 0.3s ease-in-out; /* Smooth transition for animation */
            border-radius: 2px; /* Slightly rounded ends */
        }

        /* Animation for the top line of the hamburger icon */
        .hamburger.open .line-top {
            transform: translateY(9px) rotate(45deg); /* Moves down and rotates more */
        }

        /* Animation for the middle line of the hamburger icon */
        .hamburger.open .line-middle {
            opacity: 0; /* Fades out */
        }

        /* Animation for the bottom line of the hamburger icon */
        .hamburger.open .line-bottom {
            transform: translateY(-9px) rotate(-45deg); /* Moves up and rotates more */
        }

        

        /* Search bar specific styles for its open/closed state */
        .search-bar-container {
            height: 0; /* Initial hidden state: no height */
            overflow: hidden; /* Hides content when height is 0 */
            transition: height 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), padding 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* Smoother transition */
            width: 100%;
            z-index: 30; /* Ensure it's on top of everything when open */
            position: relative; /* For z-index to work */
        }

        

        /* Custom styling for the active navigation link in the main menu */
        .nav-link.active {
            font-weight: 700; /* Make text bold */
            color: #4f46e5; /* Set color to Tailwind's indigo-600 */
            border-bottom: 3px solid #4f46e5; /* Thicker underline effect */
            padding-bottom: 0.5rem; /* Add padding to prevent overlap with underline */
        }

        /* Mobile navigation menu specific styles */
        .mobile-nav-menu {
            transition: transform 0.3s ease-out; /* Smooth slide-in/out */
            transform: translateY(-100%); /* Start off-screen */
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); /* Add shadow */
            z-index: 15; /* Below search bar, above main content */
        }
        .mobile-nav-menu.open {
            transform: translateY(0); /* Slide into view */
            overflow-y: auto; /* Allows scrolling if mobile menu content exceeds screen height */
        }

        /* Hover effect for general links (underline effect) */
        .hover-effect-underline {
            position: relative;
            display: inline-block;
        }
        .hover-effect-underline::after {
            content: '';
            position: absolute;
            width: 0;
            height: 2px;
            display: block;
            margin-top: 5px;
            right: 0;
            background: #4f46e5; /* Indigo-600 */
            transition: width 0.3s ease;
        }
        .hover-effect-underline:hover::after {
            width: 100%;
            left: 0;
            background: #4f46e5;
        }
        .hover-effect-underline.active::after {
            width: 100%;
            left: 0;
            background: #4f46e5;
        }

        /* Keyframe for subtle pulse animation on "Apply Now" button */
        @keyframes pulse-glow {
            0% { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.7); } /* indigo-500 */
            70% { box-shadow: 0 0 0 10px rgba(99, 102, 241, 0); }
            100% { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0); }
        }

        .apply-button-pulse {
            animation: pulse-glow 1s infinite;
        }