.head-menus.mobile { overflow: inherit; position: absolute; display:flex; flex-direction: column; right: 0; top: 108px; z-index: 2; width: 100%; margin:0; padding:0; }

.head-menus.mobile .button { text-align:right; position:absolute; right: 15px; top: -56px; z-index:4; }

.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; position:relative; }
.head-menus.mobile .mobile-search .search-wrap input { width:96%; padding: 4px 1% 3px 3%; border:none; height:30px; line-height:30px; font: 1em var(--fontNav); outline: none; }
.head-menus.mobile .mobile-search .search-wrap button { display: inline-block; width:40px; border:none; background:transparent; position:absolute; right:0; top:11px; }
.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;  }

.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 1em var(--fontAwesome); color: #999; }
.head-menus.mobile .navbar a { margin:0 15px; height:49px; display:flex; position:relative; align-items: center; font: 1em var(--fontNav); color:var(--contentBlue); text-transform: uppercase; background-color:#fff; }
.head-menus.mobile .navbar a.current { color:#b0b5b4; }
.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: 9px 30px 10px 30px; border-top: 1px dotted #8b8b8b; position:relative; z-index: 2; }
.head-menus.mobile .nav-header a { font: 0.875em var(--fontNav); color: #6c6c6c; padding: 9px 0 10px 0; }
.head-menus.mobile .nav-header ul { display: flex; justify-content: space-between; flex-direction: row; margin:0; padding:0; }
.head-menus.mobile .nav-header ul li { list-style-type: none; }

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

/* Nav Main Toggle */
.head-menus > div.button { display:block; position: relative; z-index: 1; top: 8px;}
.button label { display: none; }
button.navbar-toggle { padding: 0;  border: 0; background-color: transparent; outline: none; cursor: pointer; width: 36px;  }
button.navbar-toggle .icon-bar {background-color: var(--contentBlue); height: 4px; display: block; }
button.navbar-toggle .icon-bar + .icon-bar { margin-top: 7px; }
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 40px var(--fontAwesome); color: var(--contentBlue); }

/* Breadcrumb */
.breadcrumb { border-bottom: 1px solid #d6d6d6; background-color: #fbfbfb; overflow: hidden; font-size: .8em; }
.breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; max-width: 1320px; margin: 16px auto; padding: 0 15px;  color: #494949; font: 1.1em var(--fontNav);}
.breadcrumb ol a { color: #6b6b6b; }
.breadcrumb ol a:hover { color: #3b3b3b;}
.breadcrumb ol a.home::before { content: '\f015'; padding-right: 0;}
.breadcrumb ol li{ margin: 0 10px 0 17px; text-indent: -17px; }
.breadcrumb ol li+li::before { content: '\f054';  font: 300 .87em var(--fontAwesome); margin-right: 10px; }

/* Sub-Nav M-Spalte */
nav.sub-nav { background-color: var(--contentBlue); width: 100%; padding: 22px; font-family: var(--fontNav); border-bottom: 30px solid #fff; box-sizing: border-box; }
nav.sub-nav ul  { display: flex; flex-direction: column; gap: 4px;}
nav.sub-nav a { display: block; color: #fff; }
nav.sub-nav a:hover, nav.sub-nav a.current { color: #d3d3d3; transition: color, 200ms;}
nav.sub-nav a.current::before { content: '|'; display: inline-block; transform: scale(.9,.85); position: relative; top: -1px;   }
nav.sub-nav li.nav-1 { font-size: 1.3em; margin-bottom: 3px; }

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

/* Footer */
footer { width: 100%; background-color: #2b3134; padding: 40px 0 180px; font-family:var(--fontNav); margin-top: 60px; }
footer .col-content { display: flex; flex-direction: column; }
footer>.container { padding: 0 15px;}
footer a, footer nav.nav-header a { color: #fff; display: block; }
footer .sitemap-title { font-weight: normal; font-size: 1.3em; text-transform: uppercase; margin: 6px 0 14px 0; }
footer nav.sitemap li { font-size: 1.17em;}
footer .meta { color: #9c9c9c; text-align: center; }
footer .nav-footer { display: flex; justify-content: space-between; }
footer .nav-footer a { border: 1px solid #fff; width: 150px; padding: 14px 0; text-align: center; font: .75em var(--fontText); text-transform: uppercase; margin-top: 24px; }
footer .nav-footer a:hover {background-color: #fff; color: var(--contentBlue); transition: background-color, color, 350ms; }
footer .nav-header ul { display:flex; font-size: .9em; justify-content: space-around; }

@media (min-width: 768px) {

    /* header */
   .head-menus.desktop {display: flex; flex-flow: column; align-items: flex-end; justify-content: space-between;}
   .head-menus.desktop .button { display: flex; align-items: center; }
   .head-menus.desktop label { font: 1.6em var(--fontNav); color: #2f4751; text-transform: uppercase; margin-right: 16px; cursor: pointer;  }
   .head-menus.desktop .button.show-menu button .icon-bar { display: none; }
   .head-menus.desktop .button.show-menu button::after { content: '\f00d'; font: 300 40px var(--fontAwesome); }

    /* Nav Header */
    .nav-header ul {display: flex; font: 1.1em var(--fontNav); text-transform: uppercase; }
    .nav-header li+li { margin-left: 15px;}
    .nav-header li a {color: #758681;}

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

    /* Nav Main Toggle */
    .button label { display: block; }

    /* Main Menu Nav 1 */
    nav.navbar {  background-color: #fff; width: 100%; padding: 0 0 36px 15px; font-size: .72em;  }
    nav.navbar>ul { width: 1320px; margin: 0 auto; padding: 30px 0; position: relative; font: 1.5em var(--fontNav); text-transform: uppercase;  }
    nav.navbar>ul li a { padding: 10px 0 8px; border-bottom: 1px dotted var(--contentBlue); cursor: pointer; width: 272px; color: #2f4751; 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: #b0b5b4; }
    nav.navbar ul.dropdown-menu {background-color: #fff;}

    /* Main Menu Nav 2 */
    nav .nav-sec { max-height: 0; overflow: hidden; position: absolute; left: 304px; top: 0; }
    nav ul.dropdown-menu { border-left: 1px dotted var(--contentBlue); border-right: 1px dotted var(--contentBlue); padding: 30px 36px 0; min-height: 400px; text-transform: none;}
    nav ul.dropdown-menu li:first-child { text-transform: uppercase;}

    /* Sub-Nav M-Spalte */
    nav.sub-nav { font-size: 1.2em; padding: 24px 30px; }

    /* Breadcrumb */
    .breadcrumb { font-size: .9em; }
    .breadcrumb ol li{ margin-left: 0; text-indent: 0; }

    /* Footer */
    footer { font-size: .7em;}
    footer .col-content {display: grid; grid-template-columns: auto minmax(10px,366px); grid-row-gap: 2em;}
    footer nav.sitemap {grid-area: 2/1/3/2; }
    footer nav.sitemap ul { display: flex; flex-wrap: wrap;}
    footer nav.sitemap li { width: 33.33333%; }
    footer .meta { margin-left: 2em; font-size: 1.3em; text-align: left; grid-area: 2/2/3/3; display: flex; flex-direction: column; gap: 1em; }
    footer .meta p {margin: 0;}
    footer .nav-footer { display: block; }
    footer .nav-header { grid-area: 1/1/2/2;}
    footer .nav-header ul { font-size: 1.1em; justify-content: flex-start;}

}

@media (min-width: 992px) {
    /* Main Menu Nav 1 */
    nav.navbar {font-size: .8em; }
    nav.navbar>ul {  padding: 60px 0 80px; }
    nav.navbar>ul li a {  padding: 14px 0 12px;  width: 332px; }

    /* Main Menu Nav 2 */
    nav .nav-sec { left: 376px; }
    nav ul.dropdown-menu { padding: 60px 46px 0; }

    /* Footer */
    footer { font-size: .84em; padding-top: 50px; }
    footer .col-content {grid-row-gap: .4em;}
    footer .nav-footer a { padding: 13px 0;}

    a.backward { margin-bottom: 0;}

}

@media (min-width: 1200px) {

    /* Main Menu Nav 1 */
    nav.navbar {font-size: 1em; }
    nav.navbar>ul li a {  width: 366px; }

    /* Main Menu Nav 2 */
    nav .nav-sec { left: 426px; }
    nav ul.dropdown-menu { padding: 60px 60px 0; }

    /* Breadcrumb */
    .breadcrumb { font-size: 1em; }
    .breadcrumb ol {  color: #6b6b6b; }
    .breadcrumb ol li { margin-right: 22px; }
    .breadcrumb ol li+li::before { margin-right: 22px; }

    /* Footer */
    footer { font-size: 1em; padding-top: 60px; }
    footer .nav-footer a { padding: 14px 0;}

}

@media (min-width: 1320px) {

    footer>.container { padding: 0;}
}