:root {
  --stt-color: #16479e;
}

body {
  font-size: 84%;
}

main {
/*  margin-top: 10px;	 */
    background: url(../images/body-bg.png) repeat-x 
}


.container {
    margin-top: 10px;
}

h1 {
  color: var(--stt-color);
  font-size: 1.6em;	
  font-weight: bold;
  padding: 0px;
    
}


h2 {
  font-size: 1.5em;
  font-weight: bold;
}

a {
  text-decoration: none;
}

a:link {
  color: var(--stt-color);
  text-decoration: none;
}

a:visited {
  color: var(--stt-color);
  text-decoration: none;
}

a:hover {
  color: #cc6600;
}


/* Kopfzeile und Menu
----------------------------------------------*/
.navbar-dark .navbar-brand a.site-title {
  color: var(--stt-color);
}

.bg-primary {
  --bs-bg-opacity: 1;
  background-color: #bbbbbb;
}

@media (max-width: 790px) {
  .navbar-dark .navbar-brand a.site-title {
    font-size: 1rem;
  }
}
/* @media (max-width: 750px) {
  .navbar-dark .navbar-brand a.site-title {
    font-size: 1.1rem;
  }
}
 */


/* Menu Links
-----------------------------------------------*/
.region-sidebar-first .contextual-region.block {
  background-color: #f4f4f4;
  background-color: #f4f4f4;
  border-right: 1px solid #bbb;
  border-bottom: 1px solid #bbb;
  border-left: 1px solid #ddd;
  border-top: 1px solid #ddd;
  margin: 2px 1px;
  padding: 5px;
  min-width: 200px;
  /* max-width: 230px; */
  /* width: 20%; */
}
.region-sidebar-first h2 {
  font-size: 1.2em;
  font-weight: bold;
}

.region-sidebar-first .form-type-search {
  margin-right: 0.5em;
  width: 100%;
}

/* Admin Inhalt hinzufügen, bearbeiten
---------------------------------------------*/
#block-b5subthemestt-content .view-filters .form-item{
  margin: 0.5em 0.5em; 
}



/* Startseite
----------------------------------------------*/
.view-frontpage .view-content {  
  display: grid;
	grid-template-columns: repeat(2, 1fr);  
  .field--name-field-image {
    max-width: 200px;
    float: left;
    margin-right: 0.5em;
  }
}

/* .view-frontpage .view-content li {
  marker:none;
  list-style-type: none;
} */

.view-frontpage h1 {
  font-size: 0.8em;
  text-align: center;
}

.startseite-zeile.views-row {
  width: 100%-0.5em;    
  background: #f0f0f0;
  border-radius: 1em;
  margin: 0.5em;
  padding: 0.5em;
  display: flex;
}

.startseite-zeile.views-row .node__links {
	position: absolute;
	bottom: 0;
	right:0;
}


@media (max-width: 615px) {
  .view-frontpage .view-content {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
  }
  /* .startseite-zeile.views-row {
    width: 100%-0.5em;    
    background: rgb(125, 174, 238);
    border-radius: 1em;
    margin: 0.5em;
    padding: 0.5em;
  } */
}



/* View Aktuelles
----------------------------------------------*/
.view-aktuelles .view-content{
	color: black;
	font-weight: normal;
  text-align: justify;
  -webkit-hyphens: auto; 
  hyphens: auto; 
  display: grid;
  grid-template-columns: repeat(2, 1fr);	
}

.aktuelles-row {
  border: 1px solid #ddd ;
	border-radius: 10px;
	vertical-align: top;
	background:#eee;
	margin:0.5em;
	padding:0.5em;
  display: flex;
}

.aktuelles-row .node__links {
	position: absolute;
	bottom: 0;
	right:0;
}


.aktuelles-liste {    
  display: grid;
	grid-template-columns: repeat(2, 1fr);  
}


.aktuelles-liste li {  
    background: #f0f0f0;
    margin: 0.5em;
    padding: 0.5em;
    border-radius: 1em;
    marker:none;
    list-style-type: none;
}

.aktuelles-liste li::marker {       
    content: '•';
    font-size: 1.2em;
    list-style-type: '•';
}     

.aktuelles-liste > li::marker {
    content: none;      
}

@media (max-width: 750px) {
  .aktuelles-liste  {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
  }
}  

