@charset "utf-8";
/* CSS Document */

/* Fokus-Grundstyles */
:focus-visible { outline: 3px solid #C72D18; outline-offset: 2px; }
.focusable-icon { display: inline-block; width: 90px; height: 90px; }

/* Barrierefrei Button Variablen (Original-Position) ================================================== */
:root {
  --btn-size: 60px;
  --btn-color: #C72D18;
  --btn-icon-size: 35px;
  --btn-border-width: 3px;
  --btn-border-hover: #ffffff;
  --btn-focus-ring: rgba(255, 204, 0, 0.5);
  --btn-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --btn-shadow-hover: 0 6px 16px rgba(0, 0, 0, 0.4);
  --btn-shadow-active: 0 3px 8px rgba(0, 0, 0, 0.4);
  --shimmer-color: rgba(255, 255, 255, 0.3);
  --shimmer-speed: 1s;
}
/* Assist-Switch Variablen (Original-Position) ================================================== */
:root {
  --icon-color: #333;
  --assist-slider-w: 150px;
  --assist-slider-h: 30px;
  --assist-knob-size: 22px;
  --assist-spacing: 3px;
  --assist-label-font-size: 18px;
  --assist-label-spacing: 15px;
  --assist-bg-off: #e6e6e6;
  --assist-bg-on: #C72D18;
  --assist-bg-shade: inset 0 2px 4px rgba(0,0,0,0.1);  
  --assist-knob-bg: #fff;
  --assist-knob-shade: 0 2px 4px rgba(0,0,0,0.2);  
  --assist-knob-border: rgba(0,0,0,0.2);
  --assist-label-font-family: Arial, Helvetica, sans-serif;
  --assist-label-color: #333;
  --assist-transition: .4s;  
  --switch-knob-offset-x: var(--assist-spacing);  
  --switch-knob-offset-y: var(--assist-spacing);  
  --switch-knob-translate: calc(
    var(--assist-slider-w)
    - var(--assist-knob-size)
    - var(--switch-knob-offset-x) * 3
  );
}

/* Assist-Button Styles (Original-Position) ================================================== */
.assist-button { position: fixed; z-index:900; bottom: 20px; right: 20px; width: var(--btn-size); height: var(--btn-size); background-color: var(--btn-color); border: var(--btn-border-width) solid transparent; border-radius: 50%; box-shadow: var(--btn-shadow); display: flex; align-items: center; 
    justify-content: center; cursor: pointer; transition: all 0.3s ease, opacity 0.3s ease, transform 0.3s ease; outline: none; overflow: hidden; }
.assist-button::before { content: ""; position: absolute; top: 0; left: -75%; width: 150%; height: 100%; background: linear-gradient(120deg, rgba(255,255,255,0) 0%, var(--shimmer-color) 50%, rgba(255,255,255,0) 100%); transform: skewX(-20deg); pointer-events: none; }
.assist-button:hover::before { animation: shimmer var(--shimmer-speed) forwards; }
@keyframes shimmer { 0% { left: -75%; } 100% { left: 100%; } }
.assist-button img { width: var(--btn-icon-size); height: var(--btn-icon-size); z-index: 1; pointer-events: none; user-select: none; }
.assist-button:hover { box-shadow: var(--btn-shadow-hover); border-color: var(--btn-border-hover); }
.assist-button:active { transform: scale(0.95); box-shadow: var(--btn-shadow-active); }
.assist-button:focus-visible { border-color: #ffcc00; box-shadow: 0 0 0 4px var(--btn-focus-ring); }

/* Assist-Switch Grundaufbau (Original-Position) ================================================== */
.assist-switch { display: inline-flex; align-items: center; cursor: pointer; user-select: none; position: relative; }
.assist-switch span { font-size: var(--assist-label-font-size); font-family: var(--assist-label-font-family); color: var(--assist-label-color); margin-right: var(--assist-label-spacing); }
.assist-switch input { position: absolute; top: 0; left: 0; width: var(--assist-slider-w); height: var(--assist-slider-h); margin: 0; padding: 0; opacity: 0; cursor: pointer; z-index: 2;}
.assist-switch .slider { display: block; width: var(--assist-slider-w); height: var(--assist-slider-h); background-color: var(--assist-bg-off); border-radius: var(--assist-slider-h); box-shadow: var(--assist-bg-shade); transition: background-color var(--assist-transition), box-shadow var(--assist-transition); position: relative; }
.assist-switch .slider::before { content: ""; position: absolute; width: var(--assist-knob-size); height: var(--assist-knob-size); left: var(--switch-knob-offset-x); bottom: var(--switch-knob-offset-y); background-color: var(--assist-knob-bg); border-radius: 50%; box-shadow: var(--assist-knob-shade); border: 2px solid var(--assist-knob-border); transition: transform var(--assist-transition), background-color var(--assist-transition); }
.assist-switch:hover input:not(:checked) + .slider::before { background-color: var(--assist-bg-on); }
.assist-switch:hover input:checked + .slider::before { background-color: #eeeeee; }
.assist-switch input:checked + .slider { background-color: var(--assist-bg-on); box-shadow: inset 0 4px 8px rgba(0,0,0,0.3); }
.assist-switch input:checked + .slider::before { transform: translateX(var(--switch-knob-translate)); }
.assist-switch input:focus + .slider { outline: 3px solid #C72D18; outline-offset: 2px; }
.assist-switch .material-icons {font-family: 'Material Icons';font-size:20px;vertical-align:middle;margin-left:5px}

/* Assist-Switch Slider im Menü (Original-Position) ================================================== */
#switchMenu .assist-range { display: inline-flex; align-items: center; gap: var(--assist-label-spacing,0px); align-self: flex-end; margin-bottom: 0em; }

#switchMenu .assist-range > span:first-child { font-size: var(--assist-label-font-size,18px); font-family: var(--assist-label-font-family); color: var(--assist-label-color,#333); }
#switchMenu .assist-range .material-icons { font-family: 'Material Icons'; font-size: 20px; vertical-align: middle; margin-left: 5px; }
#switchMenu .assist-range input[type="range"] { -webkit-appearance: none; width: var(--assist-slider-w,150px); height: var(--assist-slider-h,30px); background: var(--assist-bg-off,#e6e6e6); border-radius: var(--assist-slider-h,30px); box-shadow: var(--assist-bg-shade); cursor: pointer; transition: background var(--assist-transition,.4s); }
.assist-switch input { position: absolute; top: 0; left: 0; width: var(--assist-slider-w); height: var(--assist-slider-h); margin: 0; padding: 0; opacity: 0; cursor: pointer; z-index: 2; }
.assist-switch input:focus + .slider { outline: 3px solid #C72D18; outline-offset: 2px; }
.assist-range input[type="range"]:focus { outline: 3px solid #C72D18; outline-offset: 2px; }
#switchMenu .assist-range input[type="range"]:hover { background: var(--assist-bg-on,#C72D18); }
#switchMenu .assist-range input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: var(--assist-knob-size,22px); height: var(--assist-knob-size,22px); background: var(--assist-knob-bg,#fff); border: 2px solid var(--assist-knob-border,rgba(0,0,0,0.2)); 
 border-radius: 50%; box-shadow: var(--assist-knob-shade); margin-top: calc((var(--assist-slider-h,30px) - var(--assist-knob-size,22px)) / -2); transition: transform var(--assist-transition,.4s); }
#switchMenu .assist-range input[type="range"]:active::-webkit-slider-thumb { transform: scale(1.1); }
#switchMenu .assist-range input[type="range"]::-moz-range-thumb { width: var(--assist-knob-size,22px); height: var(--assist-knob-size,22px); background: var(--assist-knob-bg,#fff); border: 2px solid var(--assist-knob-border,rgba(0,0,0,0.2)); border-radius: 50%; box-shadow: var(--assist-knob-shade); transition: transform var(--assist-transition,.4s); }
#switchMenu .assist-range input[type="range"]:active::-moz-range-thumb { transform: scale(1.1); }
#switchMenu .assist-range { position: static !important; margin-left: auto; margin-right: 1rem; }

/* --- Slider-Override: Track-Höhe & Thumb-Größe auf Switch-Maße setzen (Original-Position) --- */
#switchMenu input[type="range"] { height: var(--assist-slider-h) !important;  }
#switchMenu input[type="range"]::-webkit-slider-runnable-track { height: var(--assist-slider-h) !important; border-radius: var(--assist-slider-h) !important; }
#switchMenu input[type="range"]::-moz-range-track { height: var(--assist-slider-h) !important; border-radius: var(--assist-slider-h) !important; }

#switchMenu input[type="range"]::-webkit-slider-thumb,
#switchMenu input[type="range"]::-moz-range-thumb { box-sizing: border-box; width: var(--assist-knob-size) !important; height: var(--assist-knob-size) !important; margin-top: calc((var(--assist-slider-h) - var(--assist-knob-size)) / -2) !important; }
/* --- Filter-Slider links bündig mit Checkbox-Thumbs ausrichten (Original-Position) --- */
#switchMenu .assist-range input[type="range"] {/* Track um die halbe Thumb-Breite einrücken */ padding-left: calc(var(--assist-knob-size) / 3);box-sizing: border-box;}
#switchMenu .assist-range input[type="range"] {padding-left: calc(var(--switch-knob-offset-x) + 2px) !important; padding-right: var(--switch-knob-offset-x) !important; box-sizing: border-box;}
/* Chrome-Slider-Thumb vertikal nach unten verschieben */
#switchMenu .assist-range input[type="range"]::-webkit-slider-thumb { position: relative; top: 8px !important;}
/* Firefox-Thumb wie gehabt zentrieren */
#switchMenu .assist-range input[type="range"]::-moz-range-thumb { margin-top: calc((var(--assist-slider-h) - var(--assist-knob-size)) / -2) !important; }

/* Helligkeits-Slider (Original-Position) ================================================== */
#switchMenu .assist-range input#brightness-slider[type="range"]::-webkit-slider-thumb, #switchMenu .assist-range input#brightness-slider[type="range"]::-moz-range-thumb { -webkit-appearance:none; width:var(--assist-knob-size,22px); height:var(--assist-knob-size,22px); background:var(--assist-knob-bg,#fff); border:2px solid var(--assist-knob-border,rgba(0,0,0,0.2)); border-radius:50%; box-shadow: var(--assist-knob-shade); margin-top:calc((var(--assist-slider-h,30px)-var(--assist-knob-size,22px))/-2); transition:transform var(--assist-transition,.4s); }
#switchMenu .assist-range input#brightness-slider[type="range"]:hover::-webkit-slider-thumb, #switchMenu .assist-range input#brightness-slider[type="range"]:hover::-moz-range-thumb, #switchMenu .assist-range input#brightness-slider[type="range"]:active::-webkit-slider-thumb, #switchMenu .assist-range input#brightness-slider[type="range"]:active::-moz-range-thumb { background: var(--assist-knob-bg,#fff); border-color: var(--assist-knob-border,rgba(0,0,0,0.2)); }

#switchMenu .assist-range input#brightness-slider[type="range"]:active::-webkit-slider-thumb, #switchMenu .assist-range input#brightness-slider[type="range"]:active::-moz-range-thumb { transform:scale(1.1); }
#switchMenu .assist-range input#brightness-slider[type="range"]:hover::-webkit-slider-thumb,
#switchMenu .assist-range input#brightness-slider[type="range"]::-moz-range-thumb,
#switchMenu .assist-range input#brightness-slider[type="range"]:active::-webkit-slider-thumb,
#switchMenu .assist-range input#brightness-slider[type="range"]:active::-moz-range-thumb { background: var(--assist-knob-bg); border-color: var(--assist-knob-border); }

/* Switch-Menü Liste (Original-Position) ================================================== */
#switchBox { width: 100%; max-width:600px;  margin: 0 auto 1em; padding: 1em; }
#switchMenu { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: flex-end; }
#switchMenu > li { margin-bottom: 0.5em; }

/* Barrierefrei Hauptmenü Container (Original-Position) ================================================== */
#sideMenuBox {  margin-top:10px; padding:10px; border-radius:8px; z-index:1000; background-color: rgba(238, 238, 238, 0.0);  }
#barrierBox { display: none; position: absolute; top:20px; right:20px; z-index:999; max-width:800px; text-align: center; font-size: 20px; font-weight:700; font-family:Arial, Helvetica, sans-serif; color: #333; padding: 20px 0; background-color: rgba(238, 238, 238, 0.9); border-radius: 20px;  
              border: 2px solid rgba(255, 255, 255, 0.8); box-shadow: 8px 8px 16px rgba(50,50, 50, 0.1),  -8px -8px 16px rgba(85,85, 85, 0.7);-webkit-font-smoothing: antialiased; outline: none; margin: 30px auto; }
#barrierMenu { list-style-type: none; padding: 30px; margin: 0 auto; width: 100%; }
#barrierMenu > li { margin: 5px; }
#barrierMenu > li > a:focus { background-color:#c0c0c0; color:#000; outline:2px solid #000; }
.b-title {text-align: center; font-size: 22px; font-weight:700; font-family:Arial, Helvetica, sans-serif; color: #333; }
.b-txt1  {text-align: center; font-size: 18px; font-weight:500; font-family:Arial, Helvetica, sans-serif; color: #333; }

/* BarrierBox Icon (Original-Position) */
.bf-icon { position:absolute; top:10px; left:20px; width:50px; height:50px; background: url("../layout/icons/bf-icon1.svg") no-repeat center center; background-size: contain;}

/* Gemeinsame Button-Styles in BarrierBox (Original-Position) */
#barrierMenu > li > a,
#toggleItems > li > a { display:block; width:calc(85% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; background:#e0e0e0; border-radius:10px; box-shadow:3px 3px 6px rgba(0,0,0,0.1), -3px -3px 6px rgba(255,255,255,0.7);
  color:#333; font-family: Arial, Helvetica, sans-serif; font-weight:600; text-align:center; text-decoration:none; font-size:18px; transition:box-shadow 0.2s ease, transform 0.1s ease }

/* Spezieller Close-Button (Original-Position) */
#barrierMenu > li > a#closeMenuLink { background: #cccccc }

/* Button Interaktionen (Original-Position) */
#barrierMenu > li > a:hover,
#toggleItems > li > a:hover { box-shadow:5px 5px 8px rgba(0,0,0,0.15), -5px -5px 8px rgba(255,255,255,0.8); transform: translateY(-1px);}
#barrierMenu > li > a:active, #toggleItems > li > a:active { box-shadow: inset 2px 2px 4px rgba(0,0,0,0.1), inset -2px -2px 4px rgba(255,255,255,0.7); transform: translateY(0) }
#barrierMenu > li > a:focus,
#toggleItems > li > a:focus { outline: 2px solid #C72D18; outline-offset: 3px }
#barrierMenu, #barrierMenu ul { list-style: none; margin: 0; padding: 0; }

/* ToggleItems Liste (Original-Position) ================================================== */
#toggleItems { max-height: 0; opacity: 0; overflow: hidden;  transition: max-height 0.3s ease, opacity 0.3s ease;}
#barrierMenu.expanded #toggleItems {  max-height: 30vh; opacity: 1;  overflow-y: auto;}
#toggleItems li { margin: 0.6em 0; }


/* Filter und Befehle (Original-Position) ================================================== */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.brightness-overlay { position:fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; background-color:rgba(0,0,0,0); z-index:10000; transition:background-color 0.2s ease; }
.blue-filter-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; background-color: rgba(255,229,153,0); z-index: 9000; transition: background-color 0.2s ease; }
.nocolor { filter: grayscale(100%); color: black !important; }
.markiert { background-color: #ff0; border: 3px solid #000; color: #000; }
.dark-mode .markiert { background-color: #ffeb3b; border: 3px solid #000; color: #000; }
.markiert:focus { outline: 3px dashed #000; }
.intro-hidden .intro { display: none !important; }
.intro-hidden #header{ position:relative; z-index:100; top:0px; overflow:hidden; }
.intro-hidden .vp-bg1 img{ top:0 !important; transform:translateY(0) !important; }

/* Large für BarrierMenu (Original-Position) ================================================== */
.large { --btn-size:70px; --btn-icon-size:45px; --btn-border-width:4px }

.large #barrierBox { width:500px; font-size:24px; font-weight:700 }
.large #barrierMenu > li > a { width: 90%; font-size:20px; font-weight:700 }
.large .assist-switch { --assist-label-font-size:22px }
.large .assist-range { --assist-label-font-size:22px }
.large .b-title {font-size:26px; font-weight:700; }
.large .b-txt1  {font-size:22px; font-weight:500; }
.large .assist-switch .material-icons {font-family: 'Material Icons';font-size:26px;vertical-align:middle;margin-left:5px}
.large .bf-icon { position:absolute; top:10px; left:20px; width:70px; height:70px; background: url("../layout/icons/bf-icon1.svg") no-repeat center center; background-size: contain;}
.large #toggleItems > li > a { display:block; width:calc(85% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; border-radius:10px; font-weight:600; font-size:22px; }

/* Dark Modus für BarrierMenu (Original-Position) ================================================== */
/* .dark-mode .assist-button { filter: invert(100%); }
.dark-mode .assist-range { filter: invert(100%); }
.dark-mode .assist-switch { filter: invert(100%); }
.dark-mode .b-icon { filter: invert(100%); } */
.dark-mode #barrierBox { color: #fff; background-color: #333333 }
.dark-mode .b-title { color: #fff; background-color: #333333 }
.dark-mode .b-txt1  { color: #fff; background-color: #333333 }
.dark-mode #barrierMenu > li > a { filter: invert(100%); }
.dark-mode #barrierMenu > li > a:focus { filter: invert(100%); }
.dark-mode #toggleItems { filter: invert(100%); }

.dark-mode {
  --assist-label-color: #eee;
  --assist-bg-on: #F44730;
  --assist-bg-off: #222;  
  --assist-bg-shade: inset 0 2px 4px rgba(200,200,200,0.1);  
  --icon-color: #eee;  
  --assist-knob-bg: #000;  
  --assist-knob-shade: 0 2px 4px rgba(200,200,200,0.2); }

/* Barrierefrei Large für Web (Original-Position) ================================================== */
.large { --font-h1: 50px; --font-h2: 42px; --font-h3: 34px; --font-h4: 32px; --font-h5: 28px; --font-h6: 24px;}
.large p,.large .text { font-size:34px }
.large .nav1 a, .large .nav1 a:hover, .large .nav1 a:active { font-size: 34px; }
.large .nav2 a, .large .nav2 a:hover, .large .nav2 a:active { font-size: 28px; }
.large .nav3 a, .large .nav3 a:hover, .large .nav3 a:active { font-size: 34px; }

.large .sprechstunden1 { width:100% }
.large .box_zeiten1 { position:relative; width:90%; max-width:90%; font-size:32px;  }
.large .zeiten1{ position:relative; top:12px; width:45px; height:auto } 

.large .ikont1 { width:40px; height:auto; padding-right:6px; position:relative; top:6px; }
.large .punkt1 { width:35px; height:auto; padding-right:6px; position:relative; top:1px; } 
.large ul:is([class^="marker"], [class^="svg-box"]) { --icon-size:30px; --icon-top:7px; --gap:12px; }

.large .media-content h2 { font-size:34px } 
.large .media-content p { margin:0; order:1; font-size:30px;} 
.large .media-content:hover more { font-size:30px; }

.large .auswahl-title { font-size:34px }
.large .auswahl-text { font-size:24px }
.large .auswahl-container{;gap:120px;padding:10px;}

/* Barrierefrei Dark-Mode für Web (Original-Position) ================================================== */
.dark-mode { background-color:#000000; color:#ffffff; }
.dark-mode #site, .dark-mode #data1 { background-color:#000000; color:#ffffff; }
.dark-mode .cont_bg1, .dark-mode .cont_bg2, .dark-mode .cont_bg3, .dark-mode .cont_bg4 { display:none; }
.dark-mode { --color-h1: #fff; --color-h2: #fff; --color-h3: #fff; --color-h4: #F44730; --color-h5: #ddd; --color-h6: #bbb;}

.dark-mode .nav1 a { color: #ddd; }
.dark-mode .nav1 a:hover { color: #fff; }
.dark-mode .nav1 a:active { color: #ddd; }
.dark-mode .nav2 a { color: #ddd; }
.dark-mode .nav2 a:hover { color: #fff; }
.dark-mode .nav2 a:active { color: #ddd; }
.dark-mode .nav3 a { color: #ddd; }
.dark-mode .nav3 a:hover { color: #fff; }
.dark-mode .nav3 a:active { color: #ddd; }

.dark-mode #header { filter: invert(100%); }

.dark-mode .qinfo1 { filter: invert(100%); }
.dark-mode .intro { filter: contrast(130%) brightness(90%) saturate(110%);}
.dark-mode .thempic1, .dark-mode .thempic2, .dark-mode .thempic3, .dark-mode .pictop, .dark-mode .pic1, .dark-mode .pic2, .dark-mode .auswahl-bild, .dark-mode .vp-box1 { filter: contrast(130%) brightness(90%) saturate(110%);}
.dark-mode #map, .dark-mode #map2, .dark-mode #data2, .dark-mode #data2-illing  { filter: contrast(130%) brightness(90%) saturate(110%);}

.dark-mode .ikont1 { filter: invert(100%); }

.dark-mode  #side-menu-top  { background-color: rgba(0,0,0,0.8); box-shadow: inset 0 2px 2px rgba(220,220,220,0.2); background-image: none; }
.dark-mode .Language { color:#eee; }
.dark-mode #side-menu-right {  background-image: url('../layout/side_menu_bg2.svg'); background-repeat:no-repeat; border-left:2px solid #333; background-size:cover; background-position:center; box-shadow:-2px 0 5px rgba(0,0,0,0.1); }
.dark-mode .menu-toggle { filter: invert(100%); }
.dark-mode .menu-items ul li a { color: #ddd; }
.dark-mode #side-menu-right.open::before { background-color: #222; border-top: 1px solid #fff; border-bottom: 1px solid #888; border-right: 1px solid #888; }
.dark-mode .menu-items ul li a.active, .dark-mode .menu-items ul li a:hover { background-color: #BA8282; color: #fff; }
.dark-mode .submenu { background-color:#423939 }
.dark-mode .menu-items .submenu li a:hover { background-color: rgba(222,107,107,0.40); }
.dark-mode .menu-items .submenu li a {  color: #BA8282;  }

.dark-mode .sprechstunden1 { background: rgba(30,30,30,1); }
.dark-mode .box_zeiten1 { filter: invert(100%); }

.dark-mode .auswahl { background:#222; box-shadow:0 4px 6px rgba(0,0,0,0.8) }
.dark-mode .auswahl-title { color: #FF6A68}
.dark-mode .auswahl-text { color:#ddd }

.dark-mode #foot { background: rgba(20,20,20,1); }

/* Responsiv ================================================================================================ */

/* Laptops & kleinere Desktops (992px – 1199px) */
@media (max-width: 1199px) {
#barrierBox { max-width:600px;}
.bf-icon { position:absolute; top:10px; left:20px; width:50px; height:50px }
.b-title {font-size:20px; font-weight:700; }
.b-txt1  {font-size:18px; font-weight:500; }
.assist-switch { --assist-label-font-size:16px }
.assist-range { --assist-label-font-size:16px }
:root { --btn-size:54px; --btn-icon-size:32px; --btn-border-width:3px }
#barrierMenu > li > a { width: 88%; font-size:16px; font-weight:700 }
#toggleItems > li > a { display:block; width:calc(85% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; font-weight:600; font-size:16px; }
    
.large { --btn-size:65px; --btn-icon-size:40px; --btn-border-width:3px }
.large #barrierBox { width:500px; font-size:24px; font-weight:700 }
.large #barrierMenu > li > a { width: 90%; font-size:20px; font-weight:700 }
.large .assist-switch { --assist-label-font-size:22px }
.large .assist-range { --assist-label-font-size:22px }
.large .b-title {font-size:26px; font-weight:700; }
.large .b-txt1  {font-size:22px; font-weight:500; }
.large .assist-switch .material-icons {font-size:26px;margin-left:5px}
.large #toggleItems > li > a { display:block; width:calc(85% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; font-weight:600; font-size:18px; }
.large .bf-icon { position:absolute; top:10px; left:20px; width:70px; height:70px }
/* Barrierefrei Website  */
.large { --font-h1:50px; --font-h2:42px; --font-h3:34px; --font-h4:32px; --font-h5:28px; --font-h6:24px}
.large p,.large .text { font-size:34px }
.large .nav1 a, .large .nav1 a:hover, .large .nav1 a:active { font-size: 34px; }
.large .nav2 a, .large .nav2 a:hover, .large .nav2 a:active { font-size: 28px; }
.large .nav3 a, .large .nav3 a:hover, .large .nav3 a:active { font-size: 34px; }

.large .sprechstunden1 { width:100% }
.large .box_zeiten1 { position:relative; width:100%; max-width:90%; font-size:32px;  }
.large .zeiten1{ position:relative; top:12px; width:45px; height:auto }

.large .ikont1 { position:relative; top:6px; width:40px; height:auto; padding-right:6px }
.large .punkt1 { position:relative; top:1px; width:35px; height:auto; padding-right:6px } 
.large ul:is([class^="marker"], [class^="svg-box"]) { --icon-size:30px; --icon-top:7px; --gap:12px; }

.large .media-content h2 { font-size:34px } 
.large .media-content p { margin:0; order:1; font-size:30px;} 
.large .media-content:hover more { font-size:30px; }

.large .auswahl-title { font-size:34px }
.large .auswahl-text { font-size:24px }
.large .auswahl-container{;gap:120px;padding:10px;}
    
/* Tablets (quer) & große Tablets (768px – 991px) ---------------------------------------------------- */
@media (max-width: 991px) {
#barrierBox { max-width:500px;}
.bf-icon { position:absolute; top:10px; left:20px; width:40px; height:40px }
.b-title {font-size:20px; font-weight:700; }
.b-txt1  {font-size:18px; font-weight:500; }
.assist-range { --assist-label-font-size:16px }
.assist-switch { --assist-label-font-size:16px }
:root { --btn-size:55px; --btn-icon-size:35px; --btn-border-width:3px; --assist-slider-w: 130px; }
#barrierMenu > li > a { width: 85%; left:20px; font-size:15px; font-weight:700 }
#toggleItems > li > a { display:block; width:calc(82% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; font-weight:600; font-size:15px; }
#switchMenu .assist-range .material-icons { font-size:20px; margin-left:5px; }  
.assist-switch .material-icons {font-size:20px; margin-left:5px} 
    
    
.large { --btn-size:60px; --btn-icon-size:40px; --btn-border-width:3px}
.large #barrierBox { width:450px; font-size:22px; font-weight:700 }
.large #barrierMenu > li > a { width: 90%; font-size:18px; font-weight:700 }
.large .assist-switch { --assist-label-font-size:20px }
.large .assist-range { --assist-label-font-size:20px }
.large .b-title {font-size:24px; font-weight:700; }
.large .b-txt1  {font-size:20px; font-weight:500; }
.large .assist-switch .material-icons {font-size:24px; margin-left:5px}
.large #toggleItems > li > a { display:block; width:calc(85% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; font-weight:600; font-size:16px; }
.large .bf-icon { position:absolute; top:10px; left:20px; width:55px; height:55px }
/* Barrierefrei Website */
.large { --font-h1:44px; --font-h2:36px; --font-h3:28px; --font-h4:26px; --font-h5:22px; --font-h6:18px; }
.large p,.large .text { font-size:30px }
    
.large .sprechstunden1 { width:100% }
.large .box_zeiten1 { position:relative; width:100%; max-width:98%; font-size:30px;  }
.large .zeiten1{ position:relative; top:10px; width:35px; height:auto }

}

/* Tablets (hochkant) & große Smartphones (576px – 767px) */
@media (max-width: 767px) {
#barrierBox { max-width:450px;}
.bf-icon { position:absolute; top:15px; left:20px; width:30px; height:30px }
.b-title {font-size:18px; font-weight:700; }
.b-txt1  {font-size:16px; font-weight:500; }
.assist-range { --assist-label-font-size:15px }
.assist-switch { --assist-label-font-size:15px }
:root { --btn-size:50px; --btn-icon-size:32px; --btn-border-width:2px; --assist-slider-w: 120px; }
#barrierMenu > li > a { width: 85%; left:20px; font-size:14px; font-weight:700 }
#toggleItems > li > a { display:block; width:calc(82% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; font-weight:600; font-size:14px; }
#switchMenu .assist-range .material-icons { font-size:18px; margin-left:5px; }  
.assist-switch .material-icons {font-size:18px; margin-left:5px}
        
.large #barrierBox { max-width:500px;}
.large { --btn-size:60px; --btn-icon-size:40px; --btn-border-width:3px}
.large { --font-h1:38px; --font-h2:30px; --font-h3:22px; --font-h4:20px; --font-h5:18px; --font-h6:14px}
.large p,.large .text { font-size:28px }
    
.large .sprechstunden1 { width:100% }
.large .box_zeiten1 { position:relative; width:100%; max-width:98%; font-size:28px;  }
.large .zeiten1{ position:relative; top:10px; width:35px; height:auto }
}
    
/* Standard-Smartphones (575px) */
@media (max-width: 575px) {
#barrierBox { max-width:400px;}
.bf-icon { position:absolute; top:15px; left:20px; width:30px; height:30px }
.b-title {font-size:18px; font-weight:700; }
.b-txt1  {font-size:16px; font-weight:500; }
.assist-range { --assist-label-font-size:16px }
.assist-switch { --assist-label-font-size:16px }
:root { --btn-size:45px; --btn-icon-size:28px; --btn-border-width:2px; --assist-slider-w: 100px; }
#barrierMenu > li > a { width: 85%; left:20px; font-size:14px; font-weight:700 }
#toggleItems > li > a { display:block; width:calc(82% - -10px); margin:0.4em 20px; padding:0.5em 0.75em; font-weight:600; font-size:14px; }
#switchMenu .assist-range .material-icons { font-size:16px; margin-left:5px; }  
.assist-switch .material-icons {font-size:16px; margin-left:5px}
    
.large #barrierBox { max-width:350px;}
.large .bf-icon { display:none }
.large { --btn-size:55px; --btn-icon-size:32px; --btn-border-width:2px} 
.large { --font-h1:34px; --font-h2:28px; --font-h3:20px; --font-h4:18px; --font-h5:14px; --font-h6:12px}
.large p,.large .text { font-size:26px }
    
.large .sprechstunden1 { width:100% }
.large .box_zeiten1 { position:relative; width:100%; max-width:99%; font-size:26px;  }
.large .zeiten1{ position:relative; top:10px; width:30px; height:auto }
}

/* Kleine Smartphones / sehr kleine Displays (<= 400px) */
@media (max-width: 400px) {  
#barrierBox { width:100%; right:0px; border-radius:0px; padding: 10px 0; margin: 10px auto; }
.bf-icon { display:none }
.b-title {font-size:20px; font-weight:700; }
.b-txt1  {font-size:18px; font-weight:500; }
.assist-range { --assist-label-font-size:16px }
.assist-switch { --assist-label-font-size:16px }
:root { --btn-size:45px; --btn-icon-size:30px; --btn-border-width:1px; --assist-slider-w:80px;}
#barrierMenu > li > a { width: 85%; left:20px; font-size:14px; font-weight:700 }
#toggleItems > li > a { display:block; width:calc(90% - -10px); margin:0.2em 10px; padding:0.4em 0.7em; font-weight:600; font-size:14px; }
#switchMenu .assist-range .material-icons { font-size:18px; margin-left:5px; }  
.assist-switch .material-icons {font-size:18px; margin-left:5px}
    
.large #barrierBox { width:100%; right:0px; border-radius:0px; padding: 10px 0; margin: 10px auto; }
.large .bf-icon { display:none }
.large .assist-range { --assist-label-font-size:18px }
.large .assist-switch { --assist-label-font-size:18px }
.large #barrierMenu > li > a { width: 85%; left:20px; font-size:18px; }
    
.large { --btn-size:50px; --btn-icon-size:30px; --btn-border-width:2px; --assist-slider-w:80px;} 
.large { --font-h1:30px; --font-h2:24px; --font-h3:16px; --font-h4:14px; --font-h5:12px; --font-h6:10px}
.large p,.large .text { font-size:22px }
    
.large .sprechstunden1 { width:100% }
.large .box_zeiten1 { position:relative; width:100%; max-width:99%; font-size:20px;  }
.large .zeiten1{ position:relative; top:10px; width:25px; height:auto }
}