/* dnp DEPPING – statische Version, Gestaltung nach files/css/default-v4.css, responsiv erweitert */
:root{--blau:#43358c;--grau:#434f5f;--text:#222;--hell:#8b9295;--max:980px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;padding:0;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;font-size:14px;color:var(--text);line-height:1.5;background:#fff}
img{margin:0;padding:0;border:0;max-width:100%;height:auto;display:inline-block}
figure{margin:0}
p{font-size:12px;color:var(--text)}
#main p,#left p{text-align:justify}
h1,h4{margin:0;font-size:20px;color:var(--text);line-height:1.1;font-weight:lighter}
h2{margin:5px 0 0;font-size:17px;color:var(--grau);text-transform:uppercase;font-weight:lighter}
h3{margin:2px 0 0;font-size:12px;background:var(--grau);color:#fff;text-transform:uppercase;font-weight:lighter;padding:2px 5px}
ul{margin:0}
ul li{margin:10px 0 0;font-size:14px;color:var(--grau);list-style-type:disc}
a,a:link,a:visited{color:var(--blau);text-decoration:underline;text-transform:uppercase}
a:hover{color:var(--text)}
.blau{color:var(--blau)} .orange{color:var(--blau)}
.skip{position:absolute;left:-9999px;top:0;background:var(--blau);color:#fff!important;padding:8px 12px;z-index:1000}
.skip:focus{left:8px}

/* Layout */
#wrapper{max-width:var(--max);margin:0 auto;position:relative}
#header{position:relative;z-index:10}
#header .inside{position:relative}
#logo{position:absolute;top:5px;left:0;width:300px;height:110px;z-index:11}
#logo img{display:block}
#container{display:flex;flex-wrap:wrap;padding:20px 0 40px}
#main{flex:1 1 0;min-width:0}
.three-col #container{display:grid;grid-template-columns:300px 1fr 340px}
.two-col #container{display:grid;grid-template-columns:300px 1fr}
.two-col #left{order:1}.two-col #main{order:2}
.three-col #left{order:1}.three-col #main{order:2}.three-col #right{order:3}

.inlm{padding:0 10px 0 20px}
.inlr{padding:0 20px 0 10px}
.inlm-us{padding:0 20px;max-width:700px}
.inlm-us-980{padding:0 20px;max-width:980px}
.th-ra{padding:10px 8px 0 0;width:148px}
.block{overflow:hidden}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
table{table-layout:auto;border-collapse:collapse}
td{padding:3px 5px}

/* Header-Bilder, Slogan, Slider */
.header-content{padding-top:110px}
.header-pic img,.ce_image img{display:block;width:100%}
.header-slogan{width:100%;aspect-ratio:980/290;background-repeat:no-repeat;background-size:cover;background-position:center;position:relative}
.slogan{position:absolute;top:27%;left:41%;width:51%}
.slogan p{font-family:"Times New Roman",Times,serif;font-size:20px;color:#fff;text-align:justify;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.25)}
.flexslider{position:relative}
.flexslider .slides{list-style:none;margin:0;padding:0;position:relative;aspect-ratio:980/360;overflow:hidden}
.flexslider .slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1s ease;list-style:none}
.flexslider .slide.active{opacity:1;z-index:1}
.flexslider .slide img{width:100%;height:100%;object-fit:cover;display:block}
.flex-control-nav{position:absolute;bottom:14px;left:20px;margin:0;padding:0;z-index:3;text-align:left}
.flex-control-nav li{margin:0 6px 0 0;display:inline-block;list-style:none}
.flex-control-paging li button{width:11px;height:11px;display:block;background:#fff;border:0;padding:0;cursor:pointer;border-radius:20px;box-shadow:inset 0 0 3px rgba(0,0,0,.3)}
.flex-control-paging li button:hover,.flex-control-paging li button.flex-active{background:rgb(66,52,139)}

/* Hauptnavigation (Desktop) */
#mainnav{position:absolute;left:300px;top:60px;width:680px;height:30px;background:url(../../files/img/gen/bg-nav.png);z-index:500}
.hnav{list-style:none;margin:0;padding:0;height:30px;display:flex}
.hnav li{margin:0;list-style:none}
.hnav li.topli{position:relative}
.hnav a.top_link,.hnav a.top_link:link,.hnav a.top_link:visited{display:block;height:30px;line-height:28px;color:#fff;text-transform:uppercase;text-decoration:none;font-size:12px;font-weight:lighter;padding:0 10px 0 0}
.hnav a.top_link span{display:block;padding:0 8px;height:30px}
.hnav li:hover>a.top_link span,.hnav li:focus-within>a.top_link span,.hnav li.active>a.top_link span{background:var(--blau)}
.hnav ul.sub1{position:absolute;left:0;top:30px;min-width:280px;margin:0;padding:0;list-style:none;background:url(../../files/img/gen/bg-nav-80.png);white-space:nowrap;visibility:hidden;opacity:0;transition:opacity .15s;z-index:300}
.hnav li:hover>ul.sub1,.hnav li:focus-within>ul.sub1{visibility:visible;opacity:1}
.hnav ul.sub1 li{display:block;height:35px}
.hnav ul.sub1 a,.hnav ul.sub1 a:link,.hnav ul.sub1 a:visited{display:block;font-size:12px;height:35px;line-height:35px;padding:0 8px;color:#fff;text-transform:uppercase;text-decoration:none}
.hnav ul.sub1 a:hover,.hnav ul.sub1 a.active{background:var(--blau);color:#fff}
.subtoggle,.burger{display:none}

/* Sprachwechsler */
.mod_changelanguage{position:absolute;top:0;right:0;z-index:600}
ul.level_1{margin:0;padding:0;display:flex;gap:5px}
ul.level_1 li{list-style:none;margin:0}
ul.level_1 a,ul.level_1 a:link,ul.level_1 a:visited{display:block;padding:5px;font-size:14px;text-decoration:none;text-transform:none;color:var(--text);background:#eee}
ul.level_1 a:hover,ul.level_1 a.active{color:#fff;background:var(--blau)}

/* News */
.custom_news .inside{padding:0 0 40px}
.custom_news .inlm{padding:0 20px}
.news_short{max-width:540px;padding:30px 0}
.news_short h2 a,.news_short h2 a:link{text-decoration:none;text-transform:uppercase;color:var(--grau)}
.news_short .info,.layout_full .info{color:var(--hell);margin:0}
.ce_download a{text-transform:none}
.download-element a::before{content:"\2193\00a0"}

/* Verfahren (externe Abfrage) */
.verfahren-frame iframe{width:100%;max-width:570px;height:800px;border:0}

/* Footer */
#footer{width:100%;position:relative;background:linear-gradient(to top,var(--blau) 30px,#f6f6f6 30px);border-top:20px solid #fff;padding:4px 0 54px;color:var(--text)}
.footer-in{max-width:970px;margin:0 auto;padding:0 5px}
.footer-std table{width:100%}
td.std{width:225px;padding:20px 10px 0;vertical-align:top}
td.std h3{background:transparent;padding:0;color:var(--grau)}
.footer-std p{margin:8px 0 0}
ul.footernav a,ul.footernav a:link,ul.footernav a:visited{color:#fff;text-decoration:none}
ul.footernav a:hover{text-decoration:underline}
ul.footernav{position:absolute;left:0;right:0;bottom:0;max-width:970px;margin:0 auto;padding:0 15px;height:30px;display:flex;align-items:center;flex-wrap:wrap;gap:0 20px}
ul.footernav li{list-style:none;margin:0;font-size:11px;color:#fff;text-transform:uppercase}

/* ---------- Tablet & Smartphone ---------- */
@media (max-width:1000px){
  #wrapper{max-width:100%}
  #header .inside{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:8px 16px 0}
  #logo{position:static;width:auto;height:auto;flex:0 1 220px;order:1}
  #logo img{width:100%;max-width:220px;height:auto}
  .mod_changelanguage{position:static;order:2;margin-left:auto;margin-right:10px}
  .burger{display:flex;flex-direction:column;justify-content:center;gap:5px;order:3;width:46px;height:46px;background:var(--grau);border:0;cursor:pointer;padding:12px}
  .burger span{display:block;height:2px;background:#fff;transition:.2s}
  .burger em{position:absolute;left:-9999px}
  .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  #mainnav{position:static;order:4;flex:1 0 100%;width:auto;height:auto;margin:8px -16px 0;background:var(--grau);display:none}
  #mainnav.open{display:block}
  .hnav{flex-direction:column;height:auto}
  .hnav li.topli{display:flex;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.15)}
  .hnav a.top_link,.hnav a.top_link:link{flex:1;height:auto;line-height:1.4;padding:0;font-size:14px}
  .hnav a.top_link span{height:auto;padding:13px 16px}
  .subtoggle{display:block;width:52px;background:transparent;border:0;border-left:1px solid rgba(255,255,255,.15);color:#fff;font-size:22px;cursor:pointer}
  .subtoggle::before{content:"+"}
  .subtoggle[aria-expanded="true"]::before{content:"\2013"}
  .hnav ul.sub1{position:static;flex:1 0 100%;visibility:visible;opacity:1;display:none;min-width:0;white-space:normal;background:rgba(0,0,0,.18)}
  .hnav li:hover>ul.sub1{display:none}
  .hnav li.open>ul.sub1{display:block}
  .hnav ul.sub1 li{height:auto}
  .hnav ul.sub1 a,.hnav ul.sub1 a:link{height:auto;line-height:1.4;padding:11px 16px 11px 30px;font-size:13px}
  .header-content{padding-top:12px;flex:1 0 100%;margin:0 -16px;order:5}
  .three-col #container,.two-col #container{grid-template-columns:1fr 1fr}
  .two-col #main{order:1;grid-column:1/-1}.two-col #left{order:2;grid-column:1/-1}
  .three-col #main{order:1}.three-col #left{order:2;grid-column:1/-1}.three-col #right{order:3}
  .inlm,.inlr,.inlm-us,.inlm-us-980{padding:0 16px;max-width:none}
  .three-col #left .inlm{padding-top:20px}
  .slogan{left:8%;width:84%;top:50%;transform:translateY(-50%)}
  .slogan p{font-size:clamp(14px,2.4vw,20px)}
  #main p,#left p{text-align:left}
  p,ul li{font-size:15px}
}
@media (max-width:640px){
  .three-col #container,.two-col #container{display:block}
  .three-col #container>*{margin-bottom:24px}
  #logo{flex-basis:170px}
  .slogan p{font-size:13px;line-height:1.35}
  .header-slogan{aspect-ratio:auto;min-height:170px}
  .th-ra{width:calc(50% - 8px)}
  .footer-std table,.footer-std tbody,.footer-std tr,.footer-std td{display:block;width:100%}
  td.std{padding:14px 10px 0}
  .verfahren-frame iframe{height:900px}
  h1,h4{font-size:22px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}