.aktuelles-liste .node__content li {
  list-style-type: '•';
}

/* View Karriere
----------------------------------------------*/
.karriere-list > li::marker {
   content: none;    
}

.stellenanzeige h2 {
  margin-left: 2em;
  font-size: 1.5em;
  font-weight: bold;
}

.stellenanzeige h3 {
  /* margin-left: 2em; */
  font-size: 1.5em;
}

.stellenanzeige h4 {  
  font-size: 1.2em;
}

.stellenanzeige_sum p {
  margin-left: 2em;
  font-size: 1.1em;
}


/* View product_categories (Produktkategorien)
-----------------------------------------------------------------*/
.prodcatview {
    text-align: center;
} 

.view-prodkat2 h1 {
  color: #b5b5b5;;
  font-size: 1.6em;
  font-weight: bold;
  padding: 0px;
  text-align: center;
}

.product-categories-views-col {
    width: 32%;
    min-width: 260px;
    text-align: center;	
    border-color: var(--stt-color);
    border-style: solid;
    border-width: thin;
    margin: 2px;
    padding: 0px;
}

.product-categories-views-row {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
}
.product-categories-views-field-title {
    padding: 2px;
    background: var(--stt-color);	
    color: white;
    font-size: 1.3em;
    font-weight: normal;	
}

.product-categories-views-field-title a {
  line-height: normal;
  color: white;
}
.product-categories-views-field-image {
    height: 100%;
    margin: 1em;
}


/* View solution_categories 
-----------------------------------------------------------------*/
.solutions-categories-views-col {
    width: 32%;
    min-width: 260px;
    text-align: center;	
    border-color: var(--stt-color);
    border-style: solid;
    border-width: thin;
    margin: 2px;
    padding: 0px;
}
.solutions-categories-views-row {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
}
.solution-categories-views-field-title {
    padding: 2px;
    background: var(--stt-color);
    color: white;
    font-size: 1.3em;
    font-weight: normal;	
}

.solution-categories-views-field-title a {
    line-height:normal;
    color: white;
}

.solution-categories-views-field-image {
    height: 100%;
    margin: 1em;
}


/* Page Solution
--------------------------------------------------------------*/
.solution p { 
  -webkit-hyphens: auto; 
  hyphens: auto; 
  text-align: justify;
}

/* Content regions
-------------------------------------------------------------- */

#wrapper {
  width: 100%;  
  max-width: 1100px;    
  margin: 15px auto 0;
}


/* Slideshow
-------------------------------------------------------------- */
#slideshow-container {
      max-width: 1100px;
      position: relative;
      margin: auto;
      min-height: 180px;
    }
.mySlides {
      display: none;
}
.img {
      width: 100%;
      height: auto;
}




/* Ansicht Produkt-Liste 
----------------------------------------------------------------*/
.productlist .view-filters {
	background: #bbb;
  	border-radius: 10px;
  	padding: 0.5em;
}

.productlist .view-filters .form--inline {
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;	
  align-items: center;
}

.productlist .view-filters .js-form-item {
  display: inline-flex;
  flex-direction: column;
  float: none;
  margin: 0.2em;
  flex-grow: 1;    
  font-size: 1.0em;
  label {    
    margin-left:0.2em;    
  }
}

.productlist .view-filters .form-control {
  line-height: 1;
}

.productlist .view-filters .form-actions {
	clear:revert;
	background: #aaa;
  float: right;	
  margin:1.0em 0.5em 0.5em 0.5em;
}

.productlist .view-content{
	color: black;
	font-weight: normal;
  text-align: justify;
  -webkit-hyphens: auto; 
  hyphens: auto; 
  display: grid;
  grid-template-columns: repeat(2, 1fr);	
  ul {
    padding: 0px 18px;
    text-align:left;
   }
}

.productlist.views-table {
	margin: 20px 0px 0px 0px;
	border: 0px none #999;
	border-spacing: 0px;
}

.productlist-row {
	/* border: 10px none #bbb;
	vertical-align: top; */
  border: 1px solid #ddd ;
	border-radius: 10px;
	vertical-align: top;
	background:#eee;
	margin:0.5em;
	padding:0.5em;
}

.productlist-prodname {
	color: var(--stt-color);
	font-weight: bold;
	/* font-size: 1.2em;	 */
  font-size: 1.5em;	
  text-align: center;
  border-bottom: 2px solid var(--stt-color);
  margin-bottom: 0.5em;
}

