/* Zusatz-CSS-Definitionen vobs.at
* 2022 Kuno Sandholzer, sandholzer@vobs.at
*/

/*body { background-image: url("backgrounds/bg-alpha-grey.png"); font-family:Dosis !important;}
h1,h2,h3,h4,h5,h6 {font-family:Covered By Your Grace !important;}*/

/* Style Breadcrumb */
.breadcrumb {border:0px; padding:30px 0px 10px 0px;}
/*.breadcrumb {display: none;}*/

/* Menü Eltern-Verhalten --> Desktop: Dropdown Hover, Mobile: Onclick
@media all and (min-width: 991px) {
	.navbar .nav-item .dropdown-menu{ display: none !important; }
	.navbar .nav-item:hover .nav-link{   }
	.navbar .nav-item:hover .dropdown-menu{ display: block !important; }
	.navbar .nav-item .dropdown-menu{ margin-top:0 !important; }
}	*/

.nav-icon div, .nav-icon::after, .nav-icon::before {
  background-color: #000 !important;
}

.border {
  border: 1px var(--bs-border-style) var(--bs-border-color-translucent) !important;
}

/* Scrollleiste und Breadcrumb bei Ansicht "mobile" verstecken*/ 
@media (max-width: 991px) {
  .navbar-expand-lg {overflow-y: hidden!important;}
  .breadcrumb {display: none;}
}

/* Navbar */
/*.navbar-nav {font-size: 22px; font-weight:500;}*/
#navbar {font-weight:500; color:#f3f3f3;}
#navbar:hover {color:#FFF;}

/* Ergänzung bei Update auf Typo3 v12 bzw. T3SBootstrap 5.3.22 */
.submenu .nav-link:hover, .nav-link:focus {
	text-decoration: none;
	outline: none;
	box-shadow: none;
}

.fake-container {
  --bs-gutter-x: 40%;
  --bs-gutter-y: 0;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  margin-right: auto;
  margin-left: auto;
  max-width:1000px;
}

/* Backgrounds */
.bg-dots {
background: url("backgrounds/dots-bg.png");
}

.jumbotron{
  position: relative;
 }

.jumbotron::before{ 
content:'';
font-family:'shape divider from ShapeDividers.com';
position: absolute;
z-index: 3;
pointer-events: none;
background-repeat: no-repeat;
bottom: -0.1vw;
left: 0vw;
right: 0vw;
top: -0.1vw; 
background-size: 100% 100px;
background-position: 50% 100%;  background-image: url('data:image/svg+xml;charset=utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.28 2.17" preserveAspectRatio="none"><path d="M35.28 1.67c-3.07-.55-9.27.41-16.15 0-6.87-.4-13.74-.58-19.13.1v.4h35.28z" fill="%23ffffff"/><path d="M35.28 1.16c-3.17-.8-7.3.4-10.04.56-2.76.17-9.25-1.47-12.68-1.3-3.42.16-4.64.84-7.04.86C3.12 1.31 0 .4 0 .4v1.77h35.28z" opacity=".5" fill="%23ffffff"/><path d="M35.28.31c-2.57.84-7.68.3-11.8.43-4.1.12-6.85.61-9.57.28C11.18.69 8.3-.16 5.3.02 2.3.22.57.85 0 .87v1.2h35.28z" opacity=".5" fill="%23ffffff"/></svg>'); 
}


.zickzack{
  position: relative;
  background-image: url("backgrounds/dots-bg.png");
 }
  .zickzack::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 12px;
    background: linear-gradient(135deg,#fff 6px,
      transparent 0%), linear-gradient(-135deg,#fff 6px,
      transparent 0%);
    background-size: 12px;
  }
    .zickzack::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 12px;
    background: linear-gradient(45deg,#0D3F4B 6px,
      transparent 0%), linear-gradient(-45deg,#0D3F4B 6px,
      transparent 0%);
    background-size: 12px;
  }


p {color: rgb(159, 158, 158);}

/* Style Links*/
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; color:#234654;}
a:active { text-decoration: none; }

