/* ============================================================
   NEIGHBORS OF KENILWORTH — WildApricot Custom CSS
   Standard Template Overrides  |  Version 4.0  |  June 2026

   v4 uses exact WildApricot DOM IDs and class names discovered
   by live inspection of the rendered page.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Source+Sans+3:wght@300;400;600&display=swap');

:root {
  --nok-teal:       #00617F;
  --nok-teal-light: #33BAC1;
  --nok-teal-dark:  #004D64;
  --nok-white:      #FFFFFF;
  --nok-bg:         #F5FAFA;
  --nok-text:       #1A1A1A;
  --nok-text-light: #555555;
  --nok-border:     #D4EAED;
}

/* ============================================================
   EXACT WILDAPRICOT DOM OVERRIDES
   These target the actual IDs/classes found in the live page.
   The inline style="background-color:#3F88E8" on #id_Header1
   is the nav bar — we override it here with max specificity.
   ============================================================ */

/* NAV BAR — this is the real selector WA uses */
#id_Header1,
div#id_Header1,
.WaPlaceHolderHeader1,
div.WaPlaceHolderHeader1           { background-color: var(--nok-teal) !important;
                                     background: var(--nok-teal) !important;
                                     border-top: 3px solid var(--nok-teal-light) !important;
                                     border-bottom: none !important;
                                     padding: 0 !important;
                                     margin: 0 !important; }

/* LOGO / TOP HEADER AREA */
#id_Header,
div#id_Header,
.WaPlaceHolderHeader,
div.WaPlaceHolderHeader            { background-color: var(--nok-white) !important;
                                     background: var(--nok-white) !important; }

/* HEADER 2 (below nav, if used) */
#id_Header2,
div#id_Header2,
.WaPlaceHolderHeader2,
div.WaPlaceHolderHeader2           { background-color: var(--nok-white) !important; }

/* Any other WaPlaceholder that might have blue injected */
.WaPlaceHolder[style*="#3F88E8"],
.WaPlaceHolder[style*="3F88E8"],
div[style*="background-color:#3F88E8"],
div[style*="background-color: #3F88E8"] { background-color: var(--nok-teal) !important; }

/* Catch any WA blue variants as inline styles */
[style*="background-color:#3F88E8"] { background-color: var(--nok-teal) !important; }
[style*="background-color: #3F88E8"] { background-color: var(--nok-teal) !important; }
[style*="background-color:#1F7BC0"] { background-color: var(--nok-teal) !important; }
[style*="background-color: #1F7BC0"] { background-color: var(--nok-teal) !important; }
[style*="background-color:#2F8BCB"] { background-color: var(--nok-teal) !important; }
[style*="background-color:#1e78be"] { background-color: var(--nok-teal) !important; }

/* Kill orange anywhere it appears */
[style*="background-color:#FF6600"] { background-color: var(--nok-teal) !important; }
[style*="background-color:#FA6800"] { background-color: var(--nok-teal) !important; }
[style*="color:#FF6600"]            { color: var(--nok-teal-light) !important; }

/* ============================================================
   NAV LINKS inside the WA nav structure
   ============================================================ */
#id_Header1 a,
.WaPlaceHolderHeader1 a            { font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 12px !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.13em !important;
                                     text-transform: uppercase !important;
                                     color: rgba(255,255,255,0.90) !important;
                                     text-decoration: none !important;
                                     border-bottom: none !important;
                                     padding: 18px 18px !important;
                                     display: inline-flex !important;
                                     align-items: center !important;
                                     transition: color 0.2s, background-color 0.2s !important; }

#id_Header1 a:hover,
.WaPlaceHolderHeader1 a:hover      { color: var(--nok-white) !important;
                                     background-color: rgba(51,186,193,0.20) !important; }

#id_Header1 li.active a,
#id_Header1 li.selected a,
#id_Header1 li.selectedItem a,
.WaPlaceHolderHeader1 .selectedItem a,
.WaPlaceHolderHeader1 .active a    { color: var(--nok-teal-light) !important;
                                     background-color: rgba(51,186,193,0.15) !important; }

