/* Target top-level menu items with dropdowns */
.menu-item-has-children > a {
    pointer-events: none; /* Disable click on top-level items */
    color: inherit; /* Keeps color the same as others */
    cursor: default; /* Prevents clickable cursor */
}



.sub-menu {
    background-color: #808080 !important; /* Change blue to grey */
}


/* Ensure dropdowns show on hover */
.menu-item-has-children:hover .sub-menu {
    display: block;
    opacity: 1;
    visibility: visible;
}

.sub-menu {
    display: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    background-color: #EDEDED !important;
}

.menuInner li.dir > .item > a {
    pointer-events: none; /* Disables clickability */
    cursor: default; /* Changes cursor to indicate it’s non-clickable */
    color: inherit; /* Retains link color */
}

/* Disable the 'Membership' link on desktop */
a[href="https://www.nzsae.org.nz/Membership1"] {
    color: #00538C;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

a[href="https://www.nzsae.org.nz/Membership1"] + ul {
    display: none;
    position: absolute;
    background-color: #00538c !important;
    padding: 10px;
    z-index: 1000;
}

/* Show dropdown on hover on desktop */
a[href="https://www.nzsae.org.nz/Membership1"]:hover + ul,
a[href="https://www.nzsae.org.nz/Membership1"]:focus + ul,
a[href="https://www.nzsae.org.nz/Membership1"] + ul:hover {
    display: block;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    a[href="https://www.nzsae.org.nz/Membership1"] {
        pointer-events: auto;
              cursor: pointer;
    }

    a[href="https://www.nzsae.org.nz/Membership1"] + ul {
        display: block;
        position: static;
        background-color: #EDEDED !important;
        padding: 0;
    }

    a[href="https://www.nzsae.org.nz/Membership1"] + ul li {
        pointer-events: auto;
    }
}

/* Disable the 'Programs and Events' link on desktop */
a[href="https://www.nzsae.org.nz/Programs-and-Events"] {
    color: #00538C;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

/* Initially hide the dropdown on desktop */
a[href="https://www.nzsae.org.nz/Programs-and-Events"] + ul {
    display: none;
    position: absolute;
   background-color: #00538C;
    padding: 10px;
    z-index: 1000;
}

/* Show dropdown on hover on desktop */
a[href="https://www.nzsae.org.nz/Programs-and-Events"]:hover + ul,
a[href="https://www.nzsae.org.nz/Programs-and-Events"]:focus + ul,
a[href="https://www.nzsae.org.nz/Programs-and-Events"] + ul:hover {
    display: block;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    a[href="https://www.nzsae.org.nz/Programs-and-Events"] {
        pointer-events: auto;
        cursor: pointer;
    }

    a[href="https://www.nzsae.org.nz/Programs-and-Events"] + ul {
        display: block;
        position: static;
        background-color: #EDEDED !important;
        padding: 0;
    }

    a[href="https://www.nzsae.org.nz/Programs-and-Events"] + ul li {
        pointer-events: auto;
    }
}


/* Disable the 'Career Centre' link on desktop */
a[href="https://www.nzsae.org.nz/careercentre"] {
    color: #00538C;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

/* Initially hide the dropdown on desktop */
a[href="https://www.nzsae.org.nz/careercentre"] + ul {
    display: none;
    position: absolute;
    background-color: #00538C !important;
    padding: 10px;
    z-index: 1000;
}

/* Show dropdown on hover on desktop */
a[href="https://www.nzsae.org.nz/careercentre"]:hover + ul,
a[href="https://www.nzsae.org.nz/careercentre"]:focus + ul,
a[href="https://www.nzsae.org.nz/careercentre"] + ul:hover {
    display: block;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    a[href="https://www.nzsae.org.nz/careercentre"] {
        pointer-events: auto;
        cursor: pointer;
    }

    a[href="https://www.nzsae.org.nz/careercentre"] + ul {
        display: block;
        position: static;
        background-color: #EDEDED !important;
        padding: 0;
    }

    a[href="https://www.nzsae.org.nz/careercentre"] + ul li {
        pointer-events: auto;
    }
}

/* Disable the 'Resources' link on desktop */
a[href="https://www.nzsae.org.nz/Resources1"] {
    color: #00538C;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

/* Initially hide the dropdown on desktop */
a[href="https://www.nzsae.org.nz/Resources1"] + ul {
    display: none;
    position: absolute;
    background-color: #00538c !important;
    padding: 10px;
    z-index: 1000;
}

/* Show dropdown on hover on desktop */
a[href="https://www.nzsae.org.nz/Resources1"]:hover + ul,
a[href="https://www.nzsae.org.nz/Resources1"]:focus + ul,
a[href="https://www.nzsae.org.nz/Resources1"] + ul:hover {
    display: block;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    a[href="https://www.nzsae.org.nz/Resources1"] {
        pointer-events: auto;
        cursor: pointer;
    }

    a[href="https://www.nzsae.org.nz/Resources1"] + ul {
        display: block;
        position: static;
        background-color: #EDEDED !important;
        padding: 0;
    }

    a[href="https://www.nzsae.org.nz/Resources1"] + ul li {
        pointer-events: auto;
    }
}

/* Disable the 'Sponsors' link on desktop */
a[href="https://www.nzsae.org.nz/Sponsors"] {
    color: #00538C;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

/* Initially hide the dropdown on desktop */
a[href="https://www.nzsae.org.nz/Sponsors"] + ul {
    display: none;
    position: absolute;
    background-color: #00538c !important;
    padding: 10px;
    z-index: 1000;
}

/* Show dropdown on hover on desktop */
a[href="https://www.nzsae.org.nz/Sponsors"]:hover + ul,
a[href="https://www.nzsae.org.nz/Sponsors"]:focus + ul,
a[href="https://www.nzsae.org.nz/Sponsors"] + ul:hover {
    display: block;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    a[href="https://www.nzsae.org.nz/Sponsors"] {
        pointer-events: auto;
        cursor: pointer;
    }

    a[href="https://www.nzsae.org.nz/Sponsors"] + ul {
        display: block;
        position: static;
        background-color: #EDEDED !important;
        padding: 0;
    }

    a[href="https://www.nzsae.org.nz/Sponsors"] + ul li {
        pointer-events: auto;
    }
}

/* Disable the 'Home' link on desktop */
a[href="https://www.nzsae.org.nz/"] {
    color: #00538C;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

/* Initially hide the dropdown on desktop */
a[href="https://www.nzsae.org.nz/"] + ul {
    display: none;
    position: absolute;
    background-color: #00538c !important; 
    padding: 10px;
    z-index: 1000;
}

/* Show dropdown on hover on desktop */
a[href="https://www.nzsae.org.nz/"]:hover + ul,
a[href="https://www.nzsae.org.nz/"]:focus + ul,
a[href="https://www.nzsae.org.nz/"] + ul:hover {
    display: block;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    a[href="https://www.nzsae.org.nz/"] {
        pointer-events: auto;
        cursor: pointer;
    }

    a[href="https://www.nzsae.org.nz/"] + ul {
        display: block;
        position: static;
        background-color: transparent;
        padding: 0;
    }

    a[href="https://www.nzsae.org.nz/"] + ul li {
        pointer-events: auto;
    }
}

.WaGadgetContactProfile .memberDetailsTabsOuterContainer ul.memberDetailsTabMenu li {
    display: inline-block;
    margin: 0 1em 0 0;
    vertical-align: top;
    font-weight: bold; /* Make headings bold */
    font-size: 20px;
}

.camera_commands, .camera_next, .camera_prev {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 50px;
    height: 50px;
    margin-top: -25px;
    background: #00538C;
    cursor: pointer;
}

/* Custom styles for dropdown menu items in WaGadgetMenuHorizontal */
body .WaGadgetMenuHorizontal .menuInner ul.secondLevel > li > .item > a {
    font: normal 18px 'Barlow', sans-serif !important; /* Apply Barlow font */
    text-transform: capitalize !important; /* Capitalize the first letter of each word */
    color: #F56F6C; /* Default text color */
    transition: color 0.3s ease; /* Smooth transition for hover */
}

/* Hover effect for dropdown menu items */
body .WaGadgetMenuHorizontal .menuInner ul.secondLevel > li > .item > a:hover {
    color: white !important; /* Change text color to white on hover */

}

@font-face {
    font-family: 'Barlow';
    src: url('/resources/Fonts/Barlow/372C70_0_0.ttf') 
         url('/resources/Fonts/Barlow/Barlow-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Aptos Font */
@font-face {
    font-family: 'Aptos';
    src: url('/resources/Fonts/Aptos/372C70_0_0.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Aptos';
    src: url('/resources/Fonts/Aptos/Aptos-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Barlow Font */
@font-face {
    font-family: 'Barlow';
    src: url('/resources/Fonts/Barlow/372C70_0_0.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('/resources/Fonts/Barlow/Barlow-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Barlow';
    src: url('/resources/Fonts/Barlow/Barlow-Regular.woff2') format('woff');
    font-weight: normal;
    font-style: normal;
}

.boxBodyInfoContainer {
    height: auto; /* Allow the container to dynamically adjust its height based on content */
    background-color: #ffffff !important; /* Ensure the background stays white */
    padding: 20px; /* Keep the padding for spacing */
    border-radius: 5px; /* Rounded corners */
    font-family: 'Barlow Regular', sans-serif; /* Apply Barlow font */
    font-size: 18px; /* Set the font size */
}

.boxInfoContainer .boxInfo .eventInfoBoxValue,
.boxInfoContainer .boxInfo .eventInfoBoxLabel {
    font-family: 'Barlow Regular', sans-serif; /* Apply Barlow font */
    font-size: 18px; /* Increase font size */
    color: #00538c; /* Text color */
}

.boxInfoContainer .boxInfo .eventInfoBoxValue strong {
    font-size: 18px; /* Slightly larger font for important details */
}

.boxInfoContainer {
    padding: 10px; /* Padding inside the info box */
    background-color: #EDEDED !important; /* Light grey background with !important */
}

/* Change the background to light grey */
#idEventsTitleMainContainer {
    background-color: #f0f0f0; /* Light grey background */
    padding: 20px; /* Add padding around the container */
}

/* Style the event title */
#idEventsTitleMainContainer .pageTitleContainer.eventsTitleContainer .pageTitle {
    font-family: 'Barlow Regular', sans-serif !important; /* Apply the Barlow Regular font */
    font-size: 24px !important; /* Increase font size */
    color: #00538C !important; /* Text color */
    text-align: center; /* Center the text */
}

/* Style the 'Back' link */
#idEventBackContainer .eventBackLink {
    font-family: 'Barlow Regular', sans-serif !important; /* Apply the Barlow Regular font */
    font-size: 18px !important; /* Increase font size */
    color: #00538C !important; /* Text color */
    text-decoration: none; /* Remove underline */
}

#idEventBackContainer .eventBackLink:hover {
    color: #f56f6c !important; /* Change color on hover */
}

/* Style the 'Add to my calendar' dropdown */
#idEventViewSwitcher .pageViewSwitcherContainer .ui.dropdown .text {
    font-family: 'Barlow Regular', sans-serif !important; /* Apply the Barlow Regular font */
    font-size: 20px !important; /* Increase font size */
    color: #00538C !important; /* Text color */
}

/* Dropdown menu item styling */
#idEventViewSwitcher .pageViewSwitcherContainer .ui.dropdown .menu .item .text {
    font-family: 'Barlow Regular', sans-serif !important; /* Apply the Barlow Regular font */
    font-size: 18px !important; /* Increase font size */
    color: #00538C !important; /* Text color */
}

.eventDetailsLink {
    font-size: 28px; /* Increase the text size */
    color: #00538c; /* Change the text color to the specific blue */
    text-decoration: none; /* Remove underline */
}

.eventDetailsLink::after {
    content: " \25BC"; /* Unicode for downward-facing arrow */
    font-size: 18px; /* Size of the arrow */
    padding-left: 5px; /* Space between text and arrow */
    color: #00538C; /* Arrow color to match the text */
}

/* Apply Barlow font to all links within the specific div */
.gadgetStyleBody .title a {
    font-family: 'Barlow Regular', sans-serif; /* Apply Barlow font */
    font-size: 18px; /* Adjust font size as needed */
    color: #00538C; /* Set text color to your preferred color */
    text-decoration: none; /* Remove underline */
}

/* Optional: Hover effect for all links within the div */
.gadgetStyleBody .title a:hover {
    color: #f56f6c; /* Change text color on hover */
}

/* Apply Barlow font to the entire subscription form */
#FunctionalBlock1_ctl00_subscriptionForm_Section16449191, 
#FunctionalBlock1_ctl00_subscriptionForm_Section16449191 * {
    font-family: 'Barlow', sans-serif !important; /* Apply Barlow font */
    font-size: 16px; /* Adjust the font size as needed */
}

/* Apply Barlow font and set text color to #00538c for all text within the specified container */
.sectionOuterContainer,
.sectionOuterContainer * {
    font-family: 'Barlow', sans-serif !important; /* Apply Barlow font */
    color: #00538c !important; /* Change text color to #00538c */
}

/* Apply Barlow font to the entire section */
#FunctionalBlock1_ctl00_subscriptionForm_Section16449193,
#FunctionalBlock1_ctl00_subscriptionForm_Section16449193 * {
    font-family: 'Barlow', sans-serif !important; /* Apply Barlow font */
    font-size: 16px; /* Adjust the font size as needed */
}

.WaGadgetRecentBlogPosts .date span {
    white-space: nowrap; /* Prevent text from wrapping */
    overflow: hidden; /* Hide overflow content */
    display: inline-block; /* Ensure inline display */
    max-width: 100px; /* Adjust width as needed to show the full date */
}

#idInfoContainer .infoOuterContainer, 
#idInfoContainer .infoContainer {
    background-color: #00538C; /* Change to your desired color */
}



/* Change the background color for the specific info container */
#idInfoContainer {
    background-color: #00538C !important; /* Set background color to #00538C */
}

/* Ensure text within this container remains readable */
#idInfoContainer .infoText,
#idInfoContainer .infoTitle,
#idInfoContainer .textLine {
    color: #ffffff; /* Optional: Set text color to white for better contrast */
    font-family: 'Barlow', sans-serif; /* Ensure font is set to Barlow */
}

/* Adjust font size, boldness for headings, and reduce margin */
.sectionContainer .fieldLabel span {
    font-size: 16px; /* Adjust to preferred size */
    font-weight: bold; /* Make headings bold */
    line-height: 1.2; /* Reduce line height for closer spacing */
    margin-bottom: 0px; /* Remove or reduce bottom margin */
}

/* Adjust font size, line height, and reduce margin for body text */
.sectionContainer .fieldBody span {
    font-size: 16px; /* Adjust to preferred size */
    font-weight: normal; /* Keep body text normal */
    line-height: 1.2; /* Reduce line height for closer spacing */
    margin-bottom: 0px; /* Remove or reduce bottom margin */
}

/* Remove padding and margins from container elements */
.fieldContainer, .fieldSubContainer {
    margin: 0px; /* Remove margins */
    padding: 0px; /* Remove padding */
}

/* Apply Barlow font to commonMessageBox and its contents and increase font size */
.commonMessageBox,
.commonMessageBox .text,
.commonMessageBox .buttons,
.commonMessageBox .confirmWindowWarning {
    font-family: 'Barlow', sans-serif; /* Apply Barlow font */
    font-size: 16px; /* Increase the font size */
}

/* Optionally, adjust the font size for specific elements if needed */
.commonMessageBox .text {
    font-size: 18px; /* Slightly larger for text elements */
}

/* Apply Barlow font and increase font size for specific table row */
tr.noLine,
tr.noLine td,
tr.noLine td span,
tr.noLine td div,
tr.noLine td a {
    font-family: 'Barlow', sans-serif; /* Apply Barlow font */
    font-size: 16px; /* Increase font size */
}

/* Change hover background color to #F56F6C and text color to white */
tr.noLine:hover,
tr.noLine:hover td,
tr.noLine:hover td span,
tr.noLine:hover td div,
tr.noLine:hover td a {
    background-color: #F56F6C !important; /* Set hover background color */
    color: white !important; /* Set text color to white on hover */
}

/* Apply Barlow font and increase font size */
tr.bottomRow,
tr.bottomRow td {
    font-family: 'Barlow', sans-serif; /* Apply Barlow font */
    font-size: 16px; /* Increase font size */
}

/* Change hover background color to #F56F6C and text color to white */
tr.bottomRow:hover,
tr.bottomRow:hover td {
    background-color: #F56F6C !important; /* Set hover background color */
    color: white !important; /* Set text color to white on hover */
}

/* Apply Barlow font and increase font size to all table rows */
tbody tr,
tbody td {
    font-family: 'Barlow', sans-serif; /* Apply Barlow font */
    font-size: 16px; /* Increase font size */
}

/* Apply Barlow font and increase font size to all table rows */
tbody tr,
tbody td {
    font-family: 'Barlow', sans-serif; /* Apply Barlow font */
    font-size: 16px; /* Increase font size */
}

[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] blockquote:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] dl:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] form:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h1:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h2:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h3:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h4:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h5:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] h6:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] ol:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] p:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] pre:last-child, 
[class*="WaGadget"]:not(.WaGadgetHeadline) [class*='EditableArea'] ul:last-child {
    font-family: 'Barlow', sans-serif !important;
}
.memberDetailsTabMenu a,
.memberDetailsTabMenu span,
.memberDetailsTabMenu li {
    font-family: 'Barlow', sans-serif !important;
}
<style>
.memberDetailsTabMenu a,
.memberDetailsTabMenu span,
.memberDetailsTabMenu li {
    font-family: 'Barlow', sans-serif !important;
}
</style>