.productlist-body, .productlist-suptagtypes, .productlist-supprotocols {
  margin-left: 1.0em;
  margin-top: 0.5em;
}

.productlist h1 {
  color: var(--stt-color);
  font-size: 1.6em;	
  font-weight: bold;
  padding: 10px;
  border-radius: 10px;
  text-align:center;
  background: #aaa;
}

.productlist-body p {
  -webkit-hyphens: auto; 
  hyphens: auto; 
  text-align: justify; 
  margin: 0px 0px;
}

.productlist-body h6 {
  font-size: 1.1em;
  font-weight: bold;
  font-style: italic;
}
.productlist-suptagtypes-label, .productlist-supprotocols-label {
  font-style: italic;
  margin: 0em 0em 0.0em 0em;
}
.productlist-img {
	border: 0px;
	/* text-align: right; */
  text-align: center;
	padding: 0px 0px 0px 0px;
	/* width: 250px; */
  clear: both;
  margin-left: 0.5em;
  /* float: right; */
}

.productlist-left {
	border: 0px;
	text-align: left; 
	padding: 6px;	
}

.productlist-left .field--name-title  {
	color: var(--stt-color);
	font-weight: bold;
	font-size: 1.8em;	
}

td.productlist-left {
	padding: 10px 6px; 	
}

@media (max-width: 615px) {
  .productlist .view-content {    
    grid-template-columns: repeat(1, 1fr);
  }
}

@media (min-width: 1200px) {
  .productlist .view-content {    
    grid-template-columns: repeat(3, 1fr);
  }
  .productlist-prodname {    
    font-size: 1.2em;	 
    border-bottom: 1px solid var(--stt-color);
  }
}



/* Ansicht Download-Liste 
----------------------------------------------------------------*/
.view-downloads .view-filters {
  background: #bbb;
  border-radius: 10px;
  padding: 0.5em;
  margin-bottom: 0.5em;
}

.view-downloads .form--inline {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;	
    align-items: center;
}

.view-downloads .view-filters .js-form-item {
    display: inline-flex;
    flex-direction: column;
    float: none;
    margin: 0.2em;
    flex-grow: 1;    
    label {
      font-size:0.8em;
      margin-left:0.2em;
    }
}

.view-downloads .view-filters .form-actions {
    margin:1.0em 0.5em 0.5em 0.5em;
    vertical-align: bottom;
    text-align: right;
}

.view-downloads .view-filters .form-select.form-control {
  line-height: 1;  
  width: fit-content;
  font-size: 1.0em;
}
.view-downloads .view-filters .form-text.form-control {
  line-height: 1;  
  padding: 4px;
}

#edit-submit-downloadbereich {
  right: 10px;	
	border-radius: 10px;
  padding: 5px 15px;
  background-color: var(--stt-color);  
}

.view-downloads .clearfix:after {
  display: inline-flex;
  content: none;
}

.view-downloads th{
    margin: 20px 0px 0px 0px;
    padding: 5px 5px 5px 10px;
    border: 0px none #999;
    border-spacing: 0px;
    background-color: var(--stt-color);    
    font-weight: bold;
    color: white;	
}

.table-downloads:nth-of-type(odd) {
    margin: 20px 0px 0px 0px;
    border: 0px none #999;
    border-spacing: 0px;
    background: #f4f4f4;	
}

.table-downloads:nth-of-type(even) {
    margin: 20px 0px 0px 0px;
    border: 0px none #999;
    border-spacing: 0px;
    background: #bbb;	
}

.table-downloads td {
    min-width: 100px;
}


/* Seite Produkt
------------------------------------------------------------- */
.product h1, .product h2 {
  color: var(--stt-color);
  font-weight: bold;
  font-size: 1.6em;	
  border-bottom: thin solid var(--stt-color);
}

.product p {
  -webkit-hyphens: auto; 
  hyphens: auto; 
}

.product.group-left .field--name-body {  
  /* clear: inline-start; */
 /*JK20250801 overflow: auto; */
}
/* .product.ds-2col-stacked-fluid.group-one-column > .group-left {

} */

.product.group-header {
  display: flow;
}

.product.group-header .field--name-field-image {
  text-align: right;
}

.product.group-header .field--name-field-image {
  float: right;
  width: 350px;
  margin-left: 0.5em;
}