/* Nav list styling */
#id_Header1 ul,
.WaPlaceHolderHeader1 ul           { list-style: none !important;
                                     margin: 0 !important;
                                     padding: 0 !important;
                                     display: flex !important;
                                     flex-wrap: wrap !important;
                                     justify-content: center !important;
                                     align-items: stretch !important;
                                     background-color: var(--nok-teal) !important; }

#id_Header1 ul li,
.WaPlaceHolderHeader1 ul li        { display: flex !important;
                                     align-items: stretch !important;
                                     margin: 0 !important;
                                     padding: 0 !important; }

/* Dropdown */
#id_Header1 ul ul,
.WaPlaceHolderHeader1 ul ul        { background-color: var(--nok-teal-dark) !important;
                                     position: absolute !important;
                                     z-index: 9999 !important;
                                     min-width: 180px !important;
                                     flex-direction: column !important;
                                     border-top: 2px solid var(--nok-teal-light) !important; }

/* ============================================================
   LOGO — centered in the header
   ============================================================ */
#id_Header,
.WaPlaceHolderHeader               { text-align: center !important;
                                     position: relative !important; }

/* WA logo gadget */
.WaGadgetLogo,
[class*="GadgetLogo"],
[id*="Logo"]                       { display: block !important;
                                     text-align: center !important;
                                     padding: 20px !important; }

.WaGadgetLogo img,
[class*="GadgetLogo"] img          { max-height: 90px !important;
                                     width: auto !important;
                                     display: inline-block !important; }

/* Login widget — top right */
.WaGadgetLogin,
[class*="GadgetLogin"],
[class*="gadgetLogin"]             { position: absolute !important;
                                     top: 16px !important;
                                     right: 24px !important; }

.WaGadgetLogin a,
[class*="GadgetLogin"] a           { color: var(--nok-teal) !important;
                                     fill: var(--nok-teal) !important;
                                     border-bottom: none !important; }

/* Login button styling */
.WaGadgetLogin .WaLoginBtn,
[class*="LoginBtn"]                { background-color: var(--nok-teal) !important;
                                     color: var(--nok-white) !important;
                                     border-color: var(--nok-teal) !important;
                                     font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 11px !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.1em !important;
                                     text-transform: uppercase !important;
                                     padding: 8px 18px !important;
                                     border-radius: 2px !important; }

/* ============================================================
   MOBILE HAMBURGER
   ============================================================ */
.WaMobileMenuBtn,
[class*="MobileMenu"],
[class*="mobileMenu"],
.hamburger, .hamburger-box,
.hamburger-inner,
.hamburger-inner::before,
.hamburger-inner::after            { background-color: var(--nok-teal) !important;
                                     color: var(--nok-white) !important; }

.hamburger-inner,
.hamburger-inner::before,
.hamburger-inner::after            { background-color: var(--nok-white) !important; }

/* ============================================================
   GLOBAL BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'Source Sans 3', Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  color: var(--nok-text) !important;
  background-color: var(--nok-bg) !important;
  margin: 0 !important;
  padding: 0 !important;
}

a         { color: var(--nok-teal) !important; }
a:hover   { color: var(--nok-teal-light) !important; }

/* ============================================================
   CONTENT SECTIONS
   The "Latest Updates" banner section is also blue — fix it
   ============================================================ */

/* WA content section headers/banners that inherit blue */
.WaLayoutContainerOnly[style*="background-color:#3F88E8"],
.WaLayoutContainerOnly[style*="background-color: #3F88E8"] {
  background-color: var(--nok-teal) !important;
}

/* The "Latest Updates" teal-ish section — keep this as our teal */
.WaLayoutContainerOnly             { }

/* Main content area */
#id_Body,
.WaPlaceHolderBody,
.WaPlaceHolderContent,
#id_Content                        { background-color: var(--nok-white) !important; }

/* Content gadgets */
.WaGadgetContent,
.WaGadgetOnly                      { background-color: var(--nok-white) !important; }