/* Apply Barlow font to all elements with the class 'Barlow-font' */
.Barlow-font {
    font-family: 'Barlow', sans-serif; /* Replace 'Barlow' with the exact name of your font */
}

/* Apply Barlow font specifically to your button and text elements */
.stylizedButton.Barlow-font, 
.stylizedButton.Barlow-font span, 
.stylizedButton.Barlow-font font {
    font-family: 'Barlow', sans-serif; /* Ensure all nested elements use Barlow font */
    color: #FFFFFF; /* Set text color to white */
    font-size: 18px; /* Set default font size, adjust as needed */
}

/* Ensure specific sizes for icons and text within the button */
.stylizedButton.Barlow-font font[face="WA-theme-icons"] {
    font-size: 16px; /* Adjust icon font size */
}

.stylizedButton.Barlow-font font[style*="font-size: 28px;"] {
    font-size: 28px; /* Ensure specific text is sized correctly */
}

/* Apply Barlow font to specific link by its ID */
#FunctionalBlock1_ctl00_eventPageViewBase_ctl00_ctl00_UpcomingEventsRepeater_ctl01_eventDetailsLink {
    font-family: 'Barlow', sans-serif; /* Replace 'Barlow' with the exact font name if different */
}

/* Apply Barlow font to specific link by its ID */
#FunctionalBlock1_ctl00_eventPageViewBase_ctl00_ctl00_eventListViewSwitcher_calendarModeLink {
    font-family: 'Barlow', sans-serif; /* Replace 'Barlow' with the exact font name if different */
}

