.head-menus.mobile {  display:flex; flex-direction: column; }
.head-menus.mobile.menu-open { position: absolute; left: 0px; z-index: 100; right: 0px; }
.head-menus.mobile.menu-open .button.show-menu .navbar-toggle {  width: 100%; text-align: right; padding-right: 30px; margin-top: -10px; }
.head-menus.mobile.menu-open .button {  margin-bottom: 0px; }
.head-menus.mobile .button { margin-bottom: 15px; }

.head-menus.mobile>:not(.button) { display:none; }
.head-menus.mobile .mobile-search { padding: 15px; background-color: #dadada; }
.head-menus.mobile .mobile-search .search-wrap { width:100%; line-height:30px; border:none; border-radius: 0; display: flex; }
.head-menus.mobile .mobile-search .search-wrap input { width:96%; padding: 8px 1% 8px 3%; border:none; line-height:30px; font: 1em var(--fontNav); outline: none; }
.head-menus.mobile .mobile-search .search-wrap button { display: block; width:40px; background: #fff; border-style: none none none solid; border-color: #dadada; border-width: 1px; border-radius: 0;}
.head-menus.mobile .mobile-search .search-wrap button::before { content: '\f002'; font: 300 1em var(--fontAwesome); color: #999; }

.head-menus.mobile .main-menu { display: none; background-color:#fff; position: relative;  top: var(--mainmenu-mob); }


.head-menus.mobile .navbar { position:relative; z-index:1; }
.head-menus.mobile .navbar ul > li { border-top: 1px dotted #8b8b8b; margin:0 15px; }
.head-menus.mobile .navbar ul > li:first-of-type { border:none; }
.head-menus.mobile .navbar .nav-sec { display:none; background-color:#fff; width:100%; z-index:2; }
.head-menus.mobile .navbar .nav-sec li.back-link a::before { content: '\f053'; font: 300 1rem var(--fontAwesome); color: #999; padding-right: 0.5rem; }
.head-menus.mobile .navbar a { height:49px; display:flex; position:relative; align-items: center; font: 1em var(--fontNav); color:var(--cdBlue); text-transform: uppercase; background-color:#fff; }
.head-menus.mobile .navbar a.current { color:#b0b5b4; }
.head-menus.mobile .navbar ul.dropdown-menu li+li a { font-size: .85em; text-indent: 1em; }
.head-menus.mobile .navbar .has-sub > a::after { position:absolute; right:0; content: '\f054'; font: 300 1em var(--fontAwesome); color: #999; }

.head-menus.mobile .nav-header { order: 1; background-color:#fff; padding: 15px 20px; border-top: 1px dotted #8b8b8b; position:relative; z-index: 2; top:var(--mainmenu-mob); }
.head-menus.mobile .nav-header a { font: 1em var(--fontNav); color: #5d5d5d; background-color: var(--blueLight); padding: 10px 14px; display: flex; justify-content: space-between; }
.head-menus.mobile .nav-header li a::after { content: '\f08e'; font: 300 1.2em var(--fontAwesome); margin-left:20px; color: var(--cdBlue); }
.head-menus.desktop .nav-header ul { display: flex; justify-content: space-between; }
.head-menus.desktop .nav-header ul li { width: auto; padding-top: 0; padding-bottom: 0; }
.head-menus.mobile .nav-header span { display:none; }

.head-menus.mobile .nav-header ul { display: flex; flex-direction: column; gap: 10px;}
.head-menus.mobile .nav-header ul li { width: 100%; padding-top: 0; padding-bottom: 0; }

/* Nav Allgemein */
nav ul { list-style: none; margin: 0; padding: 0; }

/* Nav Main Toggle */
.button label { display: none; }
button.navbar-toggle { padding: 0;  border: 0; background-color: transparent; outline: none; cursor: pointer; width: 30px; display: flex; flex-direction: column; gap: 5px; margin-right: 15px;}
button.navbar-toggle .icon-bar {background-color: var(--linkRed); height: 4px; display: block; width: 100%; }

header .head-menus .button.show-menu+.main-menu { max-height: 100em; transition: max-height 600ms ease-in-out; }
header .head-menus .button.show-menu button .icon-bar { display: none; }
header .head-menus .button.show-menu button::after { content: '\f00d'; font: 300 35px var(--fontAwesome); color: var(--linkRed); position: relative; top: -6px; }

/* Breadcrumb */
.breadcrumb {  overflow: hidden; font-size: clamp(.8em,2vw,1.1em); background-color: var(--cdBlue); margin-bottom: 60px; list-style: none; }
.breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; max-width: 1320px; margin: 0 auto; padding: 15px 15px 15px 20px;  color: #fff; font-family: var(--fontNav);}
.breadcrumb ol a { color: #fff; }
.breadcrumb ol a:hover { }
.breadcrumb ol a.home::before { content: '\f015';}
.breadcrumb ol li{ width: 100%; padding-top: 0.5rem; padding-bottom: 0.5rem; }
.breadcrumb ol li:first-child { padding-top: 0; }
.breadcrumb ol li:nth-child(2) { display: none; }
.breadcrumb ol li+li::before { content: '\f054';  font: 300 .87em var(--fontAwesome); margin: 0 .75em 0 0.25em; }
.start .breadcrumb ol li a.home::before {content:"";}

/* Sec-Nav M-Spalte */
nav.sub-nav { background-color: var(--contentGreen); font: clamp(.86em,1.6vw,1em) var(--fontNav); margin-bottom: 40px; }
nav.sub-nav ul  { display: flex; flex-direction: column; gap: 6px;}
nav.sub-nav a { display: block; color: #fff; background-color: var(--linkRed); padding:.8em .8em .8em 2.6em; border: 1px solid var(--linkRed);}
nav.sub-nav a:hover, nav.sub-nav a.current { color: var(--linkRed); background-color: #fff; transition: background-color 450ms;}
nav.sub-nav h5 { font-size: 1.3em; margin-bottom: 3px; }

/* Zurück */
a.back{text-align: right; display: block; margin-bottom: 50px; }
a.back::before {content:'\f053'; font: 300 1.2em var(--fontAwesome); padding-right: 6px; position: relative; top: 3px; }

/* Footer */
footer { background-color: #393939; padding-bottom: 80px; font-family:var(--fontNav); color: #e4e4e4; }
footer>.container { }
footer a { color: #eee; display: block; line-height: 1.6em; hyphens: auto; }
footer a:hover { color: #e4e4e4;}
footer h5 { font: 1em var(--fontNav); text-transform: uppercase; margin: 2.2em 0 .6em; }
footer nav.sitemap { width: 100%; }
footer nav.sitemap ul {display: flex; flex-direction: column;}
footer nav.sitemap li {  }
footer nav.sitemap li>a {font-size: .9em; color: #aeafaf;}
footer .meta { margin-top: 40px; font-size: .95em; color: #aeafaf; line-height: 1.3em; flex-shrink: 0; }
footer .meta a {}

footer .nav-footer { display: flex; justify-content: space-between; column-gap: 1%;}
footer .nav-footer a { display: block; border: 1px solid #fff; width: 170px; padding: 14px 0; text-align: center; font: clamp(.74em,2vw,.82em) var(--fontText); text-transform: uppercase; margin-top: 24px;}
footer .nav-footer a:hover {background-color: #fff; color: var(--colorFontText); transition: background-color, color, 350ms; }


@media (min-width: 768px) {

    /* Headmenü */
    .head-menus.desktop {display: flex; align-items: flex-end; justify-content: flex-end; margin: 0 0 16px auto; padding-left: 16px;}
    .head-menus.desktop .mobile-search { display:none; }

    header .nav-header {  color: #5d5d5d; transform: translateY(-2px)}
    header .nav-header ul {display: flex; font: clamp(.74em,1.4vw,.97em) var(--fontHeadline); text-transform: uppercase; gap: 15px;}
    header .nav-header li a {color: #5d5d5d;}
    header .nav-header li a::after { content: '\f08e'; font: 300 1.4em var(--fontAwesome); position: relative; top: 2px; margin:0 15px; color: var(--cdBlue); }
    header .nav-header span { font-size: 1.28em }
    /* Nav Main Toggle */
    .head-menus.desktop .button { display: flex; align-items: center; padding: 0 15px 0 24px; height: 23px; }
    .head-menus.desktop .button label { font: clamp(0.74em,1.4vw,0.97em) var(--fontHeadline); display: block; color: #5d5d5d; text-transform: uppercase; margin: 0 12px 0 0; cursor: pointer;  }
    .head-menus.desktop .button.show-menu button .icon-bar { display: none; }
    .head-menus.desktop .button.show-menu button::after { top: 0; }

    /* Nav Main Toggle */
    .main-menu { display: block; position: absolute; overflow: hidden; width: 100%; top: 173px; left: 0;  transition: max-height 300ms ease-out; z-index: 2;  }
    .gradient { background-image: linear-gradient(to bottom, rgba(0,0,0,.3), transparent); display: block; width: 100%; height: 100vh; }

    /* Main Menu Nav 1 */
    nav.navbar {  padding: 0 0 36px 15px; font-size: clamp(.72em,1.6vw,.9em); box-sizing: content-box; --navWidth: clamp(312px,41vw,650px); --navGap: clamp(36px,3vw,60px); background-color: #fff; border-top: 3px solid #585f65; }
    nav.navbar>ul { max-width: 1320px; margin: 0 auto; padding: 56px 0 30px; position: relative; font: 1.33em var(--fontNav); text-transform: uppercase;  }
    nav.navbar>ul>li { width: var(--navWidth);}
    nav.navbar>ul li a { padding: 15px 0; border-bottom: 1px dotted #585f65; cursor: pointer; color: #585f65; display: flex; justify-content: space-between; }
    nav.navbar>ul>li.has-sub>a::after { content: '\f054'; font: 300 .7em var(--fontAwesome); position: relative; top: 9px; }
    nav.navbar>ul li a.current { color: var(--cdBlue); }

    /* Main Menu Nav 2 */
    nav .nav-sec { max-height: 0; overflow: hidden; position: absolute; left: var(--navWidth); top: 0; width: clamp(420px,51vw,705px); }
    nav ul.dropdown-menu { border-left: 1px solid #585f65; padding: 0 var(--navGap); margin: var(--navGap) 0 var(--navGap) var(--navGap); min-height: 350px; text-transform: none;}

    /* Sec-Nav M-Spalte */
    nav.sub-nav {}

    /* Breadcrumb */
    .breadcrumb ol { padding: 30px 15px 30px 20px; }
    .breadcrumb ol li{ width: auto; padding-top: 0; padding-bottom: 0; }
    .breadcrumb ol li+li::before { margin: 0 .75em; }

    /* Footer */
    footer { }
    footer .footer-items {display: flex; justify-content: space-between; }
    footer nav.sitemap ul { flex-flow: wrap row;column-gap: 1.6%;}
    footer nav.sitemap li { width: calc(33.3333% - 1.6%); }
    footer .meta {  }
    footer .nav-footer { flex-direction: column; }
    footer .nav-header ul { }

}

@media (min-width: 992px) {

    /* Headmenü */
    .head-menus.desktop { }

    /* Nav Header */
    .head-menus.desktop .button label { margin: 0 16px 0 0; }
    header .nav-header ul { flex-flow: row; column-gap: 27px; }
    header .nav-header li { margin-bottom:0; }
    header .nav-header li a::after { font-size: 1.4em; margin:0 30px 0 16px; }
    header .nav-header span {  }

    .breadcrumb ol { padding: 55px 15px 30px 20px; }

    /* Footer */
    footer {  }
    footer .nav-footer a { }

    a.backward { }

}

@media (min-width: 1200px) {

    /* Nav Main Toggle */
    .head-menus.desktop .button { transform: translateY(-.2em); }
    .head-menus.desktop button.navbar-toggle {  width: 33px; }


    /* Footer */
    footer {  }
    footer .nav-footer a {}

}

@media (min-width: 1350px) {



    /* Breadcrumb */
    .breadcrumb ol {  }

    /* Footer */
    footer>.container { }

}