:root { --ifx-font-family: "Source Sans 3"; font-family: var(--ifx-font-family, sans-serif); } :host { height: 100%; display: inline-flex; } .sidebar__container { box-sizing: border-box; display: inline-flex; flex-direction: column; align-items: flex-start; padding: 0px; background-color: #FFFFFF; border-right: 1px solid #EEEDED; width: 264px; height: 100%; font-family: var(--ifx-font-family); } .sidebar__container .sidebar__top-container { display: flex; flex-direction: column; align-items: center; padding: 0px; flex: 1 1 auto; order: 0; z-index: 0; width: 100%; overflow-y: auto; } .sidebar__container .sidebar__top-container .sidebar__nav-bar { box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; padding: 12px 32px; background-color: #FFFFFF; flex: none; order: 0; flex-grow: 0; width: 100%; } .sidebar__container .sidebar__top-container .sidebar__nav-bar .sidebar__nav-bar-logo { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 0px; gap: 16px; flex: none; order: 0; flex-grow: 0; } .sidebar__container .sidebar__top-container .sidebar__nav-bar .sidebar__nav-bar-logo .sidebar__nav-bar-logo-img { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0px; flex: none; order: 0; flex-grow: 0; } .sidebar__container .sidebar__top-container .sidebar__nav-bar .sidebar__nav-bar-logo .sidebar__nav-bar-logo-img svg { width: 91px; height: 40px; } .sidebar__container .sidebar__top-container .sidebar__nav-bar .sidebar__nav-bar-logo .sidebar__nav-bar-logo-text { font-style: normal; font-weight: 600; font-size: 1rem; line-height: 1.5rem; display: flex; align-items: center; color: #1D1D1D; flex: none; order: 1; flex-grow: 0; white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; } .sidebar__container .sidebar__top-container .sidebar__nav-container { scrollbar-gutter: stable; box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; padding: 12px 32px; flex: 1 1 auto; order: 1; width: 100%; } .sidebar__container .sidebar__top-container .sidebar__nav-container ::slotted(*) { width: 100%; } .sidebar__container .sidebar__footer-container { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding: 0px 32px; flex: none; order: 1; align-self: stretch; flex-grow: 1; z-index: 1; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper { display: flex; flex-direction: column; align-items: flex-start; padding: 24px 0px; gap: 16px; border-top: 1px solid #EEEDED; flex: none; order: 0; flex-grow: 0; width: 100%; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-top-links { display: flex; align-items: flex-start; padding: 0px; gap: 12px; flex: none; order: 0; align-self: stretch; flex-grow: 0; flex-wrap: wrap; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-top-links a { font: 400 0.875rem/1.25rem "Source Sans 3"; display: flex; text-decoration: none; align-items: center; color: #1D1D1D; flex: none; flex-grow: 0; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-top-links a:hover { color: #08665C; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-top-links a:focus { outline: none; color: #08665C; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-bottom-links { display: flex; flex-direction: column; align-items: center; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-bottom-links span { font: 400 0.875rem/1.25rem "Source Sans 3"; text-decoration: none; color: #575352; flex: none; order: 1; flex-grow: 0; white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; } .sidebar__container .sidebar__footer-container .sidebar__footer-wrapper .sidebar__footer-wrapper-bottom-links span:hover { cursor: initial; }