/* ========================================================================== IHI Portal Clean Structural Override - v2 Purpose: Match IHI.org-style shell using current numeric-safe RiSE layout Layout target: .ihi-portal #hd.ihi-header .ihi-header__grid .ihi-header__logo Zone 1 .ihi-header__utility Zone 2 .ihi-header__nav-wrap Zone 3 Load order: LAST, after: 10-UltraWaveResponsive.css 99-GlacierBay_Responsive.css Zzzz_IHI_Lite_Web_Design_Override_v2_corrected.css, if still loaded Notes: - This is shell/header/footer only. - Search stays inside Utility Navigation for this pass. - No broad H1/panel/form/iPart/component cleanup here. ========================================================================== */ /* -------------------------------------------------------------------------- 1. Tokens -------------------------------------------------------------------------- */ .ihi-portal { --ihi-primary: #0081A2; --ihi-primary-dark: #005F74; --ihi-primary-bright: #009FC2; --ihi-accent-light: #CCECF3; --ihi-utility-bg: #E6F4F7; --ihi-utility-border: #D4E9EE; --ihi-dark: #2B3137; --ihi-text: #455560; --ihi-muted: #6B7886; --ihi-border: #BBC1C8; --ihi-white: #FFFFFF; --ihi-surface: #F8F8F8; --ihi-font: "Roboto-Flex", Arial, Helvetica, sans-serif; --ihi-header-max: 1920px; --ihi-header-pad-desktop: 64px; --ihi-header-pad-tablet: 40px; --ihi-header-pad-mobile: 24px; --ihi-utility-height: 44px; --ihi-main-header-height: 104px; } /* -------------------------------------------------------------------------- 2. Global shell reset scoped to this layout -------------------------------------------------------------------------- */ .ihi-portal { display: flex !important; flex-direction: column; min-height: 100vh; height: auto !important; width: 100%; background: var(--ihi-white) !important; } .ihi-portal *, .ihi-portal *::before, .ihi-portal *::after { box-sizing: border-box; } .ihi-portal .ihi-container { box-sizing: border-box; width: 100%; max-width: var(--ihi-header-max); margin-right: auto; margin-left: auto; padding-right: var(--ihi-header-pad-desktop); padding-left: var(--ihi-header-pad-desktop); } .ihi-portal .ihi-container::before, .ihi-portal .ihi-container::after { display: none !important; content: none !important; } /* -------------------------------------------------------------------------- 3. Header reset Force the shell back to IHI.org behavior: light top utility bar + white main header. -------------------------------------------------------------------------- */ .ihi-portal #hd.ihi-header, .ihi-portal header.ihi-header, .ihi-portal .ihi-header, body.Wrapper-HomePage .ihi-portal #hd.ihi-header, body:not(.Wrapper-HomePage) .ihi-portal #hd.ihi-header { position: relative !important; z-index: 1000; display: block !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; background: var(--ihi-white) !important; border: 0 !important; box-shadow: none !important; color: var(--ihi-text) !important; } /* Kill any old dark/teal header background from previous override files */ .ihi-portal #hd.ihi-header *, .ihi-portal .ihi-header * { text-shadow: none; } .ihi-portal .ihi-header .header-container, .ihi-portal .ihi-header .container, .ihi-portal .ihi-header__grid { background: transparent !important; } /* -------------------------------------------------------------------------- 4. Actual current header grid Source order stays 1, 2, 3. Visual order becomes: row 1: Utility row 2: Logo + Primary nav -------------------------------------------------------------------------- */ .ihi-portal .ihi-header__grid { position: relative; z-index: 1; display: grid !important; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "utility utility" "logo nav"; align-items: center; column-gap: 48px; row-gap: 0; width: 100%; max-width: var(--ihi-header-max); margin-right: auto; margin-left: auto; padding-right: var(--ihi-header-pad-desktop); padding-left: var(--ihi-header-pad-desktop); padding-top: 0; padding-bottom: 0; background: var(--ihi-white) !important; overflow: visible; } /* -------------------------------------------------------------------------- 5. Zone 2 Utility row Full-width light aqua row, visually like ihi.org top utility area. -------------------------------------------------------------------------- */ .ihi-portal .ihi-header__utility { grid-area: utility; position: relative !important; z-index: 2; float: none !important; clear: none !important; display: flex !important; align-items: center; justify-content: flex-end; width: 100%; min-height: var(--ihi-utility-height); margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; color: var(--ihi-primary-dark) !important; } /* Full-bleed light utility bar */ .ihi-portal .ihi-header__utility::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%); background: var(--ihi-utility-bg); border-bottom: 1px solid var(--ihi-utility-border); } /* Utility iPart wrappers */ .ihi-portal #auxiliary-container > .WTZone, .ihi-portal #auxiliary-container .ContentItemContainer, .ihi-portal #auxiliary-container .UtilityNavigation { width: auto; max-width: 100%; margin: 0 !important; padding: 0 !important; background: transparent !important; } .ihi-portal #auxiliary-container .UtilityNavigation { display: flex !important; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px 18px; } /* Utility sections should line up horizontally */ .ihi-portal #auxiliary-container .UtilitySection, .ihi-portal #auxiliary-container .UtilityNavigationList, .ihi-portal #auxiliary-container .UtilitySearch { display: flex; align-items: center; margin: 0 !important; padding: 0 !important; background: transparent !important; } /* Clean the utility list */ .ihi-portal #auxiliary-container .NavigationUnorderedList { display: flex !important; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 18px; margin: 0 !important; padding: 0 !important; list-style: none !important; } .ihi-portal #auxiliary-container .NavigationListItem { display: flex; align-items: center; margin: 0 !important; padding: 0 !important; list-style: none !important; } /* Utility links */ .ihi-portal #auxiliary-container a, .ihi-portal #auxiliary-container a:visited, .ihi-portal #auxiliary-container .NavigationLink, .ihi-portal #auxiliary-container .NavigationLink:visited, .ihi-portal #auxiliary-container .nav-text { color: var(--ihi-primary-dark) !important; background: transparent !important; font-family: var(--ihi-font) !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.4 !important; text-decoration: none !important; letter-spacing: 0 !important; padding: 0 !important; } .ihi-portal #auxiliary-container a:hover, .ihi-portal #auxiliary-container a:focus, .ihi-portal #auxiliary-container .NavigationLink:hover, .ihi-portal #auxiliary-container .NavigationLink:focus { color: var(--ihi-dark) !important; background: transparent !important; text-decoration: none !important; } /* Hide desktop account/OBO clutter from the top header. The "Hi, user" utility link remains available in the NavigationList. */ @media (min-width: 768px) { .ihi-portal #auxiliary-container .UtilityAccountArea, .ihi-portal #auxiliary-container .obo-toggle-wrapper, .ihi-portal #auxiliary-container .profile-picture-wrapper, .ihi-portal #auxiliary-container .account-toggle-wrapper, .ihi-portal #auxiliary-container .UtilitySTEToggle, .ihi-portal #auxiliary-container .ste-section { display: none !important; } } /* Desktop: do not show hamburger/search toggles in utility row. Keep these visible below 992px because RiSE collapses nav at tablet/mobile widths. */ @media (min-width: 992px) { .ihi-portal #auxiliary-container .UtilityNavigationToggle { display: none !important; } } /* -------------------------------------------------------------------------- 6. Zone 1 Logo row -------------------------------------------------------------------------- */ .ihi-portal .ihi-header__logo { grid-area: logo; position: static !important; float: none !important; clear: none !important; display: flex !important; align-items: center; justify-content: flex-start; width: 170px; min-width: 170px; max-width: 170px; min-height: var(--ihi-main-header-height); margin: 0 !important; padding: 24px 0 !important; background: var(--ihi-white) !important; } .ihi-portal .ihi-header__logo .WTZone, .ihi-portal .ihi-header__logo .ContentItemContainer { width: 100%; margin: 0 !important; padding: 0 !important; background: transparent !important; } .ihi-portal .ihi-header__logo img, .ihi-portal .ihi-header__logo svg, .ihi-portal #masterHeaderImage { display: block; width: auto; max-width: 170px !important; max-height: 56px !important; height: auto !important; margin: 0 !important; background-color: transparent !important; } /* -------------------------------------------------------------------------- 7. Zone 3 Primary nav row White row, right aligned, no dark background. -------------------------------------------------------------------------- */ .ihi-portal .ihi-header__nav-wrap { grid-area: nav; position: static !important; float: none !important; clear: none !important; display: flex !important; align-items: center; justify-content: flex-end; min-width: 0; min-height: var(--ihi-main-header-height); margin: 0 !important; padding: 24px 0 !important; background: var(--ihi-white) !important; color: var(--ihi-dark) !important; } .ihi-portal .ihi-header__nav-wrap > .WTZone, .ihi-portal .ihi-header__nav-wrap .ContentItemContainer, .ihi-portal .ihi-header__nav-wrap .primary-navigation-area, .ihi-portal .ihi-header__nav-wrap .navbar-collapse, .ihi-portal .ihi-header__nav-wrap .nav-primary, .ihi-portal .ihi-header__nav-wrap #ctl01_ciPrimaryNavigation_NavControl_NavWrapper, .ihi-portal .ihi-header__nav-wrap #ctl01_ciPrimaryNavigation_NavControl_NavMenu, .ihi-portal .ihi-header__nav-wrap .RadMenu { float: none !important; clear: none !important; position: static !important; width: auto !important; min-width: 0; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; color: var(--ihi-dark) !important; } /* Primary RadMenu flow */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup.rmHorizontal { background: transparent !important; border: 0 !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup { display: flex !important; align-items: center; justify-content: flex-end; flex-wrap: nowrap !important; gap: 30px; width: auto !important; white-space: nowrap; margin: 0 !important; padding: 0 !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > li, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > .rmItem { float: none !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; } /* Primary nav visual reset */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink:visited, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink .rmText { color: var(--ihi-dark) !important; background: transparent !important; border: 0 !important; font-family: var(--ihi-font) !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.6 !important; text-transform: none !important; text-decoration: none !important; letter-spacing: 0 !important; padding: 0 !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink:hover, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink:focus, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmFocused, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmExpanded, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmSelected { color: var(--ihi-primary-dark) !important; background: transparent !important; text-decoration: none !important; } /* Dropdown panels, still light cleanup only */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmSlide, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup { background: var(--ihi-white) !important; border: 1px solid var(--ihi-border) !important; box-shadow: 0 12px 28px rgba(32, 39, 46, 0.14); } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink:visited, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmText { color: var(--ihi-dark) !important; background: transparent !important; font-family: var(--ihi-font) !important; text-decoration: none !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink:hover, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink:focus { color: var(--ihi-primary-dark) !important; background: var(--ihi-accent-light) !important; } /* -------------------------------------------------------------------------- 8. Search inside Utility Navigation Keep it controlled, not dark-header styled. -------------------------------------------------------------------------- */ .ihi-portal #auxiliary-container .UtilitySearch, .ihi-portal #auxiliary-container .header-search, .ihi-portal #auxiliary-container .SimpleSearchBlock { background: transparent !important; border: 0 !important; margin: 0 !important; padding: 0 !important; } .ihi-portal #auxiliary-container .search-container-sm { display: inline-block !important; margin: 0 !important; padding: 0 !important; } .ihi-portal #auxiliary-container .search-field, .ihi-portal #auxiliary-container input[type="search"], .ihi-portal #auxiliary-container input[type="text"] { width: 190px; height: 32px; min-height: 32px; margin: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; border: 1px solid rgba(0, 95, 116, 0.24) !important; border-radius: 0 !important; background-color: var(--ihi-white) !important; color: var(--ihi-dark) !important; font-family: var(--ihi-font) !important; font-size: 14px !important; line-height: 32px !important; box-shadow: none !important; } .ihi-portal #auxiliary-container .TextButton { display: none !important; } /* -------------------------------------------------------------------------- 9. Main content -------------------------------------------------------------------------- */ .ihi-portal #masterContentArea.ihi-main, .ihi-portal .ihi-main { flex: 1 0 auto; margin-top: 0 !important; padding-top: 32px; padding-bottom: 32px; background: var(--ihi-white); } .Wrapper-FullWidth .ihi-portal #masterContentArea.container.ihi-main { max-width: 1170px; padding-right: 15px; padding-left: 15px; } /* -------------------------------------------------------------------------- 10. Footer shell -------------------------------------------------------------------------- */ .ihi-portal #ft.ihi-footer, .ihi-portal .ihi-footer { display: block !important; height: auto !important; margin-top: auto; background: var(--ihi-primary-dark) !important; color: var(--ihi-white) !important; } .ihi-portal .ihi-footer__main, .ihi-portal .ihi-footer .footer-content { display: block !important; width: 100%; background: var(--ihi-primary-dark) !important; color: var(--ihi-white) !important; padding-top: 48px; padding-bottom: 32px; } .ihi-portal .ihi-footer__legal, .ihi-portal .ihi-footer .footer-nav-copyright { display: block !important; width: 100%; background: var(--ihi-primary-dark) !important; color: var(--ihi-white) !important; border-top: 1px solid rgba(255, 255, 255, 0.15); padding-top: 16px !important; padding-bottom: 16px !important; } .ihi-portal #ft a, .ihi-portal #ft a:visited, .ihi-portal .ihi-footer a, .ihi-portal .ihi-footer a:visited { color: var(--ihi-white) !important; text-decoration: none !important; } .ihi-portal #ft a:hover, .ihi-portal #ft a:focus, .ihi-portal .ihi-footer a:hover, .ihi-portal .ihi-footer a:focus { color: var(--ihi-accent-light) !important; text-decoration: underline !important; } /* -------------------------------------------------------------------------- 11. Tablet -------------------------------------------------------------------------- */ @media (max-width: 1439px) { .ihi-portal .ihi-container, .ihi-portal .ihi-header__grid { padding-right: var(--ihi-header-pad-tablet); padding-left: var(--ihi-header-pad-tablet); } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup { gap: 24px; } } @media (max-width: 1199px) { .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup { gap: 20px; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink .rmText { font-size: 15px !important; } .ihi-portal #auxiliary-container .search-field, .ihi-portal #auxiliary-container input[type="search"], .ihi-portal #auxiliary-container input[type="text"] { width: 160px; } } /* -------------------------------------------------------------------------- 12. Mobile Clean mobile header behavior: - Keep utility bar visible - Show hamburger + search controls - Draw icons directly so Glacier sprite/icon rules do not blank them out - Hide desktop utility clutter - Keep opened nav/search in document flow -------------------------------------------------------------------------- */ @media (max-width: 991px) { .ihi-portal .ihi-header__grid { grid-template-columns: 1fr; grid-template-areas: "utility" "logo" "nav"; row-gap: 0; padding-right: var(--ihi-header-pad-mobile); padding-left: var(--ihi-header-pad-mobile); background: var(--ihi-white) !important; } /* Hide the logo row only when no actual logo image/SVG is present */ .ihi-portal .ihi-header__logo:not(:has(img)):not(:has(svg)) { display: none !important; min-height: 0 !important; padding: 0 !important; } .ihi-portal .ihi-header__logo { width: 100%; min-width: 0; max-width: none; min-height: 64px; padding-top: 12px !important; padding-bottom: 12px !important; background: var(--ihi-white) !important; } .ihi-portal .ihi-header__logo img, .ihi-portal .ihi-header__logo svg, .ihi-portal #masterHeaderImage { max-width: 140px !important; max-height: 48px !important; } /* Utility row becomes the mobile control bar */ .ihi-portal .ihi-header__utility { grid-area: utility; display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 56px !important; margin: 0 !important; padding: 0 !important; background: transparent !important; visibility: visible !important; opacity: 1 !important; overflow: visible !important; } .ihi-portal .ihi-header__utility::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%); background: var(--ihi-utility-bg, #E6F4F7); border-bottom: 1px solid var(--ihi-utility-border, #D4E9EE); } .ihi-portal #auxiliary-container, .ihi-portal #auxiliary-container > .WTZone, .ihi-portal #auxiliary-container .ContentItemContainer, .ihi-portal #auxiliary-container .UtilityNavigation { display: flex !important; align-items: center !important; justify-content: center !important; flex-wrap: nowrap !important; width: 100% !important; min-height: 56px !important; height: auto !important; margin: 0 !important; padding: 0 !important; gap: 18px !important; background: transparent !important; visibility: visible !important; opacity: 1 !important; overflow: visible !important; } /* Hide desktop utility clutter on mobile */ .ihi-portal #auxiliary-container .UtilityNavigationList, .ihi-portal #auxiliary-container .UtilityAccountArea, .ihi-portal #auxiliary-container .UtilityAuthentication, .ihi-portal #auxiliary-container .OnBehalfOf, .ihi-portal #auxiliary-container .obo-toggle-wrapper, .ihi-portal #auxiliary-container .obo-container, .ihi-portal #auxiliary-container .profile-picture-wrapper, .ihi-portal #auxiliary-container .account-toggle-wrapper, .ihi-portal #auxiliary-container .UtilitySTEToggle, .ihi-portal #auxiliary-container .ste-section, .ihi-portal #auxiliary-container .UtilitySearch { display: none !important; } /* Keep hamburger/search wrappers visible */ .ihi-portal #auxiliary-container .UtilityNavigationToggle { display: flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 44px !important; width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; visibility: visible !important; opacity: 1 !important; overflow: visible !important; } /* Button reset */ .ihi-portal #auxiliary-container .navbar-toggle, .ihi-portal #auxiliary-container .menu-toggle, .ihi-portal #auxiliary-container .searchbar-toggle { display: inline-flex !important; align-items: center !important; justify-content: center !important; position: relative !important; width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; visibility: visible !important; opacity: 1 !important; overflow: visible !important; } /* Hamburger: force bars to stack vertically */ .ihi-portal #auxiliary-container .menu-toggle { flex-direction: column !important; gap: 4px !important; } .ihi-portal #auxiliary-container .menu-toggle .icon-bar, .ihi-portal #auxiliary-container .navbar-toggle .icon-bar { display: block !important; flex: 0 0 auto !important; width: 22px !important; height: 2px !important; margin: 0 !important; padding: 0 !important; border-radius: 0 !important; background-color: var(--ihi-dark, #2B3137) !important; background-image: none !important; visibility: visible !important; opacity: 1 !important; } /* Search: draw the magnifier directly instead of relying on Glacier sprite */ .ihi-portal #auxiliary-container .searchbar-toggle .icon-search { display: block !important; position: relative !important; width: 24px !important; height: 24px !important; margin: 0 !important; padding: 0 !important; background: none !important; background-image: none !important; font-size: 0 !important; line-height: 0 !important; color: transparent !important; visibility: visible !important; opacity: 1 !important; } .ihi-portal #auxiliary-container .searchbar-toggle .icon-search::before { content: ""; position: absolute; top: 3px; left: 3px; width: 13px; height: 13px; border: 2px solid var(--ihi-dark, #2B3137); border-radius: 50%; background: transparent; } .ihi-portal #auxiliary-container .searchbar-toggle .icon-search::after { content: ""; position: absolute; right: 4px; bottom: 5px; width: 8px; height: 2px; background: var(--ihi-dark, #2B3137); transform: rotate(45deg); transform-origin: center; } /* Primary nav area */ .ihi-portal .ihi-header__nav-wrap { grid-area: nav; width: 100%; min-height: 0 !important; margin: 0 !important; padding: 0 !important; background: var(--ihi-white) !important; justify-content: flex-start !important; } .ihi-portal .ihi-header__nav-wrap .navbar-collapse:not(.in):not(.show) { display: none !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; } .ihi-portal .ihi-header__nav-wrap .navbar-collapse.in, .ihi-portal .ihi-header__nav-wrap .navbar-collapse.show { display: block !important; position: static !important; width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 16px 0 !important; background: var(--ihi-white) !important; border: 0 !important; box-shadow: none !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup { display: block !important; width: 100% !important; white-space: normal !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > li, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > .rmItem { display: block !important; width: 100% !important; float: none !important; margin: 0 0 12px !important; padding: 0 !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink .rmText { font-size: 18px !important; line-height: 1.4 !important; } /* Mobile search collapse */ .ihi-portal #auxiliary-container .searchbar-collapse:not(.in):not(.show) { display: none !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } .ihi-portal #auxiliary-container .searchbar-collapse.in, .ihi-portal #auxiliary-container .searchbar-collapse.show { display: block !important; width: 100% !important; height: auto !important; margin: 0 !important; padding: 10px 0 0 !important; background: transparent !important; border: 0 !important; } .ihi-portal #auxiliary-container .searchbar-collapse .search-field, .ihi-portal #auxiliary-container .searchbar-collapse input[type="search"], .ihi-portal #auxiliary-container .searchbar-collapse input[type="text"] { width: 100% !important; max-width: none !important; height: 40px !important; min-height: 40px !important; color: var(--ihi-dark, #2B3137) !important; background-color: var(--ihi-white, #FFFFFF) !important; border: 1px solid var(--ihi-border, #BBC1C8) !important; padding-left: 36px !important; padding-right: 12px !important; } } @media (max-width: 767px) { .ihi-portal .ihi-header__grid, .ihi-portal .ihi-container { padding-right: var(--ihi-header-pad-mobile); padding-left: var(--ihi-header-pad-mobile); } .ihi-portal #masterContentArea.ihi-main, .ihi-portal .ihi-main { padding-top: 20px; padding-bottom: 20px; } } @media (max-width: 480px) { .ihi-portal .ihi-header__logo img, .ihi-portal .ihi-header__logo svg, .ihi-portal #masterHeaderImage { max-width: 120px !important; max-height: 42px !important; } } /* -------------------------------------------------------------------------- 13. Print -------------------------------------------------------------------------- */ @media print { .ihi-portal .ihi-header__utility, .ihi-portal .ihi-footer__legal, .ihi-portal .backToTop { display: none !important; } } /* ========================================================================== 14. Mobile RadMenu Native Caret Reveal + Clean Nested Menu Treatment Purpose: - Fix the narrow mobile RadMenu wrapper chain. - Keep root mobile nav rows full-width. - Keep native Telerik caret behavior. - Make mobile carets white. - Remove stacked/nested visible boxes on 2nd and 3rd level menus. Approach: - Mobile only. - No custom drawn carets. - No desktop changes. - Only one subtle submenu panel at the first child level. - Deeper levels stay transparent/in-flow to avoid box-on-box clutter. ========================================================================== */ @media (max-width: 991px) { /* Full-width mobile primary nav wrapper chain */ .ihi-portal .ihi-header__nav-wrap, .ihi-portal .ihi-header__nav-wrap > .WTZone, .ihi-portal .ihi-header__nav-wrap .ContentItemContainer, .ihi-portal .ihi-header__nav-wrap .primary-navigation-area, .ihi-portal .ihi-header__nav-wrap .navbar-collapse, .ihi-portal .ihi-header__nav-wrap .nav-primary, .ihi-portal .ihi-header__nav-wrap #ctl01_ciPrimaryNavigation_NavControl_NavWrapper, .ihi-portal .ihi-header__nav-wrap #ctl01_ciPrimaryNavigation_NavControl_NavMenu, .ihi-portal .ihi-header__nav-wrap .RadMenu, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; } /* Opened mobile nav panel */ .ihi-portal .ihi-header__nav-wrap .navbar-collapse.in, .ihi-portal .ihi-header__nav-wrap .navbar-collapse.show { background: #F4FAFC !important; border-top: 1px solid var(--ihi-utility-border, #D4E9EE) !important; border-bottom: 1px solid var(--ihi-utility-border, #D4E9EE) !important; } /* Root list */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; box-sizing: border-box !important; white-space: normal !important; } /* Root items */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > .rmItem, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > li { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 0 12px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-sizing: border-box !important; } /* Root links: full row, no card styling */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink:visited { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; color: var(--ihi-dark, #2B3137) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; text-decoration: none !important; box-sizing: border-box !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink .rmText { display: block !important; flex: 1 1 auto !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; color: var(--ihi-dark, #2B3137) !important; white-space: normal !important; overflow-wrap: normal !important; } /* Native Telerik toggle/caret: white on mobile */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmToggle, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmToggleHandle, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmExpandDown, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmExpandRight { display: inline-block !important; flex: 0 0 auto !important; margin-left: 10px !important; visibility: visible !important; opacity: 1 !important; color: #FFFFFF !important; border-color: #FFFFFF !important; background-color: transparent !important; filter: brightness(0) invert(1); } /* Active/open parent: color only */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink:hover, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink:focus, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmFocused, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmExpanded, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmSelected { color: var(--ihi-primary-dark, #005F74) !important; background: transparent !important; } /* Outer Telerik slide is structural only. No visible box here. */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmSlide { position: static !important; left: auto !important; top: auto !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; max-height: none !important; margin: 6px 0 12px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; box-sizing: border-box !important; overflow: visible !important; } /* First child group gets ONE visible panel */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > .rmItem > .rmSlide > .rmGroup, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > li > .rmSlide > .rmGroup, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > .rmItem > .rmGroup, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootGroup > li > .rmGroup { position: static !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; max-height: none !important; margin: 6px 0 0 !important; padding: 10px 12px 10px 18px !important; background: #E6F4F7 !important; border: 0 !important; border-left: 3px solid var(--ihi-primary-dark, #005F74) !important; box-shadow: none !important; box-sizing: border-box !important; overflow: visible !important; } /* Deeper levels should NOT create another visible box */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmSlide, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmGroup { position: static !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; max-height: none !important; margin: 4px 0 4px 14px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; box-sizing: border-box !important; overflow: visible !important; } /* Child items */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmItem, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup li { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-sizing: border-box !important; } /* Child links: no individual boxes */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink:visited { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 8px 0 !important; color: var(--ihi-dark, #2B3137) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; text-decoration: none !important; box-sizing: border-box !important; white-space: normal !important; overflow-wrap: normal !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmText { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; color: var(--ihi-dark, #2B3137) !important; background: transparent !important; white-space: normal !important; overflow-wrap: normal !important; line-height: 1.35 !important; } .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink:hover, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink:focus, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink.rmFocused, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup .rmLink.rmSelected { color: var(--ihi-primary-dark, #005F74) !important; background: transparent !important; text-decoration: underline !important; } } /* ========================================================================== 15. Mobile RadMenu Open-State Stability Patch Purpose: Keep Telerik mobile second/third level menus open while the parent item, toggle, or child links have focus/open state. Scope: Mobile only. RadMenu only. No desktop changes. ========================================================================== */ @media (max-width: 991px) { /* Keep opened Telerik submenu visible while Telerik marks item/link expanded */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmItem.rmExpanded > .rmSlide, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmItem.rmExpanded > .rmGroup, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmRootLink.rmExpanded + .rmSlide, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmLink.rmExpanded + .rmSlide { display: block !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; overflow: visible !important; } /* Keep submenu visible after touch/click focus lands inside the parent item */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmItem:focus-within > .rmSlide, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmItem:focus-within > .rmGroup { display: block !important; visibility: visible !important; opacity: 1 !important; height: auto !important; max-height: none !important; overflow: visible !important; } /* Prevent Telerik collapse animation from visually clipping focused/open mobile menus */ .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmSlide, .ihi-portal .ihi-header__nav-wrap .RadMenu_NaturalHeritageSites .rmGroup { transition: none !important; animation: none !important; } } /* ========================================================================== 16. Mobile Utility Links Restore Purpose: Restore My Account/Hi, Cart, Help, and Donate links on mobile without touching the working mobile RadMenu treatment. Scope: Mobile only. Header utility navigation only. ========================================================================== */ @media (max-width: 991px) { /* Restore the utility link group that Section 12 hid */ .ihi-portal #auxiliary-container .UtilityNavigationList { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; margin: 0 !important; padding: 0 !important; background: transparent !important; } .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationUnorderedList { display: flex !important; align-items: center !important; justify-content: center !important; flex-wrap: wrap !important; gap: 10px 14px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationListItem, .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationListItem.hideSmartphone { display: flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationLink, .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationLink:visited, .ihi-portal #auxiliary-container .UtilityNavigationList .nav-text { display: inline-flex !important; align-items: center !important; color: var(--ihi-primary-dark, #005F74) !important; background: transparent !important; font-family: var(--ihi-font, Arial, Helvetica, sans-serif) !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.25 !important; text-decoration: none !important; white-space: nowrap !important; } .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationLink:hover, .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationLink:focus { color: var(--ihi-dark, #2B3137) !important; text-decoration: underline !important; } /* Let the utility bar wrap naturally now that links are visible again */ .ihi-portal #auxiliary-container, .ihi-portal #auxiliary-container > .WTZone, .ihi-portal #auxiliary-container .ContentItemContainer, .ihi-portal #auxiliary-container .UtilityNavigation { flex-wrap: wrap !important; row-gap: 6px !important; min-height: 56px !important; padding-top: 6px !important; padding-bottom: 6px !important; } } @media (max-width: 480px) { .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationUnorderedList { gap: 8px 10px !important; } .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationLink, .ihi-portal #auxiliary-container .UtilityNavigationList .NavigationLink:visited, .ihi-portal #auxiliary-container .UtilityNavigationList .nav-text { font-size: 11px !important; } } /* ========================================================= IHI Portal Global Panel / Button Override v1 Purpose: move the approved My Account polish into the theme-level override Scope: IHI portal wrapper only, not ASI/iMIS platform-wide Load order: place after 99-GlacierBay_Responsive.css and after the current IHI cleaned override ========================================================= */ /* ------------------------------ 1) Brand tokens ------------------------------ */ #ctl01_masterWrapper.ihi-portal, #masterWrapper.ihi-portal { --ihi-ink: #2B3137; --ihi-text: #455560; --ihi-muted: #6A7780; --ihi-rule: rgba(69, 85, 96, 0.16); --ihi-rule-strong: rgba(69, 85, 96, 0.26); --ihi-blue-900: #005F74; --ihi-blue-800: #0081A2; --ihi-blue-700: #009FC2; --ihi-blue-500: #33B2CE; --ihi-blue-300: #99D9E7; --ihi-blue-200: #CCECF3; --ihi-blue-100: #E5F5F9; --ihi-surface: #FFFFFF; --ihi-soft: #F8F8F8; --ihi-focus: rgba(0, 159, 194, 0.34); /* Safety alias: any legacy rules still using --ihi-orange render blue, not orange. */ --ihi-orange: var(--ihi-blue-700); --ihi-accent: var(--ihi-blue-700); color: var(--ihi-text); font-family: "Roboto-Flex", Arial, Helvetica, sans-serif; } #ctl01_masterWrapper.ihi-portal #masterContentArea, #ctl01_masterWrapper.ihi-portal #mainContentWrapper, #masterWrapper.ihi-portal #masterContentArea, #masterWrapper.ihi-portal #mainContentWrapper { color: var(--ihi-text); font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; font-size: 16px; line-height: 1.6; } /* ------------------------------ 2) Remove old Glacier theme color leakage ------------------------------ */ #ctl01_masterWrapper.ihi-portal .HelperText, #ctl01_masterWrapper.ihi-portal h1, #ctl01_masterWrapper.ihi-portal h3, #ctl01_masterWrapper.ihi-portal h4, #ctl01_masterWrapper.ihi-portal h5, #ctl01_masterWrapper.ihi-portal .SectionTitle, #ctl01_masterWrapper.ihi-portal .SectionLabel, #masterWrapper.ihi-portal .HelperText, #masterWrapper.ihi-portal h1, #masterWrapper.ihi-portal h3, #masterWrapper.ihi-portal h4, #masterWrapper.ihi-portal h5, #masterWrapper.ihi-portal .SectionTitle, #masterWrapper.ihi-portal .SectionLabel { color: var(--ihi-text) !important; font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; } #ctl01_masterWrapper.ihi-portal h1, #ctl01_masterWrapper.ihi-portal .PageTitle, #masterWrapper.ihi-portal h1, #masterWrapper.ihi-portal .PageTitle { color: var(--ihi-text) !important; font-size: clamp(2rem, 3vw, 2.6rem) !important; font-weight: 600 !important; line-height: 1.1 !important; } #ctl01_masterWrapper.ihi-portal a, #ctl01_masterWrapper.ihi-portal .Link, #masterWrapper.ihi-portal a, #masterWrapper.ihi-portal .Link { color: var(--ihi-blue-800); } #ctl01_masterWrapper.ihi-portal a:hover, #ctl01_masterWrapper.ihi-portal a:focus, #masterWrapper.ihi-portal a:hover, #masterWrapper.ihi-portal a:focus { color: var(--ihi-blue-900); } #ctl01_masterWrapper.ihi-portal blockquote, #masterWrapper.ihi-portal blockquote { border-left-color: var(--ihi-accent) !important; } /* Remove the old Glacier back-to-top arrow from the portal. */ #ctl01_masterWrapper.ihi-portal .backToTop, #masterWrapper.ihi-portal .backToTop { display: none !important; } /* ------------------------------ 3) Global button system Mirrors IHI button pattern: filled teal default, outlined hover. ------------------------------ */ #ctl01_masterWrapper.ihi-portal .btn, #ctl01_masterWrapper.ihi-portal .TextButton, #ctl01_masterWrapper.ihi-portal input[type="submit"], #ctl01_masterWrapper.ihi-portal input[type="button"], #ctl01_masterWrapper.ihi-portal button:not(.navbar-toggle), #ctl01_masterWrapper.ihi-portal .PrimaryButton, #ctl01_masterWrapper.ihi-portal .RadButton.rbButton, #ctl01_masterWrapper.ihi-portal .RadUpload.RadUpload .ruButton, #ctl01_masterWrapper.ihi-portal .RadUploadProgressArea.RadUploadProgressArea .ruButton, #masterWrapper.ihi-portal .btn, #masterWrapper.ihi-portal .TextButton, #masterWrapper.ihi-portal input[type="submit"], #masterWrapper.ihi-portal input[type="button"], #masterWrapper.ihi-portal button:not(.navbar-toggle), #masterWrapper.ihi-portal .PrimaryButton, #masterWrapper.ihi-portal .RadButton.rbButton, #masterWrapper.ihi-portal .RadUpload.RadUpload .ruButton, #masterWrapper.ihi-portal .RadUploadProgressArea.RadUploadProgressArea .ruButton { border-radius: 4px !important; box-shadow: none !important; font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: 0.02em; line-height: 1.45 !important; min-height: 38px; padding: 0.62rem 1.05rem !important; text-decoration: none !important; transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease; } /* Primary/default buttons */ #ctl01_masterWrapper.ihi-portal .btn:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn), #ctl01_masterWrapper.ihi-portal .TextButton:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn), #ctl01_masterWrapper.ihi-portal input[type="submit"], #ctl01_masterWrapper.ihi-portal input[type="button"]:not(.Cancel):not(.LinkButton):not(.DangerButton), #ctl01_masterWrapper.ihi-portal .PrimaryButton, #ctl01_masterWrapper.ihi-portal .CommandBar .Save, #ctl01_masterWrapper.ihi-portal .RadUpload.RadUpload .ruButton, #ctl01_masterWrapper.ihi-portal .RadUploadProgressArea.RadUploadProgressArea .ruButton, #masterWrapper.ihi-portal .btn:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn), #masterWrapper.ihi-portal .TextButton:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn), #masterWrapper.ihi-portal input[type="submit"], #masterWrapper.ihi-portal input[type="button"]:not(.Cancel):not(.LinkButton):not(.DangerButton), #masterWrapper.ihi-portal .PrimaryButton, #masterWrapper.ihi-portal .CommandBar .Save, #masterWrapper.ihi-portal .RadUpload.RadUpload .ruButton, #masterWrapper.ihi-portal .RadUploadProgressArea.RadUploadProgressArea .ruButton { background: var(--ihi-blue-800) !important; border: 1px solid var(--ihi-blue-800) !important; color: #FFFFFF !important; } #ctl01_masterWrapper.ihi-portal .btn:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):hover, #ctl01_masterWrapper.ihi-portal .btn:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):focus, #ctl01_masterWrapper.ihi-portal .TextButton:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):hover, #ctl01_masterWrapper.ihi-portal .TextButton:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):focus, #ctl01_masterWrapper.ihi-portal input[type="submit"]:hover, #ctl01_masterWrapper.ihi-portal input[type="submit"]:focus, #ctl01_masterWrapper.ihi-portal input[type="button"]:not(.Cancel):not(.LinkButton):not(.DangerButton):hover, #ctl01_masterWrapper.ihi-portal input[type="button"]:not(.Cancel):not(.LinkButton):not(.DangerButton):focus, #ctl01_masterWrapper.ihi-portal .PrimaryButton:hover, #ctl01_masterWrapper.ihi-portal .PrimaryButton:focus, #ctl01_masterWrapper.ihi-portal .CommandBar .Save:hover, #ctl01_masterWrapper.ihi-portal .CommandBar .Save:focus, #masterWrapper.ihi-portal .btn:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):hover, #masterWrapper.ihi-portal .btn:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):focus, #masterWrapper.ihi-portal .TextButton:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):hover, #masterWrapper.ihi-portal .TextButton:not(.LinkButton):not(.Cancel):not(.DangerButton):not(.Facebook):not(.LinkedIn):focus, #masterWrapper.ihi-portal input[type="submit"]:hover, #masterWrapper.ihi-portal input[type="submit"]:focus, #masterWrapper.ihi-portal input[type="button"]:not(.Cancel):not(.LinkButton):not(.DangerButton):hover, #masterWrapper.ihi-portal input[type="button"]:not(.Cancel):not(.LinkButton):not(.DangerButton):focus, #masterWrapper.ihi-portal .PrimaryButton:hover, #masterWrapper.ihi-portal .PrimaryButton:focus, #masterWrapper.ihi-portal .CommandBar .Save:hover, #masterWrapper.ihi-portal .CommandBar .Save:focus { background: transparent !important; border-color: var(--ihi-blue-800) !important; color: var(--ihi-blue-800) !important; } /* Secondary/cancel buttons */ #ctl01_masterWrapper.ihi-portal .SecondaryButton, #ctl01_masterWrapper.ihi-portal .btn.SecondaryButton, #ctl01_masterWrapper.ihi-portal .TextButton.SecondaryButton, #ctl01_masterWrapper.ihi-portal .TextButton.Cancel, #ctl01_masterWrapper.ihi-portal .Cancel, #ctl01_masterWrapper.ihi-portal .CommandBar .Cancel, #masterWrapper.ihi-portal .SecondaryButton, #masterWrapper.ihi-portal .btn.SecondaryButton, #masterWrapper.ihi-portal .TextButton.SecondaryButton, #masterWrapper.ihi-portal .TextButton.Cancel, #masterWrapper.ihi-portal .Cancel, #masterWrapper.ihi-portal .CommandBar .Cancel { background: transparent !important; border: 1px solid var(--ihi-blue-800) !important; color: var(--ihi-blue-800) !important; } #ctl01_masterWrapper.ihi-portal .SecondaryButton:hover, #ctl01_masterWrapper.ihi-portal .SecondaryButton:focus, #ctl01_masterWrapper.ihi-portal .TextButton.Cancel:hover, #ctl01_masterWrapper.ihi-portal .TextButton.Cancel:focus, #ctl01_masterWrapper.ihi-portal .Cancel:hover, #ctl01_masterWrapper.ihi-portal .Cancel:focus, #ctl01_masterWrapper.ihi-portal .CommandBar .Cancel:hover, #ctl01_masterWrapper.ihi-portal .CommandBar .Cancel:focus, #masterWrapper.ihi-portal .SecondaryButton:hover, #masterWrapper.ihi-portal .SecondaryButton:focus, #masterWrapper.ihi-portal .TextButton.Cancel:hover, #masterWrapper.ihi-portal .TextButton.Cancel:focus, #masterWrapper.ihi-portal .Cancel:hover, #masterWrapper.ihi-portal .Cancel:focus, #masterWrapper.ihi-portal .CommandBar .Cancel:hover, #masterWrapper.ihi-portal .CommandBar .Cancel:focus { background: var(--ihi-blue-800) !important; border-color: var(--ihi-blue-800) !important; color: #FFFFFF !important; } /* Text/link buttons stay light and do not become filled CTAs. */ #ctl01_masterWrapper.ihi-portal .LinkButton, #ctl01_masterWrapper.ihi-portal .TextButton.LinkButton, #masterWrapper.ihi-portal .LinkButton, #masterWrapper.ihi-portal .TextButton.LinkButton { background: transparent !important; border-color: transparent !important; color: var(--ihi-blue-800) !important; padding-left: 0 !important; padding-right: 0 !important; text-decoration: underline !important; } #ctl01_masterWrapper.ihi-portal .LinkButton:hover, #ctl01_masterWrapper.ihi-portal .LinkButton:focus, #masterWrapper.ihi-portal .LinkButton:hover, #masterWrapper.ihi-portal .LinkButton:focus { color: var(--ihi-blue-900) !important; text-decoration: none !important; } #ctl01_masterWrapper.ihi-portal .btn:focus-visible, #ctl01_masterWrapper.ihi-portal .TextButton:focus-visible, #ctl01_masterWrapper.ihi-portal input[type="submit"]:focus-visible, #ctl01_masterWrapper.ihi-portal input[type="button"]:focus-visible, #ctl01_masterWrapper.ihi-portal button:focus-visible, #masterWrapper.ihi-portal .btn:focus-visible, #masterWrapper.ihi-portal .TextButton:focus-visible, #masterWrapper.ihi-portal input[type="submit"]:focus-visible, #masterWrapper.ihi-portal input[type="button"]:focus-visible, #masterWrapper.ihi-portal button:focus-visible { outline: 0 !important; box-shadow: 0 0 0 3px var(--ihi-focus) !important; } /* Search/icon action buttons */ #ctl01_masterWrapper.ihi-portal .SearchButton, #ctl01_masterWrapper.ihi-portal .searchbar-toggle, #ctl01_masterWrapper.ihi-portal .header-search button, #ctl01_masterWrapper.ihi-portal .UtilitySearch button, #masterWrapper.ihi-portal .SearchButton, #masterWrapper.ihi-portal .searchbar-toggle, #masterWrapper.ihi-portal .header-search button, #masterWrapper.ihi-portal .UtilitySearch button { align-items: center !important; background: var(--ihi-blue-200) !important; border: 1px solid transparent !important; border-radius: 999px !important; color: var(--ihi-blue-900) !important; display: inline-flex !important; height: 36px !important; justify-content: center !important; min-height: 36px !important; padding: 0 !important; width: 36px !important; } #ctl01_masterWrapper.ihi-portal .SearchButton:hover, #ctl01_masterWrapper.ihi-portal .SearchButton:focus, #ctl01_masterWrapper.ihi-portal .searchbar-toggle:hover, #ctl01_masterWrapper.ihi-portal .searchbar-toggle:focus, #ctl01_masterWrapper.ihi-portal .header-search button:hover, #ctl01_masterWrapper.ihi-portal .header-search button:focus, #ctl01_masterWrapper.ihi-portal .UtilitySearch button:hover, #ctl01_masterWrapper.ihi-portal .UtilitySearch button:focus, #masterWrapper.ihi-portal .SearchButton:hover, #masterWrapper.ihi-portal .SearchButton:focus, #masterWrapper.ihi-portal .searchbar-toggle:hover, #masterWrapper.ihi-portal .searchbar-toggle:focus, #masterWrapper.ihi-portal .header-search button:hover, #masterWrapper.ihi-portal .header-search button:focus, #masterWrapper.ihi-portal .UtilitySearch button:hover, #masterWrapper.ihi-portal .UtilitySearch button:focus { background: var(--ihi-blue-800) !important; border-color: var(--ihi-blue-800) !important; color: #FFFFFF !important; } /* ------------------------------ 4) Global panel/card system Direct panel targeting prevents nested border doubling. ------------------------------ */ #ctl01_masterWrapper.ihi-portal #masterContentArea .ContentItemContainer > .panel, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .ContentItemContainer > .panel, #ctl01_masterWrapper.ihi-portal #masterContentArea .StandardPanel, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .StandardPanel, #masterWrapper.ihi-portal #masterContentArea .ContentItemContainer > .panel, #masterWrapper.ihi-portal #mainContentWrapper .ContentItemContainer > .panel, #masterWrapper.ihi-portal #masterContentArea .StandardPanel, #masterWrapper.ihi-portal #mainContentWrapper .StandardPanel { background: var(--ihi-surface) !important; border: 1px solid var(--ihi-rule) !important; border-radius: 6px !important; box-shadow: 0 4px 12px rgba(69, 85, 96, 0.10) !important; margin: 0 0 1.5rem !important; overflow: hidden; } #ctl01_masterWrapper.ihi-portal #masterContentArea .ContentItemContainer > .panel > .panel-heading, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .ContentItemContainer > .panel > .panel-heading, #ctl01_masterWrapper.ihi-portal #masterContentArea .StandardPanel > .PanelHead, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .StandardPanel > .PanelHead, #masterWrapper.ihi-portal #masterContentArea .ContentItemContainer > .panel > .panel-heading, #masterWrapper.ihi-portal #mainContentWrapper .ContentItemContainer > .panel > .panel-heading, #masterWrapper.ihi-portal #masterContentArea .StandardPanel > .PanelHead, #masterWrapper.ihi-portal #mainContentWrapper .StandardPanel > .PanelHead { align-items: center; background: var(--ihi-blue-100) !important; border: 0 !important; border-bottom: 1px solid var(--ihi-rule) !important; display: flex; justify-content: space-between; min-height: 0 !important; padding: 0.85rem 1.15rem !important; } #ctl01_masterWrapper.ihi-portal #masterContentArea .ContentItemContainer > .panel > .panel-body-container > .panel-body, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .ContentItemContainer > .panel > .panel-body-container > .panel-body, #ctl01_masterWrapper.ihi-portal #masterContentArea .StandardPanel > .PanelBody, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .StandardPanel > .PanelBody, #masterWrapper.ihi-portal #masterContentArea .ContentItemContainer > .panel > .panel-body-container > .panel-body, #masterWrapper.ihi-portal #mainContentWrapper .ContentItemContainer > .panel > .panel-body-container > .panel-body, #masterWrapper.ihi-portal #masterContentArea .StandardPanel > .PanelBody, #masterWrapper.ihi-portal #mainContentWrapper .StandardPanel > .PanelBody { padding: 1.1rem 1.2rem 1.2rem !important; } #ctl01_masterWrapper.ihi-portal .panel-title, #ctl01_masterWrapper.ihi-portal .panel-title a, #ctl01_masterWrapper.ihi-portal .PanelTitle, #ctl01_masterWrapper.ihi-portal div.PanelTitle, #masterWrapper.ihi-portal .panel-title, #masterWrapper.ihi-portal .panel-title a, #masterWrapper.ihi-portal .PanelTitle, #masterWrapper.ihi-portal div.PanelTitle { color: var(--ihi-text) !important; font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; font-size: 20px !important; font-weight: 700 !important; line-height: 1.3 !important; margin: 0 !important; text-decoration: none !important; } #ctl01_masterWrapper.ihi-portal .ContentItemContainer > .panel > .panel-heading .panel-title::before, #masterWrapper.ihi-portal .ContentItemContainer > .panel > .panel-heading .panel-title::before { background: var(--ihi-accent); border-radius: 50%; content: ""; display: inline-block; height: 0.48rem; margin-right: 0.55rem; position: relative; top: -1px; width: 0.48rem; } /* Nested panels/tabs: remove extra borders and shadows so they do not stack. */ #ctl01_masterWrapper.ihi-portal #masterContentArea .panel .panel, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .panel .panel, #ctl01_masterWrapper.ihi-portal #masterContentArea .ContentTabbedDisplay, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .ContentTabbedDisplay, #masterWrapper.ihi-portal #masterContentArea .panel .panel, #masterWrapper.ihi-portal #mainContentWrapper .panel .panel, #masterWrapper.ihi-portal #masterContentArea .ContentTabbedDisplay, #masterWrapper.ihi-portal #mainContentWrapper .ContentTabbedDisplay { border: 0 !important; box-shadow: none !important; margin: 0 !important; } #ctl01_masterWrapper.ihi-portal #masterContentArea .ContentTabbedDisplay > .panel-heading, #ctl01_masterWrapper.ihi-portal #mainContentWrapper .ContentTabbedDisplay > .panel-heading, #masterWrapper.ihi-portal #masterContentArea .ContentTabbedDisplay > .panel-heading, #masterWrapper.ihi-portal #mainContentWrapper .ContentTabbedDisplay > .panel-heading { background: transparent !important; border: 0 !important; padding: 0 0 0.5rem !important; } /* ------------------------------ 5) Global Telerik/RadTabStrip tabs No orange. Active tab gets IHI blue underline only. ------------------------------ */ #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch.RadTabStrip_MetroTouch .rtsLevel1, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch.RadTabStrip_MetroTouch .rtsLevel1 { border-bottom: 1px solid var(--ihi-rule) !important; margin-bottom: 1.25rem; padding-bottom: 0.5rem; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsUL, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsUL { display: flex; flex-wrap: wrap; gap: 0.5rem; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLI, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLI { margin: 0 !important; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink { background: #FFFFFF !important; border: 1px solid var(--ihi-blue-200) !important; border-radius: 4px !important; box-shadow: none !important; color: var(--ihi-blue-900) !important; min-height: 42px; padding: 0 0.95rem !important; text-decoration: none !important; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink .rtsTxt, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink .rtsTxt { color: inherit !important; font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; font-size: 14.5px !important; font-weight: 700 !important; letter-spacing: 0.02em; line-height: 42px !important; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsSelected, #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsSelected:hover, #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsSelected:focus, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsSelected, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsSelected:hover, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsSelected:focus { background: var(--ihi-soft) !important; border-color: var(--ihi-blue-300) !important; box-shadow: inset 0 -4px 0 0 var(--ihi-accent) !important; color: var(--ihi-text) !important; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink:hover, #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink:focus, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink:hover, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink:focus { background: var(--ihi-blue-100) !important; border-color: var(--ihi-blue-800) !important; color: var(--ihi-text) !important; text-decoration: none !important; } /* ------------------------------ 6) Panel edit / easy-edit / config icon cleanup ------------------------------ */ #ctl01_masterWrapper.ihi-portal .panel-heading-options, #masterWrapper.ihi-portal .panel-heading-options { align-items: center; display: flex; gap: 0.35rem; margin: 0 !important; } #ctl01_masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"], #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"], #masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"], #masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"] { align-items: center; background-color: var(--ihi-blue-200) !important; background-image: none !important; border: 1px solid rgba(0, 129, 162, 0.22) !important; border-radius: 999px !important; box-shadow: none !important; display: inline-flex !important; height: 32px !important; justify-content: center; margin: 0 !important; min-height: 32px !important; min-width: 32px !important; padding: 0 !important; width: 32px !important; } #ctl01_masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options .sysicon::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .sysicon::before, #masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton::before, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]::before, #masterWrapper.ihi-portal .panel-heading-options .sysicon::before, #masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton::before, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]::before, #masterWrapper.ihi-portal .PanelHeadOptions .sysicon::before { color: var(--ihi-blue-900) !important; font-size: 15px !important; line-height: 1 !important; margin: 0 !important; } #ctl01_masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:hover, #ctl01_masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:focus, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:hover, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:focus, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:hover, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:focus, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:hover, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:focus, #masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:hover, #masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:focus, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:hover, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:focus, #masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:hover, #masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:focus, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:hover, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:focus { background-color: var(--ihi-blue-800) !important; border-color: var(--ihi-blue-800) !important; } #ctl01_masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:hover::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:focus::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:hover::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:focus::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:hover .sysicon::before, #ctl01_masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:focus .sysicon::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:hover::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:focus::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:hover::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:focus::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:hover .sysicon::before, #ctl01_masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:focus .sysicon::before, #masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:hover::before, #masterWrapper.ihi-portal .panel-heading-options .RadButton.rbImageButton:focus::before, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:hover::before, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:focus::before, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:hover .sysicon::before, #masterWrapper.ihi-portal .panel-heading-options a[class*="sysicon"]:focus .sysicon::before, #masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:hover::before, #masterWrapper.ihi-portal .PanelHeadOptions .RadButton.rbImageButton:focus::before, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:hover::before, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:focus::before, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:hover .sysicon::before, #masterWrapper.ihi-portal .PanelHeadOptions a[class*="sysicon"]:focus .sysicon::before { color: #FFFFFF !important; } /* ------------------------------ 7) Global panel editor read-only layout Applies to My Account, organization profile, and similar RiSE panel editors. ------------------------------ */ #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .row, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .row { margin-left: 0; margin-right: 0; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .BreakWord, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .BreakWord { padding-left: 0; padding-right: 0; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left { align-items: start; border-bottom: 1px solid var(--ihi-rule); display: grid; float: none !important; gap: 0.65rem !important; grid-template-columns: minmax(145px, 34%) minmax(0, 1fr) !important; margin: 0 !important; padding: 0.7rem 0 !important; width: 100% !important; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left:last-child, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left:last-child { border-bottom: 0; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left > div[style*="display:inline"], #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left > div[style*="display:inline"] { display: block !important; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .Label, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm label, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField .Label, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField label, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .Label, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm label, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField .Label, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField label { color: var(--ihi-ink) !important; display: block; font-size: 12.5px !important; font-weight: 800 !important; letter-spacing: 0.045em !important; line-height: 1.35 !important; text-transform: uppercase; width: auto !important; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue span, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue .__cf_email__, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue span, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue .__cf_email__ { color: var(--ihi-muted) !important; font-size: 15px !important; font-weight: 500 !important; line-height: 1.55 !important; min-width: 0 !important; overflow-wrap: anywhere !important; padding: 0 !important; width: auto !important; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a { color: var(--ihi-blue-800) !important; font-weight: 700 !important; text-decoration: underline; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a:hover, #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a:focus, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a:hover, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelFieldValue a:focus { color: var(--ihi-blue-900) !important; text-decoration: none; } /* Empty/no-record messages */ #ctl01_masterWrapper.ihi-portal .panel-body span[id*="NoRecordsFoundMessageLabel"], #masterWrapper.ihi-portal .panel-body span[id*="NoRecordsFoundMessageLabel"] { background: var(--ihi-soft); border-radius: 4px; color: var(--ihi-muted) !important; display: block; font-size: 15px !important; line-height: 1.55 !important; padding: 0.85rem 1rem; } /* ------------------------------ 8) My Account and Mini Profile carry-forward rules These stay targeted because they are real account-specific components. ------------------------------ */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMyAccount, #masterWrapper.ihi-portal #ste_container_ciMyAccount, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile, #masterWrapper.ihi-portal #ste_container_ciMiniProfile { color: var(--ihi-text); font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMyAccount > .panel, #masterWrapper.ihi-portal #ste_container_ciMyAccount > .panel { background: transparent !important; border: 0 !important; box-shadow: none !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMyAccount > .panel > .panel-heading, #masterWrapper.ihi-portal #ste_container_ciMyAccount > .panel > .panel-heading { display: none !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMyAccount > .panel > .panel-body-container > .panel-body, #masterWrapper.ihi-portal #ste_container_ciMyAccount > .panel > .panel-body-container > .panel-body { padding: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_NewContentHtml, #masterWrapper.ihi-portal #ste_container_NewContentHtml { background: var(--ihi-blue-100); border-left: 6px solid var(--ihi-accent); border-radius: 4px; box-shadow: 0 4px 12px rgba(69, 85, 96, 0.08); margin: 0 0 1.5rem; padding: 1rem 1.25rem; } #ctl01_masterWrapper.ihi-portal #ste_container_NewContentHtml p, #masterWrapper.ihi-portal #ste_container_NewContentHtml p { margin: 0 !important; text-align: left !important; } #ctl01_masterWrapper.ihi-portal #ste_container_NewContentHtml span, #masterWrapper.ihi-portal #ste_container_NewContentHtml span { color: var(--ihi-text) !important; font-size: 15px !important; font-weight: 500; line-height: 1.55; } #ctl01_masterWrapper.ihi-portal #ste_container_Preferences, #masterWrapper.ihi-portal #ste_container_Preferences { background: var(--ihi-soft); border-left: 6px solid var(--ihi-blue-800); border-radius: 4px; box-shadow: 0 4px 12px rgba(69, 85, 96, 0.08); margin: 0 0 1rem; padding: 1.15rem 1.25rem; } #ctl01_masterWrapper.ihi-portal #ste_container_Preferences h2, #masterWrapper.ihi-portal #ste_container_Preferences h2 { color: var(--ihi-text) !important; font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.3 !important; margin: 0 0 0.5rem !important; } #ctl01_masterWrapper.ihi-portal #ste_container_Preferences p, #ctl01_masterWrapper.ihi-portal #ste_container_Preferences a, #masterWrapper.ihi-portal #ste_container_Preferences p, #masterWrapper.ihi-portal #ste_container_Preferences a { font-size: 15px !important; line-height: 1.65 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_PreferencesPanel input[type="checkbox"], #masterWrapper.ihi-portal #ste_container_PreferencesPanel input[type="checkbox"] { accent-color: var(--ihi-blue-800); height: 18px !important; width: 18px !important; } #ctl01_masterWrapper.ihi-portal #ste_container_PreferencesPanel label, #masterWrapper.ihi-portal #ste_container_PreferencesPanel label { color: var(--ihi-text) !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.5 !important; } /* Mini profile */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .CalloutPart2, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel-border, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .CalloutPart2, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel-border { background: var(--ihi-soft) !important; border: 1px solid var(--ihi-rule) !important; border-radius: 4px !important; box-shadow: none !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel-heading, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel-heading { background: transparent !important; border: 0 !important; min-height: 0 !important; padding: 0.75rem 0.75rem 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel-body, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .panel-body { padding: 0.75rem 1rem 1rem !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-name-section .SectionLabel, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile span[id*="contactName_fullName"], #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactName_fullName"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-name-section .SectionLabel, #masterWrapper.ihi-portal #ste_container_ciMiniProfile span[id*="contactName_fullName"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactName_fullName"] { color: var(--ihi-ink) !important; font-size: 18.5px !important; font-weight: 700 !important; line-height: 1.3 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile span[id*="contactName_institute"], #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactName_institute"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile span[id*="contactName_institute"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactName_institute"] { color: var(--ihi-text) !important; font-size: 15px !important; line-height: 1.5 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelField.Left, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelField.Left { align-items: center !important; column-gap: 0.85rem !important; display: grid !important; grid-template-columns: minmax(105px, 44%) minmax(0, 1fr) !important; padding-top: 0.72rem !important; padding-bottom: 0.72rem !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .Label, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper label, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelField .Label, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .Label, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper label, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelField .Label { color: var(--ihi-ink) !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1.4 !important; white-space: nowrap !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelFieldValue, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelFieldValue span, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactStatus_memberId"], #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactStatus_memberType"], #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactStatus_memberStatus"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelFieldValue, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelFieldValue span, #masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactStatus_memberId"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactStatus_memberType"], #masterWrapper.ihi-portal #ste_container_ciMiniProfile [id*="contactStatus_memberStatus"] { color: var(--ihi-ink) !important; font-size: 14.5px !important; font-weight: 500 !important; line-height: 1.45 !important; min-width: 0 !important; overflow-wrap: anywhere !important; } /* My Account address sub-tabs stay smaller than primary tabs. */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMyAccount #ste_container_ContactAddress .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink, #masterWrapper.ihi-portal #ste_container_ciMyAccount #ste_container_ContactAddress .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink { min-height: 42px !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMyAccount #ste_container_ContactAddress .RadTabStrip_MetroTouch .rtsLevel1 .rtsTxt, #masterWrapper.ihi-portal #ste_container_ciMyAccount #ste_container_ContactAddress .RadTabStrip_MetroTouch .rtsLevel1 .rtsTxt { font-size: 14px !important; font-weight: 700 !important; line-height: 42px !important; } /* ------------------------------ 9) Breadcrumb ------------------------------ */ #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb, #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb a, #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb span, #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb *, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb a, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb span, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb * { color: var(--ihi-blue-900) !important; font-family: "Roboto-Flex", Arial, Helvetica, sans-serif !important; font-size: 16px !important; font-weight: 700 !important; letter-spacing: 0.005em !important; line-height: 1.55 !important; text-decoration: none !important; } #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb { margin-bottom: 1.15rem !important; } #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb a:hover, #ctl01_masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb a:focus, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb a:hover, #masterWrapper.ihi-portal #mainContentWrapper #masterMainBreadcrumb a:focus { color: var(--ihi-blue-700) !important; text-decoration: underline !important; } /* ------------------------------ 10) Responsive pass ------------------------------ */ @media (max-width: 767px) { #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsUL, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsUL { display: block; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLI, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLI { margin-bottom: 0.35rem !important; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink { display: block !important; min-height: 44px !important; width: 100% !important; } #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink .rtsTxt, #ctl01_masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsTxt, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsLink .rtsTxt, #masterWrapper.ihi-portal .RadTabStrip_MetroTouch .rtsLevel1 .rtsTxt { font-size: 14.5px !important; line-height: 44px !important; } #ctl01_masterWrapper.ihi-portal .ContentItemContainer > .panel > .panel-heading, #masterWrapper.ihi-portal .ContentItemContainer > .panel > .panel-heading { align-items: flex-start; gap: 0.75rem; } #ctl01_masterWrapper.ihi-portal .panel-title, #ctl01_masterWrapper.ihi-portal .panel-title a, #masterWrapper.ihi-portal .panel-title, #masterWrapper.ihi-portal .panel-title a { font-size: 18px !important; } #ctl01_masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left, #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelField.Left, #masterWrapper.ihi-portal .PanelEditorReadOnlyForm .PanelField.Left, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .PanelField.Left { grid-template-columns: 1fr !important; gap: 0.25rem !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .Label, #masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-wrapper .Label { white-space: normal !important; } } /* ========================================================= IHI Portal Modal / Edit Menu Button Brand Patch Fixes Save, Save & Close, Cancel, OK buttons in edit dialogs ========================================================= */ /* Base button treatment inside edit menus, RadWindow dialogs, and Bootstrap-style modals */ #ctl01_masterWrapper.ihi-portal .TextButton, #ctl01_masterWrapper.ihi-portal input.TextButton, #ctl01_masterWrapper.ihi-portal a.TextButton, #ctl01_masterWrapper.ihi-portal .btn, .RadWindow.RadWindow_MetroTouch .TextButton, .RadWindow.RadWindow_MetroTouch input.TextButton, .RadWindow.RadWindow_MetroTouch a.TextButton, .RadWindow.RadWindow_MetroTouch .btn, .RadWindow.RadWindow_Metro .TextButton, .RadWindow.RadWindow_Metro input.TextButton, .RadWindow.RadWindow_Metro a.TextButton, .RadWindow.RadWindow_Metro .btn { min-height: 40px !important; padding: 9px 18px !important; border: 1px solid #0081A2 !important; border-radius: 4px !important; background-color: #ffffff !important; background-image: none !important; color: #005F74 !important; font-family: "Roboto", "Roboto Flex", Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; text-decoration: none !important; box-shadow: none !important; cursor: pointer !important; } /* Primary actions: Save, Save & Close, Submit, positive action buttons */ #ctl01_masterWrapper.ihi-portal .PrimaryButton, #ctl01_masterWrapper.ihi-portal .TextButton.PrimaryButton, #ctl01_masterWrapper.ihi-portal input.TextButton.PrimaryButton, #ctl01_masterWrapper.ihi-portal a.TextButton.PrimaryButton, #ctl01_masterWrapper.ihi-portal .btn-primary, .RadWindow.RadWindow_MetroTouch .PrimaryButton, .RadWindow.RadWindow_MetroTouch .TextButton.PrimaryButton, .RadWindow.RadWindow_MetroTouch input.TextButton.PrimaryButton, .RadWindow.RadWindow_MetroTouch a.TextButton.PrimaryButton, .RadWindow.RadWindow_MetroTouch .btn-primary, .RadWindow.RadWindow_Metro .PrimaryButton, .RadWindow.RadWindow_Metro .TextButton.PrimaryButton, .RadWindow.RadWindow_Metro input.TextButton.PrimaryButton, .RadWindow.RadWindow_Metro a.TextButton.PrimaryButton, .RadWindow.RadWindow_Metro .btn-primary { border-color: #0081A2 !important; background-color: #0081A2 !important; background-image: none !important; color: #ffffff !important; } /* Primary hover/focus */ #ctl01_masterWrapper.ihi-portal .PrimaryButton:hover, #ctl01_masterWrapper.ihi-portal .PrimaryButton:focus, #ctl01_masterWrapper.ihi-portal .TextButton.PrimaryButton:hover, #ctl01_masterWrapper.ihi-portal .TextButton.PrimaryButton:focus, #ctl01_masterWrapper.ihi-portal .btn-primary:hover, #ctl01_masterWrapper.ihi-portal .btn-primary:focus, .RadWindow.RadWindow_MetroTouch .PrimaryButton:hover, .RadWindow.RadWindow_MetroTouch .PrimaryButton:focus, .RadWindow.RadWindow_MetroTouch .TextButton.PrimaryButton:hover, .RadWindow.RadWindow_MetroTouch .TextButton.PrimaryButton:focus, .RadWindow.RadWindow_MetroTouch .btn-primary:hover, .RadWindow.RadWindow_MetroTouch .btn-primary:focus, .RadWindow.RadWindow_Metro .PrimaryButton:hover, .RadWindow.RadWindow_Metro .PrimaryButton:focus, .RadWindow.RadWindow_Metro .TextButton.PrimaryButton:hover, .RadWindow.RadWindow_Metro .TextButton.PrimaryButton:focus, .RadWindow.RadWindow_Metro .btn-primary:hover, .RadWindow.RadWindow_Metro .btn-primary:focus { border-color: #005F74 !important; background-color: #005F74 !important; color: #ffffff !important; text-decoration: none !important; outline: 2px solid #CCECF3 !important; outline-offset: 2px !important; } /* Secondary actions: Cancel, Close, Back */ #ctl01_masterWrapper.ihi-portal .TextButton:not(.PrimaryButton), #ctl01_masterWrapper.ihi-portal input.TextButton:not(.PrimaryButton), #ctl01_masterWrapper.ihi-portal a.TextButton:not(.PrimaryButton), #ctl01_masterWrapper.ihi-portal .btn-default, #ctl01_masterWrapper.ihi-portal .btn-secondary, .RadWindow.RadWindow_MetroTouch .TextButton:not(.PrimaryButton), .RadWindow.RadWindow_MetroTouch input.TextButton:not(.PrimaryButton), .RadWindow.RadWindow_MetroTouch a.TextButton:not(.PrimaryButton), .RadWindow.RadWindow_MetroTouch .btn-default, .RadWindow.RadWindow_MetroTouch .btn-secondary, .RadWindow.RadWindow_Metro .TextButton:not(.PrimaryButton), .RadWindow.RadWindow_Metro input.TextButton:not(.PrimaryButton), .RadWindow.RadWindow_Metro a.TextButton:not(.PrimaryButton), .RadWindow.RadWindow_Metro .btn-default, .RadWindow.RadWindow_Metro .btn-secondary { border-color: #0081A2 !important; background-color: #ffffff !important; background-image: none !important; color: #005F74 !important; } /* Secondary hover/focus */ #ctl01_masterWrapper.ihi-portal .TextButton:not(.PrimaryButton):hover, #ctl01_masterWrapper.ihi-portal .TextButton:not(.PrimaryButton):focus, #ctl01_masterWrapper.ihi-portal .btn-default:hover, #ctl01_masterWrapper.ihi-portal .btn-default:focus, #ctl01_masterWrapper.ihi-portal .btn-secondary:hover, #ctl01_masterWrapper.ihi-portal .btn-secondary:focus, .RadWindow.RadWindow_MetroTouch .TextButton:not(.PrimaryButton):hover, .RadWindow.RadWindow_MetroTouch .TextButton:not(.PrimaryButton):focus, .RadWindow.RadWindow_MetroTouch .btn-default:hover, .RadWindow.RadWindow_MetroTouch .btn-default:focus, .RadWindow.RadWindow_MetroTouch .btn-secondary:hover, .RadWindow.RadWindow_MetroTouch .btn-secondary:focus, .RadWindow.RadWindow_Metro .TextButton:not(.PrimaryButton):hover, .RadWindow.RadWindow_Metro .TextButton:not(.PrimaryButton):focus, .RadWindow.RadWindow_Metro .btn-default:hover, .RadWindow.RadWindow_Metro .btn-default:focus, .RadWindow.RadWindow_Metro .btn-secondary:hover, .RadWindow.RadWindow_Metro .btn-secondary:focus { border-color: #0081A2 !important; background-color: #E5F5F9 !important; color: #005F74 !important; text-decoration: none !important; outline: 2px solid #CCECF3 !important; outline-offset: 2px !important; } /* Telerik OK / Cancel popup buttons */ .RadWindow.RadWindow_MetroTouch .rwDialogPopup .rwPopupButton, .RadWindow.RadWindow_Metro .rwDialogPopup .rwPopupButton { min-height: 40px !important; padding: 9px 18px !important; border: 1px solid #0081A2 !important; border-radius: 4px !important; background: #ffffff !important; color: #005F74 !important; font-family: "Roboto", "Roboto Flex", Arial, Helvetica, sans-serif !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; text-decoration: none !important; box-shadow: none !important; } /* First Telerik popup action behaves like primary */ .RadWindow.RadWindow_MetroTouch .rwDialogPopup .rwPopupButton:first-of-type, .RadWindow.RadWindow_Metro .rwDialogPopup .rwPopupButton:first-of-type { background: #0081A2 !important; border-color: #0081A2 !important; color: #ffffff !important; } /* Telerik popup hover/focus */ .RadWindow.RadWindow_MetroTouch .rwDialogPopup .rwPopupButton:hover, .RadWindow.RadWindow_MetroTouch .rwDialogPopup .rwPopupButton:focus, .RadWindow.RadWindow_Metro .rwDialogPopup .rwPopupButton:hover, .RadWindow.RadWindow_Metro .rwDialogPopup .rwPopupButton:focus { background: #E5F5F9 !important; border-color: #0081A2 !important; color: #005F74 !important; outline: 2px solid #CCECF3 !important; outline-offset: 2px !important; } .RadWindow.RadWindow_MetroTouch .rwDialogPopup .rwPopupButton:first-of-type:hover, .RadWindow.RadWindow_MetroTouch .rwDialogPopup .rwPopupButton:first-of-type:focus, .RadWindow.RadWindow_Metro .rwDialogPopup .rwPopupButton:first-of-type:hover, .RadWindow.RadWindow_Metro .rwDialogPopup .rwPopupButton:first-of-type:focus { background: #005F74 !important; border-color: #005F74 !important; color: #ffffff !important; } /* Disabled buttons */ #ctl01_masterWrapper.ihi-portal .TextButton:disabled, #ctl01_masterWrapper.ihi-portal .TextButton.aspNetDisabled, #ctl01_masterWrapper.ihi-portal .TextButton[disabled], .RadWindow.RadWindow_MetroTouch .TextButton:disabled, .RadWindow.RadWindow_MetroTouch .TextButton.aspNetDisabled, .RadWindow.RadWindow_MetroTouch .TextButton[disabled], .RadWindow.RadWindow_Metro .TextButton:disabled, .RadWindow.RadWindow_Metro .TextButton.aspNetDisabled, .RadWindow.RadWindow_Metro .TextButton[disabled] { border-color: #BBC1C8 !important; background-color: #F8F8F8 !important; color: #6B7886 !important; opacity: 0.65 !important; cursor: not-allowed !important; } @media (min-width: 992px) { body:not(.Wrapper-HomePage) #hd, body:not(.Wrapper-HomePage) .InternalHeaderArea { display: none !important; } } /* ========================================================= IHI Portal Top Utility Band Height Matches ihi.org-style taller pale blue utility strip ========================================================= */ #ctl01_masterWrapper.ihi-portal #hd.ihi-header { background: #fff !important; } /* Make the header grid behave like: Row 1 = full-width utility band Row 2 = logo + primary navigation */ #ctl01_masterWrapper.ihi-portal .ihi-header__grid { display: grid !important; grid-template-areas: "utility utility" "logo nav" !important; grid-template-columns: auto minmax(0, 1fr) !important; align-items: center !important; gap: 0 32px !important; padding-top: 0 !important; } /* Full-width pale blue top band */ #ctl01_masterWrapper.ihi-portal #auxiliary-container { grid-area: utility !important; background: #E5F5F9 !important; min-height: 58px !important; width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding: 0 32px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; } /* Keep utility content vertically centered inside the taller band */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilityNavigation { min-height: 58px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; flex-wrap: wrap !important; gap: 14px !important; width: 100% !important; } /* Clean up the actual utility list spacing */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilitySection { display: flex !important; align-items: center !important; margin: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .NavigationUnorderedList, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu { display: flex !important; align-items: center !important; gap: 14px !important; margin: 0 !important; padding: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation li { margin: 0 !important; padding: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation a, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-text { color: #005F74 !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1.3 !important; } /* Logo + primary nav row under the utility band */ #ctl01_masterWrapper.ihi-portal #masterLogoArea { grid-area: logo !important; padding-top: 22px !important; padding-bottom: 18px !important; } #ctl01_masterWrapper.ihi-portal .ihi-header__nav-wrap { grid-area: nav !important; padding-top: 22px !important; padding-bottom: 18px !important; } /* Mobile: keep the band useful without making it huge */ @media (max-width: 767px) { #ctl01_masterWrapper.ihi-portal .ihi-header__grid { display: block !important; } #ctl01_masterWrapper.ihi-portal #auxiliary-container { min-height: 52px !important; padding: 0 16px !important; justify-content: center !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilityNavigation { min-height: 52px !important; justify-content: center !important; gap: 10px !important; } #ctl01_masterWrapper.ihi-portal #masterLogoArea, #ctl01_masterWrapper.ihi-portal .ihi-header__nav-wrap { padding-top: 14px !important; padding-bottom: 12px !important; } } /* ========================================================= IHI Portal Utility Band Icon Repair Restores cart / easy edit behavior after utility band styling ========================================================= */ /* Keep the taller IHI-style utility band */ #ctl01_masterWrapper.ihi-portal #auxiliary-container { grid-area: utility !important; background: #E5F5F9 !important; min-height: 58px !important; width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding: 0 32px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; } /* Utility nav alignment only, do not force all children into generic text behavior */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilityNavigation { min-height: 58px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; flex-wrap: nowrap !important; gap: 12px !important; width: 100% !important; } /* Let sections sit cleanly */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilitySection { display: flex !important; align-items: center !important; margin: 0 !important; } /* Normal text links only */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .NavigationListItem:not(.nav-aux-button) > .NavigationLink, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .NavigationListItem:not(.nav-aux-button) > .NavigationLink .nav-text, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle .nav-text { color: #005F74 !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1.3 !important; white-space: nowrap !important; } /* Restore account link as readable text, not sprite text */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-account .NavigationLink { background: transparent !important; border: 0 !important; margin: 0 !important; padding: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-account .nav-text { background: none !important; color: #005F74 !important; display: inline-block !important; font-size: 13px !important; font-weight: 700 !important; height: auto !important; line-height: 1.3 !important; overflow: visible !important; padding: 0 !important; text-indent: 0 !important; width: auto !important; } /* Restore cart as compact icon */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart { display: inline-flex !important; align-items: center !important; position: relative !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart .NavigationLink { align-items: center !important; background: transparent !important; border: 0 !important; border-radius: 999px !important; display: inline-flex !important; height: 34px !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; position: relative !important; width: 34px !important; } /* Use Glacier responsive header sprite for cart icon */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart .nav-text { background: transparent url("/App_Themes/test3/images/ResponsiveHeaderSprite.png") 2px -75px no-repeat !important; color: transparent !important; display: block !important; font-size: 0 !important; height: 22px !important; line-height: 22px !important; margin: 0 !important; overflow: hidden !important; padding: 0 !important; text-indent: -9999px !important; white-space: nowrap !important; width: 22px !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart .cartEmpty, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart .cartFull { position: absolute !important; right: 2px !important; top: 2px !important; } /* Restore Easy Edit as icon button instead of vertical text */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilitySTEToggle { flex: 0 0 auto !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation a.ste-toggle { align-items: center !important; background: #FFFFFF !important; border: 1px solid #CCECF3 !important; border-radius: 999px !important; color: transparent !important; display: inline-flex !important; font-size: 0 !important; height: 34px !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; overflow: hidden !important; padding: 0 !important; text-decoration: none !important; width: 34px !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation a.ste-toggle::before { color: #005F74 !important; content: "\270E"; display: block; font-size: 17px !important; font-weight: 700 !important; line-height: 1 !important; text-indent: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation a.ste-toggle:hover, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation a.ste-toggle:focus, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart .NavigationLink:hover, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .nav-aux-cart .NavigationLink:focus { background: #CCECF3 !important; border-color: #0081A2 !important; } /* Search cleanup inside taller band */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilitySearch, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .search-container-sm, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .header-search { margin: 0 !important; padding: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .search-field { height: 34px !important; max-width: 260px !important; } /* Mobile: allow wrapping only when needed */ @media (max-width: 767px) { #ctl01_masterWrapper.ihi-portal #auxiliary-container { min-height: 52px !important; padding: 0 16px !important; justify-content: center !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilityNavigation { flex-wrap: wrap !important; justify-content: center !important; min-height: 52px !important; gap: 8px !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .search-field { max-width: 220px !important; } } .nav-secondary .sub-nav-head { background-color: #0081A2 !important; } /* ========================================================= IHI Portal RadGrid Pagination Arrow Repair Scoped visual-only fix for Telerik pager arrow buttons ========================================================= */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgArrPart1 input.rgPageFirst, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgArrPart1 input.rgPagePrev, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgArrPart2 input.rgPageNext, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell .rgArrPart2 input.rgPageLast, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell .rgArrPart1 input.rgPageFirst, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell .rgArrPart1 input.rgPagePrev, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell .rgArrPart2 input.rgPageNext, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell .rgArrPart2 input.rgPageLast { width: 38px !important; height: 38px !important; min-width: 38px !important; margin: 0 2px !important; padding: 0 !important; border: 1px solid #0081A2 !important; border-radius: 4px !important; background-color: #0081A2 !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 18px 18px !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; overflow: hidden !important; box-shadow: none !important; text-indent: -9999px !important; cursor: pointer !important; appearance: none !important; -webkit-appearance: none !important; } /* First page */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageFirst, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageFirst { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M11 6L5 12L11 18' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19 6L13 12L19 18' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* Previous page */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPagePrev, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPagePrev { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15 6L9 12L15 18' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* Next page */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageNext, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageNext { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 6L15 12L9 18' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* Last page */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageLast, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageLast { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 6L11 12L5 18' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13 6L19 12L13 18' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; } /* Hover/focus only for usable pager arrows */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageFirst:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPagePrev:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageNext:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageLast:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageFirst:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPagePrev:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageNext:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageLast:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageFirst:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPagePrev:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageNext:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageLast:not([onclick="return false;"]):hover, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageFirst:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPagePrev:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageNext:not([onclick="return false;"]):focus, #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageLast:not([onclick="return false;"]):focus { background-color: #005F74 !important; border-color: #005F74 !important; outline: 2px solid #CCECF3 !important; outline-offset: 2px !important; } /* Telerik uses onclick="return false;" for unavailable arrows */ #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageFirst[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPagePrev[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageNext[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_MetroTouch .rgPagerCell input.rgPageLast[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageFirst[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPagePrev[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageNext[onclick="return false;"], #ctl01_masterWrapper.ihi-portal .RadGrid.RadGrid_Metro .rgPagerCell input.rgPageLast[onclick="return false;"] { opacity: 0.45 !important; cursor: default !important; } /* ========================================================= IHI Portal Account Dropdown Repair Restores native iMIS account/logout dropdown ========================================================= */ /* Do NOT hide the whole header on internal pages */ @media (min-width: 992px) { body:not(.Wrapper-HomePage) #hd { display: block !important; } body:not(.Wrapper-HomePage) .InternalHeaderArea { display: none !important; } } /* Keep utility sections aligned */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilitySection { display: flex !important; align-items: center !important; margin: 0 !important; } /* Only flex the regular utility link list, not the account dropdown container */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .NavigationUnorderedList { display: flex !important; align-items: center !important; gap: 14px !important; margin: 0 !important; padding: 0 !important; } /* Restore native account menu structure */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .UtilityAccountArea { position: relative !important; display: block !important; flex: 0 0 auto !important; margin: 0 !important; } /* Do not force .account-menu itself into flex */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu { display: block !important; position: relative !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } /* Keep the visible name trigger clean */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle-wrapper { display: block !important; position: relative !important; margin: 0 !important; padding: 0 !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle { display: inline-flex !important; align-items: center !important; gap: 6px !important; min-height: 34px !important; padding: 4px 8px !important; color: #005F74 !important; background: transparent !important; border-radius: 4px !important; text-decoration: none !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle .nav-text { color: #005F74 !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1.3 !important; white-space: nowrap !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle:hover, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle:focus { background: #CCECF3 !important; color: #005F74 !important; text-decoration: none !important; } /* Restore caret visibility */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-toggle .caret { border-top-color: #005F74 !important; } /* Restore dropdown positioning and stacking */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu { position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; z-index: 5000 !important; display: none; min-width: 220px !important; margin: 4px 0 0 !important; padding: 8px 0 !important; background: #ffffff !important; border: 1px solid #CCECF3 !important; border-radius: 4px !important; box-shadow: 0 8px 24px rgba(43, 49, 55, 0.16) !important; } /* Bootstrap/iMIS open state */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown.open > .dropdown-menu, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown:hover > .dropdown-menu, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown:focus-within > .dropdown-menu { display: block !important; } /* Do not let utility-wide li/a rules flatten dropdown contents */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu li { display: block !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu a, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu .dropdown-header { display: block !important; padding: 8px 14px !important; color: #005F74 !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1.4 !important; text-decoration: none !important; white-space: nowrap !important; } #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu a:hover, #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu a:focus { background: #E5F5F9 !important; color: #005F74 !important; text-decoration: none !important; } /* Divider cleanup */ #ctl01_masterWrapper.ihi-portal #ste_container_ciUtilityNavigation .account-menu .dropdown-menu .divider { height: 1px !important; margin: 6px 0 !important; padding: 0 !important; overflow: hidden !important; background: #CCECF3 !important; } /* ========================================================= IHI Portal Telerik Edit Modal / RadWindow Brand Patch Replaces OOTB Glacier dark blue used on edit modal headers ========================================================= */ /* RadWindow title bar / top chrome */ .RadWindow.RadWindow_MetroTouch .rwTitleRow .rwTitlebar, .RadWindow.RadWindow_MetroTouch .rwTitleRow .rwTopLeft, .RadWindow.RadWindow_MetroTouch .rwTitleRow .rwTopRight, .RadWindow.RadWindow_Metro .rwTitlebar, .RadWindow.RadWindow_Metro .rwTopLeft, .RadWindow.RadWindow_Metro .rwTopRight, .RadWindow.RadWindow_Metro .rwTopResize { background-color: #0081A2 !important; background-image: none !important; } /* Modal title text */ .RadWindow.RadWindow_MetroTouch .rwTitleRow em, .RadWindow.RadWindow_Metro table.rwTitlebarControls em { color: #ffffff !important; font-family: "Roboto", "Roboto Flex", Arial, Helvetica, sans-serif !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; } /* Modal control icons: refresh, maximize, close */ .RadWindow.RadWindow_MetroTouch .rwControlButtons a, .RadWindow.RadWindow_Metro .rwControlButtons a { background-color: #0081A2 !important; border-color: #0081A2 !important; } /* Modal control hover/focus */ .RadWindow.RadWindow_MetroTouch .rwControlButtons a:hover, .RadWindow.RadWindow_MetroTouch .rwControlButtons a:focus, .RadWindow.RadWindow_Metro .rwControlButtons a:hover, .RadWindow.RadWindow_Metro .rwControlButtons a:focus { background-color: #005F74 !important; border-color: #005F74 !important; outline: 2px solid #CCECF3 !important; outline-offset: 2px !important; } /* Popup button focus states inside Telerik dialogs */ .RadWindow.RadWindow_MetroTouch .rwTitleRow td.rwWindowContent a.rwPopupButton:active, .RadWindow.RadWindow_MetroTouch .rwTitleRow td.rwWindowContent a.rwPopupButton:focus { background-color: #0081A2 !important; border-color: #0081A2 !important; } /* Keep modal body neutral and clean */ .RadWindow.RadWindow_MetroTouch td.rwBodyLeft, .RadWindow.RadWindow_MetroTouch td.rwBodyRight, .RadWindow.RadWindow_MetroTouch .rwFooterCenter, .RadWindow.RadWindow_MetroTouch .rwFooterLeft, .RadWindow.RadWindow_MetroTouch .rwFooterRight { background: #ffffff !important; } /* Optional: soften the visible modal edge */ .RadWindow.RadWindow_MetroTouch, .RadWindow.RadWindow_Metro { border-color: #CCECF3 !important; box-shadow: 0 12px 32px rgba(43, 49, 55, 0.22) !important; } /* ========================================================= IHI Portal - Open Invoices Expand / Collapse Icon Fix Scope: OpenInvoicesGrid only ========================================================= */ html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] th.rgExpandCol, html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol { width: 44px !important; min-width: 44px !important; max-width: 44px !important; padding: 6px 4px !important; text-align: center !important; vertical-align: middle !important; background-image: none !important; } html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] th.rgExpandCol { color: transparent !important; font-size: 0 !important; line-height: 0 !important; } html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] tr.rgRow > td.rgExpandCol { background-color: #FFFFFF !important; } html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] tr.rgAltRow > td.rgExpandCol { background-color: #F8F8F8 !important; } html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgExpand, html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgCollapse { box-sizing: border-box !important; display: inline-block !important; width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 26px !important; max-width: 26px !important; max-height: 26px !important; margin: 0 auto !important; padding: 0 !important; vertical-align: middle !important; border: 1px solid #0081A2 !important; border-radius: 3px !important; background-color: #0081A2 !important; background-repeat: no-repeat !important; background-position: center center !important; box-shadow: none !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-indent: -9999px !important; overflow: hidden !important; white-space: nowrap !important; cursor: pointer !important; appearance: none !important; -webkit-appearance: none !important; } /* Plus */ html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgExpand { background-image: linear-gradient(#FFFFFF, #FFFFFF), linear-gradient(#FFFFFF, #FFFFFF) !important; background-size: 14px 2px, 2px 14px !important; background-position: center center, center center !important; background-repeat: no-repeat, no-repeat !important; } /* Minus */ html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgCollapse { background-image: linear-gradient(#FFFFFF, #FFFFFF) !important; background-size: 14px 2px !important; background-position: center center !important; background-repeat: no-repeat !important; } html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgExpand:hover, html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgExpand:focus, html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgCollapse:hover, html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] td.rgExpandCol input.rgCollapse:focus { background-color: #005F74 !important; border-color: #005F74 !important; outline: 2px solid #CCECF3 !important; outline-offset: 1px !important; } /* Keep the Pay checkbox native */ html body #ctl01_masterWrapper.ihi-portal table[id*="OpenInvoicesGrid"] input[id*="PayInvoiceCheckBox"] { appearance: checkbox !important; -webkit-appearance: checkbox !important; width: 17px !important; height: 17px !important; min-width: 17px !important; min-height: 17px !important; margin: 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; color: initial !important; font-size: initial !important; line-height: initial !important; text-indent: 0 !important; accent-color: #0081A2 !important; cursor: pointer !important; } .btn, .TextButton, .RadUpload.RadUpload .ruButton, .RadUploadProgressArea.RadUploadProgressArea .ruButton { background-color: var(--ihi-light-blue, #009FC2) !important; border-color: transparent; } /* ========================================================= IHI Portal - Remove Shadow Under Header Logo Scope: Header logo content item only ========================================================= */ #ctl01_masterWrapper.ihi-portal #masterLogoArea, #ctl01_masterWrapper.ihi-portal #masterLogoArea .WTZone, #ctl01_masterWrapper.ihi-portal #masterLogoArea .ContentItemContainer, #ctl01_masterWrapper.ihi-portal #ste_container_ciLogoContent, #ctl01_masterWrapper.ihi-portal #ste_container_NewContentHtml, #ctl01_masterWrapper.ihi-portal #ste_container_ciLogoContent .ihiportal-logo-safe, #ctl01_masterWrapper.ihi-portal #ste_container_ciLogoContent .ihiportal-logo-safe__link, #ctl01_masterWrapper.ihi-portal #ste_container_ciLogoContent .ihiportal-logo-safe__image { background: transparent !important; border: 0 !important; box-shadow: none !important; filter: none !important; text-shadow: none !important; } /* Hide empty iMIS content edit/button panel space under logo */ #ctl01_masterWrapper.ihi-portal #ste_container_ciLogoContent .ContentRecordPageButtonPanel { display: none !important; } /* ========================================================= IHI Portal - Heading Icon Text Case Fix Fixes GlacierBay uppercase panel headings ========================================================= */ #ctl01_masterWrapper.ihi-portal .heading-icon .panel-title, #ctl01_masterWrapper.ihi-portal .heading-icon .panel-title a, #ctl01_masterWrapper.ihi-portal .heading-icon h3, #ctl01_masterWrapper.ihi-portal .heading-icon h3 a { text-transform: none !important; } /* ========================================================= IHI Portal - Mini Profile Status Card Spacing Fix Keeps IHI ID / Member Type / Status values from wrapping ========================================================= */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-section .mini-profile-status-wrapper { box-sizing: border-box !important; padding: 16px 14px 18px !important; width: 100% !important; } /* Each status row */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-section .PanelField { box-sizing: border-box !important; display: flex !important; align-items: flex-start !important; gap: 12px !important; width: 100% !important; margin: 0 0 16px !important; padding: 0 !important; } /* Label column */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-section .Label { display: block !important; flex: 0 0 90px !important; min-width: 0 !important; padding: 0 !important; font-weight: 700 !important; line-height: 1.35 !important; } /* Value column */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-section .PanelFieldValue { display: block !important; flex: 1 1 auto !important; min-width: 0 !important; line-height: 1.35 !important; } /* Prevent short values from wrapping */ #ctl01_masterWrapper.ihi-portal #ste_container_ciMiniProfile .mini-profile-status-section .PanelFieldValue span { white-space: nowrap !important; } /* ========================================================= IHI Portal - Event Invoice PDF Report Width Fix Scope: pages containing ReportFrameControl only ========================================================= */ @media (min-width: 992px) { html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #masterContentArea { width: calc(100% - 64px) !important; max-width: 1280px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 15px !important; padding-right: 15px !important; } html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #ContentPanel, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .col-primary, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #mainContentWrapper, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #WebPartZone1_Page1, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .iMIS-WebPart, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #ste_container_ciNewContentCollectionOrganizerCommon, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #ste_container_ciNewContentCollectionOrganizerCommon > .panel, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .cco, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .RadMultiPage, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .rmpView, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .ContentWizardDisplay, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .ContentWizardDisplay > div, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .ContentWizardDisplay .row, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .ContentWizardDisplay .col-sm-12, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) [id*="Zone1PlaceHolder"], html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #ste_container_NewDataShowcaseCommon, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) #ste_container_NewDataShowcaseCommon > .panel { width: 100% !important; max-width: none !important; box-sizing: border-box !important; } } /* Make the embedded report viewer usable */ html body #ctl01_masterWrapper.ihi-portal #ReportFrameControl { display: block !important; width: 100% !important; min-width: 900px !important; height: 1100px !important; min-height: calc(100vh - 260px) !important; border: 0 !important; } /* Allow horizontal scroll only if the viewport is too small */ html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .panel-body, html body #ctl01_masterWrapper.ihi-portal:has(#ReportFrameControl) .panel-body-container { overflow-x: auto !important; } /* ========================================================= IHI Portal - Global SSRS Report Viewer Width Fix Scope: native SSRS ReportDisplay / ReportViewer pages Fixes: certificate reports and other SSRS reports that do not use #ReportFrameControl ========================================================= */ /* Give SSRS report pages a wider usable content area */ @media (min-width: 992px) { html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #masterContentArea { width: calc(100% - 64px) !important; max-width: 1320px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 15px !important; padding-right: 15px !important; } html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #ContentPanel, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .col-primary, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #mainContentWrapper, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #WebPartZone1_Page1, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .iMIS-WebPart, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .ContentItemContainer, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .ParentContainerPanel { width: 100% !important; max-width: none !important; box-sizing: border-box !important; } } /* Keep the SSRS shell from compressing */ html body #ctl01_masterWrapper.ihi-portal .ParentContainerPanel, html body #ctl01_masterWrapper.ihi-portal .ReportContainerPanel, html body #ctl01_masterWrapper.ihi-portal .ReportRightPanel, html body #ctl01_masterWrapper.ihi-portal .ReportRightInnerPanel, html body #ctl01_masterWrapper.ihi-portal span[id$="_ReportViewer"], html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer { width: 100% !important; max-width: none !important; box-sizing: border-box !important; } /* Do not force display here. iMIS/SSRS controls visibility with inline display states during load/postback. */ /* Make the actual viewer usable instead of letting PageWidth compress into a skinny column */ @media (min-width: 992px) { html body #ctl01_masterWrapper.ihi-portal .ReportRightPanel, html body #ctl01_masterWrapper.ihi-portal .ReportRightInnerPanel, html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer, html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer table[id$="_fixedTable"], html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer div[id$="_ReportArea"], html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer div[id$="_ReportControl"], html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer div[id$="_NonReportContent"] { width: 100% !important; max-width: none !important; min-width: 960px !important; box-sizing: border-box !important; } } /* Allow horizontal scroll if the report is naturally wider than the viewport */ html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .ReportRightPanel, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .ReportRightInnerPanel, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .SSRSReportViewer, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .panel-body, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .panel-body-container { overflow-x: auto !important; overflow-y: visible !important; } /* Keep report images from getting distorted by the global responsive image rule */ html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer img { max-width: none !important; height: auto !important; } /* Mobile/tablet: SSRS is not ideal, but do not let it collapse into nothing */ @media (max-width: 991px) { html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #masterContentArea, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #ContentPanel, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .col-primary, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) #mainContentWrapper { width: 100% !important; max-width: 100% !important; padding-left: 12px !important; padding-right: 12px !important; box-sizing: border-box !important; } html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer, html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer table[id$="_fixedTable"], html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer div[id$="_ReportArea"], html body #ctl01_masterWrapper.ihi-portal .SSRSReportViewer div[id$="_ReportControl"] { width: 100% !important; min-width: 760px !important; max-width: none !important; } html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .ReportRightPanel, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .ReportRightInnerPanel, html body #ctl01_masterWrapper.ihi-portal:has(.SSRSReportViewer) .SSRSReportViewer { overflow-x: auto !important; } } /* ========================================================= IHI Portal - Global Telerik RadGrid Expand / Collapse Fix Scope: All RadGrid expand/collapse buttons inside IHI portal Fixes: Open invoices, recent transactions, donation history, billing grids ========================================================= */ /* Keep the expand/collapse column compact and centered */ html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable th.rgExpandCol, html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol { width: 42px !important; min-width: 42px !important; max-width: 42px !important; padding: 6px 4px !important; text-align: center !important; vertical-align: middle !important; background-image: none !important; } /* Hide ugly header text like "Expand Collapse" but keep the column */ html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable th.rgExpandCol { color: transparent !important; font-size: 0 !important; line-height: 0 !important; } /* Reset Telerik expand/collapse inputs so global button styling does not hijack them */ html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgExpand, html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgCollapse { appearance: none !important; -webkit-appearance: none !important; box-sizing: border-box !important; display: inline-block !important; width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 26px !important; max-width: 26px !important; max-height: 26px !important; margin: 0 auto !important; padding: 0 !important; border: 1px solid var(--ihi-blue-800, #0081A2) !important; border-radius: 3px !important; background-color: var(--ihi-blue-800, #0081A2) !important; background-position: center center !important; background-repeat: no-repeat !important; background-image: none !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-indent: -9999px !important; overflow: hidden !important; white-space: nowrap !important; box-shadow: none !important; cursor: pointer !important; } /* Collapsed state: plus icon */ html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgExpand { background-image: linear-gradient(#FFFFFF, #FFFFFF), linear-gradient(#FFFFFF, #FFFFFF) !important; background-size: 14px 2px, 2px 14px !important; background-position: center center, center center !important; background-repeat: no-repeat, no-repeat !important; } /* Expanded state: minus icon */ html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgCollapse { background-image: linear-gradient(#FFFFFF, #FFFFFF) !important; background-size: 14px 2px !important; background-position: center center !important; background-repeat: no-repeat !important; } /* Hover/focus */ html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgExpand:hover, html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgExpand:focus, html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgCollapse:hover, html body #ctl01_masterWrapper.ihi-portal .RadGrid .rgMasterTable td.rgExpandCol input.rgCollapse:focus { background-color: var(--ihi-blue-900, #005F74) !important; border-color: var(--ihi-blue-900, #005F74) !important; outline: 2px solid var(--ihi-blue-200, #CCECF3) !important; outline-offset: 1px !important; } /* Do not let expand/collapse buttons inherit CTA button spacing */ html body #ctl01_masterWrapper.ihi-portal .RadGrid input.rgExpand, html body #ctl01_masterWrapper.ihi-portal .RadGrid input.rgCollapse { letter-spacing: 0 !important; font-weight: normal !important; } /* ========================================================= IHI Portal - Global Collapsible Panel Plus / Minus Control Scope: All iMIS collapsible panel headers inside IHI portal Purpose: - Standardizes panel expand/collapse controls globally - Draws plus/minus using background gradients on the button itself - Avoids conflicts with native sysicon pseudo-elements ========================================================= */ /* Header layout */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 1rem !important; cursor: pointer !important; } /* Title alignment */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible .panel-title, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible .PanelTitle { flex: 1 1 auto !important; margin: 0 !important; } html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible .panel-title a, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible .PanelTitle a { color: var(--ihi-text, #455560) !important; text-decoration: none !important; } /* Kill old heading-level pseudo icon layers */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible::before, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible::after, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible::before, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible::after { content: none !important; display: none !important; background: none !important; background-image: none !important; } /* Icon container alignment */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible .panel-heading-options, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible .PanelHeadOptions { display: flex !important; align-items: center !important; justify-content: flex-end !important; flex: 0 0 auto !important; margin-left: auto !important; } /* Button shell */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible .panel-heading-options > a.panel-heading-collapse, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible .PanelHeadOptions > a.panel-heading-collapse, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse { position: relative !important; display: inline-block !important; width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 26px !important; max-width: 26px !important; max-height: 26px !important; margin: 0 !important; padding: 0 !important; border: 1px solid var(--ihi-blue-800, #0081A2) !important; border-radius: 3px !important; background-color: var(--ihi-blue-800, #0081A2) !important; background-position: center center !important; background-repeat: no-repeat !important; color: transparent !important; font-size: 0 !important; line-height: 0 !important; text-decoration: none !important; text-indent: -9999px !important; overflow: hidden !important; box-shadow: none !important; } /* Kill native sysicon pseudo-elements only on panel collapse buttons */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon::before, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon::after, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon-expanded::before, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon-expanded::after, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon-collapsed::before, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon-collapsed::after, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon::before, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon::after, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon-expanded::before, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon-expanded::after, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon-collapsed::before, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon-collapsed::after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; background: none !important; background-image: none !important; font-size: 0 !important; line-height: 0 !important; } /* Expanded state: minus icon */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon-expanded, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse[aria-expanded="true"], html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon-expanded, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse[aria-expanded="true"] { background-image: linear-gradient(#FFFFFF, #FFFFFF) !important; background-size: 14px 2px !important; background-position: center center !important; background-repeat: no-repeat !important; } /* Collapsed state: plus icon */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.collapsed, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse.sysicon-collapsed, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse[aria-expanded="false"], html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.collapsed, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse.sysicon-collapsed, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse[aria-expanded="false"] { background-image: linear-gradient(#FFFFFF, #FFFFFF), linear-gradient(#FFFFFF, #FFFFFF) !important; background-size: 14px 2px, 2px 14px !important; background-position: center center, center center !important; background-repeat: no-repeat, no-repeat !important; } /* Keep screen-reader label hidden without affecting the background icon */ html body #ctl01_masterWrapper.ihi-portal .panel-heading-collapse .panel-heading-collapse-text { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; } /* Hover/focus */ html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse:hover, html body #ctl01_masterWrapper.ihi-portal .panel-heading.Distinguish.Collapsible a.panel-heading-collapse:focus, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse:hover, html body #ctl01_masterWrapper.ihi-portal .PanelHead.Distinguish.Collapsible a.panel-heading-collapse:focus { background-color: var(--ihi-blue-900, #005F74) !important; border-color: var(--ihi-blue-900, #005F74) !important; outline: 2px solid var(--ihi-blue-200, #CCECF3) !important; outline-offset: 1px !important; }