#FunctionalBlock1_ctl00_eventPageViewBase_ctl00_ctl00_UpcomingEventsRepeater_ctl02_footerEventDetailsLink {
    font-family: 'Barlow', sans-serif;
}

#idFooterPoweredByWA {
    font-family: 'Barlow', sans-serif;
    font-size: 16px; /* Adjust the size as needed */
}

#idFooterPoweredByWA a {
    font-family: 'Barlow', sans-serif;
    font-size: 16px; /* Adjust the size as needed */
}

input[type="text"], .emailTextBoxControl {
    font-family: 'Barlow', sans-serif !important;
    font-size: 16px !important; /* Adjust the size as needed */
}

a[href="https://www.nzsae.org.nz/Blog/13397535"] {
    font-family: 'Barlow', sans-serif;
}

/* This targets all anchor tags that are blog headings */
a[href*="Blog"] {
    font-family: 'Barlow', sans-serif;
}

a#FunctionalBlock1_ctl00_blogPostView_title_backLink {
    font-family: 'Barlow', sans-serif;
}

h4.boxHeaderTitle {
    font-family: 'Barlow', sans-serif !important;
}

.actionButtonContainer input[type="submit"] {
    background-color: #EDEDED !important; /* Background color */
    color: #F56F6C !important; /* Text color */
    font-family: 'Barlow', sans-serif; /* Font family */
    font-size: 16px; /* Font size */
    border: none !important; /* Remove any border */
    padding: 4px 10px; /* Adjust the padding to make the button smaller */
    border-radius: 2px; /* Optional: Add a slight border-radius for rounded corners */
    margin-top: 10px; /* Add space above the button */
}
.memberDirectoryDetailsLink {
    font-family: 'Barlow', sans-serif !important; /* Change font to Barlow */
    font-size: 24px !important; /* Increase font size */
   font-weight: bold; /* Make headings bold */
}

