.nav{
  background-color: #ffffff00 !important;
}

.btn.ghost{
  color:var(--color-complementary) !important;
  border-color: var(--color-complementary) !important;
}

.header-feature-buttons-wrapper .button-group.button-toolbar-horizontal li a {
  color:var(--color-complementary) !important;
}

.object-editor-header{
  color: var(--color-primary) !important;
}

.visualization.rwohierarchicaltreecontainer .hierarchical-container-sub>.toggle-box .top-label{
  color: var(--color-primary) !important;
}

.brand-login-wrapper .brand-login { 
  background-image: url("../img/swps-logo.svg") !important;
  height: 350% !important;
  margin-top: -8% !important;
}

.key-visual {
  /*display: none !important;*/
  background-image: url("../img/installateurportal_header_1371x450.png") !important;
  border-top: 1px solid var(--color-header-border);
  background-color: #FFFFFF !important;
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover !important;
  margin-bottom: 0px !important;
  min-height: 500px !important;
}

.page-footer-start h1, .page-footer-start h2, .page-footer-start h3, .page-footer-start h4 {
  color: #333 !important;
}

.page-footer-start a {
  color: #333 !important;
}

.page-nav-wrapper .page-nav .module-item .icon {
  border-left: 1px solid #0064b9 !important;
} 

