@supports (hyphens: auto) {
  body {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
    font-family: 'Calibri';
  }
}

p, div { font-size: 1em; font-weight: 400; text-align: left; -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
/* Seitenüberschrift Thema */
h1 {font-size: 2.1em; font-weight:600; text-align: center;}
  @media screen and (max-width: 50em) {h1 {font-size: 1.6em; line-height: 1.2; font-weight:600;}}
  @media screen and (max-width: 30em) {h1 {font-size: 1.3em; line-height: 1.1; font-weight:600;}}
/* zwischenüberschrift Thema und Teaser Pagination */
h2 {font-size: 1.5em; font-weight:600; text-align: left;}
  @media screen and (max-width: 50em) {h2 {font-size: 1.2em; line-height: 1.2; font-weight:600;}}
  @media screen and (max-width: 30em) {h2 {font-size: 1.1em; line-height: 1.1; font-weight:600;}}
/* Kastenüberschrift Sidebar */
h3 {font-size: 1.2em; font-weight:600; text-align: center;}
  @media screen and (max-width: 50em) {h3 {font-size: 1.2em; line-height: 1.2; font-weight:500;}}
  @media screen and (max-width: 30em) {h3 {font-size: 1.0em; line-height: 1.1; font-weight:500;}}
/* Kastenüberschrift Abstracts */
h3.diagramm {font-size: 1.2em; font-weight:700; text-align: center; color: #084B8A;}
  @media screen and (max-width: 50em) {h3 {font-size: 1.2em; line-height: 1.2; font-weight:600;}}
  @media screen and (max-width: 30em) {h3 {font-size: 1.0em; line-height: 1.1; font-weight:600;}}
/* Überschrift Teaser bei AUCH INTERESSANT */
h4 {font-size: 1.0em; font-weight:700; text-align: center;}
  @media screen and (max-width: 50em) {h4 {font-size: 1.0em; line-height: 1.2; font-weight:600;}}
  @media screen and (max-width: 30em) {h4 {font-size: 1.0em; line-height: 1.1; font-weight:600;}}
/* Zentrieren */
.center_container { display: flex; justify-content: center; align-items: center; }
.center { display: block; margin-left: auto; margin-right: auto; }
/* Links */
.textlink { color: #2E9AFE; text-decoration-line: underline; text-decoration-style: dotted; }
.link_weiter { color: #008CBA;  text-decoration: none; font-family: 'Calibri'; font-size: 1em; font-weight: 400; text-align: left; -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
.link_weiter:hover { text-decoration: underline; }
.link_weiter::before { content: "\025B8";  text-decoration: none; }
/* Textformatierungen */
.anzeige_hl { font-size: 1em; font-weight: 400; color: grey; text-align: center; margin-top: -2px;}
/* Newsletter-Styles */
form { width: 30em; padding-top: 3em; position: relative; }
input {  margin: 0 0 1em 31%; padding: .2em .5em; width: 50%; background-color: #fffbf0; border: 1px solid #e7c157; }
label { text-align: right; line-height: 1.5; width: 30%; position: absolute; left: 0; }
label::after { content: ": "; }
button { margin-left: 31%; }
input:required + label::before { position: absolute; left: 280%; content: "★"; color: red; }
input:required:valid + label::before { content: "✔"; color: green; }
/* Cookie-Styles */
.cc_container .cc_btn { background-color: #e4e4e4 !important; /* Farbe des Buttons */ color: #000 !important; /* Textfarbe des Buttons */ }
.cc_container { background: #1f6888 !important; /* Hintergrundfarbe des gesamten Bereichs */ color: #fdfdfd !important; /* Schriftfarbe des gesamten Bereichs */ }
.cc_container a { color: #31a8f0 !important; /* Textlink-Farbe "Mehr Infos" */ }
/* Boxen-Styles */
/* Redaktion */
.box { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin-left: 16px; margin-right: 16px; padding-bottom: 8px; }
.boxitem { margin: 8px; width: 400px; }
/* Diagramme nebeneinander */
.diagrammbox { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; background: white; }
.diagrammboxitem { width: 400px; background: white; padding: 8px; }
