diff --git a/superx/edit/kern/maske_combo_laden.jsp b/superx/edit/kern/maske_combo_laden.jsp
index 58478682..cfc3df24 100644
--- a/superx/edit/kern/maske_combo_laden.jsp
+++ b/superx/edit/kern/maske_combo_laden.jsp
@@ -175,7 +175,7 @@ targetDiv.innerHTML=zs;
 		    </div>
 		    <div class='control'>
 		    <!--202605 Suche: is-small entfernt aus class=button, style ergänzt-->
-		       <button class='button is-rounded' style='height:40px;'onClick="renderCombo(comboContent,document.getElementById('comboSuche').value);return false;">
+		       <button class='button is-rounded' onClick="renderCombo(comboContent,document.getElementById('comboSuche').value);return false;">
 		       <span class='icon' aria-hidden='true' alt='Suche' title='Suche'><img src='../../images/search_blue.svg'/></span></button>
 		    </div>
 		 </div>
diff --git a/superx/edit/kern/maske_sicht_laden.jsp b/superx/edit/kern/maske_sicht_laden.jsp
index 2913cc32..e1382fd8 100644
--- a/superx/edit/kern/maske_sicht_laden.jsp
+++ b/superx/edit/kern/maske_sicht_laden.jsp
@@ -132,7 +132,7 @@ zs += "<div class='input-container'>";
 zs += "<label class='label'>Suche</label>";
 zs+="<div class='field has-addons'><div class='control'>"; 
 zs+= "<input id='sichtSuche' class='input is-active' type='text' placeholder='' onBlur='ndSichtEintraegeSuchen(this.value);return false;'/>";
-zs+="</div><div class='control'><button class='button is-rounded' style='height:40px;' onClick='ndSichtEintraegeSuchen(document.getElementById(\'sichtSuche\'));return false;'>";
+zs+="</div><div class='control'><button class='button is-rounded' onClick='ndSichtEintraegeSuchen(document.getElementById(\'sichtSuche\'));return false;'>";
 zs+="<span class='icon' aria-hidden='true' alt='Suche' title='Suche'><img src='../../images/search_blue.svg'/></span></button>";
 zs+="</div></div></div>";
 
