Browse Source

Layout für Themenbaum ohne Ausklappfunktion verbessert

master
Andre Knieschewski 1 day ago
parent
commit
0b56344a20
  1. 341
      superx/style/sx_common.css

341
superx/style/sx_common.css

@ -1,8 +1,4 @@ @@ -1,8 +1,4 @@
/*Hell-/Dunkel-Modus*/
@media (prefers-color-scheme: light) {
:root { color-scheme: light; }
}
@media (prefers-color-scheme: dark) {
:root { color-scheme: dark; }
@ -21,16 +17,14 @@ body { background-color: white; @@ -21,16 +17,14 @@ body { background-color: white;
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; }
.card-footer-item:not(:last-child) { border: none; }
.article { color: black; }
.buttons, .button.is-outlined { border-color: white; } /*20250214 BF: betr.Top-Navi-Buttoms*/
.buttons, .button.is-outlined { border-color: white; } /*für Top-Navi-Buttoms*/
.button { background-color: white; } /*20250214 BF: betr. Reset-u ok-Button*/
.button { background-color: white; } /*für betr. Reset-u ok-Button*/
.dropdown {
--bulma-dropdown-content-background-color: white !important;
@ -45,23 +39,11 @@ a, .themenbaumLinkName, .labelSichtorComboButton { @@ -45,23 +39,11 @@ a, .themenbaumLinkName, .labelSichtorComboButton {
text-decoration: none;
color: blue !important; }
.menu {--bulma-menu-item-background-l: unset !important;} /*20250526 BF: betr. Elemente in menue, z.B. weitere Einstellungen*/
.menu {--bulma-menu-item-background-l: unset !important;} /*betr. Elemente in menue, z.B. weitere Einstellungen*/
/*img { filter:brightness(.8) contrast(1.2); } /*Helligkeit wird auf 80% des Originals reduziert; Contrast um 20% erhöht, da 1=normal)-20250526 BF: auskommentiert*/.
}
/*[data-theme=light],
.theme-light {
/* CSS Variables */
/*}
[data-theme=dark],
.theme-dark {
/* CSS Variables */
/*}
/*Weitere allgemeine Basics*/
/*Allgemeine Basics*/
div.columns { /*für Abstand zum Seitenrand*/
margin-top: 1px;
margin-right:5px; }
@ -73,9 +55,6 @@ body { /*für Seiteninhalt*/ @@ -73,9 +55,6 @@ body { /*für Seiteninhalt*/
margin: 0.1rem;
}
/*body.dark-theme img { /*filter für theme dark-20250526 BF:auskommentiert*/
/* filter:brightness(.80) contrast(1.2); } */
.hero-body {
margin-left: 1.5em;
margin-right: 1.5em; }
@ -102,7 +81,7 @@ body { /*für Seiteninhalt*/ @@ -102,7 +81,7 @@ body { /*für Seiteninhalt*/
.card, .article { /*für Cardposition, -style*/
display: flex;
flex-flow: column;
margin: 1%; /*171024 BF geändert von 0em*/
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*/
@ -112,7 +91,7 @@ body { /*für Seiteninhalt*/ @@ -112,7 +91,7 @@ body { /*für Seiteninhalt*/
font-size: 12px;
width: 100%; }
.card {margin-top: 0.5rem !important;} /*20240907BF ergänzt*/
.card {margin-top: 0.5rem !important;}
.card-content {
padding-left: 1.3rem;}
@ -129,12 +108,11 @@ body { /*für Seiteninhalt*/ @@ -129,12 +108,11 @@ body { /*für Seiteninhalt*/
.form-submit {
display: flex;
justify-content: center;
column-gap: 0.5rem;
background: inherit;
border: none;
margin-top: 1rem;
margin-left: 2rem; }
margin-top: 1em;
margin-left: 22em; }
.form-submit-item {
display: flex;
@ -143,20 +121,18 @@ body { /*für Seiteninhalt*/ @@ -143,20 +121,18 @@ body { /*für Seiteninhalt*/
/*Cell*/
.container {
display: flex;
flex-wrap: wrap; /* Damit die Zellen umgebrochen werden, wenn nicht genug Platz ist */
justify-content: flex-start; /* Inhalte links */
align-items: flex-start; /* Inhalte vertikal ausrichten */
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*/
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;
/*width: calc(100% - 0.5rem);*/
/*max-width: 100%;*/
border: thin solid hsl(0, 0%, 71%); /*hellgrau*/
border-radius: 0.3em;
}
@ -167,7 +143,7 @@ body { /*für Seiteninhalt*/ @@ -167,7 +143,7 @@ body { /*für Seiteninhalt*/
.breadcrumb {
padding: 0.3rem;
border: thin solid hsl(0, 0%, 71%); /*hellgrau*/
border-radius: 0.3em; } /*für Padding: ob re un li*/
border-radius: 0.3em; }
.breadcrumb.has-path-separator li + li::before {
content: " >";
@ -177,35 +153,35 @@ body { /*für Seiteninhalt*/ @@ -177,35 +153,35 @@ body { /*für Seiteninhalt*/
user-select: auto; } /*für Markierung des Inhalts */
/*Buttonleiste, div. Buttons*/
.buttonbar { /*für resposive Buttonleiste*/
display: flex;
.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; /*ursprgl. 1.5*/
margin: 8px 0px 0px 0px; /*neu 20240828 BF*/
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*/
.button { /*für Button-Bezeichner-Ausrichtung*/
display: flex;
justify-content: left !important; }
.submit_button { /* zum Abschicken, Übernehmen*/
.submit_button { /* zum Abschicken, Übernehmen*/
border: thin solid hsl(141, 71%, 48%); /*grün*/
border-radius: 0.3em; }
.reset_button { /* zum Zurücksetzen, Leeren*/
.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*/
.close_button { /*zum Schließen*/
border: thin solid hsl(0, 0%, 71%); /*hellgrau*/
border-radius: 0.3em; }
.menubutton, .orgunitbutton, .closebutton { /*für Button-Style*/
@ -213,11 +189,11 @@ body { /*für Seiteninhalt*/ @@ -213,11 +189,11 @@ body { /*für Seiteninhalt*/
justify-content: center;
background: inherit;
padding: 0.4rem 0rem 0.4rem 0rem; /*für Padding: ob re un li*/
border: thin solid white /*hsl(48, 100%, 67%)*/;
border: thin solid white;
border-radius: 0.3em;
box-shadow: rgb(0 0 0 /0.1) 0.1em 1.1px;
width: 1.8rem; /*1.7rem*/
height: 1.8rem;} /*1.7rem*/
width: 1.8rem;
height: 1.8rem;}
/*Top-, Bottom-Navigation*/
.navbar {
@ -232,103 +208,16 @@ body { /*für Seiteninhalt*/ @@ -232,103 +208,16 @@ body { /*für Seiteninhalt*/
.navbar-item {
margin-bottom: 0.1rem; }
/*Webanwendungsmanager*/
/* Box-Sizing auf Border-Box setzen */
*,
*::before,
*::after {
box-sizing: border-box;
}
.nd_navi_wam {
display: flex;
max-width: 2.0rem; } /*1.7rem*/
.navi_wam {
position: static /*damit NavPanel in kl. Viewport nicht am oberen BS-Rand klebt*/
padding: 0; }
.navi_wam ul { /*für sichtbaren Webanwendungsmanager*/
display: flex;
flex-flow: column;
flex: 1;
list-style: none;
padding: 0; margin: 0;
background: inherit; }
.navi_wam a { /*für WAM-Elemente*/
display: flex; /*block*/
text-decoration: none;
background: #ECF0F3; /*whitesmoke;*/
border: thin solid white /*hsl(48, 100%, 67%)*/;
border-radius: 0.3em;
box-shadow: rgb(0 0 0 /0.1) 0.1em 2.1px;
width: auto;
padding: 0.3rem 0.3rem; /*für Innenraumplatzum Text ob/un + re/li*/
margin: 0rem; } /*für Außenabstand*/
.navi_wam a:hover, .navi_wam a:focus { /*für angetipptes/steuertes Element*/
background: hsl(219, 70%, 76%); /*inherit*/
color: white; } /*inherit*/
.navi_wam ul { /*für versteckten Webanwendungsmanager*/
max-height: 0;
overflow: hidden;
padding: 0; }
.showwam + ul {
display: flex;
flex-flow: column;
max-height: -600rem;
transition: 500ms;
overflow: initial; }
/*Profil*/
.nd_navi_profil {
display: flex;
max-width: 2.0rem; }
.navi_profil {
position: static /*damit NavPanel in kl. Viewport nicht am oberen BS-Rand klebt*/
padding: 0; }
.navi_profil ul { /*für sichtbaren Profil*/
display: flex;
flex-flow: column;
flex: 1;
list-style: none;
padding: 0; margin: 0;
background: inherit; }
.navi_profil a { /*für Profil-Elemente*/
display: flex;
text-decoration: none;
background: #ECF0F3; /*Memtext-Blaugrau*/
border: thin solid white /*hsl(48, 100%, 67%)*/;
border-radius: 0.3em;
box-shadow: rgb(0 0 0 /0.1) 0.1em 2.1px;
width: auto;
padding: 0.3rem 0.3rem; /*für Innenraumplatzum Text ob/un + re/li*/
margin: 0rem; } /*für Außenabstand*/
.navi_profil a:hover, .navi_profil a:focus { /*für angetipptes Element*/
background: hsl(219, 70%, 76%); /*inherit*/
color: white; }
.navi_profil ul { /*für verstecktes Profil*/
max-height: 0;
overflow: hidden;
padding: 0; }
.showprofil + ul {
display: flex;
flex-flow: column;
max-height: -600rem;
transition: 500ms;
overflow: initial; }
/*Bottom-Navi*/
#nd_navi_bottom { /*20250130BF ergänzt*/
position: fixed;
#nd_navi_bottom {
/*position: fixed; /*20250602 damit gesamtes Menü sichtbar ist*/
bottom: 0;
width: 100%;}
@ -337,7 +226,7 @@ body { /*für Seiteninhalt*/ @@ -337,7 +226,7 @@ body { /*für Seiteninhalt*/
flex-flow: row nowrap;
justify-content: center;
background: #ECF0F3; /*Memtext-Blaugrau*/
height: 45px; } /*20240911BF ergänzt*/
height: 45px; }
.bottom-nav li { /*für Bottomnav-Liste*/
display: flex;
@ -364,15 +253,7 @@ body { /*für Seiteninhalt*/ @@ -364,15 +253,7 @@ body { /*für Seiteninhalt*/
.navpanelFrame /*.navpanelFrame_ou*/ { /*zum Ausblenden gesamten NavPanels*/
display: none; }
.navpanel a { /*20240209 BF Eigenschaften deaktiviert da überlagert mit themenbaumStatic/.Nested a und li; sh. Z480+Z486*/ /*für Nav-Elemente*/
/* display: flex;
flex:1;
text-decoration: none;
align-content: center;
/* background: white; */
/*width: auto;
padding: 0rem 0rem; /*für Innenraumplatz um Text ob/un + re/li*/
/*margin-left: 0rem; */} /*für Außenabstand*/
/*.navpanel a { } /*Eigenschaften deaktiviert da überlagert mit themenbaumStatic/.Nested a und li; sh. Z480+Z486*/ /*für Nav-Elemente*/
.level-center {
display: flex;
@ -384,75 +265,19 @@ body { /*für Seiteninhalt*/ @@ -384,75 +265,19 @@ body { /*für Seiteninhalt*/
.panel-block {
display: flex; }
.panel-block-search {
.panel-block-search {
margin-left: 10px; }
.menu-label {
margin-left: 5.0%;
text-transform: unset; } /*20240812 BF geändert von uppercase*/
.panel-block-ebene1 {
display: flex;
flex: 1;
width: auto;
margin-left: 0%; }
.panel-block-ebene2 {
display: flex;
flex: 1;
width: auto;
margin-left: 10.0%; }
.panel-block-ebene3 {
display: flex;
flex: 1;
width: auto;
margin-left: 15.0%; }
.panel-block-ebene4 {
display: flex;
flex: 1;
width: auto;
margin-left: 20.0%; }
.panel-block-ebene5 {
display: flex;
flex: 1;
width: auto;
margin-left: 25.0%; }
.panel-block-ebene6 {
display: flex;
flex: 1;
width: auto;
margin-left: 30.0%; }
.panel-block-ebene7 {
display: flex;
flex: 1;
width: auto;
margin-left: 35.0%; }
.panel-block-ebene8 {
display: flex;
flex: 1;
width: auto;
margin-left: 40.0%; }
.panel-block-ebene9 {
display: flex;
flex: 1;
width: auto;
margin-left: 45.0%; }
text-transform: unset; }
.panel-icon {
margin: 2%; }*/
/***Auf-/Zuklappen von Themenbaum/ThemenbaumNested***/
.themenbaumStatic li, themenbaumNested li {
/* margin: 0.1rem; */
}
.themenbaumStatic li, themenbaumNested li { }/*erforderlich für initial zusammengklappten Themenbaum*/
.themenbaumNested { /*zum Auf-/Zuklappen*/
display: none;
@ -468,20 +293,47 @@ body { /*für Seiteninhalt*/ @@ -468,20 +293,47 @@ body { /*für Seiteninhalt*/
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; /* 20240910 Verhindert zusätzlichen Freiraum oberhalb */
margin-bottom: 0; /* 20240910 Verhindert zusätzlichen Freiraum unterhalb */
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 /*#ccccccff*/;
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: 0; /* 20240910 Kein zusätzlicher Freiraum oberhalb */
margin-bottom: 0; /* 20240910 Kein zusätzlicher Freiraum unterhalb */
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*/
.themenbaumStatic a, .themenbaumNested a { /*für BaumElemente*/
font-family: sans-serif;
font-weight: normal;
font-size: 12px;
@ -494,11 +346,11 @@ a.themenbaumLink:hover, a.themenbaumLink:focus { /*für Hervorhebung bei Anwahl* @@ -494,11 +346,11 @@ a.themenbaumLink:hover, a.themenbaumLink:focus { /*für Hervorhebung bei Anwahl*
background-color: transparent;}
.themenbaumEintrag {
display: block; /* Zeigt jedes Thema als Blockelement, sodass es vertikal gestapelt wird */
display: block; /*Zeigt jedes Thema als Blockelement, sodass es vertikal gestapelt wird */
}
.themenbaumLink {
display: inline-flex; /* Flexbox sorgt dafür, dass die Icons und der Text korrekt ausgerichtet sind */
.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 */
}
@ -509,9 +361,6 @@ a.themenbaumLink:hover, a.themenbaumLink:focus { /*für Hervorhebung bei Anwahl* @@ -509,9 +361,6 @@ a.themenbaumLink:hover, a.themenbaumLink:focus { /*für Hervorhebung bei Anwahl*
display: block; /* Block, um Zeilenumbrüche zu unterstützen */
}
.themenbaumSpacer { /*???*/
/*padding-left: 10px;*/ }
.themenbaumLinkWithSpace {
text-decoration: none; /*keine Unterstreichung für Links */
box-decoration-break: clone;
@ -559,9 +408,6 @@ ol.themenbaumSearchResults { /*für Suchergebnisse*/ @@ -559,9 +408,6 @@ ol.themenbaumSearchResults { /*für Suchergebnisse*/
width: 1.0rem;
height: 0.8rem; }
.hidenavpanel + ul { /*//zum Ausblenden des NavPanels alterntiv zu display: none*/
display: none; }
.closenavpanel.closebutton::before { /*für Buttonanzeige bei geschlossenem NavPanel*/
display: flex;
content: url(../images/burger.svg); }
@ -605,7 +451,6 @@ ol.themenbaumSearchResults { /*für Suchergebnisse*/ @@ -605,7 +451,6 @@ ol.themenbaumSearchResults { /*für Suchergebnisse*/
.label-container, .button-label { /*für einh.responsive Feldbezeichner; vgl. dazu auch: sx_menu.css*/
display: flex;
/*justify-content: right; /*20240619BF geändert*/
background: inherit;
min-width: 7.5rem; /*für kleine Viewports*/
width: 100%; }
@ -657,20 +502,19 @@ ol.themenbaumSearchResults { /*für Suchergebnisse*/ @@ -657,20 +502,19 @@ ol.themenbaumSearchResults { /*für Suchergebnisse*/
.field {
margin-left: 1%;
align-items: center; /*für horizontale Label-Ausrichtung*/
/*width: 250px;*/ } /*Labelbreite=Abstand zum Eingabefeld; 28082024 deaktiviert*/
align-items: center; } /*für horizontale Label-Ausrichtung*/
.field-body { /*für Feldhöhe/-abstand*/
height: 1.2rem }
.input, .select select, is-small.input { /*20250528 BF is-small.input ergänzt*/
.input, .select select, is-small.input {
padding-left: 10px;
border-radius: 0.2em !important; } /*20250528 BF important ergänzt*/
border-radius: 0.2em !important; }
input.schluesselfeld {
font-size:0.9em;
background-color:#ffffcc;
color:blue
color: blue;
}
input.ndSchluesselfeld {
@ -688,7 +532,7 @@ input.ndSchluesselfeld { @@ -688,7 +532,7 @@ input.ndSchluesselfeld {
color: darkgrey /*rgba(54, 54, 54, 0.3)*/; }
.input:-ms-input-placeholder, .textarea:-ms-input-placeholder, .select select:-ms-input-placeholder {
color: darkgrey /*(54, 54, 54, 0.3);*/; }
color: darkgrey /*rgba (54, 54, 54, 0.3);*/; }
.trennung {
-webkit-hyphens: auto;
@ -696,15 +540,6 @@ input.ndSchluesselfeld { @@ -696,15 +540,6 @@ input.ndSchluesselfeld {
.required:before { content: "* ";} /*Kennz. für obligatorische Eingabefelder*/
/*.comboDiv { /*20241102 BF: deaktivert, da hier unnötig, weil in sx_sichtauswahl definiert*/
/* background-color: white;
border-radius: 0.5em;
padding-left: 0.5em;*/
/*legt max. sichtbare Höhe u. vertikalen Scrollbalken fest, wir wollen aber keinen Scrollbalken:
max-height: 700px;
overflow-y: auto;*/ /*fixiert an position*/
/*}*/
.field-container {
display: flex;
flex-direction: column; /* Ordnet alle Felder vertikal */
@ -720,16 +555,16 @@ input.ndSchluesselfeld { @@ -720,16 +555,16 @@ input.ndSchluesselfeld {
/* Tooltip-Stil und Positionen */
.field.has-addons .control .select select, .input,
.field.has-addons .control .button { /*20250528 BF eingefügt*/
.field.has-addons .control .button {
height: 2.5em;
border: thin solid hsl(0, 0%, 71%); } /*hellgrau*/
}
.field.has-addons .control:not(:last-child) { /*20250528 BF eingefügt*/
.field.has-addons .control:not(:last-child) {
margin-right: -2px; /* damit sich die Ränder optisch überlagern */
}
.button.has-tooltip-bottom { /*20250528 BF eingefügt*/
.button.has-tooltip-bottom {
height: 2.5em; /* entspricht der Höhe des Eingabeldes*/
}
@ -748,8 +583,8 @@ input.ndSchluesselfeld { @@ -748,8 +583,8 @@ input.ndSchluesselfeld {
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*/
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*/
@ -776,7 +611,7 @@ li.submenu_listelem { @@ -776,7 +611,7 @@ li.submenu_listelem {
}
.submenu_listelem:hover, .submenu_listelem:focus {
background-color: white; } /*#eaeaea;*/
background-color: white; }
/*Modal Cards*/
.box-new { /*für Kopfzeile mit Close-Button*/
@ -786,7 +621,7 @@ li.submenu_listelem { @@ -786,7 +621,7 @@ li.submenu_listelem {
}
.modalValues {
background-color: #ECF0F3; /*whitesmoke;*/ /*für Abschnitthintergrund, Schrift*/
background-color: #ECF0F3; /*für Abschnitthintergrund, Schrift*/
font-size: 0.8em;
}
@ -801,13 +636,9 @@ li.submenu_listelem { @@ -801,13 +636,9 @@ li.submenu_listelem {
span.feldname {font-weight:medium; }
span.feldwert {font-weight:bolder; }
/*Logobuttons und Icons*/
img.svg_icon{
height:20px;
}
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;}

Loading…
Cancel
Save