.fieldBody span {
    font-family: 'Barlow', sans-serif !important; /* Change font to Barlow */
    font-size: 20px !important; /* Set font size to 20px */
}

.fieldBody span,
#FunctionalBlock1_ctl00_ctl00_Subscriptions_eventReminders_frontLabel {
    font-family: 'Barlow', sans-serif !important; /* Change font to Barlow */
    font-size: 20px !important; /* Set font size to 20px */

}

/* Apply Barlow font to the entire website */
body, 
input, 
textarea, 
button, 
select, 
a, 
div, 
span, 
h1, h2, h3, h4, h5, h6, 
p, 
ul, ol, li, 
table, th, td, 
label, 
form {
    font-family: 'Barlow', sans-serif !important; /* Set Barlow font globally */
}

#FunctionalBlock1_ctl00_ctl00_Subscriptions_emailNews_frontLabel {
    font-family: 'Barlow', sans-serif !important; /* Set font to Barlow */
    font-size: 20px !important; /* Set font size to 18px */
}

tr.normal:hover, tr.normal:hover td {
    background-color: transparent !important; /* Remove background color on hover */
    color: inherit !important; /* Keep text color unchanged */
}

/* Remove hover effect specifically for table rows with class 'normal' */
tr.normal:hover {
    background-color: none !important; /* Remove any background color on hover */
}