/* ============================================================
   FOOTER
   ============================================================ */
#id_Footer,
#id_Footer1,
#id_Footer2,
#id_Footer3,
.WaPlaceHolderFooter,
.WaPlaceHolderFooter1,
.WaPlaceHolderFooter2,
.WaPlaceHolderFooter3              { background-color: var(--nok-teal-dark) !important;
                                     background: var(--nok-teal-dark) !important;
                                     color: rgba(255,255,255,0.78) !important;
                                     border-top: 3px solid var(--nok-teal-light) !important;
                                     padding: 28px 20px !important;
                                     font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 0.82rem !important;
                                     text-align: center !important; }

#id_Footer a, #id_Footer1 a,
.WaPlaceHolderFooter a,
.WaPlaceHolderFooter1 a            { color: var(--nok-teal-light) !important;
                                     border-bottom: none !important; }

#id_Footer a:hover,
.WaPlaceHolderFooter a:hover       { color: var(--nok-white) !important; }

#id_Footer p, .WaPlaceHolderFooter p { color: rgba(255,255,255,0.78) !important; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3                         { font-family: 'Cormorant Garamond', Georgia, serif !important;
                                     font-weight: 300 !important;
                                     color: var(--nok-teal) !important;
                                     line-height: 1.2 !important;
                                     letter-spacing: 0.02em !important; }

h1                                 { font-size: 2.4rem !important;
                                     border-bottom: 2px solid var(--nok-teal-light) !important;
                                     padding-bottom: 10px !important; }
h2                                 { font-size: 1.8rem !important; }
h3                                 { font-size: 1.3rem !important; font-weight: 400 !important; }

h4, h5, h6                         { font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 0.78rem !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.14em !important;
                                     text-transform: uppercase !important;
                                     color: var(--nok-teal-light) !important; }

p                                  { font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 1rem !important;
                                     line-height: 1.75 !important;
                                     color: var(--nok-text) !important; }

/* Content area links */
.WaGadgetContent a,
.WaGadgetOnly a                    { color: var(--nok-teal) !important;
                                     text-decoration: none !important;
                                     border-bottom: 1px solid var(--nok-teal-light) !important; }

.WaGadgetContent a:hover           { color: var(--nok-teal-light) !important; }

/* ============================================================
   BUTTONS
   ============================================================ */
.WaGadgetButton a,
.WaButtonGadget a,
[class*="GadgetButton"] a,
.wa-btn, .button,
input[type="submit"],
input[type="button"],
button                             { font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 0.8rem !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.1em !important;
                                     text-transform: uppercase !important;
                                     background-color: var(--nok-teal) !important;
                                     color: var(--nok-white) !important;
                                     border: 2px solid var(--nok-teal) !important;
                                     padding: 10px 26px !important;
                                     border-radius: 2px !important;
                                     text-decoration: none !important;
                                     border-bottom: none !important; }

.WaGadgetButton a:hover,
.wa-btn:hover, .button:hover,
input[type="submit"]:hover         { background-color: var(--nok-white) !important;
                                     color: var(--nok-teal) !important; }

/* ============================================================
   EVENTS MODULE
   ============================================================ */
.eventItem .eventName a            { font-family: 'Cormorant Garamond', Georgia, serif !important;
                                     font-size: 1.15rem !important;
                                     color: var(--nok-teal) !important;
                                     border-bottom: none !important; }

.eventItem .eventDate,
.eventItem .startDate              { font-size: 0.78rem !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.1em !important;
                                     text-transform: uppercase !important;
                                     color: var(--nok-teal-light) !important; }

/* Event left-border accent (currently pink/red in default theme) */
.eventItem                         { border-left: 3px solid var(--nok-teal-light) !important; }

/* ============================================================
   FORMS
   ============================================================ */
input[type="text"], input[type="email"],
input[type="password"], select,
textarea                           { border: 1px solid var(--nok-border) !important;
                                     border-radius: 2px !important;
                                     font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     padding: 9px 12px !important; }