@media (max-width: 770px) {
  .product.group-header .field--name-field-image {    
    width: 250px;
  }
}


.product.group-right {
  width: 40%;
}
.product.group-right img {
	width: 100%;
	height:auto;
}
.product .field--name-field-datenblatt {
  border-top: var(--stt-color) solid 1px;
  padding-top: 0.5em;
}

.ck-content h1,
.product .field--name-body h1{
  font-size: 1.2em;
  font-weight: 700;
  color: black;
  border-style: none;
}

.ck-content h2,
.product .field--name-body h2{
  font-size: 1.1em;
  font-weight: 700;
  color: black;
  border-style: none;
}

.ck-content h3,
.product .field--name-body h3{
  font-size: 1em;
  font-weight: 500;
  color: black;
  border-style: none;
}


.field--name-field-supportedtagtypes > .field__items {
  display: flex;
  flex-flow: row wrap;  
  align-content: flex-start;  
  margin-left: 1em;
}
.field--name-field-supportedtagtypes > .field__items > .field__item {
  margin-right: 0.5em;
}

.field--name-field-supportedtagtypes > .field__items > .field__item:not(:last-child)::after {
  content: ",";
}

.product .file {
  /* background-color: bisque; */
  float: right;
} 

.field.field--name-field-supportedtagtypes h2 {
  font-size: 1.1em;
  font-weight: 700;
  color: black;
  border-style: none;
}


#edit-field-supportedtagtypes {
  display: grid;
  grid-template-columns: repeat(3,auto);  
}

#edit-field-supportedtagtypes .form-item { 
  padding: 0.3em;
  margin: 0.5em;
  background-color: lightgrey; 
}

#edit-field-related-products {
  display: grid;
  grid-template-columns: repeat(4,auto);  
}

#edit-field-related-products .form-item { 
  padding: 0.3em;
}

#edit-field-related-products .form-item:nth-child(8n+1),
#edit-field-related-products .form-item:nth-child(8n+2),
#edit-field-related-products .form-item:nth-child(8n+3),
#edit-field-related-products .form-item:nth-child(8n+4) {
  background-color: lightgrey; 
}

/* Page Downloaded File 
------------------------------------------------------------- */
#edit-langcode-wrapper label {
  font-weight: bold;
  margin-right: 2em;
}

#edit-title-wrapper .form-item-title-0-value,
#edit-field-datei-wrapper .form-item-field-datei-0,
#edit-langcode-wrapper .form-item-langcode-0-value,
#edit-field-sichtbarkeit-wrapper fieldset,
.form-item-field-produktkategorie,
.form-item-field-produktkategorie2,
#edit-field-frequenz--wrapper,
#edit-field-doctype--wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;  
}

#edit-title-wrapper .form-text,
#edit-langcode-wrapper .form-select.form-control {
  width: 20em;
}

#edit-field-produktkategorie,
#edit-field-produktkategorie2 {
  width: 20rem;
  margin-right: 1em;
}

#edit-title-wrapper label,
#edit-field-datei-wrapper label,
#edit-langcode-wrapper label,
#edit-field-sichtbarkeit-wrapper legend,
#edit-field-produktkategorie-wrapper label,
#edit-field-produktkategorie2-wrapper label,
#edit-field-frequenz--wrapper legend,
#edit-field-doctype--wrapper legend,
#edit-field-related-products--wrapper legend {
  font-size: 110%;
  font-weight: bold;
  margin-right: 2em;
  width: 10rem;
}

#edit-field-sichtbarkeit,
#edit-field-frequenz,
#edit-field-doctype {
  display: grid;
  grid-template-columns: repeat(7,auto);  
  grid-gap: 1em;
  background: #e6e6e6;
  padding: 0px 10px;
}

#edit-field-summary-wrapper label,
#edit-field-description-wrapper label,
#edit-body-wrapper label,
#edit-field-body2-wrapper label {
  font-size: 110%;
  font-weight: bold;
  margin-right: 2em;
  width: 30em;
}

#edit-field-datenblatt-0--label,
#edit-field-image-0--label {
  font-size: 110%;
  font-weight: bold;
  margin-right: 2em;
  min-width: 6em;
}
#edit-field-image-wrapper .image-preview {
  margin-right: 1em;
}
#edit-field-image-wrapper .form-item {
 margin-top: 0.0em;
}

