/*! style.css | (c) Dieter Schärf <ds@dschaerf.de> */

/* Design */
main h1 { font-size: 2em; font-variant: small-caps; font-weight: normal; letter-spacing: 0.1em; margin: 0.67em 0; }
main h2 { font-size: 1.5em; font-variant: small-caps; font-weight: normal; letter-spacing: 0.1em; margin: 0.83em 0; }
main h3 { font-size: 1.17em; margin: 1em 0; }
main h4 { font-size: 1em; margin: 1.33em 0; }
main h5 { font-size: 0.83em; margin: 1.67em 0; }
main h6 { font-size: 0.67em; margin: 2.33em 0; }
main ol,
main ul { padding-left: 2.5em; }
main li { margin: 0.75em 0; }
main > article h2 { margin-top: 1.33em; }
main > aside ul { padding-left: 1.5em; }
@media print {
	body > footer { border-top: thin solid currentColor; margin-top: 2em; }
}
@media screen {
	html { background: #264D73 url("./background.svg") center top no-repeat fixed; }
	body { background-color: #336699; box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.8); color: #FFFFFF; display: grid; grid-template-rows: auto 1fr auto; max-width: 64em; min-height: 100vh; }
	body > footer { background-color: #1A1A1A; color: #BFBFBF; padding: 0.25em 1.25em; }
	main { display: grid; grid-template-rows: auto 1fr; }
	main > div img { width: 90em; }
	main > article { min-width: 0; padding: 0.25em 1.25em; }
	main > article h1 { color: #EEE8AA; }
	main > aside { background-color: #FFFFFF; color: #1A1A1A; display: grid; gap: 0 2em; grid-template-columns: repeat(auto-fit, minmax(min(16em, 100%), 1fr)); padding: 0.25em 1.25em; }
	main > aside h2 { color: #336699; }
}
@media screen and (max-width: 79.9375em) {
	.with-sidebar main { grid-template-rows: auto 1fr auto; }
}
@media screen and (min-width: 80em) {
	.with-sidebar { max-width: 90em; }
	.with-sidebar main { grid-template-columns: 7fr 3fr; }
	.with-sidebar main > div { grid-column: 1 / -1; }
	.with-sidebar main > aside { align-self: start; border: medium solid #1A1A1A; border-radius: 1em; box-shadow: 0.5em 0.5em 0.5em 0 rgba(0,0,0,0.8); margin: 4em 2em 2em 2em; }
}


/* Navigation "Allgemeine Seiten" */
.commonpages ul { display: flex; flex-flow: row wrap; gap: 1em; justify-content: center; padding: 0; }
.commonpages ::marker { font-size: 0; }
@media (any-hover: hover) {
	.commonpages a:hover { color: #FFFFFF; }
}
/* Navigation "Hauptseiten inkl. Logo und Suche" */
.navigation { color: #F2F2F2; display: flex; flex-flow: row wrap; justify-content: space-between; }
.navigation ul { margin: 0; padding: 0; }
.navigation ::marker { font-size: 0; }
.navigation-logo { margin-right: auto; outline-offset: -0.375em; }
.navigation-logo img { width: 25.625em; }
.navigation-buttons { display: flex; margin-left: auto; }
.navigation-buttons a { outline-offset: -0.375em; text-align: center; width: 4em; }
.navigation-buttons [class*="icon-"] { font-size: 125%; line-height: 4; }
.navigation-hide,
.navigation-content { background-color: #4080BF; }
.navigation-content { width: 100%; }
.navigation-search { align-items: center; display: flex; justify-content: flex-end; margin: 1em 1.25em 0 1.25em; position: relative; }
.navigation-search input { background-color: #F2F2F2; border-style: none; border-radius: 0.375em; color: #1A1A1A; }
.navigation-search button { background-color: transparent; border-style: none; border-radius: 0 0.375em 0.375em 0; color: #1A1A1A; position: absolute; }
.navigation-menu { color: #EEE8AA; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(16em, 100%), 1fr)); }
.navigation-item { padding: 1em 1.25em; }
.navigation-item li { padding-top: 0.5em; }
.navigation-item li li { padding-left: 1.25em; }
.navigation-item > a { font-size: large; letter-spacing: 0.1em; text-transform: uppercase; }
.no-script .navigation:target .navigation-show,
.no-script .navigation:not(:target) .navigation-hide,
.no-script .navigation:not(:target) .navigation-content,
.script .navigation.open .navigation-show,
.script .navigation:not(.open) .navigation-hide,
.script .navigation:not(.open) .navigation-content { display: none; }
@media (any-hover: hover) {
	.navigation-buttons a:hover { background-color: #264D73; color: #FFFFFF; }
	.navigation-search button:hover { background-color: #D9D9D9; }
	.navigation-menu a:hover { color: #FFFFFF; }
}
/* Navigation "Inhaltsverzeichnis" */
/* Navigation "Seitennummerierung" */
.subpages { display: flex; flex-flow: row wrap; gap: 0.5em; justify-content: center; margin: 1em 0;  }
.subpages > *   { border: thin solid #EEE8AA; border-radius: 0.375em; color: #EEE8AA; line-height: 2.875em; text-align: center; width: 3em; }
.subpages > a { background-color: #EEE8AA; box-shadow: 0 0 0.375em rgba(0,0,0,0.8); color: #336699; text-decoration: none; }
@media (any-hover: hover) {
	.subpages > a:hover { background-color: #FFFFFF; border-color: #FFFFFF; color: #1A1A1A; }
}
/* Navigation "Sie sind hier" */
.you-are-here { display: flex; flex-flow: row wrap; margin: 1em 0; }
/* Navigation "Springe zum Hauptinhalt-Link" */
.skip-to-content { background-color: #EEE8AA; border-radius: 0 0 0.375em 0; box-shadow: 0 0 1em rgba(0,0,0,0.8); color: #336699; display: block; left: 0; padding: 0.75em 1.25em; position: fixed; text-align: center; text-decoration: none; top: 0; z-index: 99; }
.skip-to-content:not(:focus) { box-shadow: none; transform: translateY(-100%); transition: transform 0.5s ease-out; }
@media (any-hover: hover) {
	.skip-to-content:hover { background-color: #FFFFFF; color: #1A1A1A; }
}
/* Navigation "Springe zum Seitenanfang-Link" */
.skip-to-top { background-color: #EEE8AA; border-radius: 0.375em; bottom: 2em; box-shadow: 0 0 1em rgba(0,0,0,0.8); color: #336699; padding: 0.75em 1.25em; position: fixed; right: 2em; text-decoration: none; z-index: 99; }
.skip-to-top:not(:focus):not(:hover) { opacity: 0.54; }
@media (any-hover: hover) {
	.skip-to-top:hover { background-color: #FFFFFF; color: #1A1A1A; }
}
/* Navigation "Suchregister" */
.lookup { border-bottom: thin solid #EEE8AA; display: flex; flex-flow: row wrap; gap: 0.5em; justify-content: center; padding-bottom: 1em; margin: 1em 0;  }
.lookup > * { border: thin solid #EEE8AA; border-radius: 0.375em; color: #EEE8AA; line-height: 2.875em; text-align: center; width: 3em; }
.lookup > a { background-color: #EEE8AA; box-shadow: 0 0 0.375em rgba(0,0,0,0.8); color: #336699; text-decoration: none; }
@media (any-hover: hover) {
	.lookup > a:hover { background-color: #FFFFFF; border-color: #FFFFFF; color: #1A1A1A; }
}
/* Navigation "Weiter-/Zurück-Sequenz" */
.previous-next-sequence { display: flex; gap: 1em 2em; margin: 2em 0 1em 0; }
.previous-next-sequence a { background-color: #EEE8AA; border-radius: 0.375em; box-shadow: 0 0 1em rgba(0,0,0,0.8); color: #336699; padding: 0.75em 1.25em; text-decoration: none; }
.previous-next-sequence a[rel='next'] { text-align: right; }
@media screen and (max-width: 40em) {
	.previous-next-sequence { flex-direction: column; }
}
@media screen and (min-width: 40.0625em) {
	.previous-next-sequence a[rel='next'] { margin-left: auto; }
}
@media (any-hover: hover) {
	.previous-next-sequence a:hover { background-color: #FFFFFF; color: #1A1A1A; }
}


/* Absatztyp "Aufmacher (Standard)" */
.teaser { margin: 1em 0; }
.teaser ::marker { font-size: 0; }
.teaser h2,
.teaser h3 { font-size: 1.17em; font-variant: normal; font-weight: bold; letter-spacing: normal; margin: 1em 0; text-align: center; }
.teaser ul { padding: 0; }
.teaser li { margin: 1em 0; }
.teaser li > a { color: #EEE8AA; font-size: large; font-weight: bold; }
.teaser li > em { display: block; margin-top: 0.5em; }
.teaser li > img {  margin-bottom: 0.5em; }
article .teaser { background-color: #4080BF; border: medium solid #EEE8AA; padding: 0 1.25em; }
article .teaser li + li { border-top: thin solid #EEE8AA; padding-top: 1em; }
aside .teaser li > a { color: #336699; }
@media print and (min-width: 480.75pt), screen and (min-width: 42.5625em) {
	:not(.teaser-group) > .teaser li > img { float: right; margin-bottom: 0; margin-left: 2em; width: 30%; }
	:not(.teaser-group) > .teaser li > img + br { display: none; }
}
@media screen {
	.teaser-group { align-items: start; display: grid; gap: 1em 1.25em; grid-template-columns: repeat(auto-fit, minmax(min(16em, 100%), 1fr)); margin: 1em 0; }
	.teaser-group > .teaser { margin: 0; }
}
/* Absatztyp "Aufmacher (Als Galerie darstellen)" */
/* Absatztyp "Aufzählung" */
ol.emphasize ::marker,
ul.emphasize ::marker { color: #EEE8AA; }
ol.emphasize li,
ul.emphasize li { padding-left: 0.75em; }
/* Absatztyp "Formular" */
.form [type="email"],
.form [type="text"],
.form textarea { background-color: #F2F2F2; border: thin solid #1A1A1A; border-radius: 0.375em; color: #1A1A1A; }
.form :required { background-color: #FFFFFF; }
.form :required:not(:valid) { box-shadow: 0 0 1em rgba(0,0,0,0.8); }
.form button { background-color: #EEE8AA; border-style: none; border-radius: 0.375em; box-shadow: 0 0 1em rgba(0,0,0,0.8); color: #336699; }
@media (any-hover: hover) {
	.form button:hover { background-color: #FFFFFF; color: #1A1A1A; }
}
/* Absatztyp "Grafik" */
.picture { margin: 1em 0; text-align: center; }
main > article .picture img { width: 61.5em; }
main > aside .picture img { width: 40em; }
@media print {
	.picture figcaption { margin-top: 0.25em; }
}
@media screen {
	.picture figcaption { background-color: #FFFFFF; color: #1A1A1A; padding: 0.75em 1.25em; }
}
@media (any-hover: hover) {
	.picture:hover figcaption { background-color: #EEE8AA; }
}
/* Absatztyp "Medienclip" */
.movie { margin: 1em 0; text-align: center; }
.movie video { width: 61.5em; }
@media print {
	.movie figcaption { margin-top: 0.25em; }
}
@media screen {
	.movie figcaption { background-color: #FFFFFF; color: #1A1A1A; padding: 0.75em 1.25em; }
}
@media (any-hover: hover) {
	.movie:hover figcaption { background-color: #EEE8AA; }
}
/* Absatztyp "Registerkarte (Akkordeonbereich)" */
/* Absatztyp "Registerkarte (Registerbereich)" */
/* Absatztyp "Tabelle (Standard)" */
@media screen {
	table.border,
	table.borders td,
	table.borders th { border: thin solid #FFFFFF; }
	table.bordered tr { border-bottom: thin solid #FFFFFF; }
	table.striped { color: #1A1A1A; }
	table.striped thead tr { background-color: #EEE8AA; }
	table.striped tbody tr:nth-child(even) { background-color: #F2F2F2; }
	table.striped tbody tr:nth-child(odd) { background-color: #FFFFFF; }
}
@media (any-hover: hover) {
	table.hoverable tbody tr:hover { background-color: #EEE8AA; }
}
/* Absatztyp "Tabelle (Als Galerie darstellen)" */
/* Absatztyp "Text (Standard)" */
/* Absatztyp "Text (Mehrspaltig - Als Registerkarten)" */
/* Absatztyp "Text (Mehrspaltig - In Spalten nebeneinander)" */
.text-columns { align-items: start; display: grid; gap: 1em 2em; grid-template-columns: repeat(auto-fit, minmax(min(16em, 100%), 1fr)); margin: 1em 0; }
.text-columns > div > :first-child { margin-top: 0; }
.text-columns > div > :last-child { margin-bottom: 0; }
/* Absatztyp "Text (Quelltext)" */
/* Absatztyp "Text (Vorformatiert)" */
/* Absatztyp "Text (Zitat)" */


/* Absatzbild */
.sidepicture figcaption { font-size: smaller; text-align: center; }
.sidepicture img { width: 40em; }
@media print {
	.sidepicture figcaption { margin-top: 0.25em; }
}
@media print and (min-width: 480.75pt), screen and (min-width: 42.5625em) {
	.sidepicture-right { flex-direction: row-reverse; }
	[class^="sidepicture-"] { display: flex; gap: 0 2em; margin: 1em 0; }
	[class^="sidepicture-"] > * { align-self: start; flex: 0 0 65%; margin: 0; }
	[class^="sidepicture-"] > div > :first-child { margin-top: 0; }
	[class^="sidepicture-"] > div > :last-child { margin-bottom: 0; }
	[class^="sidepicture-"] .sidepicture { flex: 1 1 0%; }
}
@media screen {
	.sidepicture { margin: 1em 0; }
	.sidepicture figcaption { background-color: #FFFFFF; color: #1A1A1A; padding: 0.75em 1.25em; }
}
@media (any-hover: hover) {
	.sidepicture:hover figcaption { background-color: #EEE8AA; }
}


/* Querverweis */
.link { font-weight: bold; }
@media screen {
	.link { color: #EEE8AA; }
	aside .link { color: #336699; }
}
@media (any-hover: hover) {
	.link:hover { color: inherit; text-shadow: unset; }
}


/* Selektoren "Allgemein" */
/* Selektoren "Sonstige" */