input:focus, select:focus,
textarea:focus                     { border-color: var(--nok-teal-light) !important;
                                     box-shadow: 0 0 0 3px rgba(51,186,193,0.15) !important;
                                     outline: none !important; }

hr                                 { border: none !important;
                                     border-top: 1px solid var(--nok-border) !important;
                                     margin: 32px 0 !important; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 768px) {
  #id_Header1 ul,
  .WaPlaceHolderHeader1 ul         { flex-direction: column !important; }

  #id_Header1 ul li a,
  .WaPlaceHolderHeader1 ul li a    { padding: 14px 20px !important;
                                     width: 100% !important; }

  .WaGadgetLogin,
  [class*="GadgetLogin"]           { position: static !important;
                                     text-align: center !important; }
}

/* ============================================================
   END NOK CUSTOM CSS v4
   ============================================================ */

/* ============================================================
   v4.1 ADDITIONS — Button, Slideshow, Logo centering
   Append these to the end of your existing v4 CSS
   ============================================================ */

/* JOIN TODAY / STYLED BUTTONS
   .stylizedButton.buttonStyle001 is the exact WA class        */
.stylizedButton,
.stylizedButton.buttonStyle001,
a.stylizedButton,
a.buttonStyle001                   { background-color: var(--nok-teal) !important;
                                     color: var(--nok-white) !important;
                                     border: 2px solid var(--nok-teal) !important;
                                     border-bottom: 2px solid var(--nok-teal) !important;
                                     font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 0.82rem !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.12em !important;
                                     text-transform: uppercase !important;
                                     padding: 12px 30px !important;
                                     border-radius: 2px !important;
                                     text-decoration: none !important; }

.stylizedButton:hover,
a.stylizedButton:hover,
a.buttonStyle001:hover             { background-color: var(--nok-white) !important;
                                     color: var(--nok-teal) !important;
                                     border-color: var(--nok-teal) !important; }

/* SLIDESHOW / PHOTO CAROUSEL
   WA uses the "Camera" jQuery plugin. The blue comes from
   .camera_wrap which inherits the theme color.               */
.camera_wrap,
div.camera_wrap,
.camera_wrap.camera_charcoal_skin  { background-color: transparent !important; }

/* Carousel navigation dots */
.camera_pag,
.camera_pag_ul,
.camera_pag li,
.camera_pag li span                { background-color: rgba(255,255,255,0.5) !important;
                                     border-color: var(--nok-white) !important; }

.camera_pag li.cameracurrent span,
.camera_pag li:hover span          { background-color: var(--nok-teal-light) !important; }

/* Carousel prev/next arrows */
.camera_prev, .camera_next,
.camera_prev span, .camera_next span { background-color: rgba(0,97,127,0.6) !important;
                                       color: var(--nok-white) !important; }

.camera_prev:hover, .camera_next:hover { background-color: var(--nok-teal) !important; }

/* Carousel caption bar */
.camera_caption,
.camera_caption div                { background-color: rgba(0,77,100,0.80) !important; }

/* Any remaining blue on camera plugin */
.camera_wrap *[style*="background-color:#3F88E8"],
.camera_wrap *[style*="background-color: #3F88E8"] { background-color: var(--nok-teal) !important; }

/* LOG IN BUTTON — still showing WA blue                       */
.WaLoginBtn,
[class*="LoginBtn"],
#loginBtn,
.loginButton,
a[href*="Login"],
a[href*="login"]                   { background-color: var(--nok-teal) !important;
                                     color: var(--nok-white) !important;
                                     border-color: var(--nok-teal) !important;
                                     font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 11px !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.1em !important;
                                     text-transform: uppercase !important;
                                     border-radius: 2px !important;
                                     border-bottom: none !important; }

/* LOGO CENTERING
   WA places the logo gadget inside id_Header. The logo
   sits left by default because the login widget shares the
   same row. This centers the logo image itself.              */