#edit-field-datenblatt-wrapper {
  background: #f0f0f0;
  padding: 0px 3px;
  border: 2px solid #ddd;
}

#edit-field-datenblatt-wrapper .form-item {
  display: flex;
  flex-direction: row;
}

#edit-field-datenblatt-wrapper .imce-filefield-widget,
#edit-field-datenblatt-0,
#edit-field-datenblatt-0--description {
  font-size: 1em;
  margin-left: 1em;
  margin-top: 2em;
}
#edit-field-image-wrapper .image-widget {
  display: flex;
  flex-direction: row;
  width: 100%;  
}

#edit-field-image-wrapper .image-widget-data {
  font-size: 1em;
  margin-left: 1em;
}

#edit-body-wrapper .description,
#edit-field-summary-wrapper .description,
#edit-field-image-wrapper .description,
#edit-field-datenblatt-wrapper .description {
  color: var(--stt-color);
  font-weight:normal;
  font-size: small;
}


#edit-field-related-products {
  display: grid;
  grid-template-columns: repeat(4,auto);  
}

#edit-field-related-products .form-item { 
  padding: 0.3em;
}

#edit-field-related-products .form-item:nth-child(8n+1),
#edit-field-related-products .form-item:nth-child(8n+2),
#edit-field-related-products .form-item:nth-child(8n+3),
#edit-field-related-products .form-item:nth-child(8n+4) {
  background-color: lightgrey; 
}


/* Blockansicht Related Downloads für die Produktseite
------------------------------------------------------------- */
.relateddownloads .view-header {
  /* border-top: var(--stt-color) solid 1px; */
  padding-top: 0.5em;
  font-weight: bold;
}

/* Newsletter / Artikel
------------------------------------------------------------- */
article.node--view-mode-teaser {  
  hyphens: auto;
  width: 100%
}


.newsletter {
  width: 100%;
  max-width: 800px;
  border: 0;
  font-family: Calibri, serif;
  font-size: medium;
}
.newsletter tr td, tr th {
	border: 0px solid #bbb;
    border: none;
	padding: 2px 1px 2px 1px;
}
.newsletter p {
	margin-block-start: 0.25em;
  margin-block-end: 0.25em;
  text-align: justify; 
  hyphens: auto; 
}
.newsletter img {
	max-height: 400px;
}

.newsletter h1 {
  background-color: var(--stt-color);   
  border-color: var(--stt-color);
  border-width: 2px;
  border-radius: 5px; 
  border-style: solid;
  color: white;
  margin-top: 8px;
  margin-bottom: 10px;
  padding: 0.5em;        
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
}


.newsletter h2 {
    color: var(--stt-color);
    background-color: lightgrey;
    border-bottom: solid;
    border-radius: 5px;
    margin: 0.5em 0em;    
    padding: 0.5em;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
}
.newsletter h3 {
    text-align: left;
    color: var(--stt-color);
    padding: 0.3em 0.5em;
    background-color: lightgray;  
    border-radius: 5px; 
    font-size: 1.2em;
    font-style: italic;
}


#newsletterhead {
	text-align: center;	
	border-width: 2px; 
	border-color: #005a8c; 
	border-radius: 5px; 
	background: #005a8c; 
	height: 50px;
	font-size: 1.5em;
	font-weight: bold;
	color: white;
}

#newsletterhead2 {
	text-align: center;	
	border-width: 2px; 
	border-radius: 5px; 
	background: #e0e0e0; 		
	color: black;
}

/* Footer region
-------------------------------------------------------------- */
#footer-wrapper {
  width: 100%; 
  max-width: 1100px;      
}

#footer {
  width: 100%; 
  max-width: 1100px;    
}

footer.node__meta {
  padding: 0;
  visibility: hidden;
  line-height: 8px;
}


/* footer {
  padding: 2rem 0;
  background-color: burlywood;
}

.region-header div {
  height: 66px;
  position: relative;
  width: 950px;
  margin: 0 auto;
} */

footer .region-footer {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.nav.navbar-nav[data-block="footer"] {
  display: flex;
  flex-direction: row;
  
}

/* 
block-b5subthemestt-powered-by-drupal {
 margin: 9px 0px 0px 50px;
}

.region-footer {
  display: flex;
  list-style: none;
  padding: 0;
  flex-direction: row;
} */