@import url("../fonts/local/fira-sans/a0864ac343ef311f17c93211/font.css"); html body, #outercontainer input, #outercontainer select, #outercontainer textarea, #outercontainer button { font-family: "Fira Sans", sans-serif; } #outercontainer h1, #outercontainer h2, #outercontainer h3, #outercontainer h4, #outercontainer h5, #outercontainer h6, #outercontainer h1 > a, #outercontainer h2 > a, #outercontainer h3 > a, #outercontainer h4 > a, #outercontainer h5 > a, #outercontainer h6 > a { font-family: "Fira Sans", sans-serif; } #outercontainer #nav a, #outercontainer #secnav a, #outercontainer #verticalnav a, #vert-nav a { font-family: "Fira Sans", sans-serif; } /* Alignment applies only to the layout's horizontal share buttons. */ #outercontainer .shariff[data-karo-align] > ul.orientation-horizontal { column-gap: 10px; row-gap: 10px; } #outercontainer .shariff[data-karo-align] > ul.orientation-horizontal > li { flex-grow: 0; margin: 0; } #outercontainer .shariff[data-karo-align="left"] > ul.orientation-horizontal { justify-content: flex-start; } #outercontainer .shariff[data-karo-align="center"] > ul.orientation-horizontal { justify-content: center; } #outercontainer .shariff[data-karo-align="right"] > ul.orientation-horizontal { justify-content: flex-end; } html[data-karo-theme="dark"] { --karo-bg: #15181d; --karo-surface: #222730; --karo-text: #edf0f5; --karo-muted: #b5bfcd; --karo-link: #8bc7ff; --karo-border: #4c5868; background-color: var(--karo-bg); color: var(--karo-text); color-scheme: dark; } html[data-karo-theme="dark"] body, html[data-karo-theme="dark"] #outercontainer, html[data-karo-theme="dark"] #filltop, html[data-karo-theme="dark"] #fillbottom, html[data-karo-theme="dark"] #contentcontainercontainer, html[data-karo-theme="dark"] #contentcontainer, html[data-karo-theme="dark"] #content, html[data-karo-theme="dark"] #maincontainer, html[data-karo-theme="dark"] #main, html[data-karo-theme="dark"] #headercontainer, html[data-karo-theme="dark"] #header, html[data-karo-theme="dark"] #footercontainer, html[data-karo-theme="dark"] #footer { background-color: var(--karo-bg); color: var(--karo-text); } html[data-karo-theme="dark"] #outercontainer #sidebarleft, html[data-karo-theme="dark"] #outercontainer #sidebarright, html[data-karo-theme="dark"] #outercontainer .paragraphborder_default, html[data-karo-theme="dark"] #outercontainer #eyecatchercontainer, html[data-karo-theme="dark"] #outercontainer #eyecatcher, html[data-karo-theme="dark"] #outercontainer #nav .sqrnavsearch form, html[data-karo-theme="dark"] #outercontainer #searchbox form, html[data-karo-theme="dark"] #contactcontainer, html[data-karo-theme="dark"] #contact, html[data-karo-theme="dark"] #logocontainer, html[data-karo-theme="dark"] #logo, html[data-karo-theme="dark"] #commontopcontainer, html[data-karo-theme="dark"] #commontop, html[data-karo-theme="dark"] #commoncontainer, html[data-karo-theme="dark"] #common, html[data-karo-theme="dark"] #searchboxcontainer, html[data-karo-theme="dark"] #searchbox, html[data-karo-theme="dark"] #navcontainer, html[data-karo-theme="dark"] #nav, html[data-karo-theme="dark"] #nav li, html[data-karo-theme="dark"] #nav ul, html[data-karo-theme="dark"] #nav > div, html[data-karo-theme="dark"] #secnavcontainer, html[data-karo-theme="dark"] #secnav, html[data-karo-theme="dark"] #verticalnav, html[data-karo-theme="dark"] #verticalnav ul { background-color: var(--karo-surface); color: var(--karo-text); border-color: var(--karo-border); } html[data-karo-theme="dark"] #outercontainer h1, html[data-karo-theme="dark"] #outercontainer h2, html[data-karo-theme="dark"] #outercontainer h3, html[data-karo-theme="dark"] #outercontainer h4, html[data-karo-theme="dark"] #outercontainer h5, html[data-karo-theme="dark"] #outercontainer h6, html[data-karo-theme="dark"] #outercontainer label, html[data-karo-theme="dark"] #outercontainer legend { color: var(--karo-text); } html[data-karo-theme="dark"] #outercontainer a { color: var(--karo-link); } html[data-karo-theme="dark"] #outercontainer a:hover { color: var(--karo-text); } html[data-karo-theme="dark"] #outercontainer #nav a, html[data-karo-theme="dark"] #outercontainer #secnav a, html[data-karo-theme="dark"] #outercontainer #verticalnav a { color: var(--karo-text); background-color: transparent; } html[data-karo-theme="dark"] #outercontainer #nav li.active > a, html[data-karo-theme="dark"] #outercontainer #nav a:hover, html[data-karo-theme="dark"] #outercontainer #secnav a:hover, html[data-karo-theme="dark"] #outercontainer #verticalnav a:hover { color: var(--karo-text); background-color: var(--karo-bg); } /* Dropdown and mega-menu panels have their own light-layout backgrounds. */ html[data-karo-theme="dark"] #outercontainer #nav > ul > li > div, html[data-karo-theme="dark"] #outercontainer #nav > ul > li > div > div, html[data-karo-theme="dark"] #outercontainer #nav ul ul, html[data-karo-theme="dark"] #outercontainer #nav ul ul li { background: var(--karo-surface); color: var(--karo-text); border-color: var(--karo-border); } html[data-karo-theme="dark"] #outercontainer #nav li.sqrnavopen, html[data-karo-theme="dark"] #outercontainer #nav.navhover li.sqrnavmore:hover { background: var(--karo-bg); color: var(--karo-text); } html[data-karo-theme="dark"] #outercontainer #nav li.sqrnavopen > a, html[data-karo-theme="dark"] #outercontainer #nav.navhover li.sqrnavmore:hover > a, html[data-karo-theme="dark"] #outercontainer #nav a:focus-visible { color: var(--karo-text); background-color: var(--karo-bg); } /* Reuse the normal navigation's matching open/hover foreground and background. */ html[data-karo-theme="dark"] #outercontainer #nav li.sqrnavopen > a, html[data-karo-theme="dark"] #outercontainer #nav.navhover li.sqrnavmore:hover > a, html[data-karo-theme="dark"] #outercontainer #nav a:hover, html[data-karo-theme="dark"] #outercontainer #nav a:focus-visible { background-color: #828282; color: #ffffff; } html[data-karo-theme="dark"] #outercontainer #nav a:hover h2, html[data-karo-theme="dark"] #outercontainer #nav a:hover h3, html[data-karo-theme="dark"] #outercontainer #nav a:focus-visible h2, html[data-karo-theme="dark"] #outercontainer #nav a:focus-visible h3 { color: inherit; } html[data-karo-theme="dark"] #outercontainer input:not([type="checkbox"]):not([type="radio"]), html[data-karo-theme="dark"] #outercontainer textarea, html[data-karo-theme="dark"] #outercontainer select, html[data-karo-theme="dark"] #outercontainer button, html[data-karo-theme="dark"] #outercontainer .ngform-button { background-color: var(--karo-surface); color: var(--karo-text); border-color: var(--karo-border); } html[data-karo-theme="dark"] #outercontainer input::placeholder, html[data-karo-theme="dark"] #outercontainer textarea::placeholder, html[data-karo-theme="dark"] #outercontainer .sqrbreadcrumbs, html[data-karo-theme="dark"] #outercontainer figcaption { color: var(--karo-muted); } html[data-karo-theme="dark"] #outercontainer hr, html[data-karo-theme="dark"] #outercontainer td, html[data-karo-theme="dark"] #outercontainer th { border-color: var(--karo-border); } #outercontainer #nav li.karo-theme-switch { position: relative; float: right; width: auto; margin: 0; padding: 0; background: transparent; } #outercontainer #nav .karo-theme-switch[hidden], #outercontainer #nav .karo-theme-options[hidden] { display: none; } #outercontainer #nav .karo-theme-trigger { display: block; box-sizing: border-box; min-width: 44px; min-height: 44px; padding: 8px; margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: var(--karo-text, #ffffff); font: bold 15px 'Fira Sans',Helvetica,sans-serif; line-height: 20px; cursor: pointer; } #outercontainer #nav .karo-theme-trigger svg { display: inline-block; width: 1.2em; height: 1.2em; vertical-align: middle; } #outercontainer #nav .karo-theme-trigger:hover { color: #ffffff; color: #e5e5e5; } #outercontainer #nav .karo-theme-trigger[aria-expanded="true"] { background: #828282; color: #ffffff; } #outercontainer #nav .karo-theme-options { position: absolute; top: 100%; right: 0; z-index: 1000; width: 30vw; max-width: 320px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); } #outercontainer #nav .karo-theme-option { display: block; margin: 0; padding: 0; background: #828282; } #outercontainer #nav .karo-theme-option:last-child { border-bottom: none; } #outercontainer #nav .karo-theme-options button { display: block; box-sizing: border-box; width: 100%; padding: 8px; margin: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; color: #ffffff; font: 15px 'Fira Sans',Helvetica,sans-serif; line-height: 20px; letter-spacing: 0px; text-transform: none; font-family: "Fira Sans", sans-serif; text-align: left; text-decoration: none; -webkit-tap-highlight-color: transparent; cursor: pointer; } #outercontainer #nav .karo-theme-options button[aria-pressed="true"] { font-weight: bold; } #outercontainer #nav .karo-theme-options button:hover { background-color: rgba(0, 0, 0, 0.035); } html[data-karo-theme="dark"] #outercontainer #nav .karo-theme-option { background-color: var(--karo-surface); border-color: var(--karo-border); } html[data-karo-theme="dark"] #outercontainer #nav .karo-theme-switch button { color: var(--karo-text); background-color: transparent; } html[data-karo-theme="dark"] #outercontainer #nav .karo-theme-switch button:hover, html[data-karo-theme="dark"] #outercontainer #nav .karo-theme-options button[aria-pressed="true"] { color: var(--karo-text); background-color: var(--karo-bg); } html[data-karo-theme="dark"] #outercontainer #nav .karo-theme-switch button:hover, html[data-karo-theme="dark"] #outercontainer #nav .karo-theme-switch button:focus-visible { background-color: #828282; color: #ffffff; } @media (max-width: 1023.99px) { #outercontainer #nav .karo-theme-options { width: min(320px, calc(100vw - 32px)); } } #outercontainer #nav .karo-theme-switch button:focus-visible, html[data-karo-theme="dark"] #outercontainer :focus-visible { outline: 2px solid var(--karo-link, #1461a5); outline-offset: 2px; } @media print { #outercontainer #nav .karo-theme-switch { display: none; } }