#id_Header .WaGadgetLogo,
#id_Header [class*="GadgetLogo"],
.WaPlaceHolderHeader .WaGadgetLogo { width: 100% !important;
                                     text-align: center !important;
                                     display: flex !important;
                                     justify-content: center !important;
                                     align-items: center !important;
                                     padding: 20px 0 !important; }

#id_Header .WaGadgetLogo img,
.WaPlaceHolderHeader .WaGadgetLogo img { display: block !important;
                                          margin: 0 auto !important;
                                          max-height: 100px !important;
                                          width: auto !important; }

/* ============================================================
   END v4.1 ADDITIONS
   ============================================================ */

/* ============================================================
   v4.2 ADDITIONS — Mobile panel orange & blue fixes
   Exact class names confirmed by live DOM inspection
   ============================================================ */

/* THE ORANGE MOBILE BAR
   .mobilePanel is the full-width bar containing the hamburger
   icon and login icon on mobile. Computed bg: rgb(243,140,28) */
.mobilePanel                       { background-color: var(--nok-teal) !important;
                                     border-bottom: 2px solid var(--nok-teal-light) !important; }

/* Hamburger menu icon lines */
.mobilePanelButton.buttonMenu,
.mobilePanelButton                 { color: var(--nok-white) !important; }

/* Login icon in mobile bar */
.mobilePanelButton.buttonLogin,
.mobilePanelButton.buttonLogin *   { color: var(--nok-white) !important;
                                     fill: var(--nok-white) !important; }

/* THE BLUE MOBILE NAV LIST
   .firstLevel is the <ul> that expands when hamburger is tapped.
   Computed bg: rgb(63,136,232) = #3F88E8                       */
.mobilePanel .firstLevel,
.menuInner .firstLevel,
ul.firstLevel                      { background-color: var(--nok-teal-dark) !important;
                                     margin: 0 !important;
                                     padding: 0 !important; }

/* Mobile nav list items */
.mobilePanel .firstLevel li,
ul.firstLevel li                   { background-color: transparent !important;
                                     border-bottom: 1px solid rgba(255,255,255,0.10) !important; }

/* Mobile nav links */
.mobilePanel .firstLevel li a,
.mobilePanel .firstLevel .item,
ul.firstLevel li a,
ul.firstLevel .item a              { font-family: 'Source Sans 3', Arial, sans-serif !important;
                                     font-size: 13px !important;
                                     font-weight: 600 !important;
                                     letter-spacing: 0.1em !important;
                                     text-transform: uppercase !important;
                                     color: rgba(255,255,255,0.90) !important;
                                     padding: 14px 20px !important;
                                     display: block !important;
                                     text-decoration: none !important;
                                     border-bottom: none !important; }

.mobilePanel .firstLevel li a:hover,
ul.firstLevel li a:hover           { background-color: rgba(51,186,193,0.20) !important;
                                     color: var(--nok-white) !important; }

/* Active/current mobile nav item */
.mobilePanel .firstLevel li.sel a,
ul.firstLevel li.sel a             { color: var(--nok-teal-light) !important; }

/* Second level / dropdown in mobile */
.mobilePanel .secondLevel,
ul.secondLevel                     { background-color: var(--nok-teal) !important; }

.mobilePanel .secondLevel li a,
ul.secondLevel li a                { color: rgba(255,255,255,0.85) !important;
                                     padding: 12px 30px !important;
                                     font-size: 12px !important; }

/* ============================================================
   END v4.2 ADDITIONS
   ============================================================ */

/* ============================================================
   v4.3 ADDITIONS — Button underlines, login hover, mobile
   hamburger highlight, RSS hide, hero text overrides
   All fixes from June 2026 session consolidated here
   ============================================================ */

/* BUTTON UNDERLINE FIX
   Global link CSS was adding a border-bottom on hover to
   anything with an <a> tag, including buttons               */
