.wrapper {
            background-color: #f8f9fa !important;
            padding-top: 0.25rem !important;
        }

        .navbar {
            display: flex !important;
            flex-wrap: nowrap !important;
            align-items: center !important;
            justify-content: space-between !important;
        }

        .navbar-brand {
            display: flex !important;
            align-items: center !important;
        }

        .navbar-brand img {
            max-width: 100% !important;
        }

        .navbar-toggler {
            background: none !important;
            border: none !important;
            cursor: pointer !important;
            padding: 0 !important;
            outline: none !important;
            display: flex !important;
            flex-direction: column !important;
            justify-content: center !important;
            align-items: center !important;
            margin-left: auto !important;
        }

        .navbar-toggler span {
            display: block !important;
            width: 30px !important;
            height: 3px !important;
            background-color: #000 !important;
            margin: 6px 0 !important;
        }

        .navbar-collapse {
            flex-grow: 1 !important;
            justify-content: center !important;
            display: flex !important;
            transition: transform 0.3s ease !important;
            transform: translateX(100%) !important;
        }

        .navbar-nav {
            display: flex !important;
            flex-direction: column !important;
            gap: 1rem !important;
        }

        .nav-item {
            list-style: none !important;
        }

        .nav-link {
            text-decoration: none !important;
            color: #000 !important; /* Adjust color as needed */
            font-size: 18px !important; /* Adjust font size as needed */
        }

        .nav-link:hover {
            color: #4E2A84 !important; /* Change to desired hover color */
        }

        @media (max-width: 1024px) {
            .navbar-collapse {
                position: fixed !important;
                top: 0 !important;
                right: 0 !important;
                width: 50% !important;
                height: 100% !important;
                background-color: #fff !important;
                z-index: 9999 !important;
                flex-direction: column !important;
                justify-content: center !important;
                align-items: center !important;
                box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5) !important;
            }

            .navbar-collapse.offcanvas-nav {
                transform: translateX(0) !important;
            }

            .navbar-toggler {
                display: block !important;
            }

            .overlay {
                display: none !important;
                position: fixed !important;
                top: 0 !important;
                left: 0 !important;
                width: 100% !important;
                height: 100% !important;
                background: rgba(0, 0, 0, 0.5) !important;
                z-index: 9998 !important;
                transition: opacity 0.3s ease !important;
                opacity: 0 !important;
            }

            .overlay.active {
                display: block !important;
                opacity: 1 !important;
            }
        }

        @media (min-width: 1025px) {
            .navbar-toggler {
                display: none !important;
            }

            .navbar-collapse {
                display: flex !important;
                transform: none !important;
            }

            .navbar-nav {
                flex-direction: row !important;
            }

            .overlay {
                display: none !important;
            }
        }

/* ---- inline block ---- */
.partner-logo {
            max-width: 80px;
            /* Adjust the width as needed */
            max-height: 80px;
            margin: 10px;
            /* Adjust spacing between logos */
        }


        .wrapper {
            background-color: #f8f9fa;
            padding-top: 0.25rem;
        }

        .navbar {
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
        }

        .navbar-brand {
            display: flex;
            align-items: center;
            width: 100%;
        }

        .navbar-brand img {
            max-width: 100%;
        }

        .navbar-toggler {
            margin-left: auto;
        }

        .navbar-collapse {
            flex-grow: 1;
            justify-content: center;
            display: flex;
        }

        .navbar-nav {
            display: flex;
            gap: 1rem;
        }

        .nav-item {
            list-style: none;
        }

        .nav-link {
            text-decoration: none;
            color: #000;
            /* Adjust color as needed */
            font-size: 26px;
            /* Adjust font size as needed */
        }

        .nav-link:hover {
            color: #4E2A84;
            /* Change to desired hover color */
        }

        .gtranslate_wrapper {
            margin-left: auto;
            display: flex;
            align-items: center;
        }

        @media (max-width: 768px) {
            .navbar-collapse {
                display: none;
            }

            .navbar-collapse.offcanvas-nav {
                display: flex;
                flex-direction: column;
                align-items: center;
            }

            .navbar-toggler {
                display: block;
            }
        }

/* ---- inline block ---- */
.hero {
            width: 100%;
            display: table;
            height: 600px;
        }

        .hero .hero-image {
            text-align: center;
            display: table-cell;
            width: 100%;
            vertical-align: middle;
            position: relative;
            padding: 0 1rem;
        }
        
        .contain-1120 h2 {
            font-size: 24px; /* Smaller font size for h2 */
        }
        
        .contain-1120 p {
            font-size: 48px; /* Larger font size for p */
        }

        .background-select-image-2 {
            width: 100%;
            height: auto;
            /* Reduced height to 50% of the viewport height */
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            background: url('https://common.northwestern.edu/v8/css/images/slashes-purple-bg.gif') repeat;
            background-size: cover;
        }

        .contain-780-2 {
            padding: 20px;
            text-align: center;
            width: 100%;
        }

        .background-select p.subhead {
            font-size: 36px
        }