/* Reset background-color to the default */
tr.normal {
    background-color: transparent !important; /* Ensure default state is transparent */
}

/* Targeting the specific link when hovered */
a[title="Go to member details"]:hover {
    color: white !important; /* Change font color to white */
}

img[src*=".jpg"],
img[src*=".jpeg"],
img[src*=".png"] {
    transition: transform 0.3s ease; /* Smooth transition */
}

img[src*=".jpg"]:hover,
img[src*=".jpeg"]:hover,
img[src*=".png"]:hover {
    transform: scale(1.05); /* Slightly enlarge the image on hover */
}

.camera_wrap.camera_charcoal_skin {
    background-color: white !important; /* Change the background to white */
}

/* To hide the author's name */
.boxInfoContainer .postedByLink {
    display: none; /* Hides the author's name */
}

/*<div class="inner">
    <div class="blogPostBody gadgetBlogEditableArea">
        <p><font face="Barlow" style="font-size: 18px;">Joining a membership organisation, whether it's a professional body or an industry/trade association, can be a transformative step for individuals and businesses in New Zealand. These organisations offer invaluable opportunities for networking, professional development, and advocacy. However, despite these benefits, many potential members hesitate to join. Understanding the reasons behind this hesitation is crucial for organisations looking to grow their membership base. In this blog, we'll explore 20 common reasons why people don't join membership organisations and provide practical solutions to address these concerns.</font></p>

        <p><font><strong><font face="Barlow" style="font-size: 18px;">1. Lack of Awareness</font></strong></font></p>

        <!-- Continue with the rest of your content -->
    </div>
</div>

}

/* Override the inline styles in the <font> tag inside the blog area */
div.blogPostBody font {
    font-size: 22px !important;
    font-family: 'Barlow', sans-serif !important;
}

/* Optional: Adjust line-height for better readability */
div.blogPostBody font {
    line-height: 1.6 !important;
}




