/* ==========================================================================
   # COPY/PASTE INSPECTION GENERATED STYLES BELOW STARTING WITH @CHARSET
   ========================================================================== */

  @charset "UTF-8";
  /* ==========================================================================
    # APP.SCSS
    ========================================================================== */
  /**
  * This file produces styles in coordination with nuxt's "extractCSS" setting
  * 1. For v2 Inspections, via use of "app_inspections.scss"
  * 2. For the Orchestrator repo via "app_orchestrator", as required to copy styles to the other repo
  * 3. For the Database Manager via "app_database-manager", as required to copy styles to the other repo
  * See the repo readme for more information on SASS rendering
  *
  */
  /* ==========================================================================
    # ORCHESTRATOR
    ========================================================================== */
  /**
  * This file produces app_orchestrator.css which is consumed
  * by our micro app framework "wrapper" (orchestrator).
  *
  * The Inspections v2 theme is meant to be "universal".
  * 1. New micro apps should not use orchestrator.css.
  *    The main.scss (v2) file should be able to produce all universal styles required.
  * 2. Orchestrator.css should be used for the "wrapper" itself, probably with ID exclusion targets
  * 3. Legacy products should use their own CSS or a modified output of Orchestrator.scss.
  *
  */
  /**
  * IE11 only
  */
  /**
  * Edge 12-83
  * all versions before chromium
  */
  /**
  * Edge 15 and below
  * most often used for css grid detection
  */
  /**
  * Example of use
  *

  @include keyframes(example-animation) {
    0%  {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }

  *end of use example
  */
  /**
  * Break long inline text across multiple browsers
  * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
  */
  /**
  * Break long inline text across multiple browsers
  */
  /**
  * Calculation Result
  */
  /**
  * File list (upload)
  */
  /**
  * Info Box (WYSIWYG editor feature)
  */
  /**
  * Vertical Rhythm
  * Label incl. margin = 30px
  * Label incl. margin + input @ 45px = 75px
  * Label incl. margin + input + message = 100px
  * Margin below element = 50px
  * Full element = 150px
  */
  /* ==========================================================================
    #DATAMATRIX WITH SLANTED HEADERS
    ========================================================================== */
  /**
  * Creates a grid of checkbox controls and a slanted header.
  * The grid is aligned with the header diagonals by way of a hypotenuse calculation
  * Uses compatible units in SASS calculations, e.g., "px".  Refactor to unitless if you prefer.
  *
  */
  /* [6] [7] */
  /**
  * Minimal styles for BV toast support
  * Assumes a solid block of color and bottom-right placement
  * Styling is roughly consistent with .c-alert component
  */
  /**
  * Minimal styles for BV "toaster" (b-toast container) support
  * Styling is roughly consistent with .c-alert component
  * and is roughly equivalent to styles for "o-notifications o-notifications-bottom-right"
  * We use special support here due to BV animation issues/dependencies
  */
  /* ==========================================================================
    #COMMON ANIMATIONS
    ========================================================================== */
  /**
  * Ensure animations work in older versions of iOS/Safari
  */
  /**
  * Opacity fader
  */
  @keyframes opacity-fade {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  /**
  * Off-Canvas animation (with default vars)
  * this could be optimized to a single mixin
  * but "right" or "left" is easy to remember
  */
  [id="single-spa-application:topbar"],
  [id="single-spa-application:sidebar"] {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 16px;
    /* [2] */
    line-height: 1.5;
    /* [2] */
    -webkit-text-size-adjust: 100%;
      -moz-text-size-adjust: 100%;
            text-size-adjust: 100%;
    /* [3] */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* ==========================================================================
      #BASE ORCHESTRATOR
      ========================================================================== */
    /**
    * Simple reset and base styles for Orchestrator specific
    * components like the topbar and sidebar
    *
    * Eventually this file should be refactored to include a universal
    * base font-family and html/body layout as part of "Weever Theme" 1.0
    */
    /**
    * Simple reset
    */
    /**
    * Remove trailing margins from nested lists.
    */
    /* ==========================================================================
      #BASE TYPOGRAPHY
      ========================================================================== */
    /**
    * Headings, paragraphs, links.
    */
    /**
    * 1. Remove the gray background on active links in IE 10.
    * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
    */
    /**
    * 1. Correct the inheritance and scaling of font size in all browsers.
    * 2. Correct the odd `em` font sizing in all browsers.
    */
    /**
    * 1. Style legends wrapping multiple form elements
    */
    /**
    * Abbreviations
    */
    /**
    * Address
    */
    /* ==========================================================================
      #SIDEBAR
      ========================================================================== */
    /**
    * NOTE: The layout, width of the sidebar is controlled by `o-page__sidebar` in
    *       `o-page` object, found in `objects/_objects.page.scss`.
    */
    /**
      * Flex and overflow rules
      * Brand header should "stick" to the top of the panel
      */
    /**
    * Core layout rules
    *
    */
    /**
    * 1. Height of sidebar brand should equal the height of the topbar for perfect
    *    alignment.
    * 2. You can change the height of brand/logo image as you want, but its height
    *    shouldn't be more than topbar's height.
    */
    /**
    * Sidebar navigation menu block
    * including title and menu items (list)
    */
    /**
    * Sidebar navigation menu
    */
    /**
    * Sub Menu
    */
    /* Style Variation - Light Sidebar
      ========================================================================== */
    /* Sidebar toggle
      ========================================================================== */
    /**
    * An icon the is used to toggle (show/hide) sidebar on small screen, you will
    * find this component placed in the main topbar.
    */
    /**
    * The hamburger icon itself, 3 bars stacked on top of each other.
    */
    /**
    * Error and empty state messages
    */
    /**
    * Footer information
    */
  }
  [id="single-spa-application:topbar"] button,
  [id="single-spa-application:topbar"] input,
  [id="single-spa-application:topbar"] optgroup,
  [id="single-spa-application:topbar"] select,
  [id="single-spa-application:topbar"] textarea,
  [id="single-spa-application:sidebar"] button,
  [id="single-spa-application:sidebar"] input,
  [id="single-spa-application:sidebar"] optgroup,
  [id="single-spa-application:sidebar"] select,
  [id="single-spa-application:sidebar"] textarea {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
  }
  [id="single-spa-application:topbar"] h1,
  [id="single-spa-application:topbar"] h2,
  [id="single-spa-application:topbar"] h3,
  [id="single-spa-application:topbar"] h4,
  [id="single-spa-application:topbar"] h5,
  [id="single-spa-application:topbar"] h6,
  [id="single-spa-application:topbar"] blockquote,
  [id="single-spa-application:topbar"] p,
  [id="single-spa-application:topbar"] pre,
  [id="single-spa-application:topbar"] dl,
  [id="single-spa-application:topbar"] dd,
  [id="single-spa-application:topbar"] ol,
  [id="single-spa-application:topbar"] ul,
  [id="single-spa-application:topbar"] figure,
  [id="single-spa-application:topbar"] hr,
  [id="single-spa-application:topbar"] fieldset,
  [id="single-spa-application:topbar"] legend,
  [id="single-spa-application:sidebar"] h1,
  [id="single-spa-application:sidebar"] h2,
  [id="single-spa-application:sidebar"] h3,
  [id="single-spa-application:sidebar"] h4,
  [id="single-spa-application:sidebar"] h5,
  [id="single-spa-application:sidebar"] h6,
  [id="single-spa-application:sidebar"] blockquote,
  [id="single-spa-application:sidebar"] p,
  [id="single-spa-application:sidebar"] pre,
  [id="single-spa-application:sidebar"] dl,
  [id="single-spa-application:sidebar"] dd,
  [id="single-spa-application:sidebar"] ol,
  [id="single-spa-application:sidebar"] ul,
  [id="single-spa-application:sidebar"] figure,
  [id="single-spa-application:sidebar"] hr,
  [id="single-spa-application:sidebar"] fieldset,
  [id="single-spa-application:sidebar"] legend {
    margin: 0;
    padding: 0;
  }
  [id="single-spa-application:topbar"] fieldset,
  [id="single-spa-application:sidebar"] fieldset {
    min-width: 0;
    border: 0;
  }
  [id="single-spa-application:topbar"] legend,
  [id="single-spa-application:sidebar"] legend {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    line-height: inherit;
    color: inherit;
    white-space: normal;
  }
  [id="single-spa-application:topbar"] article,
  [id="single-spa-application:topbar"] aside,
  [id="single-spa-application:topbar"] footer,
  [id="single-spa-application:topbar"] header,
  [id="single-spa-application:topbar"] nav,
  [id="single-spa-application:topbar"] section,
  [id="single-spa-application:topbar"] figcaption,
  [id="single-spa-application:topbar"] figure,
  [id="single-spa-application:sidebar"] article,
  [id="single-spa-application:sidebar"] aside,
  [id="single-spa-application:sidebar"] footer,
  [id="single-spa-application:sidebar"] header,
  [id="single-spa-application:sidebar"] nav,
  [id="single-spa-application:sidebar"] section,
  [id="single-spa-application:sidebar"] figcaption,
  [id="single-spa-application:sidebar"] figure {
    display: block;
  }
  [id="single-spa-application:topbar"] button,
  [id="single-spa-application:sidebar"] button {
    cursor: pointer;
  }
  [id="single-spa-application:topbar"] ul,
  [id="single-spa-application:topbar"] ol,
  [id="single-spa-application:sidebar"] ul,
  [id="single-spa-application:sidebar"] ol {
    margin: 0;
    padding: 0;
    list-style-type: none;
  }
  [id="single-spa-application:topbar"] li > ol,
  [id="single-spa-application:topbar"] li > ul,
  [id="single-spa-application:sidebar"] li > ol,
  [id="single-spa-application:sidebar"] li > ul {
    margin-bottom: 0;
  }
  [id="single-spa-application:topbar"] img,
  [id="single-spa-application:sidebar"] img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-style: none;
  }
  [id="single-spa-application:topbar"] textarea,
  [id="single-spa-application:sidebar"] textarea {
    display: block;
    margin: 0;
    outline: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    -webkit-appearance: none;
      -moz-appearance: none;
            appearance: none;
  }
  [id="single-spa-application:topbar"] .c-page__title,
  [id="single-spa-application:sidebar"] .c-page__title {
    margin: 0;
    font-size: 1.5rem;
  }
  @media (min-width: 560px) {
    [id="single-spa-application:topbar"] .c-page__title,
  [id="single-spa-application:sidebar"] .c-page__title {
      font-size: 2rem;
    }
  }
  [id="single-spa-application:topbar"] h1,
  [id="single-spa-application:topbar"] h2,
  [id="single-spa-application:topbar"] h3,
  [id="single-spa-application:topbar"] h4,
  [id="single-spa-application:topbar"] h5,
  [id="single-spa-application:topbar"] h6,
  [id="single-spa-application:sidebar"] h1,
  [id="single-spa-application:sidebar"] h2,
  [id="single-spa-application:sidebar"] h3,
  [id="single-spa-application:sidebar"] h4,
  [id="single-spa-application:sidebar"] h5,
  [id="single-spa-application:sidebar"] h6 {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: 400;
    color: #2d3848;
    margin: 0 0 0.5rem;
    line-height: 1.4;
  }
  [id="single-spa-application:topbar"] h1,
  [id="single-spa-application:sidebar"] h1 {
    font-size: 2rem;
  }
  [id="single-spa-application:topbar"] h2,
  [id="single-spa-application:sidebar"] h2 {
    font-size: 1.75rem;
  }
  [id="single-spa-application:topbar"] h3,
  [id="single-spa-application:sidebar"] h3 {
    font-size: 1.5rem;
  }
  [id="single-spa-application:topbar"] h4,
  [id="single-spa-application:sidebar"] h4 {
    font-size: 1.25rem;
  }
  [id="single-spa-application:topbar"] h5,
  [id="single-spa-application:sidebar"] h5 {
    font-size: 1.125rem;
  }
  [id="single-spa-application:topbar"] h6,
  [id="single-spa-application:sidebar"] h6 {
    font-size: 1rem;
  }
  [id="single-spa-application:topbar"] p,
  [id="single-spa-application:sidebar"] p {
    margin-top: 0;
    color: #273142;
    font-size: 1rem;
  }
  [id="single-spa-application:topbar"] strong,
  [id="single-spa-application:sidebar"] strong {
    color: #2d3848;
  }
  [id="single-spa-application:topbar"] dl dt,
  [id="single-spa-application:topbar"] dl dd,
  [id="single-spa-application:sidebar"] dl dt,
  [id="single-spa-application:sidebar"] dl dd {
    color: #273142;
  }
  [id="single-spa-application:topbar"] hr,
  [id="single-spa-application:sidebar"] hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
  }
  [id="single-spa-application:topbar"] a,
  [id="single-spa-application:sidebar"] a {
    transition: color 0.15s ease-in-out;
    background-color: transparent;
    /* [1] */
    color: #2ea1f8;
    -webkit-text-decoration: none;
    text-decoration: none;
    cursor: pointer;
    -webkit-text-decoration-skip: objects;
            text-decoration-skip: objects;
    /* [2] */
  }
  [id="single-spa-application:topbar"] a:hover,
  [id="single-spa-application:sidebar"] a:hover {
    color: #2ea1f8;
    -webkit-text-decoration: underline;
    text-decoration: underline;
  }
  [id="single-spa-application:topbar"] pre,
  [id="single-spa-application:topbar"] code,
  [id="single-spa-application:topbar"] kbd,
  [id="single-spa-application:topbar"] samp,
  [id="single-spa-application:sidebar"] pre,
  [id="single-spa-application:sidebar"] code,
  [id="single-spa-application:sidebar"] kbd,
  [id="single-spa-application:sidebar"] samp {
    font-family: monospace, monospace;
    /* [1] */
    font-size: 1em;
    /* [2] */
    white-space: pre;
  }
  [id="single-spa-application:topbar"] mark,
  [id="single-spa-application:sidebar"] mark {
    background-color: #ff0;
    color: #fff;
  }
  [id="single-spa-application:topbar"] small,
  [id="single-spa-application:sidebar"] small {
    font-size: 0.9rem;
  }
  [id="single-spa-application:topbar"] .small,
  [id="single-spa-application:sidebar"] .small {
    font-size: 0.9rem;
  }
  [id="single-spa-application:topbar"] blockquote,
  [id="single-spa-application:sidebar"] blockquote {
    padding-left: 15px;
    border-left: 3px solid #e6eaee;
  }
  [id="single-spa-application:topbar"] legend,
  [id="single-spa-application:sidebar"] legend {
    display: block;
    flex-basis: 100%;
    margin: 0 0 0.6875rem 0;
    color: #333333;
    font-size: 0.9rem;
    font-weight: 600;
    word-wrap: break-word;
    word-break: break-word;
    word-wrap: break-word;
    word-break: break-word;
  }
  [id="single-spa-application:topbar"] abbr[title],
  [id="single-spa-application:topbar"] abbr[data-original-title],
  [id="single-spa-application:sidebar"] abbr[title],
  [id="single-spa-application:sidebar"] abbr[data-original-title] {
    text-decoration: underline;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
            text-decoration: underline dotted;
    cursor: help;
    border-bottom: 0;
    -webkit-text-decoration-skip-ink: none;
            text-decoration-skip-ink: none;
  }
  [id="single-spa-application:topbar"] address,
  [id="single-spa-application:sidebar"] address {
    margin-bottom: 1.875rem;
    font-style: normal;
    line-height: inherit;
  }
  [id="single-spa-application:topbar"] .c-sidebar-outer,
  [id="single-spa-application:topbar"] .b-sidebar-outer,
  [id="single-spa-application:sidebar"] .c-sidebar-outer,
  [id="single-spa-application:sidebar"] .b-sidebar-outer {
    position: fixed !important;
  }
  [id="single-spa-application:topbar"] .c-sidebar-outer,
  [id="single-spa-application:topbar"] .b-sidebar-outer,
  [id="single-spa-application:sidebar"] .c-sidebar-outer,
  [id="single-spa-application:sidebar"] .b-sidebar-outer {
    top: 0;
    left: 0;
    right: 0;
    height: 0;
    overflow: visible;
    z-index: 1035;
  }
  [id="single-spa-application:topbar"] .b-sidebar-backdrop,
  [id="single-spa-application:topbar"] .c-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .b-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .c-sidebar-backdrop {
    position: fixed !important;
  }
  [id="single-spa-application:topbar"] .b-sidebar-backdrop,
  [id="single-spa-application:topbar"] .c-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .b-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .c-sidebar-backdrop {
    top: 0;
    left: 0;
    z-index: -1;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 1;
  }
  [id="single-spa-application:topbar"] .c-sidebar,
  [id="single-spa-application:sidebar"] .c-sidebar {
    position: fixed;
    top: 0;
    height: 100vh;
    margin: 0;
    padding-bottom: 1.875rem;
    background-color: #222c3c;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    z-index: 200;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    display: flex;
    flex-direction: column;
    width: 350px;
    max-width: 100%;
    max-height: 100%;
    outline: 0;
    transform: translateX(0);
    /** Motion **/
    /** Positioning **/
  }
  [id="single-spa-application:topbar"] .c-sidebar::-webkit-scrollbar,
  [id="single-spa-application:sidebar"] .c-sidebar::-webkit-scrollbar {
    /* [2] */
    width: 6px;
    background-color: transparent;
  }
  [id="single-spa-application:topbar"] .c-sidebar::-webkit-scrollbar-thumb,
  [id="single-spa-application:sidebar"] .c-sidebar::-webkit-scrollbar-thumb {
    /* [2] */
    border-radius: 6px;
    background-color: rgba(0, 0, 0, 0.5);
  }
  [id="single-spa-application:topbar"] .c-sidebar.has-bezier-above-one,
  [id="single-spa-application:sidebar"] .c-sidebar.has-bezier-above-one {
    overflow: visible;
  }
  [id="single-spa-application:topbar"] .c-sidebar:before,
  [id="single-spa-application:sidebar"] .c-sidebar:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100vh;
    left: -10px;
    top: 0px;
    bottom: 0px;
    background-color: #fff;
    /* style to match branding, provides a backdrop for animations over 1.0x in bezier */
  }
  [id="single-spa-application:topbar"] .c-sidebar.slide,
  [id="single-spa-application:sidebar"] .c-sidebar.slide {
    transition: transform 0.3375s cubic-bezier(0.35, 0, 0, 1.15);
  }
  @media (prefers-reduced-motion: reduce) {
    [id="single-spa-application:topbar"] .c-sidebar.slide,
  [id="single-spa-application:sidebar"] .c-sidebar.slide {
      transition: none;
    }
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--off-canvas-left,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--off-canvas-left {
    margin-left: -350px;
    transition: margin-left 0.3375s cubic-bezier(0.35, 0, 0, 1.15);
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--off-canvas-left.is-active,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--off-canvas-left.is-active {
    margin-left: 0px;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--off-canvas-left.is-active + .c-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--off-canvas-left.is-active + .c-sidebar-backdrop {
    display: block;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--off-canvas-left + .c-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--off-canvas-left + .c-sidebar-backdrop {
    display: none;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar-off-canvas-right,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar-off-canvas-right {
    margin-right: -350px;
    transition: margin-right 0.3375s cubic-bezier(0.35, 0, 0, 1.15);
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar-off-canvas-right.is-active,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar-off-canvas-right.is-active {
    margin-right: 0px;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar-off-canvas-right.is-active + .c-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar-off-canvas-right.is-active + .c-sidebar-backdrop {
    display: block;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar-off-canvas-right + .c-sidebar-backdrop,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar-off-canvas-right + .c-sidebar-backdrop {
    display: none;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--right,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--right {
    left: auto;
    right: 0;
    border-style: solid;
    border-width: 0;
    box-shadow: -3px 0 10px rgba(0, 0, 0, 0.25);
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--right.slide:not(.show),
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--right.slide:not(.show) {
    transform: translateX(100%);
  }
  [id="single-spa-application:topbar"] .c-sidebar:not(.c-sidebar--right):not(.b-sidebar-right),
  [id="single-spa-application:sidebar"] .c-sidebar:not(.c-sidebar--right):not(.b-sidebar-right) {
    left: 0;
    right: auto;
    border-style: solid;
    border-width: 0;
    border-color: #e6eaee;
    box-shadow: 3px 0 10px rgba(0, 0, 0, 0.25);
  }
  [id="single-spa-application:topbar"] .c-sidebar:not(.c-sidebar--right):not(.b-sidebar-right).slide:not(.show),
  [id="single-spa-application:sidebar"] .c-sidebar:not(.c-sidebar--right):not(.b-sidebar-right).slide:not(.show) {
    transform: translateX(-100%);
  }
  [id="single-spa-application:topbar"] .c-sidebar--wide,
  [id="single-spa-application:sidebar"] .c-sidebar--wide {
    width: 420px;
    max-width: 80%;
  }
  [id="single-spa-application:topbar"] .c-sidebar__body,
  [id="single-spa-application:sidebar"] .c-sidebar__body {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    overflow: hidden;
  }
  [id="single-spa-application:topbar"] .c-sidebar--nav,
  [id="single-spa-application:sidebar"] .c-sidebar--nav {
    padding-bottom: 0;
  }
  [id="single-spa-application:topbar"] .c-sidebar__navigation,
  [id="single-spa-application:sidebar"] .c-sidebar__navigation {
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    padding-bottom: 1.875rem;
  }
  [id="single-spa-application:topbar"] .c-sidebar__brand,
  [id="single-spa-application:sidebar"] .c-sidebar__brand {
    padding: 1.5rem 5rem 1rem 1.5rem !important;
  }
  [id="single-spa-application:topbar"] .c-sidebar__brand,
  [id="single-spa-application:sidebar"] .c-sidebar__brand {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px dashed #e7e7e7;
    font-size: 16px;
    vertical-align: middle;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    border-top: 6px solid #eb6e1f;
    overflow: hidden;
  }
  [id="single-spa-application:topbar"] .c-sidebar__brand-img,
  [id="single-spa-application:sidebar"] .c-sidebar__brand-img {
    display: block;
    height: 4rem;
    width: 100%;
    max-width: 100%;
    background-image: none;
    margin: 0;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    font-size: 1.5rem;
    font-weight: bold;
    font-weight: 500;
    line-height: 1.6;
    text-indent: -300vw;
  }
  [id="single-spa-application:topbar"] .c-sidebar__title,
  [id="single-spa-application:sidebar"] .c-sidebar__title {
    margin-top: 1rem;
    padding: 1rem 1.5rem;
    line-height: 1rem;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    color: #708299;
    font-size: 0.9rem;
    font-weight: bold;
    font-weight: 500;
    text-transform: uppercase;
    color: #999999;
  }
  [id="single-spa-application:topbar"] .menu-bar,
  [id="single-spa-application:sidebar"] .menu-bar {
    position: relative;
  }
  [id="single-spa-application:topbar"] .menu-bar li.wx-menu-active > a,
  [id="single-spa-application:sidebar"] .menu-bar li.wx-menu-active > a {
    color: #222;
    background-color: #f7f7f7;
  }
  [id="single-spa-application:topbar"] .c-sidebar__divider,
  [id="single-spa-application:sidebar"] .c-sidebar__divider {
    display: block;
    width: 100%;
    height: 1px;
    background-color: #2a3547;
  }
  [id="single-spa-application:topbar"] .c-sidebar__menu,
  [id="single-spa-application:sidebar"] .c-sidebar__menu {
    display: block;
    flex: 0 1 auto;
  }
  [id="single-spa-application:topbar"] .c-sidebar__list,
  [id="single-spa-application:sidebar"] .c-sidebar__list {
    display: flex;
  }
  [id="single-spa-application:topbar"] .c-sidebar__list.c-sidebar__list--vertical,
  [id="single-spa-application:sidebar"] .c-sidebar__list.c-sidebar__list--vertical {
    flex-flow: column nowrap;
    align-items: stretch;
    overflow-x: hidden;
    overflow-y: visible;
  }
  [id="single-spa-application:topbar"] .c-sidebar__list.c-sidebar__list--vertical.c-sidebar__item,
  [id="single-spa-application:sidebar"] .c-sidebar__list.c-sidebar__list--vertical.c-sidebar__item {
    display: block;
    flex: 1 0 auto;
  }
  [id="single-spa-application:topbar"] .c-sidebar__item,
  [id="single-spa-application:sidebar"] .c-sidebar__item {
    position: relative;
    transition: background-color 0.2s;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    /**
    * 1. Add small arrow to `c-menu__link` when `c-menu__item` has sub-menu.
    */
  }
  [id="single-spa-application:topbar"] .c-sidebar__item.has-submenu > .c-sidebar__link::after,
  [id="single-spa-application:sidebar"] .c-sidebar__item.has-submenu > .c-sidebar__link::after {
    /* [1] */
    display: inline-block;
    position: absolute;
    top: 11px;
    right: 30px;
    color: #b7c0cd;
    font-family: "fa-icons-inspections";
    content: "\e909";
  }
  [id="single-spa-application:topbar"] .c-sidebar__item.is-open,
  [id="single-spa-application:sidebar"] .c-sidebar__item.is-open {
    background-color: #1d2531;
    box-shadow: inset 3px 0 0 0 #00a8ff;
  }
  [id="single-spa-application:topbar"] .c-sidebar__item.is-open > .c-sidebar__link::after,
  [id="single-spa-application:sidebar"] .c-sidebar__item.is-open > .c-sidebar__link::after {
    content: "\f0d8";
  }
  [id="single-spa-application:topbar"] .c-sidebar__link,
  [id="single-spa-application:sidebar"] .c-sidebar__link {
    max-width: 100%;
    display: flex;
    align-content: center;
    align-items: center;
    margin: 0 2rem 0 1rem;
    padding: 0.78125rem 1rem 0.71875rem 1rem;
    transition: background-color 0.2s;
    cursor: pointer;
    border-radius: 8px;
    color: #222;
  }
  [id="single-spa-application:topbar"] .c-sidebar__link > .c-sidebar__icon,
  [id="single-spa-application:sidebar"] .c-sidebar__link > .c-sidebar__icon {
    margin-right: 1rem;
  }
  [id="single-spa-application:topbar"] .c-sidebar__link.is-active,
  [id="single-spa-application:sidebar"] .c-sidebar__link.is-active {
    background-color: #1d2531;
    box-shadow: inset 3px 0 0 0 #00a8ff;
  }
  [id="single-spa-application:topbar"] .c-sidebar__link:hover,
  [id="single-spa-application:sidebar"] .c-sidebar__link:hover {
    color: #fff;
    -webkit-text-decoration: none;
    text-decoration: none;
  }
  [id="single-spa-application:topbar"] .c-sidebar__submenu,
  [id="single-spa-application:sidebar"] .c-sidebar__submenu {
    /**
    * Bootstrap classes used to show and hide sidebar submenu.
    * This behaviour depends on collapse.js plugin.
    */
  }
  [id="single-spa-application:topbar"] .c-sidebar__submenu.collapse,
  [id="single-spa-application:sidebar"] .c-sidebar__submenu.collapse {
    display: none;
  }
  [id="single-spa-application:topbar"] .c-sidebar__submenu.show,
  [id="single-spa-application:sidebar"] .c-sidebar__submenu.show {
    display: block;
  }
  [id="single-spa-application:topbar"] .c-sidebar__submenu.collapsing,
  [id="single-spa-application:sidebar"] .c-sidebar__submenu.collapsing {
    position: relative;
    height: 0;
    transition: height 0.3s;
    overflow: hidden;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light {
    border-color: #e6eaee;
    background-color: #fff;
    /**
    * 1. Add a slight shadow to the sidebar to make it popup a little bit
    *    on small screens.
    */
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__divider,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__divider {
    background-color: #e6eaee;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__item.has-submenu > .c-sidebar__link::after,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__item.has-submenu > .c-sidebar__link::after {
    /* [1] */
    color: #b7c0cd;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__item.is-open,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__item.is-open {
    background-color: #fafbfc;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__link,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__link {
    color: #273142;
    box-shadow: none;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__link.is-active,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__link.is-active {
    color: #fff;
    background-color: #00467f;
    box-shadow: none;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__link.is-active:hover,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__link.is-active:hover {
    color: rgba(255, 255, 255, 0.875);
    background-color: #00467f;
  }
  [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light .c-sidebar__link:hover,
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light .c-sidebar__link:hover {
    color: #00467f;
    background-color: #e1f5fe;
  }
  @media (max-width: 768px) {
    [id="single-spa-application:topbar"] .c-sidebar.c-sidebar--light:not(.c-sidebar--right),
  [id="single-spa-application:sidebar"] .c-sidebar.c-sidebar--light:not(.c-sidebar--right) {
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
      /* [1] */
    }
  }
  [id="single-spa-application:topbar"] .c-sidebar-toggle,
  [id="single-spa-application:sidebar"] .c-sidebar-toggle {
    display: flex;
    align-items: center;
    position: relative;
    margin: 0;
    /* [1] */
    padding: 0.75rem 1rem;
    /* [1] */
    border: 0;
    /* [1] */
    outline: none;
    font-size: 1rem;
    background-color: transparent;
    /* [1] */
    cursor: pointer;
    color: inherit;
  }
  [id="single-spa-application:topbar"] .c-sidebar-toggle:hover, [id="single-spa-application:topbar"] .c-sidebar-toggle:active,
  [id="single-spa-application:sidebar"] .c-sidebar-toggle:hover,
  [id="single-spa-application:sidebar"] .c-sidebar-toggle:active {
    background-color: #00559a;
  }
  [id="single-spa-application:topbar"] .c-sidebar-toggle__bar,
  [id="single-spa-application:sidebar"] .c-sidebar-toggle__bar {
    display: block;
    position: relative;
    width: 1rem;
    height: 4px;
    transition: all 0.3s;
    border-radius: 4px;
    background-color: #354052;
  }
  [id="single-spa-application:topbar"] .c-sidebar-toggle__bar:first-child,
  [id="single-spa-application:sidebar"] .c-sidebar-toggle__bar:first-child {
    transform: translateY(-6px);
  }
  [id="single-spa-application:topbar"] .c-sidebar-toggle__bar:last-child,
  [id="single-spa-application:sidebar"] .c-sidebar-toggle__bar:last-child {
    transform: translateY(6px);
  }
  [id="single-spa-application:topbar"] .c-sidebar__message,
  [id="single-spa-application:sidebar"] .c-sidebar__message {
    padding: 1rem 1.5rem;
  }
  [id="single-spa-application:topbar"] .c-sidebar__message > h4,
  [id="single-spa-application:sidebar"] .c-sidebar__message > h4 {
    padding: 1rem 0;
    line-height: 1rem;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    color: #708299;
    font-size: 0.9rem;
    font-weight: bold;
    font-weight: 500;
    text-transform: uppercase;
    color: #999999;
  }
  [id="single-spa-application:topbar"] .c-sidebar__footer,
  [id="single-spa-application:sidebar"] .c-sidebar__footer {
    border-top: 1px solid #2a3547;
    margin-top: 25px;
    margin-bottom: 15px;
    padding-left: 30px;
    padding-right: 30px;
    color: #7f8fa4;
  }
  [id="single-spa-application:topbar"] .c-sidebar__version,
  [id="single-spa-application:sidebar"] .c-sidebar__version {
    margin-bottom: 0.5rem;
  }
  [id="single-spa-application:topbar"] {
    /* ==========================================================================
      #AVATARS
      ========================================================================== */
    /**
    * 1. Enable avatars to act like a dropdown toggle.
    * 2. Small arrow (icon) used in avatars with dropdowns.
    * 3. Remove default link decoration when avatar is used as a dropdown toggle.
    */
    /* Size variants - avatars
      ========================================================================== */
    /* Size variants - images
      ========================================================================== */
    /* not used at this time

    .c-avatar__img {
      border-radius: 100%;
      overflow: hidden;
    }

    .c-avatar__img--xsmall {
      width: $avatar-img-xsmall-width;
      height: $avatar-img-xsmall-height;
    }

    .c-avatar__img--small {
      width: $avatar-img-small-width;
      min-width: $avatar-img-small-width;
      height: $avatar-img-small-height;
    }

    .c-avatar__img {
      width: $avatar-img-medium-width;
      height: $avatar-img-medium-height;
    }

    .c-avatar__img {
      width: $avatar-img-large-width;
      height: $avatar-img-large-height;
    }

    .c-avatar__img {
      width: $avatar-img-xlarge-width;
      height: $avatar-img-xlarge-height;
    }

    .c-avatar__img {
      width: $avatar-img-super-width;
      height: $avatar-img-super-height;
    }
    */
    /* ==========================================================================
      #DROPDOWN
      ========================================================================== */
    /**
    * A wrapper for the dropdown
    */
    /**
    * Dropdown Menu
    *
    * 1. No matter what size is the dropdown toggle `dropdown-toggle` (a class from
    *    bootstrap), dropdown menu should be positioned properly.
    */
    /**
    * A larger dropdown menu for dropdowns used in topbar.
    */
    /**
    * Dropdown item links
    */
    /**
    * 1. Remove border from last item to prevent it from collapsing with dropdown
    *    menu's last border.
    */
    /* ==========================================================================
      # TOPBAR NAV
      ========================================================================== */
    /**
    * topbar-nav sits within the main topbar area. It’s fully responsive as it holds
    * topbar-navigation items/links that will be collapsed, toggled in small
    * screens via `c-topbar-nav-toggle` component.
    */
    /**
    * 1. Allow positioning dropdown menus inside topbar-nav items.
    */
    /* topbar-nav Link Button
      ========================================================================== */
    /**
    * Handle anchor links
    * any override default browser styles
    */
    /* topbar-nav Toggle
      ========================================================================== */
    /**
    * topbar-nav toggle is the popular hamburger-like icon that would show/hide `c-topbar-nav`
    * via javascript through `js-topbar-nav-toggle` to toggle `is-open` class.
    *
    * 1. Remove default button styles.
    * 2. Show only on small screens, hide on large screen.
    */
    /**
    * The hamburger icon itself, 3 bars stacked on top of each other.
    */
    /* ==========================================================================
      #TOPBAR
      ========================================================================== */
    /**
    * The site's main page header, used as a wrapper for its sub-components.
    */
    /**
    * Set a fixed width for search input when placed in topbar.
    */
    /**
    * 1. Custom width, height is specififed for proper alignment, adding your own
    *    brand/logo image will require custom styles for proper alignment.
    * 2. On small screens, separate logo/brand from other topbar components as
    *    topbar links would be collapsed.
    */
    /* Style variants
      ========================================================================== */
    /**
    * Use `c-topbar--inverse` for dark background colors.
    *
    */
  }
  [id="single-spa-application:topbar"] .c-avatar {
    display: flex;
    position: relative;
    flex-shrink: 0;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
    -webkit-user-select: none;
      -moz-user-select: none;
            user-select: none;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    text-align: center;
  }
  [id="single-spa-application:topbar"] .c-avatar.has-dropdown {
    /* [1] */
    cursor: pointer;
    overflow: visible;
  }
  [id="single-spa-application:topbar"] .c-avatar.has-dropdown::after {
    /* [2] */
    display: block;
    padding-left: 10px;
    color: #64758c;
    font-family: "fa-icons-inspections";
    content: "\e900";
  }
  [id="single-spa-application:topbar"] .c-avatar.has-dropdown:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    /* [3] */
  }
  [id="single-spa-application:topbar"] .c-avatar--xsmall {
    width: 40px;
    height: 40px;
  }
  [id="single-spa-application:topbar"] .c-avatar--xsmall .c-avatar__initials {
    font-size: 20px;
    font-weight: 500;
  }
  [id="single-spa-application:topbar"] .c-avatar--small {
    width: 50px;
    height: 50px;
  }
  [id="single-spa-application:topbar"] .c-avatar--medium {
    width: 60px;
    height: 60px;
  }
  [id="single-spa-application:topbar"] .c-avatar--large {
    width: 90px;
    height: 90px;
  }
  [id="single-spa-application:topbar"] .c-avatar--xlarge {
    width: 110px;
    height: 110px;
  }
  [id="single-spa-application:topbar"] .c-avatar--super {
    width: 130px;
    height: 130px;
  }
  [id="single-spa-application:topbar"] .c-dropdown {
    display: inline-block;
    position: relative;
  }
  [id="single-spa-application:topbar"] .position-static {
    position: static !important;
  }
  [id="single-spa-application:topbar"] .c-status__dropdown-menu {
    display: none;
  }
  [id="single-spa-application:topbar"] .c-status__dropdown-menu.show {
    display: block;
  }
  [id="single-spa-application:topbar"] .c-dropdown__menu {
    position: absolute;
    top: 100%;
    /* [1] */
    right: 0;
    width: 11.25rem;
    max-width: 18.75rem;
    margin: 5px 0 0;
    transition: visibility 0.3s ease, opacity 0.3s ease;
    border: 1px solid #dfe3e9;
    border-radius: 4px;
    background-color: #fff;
    text-align: left;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    z-index: 400;
    max-height: calc(100vh - 10rem);
    overflow-y: auto;
  }
  [id="single-spa-application:topbar"] .c-dropdown__menu.show {
    opacity: 1;
    visibility: visible;
  }
  .c-dropdown [id="single-spa-application:topbar"] .c-dropdown__menu, .dropdown [id="single-spa-application:topbar"] .c-dropdown__menu {
    opacity: 0;
    visibility: hidden;
  }
  .c-dropdown.show [id="single-spa-application:topbar"] .c-dropdown__menu, .dropdown.show [id="single-spa-application:topbar"] .c-dropdown__menu {
    opacity: 1;
    visibility: visible;
  }
  [id="single-spa-application:topbar"] .c-dropdown__menu.c-dropdown__menu--simple-transition {
    line-height: 24px;
    right: 1rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s linear;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.38), 0 4px 4px rgba(0, 0, 0, 0.38);
  }
  [id="single-spa-application:topbar"] .c-dropdown__menu.c-dropdown__menu--simple-transition.show {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.25s linear;
  }
  [id="single-spa-application:topbar"] .c-dropdown__menu--large {
    width: 18.75rem;
  }
  @media (max-width: 576px) {
    [id="single-spa-application:topbar"] .c-dropdown__menu--large {
      max-width: 11.25rem;
    }
  }
  [id="single-spa-application:topbar"] .c-dropdown__menu--large .c-dropdown__item {
    padding: 0.9375rem 0.9375rem;
    cursor: pointer;
  }
  [id="single-spa-application:topbar"] .c-dropdown__item-link {
    display: block;
    color: #273142;
    -webkit-text-decoration: none;
    text-decoration: none;
  }
  [id="single-spa-application:topbar"] .c-dropdown__item-link:hover {
    color: #273142;
    -webkit-text-decoration: none;
    text-decoration: none;
  }
  [id="single-spa-application:topbar"] .c-dropdown__item {
    display: block;
    padding: 0.625rem 0.9375rem;
    border-bottom: 1px solid #dfe3e9;
    color: #273142;
    font-size: 1rem;
    font-weight: 400;
  }
  [id="single-spa-application:topbar"] .c-dropdown__item:hover {
    background-color: #f2f4f7;
    color: #2ea1f8;
    -webkit-text-decoration: none;
    text-decoration: none;
  }
  [id="single-spa-application:topbar"] .c-dropdown__item:last-child {
    border-bottom: 0;
    /* [1] */
  }
  [id="single-spa-application:topbar"] .c-topbar-nav {
    display: block;
    /**
    * Responsive topbar-nav
    *
    * 1. Remove extra margin when `u-mr-auto` utility is used.
    */
  }
  @media (max-width: 768px) {
    [id="single-spa-application:topbar"] .c-topbar-nav {
      margin-right: -0.9375rem !important;
    }
    [id="single-spa-application:topbar"] .c-topbar-nav {
      position: relative;
      flex: 1 0 100%;
      order: 2;
      margin-top: 0.9375rem;
      /* [1] */
      margin-left: -0.9375rem;
      border-top: 1px solid #e6eaee;
      /**
      * Bootstrap classes used to show and hide topbar-nav.
      * This behaviour depends on collapse.js plugin.
      */
    }
    [id="single-spa-application:topbar"] .c-topbar-nav.collapse {
      display: none;
    }
    [id="single-spa-application:topbar"] .c-topbar-nav.show {
      display: block;
    }
    [id="single-spa-application:topbar"] .c-topbar-nav.collapsing {
      position: relative;
      height: 0;
      transition: height 0.6s;
      overflow: hidden;
    }
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__list {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__item {
    position: relative;
    /* [1] */
    margin: 0 40px 0 0;
    padding: 0.75rem 1rem;
  }
  @media (max-width: 576px) {
    [id="single-spa-application:topbar"] .c-topbar-nav__item {
      margin-right: 0;
    }
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__item:last-child {
    margin-right: 0;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__link {
    color: #fff;
    font-size: 1rem;
    font-weight: 400;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__link:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__link.is-active {
    color: #2ea1f8;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__link-button {
    display: flex;
    align-items: center;
    padding: 0 1rem;
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #fff;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__link-button:focus, [id="single-spa-application:topbar"] .c-topbar-nav__link-button:focus-visible {
    outline: none;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__link-button:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    color: #fff;
    background-color: rgba(255, 255, 255, 0.125);
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown {
    padding: 0 !important;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown {
    position: relative;
    display: flex;
    align-items: stretch;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button {
    display: flex;
    align-items: center;
    padding: 0 1rem;
    color: #fff;
    font-size: 1rem;
    font-weight: 400;
    background: transparent;
    border: none;
  }
  @media (max-width: 576px) {
    [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button {
      padding: 0 0.5rem;
    }
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button:focus, [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button:focus-visible {
    outline: none;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0.125);
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button.is-active {
    color: #2ea1f8;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav__dropdown-button:after {
    display: block;
    padding-left: 10px;
    color: #fff;
    font-family: "wx-snapp-ui";
    content: "\e606";
  }
  [id="single-spa-application:topbar"] .c-topbar-nav-toggle {
    display: none;
    position: relative;
    width: 1rem;
    height: 1rem;
    margin: 0 0 0 0.9375rem;
    /* [1] */
    padding: 0;
    /* [1] */
    border: 0;
    /* [1] */
    outline: none;
    background-color: transparent;
    /* [1] */
    cursor: pointer;
  }
  @media (max-width: 768px) {
    [id="single-spa-application:topbar"] .c-topbar-nav-toggle {
      display: block;
      /* [2] */
    }
  }
  [id="single-spa-application:topbar"] .c-topbar-nav-toggle__bar {
    display: block;
    position: relative;
    width: 1rem;
    height: 4px;
    transition: all 0.3s;
    border-radius: 4px;
    background-color: #354052;
  }
  [id="single-spa-application:topbar"] .c-topbar-nav-toggle__bar:first-child {
    transform: translateY(-6px);
  }
  [id="single-spa-application:topbar"] .c-topbar-nav-toggle__bar:last-child {
    transform: translateY(6px);
  }
  [id="single-spa-application:topbar"] .c-topbar {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
    min-width: 100%;
    min-height: 48px;
    padding: 0;
    flex: 0 0 auto;
    font-size: 1rem;
    background-color: #00467f;
    color: #fff;
  }
  [id="single-spa-application:topbar"] .c-topbar__search {
    width: 270px !important;
  }
  [id="single-spa-application:topbar"] .c-topbar__brand {
    display: flex;
    align-items: center;
    padding: 0.75rem 1rem;
    min-width: 44px;
    /* [1] */
    margin: 0 20px 0 0;
  }
  @media (max-width: 768px) {
    [id="single-spa-application:topbar"] .c-topbar__brand {
      margin-right: auto;
      /* [2] */
    }
  }
  [id="single-spa-application:topbar"] .c-topbar__brand-img {
    border-radius: 4px;
  }
  [id="single-spa-application:topbar"] .c-topbar__title {
    margin: 0;
    padding: 0;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, "San Francisco", Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 1rem;
    color: inherit;
  }
  [id="single-spa-application:topbar"] .c-topbar--inverse {
    background: #2ea1f8;
    background: linear-gradient(to bottom, #2ea1f8, #1990ea);
  }
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-topbar-nav,
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-topbar-nav__item {
    border-color: #53b2f9;
  }
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-topbar-nav__link {
    color: #fff;
  }
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-avatar.has-dropdown::after {
    color: #fff;
  }
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-topbar-nav-toggle__icon,
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-topbar-nav-toggle__icon::before,
  [id="single-spa-application:topbar"] .c-topbar--inverse .c-topbar-nav-toggle__icon::after {
    background-color: #fff;
    opacity: 0.95;
  }
  [id="single-spa-application:topbar"] #user-menu-profile-picture {
    margin-right: 8px;
  }
  @media (max-width: 576px) {
    [id="single-spa-application:topbar"] #user-menu-profile-picture {
      margin-right: 0;
    }
  }
  @media (max-width: 576px) {
    [id="single-spa-application:topbar"] #language-select-button-text,
  [id="single-spa-application:topbar"] #user-menu-full-name {
      white-space: nowrap;
      max-width: 100px;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
  @media (max-width: 576px) {
    [id="single-spa-application:topbar"] #language-select-button > .wx-icon {
      display: none;
    }
  }
  [id="single-spa-application:sidebar"] {
    /* ==========================================================================
      #AVATARS
      ========================================================================== */
    /**
    * 1. Enable avatars to act like a dropdown toggle.
    * 2. Small arrow (icon) used in avatars with dropdowns.
    * 3. Remove default link decoration when avatar is used as a dropdown toggle.
    */
    /* Size variants - avatars
      ========================================================================== */
    /* Size variants - images
      ========================================================================== */
    /* not used at this time

    .c-avatar__img {
      border-radius: 100%;
      overflow: hidden;
    }

    .c-avatar__img--xsmall {
      width: $avatar-img-xsmall-width;
      height: $avatar-img-xsmall-height;
    }

    .c-avatar__img--small {
      width: $avatar-img-small-width;
      min-width: $avatar-img-small-width;
      height: $avatar-img-small-height;
    }

    .c-avatar__img {
      width: $avatar-img-medium-width;
      height: $avatar-img-medium-height;
    }

    .c-avatar__img {
      width: $avatar-img-large-width;
      height: $avatar-img-large-height;
    }

    .c-avatar__img {
      width: $avatar-img-xlarge-width;
      height: $avatar-img-xlarge-height;
    }

    .c-avatar__img {
      width: $avatar-img-super-width;
      height: $avatar-img-super-height;
    }
    */
    /* ==========================================================================
      #PROGRESS LOADER
      ========================================================================== */
  }
  [id="single-spa-application:sidebar"] .c-avatar {
    display: flex;
    position: relative;
    flex-shrink: 0;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    overflow: hidden;
    -webkit-user-select: none;
      -moz-user-select: none;
            user-select: none;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    text-align: center;
  }
  [id="single-spa-application:sidebar"] .c-avatar.has-dropdown {
    /* [1] */
    cursor: pointer;
    overflow: visible;
  }
  [id="single-spa-application:sidebar"] .c-avatar.has-dropdown::after {
    /* [2] */
    display: block;
    padding-left: 10px;
    color: #64758c;
    font-family: "fa-icons-inspections";
    content: "\e900";
  }
  [id="single-spa-application:sidebar"] .c-avatar.has-dropdown:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
    /* [3] */
  }
  [id="single-spa-application:sidebar"] .c-avatar--xsmall {
    width: 40px;
    height: 40px;
  }
  [id="single-spa-application:sidebar"] .c-avatar--xsmall .c-avatar__initials {
    font-size: 20px;
    font-weight: 500;
  }
  [id="single-spa-application:sidebar"] .c-avatar--small {
    width: 50px;
    height: 50px;
  }
  [id="single-spa-application:sidebar"] .c-avatar--medium {
    width: 60px;
    height: 60px;
  }
  [id="single-spa-application:sidebar"] .c-avatar--large {
    width: 90px;
    height: 90px;
  }
  [id="single-spa-application:sidebar"] .c-avatar--xlarge {
    width: 110px;
    height: 110px;
  }
  [id="single-spa-application:sidebar"] .c-avatar--super {
    width: 130px;
    height: 130px;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader {
    position: relative;
    height: 4px;
    display: block;
    width: 100%;
    background-color: #dbe6ec;
    border-radius: 2px;
    background-clip: padding-box;
    margin: 0 0 1rem 0;
    overflow: hidden;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__indeterminate:before,
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__is-determined:before {
    content: "";
    position: absolute;
    background-color: inherit;
    top: 0;
    left: 0;
    bottom: 0;
    will-change: left, right;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__indeterminate:after,
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__is-determined:after {
    content: "";
    position: absolute;
    background-color: inherit;
    top: 0;
    left: 0;
    bottom: 0;
    will-change: left, right;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__indeterminate {
    background-color: #76a0b8;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__is-determined {
    background-color: green;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__indeterminate:before {
    animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__indeterminate:after {
    background-color: inherit;
    animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
    animation-delay: 1.15s;
  }
  [id="single-spa-application:sidebar"] .c-progress-loader .c-progress-loader__is-determined:before {
    animation: determined 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) forwards;
    width: 100%;
  }
  @keyframes indeterminate {
    0% {
      left: -35%;
      right: 100%;
    }
    60% {
      left: 100%;
      right: -90%;
    }
    100% {
      left: 100%;
      right: -90%;
    }
  }
  @keyframes indeterminate-short {
    0% {
      left: -200%;
      right: 100%;
    }
    60% {
      left: 107%;
      right: -8%;
    }
    100% {
      left: 107%;
      right: -8%;
    }
  }
  @keyframes determined {
    0% {
      left: -100%;
    }
    60% {
      left: -50%;
    }
    100% {
      left: 0%;
    }
  }
  @font-face {
    font-family: "bell-slim";
    src: url("/assets/fonts/customers/bell/bellslim_regular-webfont.woff");
    font-style: normal;
  }
  body[data-app-slug=bell-my-receipts] .c-topbar--is-active ~ [id="single-spa-application:inspections"],
  body[data-app-slug=bell-my-receipts] .c-topbar--is-active ~ [id="single-spa-application:@weever/wxPortal"],
  body[data-app-slug=bell-fuel-receipts] .c-topbar--is-active ~ [id="single-spa-application:inspections"],
  body[data-app-slug=bell-fuel-receipts] .c-topbar--is-active ~ [id="single-spa-application:@weever/wxPortal"] {
    max-height: calc(100% - 72px) !important;
  }
  body[data-app-slug=bell-my-receipts] .c-topbar--is-active ~ [id="single-spa-application:@weever/wxPortal"],
  body[data-app-slug=bell-fuel-receipts] .c-topbar--is-active ~ [id="single-spa-application:@weever/wxPortal"] {
    min-height: calc(100% - 72px) !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:sidebar"] .c-sidebar,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:sidebar"] .c-sidebar {
    width: 300px;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:sidebar"] .c-sidebar__brand,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:sidebar"] .c-sidebar__brand {
    border-top-color: #00549a !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:sidebar"] .c-sidebar__brand-img,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:sidebar"] .c-sidebar__brand-img {
    background-image: url("/assets/images/customers/bell/logo_bell.svg") !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:sidebar"] .c-sidebar__brand-img,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:sidebar"] .c-sidebar__brand-img {
    height: 5.25rem;
    margin: 1.5rem 0;
    background-position: left;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"],
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] {
    font-family: "bell-slim";
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar {
    min-height: 72px;
    justify-content: flex-start;
    flex-direction: row-reverse;
    background-color: #00549a;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar::before,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar::before {
    background-image: url("/assets/images/customers/bell/logo_bell-white.svg") !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar::before,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar::before {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    display: block;
    position: absolute;
    top: 1rem;
    left: 1rem;
    color: #fff;
    padding-left: 5.5rem;
    height: 2.25rem;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle {
    width: 3.4rem;
    overflow: hidden;
    display: block;
    flex: 0 0 auto;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle #sidebar-toggle-text,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle #sidebar-toggle-text {
    position: absolute !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle #sidebar-toggle-text,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle #sidebar-toggle-text {
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle .wx-icon-menu,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle .wx-icon-menu {
    margin-right: 10rem;
    font-size: 1.4rem;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar__spacer--right,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar__spacer--right {
    display: none;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button {
    font-family: "bell-slim";
    font-size: 1.5rem;
    flex: 0 0 auto;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button:hover,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button:hover {
    background-color: transparent;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button .wx-icon-earth,
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #support-button,
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #user-menu-full-name,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button .wx-icon-earth,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #support-button,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #user-menu-full-name {
    display: none !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #user-menu-profile-picture,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #user-menu-profile-picture {
    margin-right: 0 !important;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #user-menu-profile-picture,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button #user-menu-profile-picture {
    flex: 0 0 auto;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button::after,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar .c-topbar-nav__dropdown-button::after {
    font-size: 1.25rem;
    height: 1.25rem;
  }
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #support-button,
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #register-button,
  body[data-app-slug=bell-my-receipts] [id="single-spa-application:topbar"] .c-topbar #login-button,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #support-button,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #register-button,
  body[data-app-slug=bell-fuel-receipts] [id="single-spa-application:topbar"] .c-topbar #login-button {
    display: none !important;
  }
  @media screen and (min-width: 0px) and (max-width: 400px) {
    body[data-app-slug=bell-my-receipts] #language-select-button,
  body[data-app-slug=bell-my-receipts] #user-menu-flyout__button,
  body[data-app-slug=bell-fuel-receipts] #language-select-button,
  body[data-app-slug=bell-fuel-receipts] #user-menu-flyout__button {
      padding: 0 !important;
    }
  }
  @media screen and (min-width: 0px) and (max-width: 600px) {
    body[data-app-slug=bell-my-receipts] #user-menu-flyout,
  body[data-app-slug=bell-fuel-receipts] #user-menu-flyout {
      left: 0;
      right: auto;
      max-width: 200px;
    }
    body[data-app-slug=bell-my-receipts] #language-select-list,
  body[data-app-slug=bell-fuel-receipts] #language-select-list {
      max-width: 200px;
    }
  }
  body[data-app-slug|=hellofresh] [id="single-spa-application:topbar"] .c-topbar {
    background-color: #6ba92b;
  }
  body[data-app-slug|=hellofresh] [id="single-spa-application:topbar"] .c-topbar #sidebar-toggle:hover {
    background-color: rgba(255, 255, 255, 0.125);
  }
  body[data-app-slug=jergens-husqvarna] .c-sidebar__brand-img,
  body[data-app-slug=jergens-husqvarna-inspections] .c-sidebar__brand-img {
    background-image: url("/assets/images/customers/jergens/logo_jergens-husqvarna.png") !important;
  }
  body[data-app-slug=jergens-husqvarna] .c-sidebar__brand-img,
  body[data-app-slug=jergens-husqvarna-inspections] .c-sidebar__brand-img {
    height: 8rem;
    background-position: left;
  }
  body[data-app-slug=jergens-husqvarna] #support-button,
  body[data-app-slug=jergens-husqvarna-inspections] #support-button {
    display: none !important;
  }
  body[data-app-slug=suttonapp] .c-sidebar__brand-img {
    background-image: url("/assets/images/customers/suttonapp/logo_suttonapp.svg") !important;
  }
  body[data-app-slug=suttonapp] .c-sidebar__brand-img {
    height: 5rem;
    margin: 1rem 0;
    background-position: left;
  }
  body[data-app-slug=suttonapp] #support-button {
    display: none !important;
  }
  .c-topbar--is-active ~ [id="single-spa-application:inspections"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/flexDSM"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/formFolders"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/opsDashboard"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/auditTrail"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/dashgenUi"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/siteManager"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/chatbot"],
  .c-topbar--is-active ~ [id="single-spa-application:@weever/wxPortal"] {
    max-height: calc(100% - 48px) !important;
  }
  .c-topbar--is-active ~ [id="single-spa-application:@weever/wxPortal"] {
    min-height: calc(100% - 48px) !important;
  }
  .c-topbar--is-active ~ [id="single-spa-application:@weever/opsDashboard"] {
    height: 100%;
  }
  html,
  body {
    margin: 0;
  }