@font-face {
    font-family: 'Bahnschrift';
    src: url('../assets/fonts/Bahnschrift.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.nav-link.active {
    border: 2px solid #ffffff;
    border-radius: 0.0rem; /* optional, for rounded corners */
    padding: 0.5rem 0.5rem; /* ensure padding works well with border */
}

.hero-section {
    background-image: url('/assets/Home.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section2 {
    background-image: url('/assets/About.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section3 {
    background-image: url('/assets/About2.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section4 {
    background-image: url('/assets/Members.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section5 {
    background-image: url('/assets/Members2.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section6 {
    background-image: url('/assets/Members3.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section7 {
    background-image: url('/assets/Members4.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 170vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section8 {
    background-image: url('/assets/Contact.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section9 {
    background-image: url('/assets/AboutMobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 120vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section10 {
    background-image: url('/assets/About2Mobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 150vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section11 {
    background-image: url('/assets/MembersMobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 200vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section12 {
    background-image: url('/assets/Members2Mobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 220vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section13 {
    background-image: url('/assets/Members4Mobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 180vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section14 {
    background-image: url('/assets/Members4Mobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 180vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section15 {
    background-image: url('/assets/Members4Mobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 250vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section16 {
    background-image: url('/assets/ContactMobile.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* or whatever height you want */
    width: 100%;
    padding: 0rem;
}

.hero-section17 {
    background-image: url('/assets/ApplyBackground.png'); /* replace with your image path */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    width: 100%;
    padding: 0rem;
}

.custom-btn {
    background-color: rgba(210, 170, 70, 0.705);
    color: white; /* Dark text for contrast — tweak as needed */

    padding: 0.5rem 1.25rem;
    border-radius: 0.0rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

    .custom-btn:hover {
        background-color: rgba(210, 170, 70, 0.705);
        color: white;
    }