/* Hide the author name in the gadget blog area */
#id_JBjnfUS .gadgetStyleBody .author {
    display: none !important;
}

/* Hide the date in the gadget blog area */
#id_JBjnfUS .gadgetStyleBody .date {
    display: none !important;
}

/* Increase font size for blog titles in the gadget blog area */
#id_JBjnfUS .gadgetStyleBody .title a {
    font-size: 22px !important;  /* Adjust size as needed */
    font-weight: normal !important; /* Optional: make titles bold */
}

/* Increase font size for dates in the gadget blog area */
#id_JBjnfUS .gadgetStyleBody .date span {
    font-size: 22px !important;  /* Adjust size as needed */
}

/* Increase font size for author names in the gadget blog area */
#id_JBjnfUS .gadgetStyleBody .author a {
    font-size:22px !important;  /* Adjust size as needed */
}


/* Forcefully hide the "Upcoming events" heading */
.gadgetStyleNone .gadgetStyleTitle h4.gadgetTitleH4 {
    display: none !important;
}

/* Increase the font size for event titles, dates, and locations */
#id_sCFvS9G .gadgetStyleBody,
#id_sCFvS9G .gadgetStyleBody * {
    font-size: 22px !important;
    font-family: 'Barlow', sans-serif !important;
}

/* Ensure links inherit the same font and size */
#id_sCFvS9G .gadgetStyleBody .title a {
    font-family: inherit !important;
    font-size: inherit !important;
}

.gadgetStyleBody {
    padding-top: 0 !important; /* Remove any padding at the top */
    margin-top: 0 !important;  /* Remove any margin at the top */
}

.gadgetStyleBody ul {
    padding-top: 0 !important; /* Ensure no padding inside the list */
    margin-top: 0 !important;  /* Ensure no margin inside the list */
}








/* Reset any padding or margin causing issues */
.boxInfoContainer, .blogPostBody {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* Reset specific box styles */
.boxInfoContainer ul, .blogPostBody ul {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    background: transparent !important;
}

/* Specific event container styling */
.boxInfoContainer {
    border: 1px solid #00538C; /* Solid border */
    background-color: #ffffff; /* White background */
    padding: 20px; /* Padding for better visibility */
    margin-bottom: 20px; /* Space between event boxes */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Optional shadow */
    max-width: 100%; /* Ensure container takes full width */
}

/* Adjust the font size and layout for event details */
.boxInfo .eventInfoBoxLabel, .boxInfo .eventInfoBoxValue {
    font-size: 18px !important; /* Increase font size */
    color: #333333; /* Ensure visible text */
    display: block; /* Ensure block layout for clarity */
}

/* Specific blog container styling */
.blogPostBody {
    padding: 20px !important; /* Proper padding for blog section */
    background-color: #f9f9f9; /* Light grey background */
    border: 1px solid #e0e0e0; /* Light border around blog */
    margin-top: 20px; /* Spacing between blogs */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Optional shadow */
}

/* Ensure blog content titles and text are styled properly */
.blogPostBody .title a {
    font-size: 22px !important; /* Larger font for titles */
    color: #00538C; /* Ensure blog titles are blue */
    font-weight: bold; /* Make titles bold */
}

.blogPostBody .date, .blogPostBody .author {
    font-size: 22px; /* Date and author font size */
    color: #999999; /* Light grey for meta info */
}
.boxInfoContainer {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    border: none !important; /* This removes the blue line */
}

/* Force display of the event container and its contents */
.boxInfoContainer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background-color: transparent !important; /* Ensure background is visible */
    padding: 20px !important;
}

.boxInfoContainer ul.boxInfo {
    display: block !important;
    visibility: visible !important;
    list-style-type: none !important; /* Remove bullet points */
    padding: 0 !important;
    margin: 0 !important;
}

.boxInfoContainer ul.boxInfo li {
    display: block !important;
    visibility: visible !important;
    padding: 10px 0 !important; /* Add some space between items */
    color: #00538C !important; /* Ensure text color is visible */
    font-size: 18px !important;
}

.eventInfoBoxValue {
    display: block !important;
    visibility: visible !important;
    font-size: 18px !important; /* Ensure text is large enough */
    color: #00538C !important; /* Ensure text color is visible */
}

.eventInfoStartDate, .eventInfoStartTime, .eventInfoLocation {
    display: block !important;
    visibility: visible !important;
    padding: 10px 0 !important; /* Add padding for spacing */
    color: #00538C !important; /* Ensure text color is visible */
}

/* Target the register button within the event page */
input[type="button"].registerButton {
    background-color: lightgrey !important; /* Set background color to light grey */
    color: black !important; /* Set text color to black */
    border: none !important; /* Remove any border */
}


.blogPostBody * {
    font-size: 22px !important;
    font-family: 'Barlow', sans-serif !important;
}

div.text[role="alert"] {
    background-color: #F56F6C; /* Coral color */
    color: #ffffff; /* White text for better contrast */
    padding: 10px; /* Add some padding for spacing */
    border-radius: 5px; /* Rounded corners */
    font-weight: bold; /* Make the text bold */
    display: inline-block; /* Make the background fit the text size */
}