:root {
   
    /* Logo und CD/CI */

    --desk-logo-img-size: 10% !important;
    --desk-logo-img-position: 5% 20% !important;
  
    /* Datei, Größe und Positionierung */
   
  
    --logo-file:                            url("../img/swps-logo.svg")  !important;
    --logo-path:                            url("../img/swps-logo.svg")  !important;
    --logo-height:                          30px                        !important;
    --logo-height-scrolled:                 29px                        !important;
    --logo-position:                        center                      !important;
    
    --logo-height-small:				            50px                        !important;
    --header-height-small: 					        320px                        !important;
    --login-bg-img-path:						        none                        !important;
  
  
    /* Hintergrundfarbe und Rahmen des Logos */
  
    --color-brand-bg:                       #ffffff00                   !important;
    --color-brand-border:                   #ffffff00                   !important;

    /* Buttons */
    --color-btn-default:                  #0064b9  !important;
    --color-btn-default-hover:            #003461  !important;
    --color-btn-default-text:             #fff  !important;

    /* Schriftarten */
  
    --default-font:                         "Assistant", Helvetica, sans-serif  !important;
    --heading-font:                         "Assistant", Helvetica, sans-serif  !important;
  
    /* Allgemeine Farben */
    
    /* Hauptfarbe inkl. Abstufungen */
  
    --color-primary:                        #fff  !important;
    --color-primary-darken-5:               #0064b9  !important;
    --color-primary-darken-10:              #0064b9  !important;
    --color-primary-darken-15:              #0064b9  !important;
    --color-primary-darken-20:              #0064b9  !important;
    --color-text-on-primary:                #ffffff  !important;
    
    /*Schmuckfarbe */
  
    --color-secondary:                      #8db3e0  !important;
  
    /* Textfarben */
  
    --color-body-text:                      #333     !important;
    --color-body-text-dark:                 #242424     !important;
    --color-body-text-light:                #6b6b6b     !important;
    --color-heading:                        #222     !important;
    --color-link:                           #333  !important;
    --color-link-hover:                     #0064b9  !important;
  
    
    /* Farben für Rahmen */
  
    --color-border:                         #dfdfdf  !important;
    --color-border-dark:                    #cacbd8  !important;
    --color-border-light:                   #e5e5e5  !important;
  
    /* Hintergrundfarben Inhalt  */
  
    --color-content-bg:                     #f5f5f5  !important;
    --color-content-bg-light:               #fff     !important;
    --color-content-bg-dark:                #e8e8e8  !important;
    --color-body-highlight:                 #fff0e5  !important;
  
  
    /* Kopfbereich Inhalt */
  
    --color-content-header-bg:              #ffffff00  !important;
    --color-content-header-text:            #21252e  !important;
    --color-content-header-border:          #dfdfdf  !important;
  
  
    /* Kopfbereich der Seite */
  
    --color-header-bg:                      #ffffff  !important;
    --color-header-bg-dark:                 #f1f1f3  !important;
    --color-header-shadow-scrolled:         rgba(0, 0, 0, 0.5)  !important;
    --color-header-border:                  #ffffff  !important;
  
    --color-header-text:                    #333333     !important;
    --color-header-text-bg:                 #fff  !important;
    --color-header-text-hover:              #0064b9     !important;
    --color-header-text-bg-hover:           #ffffff00  !important;
  
    --color-header-search-icon:             #0064b9     !important;
    --color-header-search-text:             #333     !important;
    --color-header-search-text-focus:       #333     !important;
    --color-header-search-bg-focus:         #fff     !important;
    --color-header-search-placeholder:      #fff  !important;
  
    /* Fussbereich der Seite */
  
    --color-footer-bg:                      #e2e2e2  !important;
    --color-footer-text:                    #333  !important;
    --color-footer-link:                    #000000  !important;
    --color-footer-link-hover:              #333 !important;
    --color-footer-link-active:             #333 !important;
    --color-footer-start-bg:                #f1f1f3 !important;
    --color-footer-start-text:              #333 !important;
    --color-footer-link:                    #333 !important;
    --color-footer-start:                   #f1f1f3 !important;

    /* Seitenbereich der Seite */
  
    --color-sidebar-bg:                     #ffffff  !important;
    --color-sidebar-text:                   #333     !important;
    --color-sidebar-border:                 #fff  !important;
  
    --color-sidebar-title:                  #000000  !important;
    --color-sidebar-title-btn-bg:           #000000  !important;
    --color-sidebar-title-btn-link:         #222     !important;
    --color-sidebar-title-btn-bg-active:    #0064b9  !important;
    --color-sidebar-title-btn-link-active:  #0064b9  !important;
    --color-sidebar-title-btn-border:       #dfdfdf  !important;
  
    --color-sidebar-link:                   #000000 !important;  
    --color-sidebar-link-hover:             #000000 !important;
    --color-sidebar-link-hover-border:      hsl(209,100%,13%)  !important;
  
    --color-sidebar-active-bg:              hsl(209,100%,13%)  !important;
    --color-sidebar-active-border:          hsl(209,100%,13%)  !important;
    --color-sidebar-active-link:            #000000            !important;
    --color-sidebar-hover-bg:               hsl(209,100%,13%)  !important;
  
    --color-button-ghost:                   #fff  !important;
  
    /* Seitenmenü / Navigation */
  
    --color-menu-trigger:                   #0064b9     !important;
    --color-menu-trigger-active:            #0064b9     !important;
    --color-menu-trigger-bg:                #0064b9  !important;
    --color-menu-trigger-bg-active:         #0064b9  !important;
  
    --color-nav-bg:                         #fff  !important;
    --color-nav-item-bg:                    #0064b9  !important;
    --color-nav-text:                       #fff !important;
    --color-nav-delimiter:                  #0064b9 !important;
    --color-nav-text-hover:                 #000000 !important;
    --color-nav-bg-hover:                   #004574  !important;
    --color-nav-bg-active:                  #0064b9  !important;
    --color-nav-text-active:                #fff !important;
    /* Sidebar-Menü - submenu: Zurück zu Sidebar-Menü*/
    --color-nav-header-bg:                  #fff !important;
    --color-nav-header-text:                #0064b9 !important;
    --color-nav-bg-dark:                    #fff !important;
    --color-nav-secondary-item-bg:          #0064b9 !important;

    --color-submenu-bg:                     #0064b9 !important;
    --color-submenu-title:                  #fff !important;
    --color-submenu-text:                   #fff !important;
    --color-submenu-border:                 #333 !important;
    --color-submenu-title-btn-bg:           #333 !important;
    --color-submenu-title-btn-link:         #333 !important;
    --color-submenu-title-btn-bg-active:    #00ffaa !important;
    --color-submenu-title-btn-link-active:  #00ffaa !important;
    --color-submenu-title-btn-border:       #00ffaa !important; 
    --color-submenu-link:                   #fff !important;
    --color-submenu-link-hover:             #fff !important;
    --color-submenu-link-hover-border:      #cc00ff !important;
    --color-submenu-active-bg:              #004b8a  !important;
    --color-submenu-active-border:          #0084ff !important;
    --color-submenu-active-link:            #f1f1f3  !important;
    --color-submenu-hover-bg:               #004574 !important;
  
    /* Benutzermenü */
  
    --color-user-menu-bg:                   #f1f1f3  !important;
    --color-user-menu-border:               #f1f1f3  !important;
    --color-user-menu-delimiter:            #f1f1f3  !important;
    --color-user-menu-item-link:            #333  !important;
    --color-user-menu-item-link-hover:      #fff  !important;
    --color-user-menu-item-link-hover-bg:   #333  !important;
  
    /* Box-Ínhalt */
  
    --color-box-bg:                         #fcfcfc  !important;
    --color-box-footer-bg:                  #f5f5f5  !important;
    --color-box-title:                      #000000  !important;
    --color-box-title-hover:                #17205b  !important;
    --color-box-footer-link:                #0064b9  !important;
    --color-box-expandable-bg:              #fcfcfc  !important;
  
    /* Formular-Elemente */
  
    --color-form-primary:                   #0064b9  !important;
    --color-form-secondary:                 hsl(209,100%,13%)  !important;
    --color-form-success:                   #4CAF50  !important;
    --color-form-error:                     #D32F2F  !important;
    --color-form-input-bg:                  #fff     !important;
    --color-form-input-special-bg:          #fffed0  !important;
    --color-form-input-text:                #222     !important;
    --color-form-input-bg-disabled:         #f7f7f7  !important;
    --color-form-input-text-disabled:       #999     !important;
    --color-form-input-bg-readonly:         #fcfcfc  !important;
    --color-form-input-text-readonly:       #222     !important;
    --color-form-border:                    #adaec2  !important;
    --color-form-border-focus:              #8f91ad  !important;
    --color-form-border-readonly:           #fff     !important;
    --color-form-label:                     #222     !important;
    --color-form-label-hint:                #999     !important;
    --color-form-input-glow:                #ff944d  !important;
    --color-form-placeholder:               #999     !important;
    --color-form-select-button-text:        #222     !important;
    --color-form-select-button-bg:          #f5f5f5  !important;
    --color-form-select-title:              #0064b9  !important;
    --color-form-select-text:               #222     !important;
    --color-form-toggle-active:             #fff     !important;
    --color-form-toggle-bg-active:          hsl(209,100%,13%)  !important;
    --color-form-toggle-border-active:      hsl(209,100%,13%)  !important;
    --color-form-toggle-border-hover:       hsl(209,100%,13%)  !important;
    --color-form-toggle-border:             hsl(209,100%,13%)  !important;
    --color-form-toggle-bg:                 #fff     !important;
    --color-form-toggle-checked:            #4CAF50  !important;
    --color-form-toggle-unchecked:          #D32F2F  !important;
    --color-form-toggle-not-set:            #999     !important;
    --color-checkbox-intermediate:          #dfdfdf  !important;
  
    /* Fenster (Modal, Lightbox & PopUp)  */
  
    --color-modal-bg:                       #fff     !important;
    --color-modal-header-bg:                #0064b9  !important;
    --color-modal-title:                    #fff     !important;
    --color-modal-text:                     #222     !important;
    --color-modal-footer-bg:                #f5f5f5  !important;
    --color-modal-close-bg:                 #1d276f  !important;
    --color-modal-close-bg-hover:           #1a2363  !important;
    --color-modal-close-text:               #fff     !important;
  
    --color-lightbox-bg:                    #fff     !important;
    --color-lightbox-close-bg:              transparent  !important;
    --color-lightbox-close-bg-hover:        #1a2363  !important;
    --color-lightbox-close-text:            #222     !important;
    --color-lightbox-close-text-hover:      #fff     !important;
  
    /* Objekt-Editor */
  
    --color-object-editor-bg:               #fcfcfc  !important;
    --color-object-editor-header:           #656d77  !important;
    --color-object-editor-header-dark:      #596069  !important;
    --color-object-editor-header-dark-10:   #4e545b  !important;
  
    /* Reiter */
  
    --color-tabs-border:                    #dfdfdf  !important;
    --color-tabs-link:                      #666     !important;
    --color-tabs-link-hover:                #222     !important;
    --color-tabs-link-active:               #222     !important;
    --color-tabs-indicator:                 #0064b9  !important;
  
    /* Status-Farben */
  
    --color-positive:                       #4CAF50  !important;
    --color-negative:                       #D32F2F  !important;
    --color-info:                           #0064b9  !important;
    --color-warning:                        #FFA500  !important;
    --color-mandatory:                      #D32F2F  !important;
  
    --color-positive-bg:                    #c7e7c8  !important;
    --color-negative-bg:                    #f2c2c2  !important;
    --color-info-bg:                        #c4d8e8  !important;
    --color-warning-bg:                     #ffe4b3  !important;
    --color-mandatory-bg:                   #f2c2c2  !important;
  
    --color-positive-border:                #449d48  !important;
    --color-negative-border:                #c02929  !important;
    --color-info-border:                    #3f75a2  !important;
    --color-warning-border:                 #e69500  !important;
    --color-mandatory-border:               #c02929  !important;
  
    /* Funktions-Schaltflächen */
  
    --color-gf-link:                        #666     !important;
    --color-gf-bg:                          #fff     !important;
    --color-gf-border:                      #dfdfdf  !important;
    --color-gf-link-hover:                  #fff     !important;
    --color-gf-bg-hover:                    #0064b9  !important;
    --color-gf-border-hover:                #0064b9  !important;
    --color-gf-link-active:                 #fff     !important;
    --color-gf-bg-active:                   #0064b9  !important;
    --color-gf-border-active:               #0064b9  !important;
    --color-gf-link-disabled:               gray     !important;
    --color-gf-bg-disabled:                 #fff     !important;
    --color-gf-border-disabled:             #e7e7e7  !important;
  
    /* Schrittanzeige */
  
    --color-pb-default-bg:                  #fff     !important;
    --color-pb-default-text:                #999     !important;
    --color-pb-default-label:               #999     !important;
    --color-pb-finish-bg:                   #0064b9  !important;
    --color-pb-finish-text:                 #fff     !important;
    --color-pb-finish-label:                #666     !important;
    --color-pb-active-bg:                   #fff     !important;
    --color-pb-active-text:                 #0064b9  !important;
    --color-pb-active-label:                #222     !important;
    --color-pb-border:                      #cacbd8  !important;
  
    /* Tabellen */
  
    --color-table-header:                   #0064b9  !important;
    --color-table-header-text:              #000000     !important;
    --color-table-row-background:           #fff     !important;
    --color-table-row-text:                 #000000  !important;
    --color-table-highlight:                #4a7cb3  !important;
    --color-table-highlight-text:           #000     !important;
    --color-table-highlight-bg-dark:        #12ABE420  !important;
    --color-table-selected:                 #4a7cb3  !important;
    --color-table-selected-text:            #fff     !important;
    --color-table-row-background-1:         #fcfcfc  !important;
    --color-table-row-background-2:         #fafafa  !important;
    --color-table-row-background-3:         #f7f7f7  !important;
    --color-table-row-background-4:         whitesmoke  !important;
    --color-table-row-background-5:         #f2f2f2  !important;
    --color-table-row-background-6:         #f0f0f0  !important;
    --color-table-row-background-7:         #ededed  !important;
    --color-table-row-background-8:         #ebebeb  !important;
    --color-table-selected-1:               #ffede0  !important;
    --color-table-selected-2:               #ffeadb  !important;
    --color-table-selected-3:               #ffe7d6  !important;
    --color-table-selected-4:               #ffe4d1  !important;
    --color-table-selected-5:               #ffe1cb  !important;
    --color-table-selected-6:               #ffdec6  !important;
    --color-table-selected-7:               #ffdbc1  !important;
    --color-table-selected-8:               #ffd8bc  !important;
  
    --color-arrow-step-gap:                 #fcfcfc  !important;
    --color-arrow-step-bg:                  #f5f5f5  !important;
    --color-arrow-step-link:                #222     !important;
    --color-arrow-step-text:                #666     !important;
    --color-arrow-step-label:               #222     !important;
    --color-arrow-step-active-bg:           #0064b9  !important;
  
    /* Status-Farben für Aufgaben (TASK) */
  
    --color-status-angelegt:                #f9f9f9  !important;
    --color-status-planung:                 #b13bf9  !important;
    --color-status-freigegeben:             #e42700  !important;
    --color-status-in-bearbeitung:          #0069ff  !important;
    --color-status-unterbrochen:            #00bbc1  !important;
    --color-status-durchgefuehrt:           #00c200  !important;
    --color-status-zurueckgestellt:         #ee9800  !important;
    --color-status-abgewiesen:              #000     !important;
    --color-status-archiviert:              #8e8e8e  !important;
    --color-status-entwurf:                 #ee9800  !important;
    --color-status-beantragt:               #b13bf9  !important;
    --color-status-rueckfrage:              #e42700  !important;
    --color-status-abgeschlossen:           #00c200  !important;
  
    --color-badge-bg:                       #D32F2F  !important;
    --color-badge-text:                     #fff     !important;
  
    --color-help-circle-bg:                 #fff     !important;
    --color-help-circle-border:             #cacbd8  !important;
    --color-help-circle-text:               #0064b9  !important;
    --color-help-circle-bg-hover:           #0064b9  !important;
    --color-help-circle-border-hover:       #0064b9  !important;
    --color-help-circle-text-hover:         #fff     !important;
  
    /* Datei(en) hochladen (DropZone) */
  
    --color-dz-preview-bg:                  #fff     !important;
    --color-dz-preview-border:              #dfdfdf  !important;
    --color-dz-progress-bar:                #4CAF50  !important;
    --color-dz-progress-bar-bg:             #f5f5f5  !important;
  
  
  
    /* Tooltipp */
  
    --color-tt-bg:                          #fff0e5  !important;
    --color-tt-text:                        #222     !important;
    --color-tt-border:                      #cacbd8  !important;
  
    /* Datumauswahl (DatePicker) */
  
    --color-dp-bg:                          #fff     !important;
    --color-dp-border:                      #cacbd8  !important;
    --color-dp-link:                        #0064b9  !important;
    --color-dp-header-bg:                   #0064b9  !important;
    --color-dp-ctrl-bg:                     #f5f5f5  !important;
    --color-dp-month-nav-bg:                #fff     !important;
    --color-dp-full-month-border:           #fff     !important;
    --color-dp-circle-btn-bg:               #0064b9  !important;
    --color-dp-circle-btn-text:             #fff     !important;
    --color-dp-circle-btn-border:           #0064b9  !important;
    --color-dp-circle-btn-bg-hover:         #fff     !important;
    --color-dp-circle-btn-text-hover:       #0064b9  !important;
    --color-dp-circle-btn-border-hover:     #fff     !important;
    --color-dp-select-bg:                   #fff     !important;
    --color-dp-select-text:                 #000000  !important;
    --color-dp-select-border:               #1d276f  !important;
    --color-dp-month-header-border:         #dfdfdf  !important;
    --color-dp-month-header-bg:             #f5f5f5  !important;
    --color-dp-month-header-text:           #999     !important;
    --color-dp-other-month-bg:              transparent  !important;
    --color-dp-other-month-text:            #b3b3b3  !important;
    --color-dp-month-bg:                    #fff     !important;
    --color-dp-month-border:                #dfdfdf  !important;
    --color-dp-month-link-bg:               #fff     !important;
    --color-dp-month-link-text:             #000000  !important;
    --color-dp-month-link-border:           #cacbd8  !important;
    --color-dp-month-today-link-bg:         transparent  !important;
    --color-dp-month-today-link-text:       #0064b9  !important;
    --color-dp-month-today-link-border:     #cacbd8  !important;
    --color-dp-month-highlight-link-bg:     #0064b9  !important;
    --color-dp-month-highlight-link-text:   #fff     !important;
    --color-dp-month-weekend-link-bg:       #f5f5f5  !important;
    --color-dp-month-weekend-link-text:     #0064b9  !important;
    --color-dp-month-selected-link-bg:      #0064b9  !important;
    --color-dp-month-selected-link-text:    #fff     !important;
  
    /* Zum Seitenanfang */
  
    --color-top-jump-bg:                    rgba(245, 245, 245, 0.5)  !important;
    --color-top-jump-text:                  #cacbd8  !important;
    --color-top-jump-border:                #cacbd8  !important;
    --color-top-jump-circle:                #dfdfdf  !important;
    --color-top-jump-bg-hover:              #0064b9  !important;
    --color-top-jump-text-hover:            #fff     !important;
    --color-top-jump-border-hover:          #0064b9  !important;
    --color-top-jump-circle-hover:          #fff     !important;
  
    /* Klappboxen */
  
    --color-toggle-box-bg:                  #656d77  !important;
    --color-toggle-box-text:                #fff     !important;
  
  
  
    /* Aufgaben (TASK) */
  
    --color-task-list-bg:                   #fff  !important;
    --color-task-item-bg:                   #fff  !important;
    --color-task-item-bg-hover:             #fff0e5  !important;
    --color-task-item-text:                 #666  !important;
    --color-task-item-text-hover:           #222  !important;
    --color-task-special-link:              #01a9e3  !important;
  
    --color-task-category-1:                #d61212  !important;
    --color-task-category-2:                #0064b9  !important;
    --color-task-category-3:                #008be4  !important;
    --color-task-category-4:                #06b025  !important;
  
    --color-check-init:                     #434a54  !important;
    --color-check-init-bg:                  #dbdbdb  !important;
    --color-check-init-bg-active:           #f4f4f4  !important;
  
    --color-check-none:                     #434a54  !important;
    --color-check-none-bg:                  #adadad  !important;
    --color-check-none-bg-active:           #c7c7c7  !important;
  
    --color-check-success:                  #129a00  !important;
    --color-check-success-bg:               #afffa2  !important;
    --color-check-success-bg-active:        #dbffd5  !important;
  
    --color-check-warn:                     #867500  !important;
    --color-check-warn-bg:                  #fdff6b  !important;
    --color-check-warn-bg-active:           #feff9e  !important;
  
    --color-check-error:                    #c90000  !important;
    --color-check-error-bg:                 #ffbdbd  !important;
    --color-check-error-bg-active:          #fff0f0  !important;
  
  
    /* Slider Element */
  
    --color-range-track:                    #656d77  !important;
    --color-range-thumb:                    #9bd0cd  !important;
    --color-thumb-shadow:                   #dfdfdf  !important;
    --color-thumb-border:                   #fff  !important;
    --color-track-shadow:                   #222  !important;
    --color-track-border:                   #656d77  !important;
  
  
  
    /* Nachrichten (MESSAGE) */
  
    --color-bubble-bg:                      #fff8f1  !important;
    --color-bubble-media-bg:                #fff0e5  !important;
  
    /* Weitere Farben */
  
    --color-overlay:                        rgba(0, 0, 0, 0.25)  !important;
    --color-map-topic-header:               #656d77  !important;
    --color-expandable-header-bg-hover:     #000000  !important;
    --color-complementary:                  #000000  !important;
    --color-full-width-container:           #fcfcfc  !important;
    --color-full-width-container-border:    #dfdfdf  !important;
  }