@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');


        body {
            padding-top: 70px; /* Adjust this according to the height of your navbar */
        }
        .navbar {
            background-color: teal; /* Dark background color */
        }
        .navbar-brand {
            display: flex;
            align-items: center;
            color: #ffffff; /* White color for college name */
        }
        .navbar-brand img {
            height: 40px; /* Adjust the logo size */
        }
        .navbar-brand span {
            margin-left: 10px; /* Space between logo and name */
        }
        .navbar-nav .nav-item {
            position: relative;
        }
        .navbar-nav .nav-link {
            color: #ffffff; /* White color for menu items */
            padding: 10px 15px; /* Add padding for better appearance */
        }
        .navbar-nav .nav-link:hover {
            color: #f8f9fa; /* Lighter color on hover */
            background-color: #495057; /* Background color on hover */
            border-radius: 5px; /* Rounded corners for hover effect */
        }
        .dropdown-menu {
            background-color: #343a40; /* Background color for dropdown */
        }
        .dropdown-menu .dropdown-item {
            color: #ffffff; /* White color for dropdown items */
        }
        .dropdown-menu .dropdown-item:hover {
            color: #f8f9fa; /* Lighter color on hover */
            background-color: #495057; /* Background color on hover */
        }

        /* Responsive Adjustments */
        @media only screen and (min-width: 1600px) {
            .navbar-nav .nav-link {
                font-size: 1.1rem; /* Larger font size for very large screens */
            }
        }

        @media only screen and (min-width: 1440px) and (max-width: 1599px) {
            .navbar-nav .nav-link {
                font-size: 1rem; /* Slightly larger font size for large screens */
            }
        }

        @media only screen and (max-width: 1440px) {
            .navbar-nav .nav-link {
                font-size: 0.9rem; /* Smaller font size for medium screens */
            }
        }

        @media only screen and (max-width: 1300px) {
            .navbar-nav .nav-link {
                padding: 8px 12px; /* Adjust padding */
            }
        }

        @media screen and (min-width: 1200px) and (max-width: 1299px) {
            .navbar-nav .nav-link {
                font-size: 0.95rem; /* Adjust font size */
            }
        }

        @media only screen and (max-width: 1199px) {
            .navbar-nav .nav-link {
                font-size: 0.9rem; /* Further reduce font size */
            }
        }

        @media screen and (max-width: 1024px) {
            .navbar-nav .nav-link {
                font-size: 0.85rem; /* Adjust font size for smaller screens */
            }
        }

        @media only screen and (min-width: 992px) and (max-width: 1199px) {
            .navbar-nav {
                flex-direction: row; /* Ensure horizontal layout */
            }
        }

        @media only screen and (min-width: 768px) and (max-width: 991px) {
            .navbar-nav .nav-link {
                font-size: 0.8rem; /* Further reduce font size */
            }
        }

        @media screen and (min-width: 481px) and (max-width: 768px) {
            .navbar-nav .nav-link {
                font-size: 0.75rem; /* Smaller font size */
            }
        }

        @media screen and (max-width: 480px) {
            .navbar-nav .nav-link {
                font-size: 0.7rem; /* Very small font size for mobile screens */
            }
            .navbar-brand span {
                display: none; /* Hide college name on mobile screens */
            }
        }

        @media only screen and (max-width: 575px) {
            .navbar-nav .nav-link {
                font-size: 0.65rem; /* Very small font size */
            }
        }

        @media only screen and (max-width: 420px) {
            .navbar-nav .nav-link {
                font-size: 0.6rem; /* Adjust font size */
            }
        }

        @media only screen and (max-width: 320px) {
            .navbar-nav .nav-link {
                font-size: 0.55rem; /* Smallest font size */
            }
        }