/* Increase the font size for the blog title */
.gadgetStyleBody .title a {
    font-family: 'Barlow', sans-serif !important;
    font-size: 22px !important;
    color: #00538C; /* Optional: set the text color if needed */
    text-decoration: none; /* Optional: remove underline */
}


/* Hide the author section */
.gadgetStyleBody .author {
    display: none !important;
}

/* Optional: Increase the font size for the date */
.gadgetStyleBody .date span {
    font-family: 'Barlow', sans-serif !important;
    font-size: 18px !important;
}

/* Hide the date section */
.gadgetStyleBody .date {
    display: none !important;
}

ul {
    margin-top: -10px; /* Adjust the value as needed to lift the whole block */
    padding-top: 0px; /* Ensure no padding at the top */
}

ul li {
    padding-top: 0 !important; /* Remove any padding at the top of the list items */
    margin-top: 0 !important;  /* Remove any extra margin at the top */
}


#id_mLayout {
    max-width: 110% !important; /* Increase the width by 10% */
    margin: 0 auto; /* Center the layout */
}



.menuInner ul.firstLevel li {
    padding: 0 10px !important; /* Adjust the padding between items */
}

.menuInner ul.firstLevel a {
    font-size: 16px !important; /* Slightly reduce the font size */
}

.inner {
    margin-bottom: 18px; /* Adjust the value to set the gap size */
}



/* Style for membership category headings */
strong.labelTitle span {
    font-weight: bold !important;
    color: #252932 !important;
    font-size: 22px !important; /* Increase font size for the main headings */
    display: block !important; /* Ensure the heading is on its own line */
    margin-bottom: 5px !important; /* Adjust space between heading and the next line */
}

/* Style for subtext under the price (sub-heading) */
strong.labelSubTitle span {
    font-size: 18px !important; /* Adjust font size for subtext (price) */
    display: block !important;
    font-weight: normal !important; /* Keep it normal weight */
    margin-top: 5px !important;
    font-style: normal !important; /* Ensure font is not italic */
}

