@font-face { font-family: "Bitter"; font-style: normal; src: url("../fonts/Bitter/Bitter-VariableFont_wght.ttf");}
@font-face { font-family: "Bitter"; font-style: italic; src: url("../fonts/Bitter/Bitter-Italic-VariableFont_wght.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 100; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Thin.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 100; src: url("../fonts/Barlow_Condensed/BarlowCondensed-ThinItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 200; src: url("../fonts/Barlow_Condensed/BarlowCondensed-ExtraLight.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 200; src: url("../fonts/Barlow_Condensed/BarlowCondensed-ExtraLightItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 300; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Light.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 300; src: url("../fonts/Barlow_Condensed/BarlowCondensed-LightItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Regular.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 400; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Italic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Medium.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 500; src: url("../fonts/Barlow_Condensed/BarlowCondensed-MediumItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; src: url("../fonts/Barlow_Condensed/BarlowCondensed-SemiBold.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 600; src: url("../fonts/Barlow_Condensed/BarlowCondensed-SemiBoldItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 700; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Bold.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 700; src: url("../fonts/Barlow_Condensed/BarlowCondensed-BoldItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 800; src: url("../fonts/Barlow_Condensed/BarlowCondensed-ExtraBold.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 800; src: url("../fonts/Barlow_Condensed/BarlowCondensed-ExtraBoldItalic.ttf");}
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 900; src: url("../fonts/Barlow_Condensed/BarlowCondensed-Black.ttf");}
@font-face { font-family: "Barlow"; font-style: italic; font-weight: 900; src: url("../fonts/Barlow_Condensed/BarlowCondensed-BlackItalic.ttf");}

html, body { height: 100%; }

html { font-family: "Bitter"; font-style: normal; font-weight: 400; font-size: 100%; #font-size: .8vw; line-height: 1.5; }

body { font-size: 1.125rem; font-size: 1rem; color: #000000aa; color: #ffffffee; }

h1,h2,h3,h4 { font-family: "Barlow"; font-weight: 600; letter-spacing: .03em; color: #fff; }

img { display: block; }
a { color: inherit; }

.barlow { font-family: "Barlow"; }

.hellblau { color: #00ccff; }
.dunkelblau { color: #006699; }
.schwarzblau { color: #173557; }
.rot { color: #cc0000; }

.toggler { font-family: "Barlow"; font-size: 1.3em; font-weight: 500; letter-spacing: .03em; cursor: pointer; }
.toggler:hover { color: #ff6666; transition: .5s; }
.toggler .ui-icon-triangle-1-s:before { content: "<"; }
.toggler .ui-icon-triangle-1-e:before { content: ">"; }

.more,
.back { font-family: "Barlow"; }

nav ul { list-style: none; padding-left: 0; }
nav a { text-decoration: none; transition: .4s; }
nav strong,
nav a:hover { color: #ff6666; font-weight: inherit; transition: .5s; }
.page-19 a[title="News"] { color: #ff6666; }

#switch { position: fixed; top: 0; left: 2%; color: #fff; font-size: 3em; z-index: 1; display: none; }
#burger a { text-decoration: none; text-shadow: 3px 3px 5px #000000cc; }

#wrapper { height: 100%; display: grid; grid-template-rows: auto auto 1fr auto; }

#container { background-image: repeating-conic-gradient(transparent 0 15deg, #ffffff0a 16deg 29deg), linear-gradient(225deg, #00ccff, rgb(0,114,179)); background-image: repeating-conic-gradient(transparent 0 15deg, #ffffff0a 16deg 29deg), linear-gradient(225deg, #0093b8, #0072b3); }

#header img { width: 100%; }
#header #logo img { position: absolute; bottom: 4.5%; right: 2%; width: 10%; height: auto; }

#hmenu { position: relative; width: 100%; z-index: 1; }
#hmenu.sticky { position: fixed; }
#hauptmenu .level_1 { margin: .4em 0; font-family: "Barlow"; font-size: 1.444em; font-weight: 500; letter-spacing: .02em; display: flex; #justify-content: space-between; }
#hauptmenu .level_1 li { margin-right: 2em; }
#hauptmenu .level_2 { position: absolute; display: none; opacity: 0; font-size: .857em; background: #173557d0; padding: .5em 1em 1em; margin-left: -1em; border-radius: .3em; box-shadow: 5px 5px 15px #17355766; transition: .5s; }
#hauptmenu .submenu:hover .level_2 { display: block; opacity: 1; transition: .5s; }
#hauptmenu a.submenu.trail { color: #ff6666; }

#hmenu>.inside,
#main>.inside,
#footer>.inside { max-width: 1440px; margin: 0 auto; padding: .2em 5%; }
#main>.inside { min-height: 80vh; padding-bottom: 2em; }
#main>.inside>.mod_article { border-bottom: 1px dotted #17355766; padding-bottom: 1em; margin-bottom: .5em; }
#main>.inside>.mod_article:last-child { border-bottom: none; }

#hmenu,
#footer { background: #173557; color: #fff; box-shadow: 0 5px 15px #17355766; }

.rs-column.-large-first-row { margin-top: 0; }
    
.float_left, .media--left>figure { margin: 1.2em 2em 1em 0; }
.media--right figure { margin: 1.2em 0 1em 2em; }

.layout_short { margin-bottom: 2em; }
.layout_short h3,
.layout_short p { margin: 0; }
.layout_short h3 a { text-decoration: none; }
time { font-size: .8em; }
.autor { display: none; }
p.more,
p.back,
p.empty { font-family: "Barlow"; margin-top: 1em; }
.more a,
.back a { text-decoration: none; }

.ce_gallery>ul li, .content-gallery>ul li { float: none; }
.content-gallery ul { display: flex; justify-content: space-between; flex-wrap: wrap; }
.content-gallery--cols-2 li { width: 50%; }
.content-gallery--cols-3 li { width: 33%; }
.content-gallery--cols-4 li { width: 25%; }
.content-gallery--cols-5 li { width: 20%; }
#container .mod_article figure img { box-shadow: 2px 2px 5px #00000033; width: 100%; border: 1px solid #17355766; }
#container .mod_article figcaption { font-family: "Barlow"; padding-top: .1em; }

.mod_newslist .info,
.layout_full .info { display: none; }
.layout_full .media--left figure { max-width: 50%; }

.mod_newslist { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 1rem; }
.mod_newslist>div { padding: 1rem; background: #f1f2f633; background: #0078a5; border-radius: .4rem; }
.mod_newslist h2 { margin-bottom: .5em; }
.mod_newslist h2 a { text-decoration: none; }
.mod_newslist figure { min-width: 100%; padding-bottom: 0 !important; }

.pagination ul { display: flex; gap: 1rem; }

#mitglieder .mod_newslist { grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 1rem;  }
#mitglieder .mod_newslist>div { padding: .5rem; }
#mitglieder figure { padding-bottom: 0 !important; }
#mitglieder figcaption { display: none; }
#mitglieder h2 { margin-top: 0; margin-bottom: 0; }
#mitglieder .more { display: none; margin-top: 0; }
#mitglied figure { max-width: 50%; }

/* Reden */
.reden object { width: 100%; height: 25em; }


@media (max-width: 2400px) {
  html { font-size: .9vw; }
}
@media (max-width: 2000px) {
  html { font-size: 1vw; }
}
@media (max-width: 1800px) {
  html { font-size: 1.2vw; }
}
@media (max-width: 1400px) {
  html { font-size: 1.4vw; }
}
@media (max-width: 1200px) {
  html { font-size: 1.5vw; }
}
@media (max-width: 960px) {
  html { font-size: 1.6vw; }
  #header { border-bottom: .3em solid #173557; }
  #container { margin-top: 0 !important; }
  #switch { display: block; }
  #hmenu { display: none; }
  .xcontent-gallery--cols-3 li { width: 49%; }
  .content-gallery li { width: 49%; }
}
@media (max-width: 850px) {
  html { font-size: 2vw; }
}
@media (max-width: 720px) {
  html { font-size: 2.2vw; }
}
@media (max-width: 650px) {
  html { font-size: 2.6vw; }
}
@media (max-width: 560px) {
  html { font-size: 3vw; }
  .xcontent-gallery--cols-3 li { width: 100%; }
  .content-gallery li { width: 100%; }
}