/* ---- inline block ---- */
.background-select {
        width: 100%;
        display: table;
        min-height: 400px
        }

        .background-select .background-select-image {
            text-align: center;
            display: table-cell;
            width: 100%;
            vertical-align: middle;
            position: relative;
            padding: 5rem 1em 3rem 1em
        }

        .background-select h3 {
            margin-bottom: 2rem
        }

        .background-select p {
            margin-bottom: 3rem
        }

        .background-select a.button {
            margin-bottom: 2rem
        }

        .background-select.purple-slashes p {
            color: #fff
        }

        .background-select.purple-slashes h3 {
            color: #fff
        }

/* ---- inline block ---- */
.custom-container {
            background-color: #f9f9f9;
            padding: 50px 2%;
        }

        .custom-container-inner {
            max-width: 1200px;
            margin: 0 auto;
        }

        @media only screen and (max-width: 768px) {
            .custom-container {
                padding: 20px;
            }

            .text-section h4 {
                font-size: 1.5em;
                /* Larger font size for smaller screens */
            }
        }

        .custom-row {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            padding: 50px 0;
        }

        .custom-section {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: flex-start;
            gap: 30px;
            /* Reduced gap for better overlap */
        }

        .text-section {
            background-color: white;
            padding: 50px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            border-radius: 10px;
            z-index: 3;
            /* Higher z-index for overlap */
            flex: 1;
            /* Flexible width */
            margin-right: -100px;
            margin-top: 50px;
            /* Negative margin for overlap */
        }

        .image-section {
            flex: 1;
            height: 800px;
            background-size: cover;
            border-radius: 10px;
            background-position: center center;
            z-index: 2;
            /* Lower z-index to allow text section to overlap */
        }

        @media only screen and (max-width: 1080px) {
            .custom-section {
                flex-direction: column;
            }

            .text-section,
            .image-section {
                width: 100%;
                position: relative;
                margin-left: 0;
                margin-right: 0;
                /* Resetting margin for smaller screens */
            }

            .image-section {
                height: 300px;
                /* Smaller height on smaller screens */
            }
        }

        .text-section {
            z-index: 2;
            /* Ensures text overlaps image but both remain visible */
        }

        .image-section {
            z-index: 1;
            /* Keeps image in the background but visible */
        }

        @media only screen and (max-width: 768px) {
            .custom-container {
                padding: 20px;
            }

            .text-section h4 {
                font-size: 1.5em;
                /* Larger font size for smaller screens */
            }
        }

        @media only screen and (max-width: 768px) {
            .image-section {
                height: 200px;
                /* Adjust height to ensure visibility */
                margin: 0;
                /* Reset any negative margins that might be pushing it out of view */
                visibility: visible;
                /* Ensures the element is not hidden */
                opacity: 1;
                /* Ensures the element is fully opaque */
            }
        }

        .button-container {
            display: flex;
            justify-content: center; /* Center horizontally */
            align-items: center; /* Center vertically if needed */
            height: 100%; /* Take full height of the parent or adjust as necessary */
        }

/* ---- inline block ---- */
/* Landscape image for larger screens */
        .responsive-research-image.landscape {
            background-image: url('/files/RCN.png'); /* Landscape image */
            background-size: contain; /* Ensures the image scales without being cut off */
            background-repeat: no-repeat;
            background-position: center;
            width: 100%;
            height: 600px; /* Adjust height as needed */
            display: block;
            margin: 0 auto;
            margin-top: -50px;
            padding-bottom: 50px;
        }

        /* Vertical image for smaller screens, hidden by default */
        .responsive-research-image.vertical {
            display: none; /* Hide by default */
        }

        /* On smaller screens, hide landscape image and show vertical image */
        @media screen and (max-width: 768px) { 
            .responsive-research-image.landscape {
                display: none; /* Hide landscape image */
            }

            .responsive-research-image.vertical {
                display: block; /* Show vertical image */
                background-image: url('/files/research_vertical.png'); /* Vertical image */
                background-size: contain; /* Ensure the image is fully visible without being cut off */
                background-repeat: no-repeat;
                background-position: center;
                width: 100%; /* Take full screen width */
                height: 100vw; /* Fill the viewport height */
                margin: 0 auto; /* Center the image horizontally */
                padding: 0; /* Remove padding */
            }
        }