/* Style for "Subscription period" and "Recurring" */
span.typeInstruction span {
    font-size: 12px !important; /* Make subtext smaller */
    display: block !important;
    margin-top: 5px !important; /* Space above each instruction */
    font-weight: normal !important;
    color: #555 !important;
    font-style: normal !important; /* Ensure font is not italic */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl00_levelView_price {
    visibility: hidden; /* Hide original price */
    position: relative; /* Preserve space for the replacement content */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl00_levelView_price::after {
    content: "$195.00"; /* Replace with desired price */
    visibility: visible; /* Make replacement visible */
    position: absolute; /* Position the replacement over the hidden content */
    left: 0; /* Align it correctly */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl01_levelView_price {
    visibility: hidden; /* Hide original price */
    position: relative; /* Preserve space for the replacement content */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl01_levelView_price::after {
    content: "$75.00"; /* Replace with desired price */
    visibility: visible; /* Make replacement visible */
    position: absolute; /* Position the replacement over the hidden content */
    left: 0; /* Align it correctly */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl02_levelView_price {
    visibility: hidden; /* Hide original price */
    position: relative; /* Preserve space for the replacement content */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl02_levelView_price::after {
    content: "$395.00"; /* Replace with desired price */
    visibility: visible; /* Make replacement visible */
    position: absolute; /* Position the replacement over the hidden content */
    left: 0; /* Align it correctly */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl03_levelView_price {
    visibility: hidden; /* Hide original price */
    position: relative; /* Preserve space for the replacement content */
}

#FunctionalBlock1_ctl00_memberApplicationMain_ctl00_stepTemplate_levelListView_membershipLevelsRepeater_ctl03_levelView_price::after {
    content: "$850.00"; /* Replace with desired price */
    visibility: visible; /* Make replacement visible */
    position: absolute; /* Position the replacement over the hidden content */
    left: 0; /* Align it correctly */
}

@font-face {
    font-family: 'Barlow';
    src: url('path/to/font.woff2') format('woff2');
    font-display: swap; /* Ensures fallback font is used until Barlow loads */
}
body, p, h1, h2, h3, h4, a, span {
    font-family: 'Barlow', sans-serif;
}

.menuInner ul.firstLevel {
    display: flex;
    flex-wrap: wrap; /* Allows items to wrap when they overflow */
    justify-content: space-between;
}
.menuInner ul.firstLevel li {
    margin: 0 10px;
    font-size: 18px;
}
/* For small screens, reduce the font and padding */
@media (max-width: 768px) {
    .menuInner ul.firstLevel li {
        font-size: 16px;
    }
    .menuInner {
        padding: 0 5px;
    }
}

.stylizedButton {
    background-color: #00538C;
    color: #ffffff;
    padding: 8px 15px;
    font-size: 18px;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    text-decoration: none;
}
.stylizedButton:hover {
    background-color: #003B63;
    color: #f5f5f5;
}

img, .icon {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}





/* 🌟 Make Specific Placeholders Full Width */
#id_Header1, #id_Footer1, #id_CustomFullWidth {
    width: 100vw !important;
    max-width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto !important;
    position: relative;
}








/* 🌟 Only Resize Images Inside the Specific Wild Apricot Layout */
#id_7TKH8II img,
#id_bdJPLwt img,
#id_H3iL9NL img,
#id_YsU6VPj img {
    max-width: 100% !important; /* Ensures images fit inside their container */
    height: auto !important; /* Keeps aspect ratio */
    display: block;
    margin: 0 auto; /* Centers the image */
}

/* ✅ Prevent Fixed Image Sizes from Overriding This */
#id_7TKH8II img[style],
#id_bdJPLwt img[style],
#id_H3iL9NL img[style],
#id_YsU6VPj img[style] {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
}


.stylizedButton.buttonStyle003 {
    border-radius: 0 !important; /* Removes rounded edges */
    padding: 12px 24px; /* Adjust padding for a balanced look */
    font-size: 24px; /* Ensures text size remains consistent */
    display: inline-block; /* Ensures the button behaves as expected */
    text-align: center; /* Centers the text */
}





/* 🌟 Fix Menu Display Issue on Desktop */
.menuInner {
    display: block !important; /* Ensure menu shows */
    opacity: 1 !important;
    visibility: visible !important;
}

/* 🌟 Ensure Menu Displays on Desktop */
.menuInner ul.firstLevel {
    display: flex !important;
    justify-content: center;
}

/* 🌟 Ensure Dropdowns Show on Hover */
.menuInner ul.secondLevel {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #00538C;
    min-width: 200px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 9999;
}

/* 🌟 Show Dropdowns When Hovering */
li.dir:hover > .item > ul.secondLevel,
li.dir:focus-within > .item > ul.secondLevel {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* 🌟 Menu Styling */
.menuInner ul.firstLevel li {
    position: relative;
    padding: 10px 15px;
}

/* 🌟 Menu Link Styling */
.menuInner ul.firstLevel a {
    text-decoration: none;
    color: white;
    font-weight: bold;
    padding: 10px 15px;
    display: block;
}

/* 🌟 Dropdown Link Styling */
.menuInner ul.secondLevel a {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: white;
    background: #00538C;
}

/* 🌟 Hover Effect */
.menuInner ul.secondLevel a:hover {
    background: #003B63;
    color: white;
}

/* 🌟 Fix Mobile Menu Display */
@media (max-width: 768px) {
    .menuInner {
        flex-direction: column;
    }

    .menuInner ul.firstLevel {
        flex-direction: column;
        text-align: center;
    }

    li.dir:active > .item > ul.secondLevel,
    li.dir:focus-within > .item > ul.secondLevel {
        display: block !important;
    }
}








/* ✅ Prevent Horizontal Scrolling */
html, body {
    overflow-x: hidden !important;
    width: 100% !important;
}

/* ✅ Fix Wide Containers Causing Overflow */
.WaLayoutContainer,
.WaLayoutTable,
.WaTframeContent,
.WaTransparentFrame {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* ✅ Fix Footer Overflow */
.zoneFooter2 {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* ✅ Fix Large Images Causing Overflow */
img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
}

/* ✅ Fix Tables That Cause Overflow */
table {
    max-width: 100%;
    table-layout: fixed !important;
}

@media (max-width: 768px) {
    .sub-menu, 
    a[href="https://www.nzsae.org.nz/Membership1"] + ul, 
    a[href="https://www.nzsae.org.nz/Programs-and-Events"] + ul,
    a[href="https://www.nzsae.org.nz/careercentre"] + ul,
    a[href="https://www.nzsae.org.nz/Resources1"] + ul,
    a[href="https://www.nzsae.org.nz/Sponsors"] + ul {
        background-color: #EDEDED !important; /* Change to the correct light grey */
    }
}




@media (max-width: 768px) {
    /* Ensure only the menu background changes to light grey */
    .menuInner, 
    .menuInner ul, 
    .menuInner .sub-menu, 
    .mobile-menu, 
    .mobile-menu-container, 
    .menu-item-has-children ul {
        background-color: #EDEDED !important;
    }

    /* Ensure dropdown menu items have the correct background */
    .sub-menu li a, 
    .menu-item-has-children ul li a {
        background-color: #EDEDED !important;
        color: #252932 !important; /* Ensure text remains readable */
    }

    /* Ensure hover effect still works */
    .sub-menu li a:hover {
        background-color: #D0D0D0 !important; /* Slightly darker grey */
    }

    /* Override possible inline styles */
    .menuInner[style], 
    .sub-menu[style], 
    .menu-item-has-children ul[style] {
        background-color: #EDEDED !important !important;
    }
}

@media (max-width: 768px) {
    .mobile-menu {
        background-color: #EDEDED !important;
    }
}