diff --git a/superx/style/scss/components/_sx_common.scss b/superx/style/scss/components/_sx_common.scss
new file mode 100644
index 00000000..28496bae
--- /dev/null
+++ b/superx/style/scss/components/_sx_common.scss
@@ -0,0 +1,1288 @@
+// config/_sx_common.scss
+//--Inhalt: Farben, Formen, Abstände für Body, Buttons, Formulare--
+
+@use "../config/sx_theme";
+@use "../config/sx_mixins";
+
+// ========
+// --Body--
+// ========
+
+/* -- Bildschirmseite -- */
+body { 
+   @include sx_mixins.body;
+   @include sx_mixins.font;
+}
+
+div.columns { /*für Abstand zum Seitenrand*/
+  margin-top: 1px;
+  margin-right: 5%;
+} 
+
+.hero-body {
+  margin-left: 0; 
+  margin-right: 1.5em;
+}
+
+
+/* -- Tennlinie -- */
+hr {
+  background-color: sx_theme.theme(hr-background-color); 
+  margin-top: -1rem;
+  margin-bottom: 0.5rem; 
+}
+
+/* -- Silbentrennung --*/
+.trennung {
+  -webkit-hyphens: auto; /* Safari 3.1+ */
+  -moz-hyphens: auto; /* Firefox 2+ */
+  -ms-hyphens: auto; /* IE 10+ */
+  hyphens: auto;
+}
+
+/* --Box-Sizing = Border-Box -- */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+// ==========================
+// --Buttons, Buttonbar--
+// ==========================
+
+.button, button.button, span.button, .subdir-button, .stb-button,  {
+   @include sx_mixins.font;
+   background-color: sx_theme.theme(button-background);
+}
+
+.button { 				/*für Button-Bezeichner-Ausrichtung*/
+  display: flex;
+  justify-content: left !important;
+}
+
+.button.is-rounded { 
+   border-color: sx_theme.theme(border-color);
+   background-color: sx_theme.theme(button-background);
+}
+  
+.submit_button { 			/* zum Abschicken, Übernehmen*/
+  background-color: sx_theme.theme(button-background);
+  @include sx_mixins.border;
+  border-color: sx_theme.theme(submit-button-border-color); /*grün*/
+}
+
+.reset_button { 			/* zum Zurücksetzen, Leeren*/
+  background-color: sx_theme.theme(button-background);
+  @include sx_mixins.border;
+  border-color: sx_theme.theme(reset-button-border-color); 
+}
+
+.close_button { /*zum Schließen*/
+  background-color: sx_theme.theme(button-background);
+  @include sx_mixins.border;
+  border-color: sx_theme.theme(reset-button-border-color); /*hellgrau*/
+}
+
+.menubutton, .orgunitbutton, .closebutton { /*für Button-Style*/
+  display: flex;
+  justify-content: center;
+  background: inherit;
+  padding: 0.4rem 0rem 0.4rem 0rem; /*für Padding: ob re un li*/
+  box-shadow: rgba(0, 0, 0, 0.1) 0.1em 1.1px;
+  width: 1.8rem;
+  height: 1.8rem;
+  @include sx_mixins.border;
+  border-color: white;
+}
+
+.buttonbar {
+  display: flex; 		/*für resposive Buttonleiste*/
+  flex-flow: row wrap;
+  justify-content: flex-start;
+  align-items: normal;
+}
+
+.buttonbar img { 		/*für Icongröße in Buttonleiste*/
+  height: 1.5rem;
+  width: 1.7rem;
+  margin: 8px 0px 0px 0px;
+  padding: 0rem 0.1rem 0rem 0.1rem; /*für Padding: ob re un li*/
+}
+
+.buttonbar_text {
+  font-size: 10px;
+}
+
+// ==================================
+// -- Tooltip-Style und Positionen --
+// ==================================
+
+.select select, .input, .field.has-addons .control .button {
+  height: 2.5em;
+}
+
+.field.has-addons .control:not(:last-child) {
+  margin-right: -2px; /* damit sich die Ränder optisch überlagern */
+}
+
+.button.has-tooltip-bottom {
+  height: 2rem; /* entspricht der Höhe des Eingabeldes*/
+}
+
+[data-tooltip]:not(.is-disabled).has-tooltip-bottom::before,
+[data-tooltip]:not(.is-loading).has-tooltip-bottom::before,
+[data-tooltip]:not([disabled]).has-tooltip-bottom::before {
+  display: flex;
+  position: absolute;
+  z-index: 3000;
+  margin: 0.5em;
+  padding: 1em;
+  background-color: sx_theme.theme(tooltip-background); 
+  @include sx_mixins.font;
+  color: sx_theme.theme(tooltip-font-color); 
+ 
+  text-align: left;
+  max-width: 250px;
+  height: fit-content;
+  overflow-wrap: break-word !important; 
+  word-break: normal !important;
+  white-space: normal !important;
+  hyphens: auto;
+}
+
+// ================
+// -- Formulare --
+// ================
+/* -- Label --*/
+
+.required:before {
+  content: "* "; /*Kennz. für obligatorische Eingabefelder*/
+} 
+
+.label, .labelNormal, .labelPflicht, 
+.label.is-small {
+    @include sx_mixins.font; 
+}
+
+.labelSichtorComboButton, .labelPflicht, .labelNormal, .labelSichtorComboButtonPflicht {
+  white-space: normal; 		/* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; 		/* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; 	/* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+  text-align: right; 		/* für rechtsbündigen und umgebrochenen Text*/
+  cursor: pointer;
+  width: 100%;
+}
+
+.labelSichtorComboButton, .labelSichtorComboButtonPflicht {
+  @include sx_mixins.font; 
+  color: var(--bulma-link-text); /*Linkfarbe*/
+}
+
+.labelSichtorComboButtonPflicht::before, .labelPflicht::before {
+  content: "* "
+} 
+
+.label-container, .button-label { /*für einh.responsive Feldbezeichner; vgl. dazu auch: sx_menu.css*/
+  display: flex;
+  background: inherit;
+  min-width: 7.5rem; 		/*für kleine Viewports*/
+  width: 100%;
+}
+
+.button-label button {
+  white-space: normal; 	/* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; 	/* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  line-height: 1;
+  padding-left: 0rem !important;
+  text-align: center; 	/*für zentrierten Text*/
+  width: 100%;
+}
+
+.label-container-dialog { 	/*für Dialogfelder*/
+  display: flex;
+  justify-content: left;
+  background: inherit;
+  min-width: 10rem; 		/*für kleine Viewports*/
+}
+
+.labelNormal-dialog {
+  white-space: normal; 		/* für Zeilenumbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; 	/* aktuell: für Umbrüche nach Standard-Regeln*/
+  text-align: left; 		/* für linksbündigen und umgebrochenen Text*/
+  width: 100%;
+}
+
+/* -- Selektionsfelder -- */
+.form-submit {
+  display: flex;
+  column-gap: 0.5rem;
+  background: inherit;
+  border: none;
+  margin-top: 1em;
+  margin-left: 22em;
+}
+
+.form-submit-item {
+  display: flex;
+}
+
+.selectionbox {
+  display: flex;
+  width: 80%;
+  justify-content: left;
+  padding: 0rem;
+}
+
+.control-new { /*für einheitl. Controlbreite in Masken u. Themenbaum*/
+  min-width: 12rem; /*für kleine Viewports*/
+  width: 100%; /*für große Viewports*/
+  height: 1.6rem;
+}
+
+.control-new-narrow { 	/*für einheitl. Controlbreite in Masken u. Themenbaum*/
+  min-width: 8rem; 	/*für kleine Viewports*/
+  width: 20%; 		/*für große Viewports*/
+  margin: 0rem 0.2rem 0.1rem 0.2rem; /*für Margin: ob re un li*/
+}
+
+.field-container {
+  display: flex;
+  flex-direction: column; /* Ordnet alle Felder vertikal */
+  gap: 1px; 		  /* Abstand zwischen den Feldern */
+  width: 100%; 		  /* Passt sich verfügbarer Breite an */
+}
+
+.field {
+  @include sx_mixins.font;
+  margin-left: 1%;
+  align-items: center;  /*für horizontale Label-Ausrichtung*/
+}
+
+.field-body { /*für Feldhöhe/-abstand*/
+  height: 1.2rem;
+}
+
+/* -- Input --*/
+.input, .textarea, .select select { 
+   @include sx_mixins.input;
+}
+
+.input.is-small, .select.is-small {
+   @include sx_mixins.font;
+}
+
+input.schluesselfeld  {
+  background-color: #ffffcc;
+  @include sx_mixins.font;                          
+  font-size: 0.9em; 
+  color: blue;
+}
+
+input.ndSchluesselfeld {
+  @include sx_mixins.input;
+  border: sx_theme.theme(border-style);
+  /*border-color: hsl(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l));
+  --bulma-input-border-width: 1px;
+  --bulma-input-border-l: var(--bulma-border-l);
+  /*box-shadow: inset 0 0.0625em 0.125em hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.05);*/
+  background-color: sx_theme.theme(input-background-ndSchluesselfeld); /*weißgelb*/
+  /*font-size: var(--bulma-size-small);*/
+  padding-left: 5px;
+  line-height: 2;
+}
+
+
+/* -- Platzhalter, Textarea -- */
+.placeholder, .input::placeholder, .textarea::placeholder, .select select::placeholder,
+.input::-moz-placeholder, .textarea::-moz-placeholder, .select select::-moz-placeholder, 
+.input:-ms-input-placeholder, .textarea:-ms-input-placeholder, .select select:-ms-input-placeholder {
+   @include sx_mixins.font;
+   color: sx_theme.theme(mittelgrau);
+}
+
+//.input::-moz-placeholder, .textarea::-moz-placeholder, .select select::-moz-placeholder, 
+//.input:-ms-input-placeholder, .textarea:-ms-input-placeholder, .select select:-ms-input-placeholder {
+//  color: darkgrey;
+//}
+
+.resizable-textarea {
+  resize: vertical; 	/* Erlaubt vertikales Vergrößern */
+  overflow: auto; 	/* Scrollt den Inhalt, wenn er zu groß wird */
+  min-height: 7em; 	/* Ausgangshöhe */
+  max-height: 300px; 	/* Maximale Höhe */
+  margin-left: 12px;
+}
+
+// =====================================
+// -- Top-, Bottom-, Side-Navigation --
+// =====================================
+
+/* Top-Navi */
+.navbar, .bottom-nav { 
+   background: sx_theme.theme(navbar-background); 
+}
+
+.navbar {
+  display: flex;
+  align-items: center;
+  flex-flow: row wrap;
+}
+
+.navbar-end {
+  display: flex;
+}
+
+.navbar-item {
+  margin-bottom: 0.1rem;
+}
+
+/* Bottom-Navi */
+#nd_navi_bottom {
+  /*position: fixed;	/*20250602 damit gesamtes Menü sichtbar ist*/
+  bottom: 0;
+  width: 100%;
+}
+
+.bottom-nav { 		/*für Bottomnavi-Zeile*/
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  height: 45px;
+}
+
+.bottom-nav li { 	/*für Bottomnav-Liste*/
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: space-evenly;
+}
+
+.poweredby_sxbi {
+  display: flex;
+  content: url(../images/poweredby_sxbi.svg);
+  width: 10rem;
+}
+
+// ===================================
+// -- Menü via Navpanel, Themenbaum --
+// ===================================
+/* -- NavPanel -- */
+.panel-block, .panel-tabs, 
+.navbar-item, .navbar-dropdown, .bottom-nav {  
+   @include sx_mixins.border; 
+   border-color: transparent;
+}
+
+.menu-label {  
+   @include sx_mixins.font; 
+   background: inherit;
+}
+
+.menu-list a {  
+   @include sx_mixins.font; 
+   background: sx_theme.theme(input-background);
+}
+
+a:hover, a:focus { 	/*für Hervorhebung bei Anwahl*/
+   color: sx_theme.theme(font-color); 
+   background-color: white; /*transparent;*/
+} 
+
+.navpanel {
+  position: static; 	/*damit NavPanel in kl. Viewport nicht am oberen BS-Rand klebt*/
+  padding: 0;
+}
+
+.navpanelFrame { 	/*für gesamtes NavPanel*/
+  display: flex;
+  flex-flow: column;
+  list-style: none;
+  margin-top: 0.5rem;
+}
+
+.navpanelFrame { 	/*zum Ausblenden gesamten NavPanels*/
+  display: none;
+}
+
+/*.navpanel a  {	} /*Eigenschaften deaktiviert da überlagert mit themenbaumStatic/.Nested a und li; sh. Z480+Z486*/ /*für Nav-Elemente*/
+
+.level-center {
+  display: flex;
+  align-items: center;
+  flex-grow: 1;
+  width: 100%; 		/* Optional: vollständige Breite des Containers */
+  height: 100%; 	/* Optional: vollständige Höhe des Containers */
+}
+
+.panel-block {
+  display: flex;
+}
+
+.panel-block-search {
+  margin-left: 10px;
+}
+
+.menu-label {
+  margin-left: 5%;
+  text-transform: unset;
+}
+
+.panel-icon {
+  margin: 2%;
+}
+
+/* -- Auf-/Zuklappen von NaviPanel-Auswertungen -- */
+.menubutton::before { 		/*für Button-Grafik*/
+  display: flex;
+  justify-content: center;
+  content: url(../images/burger.svg);
+  width: 1rem;
+  height: 0.8rem;
+}
+
+.closebutton::before { 		/*für Button-Grafik*/
+  display: flex;
+  justify-content: center;
+  content: url(../images/close_grey.svg);
+  width: 1rem;
+  height: 0.8rem;
+}
+
+.closenavpanel.closebutton::before { /*für Buttonanzeige bei geschlossenem NavPanel*/
+  display: flex;
+  content: url(../images/burger.svg);
+}
+
+/* -- Auf-/Zuklappen von NaviPanel-OrgUnits -- */
+/* Angaben zu closebutton::before; closebutton-Style; closebutton-Grafik s.o. bei Nav-Panel-Auswertungen*/
+.orgunitbutton::before { 	/*für Button-Grafik*/
+  display: flex;
+  justify-content: center;
+  content: url(../images/sitemap_blue_dark.svg);
+  width: 1rem;
+  height: 0.8;
+}
+
+.shownavpanel_ou + ul { /*nur relevant, wenn NavPanel beim Dialogöffnen ausgeblendet ist*/
+  display: flex; /*bitte auch Hinweis zur Code(de)aktivierung im template nd_navi_panel/nd_navi_panel_ou beachten*/
+  flex-flow: column;
+  max-height: 600rem;
+  transition: 500ms;
+  overflow: initial;
+}
+
+.shownavpanel_ou.orgunitbutton::before { /*für Buttonanzeige bei geöffnetem NavPanel*/
+  display: flex;
+  content: url(../images/close_grey.svg);
+  padding-right: 0.9rem;
+  width: 0.7rem;
+  height: 0.7rem;
+}
+
+.closenavpanel_ou + ul { /*darf nur AKTIV sein, wenn NavPanel beim Dialogöffnen eingeblendet sein soll*/
+  display: none; /*bitte auch Hinweis zur Codeaktivierung in templates nd_navi_panel/nd_navi_panel_orgunits beachten*/
+}
+
+.closenavpanel_ou.closebutton::before { /*für Buttonanzeige bei geschlossenem navpanel*/
+  display: flex;
+  content: url(../images/sitemap_blue_dark.svg);
+}
+
+// ====================================
+// -- Themenbaum mit Hierarchieebenen--
+// ====================================
+/* -- Auf-/Zuklappen von Themenbaum/ThemenbaumNested -- */
+.themenbaumNested { /*zum Auf-/Zuklappen*/
+  display: none;    /*erforderlich für initial zusammengklappten Themenbaum*/
+  margin-right: 0px;
+}
+
+.themenbaumActive {
+  display: block;
+  margin-right: 0px;
+}
+
+.themenbaumStatic li.themenbaumEintrag { /*für ListElemente*/
+  margin-left: 23px;
+  width: 310px;
+  box-sizing: border-box; /* Beinhaltet Padding und Border in der Breitenberechnung*/
+  margin-top: 0; 	  /* ohne zusätzlichen Freiraum oberhalb*/
+  margin-bottom: 0;       /* ohne zusätzlichen Freiraum unterhalb*/
+}
+
+.themenbaumStatic li.themenbaumEintrag:not(:last-child) { /*für ListElemente*/
+   border-bottom: 0.1px solid sx_theme.theme(border-color); /*#cccccc;*/
+}
+
+.themenbaumNested li.themenbaumEintrag:not(:last-child) { /*für ListElemente*/
+  width: 95%;
+  box-sizing: border-box; /* Verhindert überschüssige Breitenänderungen */
+  margin-top: 0; 	  /* ohne zusätzlichen Freiraum oberhalb */
+  margin-bottom: 0; 	  /* ohne zusätzlichen Freiraum unterhalb */
+  border-bottom: 0.3px dotted sx_theme.theme(border-color);
+}
+
+.themenbaumStatic a, .themenbaumNested a { /*für BaumElemente*/
+   @include sx_mixins.font;
+   color: blue;  /*var(--bulma-link-text);*/ 
+   margin-left: 5px;
+}
+
+.themenbaumEintrag {
+  display: block; /*Zeigt jedes Thema als Blockelement, sodass es vertikal gestapelt wird */
+}
+
+.themenbaumLink, .panel-item { /*20250704 panel-item ergänzt*/
+  display: inline-flex; /* Flexbox sorgt dafür, dass Icons und Text korrekt ausgerichtet sind */
+  align-items: baseline; /* Vertikale Zentrierung von Icon und Text */
+}
+
+.themenbaumLinkName {
+  white-space: normal; 		/* Erlaubt Zeilenumbruch */
+  overflow-wrap: break-word; 	/* Ermöglicht Umbruch bei langen Wörtern */
+  padding-left: 0.2em; 		/* Abstand nach links vom Icon */
+  display: block; 		/* Block, um Zeilenumbrüche zu unterstützen */
+  @include sx_mixins.font;
+  color: blue; 
+}
+
+.themenbaumLinkWithSpace {
+  text-decoration: none; /*keine Unterstreichung für Links */
+  box-decoration-break: clone;
+  -webkit-box-decoration-break: clone;
+}
+
+.themenbaumPlaceholder {
+  padding-left: 5px; /*für Abstand zu linkem Rand u. Linktext*/
+}
+
+.themenbaumCaret {
+  cursor: pointer; /* Zeigt an, dass das Caret klickbar ist */
+  -webkit-user-select: none; /* Safari 3.1+ */
+  -moz-user-select: none; /* Firefox 2+ */
+  -ms-user-select: none; /* IE 10+ */
+  user-select: none;
+  display: inline-block; /* Caret bleibt in der gleichen Zeile wie der Text */
+  vertical-align: text-bottom; /* Vertikale Ausrichtung des Carets mit dem Text */
+}
+
+.themenbaumCaret-down::before {
+  -ms-transform: rotate(270deg); /* IE 9 */
+  -webkit-transform: rotate(270deg); /* Safari */
+  transform: rotate(270deg);
+}
+
+.themenbaumCaret::before {
+  content: ">";
+  color: sx_theme.theme(themenbaumCaret-color);
+  display: inline-block; /* Caret bleibt in der gleichen Zeile wie der Text */
+}
+
+ol.themenbaumSearchResults { /*für Suchergebnisse*/
+  padding-left: 20px;
+}
+
+// ==============
+// --Breadcrumb--
+// ==============
+
+.breadcrumb {
+   @include sx_mixins.font;
+   @include sx_mixins.border; 
+   padding: 0.2rem; 
+   white-space: normal;
+   min-width: 0;
+   max-width: 100%;
+}
+
+.breadcrumb ul {
+  display: flex;
+  flex-wrap: wrap;
+  max-width: 100%;
+  align-items: center !important; /*für Höhenausrichtung*/
+}
+
+.breadcrumb li {
+  min-width: 0;
+  white-space: normal;
+  overflow-wrap: break-word;
+  word-break: normal;
+  hyphens: auto;
+}
+
+.breadcrumb.has-path-separator li + li::before {
+  content: " > ";
+  color: sx_theme.theme(breadcrumbSeparator-color);
+}
+
+.breadcrumb, .breadcrumb a { 
+  user-select: auto; /*für Markierung des Inhalts */
+}
+
+
+// ======================================================
+// --Article, Box, Card, Cell, Container, Grid, Modal --
+// ======================================================
+.article, .article ul, .card, .cell, .grid {
+   @include sx_mixins.font; 
+}
+/* -- Article -- */
+.article { 		/*Position, -style*/
+  display: flex;
+  flex-flow: column;
+  /*margin: 1%; 20261005 deaktiviert*/
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+  text-align: left; /* für linksbündigen und umgebrochenen Text*/
+  cursor: pointer;
+  width: 100%;
+}
+
+/* -- Container, Cell -- */
+.container {
+  display: flex;
+  flex-wrap: wrap; /*für Zeilenumbruch bei Platzmangel*/
+  justify-content: flex-start; /*Inhalte links*/
+  align-items: flex-start; /*Inhalte vertikal ausrichten*/
+  margin-left: 0rem;
+}
+
+.cell {
+  flex: 1 1 auto; /*flex-grow, flex-shrink, flex-basis = ; für flexibles Verhalten der Zeile*/
+  display: flex; /*flexibles Wachstum ohne feste Breite */
+  padding: 0rem 0.25rem; /*padding oben+unten, rechts+links*/
+  margin-bottom: 0.1rem;
+  box-sizing: border-box;
+  border: thin solid hsl(0, 0%, 60%); /*hellgrau*/
+  border-radius: 0.3em;
+}
+
+/* -- Card, Box -- */
+.box, .card { /*Box für Pfad, Buttonleiste bzw. Menü-Kacheln; Card für Formulare, Ergebnistabellen*/
+  box-shadow: none;
+  background-color: sx_theme.theme(card-background);
+}
+
+.card { 		/*Position, -style*/
+  display: flex;
+  flex-flow: column;
+  /*margin: 1%; 20261005 deaktiviert*/
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+  text-align: left; /* für linksbündigen und umgebrochenen Text*/
+  cursor: pointer;
+  //width: 100%;
+  margin-top: 0.45rem !important;
+  @include sx_mixins.border; 
+  border-color: white;
+}
+
+.card-content {
+  padding-left: 1.3rem;
+  padding-top: 0;
+}
+
+.card-footer, .card-footer-item { /*für submit-buttons*/
+  display: flex;
+  flex-flow: row; /*für horizontale Ausrichtung*/
+  background: sx_theme.theme(card-footer-background); 
+  border: none;
+  margin-top: 1rem;
+}
+
+.card-footer-item:not(:last-child) {
+  border: none;
+}
+
+/* -- Modal-Cards -- */
+.box-new { /*für Kopfzeile mit Close-Button*/
+  display: flex;
+  justify-content: space-between;
+  @include sx_mixins.font;
+  font-weight: bold;
+}
+
+.modal-background {
+  background-color: sx_theme.theme(card-background);
+}
+
+.modalValues {
+  background-color: sx_theme.theme(modal-values-background); /*für Abschnitthintergrund, Schrift*/
+  @include sx_mixins.font;
+  font-size: 0.8em;
+  padding: 1rem;
+}
+
+.modalDl_title { /*für Texthervorhebungen*/
+  display: flex;
+  justify-content: center;
+  background: inherit;
+  font-size: 1.2em;
+  font-weight: 400;
+}
+
+span.feldname {
+  font-weight: medium;
+}
+
+span.feldwert {
+  font-weight: bolder;
+}
+
+// ============================
+// --Titel, Untertitel. etc.--
+// ============================
+.title, .subtitle, .supplement, span.report-explanation, dropdown, .resultcount, .searchresult,
+.dontprint, .panel-block, .panel-tabs {
+   @include sx_mixins.font; 
+}
+
+.title, .subtitle { /*für Seitentitel*/
+  margin-top: 0.4em;
+  padding-bottom: 0.1em; /* für Padding: ob re un li*/
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+}
+
+// =============
+// -- Listen --
+// =============
+ul {
+  list-style-type: disc;
+}
+
+ol {
+  margin: 0px;
+  padding: 0px;
+  list-style-type: decimal;
+  list-style-position: inside;
+}
+
+.menu-list {
+  padding-left: 0.6rem !important;
+  list-style-type: none;
+}
+
+li.submenu_listelem {
+  list-style: none;
+  margin: 10px;
+  padding: 0;
+  border-bottom: thin solid silver;
+}
+
+.submenu_listelem:hover, .submenu_listelem:focus {
+  background-color: white;
+}
+
+// ===========================
+// -- Logobuttons und Icons --
+// ===========================
+/* -- allgemein -- */
+img.svg_icon {
+  height: 20px;
+}
+
+.icon_themenbaum_neutral_small {
+  content: url(../images/icon_neutral_mini.svg);
+  height: 21px;
+  width: 20px;
+  padding-top: 5px;
+  display: inline;
+}
+
+.icon_themenbaum_neutral_normal {
+  content: url(../images/icon_neutral_mini.svg);
+  height: 70px;
+  width: 60px;
+  padding-top: 15px;
+  display: inline;
+}
+
+/* -- Logobuttons und Icons für Auswertungstypen -- */
+.icon_themenbaum_datenblatt_normal {
+  content: url(../images/th.svg);
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+}
+
+.icon_themenbaum_datenblatt_small {
+  content: url(../images/th.png);
+  height: 20px;
+  width: 20px;
+  display: inline-block;
+}
+
+.icon_themenbaum_zeitreihe_normal {
+  content: url(../images/chart-line.svg);
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+}
+
+.icon_themenbaum_zeitreihe_small {
+  content: url(../images/chart-line.png);
+  height: 20px;
+  width: 20px;
+  display: inline-block;
+}
+
+/* -- Logobuttons und Icons für Module a bis e -- */
+.icon_themenbaum_admin_small {
+  content: url(../images/logobutton_kern.svg);
+  height: 20px;
+  width: 20px;
+  display: inline;
+}
+
+.icon_themenbaum_admin_normal {
+  content: url(../images/logobutton_kern.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_bau_small {
+  content: url(../images/icon_bau_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_bau_normal {
+  content: url(../images/logobutton_bau.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_cob_small {
+  content: url(../images/icon_cob_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_cob_normal {
+  content: url(../images/logobutton_cob.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_co_stage_small {
+  content: url(../images/icon_co_stage_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_co_stage_normal {
+  content: url(../images/logobutton_co_stage.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_erfolg_small {
+  content: url(../images/icon_erfolg_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_erfolg_normal {
+  content: url(../images/logobutton_erfolg.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_etl_small {
+  content: url(../images/icon_etl_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_etl_normal {
+  content: url(../images/logobutton_etl.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+/* -- Logobuttons und Icons für Module f bis m -- */
+.icon_themenbaum_fin_small {
+  content: url(../images/icon_fin_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_fin_normal {
+  content: url(../images/logobutton_fin.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_gang_small {
+  content: url(../images/icon_gang_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_gang_normal {
+  content: url(../images/logobutton_gang.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_gx_stage_small {
+  content: url(../images/icon_gx_stage_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_gx_stage_normal {
+  content: url(../images/logobutton_gx_stage.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_hr_stage_small {
+  content: url(../images/icon_hr_stage_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_hr_stage_normal {
+  content: url(../images/logobutton_hr_stage.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_ivs_small {
+  content: url(../images/icon_ivs_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_ivs_normal {
+  content: url(../images/logobutton_ivs.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_kenn_small {
+  content: url(../images/icon_kenn_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_kenn_normal {
+  content: url(../images/logobutton_kenn.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_small {
+  content: url(../images/icon_kern_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_normal {
+  content: url(../images/logobutton_kern.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_face_small {
+  content: url(../images/icon_kern_face_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_face_normal {
+  content: url(../images/logobutton_kern_face.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_leistungsmonitor_small {
+  content: url(../images/icon_leistungsmonitor_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_leistungsmonitor_normal {
+  content: url(../images/logobutton_leistungsmonitor.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_list_normal {
+  content: url(../images/list.svg);
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+}
+
+.icon_themenbaum_list_small {
+  content: url(../images/list.png);
+  height: 20px;
+  width: 20px;
+  display: inline-block;
+}
+
+.icon_themenbaum_JR_BerDesign_small {
+  content: url(../images/icon_JR_BerDesign_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_JR_BerDesign_normal {
+  content: url(../images/logobutton_JR_BerDesign.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_man_small {
+  content: url(../images/icon_man_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_man_medium {
+  content: url(../images/icon_man_mini.svg);
+  height: 30px;
+  width: 30px;
+  display: inline;
+}
+
+.icon_themenbaum_man_normal {
+  content: url(../images/logobutton_man.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+/* -- Logobuttons und Icons für Module n bis z -- */
+.icon_themenbaum_nutzungsantrag_small {
+  content: url(../images/icon_nutzungsantrag.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_nutzungsantrag_normal {
+  content: url(../images/logobutton_nutzungsantrag.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_portal_konfig_small {
+  content: url(../images/icon_portal_konfig_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_portal_konfig_normal {
+  content: url(../images/logobutton_portal_konfig.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_prom_small {
+  content: url(../images/icon_prom_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_prom_normal {
+  content: url(../images/logobutton_prom.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_qa_small {
+  content: url(../images/icon_qa_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_qa_normal {
+  content: url(../images/logobutton_qa.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_rpta_small {
+  content: url(../images/icon_rpta_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_rpta_normal {
+  content: url(../images/logobutton_rpta.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_sos_small {
+  content: url(../images/icon_sos_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_sos_normal {
+  content: url(../images/logobutton_sos.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_sva_small {
+  content: url(../images/icon_sva_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_sva_normal {
+  content: url(../images/logobutton_sva.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_sx_connect_small {
+  content: url(../images/icon_sx_connect.png);
+  height: 20px;
+  width: 20px;
+  display: inline;
+}
+
+.icon_themenbaum_sx_connect_normal {
+  content: url(../images/logobutton_sx_connect.png);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_viz_small {
+  content: url(../images/icon_viz_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 8px;
+  display: inline;
+}
+
+.icon_themenbaum_viz_normal {
+  content: url(../images/logobutton_viz.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_xcube_small {
+  content: url(../images/icon_xcube_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 4px;
+  display: inline;
+}
+
+.icon_themenbaum_xcube_medium {
+  content: url(../images/icon_xcube_mini.svg);
+  height: 30px;
+  width: 30px;
+  display: inline;
+}
+
+.icon_themenbaum_xcube_normal {
+  content: url(../images/logobutton_xcube.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_zul_small {
+  content: url(../images/icon_zul_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_zul_normal {
+  content: url(../images/logobutton_zul.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+
diff --git a/superx/style/scss/components/_sx_field_dialogue.scss b/superx/style/scss/components/_sx_field_dialogue.scss
new file mode 100644
index 00000000..6e595c9b
--- /dev/null
+++ b/superx/style/scss/components/_sx_field_dialogue.scss
@@ -0,0 +1,241 @@
+// pages/_sx_field_dialogue.scss
+//--Inhalt: Farben, Formen, Abstände für sx_field_dialogue--
+
+@use "../config/sx_theme";
+@use "../config/sx_mixins";
+
+
+// =============================================================
+// -- Titel, Navi, Linie --
+// =============================================================
+
+.title-dialogue.is-4 {
+    color: sx_theme.theme(title-dialogue-color);
+    font-weight: bold;
+    font-size: 25px;
+}
+
+.title-dialogue.is-4:before {
+  content: "";
+}
+
+.title-dialogue.is-4:after {
+  content: " Filter";
+}
+
+.navbar-dialogue {
+  position: sticky; /* 202606 ergänzt:Kopfzeile bleibt beim Scrollen "kleben"*/
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 105px;
+  z-index: 1000;
+  margin-top: -55px;
+  background: sx_theme.theme(navbar-dialogue-background);
+}
+
+hr {
+  margin-top: -1rem;
+  margin-bottom: 0.5rem;
+}
+
+
+// =====================================
+// -- Buttons, Input, Auswahlfelder --
+// =====================================
+.a-dialogue {
+  @include sx_mixins.font;
+  color: black;
+  font-weight: bold;
+}
+
+button.button-dialogue {
+  @include sx_mixins.button-dialogue; 
+  background-color: sx_theme.theme(button-background);  //UDE-Grau: #d9d9d9;
+  padding: 8px;
+  width: 11em;
+}
+
+.input-container.sticky-filter { /*202606 Filter ergänzt f. äußeren Container*/
+  background: #d9d9d9;
+}
+
+input[type=checkbox] {
+  vertical-align: bottom;
+  line-height: 1.25;
+}
+
+.comboDiv-dialogue { 		
+  margin-left: 1.6rem;
+}
+
+/* -- Standarddarstellung -- */
+.comboDiv {
+  display: flex;
+  justify-content: left;
+  margin-top: 1em; 		
+}
+
+.input-container.sticky-filter {/*202606 Filter ergänzt f. äußeren Container*/
+  position: sticky; 		/*202606 neu: bleibt beim Scrollen sichtbar*/
+  top: 105px; 			/* Höhe der Navbar > siehe oben */
+  z-index: 999;
+  padding: 0.5rem 0;
+}
+
+.input-container {
+  display: flex;
+  flex-direction: row; /* Ordnet Felder horizontal*/
+  margin-top: 0.2rem;
+ }
+
+.input-container > .label {
+  margin-bottom: 1rem; 
+  margin-right: 0.5rem; 
+  text-align: right; 
+}
+
+.field is-grouped is-grouped-multiline {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  gap: 1rem;
+}
+
+.field.is-grouped {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  margin-left: 0.5rem;
+  gap: 1rem;
+}
+
+.field {
+  align-items: flex-start; /*für gleiche vertik. Feldausrichtung*/
+}
+
+.label {
+  margin-top: 5px;
+  width: 8em; 
+ font-weight: bold;  
+}
+
+.select select, .input { /*für Auswahlfeldstyle*/
+   padding-left: 5px;
+}
+
+// ========================================
+// Media-Queries für responsives Verhalten
+// ========================================
+
+/*--Anpassungen für Viewports Mobile bis 768px=tablet-Hochformat --*/
+@media screen and (min-width: 585px) and (max-width: 768px) {
+  .input-container {
+    flex-direction: row;
+    gap: 1px; 		/* Abstand zwischen den Feldern*/
+  }
+  .input-container > .label { 
+    margin-bottom: 0rem;
+    text-align: right; 
+  }
+  .field.is-grouped {
+    flex-direction: row;
+  }
+  .field {
+    align-items: flex-start;
+  }
+}
+
+/* --Anpassung für kleine Viewports (Mobile) -- */
+@media screen and (max-width: 584px) {
+  .input-container {
+    flex-direction: column; /* Stapelt Felder*/
+    margin-top: 0rem; 
+    padding-bottom: 0.2rem; 
+  }
+  .input-container > .label { 
+    margin-bottom: 0rem;
+    text-align: left; 
+  }
+  .field.is-grouped {
+    flex-direction: row;
+    column-gap: 5px; /* Abstand label und Input/Select-Felder */
+    row-gap: 1px;    /* Höhenabstand zwischen Feldern; ohne Angabe wird Abstand zu groß*/
+  }
+}
+
+// =========================================================
+// --- Ergebnislisten von Sichten und gesuchten Elementen --
+// =========================================================
+
+ul {
+  list-style: none !important;
+}
+
+.sichtentreeUL {
+  list-style-type: none;
+  margin-left: 2em;
+  padding: 0;
+}
+
+.sichtentreeCaret {
+  cursor: pointer;
+  -webkit-user-select: none; /* Safari 3.1 */
+  -moz-user-select: none; /* Firefox 2 */
+  -ms-user-select: none; /* IE 10 */
+  user-select: none;
+}
+
+.sichtentreeCaret::before {
+  content: "▶";
+  color: #014A7B;
+  display: inline-block;
+  margin-right: 0px;
+}
+
+.sichtentreeCaret-down::before {
+  -ms-transform: rotate(90deg); /* IE 9 */
+  -webkit-transform: rotate(90deg); /* Safari */
+  transform: rotate(90deg);
+}
+
+.sichtentreePlaceholder {
+  margin-left: 16px;
+}
+
+.sichtentreeNested {
+  display: none;
+  margin-right: 0px;
+  padding-left: 13px;
+}
+
+.sichtentreeActive {
+  display: block;
+  margin-right: 0px;
+  padding-left: 13px;
+}
+
+.sichtentreeSpacer {
+  padding-left: 10px; /*wofür nötig?*/
+}
+
+.sichtentreeLink {
+  text-decoration: none; /* keine Unterstreichung für links */
+}
+
+.sichtentreeLinkWithSpace {
+  text-decoration: none; /* keine Unterstreichung für links */
+  margin-left: 10px;
+  box-decoration-break: clone;
+  -webkit-box-decoration-break: clone;
+}
+
+ul.sichtentreeChildUL {
+  margin: 0px;
+  padding-left: 10px;
+  list-style-type: none;
+  list-style-position: inside;
+  list-style-image: none;
+}
+
+
diff --git a/superx/style/scss/components/_sx_tabelle.scss b/superx/style/scss/components/_sx_tabelle.scss
new file mode 100644
index 00000000..e6f68ce8
--- /dev/null
+++ b/superx/style/scss/components/_sx_tabelle.scss
@@ -0,0 +1,413 @@
+// pages/_sx_tabelle.scss
+//--Inhalt: Farben, Formen, Abstände für sx_tabelle--
+
+@use "../config/sx_theme";
+@use "../config/sx_mixins";
+
+// ===========
+// -- Body -- 
+// ===========
+
+/* -- Bildschirmseite mit scrollbar -- */
+html, body {
+  max-width: 100%;
+  overflow-x: visible;
+}
+
+
+// =================================================
+// -- Elemente über und unter der Ergebnistabelle -- 
+// =================================================
+/* --Container im Ergebnisbereich -- */
+.hero-body > .container { /*in _sx_common.scss*/
+    display: block;
+    width: 100%;
+    max-width: 100%; /*none;*/
+    min-width: 0;
+    box-sizing: border-box;
+}
+
+.container {
+//  overflow-x: auto; /* Nur horizontales Scrollen */
+//  overflow-y: auto; /* Vertikales Scrollen */
+//  max-height: 80vh; /* max. Container-Höhe 190% des Viewports (whitesmoke-farbene übergeo Card u Column) */
+//  max-width: 190vb; /* max. Container-Breite 190% des Viewports (whitesmoke-farbene übergeo Card u Column) */
+//  max-width: 100%;      /* volle Container-Breite */
+  white-space: normal; /* Ermöglicht Zeilenumbrüche in den Tabellenzellen */
+  hyphens: auto;
+  /*white-space: nowrap; 	/* Verhindert Zeilenumbrüche in den Tabellenzellen */
+  -webkit-overflow-scrolling: touch; /* Für bessere Scroll-Erfahrung auf Mobilgeräten */
+}
+
+
+/* -- Card -- */
+.hero-body > .container > .card {
+   width: fit-content;
+   max-width: 100%;
+   min-width: 0;
+   box-sizing: border-box;
+}
+
+
+/* -- Input-container unter Buttonbar mit: Label, Auswahlfeld, Button --*/
+.input-container {
+  display: flex;
+  align-items: center;
+  flex-wrap: normal;
+  flex: 1 1 auto;    /* 20260304; flex-grow, flex-shrink, flex-basis = auto; /*für flexibles Verhalten der Zeile*/
+  padding-bottom: 0.1rem;
+}
+
+.input-container > .label { /*Standarddarstellung für größere Viewports*/
+  margin-bottom: 0.3rem;
+  margin-right: 0.5rem; /* Abstand zwischen Label und Eingabefeld*/
+} 
+
+.field {
+  margin-left: 1px; /*für Abstand Buttonbar-SelectFeld*/
+} 
+
+/* -- Legende --*/
+.legende, p.legende {
+  display: flex;
+  /*flex-grow: 1;
+  /*flex-shrink: 1;*/
+  flex: 1 1 auto; 
+  flex-flow: row wrap;
+  justify-content: flex-start;
+  align-items: normal;
+  padding: 0.3rem;
+  margin-bottom: 0.1rem;
+  width: auto;
+}
+
+p.legende {
+   @include sx_mixins.font;
+   @include sx_mixins.border; 
+   display: flex;
+   flex-wrap: wrap;
+   max-width: fit-content;
+   min-width: 0;
+   white-space: normal;
+   overflow-wrap: break-word;
+   word-break: normal;
+   hyphens: auto;
+   gap: 1px;
+}
+
+
+/* -- Unterhalb Ergebnistabelle: Datensatzinfo  -- */
+.pagination-container {
+  display: inline-flex;
+  align-items: center;
+  justify-content: left;
+  gap: 2px; 	/* Abstand zwischen den Elementen */
+} 
+
+/* -- Fehlermeldung --*/
+p.errmsg {
+  border: medium solid red;
+  text-align: left;
+  background-color: #d7d7d7;
+}
+
+span.hidden_navi {
+  margin: 0px;
+  padding: 0px;
+  font-size: smaller;
+  display: inline;
+}
+
+// ======================
+// -- Ergebnistabellen -- 
+// ======================
+/* -- Tabelle -- */
+.level-center, .treebutton { /*für zentrierte Icons in Tabelle*/
+  display: flex;
+  justify-content: center;
+}
+
+table, 
+table.ergtabelle, 
+table.nd_ergtabelle {
+  /*min-width: 130%;*/ /* Tabellen-Breite gößer als Container-Breite, damit Scrollbalken sichtbar ist */
+  width: 100%;
+  max-width: 100%;
+  table-layout: auto;
+  white-space: normal;
+  hyphens: auto;
+  margin: 0;
+  padding: 0;
+  border-spacing: 0px; /*Abstand zwischen den Zellen*/
+  border-collapse: collapse;
+  @include sx_mixins.font;
+  font-size: 0.8rem;
+}
+
+/* -- Tabellenkopf -- */
+table th.printheader {
+  font-size: 10pt;
+  font-weight: bold;
+  text-align: center;
+  background-color: white;
+  border-top: 1px solid;
+  border-right: 1px solid;
+  border-bottom: 1px solid;
+  border-left: 0;
+}
+
+
+table th, 
+table.ergtabelle th, 
+table.nd_ergtabelle th {
+  border: sx_theme.theme(border-style);
+  border-collapse: separate;
+  background-color: sx_theme.theme(table-background-header);
+  vertical-align: top; 
+  white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+  text-align: left;
+  text-align-last:left;
+  hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/ 
+  padding: 3px 0px !important; /*Textabstand innerhalb der Zelle: oben/unten sowie rechts/links*/
+  /*padding-inline: 2px;*/
+}
+
+
+table.thead, 
+table.ergtabelle thead, 
+table.nd.ergtabelle thead, 
+table.thead th,
+table.ergtabelle thead th, 
+table.nd_ergtabelle thead th { /*wirkt auf einz. Kopfzeile*/ 
+  border: sx_theme.theme(border-style);
+  border-collapse: separate;
+  background-color: sx_theme.theme(table-background-header);
+  position: sticky; 
+  top: 50px;  /*0*/
+  z-index: 20;
+}
+
+
+/*-- fixierte Zeilen und Spalten --*/
+table th.fixed-column1-title, 	/*table th.header,*/
+table td.fixed-column1 {        /*für Spaltentitel*/ 
+   border: sx_theme.theme(border-style);
+   border-collapse: separate;
+   background-color: sx_theme.theme(table-background-header); 
+   @include sx_mixins.font; 
+   font-size: 0.8rem;
+   font-weight: bold;
+}
+
+table th.fixed-column1-title, 
+table td.fixed-column1
+table.ergtabelle th.fixed-column1-title, 
+table.ergtabelle td.fixed-column1, 
+table.nd_ergtabelle th.fixed-column1-title,
+table.nd_ergtabelle td.fixed-column1  { /*zum Fixieren des 1. Spaltentitels b. horizont. Scrollen*/
+  border: sx_theme.theme(border-style);
+  border-collapse: separate;
+  position: sticky;
+  z-index: 25;
+  left: 0em;
+  /*text-align: center;*/
+}
+
+table td.fixed-column1
+table.ergtabelle td.fixed-column1
+table.nd_ergtabelle td.fixed-column1 {
+  filter: opacity(1);
+}
+
+/* -- Tabellenzellen, allg. -- */
+//table.td,
+table.ergtabelle td, 
+table.nd_ergtabelle td {
+  border: sx_theme.theme(border-style);
+  vertical-align: bottom; /*top;
+  white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+  //text-align: left;
+  //text-align-last:left;
+  hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/ 
+  padding: 3px 0px !important; /*Textabstand innerhalb der Zelle: oben/unten sowie rechts/links*/
+ /*padding-inline: 2px;*/
+}
+
+/* -- Hierarchiezeilen -- */
+table tr.erglevel_1 {
+  background: sx_theme.theme(table-background-row-level-1); 
+  font-weight:bold;
+}
+  
+table tr.erglevel_2 {
+  background: sx_theme.theme(table-background-row-level-2); 
+}
+  
+table tr.erglevel_3 {
+  background: sx_theme.theme(table-background-row-level-3); 
+}
+  
+table tr.erglevel_4 {
+  background: sx_theme.theme(table-background-row-level-4); 
+}
+  
+table tr.erglevel_5 {
+  background: sx_theme.theme(table-background-row-level-5); 
+}
+  
+table tr.erglevel_6 {
+  background: sx_theme.theme(table-background-row-level-6); 
+}
+
+/* -- Spezielle Zeilen und Zellen -- */
+table td.string {
+  text-align: left;
+  empty-cells:show;
+}
+
+table td.boldnumber {
+  text-align: right;
+  empty-cells:show; 
+  font-weight:bold;
+}
+
+table td.decimal, 
+table td.integer,
+table td.prozent {
+  text-align: right;
+  empty-cells:show;
+}
+
+table td.lt5:before {
+  content: "< 5";
+  color:  sx_theme.theme(error-color); /*rot*/
+}
+
+table td.prozent {
+  text-align: right;
+  font-style: italic;
+  //color: #999999;
+  color: sx_theme.theme(table-color-special-value); /*default-blaugrau*/ 
+}
+
+table td.result {
+  font-size: 10pt;
+  empty-cells:show;
+}
+
+table tr.issumme {
+  font-weight: bolder;
+  //background-color: #d7d7d7; /*hellgrau*/
+  background-color: sx_theme.theme(table-background-row-sum); /*hellgrau*/ 
+}
+
+/* -- Hervorhebungen --*/
+table.ergtabelle tr:hover, table.nd_ergtabelle tr:hover, 
+table.ergtabelle tr:focus, table.nd_ergtabelle tr:focus {
+    //background-color: hsl(219, 70%, 76%); /*graublau*/
+    background-color: sx_theme.theme(table-background-row-hover); /*graublau*/
+}
+
+/* -- Tabellenzeilen ohne Hierarchie -- */
+.listRowEven { 		/*gerade Zeile*/
+  background-color: sx_theme.theme(table-background-row-even); /*weißgrau*/
+}
+
+.listRowOdd { 		/*ungerade Tabellenzeile*/
+  //background-color: #FFFFFF;
+  background-color: sx_theme.theme(table-background-row-odd); /*weiß*/
+}
+
+.listRowEvenHover, .listRowOddHover {
+  //background-color: #FFFABF;
+  background-color: sx_theme.theme(table-background-row-even-odd-hover); /*hellgelb*/
+}
+
+/* -- Teiltabelle --*/
+p.teiltabelle_titel {
+  clear: left;
+  line-height: 2em;
+  border-bottom: 2px solid black;
+  color: black;
+  display: block;
+  font-size: 2em;
+  font-weight: bolder;
+  margin: 5px 0 20px 5px;
+  padding: 0px 0px 0px 5px;
+}
+
+// ==============================================
+// --- Media-Queries für responsives Verhalten---
+// ==============================================
+
+/* -- Mobile -- */
+@media (max-width: 768px) {
+  .hero-body { 
+    margin-left: 0; 
+    margin-right: 0; 
+  }
+  .container, .input-container { /*Format-,Berichtswahl, Breadcrumb, Legende*/
+    max-width: 100%; 
+    white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto;
+  }
+  
+  table.ergtabelle,
+  table.nd_ergtabelle {
+    max-width: 70%; 
+    font-size: 0.65rem;
+  }
+  
+  table.ergtabelle th,
+  table.ergtabelle td,
+  table.nd_ergtabelle th,
+  table.nd_ergtabelle td {
+    min-width: 50px;
+    max-width: 60px;
+    white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/ 
+  }
+}
+
+/* -- Tablet -- */
+@media (min-width: 769px) and (max-width: 1023px) { /*202608 geändert auf 1023px gem. Bulma-Breakpoint*/
+  .container, .input-container { /*Format-,Berichtswahl, Breadcrumb, Legende*/
+    max-width: 100%;
+    white-space: normal; /*Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/ 
+  }
+  
+  table.ergtabelle,
+  table.nd_ergtabelle {
+    max-width: 80%; 
+    font-size: 0.7rem;
+  }
+  
+  table.ergtabelle th,
+  table.ergtabelle td,
+  table.nd_ergtabelle th,
+  table.nd_ergtabelle td {
+    max-width: 80%; 
+    white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/ 
+   }
+}
+
+/* -- Desktop -- */
+@media (min-width: 1024px) { /*202608 geändert auf 1024px gem. Bulma-Breakpoint*/
+  table.ergtabelle,
+  table.nd_ergtabelle {
+     font-size: 0.75rem; 
+  }
+}
+
+
+@media screen and (min-width: 1216px) {
+  .container:not(.is-max-desktop) {
+    max-width: 1000px;
+    }
+}
+
+/*# sourceMappingURL=sx_tabelle.css.map */
+
+
diff --git a/superx/style/scss/config/_cust_variables.scss b/superx/style/scss/config/_cust_variables.scss
new file mode 100644
index 00000000..c2d23080
--- /dev/null
+++ b/superx/style/scss/config/_cust_variables.scss
@@ -0,0 +1,176 @@
+// config/_cust_variables.scss
+// --Inhalt: Customerspezifische Variablen --
+
+@charset "utf-8";
+
+@use "sass:map";
+@use "sx_variables";
+
+
+// --- Brand colors ---
+$purple: #8a4d76;
+$pink: #fa7c91;
+$rot: #ff0000;
+$beige-light: #d0d1cd;
+$beige-lighter: #eff0eb;
+$beige: #f5f5dc;
+$antiquewhite: #faebd7;
+$snow: #fffafa;
+$weiß: #ffffff;
+
+$aliceblue: #f0f8ff;
+$azure: #f0ffff;
+$royalblue: #3333ff;
+$default-blaugrau: #ecf0f3;
+$UDE-blau: #003c7a;
+$UDE-grau: #d9d9d9;
+
+$graublau: hsl(219, 70%, 76%); 
+$dklgrau: hsl(0, 0%, 21%);
+$mittelgrau: hsl(0, 0%, 60%); /*auch mittelgrau: #999999;*/
+$hellgrau: hsl(0, 0%, 71%); /*auch hellgrau: #d7d7d7; */
+$weißgrau: #efefef;
+$weißgelb: #fffaf0;
+$hellgelb: #fffabf;
+$gelborange: hsl(48, 100%, 67%);
+$khaki: #f0e68c;
+$grün: hsl(141, 71%, 48%);
+
+
+// ================================
+// --- Customer-Werte: Lightmode ---
+// ================================
+
+$customer-light: (
+
+    // --- Body ---
+    body-background: $aliceblue,
+    hr-background-color: whitesmoke,
+
+    // --- Buttons ---
+    button-background: $aliceblue,
+    submit-button-border-color: $grün, 
+    reset-button-border-color: $gelborange, 
+    close-button-border-color: $hellgrau, 
+    
+    // --- Cards, Modals ---
+    card-background: white, 
+    modal-values-background: $default-blaugrau,
+    
+    // --- Formulare ---
+    input-background: $aliceblue,
+    input-container-background: $UDE-grau,
+    sichtentreeCaret-color: $UDE-blau, 
+    input-background-ndSchluesselfeld: $weißgelb, 
+        
+    // --- Field-dialogue ---
+    navbar-dialogue-background: $UDE-blau,
+    title-dialogue-color: white,
+
+    // --- Navigation, Breadcrumb ---
+    breadcrumbSeparator-color: black,
+    navbar-background: $aliceblue,
+    themenbaumCaret-color: black,
+
+    // --- Rahmen ---
+    border-color: $mittelgrau,
+    border-style: thin solid $mittelgrau,
+    border-radius: .3em,
+
+    // --- Schrift,  allgemein -- ---
+    font-color: black,
+    font-family: arial,
+    font-weight: normal,
+    font-size: 14px,
+    
+    // --- Tooltips, Warnungen, Fehler
+    tooltip-background: $royalblue,
+    tooltip-font-color: white,
+    error-color: $rot,
+    text-muted-color: $mittelgrau, 
+    
+    // --- Tabellen: Farben für Hierarchieebenen ---
+    table-background-header: $default-blaugrau,
+    table-background-row-level-1: $aliceblue,
+    table-background-row-level-2: $azure,
+    table-background-row-level-3: $snow,
+    table-background-row-level-4: $beige,
+    table-background-row-level-5: $antiquewhite,
+    table-background-row-level-6: $khaki,
+        
+    // --- Tabellen: Farben für einfache Tabellen---
+    table-color-special-value: $default-blaugrau, 
+    table-background-row-sum: $hellgrau, 
+    table-background-row-hover: $graublau,
+    table-background-row-odd: weiß, 	    /*ungerade Tabellenzeile*/
+    table-background-row-even: $weißgrau,   /*gerade Tabellenzeile*/
+    table-background-row-even-odd-hover: $hellgelb, 
+);
+
+// ================================
+// --- Customer-Werte: Darkmode ---
+// ================================
+
+$customer-dark: (
+
+    // --- Body ---
+    body-background: $aliceblue,
+    hr-background-color: whitesmoke,
+
+    // --- Buttons ---
+    button-background: $aliceblue,
+    submit-button-border-color: $grün, 
+    reset-button-border-color: $gelborange, 
+    close-button-border-color: $hellgrau, 
+    
+    // --- Cards ---
+    card-background: white,
+        
+    // --- Formulare ---
+    input-background: $aliceblue,
+    input-container-background: $UDE-grau,
+    sichtentreeCaret-color: $UDE-blau,
+    input-background-ndSchluesselfeld: $weißgelb, 
+        
+    // --- Field-dialogue ---
+    navbar-dialogue-background: $UDE-blau,
+    title-dialogue-color: white,
+
+    // --- Navigation, Breadcrumb ---
+    breadcrumbSeparator-color: black,
+    navbar-background: $aliceblue,
+    themenbaumCaret-color: black,
+
+    // --- Rahmen ---
+    border-color: $mittelgrau,
+    border-style: thin solid $mittelgrau,
+    border-radius: .3em,
+
+    // --- Schrift,  allgemein ---
+    font-color: black,
+        
+    // --- Tooltips, Warnungen, Fehler
+    tooltip-background: $royalblue,
+    tooltip-font-color: white,
+    error-color: $rot,
+    text-muted-color: $mittelgrau, 
+
+    // --- Tabellen: Farben für Hierarchieebenen ---
+    table-background-header: $default-blaugrau,
+    table-background-row-level-1: $aliceblue,
+    table-background-row-level-2: $azure,
+    table-background-row-level-3: $snow,
+    table-background-row-level-4: $beige,
+    table-background-row-level-5: $antiquewhite,
+    table-background-row-level-6: $khaki,
+        
+    // --- Tabellen: Farben für einfache Tabellen---
+    table-color-special-value: $default-blaugrau, 
+    table-background-row-sum: $hellgrau, 
+    table-background-row-hover: $graublau,
+    table-background-row-odd: weiß, 	    /*ungerade Tabellenzeile*/
+    table-background-row-even: $weißgrau,   /*gerade Tabellenzeile*/
+    table-background-row-even-odd-hover: $hellgelb, 
+);
+
+
diff --git a/superx/style/scss/config/_sx_mixins.scss b/superx/style/scss/config/_sx_mixins.scss
new file mode 100644
index 00000000..3327ab51
--- /dev/null
+++ b/superx/style/scss/config/_sx_mixins.scss
@@ -0,0 +1,45 @@
+// config/_sx_mixins.scss
+//--Inhalt: Definition von SuperX-Mixins--
+
+@use "../config/sx_theme";
+
+//--- Body ---
+@mixin body { 
+    display: flex;
+    flex-flow: column;
+    min-height: 100vh; 
+    margin: 0.1rem 0.1rem 0.2rem 0.1rem;
+    padding-top: 0px; 		/*202606: ergänzt d Höhe d Navbar*/
+    background: sx_theme.theme(body-background); 
+  }
+
+// --- Formulare: Eingabefelder ---
+@mixin input {
+    @include border;
+    @include font;
+    background: sx_theme.theme(input-background);
+    height: 2.5em;
+    padding: .5em 2em .5em .5em;
+  }
+  
+//--- Field-dialogue ---
+@mixin button-dialogue {
+    @include border;
+    @include font;
+    padding: 8px;
+    width: 11em; 
+  }
+
+// --- Rahmen ---
+@mixin border { 
+    border: sx_theme.theme(border-style);
+    border-radius: sx_theme.theme(border-radius)!important;
+  } 
+
+// --- Schrift ---
+@mixin font { 
+    font-family: sx_theme.theme(font-family); 
+    font-weight: sx_theme.theme(font-weight);  
+    font-size: sx_theme.theme(font-size);
+    color: sx_theme.theme(font-color);
+  }
diff --git a/superx/style/scss/config/_sx_theme.scss b/superx/style/scss/config/_sx_theme.scss
new file mode 100644
index 00000000..19a637a2
--- /dev/null
+++ b/superx/style/scss/config/_sx_theme.scss
@@ -0,0 +1,73 @@
+// config/_sx_themes.scss
+// steuert das Umschalten zwischen sx-default- und Customer-Design 
+
+@use "sass:map";
+@use "sx_variables";
+@use "cust_variables";
+
+$use-customer-theme: false;
+
+// ==================
+// -- Light-Theme --
+// ==================
+
+$light-theme: sx_variables.$defaults-light;
+
+@if $use-customer-theme {
+  $light-theme: map.merge(
+    $light-theme,
+    cust_variables.$customer-light
+  );
+}
+
+// =================
+// -- Dark-Theme --
+// =================
+
+$dark-theme: sx_variables.$defaults-dark;
+
+@if $use-customer-theme {
+  $dark-theme: map.merge(
+    $dark-theme,
+    cust_variables.$customer-dark
+  );
+}
+
+// ============================
+// -- CSS-Custom-Properties --
+// ============================
+
+@mixin css-variables($theme) {
+  @each $key, $value in $theme {
+    --sx-#{$key}: #{$value};
+  }
+}
+
+// =================
+// -- Light-Mode --
+// =================
+
+:root {
+  color-scheme: light;
+
+  @include css-variables($light-theme);
+}
+
+// =================
+// -- Dark-Mode --
+// =================
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    color-scheme: dark;
+    @include css-variables($dark-theme);
+  }
+}
+
+// ===============================
+// -- Zugriff auf Theme-Werte --
+// ===============================
+
+@function theme($key) {
+  @return var(--sx-#{$key});
+}
\ No newline at end of file
diff --git a/superx/style/scss/config/_sx_variables.scss b/superx/style/scss/config/_sx_variables.scss
new file mode 100644
index 00000000..bcf10ba5
--- /dev/null
+++ b/superx/style/scss/config/_sx_variables.scss
@@ -0,0 +1,170 @@
+// config/_sx_variables.scss
+// Inhalt: Default-Einzelvariablen für Farben, Buttons, Rahmen,
+// Typografie, Formulare, etc.
+
+@charset "utf-8";
+
+// --- Brand colors ---
+$purple: #8a4d76;
+$pink: #fa7c91;
+$rot: #ff0000;
+$beige-light: #d0d1cd;
+$beige-lighter: #eff0eb;
+$beige: #f5f5dc;
+$antiquewhite: #faebd7;
+$snow: #fffafa;
+$weiß: #ffffff;
+
+$aliceblue: #f0f8ff;
+$azure: #f0ffff;
+$royalblue: #3333ff;
+$default-blaugrau: #ecf0f3;
+$UDE-blau: #003c7a;
+$UDE-grau: #d9d9d9;
+
+$graublau: hsl(219, 70%, 76%); 
+$dklgrau: hsl(0, 0%, 21%);
+$mittelgrau: hsl(0, 0%, 60%); /*auch mittelgrau: #999999;*/
+$hellgrau: hsl(0, 0%, 71%); /*auch hellgrau: #d7d7d7; */
+$weißgrau: #efefef;
+$weißgelb: #fffaf0;
+$hellgelb: #fffabf;
+$gelborange: hsl(48, 100%, 67%);
+$khaki: #f0e68c;
+$grün: hsl(141, 71%, 48%);
+
+// ================================
+// --- Default-Werte: Lightmode ---
+// ================================
+
+$defaults-light: (
+
+    // --- Body ---
+    body-background: white,
+    hr-background-color: whitesmoke,
+
+    // --- Buttons ---
+    button-background: inherit,
+    submit-button-border-color: $grün, 
+    reset-button-border-color: $gelborange, 
+    close-button-border-color: $hellgrau, 
+
+    // --- Cards, Modals ---
+    card-background: white,
+    modal-values-background: $default-blaugrau,
+    
+    // --- Formulare ---
+    input-background: white,
+    input-background-ndSchluesselfeld: $weißgelb, 
+    input-container-background: inherit,
+    sichtentreeCaret-color: #014A7B,
+
+    // --- Field_Dialogue ---
+    navbar-dialogue-background: $default-blaugrau,
+    title-dialogue-color: $dklgrau, 
+    
+    // --- Navigation, Breadcrumb ---
+    breadcrumbSeparator-color: $dklgrau, 
+    navbar-background: $default-blaugrau,
+    themenbaumCaret-color: $dklgrau,
+   
+    // --- Rahmen ---
+    border-color: $mittelgrau, 
+    border-style: thin solid $mittelgrau, 
+    border-radius: .3em, 
+    
+    // --- Schrift ---
+    font-color: $dklgrau,
+    font-family: sans-serif,
+    font-weight: normal,
+    font-size: 13px,
+    
+    // --- Tooltips, Warnungen, Fehler
+    tooltip-background: $royalblue,
+    tooltip-font-color: white,
+    error-color: $rot,
+    text-muted-color: $mittelgrau,
+
+    // --- Tabellen: Farben für Hierarchieebenen ---
+    table-background-header: $default-blaugrau,
+    table-background-row-level-1: $aliceblue,
+    table-background-row-level-2: $azure,
+    table-background-row-level-3: $snow,
+    table-background-row-level-4: $beige,
+    table-background-row-level-5: $antiquewhite,
+    table-background-row-level-6: $khaki,
+        
+    // --- Tabellen: Farben für einfache Tabellen---
+    table-color-special-value: $default-blaugrau, 
+    table-background-row-sum: $hellgrau, 
+    table-background-row-hover: $graublau,
+    table-background-row-odd: weiß, 	    /*ungerade Tabellenzeile*/
+    table-background-row-even: $weißgrau,   /*gerade Tabellenzeile*/
+    table-background-row-even-odd-hover: $hellgelb, 
+);
+
+// ================================
+// --- Default-Werte: Darkmode ---
+// ================================
+$defaults-dark: (
+
+    // --- Body ---
+    body-background: white,
+    hr-background-color: whitesmoke,
+
+    // --- Buttons ---
+    button-background: white,
+    submit-button-border-color: $grün, 
+    reset-button-border-color: $gelborange, 
+    close-button-border-color: $hellgrau, 
+
+    // --- Cards, Modals ---
+    card-background: white, 
+    modal-values-background: $default-blaugrau,
+    
+    // --- Formulare ---
+    input-background: white,
+    input-container-background: inherit,
+    sichtentreeCaret-color: #014A7B,
+    input-background-ndSchluesselfeld: $weißgelb, 
+
+    // --- Field_Dialogue ---
+    navbar-dialogue-background: $default-blaugrau,
+    title-dialogue-color: $dklgrau, 
+    
+    // --- Navigation, Breadcrumb ---
+    breadcrumbSeparator-color: $dklgrau, 
+    navbar-background: $default-blaugrau,
+    themenbaumCaret-color: $dklgrau,
+   
+    // --- Rahmen ---
+    border-color: $mittelgrau, 
+    border-style: thin solid $mittelgrau, 
+    border-radius: .3em, 
+    
+    // --- Schrift allgemein ---
+    font-color: $dklgrau !important,
+        
+    // --- Tooltips, Warnungen, Fehler
+    tooltip-background: $royalblue,
+    tooltip-font-color: white,
+    error-color: $rot,
+    text-muted-color: $mittelgrau, 
+
+    // --- Tabellen: Farben für Hierarchieebenen ---
+    table-background-row-level-1: $aliceblue,
+    table-background-row-level-2: $azure,
+    table-background-row-level-3: $snow,
+    table-background-row-level-4: $beige,
+    table-background-row-level-5: $antiquewhite,
+    table-background-row-level-6: $khaki,
+        
+    // --- Tabellen: Farben für einfache Tabellen---
+    table-background-header: $default-blaugrau,
+    table-background-row-sum: $hellgrau, 
+    table-background-row-hover: $graublau,
+    table-background-row-odd: weiß, 	    /*ungerade Tabellenzeile*/
+    table-background-row-even: $weißgrau,   /*gerade Tabellenzeile*/
+    table-background-row-even-odd-hover: $hellgelb, 
+    table-color-special-value: $default-blaugrau, 
+);
diff --git a/superx/style/scss/sx_common.scss b/superx/style/scss/sx_common.scss
new file mode 100644
index 00000000..ce6196e0
--- /dev/null
+++ b/superx/style/scss/sx_common.scss
@@ -0,0 +1,6 @@
+@charset "utf-8";
+
+@use "config/sx_theme";
+@use "config/sx_mixins";
+@use "components/sx_common";
+
diff --git a/superx/style/scss/sx_field_dialogue.scss b/superx/style/scss/sx_field_dialogue.scss
new file mode 100644
index 00000000..6d7dc19d
--- /dev/null
+++ b/superx/style/scss/sx_field_dialogue.scss
@@ -0,0 +1,6 @@
+@charset "utf-8";
+
+@use "config/sx_theme";
+@use "config/sx_mixins";
+@use "components/sx_field_dialogue";
+
diff --git a/superx/style/scss/sx_tabelle.scss b/superx/style/scss/sx_tabelle.scss
new file mode 100644
index 00000000..491ec5c8
--- /dev/null
+++ b/superx/style/scss/sx_tabelle.scss
@@ -0,0 +1,6 @@
+@charset "utf-8";
+
+@use "config/sx_theme";
+@use "config/sx_mixins";
+@use "components/sx_tabelle";
+
diff --git a/superx/style/sx_common.css b/superx/style/sx_common.css
index a57caa89..40eaddc5 100644
--- a/superx/style/sx_common.css
+++ b/superx/style/sx_common.css
@@ -1,721 +1,1405 @@
-/*Hell-/Dunkel-Modus*/
-@media (prefers-color-scheme: dark) {
-:root { color-scheme: dark; }
-	
-body {  background-color: white; 
- 	color: black !important; }	
-	
-.card { background-color: white;
-	border: inherit; }
-	
-.field { background-color: inherit; }
-	
-.field.has-addons .control:not(:last-child) {
-  	margin-inline-end: unset; }
-
-.input, field has-addons, .select select, .button.is-rounded { 
-	background-color: white; 
-	color: hsl(0, 0%, 21%); /*dklgrau;*/ 
-	border: thin solid hsl(0, 0%, 71%); } /*hellgrau*/
-
-.card-footer-item:not(:last-child) { border: none; }
-	
-.article  { color: black; }
-
-.buttons, .button.is-outlined { border-color: white; } /*für Top-Navi-Buttoms*/ 
-
-.button { background-color: white; } /*für betr. Reset-u ok-Button*/
-
-.dropdown {
-	--bulma-dropdown-content-background-color: white !important;
-	--bulma-dropdown-item-background-color: white !important;
-	--bulma-dropdown-item-background-l: white !important; } 
-
-.report-explanation {color: hsl(0, 0%, 21%); } /*dklgrau;*/ 
-
-a.navbar-item { background-color: unset !important; }
-
-a, .themenbaumLinkName, .labelSichtorComboButton { 
-    	text-decoration: none; 
-	color: blue !important; }
-	
-.menu {--bulma-menu-item-background-l: unset !important;} /*betr. Elemente in menue, z.B. weitere Einstellungen*/
-	
-}
-
-/*Allgemeine Basics*/
-div.columns { 		/*für Abstand zum Seitenrand*/
-margin-top: 1px;
-margin-right:5%; }	/*202603 geänd. v. 5px*/
-
-body {			/*für Seiteninhalt*/
-  display: flex;
-  flex-flow: column;
-  min-height: 100vh; 
-  margin: 0.1rem; 
-} 
-  
-.hero-body { 
-  margin-left: -50px; 		/*202604: geänd. v 1.5em;*/	
-  margin-right: 1.5em; }
-
-.title, .subtitle {		/*für Seitentitel*/
-   margin-top: 0.4em;
-   padding-bottom: 0.1em;  	/* für Padding: ob re un li*/
-   white-space: normal;         /* für Zeilenumbrüche nach Standard-Regeln*/
-   word-wrap: normal;           /* veraltet: für Umbrüche nach Standard-Regeln*/
-   overflow-wrap: break-word;   /* aktuell: für Umbrüche nach Standard-Regeln*/ 
-   hyphens: auto; }	 	
-   
-.title, .subtitle, .label, .labelNormal, .labelPflicht, .subdir-button, .stb-button, .supplement, .menu-list a,
-.navbar-item, .navbar-dropdown, .bottom-nav, .button, .breadcrumb, p.legende, .dontprint, .panel-block, .panel-tabs, .resultcount {
-   color: hsl(0, 0%, 21%);	/*für Schrift in diversen Elementen*/
-   font-family: sans-serif;
-   font-weight: normal; 
-   font-size: 12px; }
-
-/*Card, Box, Article*/   
-.box, .card {		 	/*Box für Pfad, Buttonleiste bzw. Menü-Kacheln; Card für Formulare, Ergebnistabellen*/
-   box-shadow: none; }
-   
-.card, .article {		/*für Cardposition, -style*/
-   display: flex;
-   flex-flow: column;
-   margin: 1%; 	
-   white-space: normal;         /* für Zeilenumbrüche nach Standard-Regeln*/
-   word-wrap: normal;           /* veraltet: für Umbrüche nach Standard-Regeln*/
-   overflow-wrap: break-word;   /* aktuell: für Umbrüche nach Standard-Regeln*/ 
-   /* hyphens: auto; auskommentiert weil Textspalten in Tabellen sonst zu schmal werden */ 
-   text-align: left;            /* für linksbündigen und umgebrochenen Text*/
-   cursor: pointer;
-   font-size: 12px; 
-   width: 100%; } 
-   
-.card {margin-top: 0.5rem !important;}  
-
-.card-content {
-   padding-left: 1.3rem;}
-	
-.card-footer, .card-footer-item {/*für submit-buttons*/
-   display: flex;
-   flex-flow: row; 		/*für horizontale Ausrichtung*/
-   background: inherit; 
-   border: none;
-   margin-top: 1rem; }
-
-.card-footer-item:not(:last-child) { 
-   border: none; }
-
-.form-submit {
-  display: flex;
-  column-gap: 0.5rem;
-  background: inherit;
-  border: none;
-  margin-top: 1em;
-  margin-left: 22em; }
-  
-.form-submit-item {
-   display: flex;
-}
-
-/*Cell*/  
-.container {
-    display: flex; 
-    flex-wrap: wrap; 		 /*für Zeilenumbruch bei Platzmangel*/
-    justify-content: flex-start; /*Inhalte links*/
-    align-items: flex-start;     /*Inhalte vertikal ausrichten*/
-    margin-left: 0rem;
-}
-
-.cell {
-    flex: 1 1 auto; 		/*flex-grow, flex-shrink, flex-basis = ; für flexibles Verhalten der Zeile*/
-    display: flex; 		/*flexibles Wachstum ohne feste Breite */
-    padding: 0rem 0.25rem; 	/*padding oben+unten, rechts+links*/
-    margin-bottom: 0.1rem;
-    box-sizing: border-box;
-    border: thin solid hsl(0, 0%, 71%); /*hellgrau*/
-    border-radius: 0.3em; 
-}
-
-/*Modal und Breadcrumb*/   
-.modal-background { background-color: white; }
-
-.breadcrumb {
-   padding: 0.3rem;
-   border: thin solid hsl(0, 0%, 71%); /*hellgrau*/
-   border-radius: 0.3em; } 
-   
-.breadcrumb.has-path-separator li + li::before { 
-   content: " >"; 
-   color: grey; }
-   
-.breadcrumb, .breadcrumb a {
-   user-select: auto; } 		/*für Markierung des Inhalts */
-
-/*Buttonleiste, div. Buttons*/
-.buttonbar {				
-   display: flex; 			/*für resposive	Buttonleiste*/
-   flex-flow: row wrap;
-   justify-content: flex-start;
-   align-items: normal; }
-   
-.buttonbar img { 			/*für Icongröße in Buttonleiste*/
-    height: 1.5rem; 
-    width: 1.7rem; 			
-    margin: 8px 0px 0px 0px;		
-    padding: 0rem 0.1rem 0rem 0.1rem; } /*für Padding: ob re un li*/
-    
-.buttonbar_text { 
-    font-size: 10px; }
-
-.button {				/*für Button-Bezeichner-Ausrichtung*/
-   display: flex;
-   justify-content: left !important; }
-   
-.submit_button {			/* zum Abschicken, Übernehmen*/   
-   border: thin solid hsl(141, 71%, 48%); /*grün*/
-   border-radius: 0.3em; }
-   
-.reset_button {				/* zum Zurücksetzen, Leeren*/ 
-   border: thin solid hsl(48, 100%, 67%); /*gelb-orange*/
-   border-radius: 0.3em; }
-   
-.close_button {				/*zum Schließen*/ 
-   border: thin solid hsl(0, 0%, 71%);  /*hellgrau*/
-   border-radius: 0.3em; }
-   
-.menubutton, .orgunitbutton, .closebutton {  /*für Button-Style*/
-   display: flex;
-   justify-content: center;
-   background: inherit; 
-   padding: 0.4rem 0rem 0.4rem 0rem;	/*für Padding: ob re un li*/
-   border: thin solid white;
-   border-radius: 0.3em; 
-   box-shadow: rgb(0 0 0 /0.1) 0.1em 1.1px; 
-   width: 1.8rem;
-   height: 1.8rem;}
-   
-/*Top-, Bottom-Navigation*/
-.navbar { 
-   display: flex; 
-   align-items: center;	
-   flex-flow: row wrap;
-   background: #ECF0F3; }  /*Memtext-Blaugrau*/
-
-.navbar-end { 
-   display: flex; }
-
-.navbar-item {
-   margin-bottom: 0.1rem; } 
- 
-/* Box-Sizing auf Border-Box setzen */
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-}
-   
-/*Bottom-Navi*/
-#nd_navi_bottom {               
-  /*position: fixed;	/*20250602 damit gesamtes Menü sichtbar ist*/
-  bottom: 0;
-  width: 100%;}
-
-.bottom-nav {			/*für Bottomnavi-Zeile*/
-   display: flex; 
-   flex-flow: row nowrap;
-   justify-content: center; 
-   background: #ECF0F3; 	/*Memtext-Blaugrau*/
-   height: 45px; }		
-   
-.bottom-nav li {		/*für Bottomnav-Liste*/
-   display: flex; 
-   flex: 1;
-   align-items: center;
-   justify-content: space-evenly; }
-   
-.poweredby_sxbi {		
-   display: flex;
-   content: url(../images/poweredby_sxbi.svg);	
-   width: 10rem; } 
- 
-/***NaviPanel-/Themenbaum-Style***/ 
-.navpanel {
-   position: static   	/*damit NavPanel in kl. Viewport nicht am oberen BS-Rand klebt*/
-   padding: 0; }
-
-.navpanelFrame /*, .navpanelFrame_ou*/ { /*für gesamtes NavPanel*/
-   display: flex;
-   flex-flow: column;
-   list-style: none;
-   margin-top: 2em; }
-
-.navpanelFrame /*.navpanelFrame_ou*/  {	/*zum Ausblenden gesamten NavPanels*/ 
-   display: none; }
-
-/*.navpanel a  {	} /*Eigenschaften deaktiviert da überlagert mit themenbaumStatic/.Nested a und li; sh. Z480+Z486*/	/*für Nav-Elemente*/
-
-.level-center { 
-  display: flex;
-  align-items: center;
-  flex-grow: 1;
-  width: 100%;  /* Optional: vollständige Breite des Containers */
-  height: 100%; /* Optional: vollständige Höhe des Containers */
-}
-
-.panel-block {
-   display: flex; }
-
-.panel-block-search {
-   margin-left: 10px; }
-
-.menu-label { 
-   margin-left: 5.0%;
-   text-transform: unset; }  
-
-.panel-icon {
-   margin: 2%; }*/
-
-/***Auf-/Zuklappen von Themenbaum/ThemenbaumNested***/
-.themenbaumStatic li, themenbaumNested li { }/*erforderlich für initial zusammengklappten Themenbaum*/
-
-.themenbaumNested {  		/*zum Auf-/Zuklappen*/
-  display: none;
-  margin-right: 0px;
-}
-
-.themenbaumActive {
-  display: block;
-  margin-right: 0px;
-}
-
-.themenbaumStatic li.themenbaumEintrag { /*für ListElemente*/  
-  margin-left: 23px; 	
-  width: 310px; 	
-  border-bottom: 0.3px solid #ccccccff;
-  box-sizing: border-box;  	/* Beinhaltet Padding und Border in der Breitenberechnung*/
-  margin-top: 0;       		/* ohne zusätzlichen Freiraum oberhalb*/
-  margin-bottom: 0;    		/* ohne zusätzlichen Freiraum unterhalb*/
-}
-
-.themenbaumNested li.themenbaumEintrag { /*für ListElemente*/ 
-  width: 95%; 		
-  border-bottom: 0.3px dotted lightgrey;
-  box-sizing: border-box;  /* Verhindert überschüssige Breitenänderungen */
-  margin-top: 0;       /* ohne zusätzlichen Freiraum oberhalb */
-  margin-bottom: 0;    /* ohne zusätzlichen Freiraum unterhalb */
-}
-
-.panel-block-ebene1 {  /*20250704 ergänzt*/  
-  width: 310px; 	
-  border-top: 0.3px solid #ccccccff;
-  box-sizing: border-box;  /* Beinhaltet Padding und Border in der Breitenberechnung*/
-  margin-top: -20px;       	
-  margin-bottom: 0;    		
-  margin-left: 0.5em;
-}
-
-.panel-block-ebene2 { 	/*20250704 ergänzt*/ 
-  width: 95%; 		
-  border-bottom: 0.3px dotted lightgrey;
-  box-sizing: border-box;  /* Verhindert überschüssige Breitenänderungen */
-  margin-top: -20px;       
-  margin-bottom: 0; 	   
-  margin-left: 2.5em;
-}
-
-.panel-block-ebene3 { 	/*20250704 ergänzt*/ 
-   width: 80%;
-   border-bottom: 0.3px dotted lightgrey;
-   box-sizing: border-box;  /* Verhindert überschüssige Breitenänderungen */
-   margin-top: -20px;       
-   margin-bottom: 0;        
-   margin-left: 4.5em;
-}
-
-.themenbaumStatic a, .themenbaumNested a  { /*für BaumElemente*/
-  font-family: sans-serif;  
-  font-weight: normal;
-  font-size: 12px; 
-  margin-left: 5px; 
-}
-
-a.themenbaumLink:hover, a.themenbaumLink:focus { /*für Hervorhebung bei Anwahl*/
-  font-weight:normal;
-  color: black;
-  background-color: transparent;} 
-  
-.themenbaumEintrag {
-    display: block; /*Zeigt jedes Thema als Blockelement, sodass es vertikal gestapelt wird */
-}
-
-.themenbaumLink, .panel-item { /*20250704 panel-item ergänzt*/
-    display: inline-flex;   /* Flexbox sorgt dafür, dass Icons und Text korrekt ausgerichtet sind */
-    align-items: baseline;  /* Vertikale Zentrierung von Icon und Text */
-}
-
-.themenbaumLinkName {
-    white-space: normal; 	/* Erlaubt Zeilenumbruch */
-    overflow-wrap: break-word; 	/* Ermöglicht Umbruch bei langen Wörtern */
-    padding-left: 0.2em; 	/* Abstand nach links vom Icon */
-    display: block; 		/* Block, um Zeilenumbrüche zu unterstützen */
-}
-
-.themenbaumLinkWithSpace {
-  text-decoration: none; 	/*keine Unterstreichung für Links */
-  box-decoration-break: clone;
- -webkit-box-decoration-break: clone;}
-
-.themenbaumPlaceholder {
-   padding-left: 5px;}   	/*für Abstand zu linkem Rand u. Linktext*/ 
-
-.themenbaumCaret {
-  cursor: pointer;		/* Zeigt an, dass das Caret klickbar ist */
-  -webkit-user-select: none; 	/* Safari 3.1+ */
-  -moz-user-select: none; 	/* Firefox 2+ */
-  -ms-user-select: none; 	/* IE 10+ */
-  user-select: none; 
-  display: inline-block; /* Caret bleibt in der gleichen Zeile wie der Text */
-  vertical-align: text-bottom; /* Vertikale Ausrichtung des Carets mit dem Text */
-}
-
-.themenbaumCaret-down::before {
-  -ms-transform: rotate(270deg); 	/* IE 9 */
-  -webkit-transform: rotate(270deg); 	/* Safari */'
-  transform: rotate(270deg); }
-
-.themenbaumCaret::before {
-  content: ">";
-  color: grey; 
-  display: inline-block; /* Caret bleibt in der gleichen Zeile wie der Text */
-}
-
-ol.themenbaumSearchResults { 	/*für Suchergebnisse*/
-  padding-left:20px; }
-  
-/***Auf-/Zuklappen von NaviPanel-Auswertungen***/ 
-.menubutton::before {		/*für Button-Grafik*/ 
-   display: flex;
-   justify-content: center;
-   content: url(../images/burger.svg);
-   width: 1.0rem; 	
-   height: 0.8rem; }	       
-   
-.closebutton::before {		/*für Button-Grafik*/
-   display: flex;
-   justify-content: center;
-   content: url(../images/close_grey.svg);
-   width: 1.0rem; 
-   height: 0.8rem; }
-   
-.closenavpanel.closebutton::before {    /*für Buttonanzeige bei geschlossenem NavPanel*/
-   display: flex;
-   content: url(../images/burger.svg); }
-   
-/***Auf-/Zuklappen von NaviPanel-OrgUnits***/
-/*Angaben zu closebutton::before; closebutton-Style; closebutton-Grafik s.o. bei Nav-Panel-Auswertungen*/
-.orgunitbutton::before {	/*für Button-Grafik*/
-   display: flex;
-   justify-content: center;
-   content: url(../images/sitemap_blue_dark.svg); 
-   width: 1.0rem;			
-   height: 0.8; }
-
-.shownavpanel_ou + ul { /*nur relevant, wenn NavPanel beim Dialogöffnen ausgeblendet ist*/ 					
-   display: flex;	/*bitte auch Hinweis zur Code(de)aktivierung im template nd_navi_panel/nd_navi_panel_ou beachten*/	
-   flex-flow: column;
-   max-height: 600rem;
-   transition: 500ms;
-   overflow: initial; }
-   
-.shownavpanel_ou.orgunitbutton::before  { /*für Buttonanzeige bei geöffnetem NavPanel*/
-   display: flex;
-   content: url(../images/close_grey.svg); 
-   padding-right: 0.9rem;
-   width: 0.7rem;	
-   height: 0.7rem; }  
-
-.closenavpanel_ou + ul { /*darf nur AKTIV sein, wenn NavPanel beim Dialogöffnen eingeblendet sein soll*/ 
-   display: none; } 	 /*bitte auch Hinweis zur Codeaktivierung in templates nd_navi_panel/nd_navi_panel_orgunits beachten*/
-
-.closenavpanel_ou.closebutton::before  { /*für Buttonanzeige bei geschlossenem navpanel*/
-   display: flex;
-   content: url(../images/sitemap_blue_dark.svg); }
-   
-/*Selektionsfelder-Formular*/
-.selectionbox {
-   display: flex; 
-   width: 80%;
-   justify-content: left;
-   padding: 0rem; } 	
-
-.label-container, .button-label { /*für einh.responsive Feldbezeichner; vgl. dazu auch: sx_menu.css*/
-   display: flex;
-   background: inherit;	
-   min-width: 7.5rem; 		/*für kleine Viewports*/
-   width: 100%;	}		 		
- 
-.button-label button {
-    white-space: normal;        /* für Zeilenumbrüche nach Standard-Regeln*/
-    word-wrap: normal;          /* veraltet: für Umbrüche nach Standard-Regeln*/
-    overflow-wrap: break-word;  /* aktuell: für Umbrüche nach Standard-Regeln*/ 
-    line-height: 1.0;
-    padding-left: 0rem !important;
-    text-align: center; 	/*für zentrierten Text*/
-    width: 100%; }  	        
-   
-.labelSichtorComboButton, .labelPflicht, .labelNormal,.labelSichtorComboButtonPflicht {
-   white-space: normal;        /* für Zeilenumbrüche nach Standard-Regeln*/
-   word-wrap: normal;          /* veraltet: für Umbrüche nach Standard-Regeln*/
-   overflow-wrap: break-word;  /* aktuell: für Umbrüche nach Standard-Regeln*/ 
-   hyphens: auto;
-   text-align: right;          /* für rechtsbündigen und umgebrochenen Text*/
-   cursor: pointer;
-   font-size: 12px; 
-   width: 100%; } 	      
-
-.labelSichtorComboButton,.labelSichtorComboButtonPflicht {
-   color: var(--bulma-link-text); } /*#3273dc*/	/*für Linkfarbe; !important entfernt  für CD-HS*/
-
-.labelSichtorComboButtonPflicht::before,.labelPflicht::before {
-   content: "* " 
-   
-} 
-   
-.label-container-dialog { 	/*für Dialogfelder*/
-   display: flex;
-   justify-content: left;	
-   background: inherit;	
-   min-width: 10rem; }		/*für kleine Viewports*/
- 
-.labelNormal-dialog {
-   white-space: normal;        /* für Zeilenumbrüche nach Standard-Regeln*/
-   word-wrap: normal;          /* veraltet: für Umbrüche nach Standard-Regeln*/
-   overflow-wrap: break-word;  /* aktuell: für Umbrüche nach Standard-Regeln*/ 
-   text-align: left;           /* für linksbündigen und umgebrochenen Text*/
-   width: 100%; }
-
-.control-new {   		/*für einheitl. Controlbreite in Masken u. Themenbaum*/
-   min-width: 12.0rem;		/*für kleine Viewports*/
-   width: 100%;			/*für große Viewports*/
-   height: 1.6rem;}		
-
-.control-new-narrow {   	/*für einheitl. Controlbreite in Masken u. Themenbaum*/
-   min-width: 8.0rem; 		/*für kleine Viewports*/
-   width: 20%;  		/*für große Viewports*/
-   margin: 0rem 0.2rem 0.1rem 0.2rem; } /*für Margin: ob re un li*/
-   
-.field {
-   margin-left: 1%;
-   align-items: center; }	/*für horizontale Label-Ausrichtung*/
-   
-.field-body { 			/*für Feldhöhe/-abstand*/
-   height: 1.2rem }
-   
-.input, .select select, is-small.input { 
-   padding-left: 10px;
-   border-radius: 0.2em !important; }
-
-input.schluesselfeld {
-   font-size:0.9em;
-   background-color:#ffffcc;
-   color: blue;
-}
-
-input.ndSchluesselfeld {
-  border-color: hsl(var(--bulma-input-focus-h),var(--bulma-input-focus-s),var(--bulma-input-focus-l));
-  --bulma-input-border-width: 1px;
-  --bulma-input-border-l: var(--bulma-border-l);
-   box-shadow: inset 0 0.0625em 0.125em hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.05);
-   background-color:#FFFAF0;
-   font-size: var(--bulma-size-small);
-   padding-left: 5px;
-   line-height: 2;
-}
-
-.input::-moz-placeholder, .textarea::-moz-placeholder, .select select::-moz-placeholder {
-   color: darkgrey /*rgba(54, 54, 54, 0.3)*/; }
-     	
-.input:-ms-input-placeholder, .textarea:-ms-input-placeholder, .select select:-ms-input-placeholder {
-   color: darkgrey /*rgba (54, 54, 54, 0.3);*/; }
-      
-.trennung {
-  -webkit-hyphens: auto;
-  hyphens: auto; }
-  
-.required:before { content: "* ";} /*Kennz. für obligatorische Eingabefelder*/ 
-
-.field-container {
-    display: flex;
-    flex-direction: column; /* Ordnet alle Felder vertikal */
-    gap: 1px; 		/* Fügt Abstand zwischen den Feldern hinzu */
-    width: 100%; }	/* Passt sich der verfügbaren Breite an */
-
-.resizable-textarea {
-    resize: vertical; 	/* Erlaubt vertikales Vergrößern */
-    overflow: auto; 	/* Scrollt den Inhalt, wenn er zu groß wird */
-    min-height: 7em;	/* Ausgangshöhe */
-    max-height: 300px; 	/* Maximale Höhe */
-    margin-left: 12px; }
-    
-/* Tooltip-Stil und Positionen */
-.field.has-addons .control .select select, .input,
-.field.has-addons .control .button { 
-    height: 2.5em; 
-    border: thin solid hsl(0, 0%, 60%);}  /*=dkleres Grau; vormals hsl(0, 0%, 71%)=hellgrau*/
-}
-
-.field.has-addons .control:not(:last-child) {
-    margin-right: -2px; /* damit sich die Ränder optisch überlagern */
-}
-
-.button.has-tooltip-bottom { 
-  height: 2.5em; /* entspricht der Höhe des Eingabeldes*/
-}
-
-[data-tooltip]:not(.is-disabled).has-tooltip-right::before, 
-[data-tooltip]:not(.is-loading).has-tooltip-right::before, 
-[data-tooltip]:not([disabled]).has-tooltip-right::before,
-[data-tooltip]:not(.is-disabled).has-tooltip-left::before, 
-[data-tooltip]:not(.is-loading).has-tooltip-left::before, 
-[data-tooltip]:not([disabled]).has-tooltip-left::before,
-[data-tooltip]:not(.is-disabled).has-tooltip-bottom::before, 
-[data-tooltip]:not(.is-loading).has-tooltip-bottom::before, 
-[data-tooltip]:not([disabled]).has-tooltip-bottom::before {
-  display: flex;
-  margin: 0.5em;
-  position: absolute;
-  z-index: 1000;
-  padding: 1.0em;
-  background-color: royalblue /*#333*/;
-  color: white;
-  border-radius: 0.3em;
-  white-space: wrap;
-  text-align: left;  
-  width: 250px;
-  height: fit-content;
-  white-space: wrap;         	/* für Zeilenumbrüche nach Standard-Regeln*/
-  overflow-wrap: break-word;   	/* aktuell: für Umbrüche nach Standard-Regeln*/ 
-  hyphens: auto; }
-   
-/*Listen*/
-ul {
-/*margin: 0px;
-padding: 0px;*/
-list-style-type: disc;
-/*list-style-position: inside;
-list-style-image: none;
-*/ }
-
-ol {
-margin:0px;
-padding:0px;
-list-style-type: decimal;
-list-style-position:inside; }
-
-.menu-list { 
-   padding-left: 0.6rem !important;
-   list-style-type: none;
-}
-
-li.submenu_listelem {
-   list-style:none;
-   margin:10px;
-   padding:0;
-   border-bottom:thin solid silver;
-}
-
-.submenu_listelem:hover, .submenu_listelem:focus {
-  background-color: white; } 
-  
-/*Modal Cards*/
-.box-new {			/*für Kopfzeile mit Close-Button*/
-   display: flex;
-   justify-content: space-between;
-   font-weight: bold;
-}	
-
-.modalValues {
-  background-color: #ECF0F3; /*für Abschnitthintergrund, Schrift*/ 
-  font-size: 0.8em;
-}
- 
-.modalDl_title {			/*für Texthervorhebungen*/ 
-   display: flex;
-   justify-content: center;
-   background: inherit;	
-   font-size: 1.2em;
-   font-weight: 400;   
-}
- 
-span.feldname {font-weight:medium; }
-span.feldwert {font-weight:bolder; }
-
-/*Logobuttons und Icons*/
-
-img.svg_icon { height:20px; }
-
-.icon_themenbaum_admin_small{content:url(../images/logobutton_kern.svg);height:20px;width:20px;display:inline;} 
-.icon_themenbaum_admin_normal{content:url(../images/logobutton_kern.svg);height:100px;width:100px;display:inline;} 
-.icon_themenbaum_neutral_small{content:url(../images/icon_neutral_mini.svg);height:21px;width:20px;padding-top:5px;display:inline;}
-.icon_themenbaum_neutral_normal{content:url(../images/icon_neutral_mini.svg);height:70px;width:60px;padding-top:15px;display:inline;}
-.icon_themenbaum_kern_small{content:url(../images/icon_kern_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_kern_normal{content:url(../images/logobutton_kern.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_rpta_small{content:url(../images/icon_rpta_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_rpta_normal{content:url(../images/logobutton_rpta.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_zul_small{content:url(../images/icon_zul_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_zul_normal{content:url(../images/logobutton_zul.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_fin_small{content:url(../images/icon_fin_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_fin_normal{content:url(../images/logobutton_fin.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_bau_small{content:url(../images/icon_bau_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_bau_normal{content:url(../images/logobutton_bau.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_kenn_small{content:url(../images/icon_kenn_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_kenn_normal{content:url(../images/logobutton_kenn.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_sx_connect_small{content:url(../images/icon_sx_connect.png);height:20px;width:20px;display:inline;}
-.icon_themenbaum_sx_connect_normal{content:url(../images/logobutton_sx_connect.png);height:100px;width:100px;display:inline;}
-.icon_themenbaum_ivs_small{content:url(../images/icon_ivs_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_ivs_normal{content:url(../images/logobutton_ivs.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_cob_small{content:url(../images/icon_cob_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_cob_normal{content:url(../images/logobutton_cob.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_etl_small{content:url(../images/icon_etl_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_etl_normal{content:url(../images/logobutton_etl.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_leistungsmonitor_small{content:url(../images/icon_leistungsmonitor_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_leistungsmonitor_normal{content:url(../images/logobutton_leistungsmonitor.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_man_small{content:url(../images/icon_man_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_man_medium {content:url(../images/icon_man_mini.svg);height:30px;width:30px;display:inline;}
-.icon_themenbaum_man_normal{content:url(../images/logobutton_man.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_sva_small{content:url(../images/icon_sva_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_sva_normal{content:url(../images/logobutton_sva.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_prom_small{content:url(../images/icon_prom_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_prom_normal{content:url(../images/logobutton_prom.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_qa_small{content:url(../images/icon_qa_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_qa_normal{content:url(../images/logobutton_qa.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_gang_small{content:url(../images/icon_gang_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_gang_normal{content:url(../images/logobutton_gang.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_sos_small{content:url(../images/icon_sos_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_sos_normal{content:url(../images/logobutton_sos.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_erfolg_small{content:url(../images/icon_erfolg_mini.svg);height:20px;width:20px;padding-top:3px;display:inline;}
-.icon_themenbaum_erfolg_normal{content:url(../images/logobutton_erfolg.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_viz_small{content:url(../images/icon_viz_mini.svg);height:20px;width:20px;padding-top:8px;display:inline;}
-.icon_themenbaum_viz_normal{content:url(../images/logobutton_viz.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_xcube_small{content:url(../images/icon_xcube_mini.svg);height:20px;width:20px;padding-top:4px;display:inline;}
-.icon_themenbaum_xcube_medium{content:url(../images/icon_xcube_mini.svg);height:30px;width:30px;display:inline;}
-.icon_themenbaum_xcube_normal{content:url(../images/logobutton_xcube.svg);height:100px;width:100px;display:inline;}
-.icon_themenbaum_datenblatt_normal {content: url(../images/th.svg);height:25px;width:25px;display:inline-block;} 
-.icon_themenbaum_datenblatt_small {content: url(../images/th.png);height:20px;width:20px;display:inline-block;}
-.icon_themenbaum_zeitreihe_normal {content: url(../images/chart-line.svg);height:25px;width:25px;display:inline-block;}  	 
-.icon_themenbaum_zeitreihe_small {content: url(../images/chart-line.png);height:20px;width:20px;display:inline-block;} 	 
-.icon_themenbaum_list_normal {content: url(../images/list.svg);height:25px;width:25px;display:inline-block;}          
-.icon_themenbaum_list_small {content: url(../images/list.png);height:20px;width:20px;display:inline-block;}  
-/*neu ab 05.2026*/
-.icon_themenbaum_co_stage_small{content:url(../images/icon_co_stage_mini.svg);height:20px;width:20px;padding-top:3px;display:inline-block;}
-.icon_themenbaum_co_stage_normal{content:url(../images/logobutton_co_stage.svg);height:100px;width:100px;display:inline-block;}
-.icon_themenbaum_gx_stage_small{content:url(../images/icon_gx_stage_mini.svg);height:20px;width:20px;padding-top:3px;display:inline-block;}
-.icon_themenbaum_gx_stage_normal{content:url(../images/logobutton_gx_stage.svg);height:100px;width:100px;display:inline-block;}
-.icon_themenbaum_hr_stage_small{content:url(../images/icon_hr_stage_mini.svg);height:20px;width:20px;padding-top:3px;display:inline-block;}
-.icon_themenbaum_hr_stage_normal{content:url(../images/logobutton_hr_stage.svg);height:100px;width:100px;display:inline-block;}
-.icon_themenbaum_nutzungsantrag_small{content:url(../images/icon_nutzungsantrag.svg);height:20px;width:20px;padding-top:3px;display:inline-block;}
-.icon_themenbaum_nutzungsantrag_normal{content:url(../images/logobutton_nutzungsantrag.svg);height:100px;width:100px;display:inline-block;}
-
-
-
+@charset "UTF-8";
+/*auch mittelgrau: #999999;*/
+/*auch hellgrau: #d7d7d7; */
+/*auch mittelgrau: #999999;*/
+/*auch hellgrau: #d7d7d7; */
+:root {
+  color-scheme: light;
+  --sx-body-background: white;
+  --sx-hr-background-color: whitesmoke;
+  --sx-button-background: inherit;
+  --sx-submit-button-border-color: hsl(141, 71%, 48%);
+  --sx-reset-button-border-color: hsl(48, 100%, 67%);
+  --sx-close-button-border-color: hsl(0, 0%, 71%);
+  --sx-card-background: white;
+  --sx-modal-values-background: #ecf0f3;
+  --sx-input-background: white;
+  --sx-input-background-ndSchluesselfeld: #fffaf0;
+  --sx-input-container-background: inherit;
+  --sx-sichtentreeCaret-color: #014A7B;
+  --sx-navbar-dialogue-background: #ecf0f3;
+  --sx-title-dialogue-color: hsl(0, 0%, 21%);
+  --sx-breadcrumbSeparator-color: hsl(0, 0%, 21%);
+  --sx-navbar-background: #ecf0f3;
+  --sx-themenbaumCaret-color: hsl(0, 0%, 21%);
+  --sx-border-color: hsl(0, 0%, 60%);
+  --sx-border-style: thin solid hsl(0, 0%, 60%);
+  --sx-border-radius: 0.3em;
+  --sx-font-color: hsl(0, 0%, 21%);
+  --sx-font-family: sans-serif;
+  --sx-font-weight: normal;
+  --sx-font-size: 13px;
+  --sx-tooltip-background: #3333ff;
+  --sx-tooltip-font-color: white;
+  --sx-error-color: #ff0000;
+  --sx-text-muted-color: hsl(0, 0%, 60%);
+  --sx-table-background-header: #ecf0f3;
+  --sx-table-background-row-level-1: #f0f8ff;
+  --sx-table-background-row-level-2: #f0ffff;
+  --sx-table-background-row-level-3: #fffafa;
+  --sx-table-background-row-level-4: #f5f5dc;
+  --sx-table-background-row-level-5: #faebd7;
+  --sx-table-background-row-level-6: #f0e68c;
+  --sx-table-color-special-value: #ecf0f3;
+  --sx-table-background-row-sum: hsl(0, 0%, 71%);
+  --sx-table-background-row-hover: hsl(219, 70%, 76%);
+  --sx-table-background-row-odd: weiß;
+  --sx-table-background-row-even: #efefef;
+  --sx-table-background-row-even-odd-hover: #fffabf;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    color-scheme: dark;
+    --sx-body-background: white;
+    --sx-hr-background-color: whitesmoke;
+    --sx-button-background: white;
+    --sx-submit-button-border-color: hsl(141, 71%, 48%);
+    --sx-reset-button-border-color: hsl(48, 100%, 67%);
+    --sx-close-button-border-color: hsl(0, 0%, 71%);
+    --sx-card-background: white;
+    --sx-modal-values-background: #ecf0f3;
+    --sx-input-background: white;
+    --sx-input-container-background: inherit;
+    --sx-sichtentreeCaret-color: #014A7B;
+    --sx-input-background-ndSchluesselfeld: #fffaf0;
+    --sx-navbar-dialogue-background: #ecf0f3;
+    --sx-title-dialogue-color: hsl(0, 0%, 21%);
+    --sx-breadcrumbSeparator-color: hsl(0, 0%, 21%);
+    --sx-navbar-background: #ecf0f3;
+    --sx-themenbaumCaret-color: hsl(0, 0%, 21%);
+    --sx-border-color: hsl(0, 0%, 60%);
+    --sx-border-style: thin solid hsl(0, 0%, 60%);
+    --sx-border-radius: 0.3em;
+    --sx-font-color: hsl(0, 0%, 21%) !important;
+    --sx-tooltip-background: #3333ff;
+    --sx-tooltip-font-color: white;
+    --sx-error-color: #ff0000;
+    --sx-text-muted-color: hsl(0, 0%, 60%);
+    --sx-table-background-row-level-1: #f0f8ff;
+    --sx-table-background-row-level-2: #f0ffff;
+    --sx-table-background-row-level-3: #fffafa;
+    --sx-table-background-row-level-4: #f5f5dc;
+    --sx-table-background-row-level-5: #faebd7;
+    --sx-table-background-row-level-6: #f0e68c;
+    --sx-table-background-header: #ecf0f3;
+    --sx-table-background-row-sum: hsl(0, 0%, 71%);
+    --sx-table-background-row-hover: hsl(219, 70%, 76%);
+    --sx-table-background-row-odd: weiß;
+    --sx-table-background-row-even: #efefef;
+    --sx-table-background-row-even-odd-hover: #fffabf;
+    --sx-table-color-special-value: #ecf0f3;
+  }
+}
+/* -- Bildschirmseite -- */
+body {
+  display: flex;
+  flex-flow: column;
+  min-height: 100vh;
+  margin: 0.1rem 0.1rem 0.2rem 0.1rem;
+  padding-top: 0px; /*202606: ergänzt d Höhe d Navbar*/
+  background: var(--sx-body-background);
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+}
+
+div.columns { /*für Abstand zum Seitenrand*/
+  margin-top: 1px;
+  margin-right: 5%;
+}
+
+.hero-body {
+  margin-left: 0;
+  margin-right: 1.5em;
+}
+
+/* -- Tennlinie -- */
+hr {
+  background-color: var(--sx-hr-background-color);
+  margin-top: -1rem;
+  margin-bottom: 0.5rem;
+}
+
+/* -- Silbentrennung --*/
+.trennung {
+  -webkit-hyphens: auto; /* Safari 3.1+ */
+  -moz-hyphens: auto; /* Firefox 2+ */
+  -ms-hyphens: auto; /* IE 10+ */
+  hyphens: auto;
+}
+
+/* --Box-Sizing = Border-Box -- */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+.button, button.button, span.button, .subdir-button, .stb-button {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  background-color: var(--sx-button-background);
+}
+
+.button { /*für Button-Bezeichner-Ausrichtung*/
+  display: flex;
+  justify-content: left !important;
+}
+
+.button.is-rounded {
+  border-color: var(--sx-border-color);
+  background-color: var(--sx-button-background);
+}
+
+.submit_button { /* zum Abschicken, Übernehmen*/
+  background-color: var(--sx-button-background);
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  border-color: var(--sx-submit-button-border-color); /*grün*/
+}
+
+.reset_button { /* zum Zurücksetzen, Leeren*/
+  background-color: var(--sx-button-background);
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  border-color: var(--sx-reset-button-border-color);
+}
+
+.close_button { /*zum Schließen*/
+  background-color: var(--sx-button-background);
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  border-color: var(--sx-reset-button-border-color); /*hellgrau*/
+}
+
+.menubutton, .orgunitbutton, .closebutton { /*für Button-Style*/
+  display: flex;
+  justify-content: center;
+  background: inherit;
+  padding: 0.4rem 0rem 0.4rem 0rem; /*für Padding: ob re un li*/
+  box-shadow: rgba(0, 0, 0, 0.1) 0.1em 1.1px;
+  width: 1.8rem;
+  height: 1.8rem;
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  border-color: white;
+}
+
+.buttonbar {
+  display: flex; /*für resposive Buttonleiste*/
+  flex-flow: row wrap;
+  justify-content: flex-start;
+  align-items: normal;
+}
+
+.buttonbar img { /*für Icongröße in Buttonleiste*/
+  height: 1.5rem;
+  width: 1.7rem;
+  margin: 8px 0px 0px 0px;
+  padding: 0rem 0.1rem 0rem 0.1rem; /*für Padding: ob re un li*/
+}
+
+.buttonbar_text {
+  font-size: 10px;
+}
+
+.select select, .input, .field.has-addons .control .button {
+  height: 2.5em;
+}
+
+.field.has-addons .control:not(:last-child) {
+  margin-right: -2px; /* damit sich die Ränder optisch überlagern */
+}
+
+.button.has-tooltip-bottom {
+  height: 2rem; /* entspricht der Höhe des Eingabeldes*/
+}
+
+[data-tooltip]:not(.is-disabled).has-tooltip-bottom::before,
+[data-tooltip]:not(.is-loading).has-tooltip-bottom::before,
+[data-tooltip]:not([disabled]).has-tooltip-bottom::before {
+  display: flex;
+  position: absolute;
+  z-index: 3000;
+  margin: 0.5em;
+  padding: 1em;
+  background-color: var(--sx-tooltip-background);
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  color: var(--sx-tooltip-font-color);
+  text-align: left;
+  max-width: 250px;
+  height: fit-content;
+  overflow-wrap: break-word !important;
+  word-break: normal !important;
+  white-space: normal !important;
+  hyphens: auto;
+}
+
+/* -- Label --*/
+.required:before {
+  content: "* "; /*Kennz. für obligatorische Eingabefelder*/
+}
+
+.label, .labelNormal, .labelPflicht,
+.label.is-small {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+}
+
+.labelSichtorComboButton, .labelPflicht, .labelNormal, .labelSichtorComboButtonPflicht {
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+  text-align: right; /* für rechtsbündigen und umgebrochenen Text*/
+  cursor: pointer;
+  width: 100%;
+}
+
+.labelSichtorComboButton, .labelSichtorComboButtonPflicht {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  color: var(--bulma-link-text); /*Linkfarbe*/
+}
+
+.labelSichtorComboButtonPflicht::before, .labelPflicht::before {
+  content: "* ";
+}
+
+.label-container, .button-label { /*für einh.responsive Feldbezeichner; vgl. dazu auch: sx_menu.css*/
+  display: flex;
+  background: inherit;
+  min-width: 7.5rem; /*für kleine Viewports*/
+  width: 100%;
+}
+
+.button-label button {
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  line-height: 1;
+  padding-left: 0rem !important;
+  text-align: center; /*für zentrierten Text*/
+  width: 100%;
+}
+
+.label-container-dialog { /*für Dialogfelder*/
+  display: flex;
+  justify-content: left;
+  background: inherit;
+  min-width: 10rem; /*für kleine Viewports*/
+}
+
+.labelNormal-dialog {
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  text-align: left; /* für linksbündigen und umgebrochenen Text*/
+  width: 100%;
+}
+
+/* -- Selektionsfelder -- */
+.form-submit {
+  display: flex;
+  column-gap: 0.5rem;
+  background: inherit;
+  border: none;
+  margin-top: 1em;
+  margin-left: 22em;
+}
+
+.form-submit-item {
+  display: flex;
+}
+
+.selectionbox {
+  display: flex;
+  width: 80%;
+  justify-content: left;
+  padding: 0rem;
+}
+
+.control-new { /*für einheitl. Controlbreite in Masken u. Themenbaum*/
+  min-width: 12rem; /*für kleine Viewports*/
+  width: 100%; /*für große Viewports*/
+  height: 1.6rem;
+}
+
+.control-new-narrow { /*für einheitl. Controlbreite in Masken u. Themenbaum*/
+  min-width: 8rem; /*für kleine Viewports*/
+  width: 20%; /*für große Viewports*/
+  margin: 0rem 0.2rem 0.1rem 0.2rem; /*für Margin: ob re un li*/
+}
+
+.field-container {
+  display: flex;
+  flex-direction: column; /* Ordnet alle Felder vertikal */
+  gap: 1px; /* Abstand zwischen den Feldern */
+  width: 100%; /* Passt sich verfügbarer Breite an */
+}
+
+.field {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  margin-left: 1%;
+  align-items: center; /*für horizontale Label-Ausrichtung*/
+}
+
+.field-body { /*für Feldhöhe/-abstand*/
+  height: 1.2rem;
+}
+
+/* -- Input --*/
+.input, .textarea, .select select {
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  background: var(--sx-input-background);
+  height: 2.5em;
+  padding: 0.5em 2em 0.5em 0.5em;
+}
+
+.input.is-small, .select.is-small {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+}
+
+input.schluesselfeld {
+  background-color: #ffffcc;
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  font-size: 0.9em;
+  color: blue;
+}
+
+input.ndSchluesselfeld {
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  background: var(--sx-input-background);
+  height: 2.5em;
+  padding: 0.5em 2em 0.5em 0.5em;
+  border: var(--sx-border-style);
+  /*border-color: hsl(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l));
+  --bulma-input-border-width: 1px;
+  --bulma-input-border-l: var(--bulma-border-l);
+  /*box-shadow: inset 0 0.0625em 0.125em hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.05);*/
+  background-color: var(--sx-input-background-ndSchluesselfeld); /*weißgelb*/
+  /*font-size: var(--bulma-size-small);*/
+  padding-left: 5px;
+  line-height: 2;
+}
+
+/* -- Platzhalter, Textarea -- */
+.placeholder, .input::placeholder, .textarea::placeholder, .select select::placeholder,
+.input::-moz-placeholder, .textarea::-moz-placeholder, .select select::-moz-placeholder,
+.input:-ms-input-placeholder, .textarea:-ms-input-placeholder, .select select:-ms-input-placeholder {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  color: var(--sx-mittelgrau);
+}
+
+.resizable-textarea {
+  resize: vertical; /* Erlaubt vertikales Vergrößern */
+  overflow: auto; /* Scrollt den Inhalt, wenn er zu groß wird */
+  min-height: 7em; /* Ausgangshöhe */
+  max-height: 300px; /* Maximale Höhe */
+  margin-left: 12px;
+}
+
+/* Top-Navi */
+.navbar, .bottom-nav {
+  background: var(--sx-navbar-background);
+}
+
+.navbar {
+  display: flex;
+  align-items: center;
+  flex-flow: row wrap;
+}
+
+.navbar-end {
+  display: flex;
+}
+
+.navbar-item {
+  margin-bottom: 0.1rem;
+}
+
+/* Bottom-Navi */
+#nd_navi_bottom {
+  /*position: fixed;	/*20250602 damit gesamtes Menü sichtbar ist*/
+  bottom: 0;
+  width: 100%;
+}
+
+.bottom-nav { /*für Bottomnavi-Zeile*/
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  height: 45px;
+}
+
+.bottom-nav li { /*für Bottomnav-Liste*/
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: space-evenly;
+}
+
+.poweredby_sxbi {
+  display: flex;
+  content: url(../images/poweredby_sxbi.svg);
+  width: 10rem;
+}
+
+/* -- NavPanel -- */
+.panel-block, .panel-tabs,
+.navbar-item, .navbar-dropdown, .bottom-nav {
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  border-color: transparent;
+}
+
+.menu-label {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  background: inherit;
+}
+
+.menu-list a {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  background: var(--sx-input-background);
+}
+
+a:hover, a:focus { /*für Hervorhebung bei Anwahl*/
+  color: var(--sx-font-color);
+  background-color: white; /*transparent;*/
+}
+
+.navpanel {
+  position: static; /*damit NavPanel in kl. Viewport nicht am oberen BS-Rand klebt*/
+  padding: 0;
+}
+
+.navpanelFrame { /*für gesamtes NavPanel*/
+  display: flex;
+  flex-flow: column;
+  list-style: none;
+  margin-top: 0.5rem;
+}
+
+.navpanelFrame { /*zum Ausblenden gesamten NavPanels*/
+  display: none;
+}
+
+/*.navpanel a  {	} /*Eigenschaften deaktiviert da überlagert mit themenbaumStatic/.Nested a und li; sh. Z480+Z486*/ /*für Nav-Elemente*/
+.level-center {
+  display: flex;
+  align-items: center;
+  flex-grow: 1;
+  width: 100%; /* Optional: vollständige Breite des Containers */
+  height: 100%; /* Optional: vollständige Höhe des Containers */
+}
+
+.panel-block {
+  display: flex;
+}
+
+.panel-block-search {
+  margin-left: 10px;
+}
+
+.menu-label {
+  margin-left: 5%;
+  text-transform: unset;
+}
+
+.panel-icon {
+  margin: 2%;
+}
+
+/* -- Auf-/Zuklappen von NaviPanel-Auswertungen -- */
+.menubutton::before { /*für Button-Grafik*/
+  display: flex;
+  justify-content: center;
+  content: url(../images/burger.svg);
+  width: 1rem;
+  height: 0.8rem;
+}
+
+.closebutton::before { /*für Button-Grafik*/
+  display: flex;
+  justify-content: center;
+  content: url(../images/close_grey.svg);
+  width: 1rem;
+  height: 0.8rem;
+}
+
+.closenavpanel.closebutton::before { /*für Buttonanzeige bei geschlossenem NavPanel*/
+  display: flex;
+  content: url(../images/burger.svg);
+}
+
+/* -- Auf-/Zuklappen von NaviPanel-OrgUnits -- */
+/* Angaben zu closebutton::before; closebutton-Style; closebutton-Grafik s.o. bei Nav-Panel-Auswertungen*/
+.orgunitbutton::before { /*für Button-Grafik*/
+  display: flex;
+  justify-content: center;
+  content: url(../images/sitemap_blue_dark.svg);
+  width: 1rem;
+  height: 0.8;
+}
+
+.shownavpanel_ou + ul { /*nur relevant, wenn NavPanel beim Dialogöffnen ausgeblendet ist*/
+  display: flex; /*bitte auch Hinweis zur Code(de)aktivierung im template nd_navi_panel/nd_navi_panel_ou beachten*/
+  flex-flow: column;
+  max-height: 600rem;
+  transition: 500ms;
+  overflow: initial;
+}
+
+.shownavpanel_ou.orgunitbutton::before { /*für Buttonanzeige bei geöffnetem NavPanel*/
+  display: flex;
+  content: url(../images/close_grey.svg);
+  padding-right: 0.9rem;
+  width: 0.7rem;
+  height: 0.7rem;
+}
+
+.closenavpanel_ou + ul { /*darf nur AKTIV sein, wenn NavPanel beim Dialogöffnen eingeblendet sein soll*/
+  display: none; /*bitte auch Hinweis zur Codeaktivierung in templates nd_navi_panel/nd_navi_panel_orgunits beachten*/
+}
+
+.closenavpanel_ou.closebutton::before { /*für Buttonanzeige bei geschlossenem navpanel*/
+  display: flex;
+  content: url(../images/sitemap_blue_dark.svg);
+}
+
+/* -- Auf-/Zuklappen von Themenbaum/ThemenbaumNested -- */
+.themenbaumNested { /*zum Auf-/Zuklappen*/
+  display: none; /*erforderlich für initial zusammengklappten Themenbaum*/
+  margin-right: 0px;
+}
+
+.themenbaumActive {
+  display: block;
+  margin-right: 0px;
+}
+
+.themenbaumStatic li.themenbaumEintrag { /*für ListElemente*/
+  margin-left: 23px;
+  width: 310px;
+  box-sizing: border-box; /* Beinhaltet Padding und Border in der Breitenberechnung*/
+  margin-top: 0; /* ohne zusätzlichen Freiraum oberhalb*/
+  margin-bottom: 0; /* ohne zusätzlichen Freiraum unterhalb*/
+}
+
+.themenbaumStatic li.themenbaumEintrag:not(:last-child) { /*für ListElemente*/
+  border-bottom: 0.1px solid var(--sx-border-color); /*#cccccc;*/
+}
+
+.themenbaumNested li.themenbaumEintrag:not(:last-child) { /*für ListElemente*/
+  width: 95%;
+  box-sizing: border-box; /* Verhindert überschüssige Breitenänderungen */
+  margin-top: 0; /* ohne zusätzlichen Freiraum oberhalb */
+  margin-bottom: 0; /* ohne zusätzlichen Freiraum unterhalb */
+  border-bottom: 0.3px dotted var(--sx-border-color);
+}
+
+.themenbaumStatic a, .themenbaumNested a { /*für BaumElemente*/
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  color: blue; /*var(--bulma-link-text);*/
+  margin-left: 5px;
+}
+
+.themenbaumEintrag {
+  display: block; /*Zeigt jedes Thema als Blockelement, sodass es vertikal gestapelt wird */
+}
+
+.themenbaumLink, .panel-item { /*20250704 panel-item ergänzt*/
+  display: inline-flex; /* Flexbox sorgt dafür, dass Icons und Text korrekt ausgerichtet sind */
+  align-items: baseline; /* Vertikale Zentrierung von Icon und Text */
+}
+
+.themenbaumLinkName {
+  white-space: normal; /* Erlaubt Zeilenumbruch */
+  overflow-wrap: break-word; /* Ermöglicht Umbruch bei langen Wörtern */
+  padding-left: 0.2em; /* Abstand nach links vom Icon */
+  display: block; /* Block, um Zeilenumbrüche zu unterstützen */
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  color: blue;
+}
+
+.themenbaumLinkWithSpace {
+  text-decoration: none; /*keine Unterstreichung für Links */
+  box-decoration-break: clone;
+  -webkit-box-decoration-break: clone;
+}
+
+.themenbaumPlaceholder {
+  padding-left: 5px; /*für Abstand zu linkem Rand u. Linktext*/
+}
+
+.themenbaumCaret {
+  cursor: pointer; /* Zeigt an, dass das Caret klickbar ist */
+  -webkit-user-select: none; /* Safari 3.1+ */
+  -moz-user-select: none; /* Firefox 2+ */
+  -ms-user-select: none; /* IE 10+ */
+  user-select: none;
+  display: inline-block; /* Caret bleibt in der gleichen Zeile wie der Text */
+  vertical-align: text-bottom; /* Vertikale Ausrichtung des Carets mit dem Text */
+}
+
+.themenbaumCaret-down::before {
+  -ms-transform: rotate(270deg); /* IE 9 */
+  -webkit-transform: rotate(270deg); /* Safari */
+  transform: rotate(270deg);
+}
+
+.themenbaumCaret::before {
+  content: ">";
+  color: var(--sx-themenbaumCaret-color);
+  display: inline-block; /* Caret bleibt in der gleichen Zeile wie der Text */
+}
+
+ol.themenbaumSearchResults { /*für Suchergebnisse*/
+  padding-left: 20px;
+}
+
+.breadcrumb {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  padding: 0.2rem;
+  white-space: normal;
+  min-width: 0;
+  max-width: 100%;
+}
+
+.breadcrumb ul {
+  display: flex;
+  flex-wrap: wrap;
+  max-width: 100%;
+  align-items: center !important; /*für Höhenausrichtung*/
+}
+
+.breadcrumb li {
+  min-width: 0;
+  white-space: normal;
+  overflow-wrap: break-word;
+  word-break: normal;
+  hyphens: auto;
+}
+
+.breadcrumb.has-path-separator li + li::before {
+  content: " > ";
+  color: var(--sx-breadcrumbSeparator-color);
+}
+
+.breadcrumb, .breadcrumb a {
+  user-select: auto; /*für Markierung des Inhalts */
+}
+
+.article, .article ul, .card, .cell, .grid {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+}
+
+/* -- Article -- */
+.article { /*Position, -style*/
+  display: flex;
+  flex-flow: column;
+  /*margin: 1%; 20261005 deaktiviert*/
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+  text-align: left; /* für linksbündigen und umgebrochenen Text*/
+  cursor: pointer;
+  width: 100%;
+}
+
+/* -- Container, Cell -- */
+.container {
+  display: flex;
+  flex-wrap: wrap; /*für Zeilenumbruch bei Platzmangel*/
+  justify-content: flex-start; /*Inhalte links*/
+  align-items: flex-start; /*Inhalte vertikal ausrichten*/
+  margin-left: 0rem;
+}
+
+.cell {
+  flex: 1 1 auto; /*flex-grow, flex-shrink, flex-basis = ; für flexibles Verhalten der Zeile*/
+  display: flex; /*flexibles Wachstum ohne feste Breite */
+  padding: 0rem 0.25rem; /*padding oben+unten, rechts+links*/
+  margin-bottom: 0.1rem;
+  box-sizing: border-box;
+  border: thin solid hsl(0, 0%, 60%); /*hellgrau*/
+  border-radius: 0.3em;
+}
+
+/* -- Card, Box -- */
+.box, .card { /*Box für Pfad, Buttonleiste bzw. Menü-Kacheln; Card für Formulare, Ergebnistabellen*/
+  box-shadow: none;
+  background-color: var(--sx-card-background);
+}
+
+.card { /*Position, -style*/
+  display: flex;
+  flex-flow: column;
+  /*margin: 1%; 20261005 deaktiviert*/
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+  text-align: left; /* für linksbündigen und umgebrochenen Text*/
+  cursor: pointer;
+  margin-top: 0.45rem !important;
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  border-color: white;
+}
+
+.card-content {
+  padding-left: 1.3rem;
+  padding-top: 0;
+}
+
+.card-footer, .card-footer-item { /*für submit-buttons*/
+  display: flex;
+  flex-flow: row; /*für horizontale Ausrichtung*/
+  background: var(--sx-card-footer-background);
+  border: none;
+  margin-top: 1rem;
+}
+
+.card-footer-item:not(:last-child) {
+  border: none;
+}
+
+/* -- Modal-Cards -- */
+.box-new { /*für Kopfzeile mit Close-Button*/
+  display: flex;
+  justify-content: space-between;
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  font-weight: bold;
+}
+
+.modal-background {
+  background-color: var(--sx-card-background);
+}
+
+.modalValues {
+  background-color: var(--sx-modal-values-background); /*für Abschnitthintergrund, Schrift*/
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  font-size: 0.8em;
+  padding: 1rem;
+}
+
+.modalDl_title { /*für Texthervorhebungen*/
+  display: flex;
+  justify-content: center;
+  background: inherit;
+  font-size: 1.2em;
+  font-weight: 400;
+}
+
+span.feldname {
+  font-weight: medium;
+}
+
+span.feldwert {
+  font-weight: bolder;
+}
+
+.title, .subtitle, .supplement, span.report-explanation, dropdown, .resultcount, .searchresult,
+.dontprint, .panel-block, .panel-tabs {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+}
+
+.title, .subtitle { /*für Seitentitel*/
+  margin-top: 0.4em;
+  padding-bottom: 0.1em; /* für Padding: ob re un li*/
+  white-space: normal; /* für Zeilenumbrüche nach Standard-Regeln*/
+  word-wrap: normal; /* veraltet: für Umbrüche nach Standard-Regeln*/
+  overflow-wrap: break-word; /* aktuell: für Umbrüche nach Standard-Regeln*/
+  hyphens: auto;
+}
+
+ul {
+  list-style-type: disc;
+}
+
+ol {
+  margin: 0px;
+  padding: 0px;
+  list-style-type: decimal;
+  list-style-position: inside;
+}
+
+.menu-list {
+  padding-left: 0.6rem !important;
+  list-style-type: none;
+}
+
+li.submenu_listelem {
+  list-style: none;
+  margin: 10px;
+  padding: 0;
+  border-bottom: thin solid silver;
+}
+
+.submenu_listelem:hover, .submenu_listelem:focus {
+  background-color: white;
+}
+
+/* -- allgemein -- */
+img.svg_icon {
+  height: 20px;
+}
+
+.icon_themenbaum_neutral_small {
+  content: url(../images/icon_neutral_mini.svg);
+  height: 21px;
+  width: 20px;
+  padding-top: 5px;
+  display: inline;
+}
+
+.icon_themenbaum_neutral_normal {
+  content: url(../images/icon_neutral_mini.svg);
+  height: 70px;
+  width: 60px;
+  padding-top: 15px;
+  display: inline;
+}
+
+/* -- Logobuttons und Icons für Auswertungstypen -- */
+.icon_themenbaum_datenblatt_normal {
+  content: url(../images/th.svg);
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+}
+
+.icon_themenbaum_datenblatt_small {
+  content: url(../images/th.png);
+  height: 20px;
+  width: 20px;
+  display: inline-block;
+}
+
+.icon_themenbaum_zeitreihe_normal {
+  content: url(../images/chart-line.svg);
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+}
+
+.icon_themenbaum_zeitreihe_small {
+  content: url(../images/chart-line.png);
+  height: 20px;
+  width: 20px;
+  display: inline-block;
+}
+
+/* -- Logobuttons und Icons für Module a bis e -- */
+.icon_themenbaum_admin_small {
+  content: url(../images/logobutton_kern.svg);
+  height: 20px;
+  width: 20px;
+  display: inline;
+}
+
+.icon_themenbaum_admin_normal {
+  content: url(../images/logobutton_kern.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_bau_small {
+  content: url(../images/icon_bau_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_bau_normal {
+  content: url(../images/logobutton_bau.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_cob_small {
+  content: url(../images/icon_cob_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_cob_normal {
+  content: url(../images/logobutton_cob.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_co_stage_small {
+  content: url(../images/icon_co_stage_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_co_stage_normal {
+  content: url(../images/logobutton_co_stage.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_erfolg_small {
+  content: url(../images/icon_erfolg_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_erfolg_normal {
+  content: url(../images/logobutton_erfolg.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_etl_small {
+  content: url(../images/icon_etl_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_etl_normal {
+  content: url(../images/logobutton_etl.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+/* -- Logobuttons und Icons für Module f bis m -- */
+.icon_themenbaum_fin_small {
+  content: url(../images/icon_fin_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_fin_normal {
+  content: url(../images/logobutton_fin.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_gang_small {
+  content: url(../images/icon_gang_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_gang_normal {
+  content: url(../images/logobutton_gang.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_gx_stage_small {
+  content: url(../images/icon_gx_stage_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_gx_stage_normal {
+  content: url(../images/logobutton_gx_stage.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_hr_stage_small {
+  content: url(../images/icon_hr_stage_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_hr_stage_normal {
+  content: url(../images/logobutton_hr_stage.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_ivs_small {
+  content: url(../images/icon_ivs_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_ivs_normal {
+  content: url(../images/logobutton_ivs.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_kenn_small {
+  content: url(../images/icon_kenn_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_kenn_normal {
+  content: url(../images/logobutton_kenn.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_small {
+  content: url(../images/icon_kern_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_normal {
+  content: url(../images/logobutton_kern.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_face_small {
+  content: url(../images/icon_kern_face_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_kern_face_normal {
+  content: url(../images/logobutton_kern_face.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_leistungsmonitor_small {
+  content: url(../images/icon_leistungsmonitor_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_leistungsmonitor_normal {
+  content: url(../images/logobutton_leistungsmonitor.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_list_normal {
+  content: url(../images/list.svg);
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+}
+
+.icon_themenbaum_list_small {
+  content: url(../images/list.png);
+  height: 20px;
+  width: 20px;
+  display: inline-block;
+}
+
+.icon_themenbaum_JR_BerDesign_small {
+  content: url(../images/icon_JR_BerDesign_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_JR_BerDesign_normal {
+  content: url(../images/logobutton_JR_BerDesign.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_man_small {
+  content: url(../images/icon_man_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_man_medium {
+  content: url(../images/icon_man_mini.svg);
+  height: 30px;
+  width: 30px;
+  display: inline;
+}
+
+.icon_themenbaum_man_normal {
+  content: url(../images/logobutton_man.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+/* -- Logobuttons und Icons für Module n bis z -- */
+.icon_themenbaum_nutzungsantrag_small {
+  content: url(../images/icon_nutzungsantrag.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline-block;
+}
+
+.icon_themenbaum_nutzungsantrag_normal {
+  content: url(../images/logobutton_nutzungsantrag.svg);
+  height: 100px;
+  width: 100px;
+  display: inline-block;
+}
+
+.icon_themenbaum_portal_konfig_small {
+  content: url(../images/icon_portal_konfig_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_portal_konfig_normal {
+  content: url(../images/logobutton_portal_konfig.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_prom_small {
+  content: url(../images/icon_prom_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_prom_normal {
+  content: url(../images/logobutton_prom.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_qa_small {
+  content: url(../images/icon_qa_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_qa_normal {
+  content: url(../images/logobutton_qa.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_rpta_small {
+  content: url(../images/icon_rpta_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_rpta_normal {
+  content: url(../images/logobutton_rpta.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_sos_small {
+  content: url(../images/icon_sos_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_sos_normal {
+  content: url(../images/logobutton_sos.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_sva_small {
+  content: url(../images/icon_sva_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_sva_normal {
+  content: url(../images/logobutton_sva.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_sx_connect_small {
+  content: url(../images/icon_sx_connect.png);
+  height: 20px;
+  width: 20px;
+  display: inline;
+}
+
+.icon_themenbaum_sx_connect_normal {
+  content: url(../images/logobutton_sx_connect.png);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_viz_small {
+  content: url(../images/icon_viz_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 8px;
+  display: inline;
+}
+
+.icon_themenbaum_viz_normal {
+  content: url(../images/logobutton_viz.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_xcube_small {
+  content: url(../images/icon_xcube_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 4px;
+  display: inline;
+}
+
+.icon_themenbaum_xcube_medium {
+  content: url(../images/icon_xcube_mini.svg);
+  height: 30px;
+  width: 30px;
+  display: inline;
+}
+
+.icon_themenbaum_xcube_normal {
+  content: url(../images/logobutton_xcube.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+.icon_themenbaum_zul_small {
+  content: url(../images/icon_zul_mini.svg);
+  height: 20px;
+  width: 20px;
+  padding-top: 3px;
+  display: inline;
+}
+
+.icon_themenbaum_zul_normal {
+  content: url(../images/logobutton_zul.svg);
+  height: 100px;
+  width: 100px;
+  display: inline;
+}
+
+/*# sourceMappingURL=sx_common.css.map */
diff --git a/superx/style/sx_common.css.map b/superx/style/sx_common.css.map
new file mode 100644
index 00000000..6b87d40e
--- /dev/null
+++ b/superx/style/sx_common.css.map
@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../scss/config/_sx_variables.scss","../scss/config/_cust_variables.scss","../scss/config/_sx_theme.scss","../scss/components/_sx_common.scss","../scss/config/_sx_mixins.scss"],"names":[],"mappings":";AA0B8B;AACF;ACEE;AACF;ACmB5B;EACE;EATE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAkBJ;EACE;IACE;IApBA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;;;AC/BJ;AACA;ECJI;EACA;EACA;EACA;EACA;EACA;EA4BA;EACA;EACA;EACA;;;AD3BJ;EACE;EACA;;;AAGF;EACE;EACA;;;AAIF;AACA;EACE;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;;;AAGF;AACA;AAAA;AAAA;EAGE;;;AAOF;ECbI;EACA;EACA;EACA;EDYD;;;AAGH;EACE;EACA;;;AAGF;EACG;EACA;;;AAGH;EACE;ECnCE;EACA;EDoCF;;;AAGF;EACE;ECzCE;EACA;ED0CF;;;AAGF;EACE;EC/CE;EACA;EDgDF;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EC3DE;EACA;ED4DF;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAOF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAAA;EAGE;EACA;EACA;EACA;EACA;EACA;ECpGE;EACA;EACA;EACA;EDmGF;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMF;AAEA;EACE;;;AAGF;AAAA;EC1HI;EACA;EACA;EACA;;;AD4HJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;ECzII;EACA;EACA;EACA;EDwIF;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;ECzNI;EACA;EACA;EACA;EDwNF;EACA;;;AAGF;EACE;;;AAGF;AACA;EC1OI;EACA;EAKA;EACA;EACA;EACA;EAxBA;EACA;EACA;;;AD2PJ;ECxOI;EACA;EACA;EACA;;;ADyOJ;EACE;EC7OE;EACA;EACA;EACA;ED4OF;EACA;;;AAGF;ECzPI;EACA;EAKA;EACA;EACA;EACA;EAxBA;EACA;EACA;EDwQF;AACA;AAAA;AAAA;AAAA;EAIA;AACA;EACA;EACA;;;AAIF;AACA;AAAA;AAAA;EClQI;EACA;EACA;EACA;EDmQD;;;AAQH;EACE;EACA;EACA;EACA;EACA;;;AAOF;AACA;EACG;;;AAGH;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AACA;AACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAMF;AACA;AAAA;EClVI;EACA;EDoVD;;;AAGH;EClVI;EACA;EACA;EACA;EDiVD;;;AAGH;ECvVI;EACA;EACA;EACA;EDsVD;;;AAGH;EACG;EACA;;;AAGH;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;AACA;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAMF;AACA;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACG;;;AAGH;EACE;EACA;EACA;EACA;EACA;;;AAGF;ECveI;EACA;EACA;EACA;EDseD;EACA;;;AAGH;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EC1fE;EACA;EACA;EACA;EDyfF;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAOF;ECviBI;EACA;EACA;EACA;EATA;EACA;ED+iBD;EACA;EACA;EACA;;;AAGH;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAOF;EC5kBI;EACA;EACA;EACA;;;AD4kBJ;AACA;EACE;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;;;AAGF;EACE;EACA;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;ECvoBE;EACA;EDwoBF;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;EC1pBE;EACA;EACA;EACA;EDypBF;;;AAGF;EACE;;;AAGF;EACE;ECpqBE;EACA;EACA;EACA;EDmqBF;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAMF;AAAA;EC7rBI;EACA;EACA;EACA;;;AD+rBJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAMF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAMF;AACA;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA","file":"sx_common.css"}
\ No newline at end of file
diff --git a/superx/style/sx_field_dialogue.css b/superx/style/sx_field_dialogue.css
index cd580bf6..c2ef9fa6 100644
--- a/superx/style/sx_field_dialogue.css
+++ b/superx/style/sx_field_dialogue.css
@@ -1,104 +1,173 @@
 @charset "UTF-8";
-button.button-dialogue {
-  border: thin solid hsl(0, 0%, 71%);
-  border-radius: 0.3em;
-  background-color: white;
-  color: black;
-  padding: 8px;
-  width: 11em;
-}
-
-input.input {
-  border: thin solid hsl(0, 0%, 71%);
-  border-radius: 0.3em;
-  background-color: white;
-  color: black;
-  line-height: 2.5em;
+/*auch mittelgrau: #999999;*/
+/*auch hellgrau: #d7d7d7; */
+/*auch mittelgrau: #999999;*/
+/*auch hellgrau: #d7d7d7; */
+:root {
+  color-scheme: light;
+  --sx-body-background: white;
+  --sx-hr-background-color: whitesmoke;
+  --sx-button-background: inherit;
+  --sx-submit-button-border-color: hsl(141, 71%, 48%);
+  --sx-reset-button-border-color: hsl(48, 100%, 67%);
+  --sx-close-button-border-color: hsl(0, 0%, 71%);
+  --sx-card-background: white;
+  --sx-modal-values-background: #ecf0f3;
+  --sx-input-background: white;
+  --sx-input-background-ndSchluesselfeld: #fffaf0;
+  --sx-input-container-background: inherit;
+  --sx-sichtentreeCaret-color: #014A7B;
+  --sx-navbar-dialogue-background: #ecf0f3;
+  --sx-title-dialogue-color: hsl(0, 0%, 21%);
+  --sx-breadcrumbSeparator-color: hsl(0, 0%, 21%);
+  --sx-navbar-background: #ecf0f3;
+  --sx-themenbaumCaret-color: hsl(0, 0%, 21%);
+  --sx-border-color: hsl(0, 0%, 60%);
+  --sx-border-style: thin solid hsl(0, 0%, 60%);
+  --sx-border-radius: 0.3em;
+  --sx-font-color: hsl(0, 0%, 21%);
+  --sx-font-family: sans-serif;
+  --sx-font-weight: normal;
+  --sx-font-size: 13px;
+  --sx-tooltip-background: #3333ff;
+  --sx-tooltip-font-color: white;
+  --sx-error-color: #ff0000;
+  --sx-text-muted-color: hsl(0, 0%, 60%);
+  --sx-table-background-header: #ecf0f3;
+  --sx-table-background-row-level-1: #f0f8ff;
+  --sx-table-background-row-level-2: #f0ffff;
+  --sx-table-background-row-level-3: #fffafa;
+  --sx-table-background-row-level-4: #f5f5dc;
+  --sx-table-background-row-level-5: #faebd7;
+  --sx-table-background-row-level-6: #f0e68c;
+  --sx-table-color-special-value: #ecf0f3;
+  --sx-table-background-row-sum: hsl(0, 0%, 71%);
+  --sx-table-background-row-hover: hsl(219, 70%, 76%);
+  --sx-table-background-row-odd: weiß;
+  --sx-table-background-row-even: #efefef;
+  --sx-table-background-row-even-odd-hover: #fffabf;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    color-scheme: dark;
+    --sx-body-background: white;
+    --sx-hr-background-color: whitesmoke;
+    --sx-button-background: white;
+    --sx-submit-button-border-color: hsl(141, 71%, 48%);
+    --sx-reset-button-border-color: hsl(48, 100%, 67%);
+    --sx-close-button-border-color: hsl(0, 0%, 71%);
+    --sx-card-background: white;
+    --sx-modal-values-background: #ecf0f3;
+    --sx-input-background: white;
+    --sx-input-container-background: inherit;
+    --sx-sichtentreeCaret-color: #014A7B;
+    --sx-input-background-ndSchluesselfeld: #fffaf0;
+    --sx-navbar-dialogue-background: #ecf0f3;
+    --sx-title-dialogue-color: hsl(0, 0%, 21%);
+    --sx-breadcrumbSeparator-color: hsl(0, 0%, 21%);
+    --sx-navbar-background: #ecf0f3;
+    --sx-themenbaumCaret-color: hsl(0, 0%, 21%);
+    --sx-border-color: hsl(0, 0%, 60%);
+    --sx-border-style: thin solid hsl(0, 0%, 60%);
+    --sx-border-radius: 0.3em;
+    --sx-font-color: hsl(0, 0%, 21%) !important;
+    --sx-tooltip-background: #3333ff;
+    --sx-tooltip-font-color: white;
+    --sx-error-color: #ff0000;
+    --sx-text-muted-color: hsl(0, 0%, 60%);
+    --sx-table-background-row-level-1: #f0f8ff;
+    --sx-table-background-row-level-2: #f0ffff;
+    --sx-table-background-row-level-3: #fffafa;
+    --sx-table-background-row-level-4: #f5f5dc;
+    --sx-table-background-row-level-5: #faebd7;
+    --sx-table-background-row-level-6: #f0e68c;
+    --sx-table-background-header: #ecf0f3;
+    --sx-table-background-row-sum: hsl(0, 0%, 71%);
+    --sx-table-background-row-hover: hsl(219, 70%, 76%);
+    --sx-table-background-row-odd: weiß;
+    --sx-table-background-row-even: #efefef;
+    --sx-table-background-row-even-odd-hover: #fffabf;
+    --sx-table-color-special-value: #ecf0f3;
+  }
 }
-
-/*dateispezifische Basics*/
-body {
-  padding-top: 0px; /*202606 ergänzt die höhe der navbar*/
+.title-dialogue.is-4 {
+  color: var(--sx-title-dialogue-color);
+  font-weight: bold;
+  font-size: 25px;
 }
 
-body, .label, .searchresult, .placeholder { /*Schrift für Kopf, Suchform.Teile, Suchergebnisse*/
-  font-family: sans serif;
-  font-weight: normal;
-  font-size: 15px; /*202604 geändert von ursprgl. 12px;*/
+.title-dialogue.is-4:before {
+  content: "";
 }
 
-hr {
-  background-color: whitesmoke;
-  margin-top: -1rem;
-  margin-bottom: 0.5rem;
+.title-dialogue.is-4:after {
+  content: " Filter";
 }
 
-/*HS-spezifische Anpassungen*/
 .navbar-dialogue {
   position: sticky; /* 202606 ergänzt:Kopfzeile bleibt beim Scrollen "kleben"*/
   top: 0;
   left: 0;
   width: 100%;
   height: 105px;
-  background: #ECF0F3;
   z-index: 1000;
   margin-top: -55px;
+  background: var(--sx-navbar-dialogue-background);
 }
 
-.title-dialogue.is-4:before {
-  content: "";
+hr {
+  margin-top: -1rem;
+  margin-bottom: 0.5rem;
 }
 
-.title-dialogue.is-4:after {
-  content: " Filter";
+.a-dialogue {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  color: black;
+  font-weight: bold;
 }
 
-.title-dialogue.is-4 {
-  color: hsl(0, 0%, 21%);
-  font-weight: bold;
-  font-size: 25px;
+button.button-dialogue {
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  padding: 8px;
+  width: 11em;
+  background-color: var(--sx-button-background);
+  padding: 8px;
+  width: 11em;
 }
 
-/**20260611 auskomm zum Test.button-dialogue {
-   background-color: $button-dialogue-background; /*202604 für ok/reset/sbbruch-button*/
-/* padding: 8px;
-   border: thin solid black;
-   width: 11em; 
-}*/
-.a-dialogue {
-  color: black;
-  font-family: sans-serif;
-  font-weight: bold;
-  font-size: 15px;
+.input-container.sticky-filter { /*202606 Filter ergänzt f. äußeren Container*/
+  background: #d9d9d9;
 }
 
 input[type=checkbox] {
   vertical-align: bottom;
   line-height: 1.25;
-  /*20260611 auskommentiert zum Test background: $input-background;*/
 }
 
-.input::placeholder, .textarea::placeholder, .select select::placeholder { /*202604 eingefügt*/
-  /*20260611 auskomentiert zum Test color: $input-color; */
-  font-size: 15px;
-}
-
-.comboDiv-dialogue { /*202605 ergänzt*/
+.comboDiv-dialogue {
   margin-left: 1.6rem;
 }
 
-/* Standarddarstellung für größere Viewports */
+/* -- Standarddarstellung -- */
 .comboDiv {
   display: flex;
   justify-content: left;
-  margin-top: 1em; /*202606 ergänzt*/
+  margin-top: 1em;
 }
 
 .input-container.sticky-filter { /*202606 Filter ergänzt f. äußeren Container*/
   position: sticky; /*202606 neu: bleibt beim Scrollen sichtbar*/
   top: 105px; /* Höhe der Navbar > siehe oben */
   z-index: 999;
-  background: #ECF0F3;
   padding: 0.5rem 0;
 }
 
@@ -106,13 +175,12 @@ input[type=checkbox] {
   display: flex;
   flex-direction: row; /* Ordnet Felder horizontal*/
   margin-top: 0.2rem;
-  background: #ECF0F3;
 }
 
 .input-container > .label {
-  margin-bottom: 1rem; /*202604 geänd. v urprgl. 0*/
-  margin-right: 0.5rem; /*202606 geänd v. 2.2rem*; 202604 geänd. v. 1.2em*/
-  text-align: right; /*202606 ergänzt*/
+  margin-bottom: 1rem;
+  margin-right: 0.5rem;
+  text-align: right;
 }
 
 .field is-grouped is-grouped-multiline {
@@ -136,27 +204,23 @@ input[type=checkbox] {
 
 .label {
   margin-top: 5px;
-  width: 8em; /*202604 geänd. v urprgl. 2em*/
-  font-weight: bold; /*202604: ergänzt*/
+  width: 8em;
+  font-weight: bold;
 }
 
 .select select, .input { /*für Auswahlfeldstyle*/
-  border: thin solid hsl(0, 0%, 71%);
-  border-radius: 0.3em;
-  /*20260611 auskommentiert zum Test color: $input-color; */ /*202604 ergänzt*/
-  font-size: 16px; /*202604 ergänzt*/
   padding-left: 5px;
 }
 
-/*Anpassungen für Viewports Mobile bis 768px=tablet-Hochformat */
+/*--Anpassungen für Viewports Mobile bis 768px=tablet-Hochformat --*/
 @media screen and (min-width: 585px) and (max-width: 768px) {
   .input-container {
     flex-direction: row;
-    gap: 1px; /* Fügt Abstand zwischen den Feldern hinzu */
+    gap: 1px; /* Abstand zwischen den Feldern*/
   }
-  .input-container > .label { /*202605 ergänzt*/
+  .input-container > .label {
     margin-bottom: 0rem;
-    text-align: right; /*202606 ergänzt*/
+    text-align: right;
   }
   .field.is-grouped {
     flex-direction: row;
@@ -165,16 +229,16 @@ input[type=checkbox] {
     align-items: flex-start;
   }
 }
-/*Anpassung für kleine Viewports (Mobile)*/
+/* --Anpassung für kleine Viewports (Mobile) -- */
 @media screen and (max-width: 584px) {
   .input-container {
     flex-direction: column; /* Stapelt Felder*/
-    margin-top: 0rem; /*202604 geändert v ursprgl. 1rem*/
-    padding-bottom: 0.2rem; /*202604 eingefügt*/
+    margin-top: 0rem;
+    padding-bottom: 0.2rem;
   }
-  .input-container > .label { /*202605 ergänzt*/
+  .input-container > .label {
     margin-bottom: 0rem;
-    text-align: left; /*202606 ergänzt*/
+    text-align: left;
   }
   .field.is-grouped {
     flex-direction: row;
@@ -182,9 +246,8 @@ input[type=checkbox] {
     row-gap: 1px; /* Höhenabstand zwischen Feldern; ohne Angabe wird Abstand zu groß*/
   }
 }
-/* Ergebnislisten von Sichten und gesuchten Elementen */
 ul {
-  list-style: none;
+  list-style: none !important;
 }
 
 .sichtentreeUL {
diff --git a/superx/style/sx_field_dialogue.css.map b/superx/style/sx_field_dialogue.css.map
index 1c930958..8f29aa03 100644
--- a/superx/style/sx_field_dialogue.css.map
+++ b/superx/style/sx_field_dialogue.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["sx_field_dialogue.scss"],"names":[],"mappings":";AA6DA;EApCE;EACA;EACA;EACA;EACA;EACA;;;AAkCF;EA9BE;EACA;EACA;EACA;EACA;;;AA8BF;AACA;EAAO;;;AAEP;EACG;EACA;EACA;;;AAGH;EACE,kBAzDoB;EA0DpB;EACA;;;AAGF;AACA;EACI;EACA;EACA;EACA;EACA;EACA,YAhFc;EAiFd;EACA;;;AAGJ;EAA8B;;;AAC9B;EAA6B;;;AAC7B;EACG,OAzFM;EA0FN;EACA;;;AAGH;AAAA;AAEE;AAAA;AAAA;AAAA;AAKF;EACG;EACA;EACA;EACA;;;AAGH;EACE;EACA;AACA;;;AAEF;AACE;EACA;;;AAGF;EACG;;;AAEH;AACA;EACG;EACA;EACA;;;AAIH;EACI;EACA;EACA;EACA,YApIc;EAqId;;;AAGJ;EACI;EACA;EACA;EACA,YA5Ic;;;AA+IlB;EACI;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EAAQ;;;AAGR;EACE;EACA;EACA;;;AAGF;EACG,QAhKa;EAiKb;AACA;EACA;EACA;;;AAGH;AACA;EACE;IACE;IACA;;EAGF;IACE;IACA;;EAGH;IAAoB;;EACpB;IAAQ;;;AAGT;AACA;EACE;IACE;IACA;IACA;;EAGF;IACE;IACA;;EAGF;IACE;IACA;IACA;;;AAIJ;AACA;EAAK;;;AAEL;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA,OAhOsB;EAiOtB;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACA;;;AAGA;EACC;EACA;EACA;EACA;;;AAGD;EACA;EACA;EACA;EACA;EACA","file":"sx_field_dialogue.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../scss/config/_sx_variables.scss","../scss/config/_cust_variables.scss","../scss/config/_sx_theme.scss","../scss/components/_sx_field_dialogue.scss","../scss/config/_sx_mixins.scss"],"names":[],"mappings":";AA0B8B;AACF;ACEE;AACF;ACmB5B;EACE;EATE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAkBJ;EACE;IACE;IApBA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;;;AC9BJ;EACI;EACA;EACA;;;AAGJ;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAOF;ECLI;EACA;EACA;EACA;EDIF;EACA;;;AAGF;ECjBI;EACA;EAKA;EACA;EACA;EACA;EAfA;EACA;EDwBF;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACD;;;AAGD;EACG;;;AAOH;AACA;EACE;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;;EAEF;IACE;;;AAIJ;AACA;EACE;IACE;IACA;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;IACA;;;AAQJ;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA","file":"sx_field_dialogue.css"}
\ No newline at end of file
diff --git a/superx/style/sx_main.scss b/superx/style/sx_main.scss
new file mode 100644
index 00000000..1f4bc6e3
--- /dev/null
+++ b/superx/style/sx_main.scss
@@ -0,0 +1,8 @@
+@charset "utf-8";
+
+$beige-light: #d0d1cd;
+
+/*! bulma.io v1.0.2 | MIT License | github.com/jgthms/bulma */
+@use "sass";
+
+
diff --git a/superx/style/sx_tabelle.css b/superx/style/sx_tabelle.css
index b4f36adb..e1304931 100644
--- a/superx/style/sx_tabelle.css
+++ b/superx/style/sx_tabelle.css
@@ -1,193 +1,225 @@
 @charset "UTF-8";
-/*Hell-/Dunkel-Modus*/
-@media (prefers-color-scheme: light) { /*20250210 BF media-Zeile eingefügt*/
-  :root {
-    color-scheme: light;
-  }
+/*auch mittelgrau: #999999;*/
+/*auch hellgrau: #d7d7d7; */
+/*auch mittelgrau: #999999;*/
+/*auch hellgrau: #d7d7d7; */
+:root {
+  color-scheme: light;
+  --sx-body-background: white;
+  --sx-hr-background-color: whitesmoke;
+  --sx-button-background: inherit;
+  --sx-submit-button-border-color: hsl(141, 71%, 48%);
+  --sx-reset-button-border-color: hsl(48, 100%, 67%);
+  --sx-close-button-border-color: hsl(0, 0%, 71%);
+  --sx-card-background: white;
+  --sx-modal-values-background: #ecf0f3;
+  --sx-input-background: white;
+  --sx-input-background-ndSchluesselfeld: #fffaf0;
+  --sx-input-container-background: inherit;
+  --sx-sichtentreeCaret-color: #014A7B;
+  --sx-navbar-dialogue-background: #ecf0f3;
+  --sx-title-dialogue-color: hsl(0, 0%, 21%);
+  --sx-breadcrumbSeparator-color: hsl(0, 0%, 21%);
+  --sx-navbar-background: #ecf0f3;
+  --sx-themenbaumCaret-color: hsl(0, 0%, 21%);
+  --sx-border-color: hsl(0, 0%, 60%);
+  --sx-border-style: thin solid hsl(0, 0%, 60%);
+  --sx-border-radius: 0.3em;
+  --sx-font-color: hsl(0, 0%, 21%);
+  --sx-font-family: sans-serif;
+  --sx-font-weight: normal;
+  --sx-font-size: 13px;
+  --sx-tooltip-background: #3333ff;
+  --sx-tooltip-font-color: white;
+  --sx-error-color: #ff0000;
+  --sx-text-muted-color: hsl(0, 0%, 60%);
+  --sx-table-background-header: #ecf0f3;
+  --sx-table-background-row-level-1: #f0f8ff;
+  --sx-table-background-row-level-2: #f0ffff;
+  --sx-table-background-row-level-3: #fffafa;
+  --sx-table-background-row-level-4: #f5f5dc;
+  --sx-table-background-row-level-5: #faebd7;
+  --sx-table-background-row-level-6: #f0e68c;
+  --sx-table-color-special-value: #ecf0f3;
+  --sx-table-background-row-sum: hsl(0, 0%, 71%);
+  --sx-table-background-row-hover: hsl(219, 70%, 76%);
+  --sx-table-background-row-odd: weiß;
+  --sx-table-background-row-even: #efefef;
+  --sx-table-background-row-even-odd-hover: #fffabf;
 }
+
 @media (prefers-color-scheme: dark) {
   :root {
     color-scheme: dark;
-  }
-  table.ergtabelle {
-    color: black;
+    --sx-body-background: white;
+    --sx-hr-background-color: whitesmoke;
+    --sx-button-background: white;
+    --sx-submit-button-border-color: hsl(141, 71%, 48%);
+    --sx-reset-button-border-color: hsl(48, 100%, 67%);
+    --sx-close-button-border-color: hsl(0, 0%, 71%);
+    --sx-card-background: white;
+    --sx-modal-values-background: #ecf0f3;
+    --sx-input-background: white;
+    --sx-input-container-background: inherit;
+    --sx-sichtentreeCaret-color: #014A7B;
+    --sx-input-background-ndSchluesselfeld: #fffaf0;
+    --sx-navbar-dialogue-background: #ecf0f3;
+    --sx-title-dialogue-color: hsl(0, 0%, 21%);
+    --sx-breadcrumbSeparator-color: hsl(0, 0%, 21%);
+    --sx-navbar-background: #ecf0f3;
+    --sx-themenbaumCaret-color: hsl(0, 0%, 21%);
+    --sx-border-color: hsl(0, 0%, 60%);
+    --sx-border-style: thin solid hsl(0, 0%, 60%);
+    --sx-border-radius: 0.3em;
+    --sx-font-color: hsl(0, 0%, 21%) !important;
+    --sx-tooltip-background: #3333ff;
+    --sx-tooltip-font-color: white;
+    --sx-error-color: #ff0000;
+    --sx-text-muted-color: hsl(0, 0%, 60%);
+    --sx-table-background-row-level-1: #f0f8ff;
+    --sx-table-background-row-level-2: #f0ffff;
+    --sx-table-background-row-level-3: #fffafa;
+    --sx-table-background-row-level-4: #f5f5dc;
+    --sx-table-background-row-level-5: #faebd7;
+    --sx-table-background-row-level-6: #f0e68c;
+    --sx-table-background-header: #ecf0f3;
+    --sx-table-background-row-sum: hsl(0, 0%, 71%);
+    --sx-table-background-row-hover: hsl(219, 70%, 76%);
+    --sx-table-background-row-odd: weiß;
+    --sx-table-background-row-even: #efefef;
+    --sx-table-background-row-even-odd-hover: #fffabf;
+    --sx-table-color-special-value: #ecf0f3;
   }
 }
-/*spezifische Basics */
+/* -- Bildschirmseite mit scrollbar -- */
 html, body {
   max-width: 100%;
   overflow-x: visible;
 }
 
-.table-container {
-  border-collapse: collapse;
-  font-family: sans-serif;
-  font-weight: normal;
-  font-size: 0.8em;
-  overflow-x: auto; /* Nur horizontales Scrollen */
-  overflow-y: auto; /* Vertikales Scrollen */
-  max-height: 80vh; /* max. Container-Höhe 190% des Viewports (whitesmoke-farbene übergeo Card u Column) */
-  max-width: 185vb; /* max. Container-Breite 190% des Viewports (whitesmoke-farbene übergeo Card u Column) */
-  width: 100%; /* volle Container-Breite */
+/* --Container im Ergebnisbereich -- */
+.hero-body > .container { /*in _sx_common.scss*/
+  display: block;
+  width: 100%;
+  max-width: 100%; /*none;*/
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.container {
   white-space: normal; /* Ermöglicht Zeilenumbrüche in den Tabellenzellen */
+  hyphens: auto;
   /*white-space: nowrap; 	/* Verhindert Zeilenumbrüche in den Tabellenzellen */
   -webkit-overflow-scrolling: touch; /* Für bessere Scroll-Erfahrung auf Mobilgeräten */
 }
 
-.level-center { /*für zentrierte Icons in Tabelle*/
-  display: flex;
-  justify-content: center;
-}
-
-table {
-  border-collapse: collapse; /* Verhindert Doppellinien an den Grenzen */
-  /*min-width: 130%;*/ /* Tabellen-Breite gößer als Container-Breite, damit Scrollbalken sichtbar ist */
+/* -- Card -- */
+.hero-body > .container > .card {
+  width: fit-content;
   max-width: 100%;
-  white-space: normal;
+  min-width: 0;
+  box-sizing: border-box;
 }
 
-th, td {
-  padding: 8px;
-  border: 1px solid #ddd;
-  vertical-align: bottom !important; /*202608 eingefügt*/
-  white-space: normal; /* Erlaubt Zeilenumbrüche */
-}
-
-table thead th { /*für Tabellenposition*/
-  position: sticky;
-  top: 0;
-  z-index: 20;
+/* -- Input-container unter Buttonbar mit: Label, Auswahlfeld, Button --*/
+.input-container {
+  display: flex;
+  align-items: center;
+  flex-wrap: normal;
+  flex: 1 1 auto; /* 20260304; flex-grow, flex-shrink, flex-basis = auto; /*für flexibles Verhalten der Zeile*/
+  padding-bottom: 0.1rem;
 }
 
-table th.header, table th.fixed-column1-title { /*für Spaltentitel*/
-  background: #ECF0F3;
-  color: hsl(0, 0%, 21%);
-  font-weight: bold;
+.input-container > .label { /*Standarddarstellung für größere Viewports*/
+  margin-bottom: 0.3rem;
+  margin-right: 0.5rem; /* Abstand zwischen Label und Eingabefeld*/
 }
 
-table th.fixed-column1-title, table td.fixed-column1 { /*zum Fixieren des 1. Spaltentitels b. horizont. Scrollen*/
-  position: sticky;
-  z-index: 25;
-  left: 0em;
+.field {
+  margin-left: 1px; /*für Abstand Buttonbar-SelectFeld*/
 }
 
-table td.fixed-column1 {
-  background: #ECF0F3; /*whitesmoke;  	/*zum Fixieren der 1. TabSpalte b. horizont. Scrollen*/
-  filter: opacity(1);
-  position: sticky;
-  z-index: 20;
-  left: 0em;
-  border: thin solid;
-  border-collapse: collapse;
+/* -- Legende --*/
+.legende, p.legende {
+  display: flex;
+  /*flex-grow: 1;
+  /*flex-shrink: 1;*/
+  flex: 1 1 auto;
+  flex-flow: row wrap;
+  justify-content: flex-start;
+  align-items: normal;
+  padding: 0.3rem;
+  margin-bottom: 0.1rem;
+  width: auto;
 }
 
-/*table tr.erglevel0 {			/*202608 entfernt*/
-/*  font-weight:bold;
-  background: white;
-  border: thin solid; 
-  border-collapse: collapse; }
-*/
-table tr.erglevel_1 {
-  font-weight: bold;
-  background: aliceblue; /*202608 geändert: snow;*/
-  color: hsl(0, 0%, 21%);
-  border: thin solid;
-  border-collapse: collapse;
+p.legende {
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  border: var(--sx-border-style);
+  border-radius: var(--sx-border-radius) !important;
+  display: flex;
+  flex-wrap: wrap;
+  max-width: fit-content;
+  min-width: 0;
+  white-space: normal;
+  overflow-wrap: break-word;
+  word-break: normal;
+  hyphens: auto;
+  gap: 1px;
 }
 
-table tr.erglevel_2 {
-  font-weight: normal;
-  background: azure; /*202608 geändert: azure*/
-  color: hsl(0, 0%, 21%);
-  border: thin solid;
-  border-collapse: collapse;
+/* -- Unterhalb Ergebnistabelle: Datensatzinfo  -- */
+.pagination-container {
+  display: inline-flex;
+  align-items: center;
+  justify-content: left;
+  gap: 2px; /* Abstand zwischen den Elementen */
 }
 
-table tr.erglevel_3 {
-  font-weight: normal;
-  background: snow; /*202608 geändert: antiquewhite*/
-  border: thin solid;
-  border-collapse: collapse;
+/* -- Fehlermeldung --*/
+p.errmsg {
+  border: medium solid red;
+  text-align: left;
+  background-color: #d7d7d7;
 }
 
-table tr.erglevel_4 { /*202608 eingefügt: aliceblue*/
-  font-weight: normal;
-  background: beige;
-  border: thin solid;
-  border-collapse: collapse;
+span.hidden_navi {
+  margin: 0px;
+  padding: 0px;
+  font-size: smaller;
+  display: inline;
 }
 
-table tr.erglevel_5 { /*202608 eingefügt: beige*/
-  font-weight: normal;
-  background: antiquewhite;
-  border: thin solid;
-  border-collapse: collapse;
+/* -- Tabelle -- */
+.level-center, .treebutton { /*für zentrierte Icons in Tabelle*/
+  display: flex;
+  justify-content: center;
 }
 
-table tr.erglevel_6 { /*202608 eingefüg: khaki*/
-  font-weight: normal;
-  background: khaki;
-  border: thin solid;
+table,
+table.ergtabelle,
+table.nd_ergtabelle {
+  /*min-width: 130%;*/ /* Tabellen-Breite gößer als Container-Breite, damit Scrollbalken sichtbar ist */
+  width: 100%;
+  max-width: 100%;
+  table-layout: auto;
+  white-space: normal;
+  hyphens: auto;
+  margin: 0;
+  padding: 0;
+  border-spacing: 0px; /*Abstand zwischen den Zellen*/
   border-collapse: collapse;
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  font-size: 0.8rem;
 }
 
-table.ergtabelle {
-  margin-left: 0px;
-  margin-right: 0px;
-  margin-top: 0px;
-  margin-bottom: 0px;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  /*border:thin solid rgb(0,0,0);*/ /*20240619 entfernt*/
-  empty-cells: show;
-  border-collapse: separate;
-  border-spacing: 0;
-  font-size: 80%;
-}
-
-table.ergtabelle thead {
-  position: -webkit-sticky;
-  position: sticky;
-  top: 50px;
-  z-index: 4;
-}
-
-table td.ergfeld {
-  empty-cells: show;
-  vertical-align: top;
-  border: thin solid gray;
-}
-
-table td.prozent {
-  border: thin solid gray;
-  empty-cells: show;
-  font-style: italic;
-  color: #999999;
-}
-
-table td.lt5 {
-  border: thin solid gray;
-  empty-cells: show;
-}
-
-table td.lt5:before {
-  content: "< 5";
-  color: #ff0000;
-}
-
-table th.header {
-  background-color: #ECF0F3; /*#dbdee3ff;*/
-  color: black;
-  border: 1px solid black;
-  padding: 5px;
-  border-collapse: separate;
-  border-spacing: 0;
-  empty-cells: show;
-  /*font-size: 80%; 20250210 Bf entfernt*/
-}
-
+/* -- Tabellenkopf -- */
 table th.printheader {
   font-size: 10pt;
   font-weight: bold;
@@ -199,187 +231,163 @@ table th.printheader {
   border-left: 0;
 }
 
-table td.result {
-  font-size: 10pt;
-  empty-cells: show;
-}
-
-table td.string {
+table th,
+table.ergtabelle th,
+table.nd_ergtabelle th {
+  border: var(--sx-border-style);
+  border-collapse: separate;
+  background-color: var(--sx-table-background-header);
+  vertical-align: top;
+  white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
   text-align: left;
-  empty-cells: show;
-  border: thin solid gray;
-}
-
-table td.decimal {
-  text-align: right;
-  empty-cells: show;
-  border: thin solid gray;
+  text-align-last: left;
+  hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/
+  padding: 3px 0px !important; /*Textabstand innerhalb der Zelle: oben/unten sowie rechts/links*/
+  /*padding-inline: 2px;*/
+}
+
+table.thead,
+table.ergtabelle thead,
+table.nd.ergtabelle thead,
+table.thead th,
+table.ergtabelle thead th,
+table.nd_ergtabelle thead th { /*wirkt auf einz. Kopfzeile*/
+  border: var(--sx-border-style);
+  border-collapse: separate;
+  background-color: var(--sx-table-background-header);
+  position: sticky;
+  top: 50px; /*0*/
+  z-index: 20;
 }
 
-table td.boldnumber {
-  text-align: right;
-  empty-cells: show;
+/*-- fixierte Zeilen und Spalten --*/
+table th.fixed-column1-title,
+table td.fixed-column1 { /*für Spaltentitel*/
+  border: var(--sx-border-style);
+  border-collapse: separate;
+  background-color: var(--sx-table-background-header);
+  font-family: var(--sx-font-family);
+  font-weight: var(--sx-font-weight);
+  font-size: var(--sx-font-size);
+  color: var(--sx-font-color);
+  font-size: 0.8rem;
   font-weight: bold;
 }
 
-table td.integer {
-  text-align: right;
-  empty-cells: show;
-  border: thin solid gray;
-}
-
-p.errmsg {
-  border: medium solid red;
-  text-align: left;
-  background-color: #d7d7d7;
-}
-
-/*202608 entfernt, da ab Z.75 vorhanden*/
-/*table tr.erglevel0
-{font-weight:bolder;
-background-color:#f1f1f1;
-}
-
-table tr.erglevel_1
-{font-weight:bold;
-background-color:#f1f1f1;
-}
-
-table tr.erglevel_2
-{font-weight:bold;
-background-color:#f1f1f1;
+table th.fixed-column1-title,
+table td.fixed-column1 table.ergtabelle th.fixed-column1-title,
+table.ergtabelle td.fixed-column1,
+table.nd_ergtabelle th.fixed-column1-title,
+table.nd_ergtabelle td.fixed-column1 { /*zum Fixieren des 1. Spaltentitels b. horizont. Scrollen*/
+  border: var(--sx-border-style);
+  border-collapse: separate;
+  position: sticky;
+  z-index: 25;
+  left: 0em;
+  /*text-align: center;*/
 }
 
-table tr.erglevel_3
-{font-weight:normal;;
-background-color:#f1f1f1;
+table td.fixed-column1 table.ergtabelle td.fixed-column1 table.nd_ergtabelle td.fixed-column1 {
+  filter: opacity(1);
 }
 
-table tr.erglevel_4
-{font-weight:normal;;
-background-color:#f1f1f1;
-}*/
-/*202608 entfernt s.o.: Wenn nur 1 Ebene vorliegt:*/
-/*table tr.erglevel1_0
-{font-weight:bolder;
+/* -- Tabellenzellen, allg. -- */
+table.ergtabelle td,
+table.nd_ergtabelle td {
+  border: var(--sx-border-style);
+  vertical-align: bottom; /*top;
+white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+  hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/
+  padding: 3px 0px !important; /*Textabstand innerhalb der Zelle: oben/unten sowie rechts/links*/
+  /*padding-inline: 2px;*/
 }
 
-table tr.erglevel1_1
-{font-weight:normal;;
+/* -- Hierarchiezeilen -- */
+table tr.erglevel_1 {
+  background: var(--sx-table-background-row-level-1);
+  font-weight: bold;
 }
 
-/*202608 entfernt s.o.: Wenn nur 2 Ebenen vorliegen:*/
-/*table tr.erglevel2_0
-{font-weight:bolder;
-background-color:#f1f1f1;
+table tr.erglevel_2 {
+  background: var(--sx-table-background-row-level-2);
 }
 
-table tr.erglevel2_1
-{font-weight:bolder;
+table tr.erglevel_3 {
+  background: var(--sx-table-background-row-level-3);
 }
 
-table tr.erglevel2_2
-{font-weight:normal;;
+table tr.erglevel_4 {
+  background: var(--sx-table-background-row-level-4);
 }
 
-/*202608 entfernt s.o.:Wenn nur 3 Ebenen vorliegen:*/
-/*table tr.erglevel3_0
-{font-weight:bolder;
-background-color:#f1f1f1;
+table tr.erglevel_5 {
+  background: var(--sx-table-background-row-level-5);
 }
 
-table tr.erglevel3_1
-{font-weight:bolder;
-background-color:#f1f1f1;
+table tr.erglevel_6 {
+  background: var(--sx-table-background-row-level-6);
 }
 
-table tr.erglevel3_2
-{font-weight:bolder;
+/* -- Spezielle Zeilen und Zellen -- */
+table td.string {
+  text-align: left;
+  empty-cells: show;
 }
 
-table tr.erglevel3_3
-{font-weight:normal;;
+table td.boldnumber {
+  text-align: right;
+  empty-cells: show;
+  font-weight: bold;
 }
 
-/*202608 entfernt s.o.: Wenn nur 4 Ebenen vorliegen:*/
-/*table tr.erglevel4_0
-{font-weight:bolder;
-background-color:#f1f1f1;
+table td.decimal,
+table td.integer,
+table td.prozent {
+  text-align: right;
+  empty-cells: show;
 }
 
-table tr.erglevel4_1
-{font-weight:bolder;
-background-color:#f1f1f1;
+table td.lt5:before {
+  content: "< 5";
+  color: var(--sx-error-color); /*rot*/
 }
 
-table tr.erglevel4_2
-{font-weight:bolder;
+table td.prozent {
+  text-align: right;
+  font-style: italic;
+  color: var(--sx-table-color-special-value); /*default-blaugrau*/
 }
 
-table tr.erglevel4_3
-{font-style:italic;
+table td.result {
+  font-size: 10pt;
+  empty-cells: show;
 }
 
-table tr.erglevel4_4
-{font-weight:normal;;
-}
-*/
 table tr.issumme {
   font-weight: bolder;
-  background-color: #d7d7d7;
+  background-color: var(--sx-table-background-row-sum); /*hellgrau*/
 }
 
-span.hidden_navi {
-  margin: 0px;
-  padding: 0px;
-  font-size: smaller;
-  display: inline;
-}
-
-.listRowEven {
-  background-color: #EFEFEF;
-}
-
-.listRowEvenHover {
-  /*	background-color: #EFEAB3; */
-  background-color: #FFFABF;
-}
-
-.listRowOdd {
-  background-color: #FFFFFF;
+/* -- Hervorhebungen --*/
+table.ergtabelle tr:hover, table.nd_ergtabelle tr:hover,
+table.ergtabelle tr:focus, table.nd_ergtabelle tr:focus {
+  background-color: var(--sx-table-background-row-hover); /*graublau*/
 }
 
-.listRowOddHover {
-  background-color: #FFFABF;
+/* -- Tabellenzeilen ohne Hierarchie -- */
+.listRowEven { /*gerade Zeile*/
+  background-color: var(--sx-table-background-row-even); /*weißgrau*/
 }
 
-table.ergtabelle, table.ergtabelle th, table.ergtabelle td {
-  /*border: 1px solid black;*/ /*20240619 BF auskommentiert*/
-  border-collapse: separate;
-  border-spacing: 0;
+.listRowOdd { /*ungerade Tabellenzeile*/
+  background-color: var(--sx-table-background-row-odd); /*weiß*/
 }
 
-table.ergtabelle tr:hover {
-  background-color: hsl(219, 70%, 76%); /*#e5e5e5;*/
-}
-
-table.ergtabelle th {
-  background-color: #dbdee3;
-  color: black;
-  border: 1px solid black;
-  border-collapse: separate;
-}
-
-table.ergtabelle th, table.ergtabelle td {
-  padding: 5px;
-}
-
-/*20260304:Zahlen rechtsbündig*/
-.table td:nth-last-child(-n+2),
-.table th:nth-last-child(-n+2) {
-  text-align: right;
+.listRowEvenHover, .listRowOddHover {
+  background-color: var(--sx-table-background-row-even-odd-hover); /*hellgelb*/
 }
 
+/* -- Teiltabelle --*/
 p.teiltabelle_titel {
   clear: left;
   line-height: 2em;
@@ -392,124 +400,65 @@ p.teiltabelle_titel {
   padding: 0px 0px 0px 5px;
 }
 
-/*Legende*/
-.legende {
-  display: flex;
-  /*flex: 1 1 auto; 	/* 202604 weg; flex-grow, flex-shrink, flex-basis = auto; /*für flexibles Verhalten der Zeile*/
-  flex-grow: 1;
-  flex-shrink: 1;
-  flex-flow: row wrap;
-  justify-content: flex-start;
-  align-items: normal;
-  padding: 0.3rem;
-  margin-bottom: 0.1rem;
-  border: thin solid hsl(0, 0%, 71%); /*hellgrau*/
-  border-radius: 0.3em;
-}
-
-p.legende {
-  color: black;
-  gap: 3px; /* Abstand zwischen den Elementen */
-  width: auto;
-}
-
-.legende-info {
-  font-weight: normal;
-}
-
-/*Table-Buttonleiste mit input-container inkl.: Label, Auswahlfeld, Button*/
-.input-container {
-  display: flex;
-  align-items: center;
-  flex-wrap: normal; /* 20260326 neu*/
-  flex: 1 1 auto; /* 20260304; flex-grow, flex-shrink, flex-basis = auto; /*für flexibles Verhalten der Zeile*/
-  padding-bottom: 0.1rem;
-}
-
-.field {
-  margin-left: 1px;
-} /*für Abstand Buttonbar-SelectFeld*/
-.select select { /*für Auswahlfeldstyle*/
-  border: thin solid hsl(0, 0%, 71%); /*hellgrau*/ /*oder var(--bulma-link-light)*/
-  border-radius: 0.3em;
-}
-
-/* Standarddarstellung für größere Viewports */
-.input-container > .label {
-  margin-bottom: 0.3rem;
-  margin-right: 0.5rem;
-} /* Abstand zwischen Label und Eingabefeld*/
-/*Datensatzinfo unterhalb Ergebnistabelle*/
-.pagination-container {
-  display: inline-flex;
-  align-items: center;
-  justify-content: left;
-  /*max-width: 80%;*/ /*202604 weg*/
-  gap: 2px;
-} /* Abstand zwischen den Elementen */
-/******202603************/
-/* Mobile */
+/* -- Mobile -- */
 @media (max-width: 768px) {
-  .hero-body { /*202608 integriert*/
-    margin-left: 0; /*überschreibt -50px aus sx_common.css*/
-    margin-right: 0; /*überschreibt 1.5em aus sx_common.css*/
+  .hero-body {
+    margin-left: 0;
+    margin-right: 0;
   }
   .container, .input-container { /*Format-,Berichtswahl, Breadcrumb, Legende*/
-    max-width: 100%; /*202604 geänd von 800px;*/
-    white-space: normal;
-    overflow-wrap: break-word;
+    max-width: 100%;
+    white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto;
   }
   table.ergtabelle,
-  table.ergtabellexy {
-    max-width: 70%; /*202604 geänd. v 600px;*/
+  table.nd_ergtabelle {
+    max-width: 70%;
     font-size: 0.65rem;
-    /*white-space:nowrap;*/
   }
   table.ergtabelle th,
   table.ergtabelle td,
-  table.ergtabellexy th,
-  table.ergtabellexy td {
-    /*word-break:break-word !important;*/
+  table.nd_ergtabelle th,
+  table.nd_ergtabelle td {
     min-width: 50px;
     max-width: 60px;
-    white-space: normal; /* Zeilenumbruch nach Standard-Regeln*/
-    /*word-wrap: normal;         /* veraltet: f Umbruch nach Standard-Regeln*/
-    overflow-wrap: break-word !important; /* aktuell: Umbruch nach Standard-Regeln*/
-    hyphens: auto;
+    white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/
   }
 }
-/* Tablet */
-@media (min-width: 769px) and (max-width: 1023px) { /*202608 geändert v 1024px auf 1023px gem. Bulma-Brakpoint*/
+/* -- Tablet -- */
+@media (min-width: 769px) and (max-width: 1023px) { /*202608 geändert auf 1023px gem. Bulma-Breakpoint*/
   .container, .input-container { /*Format-,Berichtswahl, Breadcrumb, Legende*/
-    max-width: 100%; /*202604 geänd v 700px*/
-    white-space: normal;
-    overflow-wrap: break-word;
+    max-width: 100%;
+    white-space: normal; /*Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/
   }
   table.ergtabelle,
-  table.ergtabellexy {
-    max-width: 80%; /*202604: geänd. v 700px;*/
+  table.nd_ergtabelle {
+    max-width: 80%;
     font-size: 0.7rem;
   }
   table.ergtabelle th,
   table.ergtabelle td,
-  table.ergtabellexy th,
-  table.ergtabellexy td {
-    /*word-break:break-word !important;*/
-    /*min-width:50px;		  /*202608 entfernt; 202604: geänd. v 80px;*/
-    max-width: 80%; /*202608 geänd auf 80%; 202604: geänd. v 80px; */
-    white-space: normal; /* Zeilenumbruch nach Standard-Regeln*/
-    /*word-wrap: normal;         /* veraltet: f Umbruch nach Standard-Regeln*/
-    overflow-wrap: break-word !important; /* aktuell: Umbruch nach Standard-Regeln*/
-    hyphens: auto;
+  table.nd_ergtabelle th,
+  table.nd_ergtabelle td {
+    max-width: 80%;
+    white-space: normal; /* Leerzeichen zusammenfassen, Zeilenumbruch bei Bedarf nach Standard-Regeln*/
+    hyphens: auto; /*korr. Silbentrennung bei Angabe der Sprache <html lang="de">*/
   }
 }
-/* Desktop */
-@media (min-width: 1024px) { /*202608 geändert v 1025px auf 1024px gem. Bulma-Brakpoint*/
+/* -- Desktop -- */
+@media (min-width: 1024px) { /*202608 geändert auf 1024px gem. Bulma-Breakpoint*/
   table.ergtabelle,
-  table.ergtabellexy {
+  table.nd_ergtabelle {
     font-size: 0.75rem;
-    /*max-width:80%; 		/*202604: weg*/
   }
 }
+@media screen and (min-width: 1216px) {
+  .container:not(.is-max-desktop) {
+    max-width: 1000px;
+  }
+}
+
 
 /*# sourceMappingURL=sx_tabelle.css.map */
diff --git a/superx/style/sx_tabelle.css.map b/superx/style/sx_tabelle.css.map
index ce2332df..b4ccf836 100644
--- a/superx/style/sx_tabelle.css.map
+++ b/superx/style/sx_tabelle.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["sx_tabelle.scss"],"names":[],"mappings":";AA6BA;AACA;EACA;IAAQ;;;AAGR;EACA;IAAQ;;EACR;IAAmB;;;AAGnB;AACA;EACI;EACA;;;AAGJ;EACM;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;EACA;;;AAGN;EACE;EACA;;;AAGF;EACE;AACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;AACA;AAAA;AAAA;AAAA;AAAA;AAMA;EACE;EACA,YA3FmB,WA2FgB;EACnC;EACA;EACA;;;AAEF;EACE;EACA,YAjGmB,OAiGe;EAClC;EACA;EACA;;;AAEF;EACE;EACA,YAvGmB,MAuGe;EAClC;EACA;;;AAEF;EACE;EACA,YA3GmB;EA4GnB;EACA;;;AAEF;EACE;EACA,YAlHmB;EAmHnB;EACA;;;AAEF;EACE;EACA,YAtHmB;EAuHnB;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EAEA;EACA;EACA;;;AAGA;EAEA;EACA;EACA;EACA;;;AAGA;EAEA;EACA;;;AAGA;EAAqB;EAAc;;;AAEnC;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;;;AAGA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGA;EAEA;EACA;;;AAGA;EAEA;EACA;EACA;;;AAGA;EAEA;EACA;EACA;;;AAGA;EAEA;EACA;EACA;;;AAGA;EAEA;EACA;EACA;;;AAGA;EAEA;EACA;EACA;;;AAEA;AACA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAwBA;AACA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AASA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAcA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAmBA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAsBA;EACC;EACD;;;AAGA;EAEA;EACA;EACA;EACA;;;AAGA;EACC;;;AAGD;AACA;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AACC;EACA;EACA;;;AAGD;EAA2B;;;AAE3B;EACI;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AACA;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AACA;EACG;AACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEH;EACE;EACA;EACA;;;AAEF;EACE;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EAAS;EAAqB;AAE9B;EACC;EACA;;;AAED;AACA;EACC;EACA;EAAwB;AAGzB;AACA;EACE;EACA;EACA;AACA;EACA;EAAa;AAEf;AACA;AACA;EACG;IACF;IACA;;EAEE;IACE;IACA;IACA;;EAEF;AAAA;IAEE;IACA;AACA;;EAGF;AAAA;AAAA;AAAA;AAIC;IACC;IACA;IACA;AACA;IACA;IACA;;;AAIL;AACA;EACG;IACE;IACA;IACA;;EAEF;AAAA;IAEE;IACA;;EAGF;AAAA;AAAA;AAAA;AAIC;AACC;IACA;IACA;AACA;IACA;IACA;;;AAIL;AACA;EACG;AAAA;IAEE;AACA","file":"sx_tabelle.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../scss/config/_sx_variables.scss","../scss/config/_cust_variables.scss","../scss/config/_sx_theme.scss","../scss/components/_sx_tabelle.scss","../scss/config/_sx_mixins.scss"],"names":[],"mappings":";AA0B8B;AACF;ACEE;AACF;ACmB5B;EACE;EATE;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;AAkBJ;EACE;IACE;IApBA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;;;AC/BJ;AACA;EACE;EACA;;;AAOF;AACA;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EAME;EACA;AACA;EACA;;;AAIF;AACA;EACG;EACA;EACA;EACA;;;AAIH;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AACA;EACE;AACA;AAAA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EC3CI;EACA;EACA;EACA;EATA;EACA;EDmDD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIH;AACA;EACE;EACA;EACA;EACA;;;AAGF;AACA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAMF;AACA;EACE;EACA;;;AAGF;AAAA;AAAA;AAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ECrGE;EACA;EACA;EACA;EDoGF;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;AAAA;AAAA;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACA;;;AAIF;AAAA;AAAA;AAAA;AAAA;AAAA,+BAK+B;EAC7B;EACA;EACA;EACA;EACA;EACA;;;AAIF;AACA;AAAA,yBACgC;EAC7B;EACA;EACA;EC3JC;EACA;EACA;EACA;ED0JD;EACA;;;AAGH;AAAA;AAAA;AAAA;AAAA,uCAKwC;EACtC;EACA;EACA;EACA;EACA;AACA;;;AAGF;EAGE;;;AAGF;AAEA;AAAA;EAEE;EACA;AAAA;EAIA;EACA;AACD;;;AAGD;AACA;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AACA;EACE;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;AAAA;AAAA;EAGE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EAEA;;;AAGF;EACE;EACA;;;AAGF;EACE;EAEA;;;AAGF;AACA;AAAA;EAGI;;;AAGJ;AACA;EACE;;;AAGF;EAEE;;;AAGF;EAEE;;;AAGF;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOF;AACA;EACE;IACE;IACA;;EAEF;IACE;IACA;IACA;;EAGF;AAAA;IAEE;IACA;;EAGF;AAAA;AAAA;AAAA;IAIE;IACA;IACA;IACA;;;AAIJ;AACA;EACE;IACE;IACA;IACA;;EAGF;AAAA;IAEE;IACA;;EAGF;AAAA;AAAA;AAAA;IAIE;IACA;IACA;;;AAIJ;AACA;EACE;AAAA;IAEG;;;AAKL;EACE;IACE;;;AAIJ","file":"sx_tabelle.css"}
\ No newline at end of file
diff --git a/superx/xml/nd_templates.xsl b/superx/xml/nd_templates.xsl
index 6d221276..f021abd1 100644
--- a/superx/xml/nd_templates.xsl
+++ b/superx/xml/nd_templates.xsl
@@ -21,6 +21,7 @@ xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:sx="http://memtext.de" xm
     <link rel="stylesheet" href="../style/bulma-tooltip.min.css" />
     <link rel="stylesheet" href="../style/sx_common.css" />
     <link rel="stylesheet" href="../style/sx_menue.css" />
+    
       
 <xsl:choose>
 <xsl:when test="$title != ''">
@@ -1513,7 +1514,7 @@ menue.push(entry);
 
 </xsl:if>
 <!--<div class="table-container"> weg 20240608-->
-<table  id="{concat('table',$ergebniselement_ordnr + 1)}" class="ergtabellexy" >
+<table  id="{concat('table',$ergebniselement_ordnr + 1)}" class="nd_ergtabelle" >
 <!--20260326 style weg: style="display:block">bulma:class="table is-bordered is-striped is-narrow is-hoverable"  -->
    <thead>
       <xsl:call-template name="nd_tableheader"/>