body {
    background-image: none;
    //background-color: #ffffff;   
    background-color: #4F4746;
}

.footer {
    background-color: #6fa367;
    background-image: none;
    /* margin-top: auto; */
    margin-top: 0 !important;
}


/* Optional: Changes the color of your page headings (H1, H2, H3, etc.) */
h1, h2, h3, h4, h5, h6 {
    color: #6fa367 !important; /* Replace with your preferred heading hex color */
}

/* Optional: Adds a clean white box behind your main article text to make it pop */
.com-content-article, 
article, 
.view-article {
    background-color: #9A9CA1; /* 90% solid white background box */
    //background-color: #ffffff;
    padding: 25px !important;                               /* Adds padding room inside the box */
    border-radius: 6px !important;                          /* Softens the box corners */
    color: #222222 !important;                              /* Keeps content text dark and sharp */
}


/* 1. Remove background styling from general structural classes to clean up the top bar */
.site-inline, 
#content,
.container-component,
.container-topbar {
    background-image: none !important;
}

.site-inline,
main,
#content,
.container-component {
    background-size: 100% auto !important;
    background-repeat: no-repeat !important;
    background-position: top center !important;
    background-attachment: scroll !important;
    min-height: 80vh !important; /* Guarantees the area takes up at least 80% of the screen height */
}

.container-header {
    background-color: #9A9CA1;
    background-image: none !important;    /* Removes default gradient images if present */
}


/* Changes the main site title and tagline text color */
.container-header .site-title,
.container-header .site-description,
.container-header .navbar-brand {
    color: #000000 !important; */
    font-size: 1rem; /* 1rem = 16px */
}


/** top menu colours **/

/* 1. Base style for all top header main menu navigation links */
.container-header .mod-menu .nav-item a,
.container-header .navbar-nav .nav-link,
.container-header ul.menu li a {
    color: #000000 !important; /* Replace with your primary link color */
    /* background-color: rgba(255, 255, 255, 0.90) !important; /* 90% solid white background box */
    font-weight: 600;          /* Makes the menu links slightly bolder */
}

/* 2. Style when a user hovers their mouse over a menu link */
.container-header .mod-menu .nav-item a:hover,
.container-header .navbar-nav .nav-link:hover,
.container-header ul.menu li a:hover {
    color: #ffffff !important; /* Replace with your desired mouse-hover color */
}

/* 3. Style for the currently active/selected page menu link */
.container-header .mod-menu .nav-item.active > a,
.container-header .navbar-nav .nav-item.active > .nav-link,
.container-header ul.menu li.active a,
.container-header ul.menu li.current a {
    color: #E8EEFC !important; /* green like logo */
    
    /* Simple standard text underline */
    text-decoration: underline !important;
    text-underline-offset: 5px !important; /* Controls how far down the line sits */
}


/**  make top menu right and bottom aligned in the header  **/

/* 1. Force the inner header layout container to establish a 2-column layout */
.header-inner {
    display: grid !important;
    grid-template-columns: 1fr auto !important; /* Logo area on left, menu area on right */
    align-items: end !important;                /* Aligns the baselines of both columns at the bottom */
}

/* 2. Style the branding column so the tagline sits at the very bottom edge */
.container-header .navbar-brand {
    display: flex !important;
    flex-direction: column !important; /* Keeps your 120x120 logo stacked directly over your tagline */
    justify-content: flex-end !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* 3. Drop the main menu down so it perfectly targets the tagline's bottom text height */
.container-header .grid-child.main-menu,
.container-header .navbar-collapse {
    align-self: end !important;          /* Keeps the menu anchored to the bottom edge of the grid */
    margin-bottom: 0 !important;
    padding-bottom: 4px !important;       /* Tweak this pixel value to line up perfectly with your font text baseline */
}

/* 4. Keep your menu links flowing horizontally and aligned right */
.container-header .navbar-nav,
.container-header ul.menu {
    display: flex !important;
    flex-direction: row !important;       /* Ensures text items flow horizontally */
    justify-content: flex-end !important; /* Pushes links to the absolute right side */
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* 1. Shrink the massive global row spacing between the main content and footer layout */
.site-grid {
    --grid-gutter: 1rem !important; /* Forces layout rows closer together */
    row-gap: 1rem !important;
}

/* 2. Strip excess margin/padding from the main content wrappers */
.grid-child.main {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* 3. Pull the navigation buttons wrapper tight to the bottom of the article area */
.com-content-article nav[aria-label="Article navigation"] {
    margin-bottom: 0.5rem !important;
}


/* Collapse the main template grid entirely */
.site-grid {
    grid-gap: 0 !important;
    row-gap: 0 !important;
}

/* Eliminate empty structural container block padding */
.grid-child, .main, main, .body {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    min-height: unset !important;
}

/* Strip article navigation margins */
.com-content-article nav[aria-label="Article navigation"], 
.pagination, .pager {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
}

/* Reset footer top margins to pull it upward */
footer, .footer {
    background-color: #6fa367;
    background-image: none;
    margin-top: 0 !important;
    padding-top: 0.5rem !important; /* Retain just a tiny bit of neat breathing room */
}
/* Adjust the element wrapper inside the footer if extra space remains */
.footer .grid-child {
  padding-top: 0 !important;
  margin-top: 0 !important;
}