a.buttonStyle001,
a.buttonStyle001:hover,
.stylizedButton,
.stylizedButton:hover,
.WaGadgetButton a,
.WaGadgetButton a:hover,
input[type="submit"],
input[type="button"],
button,
a[style*="border"],
a[style*="border"]:hover,
a[style*="background"],
a[style*="background"]:hover        { border-bottom: none !important;
                                      text-decoration: none !important; }

/* LOGIN BUTTON HOVER — was reverting to WA orange on hover  */
.WaGadgetLogin a.WaLoginBtn:hover,
.WaGadgetLogin a[class*="LoginBtn"]:hover,
a.WaLoginBtn:hover,
a[class*="LoginBtn"]:hover          { background-color: var(--nok-teal-dark) !important;
                                      color: var(--nok-white) !important;
                                      border-color: var(--nok-teal-dark) !important; }

.WaGadgetLogin a:hover *,
[class*="GadgetLogin"] a:hover *    { background-color: var(--nok-teal-dark) !important;
                                      fill: var(--nok-white) !important;
                                      color: var(--nok-white) !important; }



/* MOBILE HAMBURGER HIGHLIGHT
   When tapped, WA highlights the hamburger button in blue.
   Force it to stay teal at all interaction states           */
.mobilePanelButton:hover,
.mobilePanelButton:active,
.mobilePanelButton:focus,
.mobilePanelButton.buttonMenu:hover,
.mobilePanelButton.buttonMenu:active,
.mobilePanelButton.buttonMenu.active { background-color: var(--nok-teal-dark) !important;
                                       color: var(--nok-white) !important; }

/* The highlight/focus ring WA adds when hamburger is tapped */
.mobilePanel .mobilePanelButton:focus,
.mobilePanel .mobilePanelButton:active { outline: none !important;
                                         box-shadow: none !important;
                                         background-color: var(--nok-teal-dark) !important; }

/* Expanded mobile nav container highlight */
.mobilePanel.opened,
.mobilePanel.active,
.mobilePanel.expanded               { background-color: var(--nok-teal) !important; }

/* Kill any blue that appears when mobile nav opens */
.menuInner,
.menuInner.opened,
.menuInner.active                   { background-color: var(--nok-teal-dark) !important; }

/* WA sometimes adds a blue overlay/highlight on tap */
.mobilePanelButton *:focus,
.mobilePanelButton *:active         { background-color: transparent !important;
                                      outline: none !important; }

/* HIDE UNUSED BLOG FEATURES
   RSS icon and Add Post button are not used by NOK          */
.rssIcon,
[class*="rssIcon"],
img[src*="rss"],
img[src*="RSS"],
.WaGadgetBlogPostNew,
[class*="BlogPostNew"]              { display: none !important; }

/* HERO SECTION TEXT OVERRIDES
   Global CSS text-transform and color rules were overriding
   the inline styles inside the teal hero content block      */
\[style*="background-color:#00617F"] p { color: #ffffff !important;
                                          font-size: 1rem !important;
                                          letter-spacing: 0.01em !important;
                                          text-transform: none !important; }

[style*="background-color:#00617F"] a,
[style*="background-color: #00617F"] a { color: #ffffff !important;
                                          border-bottom: none !important;
                                          text-transform: none !important; }

[style*="background-color:#00617F"] a:hover,
[style*="background-color: #00617F"] a:hover { color: rgba(255,255,255,0.80) !important;
                                                border-bottom: none !important; }

/* ============================================================
   END v4.3 ADDITIONS
   ============================================================ *//* ============================================================
   UNIVERSAL BUTTON HOVER BORDER FIX
   WA's own stylesheet adds border-bottom on :hover for buttons.
   This must be at the bottom of the CSS to win the cascade.
   ============================================================ */

a:hover,
a:focus,
a:active                            { border-bottom: none !important; }

/* Restore underline only for plain body text links */
#contentArea a:hover,
.contentArea a:hover,
.WaGadgetContent a:hover            { border-bottom: 1px solid var(--nok-teal-light) !important; }/* Wordmark logo on home page — constrain size */
.WaGadgetImage img,
[class*="GadgetImage"] img          { max-width: 400px !important;
                                      max-height: 160px !important;
                                      width: auto !important;
                                      display: block !important;
                                      margin: 0 auto !important; }/* ============================================================
   HOME PAGE BUTTONS — named classes bypass CSS conflicts
   ============================================================ */