/* Style Untermenü Unterseiten*/
.submenu li > a {padding: 8px 0; border-bottom: 1px solid #e3e3e3;}

/* Style News */
/* Änderungen für Typo3 ab Version 12 */
/* .card {padding-top:1.5rem; margin-bottom:0px !important;} */
.card {padding:1rem; margin-bottom:0px !important;}
.pagination {justify-content: center;}
/* .card-body {text-align: center; color:#000 !important;} */
.card-body {text-align: left; color:#000 !important;}
/* .card-body p {text-align: center !important;} */
.card-body p {text-align: left !important;}
.card-body a {color:#000 !important;}
/* .card-group {border: solid 6px; border-radius: 0px; border-color:#26B4D7;} */

/* Änderungen für Typo3 ab Version 12 */
.card {
    box-shadow: 0 0 0 transparent, 0 1px 2px transparent;
    transition: all .3s cubic-bezier(0.25,0.8,0.25,1);
}

/* Style Footer*/
.footer a {color: #FFF; opacity:.7;}
.footer a:hover {color: #FFF; opacity:1;}

/* Scrollbar unten ausblenden 
.bg-light {
    border: 2px solid rgba(0, 0, 0, 0.0);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
/* Scrollbar unten ausblenden 
/* Keep desktop navigation visible and allow additional rows. */
@media (min-width: 576px) {
 #main-navbar .navbar-collapse { min-width: 0; }
 #main-navbar .main-navbarnav { flex-wrap: wrap; justify-content: flex-end; max-width: 100%; }
 #main-navbar .main-navbarnav > .nav-item { margin-right: .4rem; }
 #main-navbar .main-navbarnav > .nav-item > .nav-link { padding-left: .4rem; padding-right: .4rem; white-space: nowrap; }
}
@media (min-width: 576px) {
 #main-navbar .main-navbarnav { justify-content: flex-start; }
}
/* Augasse logo: preserve proportions and readable size. */
#main-navbar .navbar-brand { flex-shrink: 0; }
#main-navbar .navbar-brand img { width: 220px; max-width: 45vw; height: auto; }

/* Use full-resolution Augasse logo rather than enlarged thumbnail. */
#main-navbar .navbar-brand img { content: url("/fileadmin/user_upload/VS-Augasse-Internetseite.png"); }
/* Readable content typography and home layout. */
#page-content { padding: 1.5rem clamp(1rem, 5vw, 4rem) 3rem; }
#page-content p, #page-content li { color: #39444a; font-size: 1.05rem; line-height: 1.75; }
#page-content h1, #page-content h2 { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.25; text-transform: none; letter-spacing: normal; margin-bottom: 1.25rem; }
#page-content h3 { font-size: 1.5rem; margin-top: 1.8rem; text-transform: none; }
#page-content h4 { font-size: 1.2rem; text-transform: none; }
#page-content table { width: 100%; margin: 1.5rem 0; }
#page-content th, #page-content td { padding: .65rem .8rem; border-bottom: 1px solid #dce4e8; }
#page-content th { background: #edf5f6; }
#page-content a { text-decoration: underline; text-underline-offset: .2em; }
#page-2 #page-content .content-row { display: flex; flex-direction: column; margin: 0; }
#page-2 #page-content .content-row > * { width: 100%; max-width: 100%; flex: none; padding: 0; }
#page-2 #page-content .content-row > aside { order: 2 !important; margin-top: 2rem; padding: 1.5rem; background: #edf5f6; border-left: 4px solid #2994a8; }
#page-2 #c1 { padding: 1rem 0 !important; }
#page-2 #c1 p, #page-2 #c1 header { text-align: left !important; }
#page-2 #c1 .text-big { font-size: 1.05rem; }

/* Text first and photos below on small screens. */
@media (max-width: 767.98px) {
 #page-content .content-row > main { order: 1; }
 #page-content .content-row > aside { order: 2; margin-top: 1.5rem; }
}

/* Consistent typography across all school pages. */
#page-content, #page-footer { font-family: "Nunito Sans", Arial, sans-serif; letter-spacing: normal; }
#page-content { color: #39444a; }
#page-content p, #page-content li, #page-content td, #page-content th { font-family: inherit; font-size: 1.05rem; line-height: 1.7; letter-spacing: normal !important; text-transform: none; }
#page-content p { margin-top: 0; margin-bottom: 1rem; text-align: left; }
#page-content h1, #page-content h2, #page-content h3, #page-content h4, #page-content h5, #page-content h6 { font-family: inherit !important; font-weight: 600; line-height: 1.25; letter-spacing: normal !important; text-transform: none !important; color: #202c32; text-align: left; }
#page-content h1 { font-size: clamp(2rem, 3.5vw, 2.7rem); margin-bottom: 1.3rem; }
#page-content h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin-bottom: 1.2rem; }
#page-content h3 { font-size: clamp(1.35rem, 2vw, 1.6rem); margin-top: 1.8rem; margin-bottom: .8rem; }
#page-content h4 { font-size: 1.2rem; margin-top: 1.5rem; margin-bottom: .7rem; }
#page-content h5, #page-content h6 { font-size: 1.05rem; margin-top: 1.3rem; margin-bottom: .6rem; }
#page-content ul, #page-content ol { padding-left: 1.5rem; margin-bottom: 1.2rem; }
#page-content li + li { margin-top: .35rem; }
#page-content .augasse-albums summary { font-family: inherit; letter-spacing: normal; line-height: 1.4; }
#page-footer p, #page-footer a { letter-spacing: normal; line-height: 1.6; }

/* Override fonts carried over in imported content. */
#page-content p, #page-content li, #page-content td, #page-content th, #page-content h1, #page-content h2, #page-content h3, #page-content h4, #page-content h5, #page-content h6, #page-content [style*="font-family"] { font-family: "Nunito Sans", Arial, sans-serif !important; }

/* Three-column team list, without staff photos. */
#page-content #c229 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
#page-content #c229 > h2, #page-content #c229 > h3 { grid-column: 1 / -1; }
#page-content #c229 > h2 { margin-bottom: 0; }
#page-content #c229 > h3 { margin-top: 1.2rem; margin-bottom: .3rem; }
#page-content #c229 > p { margin: 0; padding: 1rem; border: 1px solid #dce4e8; border-radius: 8px; background: #f5f9fa; overflow-wrap: anywhere; }
@media (max-width: 767.98px) { #page-content #c229 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479.98px) { #page-content #c229 { grid-template-columns: minmax(0, 1fr); } }

/* Clear text links and a logo above the desktop menu. */
#page-content main a:not(:has(img)){color:#146078!important;font-family:inherit;font-size:inherit;line-height:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;overflow-wrap:anywhere}
#page-content main a:not(:has(img)):hover{color:#0b4052!important}
#page-content main a:focus-visible{outline:2px solid #146078;outline-offset:3px}
#page-content h2 strong,#page-content h3 strong,#page-content h4 strong{font-weight:inherit}
@media(min-width:576px){#main-navbar>.container{flex-direction:column;align-items:flex-start!important}#main-navbar .navbar-brand{align-self:flex-start;margin:0 0 .7rem!important}#main-navbar #navbarToggler{width:100%;flex-basis:100%}#main-navbar .main-navbarnav{margin-left:0!important;padding-left:0!important;max-width:960px;justify-content:flex-start}#main-navbar{padding-top:1rem!important;padding-bottom:1rem!important}}

/* Logo-inspired turquoise header and petrol footer. */
#main-navbar{background:#e4f4f8!important;border-bottom:3px solid #28a9c8!important}
#main-navbar .nav-link{color:#244c59!important;opacity:1!important}
#main-navbar .nav-link:hover,#main-navbar .nav-link:focus,#main-navbar .nav-link.active{color:#103744!important;background-color:#c9eaf2;border-radius:4px}
#main-navbar .dropdown-menu{background:#f2fafc;border-color:#b7dce6}
#main-navbar .dropdown-item{color:#244c59!important}
#main-navbar .dropdown-item:hover,#main-navbar .dropdown-item:focus{background:#d3edf3}
#page-footer{background:#164c5d!important;background-image:none!important;color:#f3fafc!important;border-top:4px solid #28a9c8}
#page-footer p,#page-footer strong,#page-footer h2,#page-footer h3{color:#f3fafc!important}
#page-footer a,#page-footer .nav-link{color:#f3fafc!important;opacity:1!important}
#page-footer a:hover,#page-footer a:focus{color:#c8e866!important;text-decoration:underline}
#page-footer a:focus-visible{outline:2px solid #c8e866;outline-offset:3px}

/* Spread both desktop menu rows over the available width. */
@media(min-width:992px){#main-navbar .main-navbarnav{display:flex!important;flex-direction:row;flex-wrap:wrap;max-width:none!important;width:100%;padding-right:0!important;gap:0!important}#main-navbar .main-navbarnav>.nav-item{flex:1 0 14.285%;min-width:0;margin-right:0!important;text-align:center}#main-navbar .main-navbarnav>.nav-item>.nav-link{padding-left:.25rem;padding-right:.25rem;font-size:.84rem;white-space:nowrap}}

/* Three logical contact columns in the footer. */
#page-footer #c8{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:2rem;row-gap:1rem;padding-bottom:1.5rem}
#page-footer #c8>p{margin:0;overflow-wrap:anywhere}
#page-footer #c8>p:nth-child(1){grid-column:1;grid-row:1 / span 2}
#page-footer #c8>p:nth-child(2){grid-column:2;grid-row:1}
#page-footer #c8>p:nth-child(3){grid-column:2;grid-row:2}
#page-footer #c8>p:nth-child(4){grid-column:3;grid-row:1}
#page-footer #c8>p:nth-child(5){grid-column:3;grid-row:2}
@media(max-width:767.98px){#page-footer #c8{grid-template-columns:minmax(0,1fr);gap:1.2rem}#page-footer #c8>p:nth-child(n){grid-column:auto;grid-row:auto}}

/* Align menu rows to a consistent column grid. */
@media(min-width:992px){#main-navbar .main-navbarnav{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));column-gap:.75rem!important;row-gap:.35rem!important}#main-navbar .main-navbarnav>.nav-item{margin:0!important;text-align:left;min-width:0}#main-navbar .main-navbarnav>.nav-item>.nav-link{display:inline-block;padding:.5rem 0;font-size:.82rem;background:transparent!important;border-radius:0;border-bottom:2px solid transparent}#main-navbar .main-navbarnav>.nav-item>.nav-link.active,#main-navbar .main-navbarnav>.nav-item>.nav-link:hover{border-bottom-color:#1686a3;color:#103744!important}}

@media(min-width:992px){#main-navbar .main-navbarnav{grid-template-columns:1fr 1fr 1fr 1.05fr 1.3fr 1.1fr 1fr}}

/* A consistent left-aligned footer closing section. */
#page-footer #c48{border-top:1px solid rgba(255,255,255,.25);padding-top:1rem;margin-top:.25rem}
#page-footer #c48 ul{justify-content:flex-start!important;align-items:center;flex-wrap:wrap;gap:.5rem 1.75rem;margin:0 0 .75rem;padding:0;list-style:none}
#page-footer #c48 li{margin:0;padding:0}
#page-footer #c48 .nav-link{display:block;padding:.25rem 0!important;font-family:"Nunito Sans",Arial,sans-serif;font-size:.95rem;font-weight:400;line-height:1.5;letter-spacing:normal;text-transform:none;border:0}
#page-footer #c7 p{font-size:.85rem;line-height:1.6;margin:0;padding:.25rem 0 .5rem;color:#d7eaf0!important}
#page-footer #c7 a{color:#d7eaf0!important}

/* Footer information pages start directly with their content. */
:is(#page-22,#page-23,#page-24,#page-25) #s-9{display:none!important}

/* Larger, readable page navigation. */
#main-navbar .main-navbarnav>.nav-item>.nav-link{font-family:"Nunito Sans",Arial,sans-serif;font-size:1rem!important;letter-spacing:normal!important;text-transform:none!important;font-weight:600;line-height:1.5}
@media(min-width:992px){#main-navbar .main-navbarnav{grid-template-columns:.85fr .8fr .8fr .7fr 1.5fr 1.1fr .95fr;column-gap:1rem!important;row-gap:.35rem!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{padding:.55rem 0}}

@media(min-width:992px){#main-navbar .main-navbarnav{grid-template-columns:1fr 1fr 1.1fr 1.1fr 1.4fr 1.3fr 1.1fr}}

/* Locally hosted Nunito Sans across the school website. */
@font-face{font-family:"Nunito Sans";font-style:normal;font-weight:400;font-display:swap;src:url("/fileadmin/website-assets/vobs-fonts/nunito-sans-v15-latin-regular.woff2") format("woff2")}
body,#main-navbar,#page-content,#page-footer{font-family:"Nunito Sans",Arial,sans-serif!important}
#page-content p,#page-content li,#page-content td,#page-content th,#page-content h1,#page-content h2,#page-content h3,#page-content h4,#page-content h5,#page-content h6,#page-content [style*="font-family"],#main-navbar a,#page-footer p,#page-footer a{font-family:"Nunito Sans",Arial,sans-serif!important}

/* Large and clearly readable page menu. */
#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.25rem!important;font-weight:700!important;line-height:1.45;padding:.65rem 0!important;white-space:normal!important}
@media(min-width:992px){#main-navbar .main-navbarnav{grid-template-columns:1fr 1fr 1.15fr 1.3fr 1.75fr 1.3fr 1.15fr;column-gap:1rem!important;row-gap:.3rem!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.15rem!important}#main-navbar .main-navbarnav>.nav-item:nth-child(5)>.nav-link{white-space:nowrap!important}}
@media(min-width:1200px){#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.25rem!important}}

#main-navbar .dropdown-item{font-size:1.125rem;line-height:1.5;padding:.6rem 1rem;white-space:normal}
@media(min-width:576px){#page-2 .jumbotron{margin-top:8rem!important}}

/* Remove the empty former school-start notice area. */
#page-2 #page-content .content-row>aside{display:none!important}

/* Align the copyright line to the right. */
#page-footer #c7 p{text-align:right!important}

/* Logo on the left, readable navigation beside it. */
@media(min-width:992px){#main-navbar>.container{flex-direction:row!important;align-items:center!important;gap:1.75rem}#main-navbar .navbar-brand{align-self:center!important;margin:0!important;flex:0 0 220px}#main-navbar #navbarToggler{width:auto!important;flex:1 1 auto!important;min-width:0}#main-navbar .main-navbarnav{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;gap:.15rem 1.25rem!important;width:100%;max-width:none!important;margin:0!important;padding:0!important}#main-navbar .main-navbarnav>.nav-item{flex:0 0 auto!important;min-width:0;text-align:left}#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.25rem!important;padding:.45rem 0!important;white-space:nowrap!important}#main-navbar .navbar-brand img{width:220px;max-width:100%}}

/* Ensure emphasized text is visibly bold with Nunito Sans. */
#page-content p strong,#page-content li strong,#page-content td strong,#page-footer p strong{font-weight:700!important;font-synthesis:weight!important}

/* Logo praesenter, Navigation ruhiger */
@media (min-width:992px){
#main-navbar .navbar-brand{flex:0 0 280px!important}
#main-navbar .navbar-brand img{width:280px!important;max-width:100%!important;height:auto!important}
#main-navbar .main-navbarnav{gap:.1rem 1.1rem!important}
#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.125rem!important;font-weight:400!important;color:#35545e!important;padding:.45rem 0!important}
#main-navbar .main-navbarnav>.nav-item>.nav-link.active,#main-navbar .main-navbarnav>.nav-item>.nav-link:hover{color:#146078!important;font-weight:600!important}
}

/* Kein doppeltes Logo im Banner, Navigation in zwei Zeilen */
#s-9:has(img[alt="VS-Augasse-Internetseite"]){display:none!important}
@media(min-width:992px){
#main-navbar .main-navbarnav{column-gap:.65rem!important}
#main-navbar .main-navbarnav>.nav-item:nth-child(7){break-before:always}
}

/* Ausgewogener Header mit bewusstem Zeilenwechsel */
@media(min-width:992px){
#main-navbar>.container{gap:2rem!important;padding-top:1rem!important;padding-bottom:1rem!important}
#main-navbar .navbar-brand{flex:0 0 270px!important}
#main-navbar .navbar-brand img{width:270px!important}
#main-navbar .main-navbarnav{column-gap:.5rem!important;row-gap:0!important;justify-content:space-between!important}
#main-navbar .main-navbarnav::before{content:"";order:1;flex-basis:100%;height:0}
#main-navbar .main-navbarnav>.nav-item{order:0}
#main-navbar .main-navbarnav>.nav-item:nth-child(n+7){order:2}
#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.125rem!important;font-weight:400!important;padding:.4rem 0!important}
}

@media(min-width:992px){#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1.0625rem!important}}

/* Ruhige, durchgehend gleiche Abstaende in beiden Menuezeilen */
@media(min-width:992px){#main-navbar .main-navbarnav{justify-content:flex-start!important;column-gap:.75rem!important;row-gap:.15rem!important;align-items:center!important}#main-navbar .main-navbarnav>.nav-item{margin:0!important}#main-navbar>.container{align-items:center!important}#main-navbar .main-navbarnav>.nav-item>.nav-link.active{font-weight:400!important}}

/* Beide Menuezeilen mittig neben dem Logo */
@media(min-width:992px){#main-navbar .main-navbarnav{justify-content:center!important}}

/* Menuezeilen buendig ueber die gesamte verfuegbare Breite */
@media(min-width:992px){#main-navbar .main-navbarnav{justify-content:space-between!important;width:100%!important}#main-navbar .main-navbarnav>.nav-item{text-align:left!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{text-align:left!important}}

/* Zwei Reihen mit festen, untereinander ausgerichteten Spalten */
@media(min-width:992px){
#main-navbar>.container{max-width:1200px!important;width:calc(100% - 3rem)!important;padding-left:0!important;padding-right:0!important;gap:2rem!important}
#main-navbar .main-navbarnav{display:grid!important;grid-template-columns:repeat(7,max-content)!important;justify-content:space-between!important;column-gap:.65rem!important;row-gap:.25rem!important;align-items:center!important}
#main-navbar .main-navbarnav::before{display:none!important}
#main-navbar .main-navbarnav>.nav-item,#main-navbar .main-navbarnav>.nav-item:nth-child(n+7){order:0!important;min-width:0!important}
#main-navbar .main-navbarnav>.nav-item>.nav-link{white-space:nowrap!important}
}
@media(min-width:992px) and (max-width:1099px){#main-navbar .navbar-brand{flex-basis:220px!important}#main-navbar .navbar-brand img{width:220px!important}#main-navbar>.container{gap:1.25rem!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1rem!important}#main-navbar .main-navbarnav{column-gap:.4rem!important}}

/* Feste Menuespalten als Gruppe mittig neben dem Logo */
@media(min-width:992px){#main-navbar .main-navbarnav{justify-content:center!important;column-gap:1.15rem!important}}
@media(min-width:992px) and (max-width:1099px){#main-navbar .main-navbarnav{column-gap:.4rem!important}}

/* Logo oben, Navigation darunter */
@media(min-width:992px){
#main-navbar>.container{flex-direction:column!important;align-items:center!important;gap:.75rem!important;padding-top:1rem!important;padding-bottom:1rem!important}
#main-navbar .navbar-brand{flex:0 0 auto!important;align-self:center!important;margin:0!important}
#main-navbar .navbar-brand img{width:280px!important;height:auto!important}
#main-navbar #navbarToggler{width:100%!important;flex:0 0 auto!important}
#main-navbar .main-navbarnav{grid-template-columns:repeat(7,max-content)!important;justify-content:center!important;column-gap:2rem!important;row-gap:.25rem!important}
body{padding-top:200px!important}
#page-2 .jumbotron{margin-top:1rem!important}
}
@media(min-width:992px) and (max-width:1099px){#main-navbar .main-navbarnav{column-gap:1.25rem!important}}

@media(min-width:992px){body{padding-top:216px!important}body#page-2 .jumbotron{margin-top:1rem!important}}

/* Kompakteres Menue unter dem Logo */
@media(min-width:992px){#main-navbar>.container{gap:.4rem!important;padding-top:.8rem!important;padding-bottom:.65rem!important}#main-navbar .main-navbarnav{column-gap:1rem!important;row-gap:0!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1rem!important;padding:.3rem 0!important}body{padding-top:185px!important}}

/* Natuerliche, kompakte Menuezeilen ohne starres Spaltenraster */
@media(min-width:992px){#main-navbar .main-navbarnav{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;justify-content:center!important;gap:0 1.4rem!important;max-width:980px!important;margin:0 auto!important}#main-navbar .main-navbarnav::before{display:block!important;content:"";order:1;flex-basis:100%;height:0}#main-navbar .main-navbarnav>.nav-item{order:0!important;flex:0 0 auto!important}#main-navbar .main-navbarnav>.nav-item:nth-child(n+8){order:2!important}#main-navbar .main-navbarnav>.nav-item:nth-child(7){order:0!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:1rem!important;padding:.35rem 0!important;letter-spacing:0!important}#main-navbar>.container{gap:.6rem!important}#main-navbar .navbar-brand img{width:300px!important}}

/* Scrollable navigation on phones and tablets. */
@media(max-width:991.98px){
body{padding-top:88px!important}
#main-navbar{height:auto!important;max-height:100vh!important;max-height:100dvh!important;overflow:hidden!important;padding:.75rem 0!important}
#main-navbar>.container{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;justify-content:space-between!important;gap:0!important;width:100%!important;max-width:100%!important;padding:0 1rem!important}
#main-navbar .navbar-brand{align-self:center!important;flex:0 1 auto!important;margin:0!important;min-width:0}
#main-navbar .navbar-brand img{width:220px!important;max-width:calc(100vw - 100px)!important;height:auto!important}
#main-navbar .navbar-toggler{display:block!important;flex:0 0 44px;min-height:44px}
#main-navbar #navbarToggler{flex-basis:100%!important;width:100%!important;min-height:0!important;max-height:calc(100vh - 82px)!important;max-height:calc(100dvh - 82px)!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scroll-padding-bottom:1rem}
#main-navbar #navbarToggler.collapse:not(.show){display:none!important}
#main-navbar #navbarToggler.collapse.show{display:block!important;height:auto!important}
#main-navbar .main-navbarnav{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch!important;justify-content:flex-start!important;gap:0!important;width:100%!important;max-width:none!important;margin:0!important;padding:.5rem 0 calc(1rem + env(safe-area-inset-bottom,0px))!important}
#main-navbar .main-navbarnav::before{display:none!important}
#main-navbar .main-navbarnav>.nav-item{width:100%;margin:0!important;flex:0 0 auto!important;order:0!important;text-align:left!important}
#main-navbar .main-navbarnav>.nav-item>.nav-link{display:block!important;padding:.6rem .5rem!important;font-size:1.1rem!important;font-weight:600!important;line-height:1.4!important;white-space:normal!important;min-height:44px}
#main-navbar .dropdown-menu{position:static!important;float:none!important;width:100%!important;min-width:0!important;max-width:100%!important;margin:0 0 .35rem!important;box-shadow:none!important;transform:none!important}
#main-navbar .dropdown-item{font-size:1rem!important;letter-spacing:normal!important;white-space:normal!important;line-height:1.4!important;padding:.65rem 1rem!important;min-height:44px}
body#page-2 .jumbotron{margin-top:0!important}
}
@media(max-width:575.98px){#page-content{padding-left:1rem!important;padding-right:1rem!important}#page-footer #c7 p{text-align:left!important}#page-content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}}

/* Gut lesbare Hauptnavigation */
#main-navbar .main-navbarnav>.nav-item>.nav-link{font-size:18px!important}

/* Flacher Header mit unveraendert lesbarer Navigation */
@media(min-width:992px){#main-navbar{height:auto!important;min-height:0!important;padding:.45rem 0!important}#main-navbar>.container{padding-top:.3rem!important;padding-bottom:.3rem!important;gap:.35rem!important}#main-navbar .main-navbarnav>.nav-item>.nav-link{padding:.25rem 0!important}body{padding-top:155px!important}}

/* Zweispaltige Linkuebersicht nach Themen */
body#page-51 .content-row>aside{display:none!important}body#page-51 .content-row>main{flex:0 0 100%!important;width:100%!important;max-width:100%!important}body#page-51 #c214{column-count:2;column-gap:3rem}body#page-51 #c214>header,body#page-51 #c214>h3,body#page-51 #c214>h4{column-span:all;break-after:avoid}body#page-51 #c214>p{break-inside:avoid;overflow-wrap:anywhere;margin:0 0 1.2rem}body#page-51 #c214 a{display:inline-block;max-width:100%}@media(max-width:767px){body#page-51 #c214{column-count:1}}

/* Einheitliche Inhaltsbegrenzung wie auf Termine */
html body:is(#page-16,body) #page-content{padding-left:5vw!important;padding-right:5vw!important}
html body:is(#page-16,body) #page-content>.container{width:100%!important;max-width:1140px!important;margin-left:auto!important;margin-right:auto!important;padding-left:12px!important;padding-right:12px!important}
@media(max-width:767px){html body:is(#page-16,body) #page-content{padding-left:1rem!important;padding-right:1rem!important}}


/* Gleiche Inhaltskante wie die Breadcrumb-Navigation, auch auf grossen Bildschirmen */
:root{--augasse-content-max:100%}@media(min-width:576px){:root{--augasse-content-max:540px}}@media(min-width:768px){:root{--augasse-content-max:720px}}@media(min-width:992px){:root{--augasse-content-max:960px}}@media(min-width:1200px){:root{--augasse-content-max:1140px}}@media(min-width:1400px){:root{--augasse-content-max:1320px}}
html body:is(#page-16,body) #page-content{padding-left:0!important;padding-right:0!important}
html body:is(#page-16,body) #page-content>.container{width:100%!important;max-width:var(--augasse-content-max)!important}
html body:is(#page-16,body) #page-content>.content-row{width:100%!important;max-width:var(--augasse-content-max)!important;margin-left:auto!important;margin-right:auto!important}
html body:is(#page-16,body) #page-content>.content-row>main>.container{width:100%!important;max-width:none!important;padding-left:0!important;padding-right:0!important}

/* Ruhige, mittige Inhaltsflaeche mit mehr Seitenrand am Handy */
@media(max-width:767.98px){html body:is(#page-16,body) #page-content{padding-left:12px!important;padding-right:12px!important}html body:is(#page-16,body) #page-content>.container,html body:is(#page-16,body) #page-content>.content-row{margin-left:auto!important;margin-right:auto!important}#page-footer>.container{padding-left:24px!important;padding-right:24px!important}}
/* Helle Navigation mit gut lesbaren aktiven Menuepunkten */
#main-navbar{background:#fff!important}
#main-navbar .main-navbarnav>.nav-item>.nav-link:is(.active,.show,:hover,:focus){background:#f2f2f2!important;color:#244c59!important}
#main-navbar .dropdown-menu{background:#fff!important}
#main-navbar .dropdown-item:is(.active,:active,:hover,:focus){background:#f2f2f2!important;color:#244c59!important}
#main-navbar .nav-link:focus-visible,#main-navbar .dropdown-item:focus-visible{outline:2px solid #244c59;outline-offset:2px}
/* Header wieder im bisherigen Hellblau */
#main-navbar{background:#e4f4f8!important}