a.nok-btn-solid                    { display:inline-block !important;
                                     background:#00617F !important;
                                     color:#ffffff !important;
                                     font-family:Arial,sans-serif !important;
                                     font-size:0.75rem !important;
                                     font-weight:600 !important;
                                     letter-spacing:0.14em !important;
                                     text-transform:uppercase !important;
                                     padding:16px 36px !important;
                                     border-radius:2px !important;
                                     text-decoration:none !important;
                                     margin:6px !important;
                                     border:2px solid #00617F !important;
                                     border-bottom:2px solid #00617F !important; }
a.nok-btn-solid:hover              { background:#ffffff !important;
                                     color:#00617F !important;
                                     border-color:#00617F !important;
                                     border-bottom:2px solid #00617F !important; }
                                     color:#ffffff !important;
                                     border-color:#004D64 !important;
                                     border-bottom:2px solid #004D64 !important; }

a.nok-btn-ghost                    { display:inline-block !important;
                                     background:#ffffff !important;
                                     color:#00617F !important;
                                     font-family:Arial,sans-serif !important;
                                     font-size:0.75rem !important;
                                     font-weight:600 !important;
                                     letter-spacing:0.14em !important;
                                     text-transform:uppercase !important;
                                     padding:16px 36px !important;
                                     border-radius:2px !important;
                                     text-decoration:none !important;
                                     margin:6px !important;
                                     border:2px solid #00617F !important;
                                     border-bottom:2px solid #00617F !important; }

a.nok-btn-ghost:hover              { background:#00617F !important;
                                     color:#ffffff !important;
                                     border-bottom:2px solid #00617F !important; }/* Event list left accent border */
.eventList .eventItem,
.eventItem                          { border-left-color: var(--nok-teal-light) !important; }/* ============================================================
   v4.4 ADDITIONS — Content-area inline style neutralizer +
   spacing normalization (keeps editing consistent no matter
   who adds content or where they paste it from)
   ============================================================ */

/* Strip inline font-family/font-size Word/Outlook/Docs embed
   on pasted text, so content always falls back to the site's
   typography rules above. */
.WaGadgetContent [style*="font-family"],
.WaGadgetOnly [style*="font-family"]     { font-family: inherit !important; }

.WaGadgetContent [style*="font-size"],
.WaGadgetOnly [style*="font-size"]       { font-size: inherit !important; }

.WaGadgetContent [style*="line-height"],
.WaGadgetOnly [style*="line-height"]     { line-height: inherit !important; }

/* Consistent spacing regardless of how the content was structured */
.WaGadgetContent p, .WaGadgetOnly p      { margin: 0 0 1em 0 !important; }
.WaGadgetContent h1, .WaGadgetOnly h1    { margin: 0 0 0.6em 0 !important; }
.WaGadgetContent h2, .WaGadgetOnly h2    { margin: 1.2em 0 0.5em 0 !important; }
.WaGadgetContent h3, .WaGadgetOnly h3    { margin: 1em 0 0.4em 0 !important; }
.WaGadgetContent ul, .WaGadgetOnly ul,
.WaGadgetContent ol, .WaGadgetOnly ol    { margin: 0 0 1em 0 !important;
                                            padding-left: 1.4em !important; }

/* Collapse the empty paragraphs Word/Outlook leave behind when
   pasting — these are what causes uneven blank space */
.WaGadgetContent p:empty,
.WaGadgetOnly p:empty                    { display: none !important; }
/* 
/* ============================================================
   v4.6 — EVENT REGISTER BUTTON: match on the button's own
   inline background-color, since it has no button class to
   target and something else was overriding its text color
   ============================================================ */
a[style*="background-color: #00617F"],
a[style*="background-color:#00617F"]   { color: #ffffff !important; }