/* Fonts */
@import url('https://fonts.googleapis.com/css?family=Abril+Fatface|Oswald:300,400,500,600,700');

/**
 * Colour palette
 * #F4F4F4 : Grey
 * #BC9E7B : Beige, Home, Instrumente Inhalt
 * #B87E69 : Warm Brown, Musikunterricht, Instrumente
 * #475A51 : Green, Instrumente
 * #1C343B : Dark Green, Instrumente 2
 * #619198 : Blue Bright
 */

/* Standardschrift */
html {
    font-size: 100%;
}
body {
    /* Standard: Lauftext */
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: 1em;
    line-height: 1.5em;
    color: #4a4a4a;
}
.body--no-scrollbar {
    overflow: hidden;
}

/* Sticky Footer: https://codepen.io/dezertdezine/pen/zKjggy */
html, body {
    height: 100%;
}
body {
    display: flex;
  flex-direction: column;
  height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    color: #464646;
}
body > * {
  flex: none;
}
body > .anchor {
    -ms-flex-negative: 0;
        flex-shrink: 0;
}
body > .wrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
  flex: 1 0 auto;
  overflow: auto;
}
.wrapper {
    padding-top: 6.25em;
}
.footer {
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

/* Grid-Warnings */
.container .container {
    background-color: rgba(189, 0, 0, 0.25);
    color: rgba(255, 255, 255, 0.5);
    position: relative;
}
.container .container::before {
    content: "Fluid Grid-Layout innerhalb Spalte ist nicht erlaubt.";
    position: absolute;
    left: 10px;
    top: 10px;
    background: red;
    color: white;
    display: inline-block;
    padding: .25em .5em;
    font-weight: bold;
    border-radius: 2px;
}

/* Helpers */
.nowrap {
    white-space: nowrap;
}
.clearfix::before,
.clearfix::after {
    content: "";
    display: table;
    clear: both;
}
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}
input[type="radio"].visuallyhidden {
    position: absolute;
    opacity: 0;
    top: 50%;
}
.invisible {
    visibility: hidden;
}
.hidden {
    display: none;
}
img {
    /*width: 100%;*/
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}
.abbr[title] {
    text-decoration: none;
}
.center {
    text-align: center;
}
.content {
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
}
fieldset {
    border: 0;
    padding: 0;
}
address {
    font-style: normal;
}
strong, b {
    font-weight: 600;
}

hr {
    width: 100%;
    max-width: 19.6875em;
    border-top-width: 2px;
    border-top-style: solid;
    border-top-color: inherit;
    margin-left: 0;
    margin-top: -0.75em;
    margin-left: -3px;
    margin-bottom: 1.4375em;
    margin-right: auto;
}

[data-ctype="textmedia"] + [data-ctype="div"] hr {
    margin-top: -1em;
}

.table + hr {
    margin-top: -0.3125em;
}

/* Links */
/**
 * CSS-Selektor ".ce-bodytext a" NICHT nutzen um links zu formatieren(!),
 * da dies nahezu alle Module beeinflusst.
 * Auch die Eigenschaften für den Selektor "a" so beibelassen.
 */
a {
    text-decoration: none;
    color: inherit;
}
.link {
    text-decoration: none;
    color: #619198;
}
.link[href^="tel://"] {
    /* text-decoration: none; */
}
.link:hover,
.link:focus,
.link:active {}

.link--internal {}
.link--internal-blank {}
.link--external {}
.link--external-blank {}
.link--download {}
.link--mail,
.link--external-blank {
    /* text-decoration: none; */
}

/* Tabellen */
.table {
    overflow-x: auto;
    margin-bottom: 2em;
    -webkit-overflow-scrolling: touch;
}

.table::-webkit-scrollbar {
    height: 1em;
    width: 1em;
}
.table::-webkit-scrollbar-track {
    background: #fff;
}
.table::-webkit-scrollbar-thumb {
    background: #000;
    border: 0.25em solid #fff;
    border-radius: .5em;
}
.contenttable {
    border-collapse: collapse;
    width: 100%;
    font-size: 1.25em;
    font-weight: 300;
    letter-spacing: 0.1em;
    line-height: 2em;
}
.contenttable caption {
    margin-bottom: 1em;
    text-align: left;
    display: none;
}
.contenttable td {
    min-width: unset;
    background-size: 20px 100%;
}
.contenttable td,
.contenttable th {
    padding: 0 1.15em 0 0;
    border: none;
    -webkit-transition: background-color .125s;
    transition: background-color .125s;
    vertical-align: top;
}
.contenttable p {
    margin: 0;
}

/* Header */
.header {
    background-color: #ffffff;
    position: relative;
    /* z-index: 2; */
    height: 6.25em;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 51;
}

/* .header--bg-0 { background-color: #f4f4f4 } */
.header--bg-1 { background-color: #f4f4f4 }
.header--bg-2 { background-color: #bc9e7b }
.header--bg-3 { background-color: #b87e69 }
.header--bg-4 { background-color: #475a51 }
.header--bg-5 { background-color: #1c343b }
.header--bg-6 { background-color: #619198 }
.header--bg-7 { background-color: #a73939 }

.header__logo-link {
    display: block;
    padding-top: 20px;
    padding-bottom: 24px;
}
.header__logo-image {
    margin-left: 0;
}

/* Banner(-Slider) */
.banner {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.banner-slider {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0;

    /* 800/3200*100 */
    padding-bottom: 25%;

    /* 900/1600*100 */
    /* padding-bottom: 56.25%; */ /* Bei Anpassung beachte .banner-slider__element-wrap--video .plyr__controls */
}
.banner-slider--background-transparent { background-color: transparent; color: #000000 }
.banner-slider--background-white { background-color: #ffffff; color: #000000 }
.banner-slider--background-black { background-color: #000000; color: #ffffff }

.banner-slider--keep-ratio {}
.banner-slider--fix-height {
    padding-bottom: 0;
    min-height: 450px;
}
.banner-slider--content-always-visible {
    padding-bottom: 0;
    height: 450px;
    max-height: calc(100vh - 250px);
}

[data-banner-slider-text]::before {
    content: attr(data-banner-slider-text);
    color: inherit;
    font-size: 3em;
    line-height: 1em;
    position: absolute;
    top: 80px;
    right: 176px;
    left: 176px;
    bottom: 80px;
    text-align: center;
    text-transform: uppercase;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-flex-line-pack: center;
        align-content: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0;
    z-index: 1;
}

.banner-slider__elements {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 1000%;
    -webkit-transition: all .75s cubic-bezier(0.79, 0, 0.36, 1);
    transition: all .75s cubic-bezier(0.79, 0, 0.36, 1);
}
.banner-slider__figure {
    width: 10%;
    margin: 0;
    float: left;
    height: 100%;
    position: relative;
}
.banner-slider__element-wrap {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-size: cover;
    background-position: 50% 50%;
}
.banner-slider__element-wrap--image-orientation-middle {}
.banner-slider__element-wrap--image-orientation-top { background-position: 50% top }
.banner-slider__element-wrap--image-orientation-bottom { background-position: 50% bottom }

/* https://jsfiddle.net/c6Lj9ek2/7/ */
.banner-slider__element-wrap--video {
    right: auto;
    bottom: auto;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    -webkit-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);
}
.banner-slider__element-wrap--video-orientation-middle {}
.banner-slider__element-wrap--video-orientation-top {
    top: 0;
    -webkit-transform: translateX(-50%) translateY(0);
            transform: translateX(-50%) translateY(0);
}
.banner-slider__element-wrap--video-orientation-bottom {
    top: auto;
    -webkit-transform: translateX(-50%) translateY(0);
            transform: translateX(-50%) translateY(0);
    bottom: 0;
}
.banner-slider__element-wrap--video .plyr {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.banner-slider__element-wrap--video .plyr__controls {
    display: none;
}
.banner-slider__element {
    display: none;
}
.banner-slider__element--image {}
.banner-slider__element--video {
    position: absolute;
    display: block;
    border: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.banner-slider__caption {
    position: absolute;
    bottom: 0;
    left: 0;
    max-width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.banner-slider__caption-text {
    background-color: rgba(0, 0, 0, 0.65);
    color: #ffffff;
    padding: 1em 1.5em;
}
.banner-slider__video-button {
    background-color: rgb(0, 0, 0);
    border: 0;
    width: 3.6em;
    display: block;
    background-image: url(../images/icon-play.svg);
    background-repeat: no-repeat;
    background-size: 1em;
    background-position: center;
    cursor: pointer;
    outline: none;
    padding: 1em 1.5em;
    font: inherit;
}
.banner-slider__video-button--playing {
    background-image: url(../images/icon-pause.svg);
}
.banner-slider__arrows {
    position: absolute;
    bottom: 0;
    right: 0;
    display: inline-block;
    z-index: 10;
}
.banner-slider__arrow-item {
    float: left;
}
.banner-slider__arrows-list {
    display: none;
    margin: 0;
    padding: 0;
    list-style: none;
}
.banner-slider__arrow-button {
    background-color: #000000;
    padding: 2em 2em 2em;
    display: block;
    cursor: pointer;
    position: relative;
}
.banner-slider__arrow-button::before {
    content: "";
    background-image: url(../images/icon-arrow-left--white.svg);
    width: 1.5em;
    height: 1em;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
}
.banner-slider__arrow-button::after {
    content: "";
    position: absolute;
    height: 2em;
    right: 0;
    top: 1.5em;
    width: 0.03125em;
    background-color: white;
}
.banner-slider__arrow-button--next::before {
    background-image: url(../images/icon-arrow-right--white.svg);
}
.banner-slider__arrow-button--next::after {
    right: auto;
    left: 0;
}

.banner-slider__radio-nr-1:checked ~ .banner-slider__arrows .banner-slider__arrows-list--1 { display: block }
.banner-slider__radio-nr-1:checked ~ .banner-slider__elements { -webkit-transform: translateX(0%); transform: translateX(0%); }
.banner-slider__radio-nr-2:checked ~ .banner-slider__arrows .banner-slider__arrows-list--2 { display: block }
.banner-slider__radio-nr-2:checked ~ .banner-slider__elements { -webkit-transform: translateX(-10%); transform: translateX(-10%); }
.banner-slider__radio-nr-3:checked ~ .banner-slider__arrows .banner-slider__arrows-list--3 { display: block }
.banner-slider__radio-nr-3:checked ~ .banner-slider__elements { -webkit-transform: translateX(-20%); transform: translateX(-20%); }
.banner-slider__radio-nr-4:checked ~ .banner-slider__arrows .banner-slider__arrows-list--4 { display: block }
.banner-slider__radio-nr-4:checked ~ .banner-slider__elements { -webkit-transform: translateX(-30%); transform: translateX(-30%); }
.banner-slider__radio-nr-5:checked ~ .banner-slider__arrows .banner-slider__arrows-list--5 { display: block }
.banner-slider__radio-nr-5:checked ~ .banner-slider__elements { -webkit-transform: translateX(-40%); transform: translateX(-40%); }
.banner-slider__radio-nr-6:checked ~ .banner-slider__arrows .banner-slider__arrows-list--6 { display: block }
.banner-slider__radio-nr-6:checked ~ .banner-slider__elements { -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.banner-slider__radio-nr-7:checked ~ .banner-slider__arrows .banner-slider__arrows-list--7 { display: block }
.banner-slider__radio-nr-7:checked ~ .banner-slider__elements { -webkit-transform: translateX(-60%); transform: translateX(-60%); }
.banner-slider__radio-nr-8:checked ~ .banner-slider__arrows .banner-slider__arrows-list--8 { display: block }
.banner-slider__radio-nr-8:checked ~ .banner-slider__elements { -webkit-transform: translateX(-70%); transform: translateX(-70%); }
.banner-slider__radio-nr-9:checked ~ .banner-slider__arrows .banner-slider__arrows-list--9 { display: block }
.banner-slider__radio-nr-9:checked ~ .banner-slider__elements { -webkit-transform: translateX(-80%); transform: translateX(-80%); }
.banner-slider__radio-nr-10:checked ~ .banner-slider__arrows .banner-slider__arrows-list--10 { display: block }
.banner-slider__radio-nr-10:checked ~ .banner-slider__elements { -webkit-transform: translateX(-90%); transform: translateX(-90%); }

/* Banner-Grid */
.banner-grid {}
.banner-grid--height100 {}
.banner-grid--height100 .banner-grid__col--text {}


.banner-grid__col {}
.banner-grid__col--image {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.body--instruments .banner-grid__col--image > .content {
}

.banner-grid__col--image > .content {
    width: 100%;
    margin-left: 0;
}
.banner-grid__col--image > .content > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.banner-grid__col--text {
    padding: 8.333333333333332% 20px 4.305555555555555% 7.5em;
    min-height: 29.5em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
}
.banner-grid__col--text > .content-section:first-child {
    margin-right: 0;
}
.banner-grid--3366 .banner-grid__col--text {
    padding-left: 8.5em;
    padding-top: 1.5625em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    height: calc(100vh - 6.25em);
    min-height: 36.25em;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* lets it scroll lazy */
}

.body--instruments .banner-grid--3366 .banner-grid__col--text {
    height: auto;
    min-height: calc(100vh - 6.25em);
}

.banner-grid--3366 h2.heading {
    margin-left: -1.9333333333333333em;
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
}

.banner-grid--3366 .banner-grid__col--text::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0);
}
.banner-grid--3366 .banner-grid__col--text::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.1);
}
.banner-grid--3366 .banner-grid__col--text::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.banner-grid__col--text .ce-bodytext p {
    font-size: 1.5625em;
    font-weight: 300;
    letter-spacing: 0.1em;
    line-height: 1.8em;
    padding-top: 1.15em;
    padding-bottom: 1.76em;
    padding-right: 0.8em;
}
.banner-grid__image-wrap {
    height: 100%;
    position: relative;
}
.banner-grid__image {
    height: 100%;
    background-size: cover;
    background-position: center;
    margin-left: calc((100vw - 200%) / 2 * -1);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-left: 20px solid transparent;
    background-repeat: no-repeat;
    margin-right: -3.769231em;
    position: relative;
}

.banner-grid--3366 .banner-grid__image {
    margin-right: -20px;
}

.body--instruments .banner-grid__image {
    position: fixed;
    left: -50%;
    right: 50%;
    height: calc(100vh - 6.25em);
    z-index: 40;
    transform: translateX(-280px);
}

@media (max-width: 1024px) { /* iPad quer */
    .body--instruments .banner-grid__image {
        transform: translateX(-380px);
    }
}

@media (max-width: 768px) { /* iPad hoch */
    .body--instruments .banner-grid__image {
        transform: translateX(-290px);
    }
}

@media (max-width: 767px) { /* schmaler als iPad hoch */
    .body--instruments .banner-grid__image {
        display: none;
    }
}

.banner-grid__svg {
    position: absolute;
    top: -10px;
    right: -1px;
    height: calc(100% + 20px);
    width: auto;
    /*-webkit-transform: scale(1.05);
            transform: scale(1.05);
    -webkit-transform-origin: center;
            transform-origin: center;*/
}

.banner-grid__svg path {
    fill: inherit !important;
    -webkit-transition: all .15s;
    transition: all .15s;
}

.banner-grid__icon {
    position: absolute;
    right: -3.75em;
    top: 50%;
    width: 7.5em;
    height: 7.5em;
    background-color: white;
    border-radius: 50%;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: calc(100% - 3.75em) auto;
    background-position: center;
    margin-top: -3.75em;
}
.banner-grid--3366 .banner-grid__icon {
}

/* Breadcrumb */
.breadcrumb-wrap {
    color: inherit;
}

.body--instruments .breadcrumb-wrap {
    display: none;
}

.header--bg-1 ~ .breadcrumb-wrap {
    border-bottom: 1px solid #ebebeb;
}
.header--bg-2 ~ .breadcrumb-wrap {
    color: #bc9e7b;
    border-bottom: 1px solid rgba(188, 158, 123, 0.15);
}
.header--bg-3 ~ .breadcrumb-wrap {
    color: #b87e69;
    border-bottom: 1px solid rgba(184, 126, 105, 0.15);
}
.header--bg-4 ~ .breadcrumb-wrap {
    color: #475a51;
    border-bottom: 1px solid rgba(71, 90, 81, 0.15);
}
.header--bg-5 ~ .breadcrumb-wrap {
    color: #1c343b;
    border-bottom: 1px solid rgba(28, 52, 59, 0.15);
}
.header--bg-6 ~ .breadcrumb-wrap {
    color: #619198;
    border-bottom: 1px solid rgba(97, 145, 152, 0.15);
}
.header--bg-7 ~ .breadcrumb-wrap {
    color: #a73939;
    border-bottom: 1px solid rgba(167, 57, 57, 0.15);
}


.body--home .breadcrumb-wrap {
    display: none;
}
.breadcrumb {
    font-size: 1em;
    font-weight: 300;
    letter-spacing: 0.1em;
    line-height: 2em;
    margin-right: -0.2em;
}
.breadcrumb__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding-right: 1em;
    line-height: 1.5em;
    padding-top: .25em;
    padding-bottom: .25em;
    margin-left: -20px;
}
.breadcrumb__item {}
.breadcrumb__item:not(:last-child)::after {
    content: "";
    display: inline-block;
    position: relative;
    background-image: url(../images/msaarberg/navigation/arrow-right--black.svg);
    width: 0.7em;
    height: 1.35em;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0.7em 1.35em;
    top: 0.25em;
    left: -0.15em;
    opacity: 0.15;
}
.breadcrumb__link {
    display: inline-block;
    padding: .5em 20px;
}
.breadcrumb__link--no-link {
    cursor: default;
}
.breadcrumb__item:last-child .breadcrumb__link {
    padding-right: 0;
}

/* Video Elemente */
.video {
    margin: 0;
    padding: 0;
}
.video__video {
    max-width: 100%;
    height: 0;
}
.video__video:not(.plyr__video-wrapper) {
    /**
     * plyr greift nicht auf iPhones für mp4
     * Es wird das normale HTML5 Video-Tag eingsetzt.
     * Deshalb höhe auf auto, statt 0, damit Video sichtbar.
     */
    height: auto;
}
.plyr__play-large {
    cursor: pointer;
    border: 0;
    background-color: black;
    padding: 26px;
    border-radius: 0;
    outline: 0;
}
.plyr--video .plyr__controls {
    padding-top: 10px;
}

.navigation {
    display: none;
    z-index: 20;
    background-color: #ffffff;
    position: relative;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    overflow-y: scroll;
    vertical-align: middle;
    text-align: center;
    white-space: nowrap;
    color: #464646;
}


.navigation::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0);
}

.navigation::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
}

[data-backend-layout=""] .navigation::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.1);
}

.navigation::-webkit-scrollbar {
    width: 15px;
    height: 5px;
}

[data-backend-layout="5"] .navigation {background-color: #bc9e7b; color: white;}
[data-backend-layout="5"] .navigation__close { background-image: url(../images/msaarberg/navigation/close--white.svg); }
[data-backend-layout="6"] .navigation { background-color: #b87e69; color: white }
[data-backend-layout="6"] .navigation__close { background-image: url(../images/msaarberg/navigation/close--white.svg); }
[data-backend-layout="7"] .navigation { background-color: #475a51; color: white }
[data-backend-layout="7"] .navigation__close { background-image: url(../images/msaarberg/navigation/close--white.svg); }
[data-backend-layout="8"] .navigation { background-color: #1c343b; color: white }
[data-backend-layout="8"] .navigation__close {/* background-image: url(../images/msaarberg/navigation/close--dark.svg); */}
[data-backend-layout="9"] .navigation { background-color: #619198; color: white }
[data-backend-layout="9"] .navigation__close { background-image: url(../images/msaarberg/navigation/close--white.svg); }

[data-backend-layout="10"] .navigation { background-color: #f4f4f4 }

[data-backend-layout="11"] .navigation { background-color: #a73939; color: white; }
[data-backend-layout="11"] .navigation__close { background-image: url(../images/msaarberg/navigation/close--white.svg); }

.navigation::before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.navigation--active {
    display: block;
    -ms-flex-line-pack: center;
        align-content: center;
}

.navigation__close {
    position: fixed;
    top: 16px;
    width: 1.3em;
    height: 1.3em;
    background-color: transparent;
    border: 0;
    white-space: nowrap;
    text-indent: 200%;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    background-image: url(../images/msaarberg/navigation/close.svg);
    background-size: contain;
    background-repeat: no-repeat;
    right: 26px;
    margin-top: 0;
    cursor: pointer;
    background-size: 0.9em;
    background-position: center;
    font-size: 3.125em;
    margin-right: 0;
    color: transparent;
}

.navigation__list {
    margin-left: auto;
    margin-right: auto;
    max-width: 1040px;
    width: 100%;
    padding-right: 1.6em;
    display: inline-block;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    font-family: 'Abril Fatface', cursive;
    font-size: 3.125em;
    letter-spacing: 0.1em;
    line-height: 1.25em;
    padding: 0;
    list-style: none;
    position: relative;
    padding-left: 1.2em;
    padding-right: 1.2em;
    vertical-align: middle;
    text-align: left;
    white-space: normal;
    color: inherit;
    margin-top: 1.66em;
    margin-bottom: 1em;
}

.navigation__item {
    padding-right: 1.6em;
    margin-bottom: .75em;
}

.navigation__link {
    position: relative;
}
.navigation__link::after {
    content: "";
    position: absolute;
    height: 1px;
    width: 0;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: inherit;
    left: -2.4em;
    bottom: -0.32em;
    -webkit-transition: width .4s cubic-bezier(0.44, 1.02, 0.71, 1.01);
    transition: width .4s cubic-bezier(0.44, 1.02, 0.71, 1.01);
}
.navigation__link--active::after,
.navigation__link:hover::after,
.navigation__item:hover .navigation__link:after,
.navigation__link:hover:not(:focus)::after,
.navigation__link:focus::after {
    width: calc(100% + 2.26em);
}

.navigation__level2 {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.6em;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.43em;
    letter-spacing: 0.14285714285714285em;
    margin-left: 2.4em;
    margin-top: 0.4857142857142857em;
    font-family: "Oswald";
    font-weight: 300;
}

.navigation__level2-item {}
.navigation__level2-link {
    position: relative;
}


.navigation__level2-link::after {
    content: "";
    position: absolute;
    height: 1px;
    width: 0;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: inherit;
    left: -2.4em;
    bottom: -0.32em;
    -webkit-transition: width .4s cubic-bezier(0.44, 1.02, 0.71, 1.01);
    transition: width .4s cubic-bezier(0.44, 1.02, 0.71, 1.01);
}

.navigation__level2-link--active::after,
.navigation__level2-link:hover::after,
.navigation__level2-link:hover:not(:focus)::after,
.navigation__level2-link:focus::after {width: calc(100% + 2.26em);}

.navigation__level2-text {}

.header__burger {
    background-color: transparent;
    border: 0;
    float: right;
    width: 5em;
    height: 6.25em;
    background-image: url(../images/msaarberg/navigation/Menu_Nav--white.svg);
    background-repeat: no-repeat;
    background-position: center;
    color: transparent;
    background-size: calc(100% - 2.25em) auto;
    cursor: pointer;
}

.header--bg-0 .header__burger { background-image: url(../images/msaarberg/navigation/Menu_Nav.svg) }
.header--bg-1 .header__burger { background-image: url(../images/msaarberg/navigation/Menu_Nav.svg) }
.header--bg-2 .header__burger { }
.header--bg-3 .header__burger { }
.header--bg-4 .header__burger { }
.header--bg-5 .header__burger { }
.header--bg-6 .header__burger { }
.header--bg-7 .header__burger { }

.header > .container > .content > .col12 {
    position: relative;
}

.header__logo {
    position: absolute;
    left: 20px;
}

.header__logo-link {
    padding-top: 0.9375em;
    padding-bottom: 0.9375em;
}
.header__logo-image {
    width: 11em;
    height: 4.33125em;
}

.header--bg-1 .header__logo-link,
.header--bg-0 .header__logo-link {
    background-image: url(../images/msaarberg/logo/Logo-MSA.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.header--bg-1 .header__logo-image,
.header--bg-0 .header__logo-image { opacity: 0; }

.header--bg-2 .header__logo-link {}
.header--bg-2 .header__logo-image {}

.header--bg-3 .header__logo-link {}
.header--bg-3 .header__logo-image {}

.header--bg-4 .header__logo-link {}
.header--bg-4 .header__logo-image {}

.header--bg-5 .header__logo-link {}
.header--bg-5 .header__logo-image {}

.header--bg-6 .header__logo-link {}
.header--bg-6 .header__logo-image {}

.header--bg-7 .header__logo-link {}
.header--bg-7 .header__logo-image {}

/* Footer-Navigation */
.navigation-footer__list {
    margin: 0;
    padding: 0;
    list-style: none;
    font-style: normal;
}
.navigation-footer__item {
    float: left;
}
.navigation-footer__text {
    display: inline-block;
    padding: .5em .25em;
}
.navigation-footer__link {
    color: inherit;
    text-decoration: none;
}
.navigation-footer__link:hover,
.navigation-footer__link:active {
    text-decoration: underline;
}


/* Navigation Category (Buttons) */
.navigation-category {
    display: inline-block;
}
.navigation-category--buttons-and-list {
    display: block;
}
.navigation-category__list {
    display: inline;
    list-style: none;
    margin: 0;
    padding: 0;
}

.navigation-category__list--buttons-and-list {
    display: block;
}
.navigation-category__item {
    float: left;
    display: inline;
    max-width: 100%;
}
.navigation-category__item--buttons-and-list {
    display: block;
    width: 100%;
}
/* Navigation Category (DropDown) */
.navigation-category--dropdown {
    position: relative;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: .5em;
}
.button--dropdown-button {}
.button--dropdown-button-active ~ .navigation-category__list--dropdown {
    display: block;
}
.navigation-category__list--dropdown {
    position: absolute;
    z-index: 1;
    top: 3.125em;
    left: 0;
    display: inline-block;
    display: none;
    width: 100%;
    /* background-color: #eeeeef; */
}
.navigation-category__item--dropdown {
    float: none;
    display: block;
    background-color: #eeeeee;
}
.navigation-category__drowndown-children-list {
    padding: 0;
    margin: 0;
    list-style: none;
}
.navigation-category__drowndown-children-item {}
.navigation-category__drowndown-children-link {
    display: block;
    padding: .5em 1em;
}
.navigation-category__dropdown-main-cat-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/* Kategorie-Menu: Hauptkategoriebuttons mit Unterkategorieliste */
.navigation-categroy-list {}
.navigation-category-list--buttons-and-list {
    margin-bottom: 1em;
}
.navigation-category-list__link--active {
    font-weight: 700;
}

/* Banner & Claim */

/* Formulare */
.form {}
.form__legend {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}
.form__fieldwrap {
    margin-bottom: 40px;
}
.form__input {
    width: 100%;
    border: 1px solid #4a4a4a;
    background-color: transparent;
    font-weight: 400;
    font-size: 1.1em;
    line-height: 1.2272727272727273em;
    color: #4a4a4a;
    border-radius: 0;
    padding-top: .7em;
    padding-bottom: .7em;
    padding-left: 20px;
    padding-right: 20px;
    font-family: inherit;
    outline: none;
}
.form__input--textarea {
    min-height: 266px;
}
.form__input:focus {
    outline: 3px solid #000000;
}
.form__checkboxes--error .form__label {
    color: #A53239;
}
.form__input:required {}
.form__input:invalid {}
.form__input:invalid:focus {
    outline-color: #A53239;
}
.form__input:valid {}
.form__input:valid:focus {
    outline-color: #9fac92;
}

/* Headings */
h1, h2, h3, h4, h5 {
    line-height: 1.25em;
    margin-bottom: .5em;
    margin-top: 1em;
    font-family: 'Abril Fatface', cursive;
    font-weight: 400;
    color: inherit;
    letter-spacing: 0.075em;
    line-height: 1.0833333333333333em;
}
h1, .heading--h1 { font-size: 4em } /* ungenutzt */
h2, .heading--h2 { font-size: 3.75em }
h3, .heading--h3 {
    font-size: 2.5em;
    letter-spacing: 0.05em;
    line-height: 1.25em;
    margin-bottom: 1.25em;
}
h4, .heading--h4 {
    font-size: 1em;
    font-size: 1.85em;
    letter-spacing: 0.05714285714285714em;
    line-height: 1.1428571428571428em;
}
h5, .heading--h5 {
    font-size: 1.25em;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 2em;
    font-family: inherit;
    margin-bottom: 0;
    margin-top: 2em;
}

.contenttable h5,
.contenttable .heading--h5 {
    font-size: 1em;
}
.contenttable tr:first-child .heading {
    margin-top: 0.5em;
}

/* Paragraphs */
p, .paragraph {
    color: inherit;
    margin-top: 0;
    margin-bottom: 2em;
}

h4 + p, .heading--h4 + p{
    margin-top: 0.5em;
}

.body h5 + p, .body .heading--h5 + p{
    margin-top: 0.25em;
}

.heading--left { text-align: left }
.heading--right { text-align: right }
.heading--center { text-align: center }

.main p,
.main .paragraph {
    font-size: 1.25em;
    font-weight: 300;
    letter-spacing: 0.055em;
    line-height: 1.7;
}

/* Lists */
.ce-bodytext ul:not([class*="shariff"]) {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1.25em;
    font-weight: 300;
    letter-spacing: 0.055em;
    line-height: 1.7;
    margin-bottom: 2em;
    padding-left: 1.4em;
}
.ce-bodytext ol {
    margin: 0;
    padding: 0;
    font-size: 1.25em;
    font-weight: 300;
    letter-spacing: 0.055em;
    line-height: 1.7;
    margin-bottom: 2em;
    padding-left: 1.4em;
}
.ce-bodytext p + ul:not([class*="shariff"]),
.ce-bodytext p + ol {
    margin-top: -2em;
}
.ce-bodytext ul:not([class*="shariff"]) li {
    display: block;
    padding-left: 1.4em;
    position: relative;
    /*margin-bottom: 0.5em;*/
}
/*.ce-bodytext ol li {
    margin-bottom: 0.5em;
}*/
.ce-bodytext ol.list--margins li,
.ce-bodytext ul.list--margins li {
    margin-bottom: 0.5em;
}
.ce-bodytext ul:not([class*="shariff"]) li::before {
    content: "";
    border-radius: 50%;
    border-width: 0.1em;
    border-color: inherit;
    position: absolute;
    top: 0.95em;
    left: 0;
    -webkit-box-sizing: initial;
            box-sizing: initial;
    display: block;
    border-style: solid;
}

/* Aligments */
.align-center { text-align: center }
.align-left { text-align: left }
.align-right { text-align: right }
.text-right { text-align: right; }
.text-left { text-align: left; }
.text-center { text-align: center; }

/* Floats */
.float-right { float: right }
.float-left { float: left }

/* Anker */
.anchor { display: block }

/* Lists */
/* CSS-Klasse .list NICHT formatieren */

/* Backgrounds & section paddings */
.main {
    /**
     * Prevents horizontal scrollbars if background-grey is applied
     */
    overflow: hidden;

    /* wegen Inhaltselemente am Ende "Dateiliste" und  DropDown. */
    /*padding-bottom: 13.0625em;
    padding-top: 12.3125em;*/
}
/*.body--home .main {
    padding-bottom: 1.625em;
    padding-top: 8.75em;
}
.body--follow .main {
    padding-top: 11.3125em;
    padding-bottom: 13.5em;
}
.page-ID-29 .main,
.page-ID-144 .main,
.page-ID-145 .main {
    padding-top: 5.1875em;
    padding-bottom: 4.25em;
    background-color: #f4f4f4;
}*/

.body--instruments .main {
    padding-bottom: 0;
    padding-top: 0;
}


.main .container > .content-section {
    /*padding-bottom: 2em;
    padding-top: 2em;*/
    padding-top: 3.5625em;
    padding-bottom: 3.5625em;
}

.main .container > .content-section:first-child {
    padding-top: 6em;
}

.main .container > .content-section:last-child {
    padding-bottom: 6em;
}

.main .container > .content-section:not([class*="background-"]) + .content-section:not([class*="background-"]),
.main .container > .content-section.background-grey + .content-section.background-grey,
.main .container > .content-section.background-beige + .content-section.background-beige,
.main .container > .content-section.background-brown-warm + .content-section.background-brown-warm,
.main .container > .content-section.background-green + .content-section.background-green,
.main .container > .content-section.background-green-dark + .content-section.background-green-dark,
.main .container > .content-section.background-blue-bright + .content-section.background-blue-bright,
.main .container > .content-section.background-red-dark + .content-section.background-red-dark {
    margin-top: -3.5625em;
}

.main .container > .content-section.content-section--no-padding + .content-section.content-section--no-padding {
    margin-top: 0;
}

/*.body--follow .main .container > .content-section:not([class*="background-"]) {
    padding-bottom: 0;
    padding-top: 0;
    margin-bottom: -0.4375em;
}*/


.body--follow .main section[data-ctype="uploads"][class*="shift"] {
    margin-bottom: 1.8125em;
}

.main .container > .content-section:not([class*="background-"]):not([data-ctype="uploads"]) {
    /*padding-top: 0;
    padding-bottom: 0.1875em;*/
}

.main .container > .content-section--no-padding {
    padding-top: 0;
    padding-bottom: 0;
}

section[data-ctype="uploads"]:not([class*="shift"]) {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2.6875em;
}

.main .container .content-section--no-paddings {
    /**
     * Wegen CType shortcut.
     * Siehe: fileadmin/theme/extensions/fluid_styled_content/Resources/Private/Layouts/Default.html
     * Verhindert doppelte paddings
     */
    padding-bottom: 0;
    padding-top: 0;
}

.main .container > .content-section > header .heading,
.container > .content-section .ce-bodytext > .heading:first-child,
.main .container > .content-section [data-ctype] .anchor + .heading {
    margin-top: 0.35em;
}

[class*="background-"] {
    position: relative;
}
.banner > .container > .content-section:not([class*="background-"]) {
    fill: #ffffff; /* Fallback SVG-Farbe falls kein Hintergrund gewählt */
}
[class*="background-"]::before {
    content: "";
    position: absolute;
    z-index: 0;
    bottom: 0;
    top: 0;
    width: calc(100vw);
    left: calc((100vw - 100%) / 2 * -1);
    background-color: #ffffff;
    -webkit-transition: background-color .15s;
    transition: background-color .15s;
}

.background-grey::before        { background-color: #f4f4f4 }
.background-grey {
    fill: #f4f4f4; /* genutzt für SVG in Banner-Grid (Header-Element) */
}
.background-beige::before       { background-color: #bc9e7b }
.background-beige {
    color: white;
    border-color: white; /* Button-Borders uns Linien */
    fill: #bc9e7b; /* genutzt für SVG in Banner-Grid (Header-Element) */
}
.background-brown-warm::before       { background-color: #b87e69 }
.background-brown-warm {
    color: white;
    border-color: white; /* Button-Borders uns Linien */
    fill: #b87e69; /* genutzt für SVG in Banner-Grid (Header-Element) */
}
.background-green::before       { background-color: #475a51 }
.background-green {
    color: white;
    border-color: white; /* Button-Borders uns Linien */
    fill: #475a51; /* genutzt für SVG in Banner-Grid (Header-Element) */
}
.background-green-dark::before  { background-color: #1c343b }
.background-green-dark {
    color: white;
    border-color: white; /* Button-Borders uns Linien */
    fill: #1c343b; /* genutzt für SVG in Banner-Grid (Header-Element) */
}
.background-blue-bright::before { background-color: #619198 }
.background-blue-bright {
    color: white;
    border-color: white; /* Button-Borders uns Linien */
    fill: #619198; /* genutzt für SVG in Banner-Grid (Header-Element) */
}

.background-red-dark::before { background-color: #a73939 }
.background-red-dark {
    color: white;
    border-color: white; /* Button-Borders uns Linien */
    fill: #a73939; /* genutzt für SVG in Banner-Grid (Header-Element) */
}

[class*="background-"] > * {
    z-index: 1;
    position: relative;
}

/* Buttons */
.button,
.pagination a {
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    text-align: center;
    border: 1px solid #eeeeee;
    padding: 0.35em 1.5em 0.5em;
    background-color: #eeeeee;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    outline: none;
    min-width: 48px;
    -webkit-transition: all .15s;
    transition: all .15s;
    font-size: .925em;

    background-color: transparent;
    border-color: inherit;
    letter-spacing: 0.075em;
    color: inherit;
    word-spacing: 0.0625em;
    /*padding: 0 1.5em;
    line-height: 2.375em;*/
}
.button--small {
    font-size: .75em;
    padding: .25em .5em;
}
.button--ghost {
    /*background-color: transparent;
    border-color: inherit;
    letter-spacing: 0.140625em;
    color: inherit;
    word-spacing: 0.0625em;
    padding: 0 1.5em;*/
}
.button--margined {
    margin: 0 1.25em 1.25em 0;
}
.button--has-no-action {
    cursor: default;
}
.button:hover,
.button:focus,
.button--active,
.pagination .active a {
    background-color: #464646;
    color: white;
}

/*[class*="background-"] .button {
    background-color: inherit;
    opacity: .5;
}

[class*="background-"] .button:hover,
[class*="background-"] .button:focus,
[class*="background-"] .button--active,
[class*="background-"] .pagination .active a {
    background-color: inherit;
    border-color: inherit;
    color: inherit;
    opacity: 1;
}*/

.angebots-db__filters .button {
    background-color: inherit;
    opacity: .5;
}

.angebots-db__filters .button:hover,
.angebots-db__filters .button:focus,
.angebots-db__filters .button--active,
.angebots-db__filters .pagination .active a {
    background-color: transparent;
    border-color: inherit;
    color: inherit;
    opacity: 1;
}

.button--has-no-action:hover,
.button--has-no-action:focus {
    background-color: #eeeeee;
    color: inherit;
}
.button--category {
    float: left;
    margin-right: .5em;
    margin-bottom: .5em;
    white-space: nowrap;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
}
.button--fullwidth {
    width: 100%;
    margin-right: 0;
}
.button--text-align-left {
    text-align: left;
}
.button--submit {
    float: right;
    padding-left: 15px;
    padding-right: 15px;
}

.button--reset {}
.button--dropdown {
    float: none;
    margin-right: 0;
    margin-bottom: 0;
    text-align: left;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}
.button--dropdown-button {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    text-align: left;
    margin-left: .5em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    padding-right: 2.875em;
}
.button--dropdown-button::after {
    content: "\f078";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 1em;
    margin-top: 0.1875em;
}
.button--dropdown-button-active::after {
    content: "\f077"
}
.button--dropdown-button
.button--dropdown {
    float: none;
    display: block;
    margin-right: 0;
    margin-bottom: 0;
    text-align: left;
}
.button--drowndown-children-link {
    float: none;
    display: block;
    margin-right: 0;
    text-align: left;
    margin-left: 1.5em;
}

.button--expand-button {
    background-image: url(../images/icon-plus.svg);
    background-position: center;
    background-size: .75em .75em;
    background-repeat: no-repeat;
    font-size: inherit;
}
.button--expand-button:hover,
.button--expand-button:focus {
    background-image: url(../images/icon-plus--white.svg);
}

/* Messages */
.message {
    border: 1px solid #000000;
    margin-bottom: 40px;
    padding-left: 1em;
    padding-right: 1em;
    background-color: #f7f7f7;
    cursor: default;
}
.message--bad {
    border-color: #A53239;
    background-color: #ac3239;
    padding-top: 1em;
    color: white;
}

/* Zitate */
.quote {
    text-align: center;
    margin-bottom: 3em; /* 60/20 */
    margin-top: 1.75em; /* 35/20 */
}
.quote::before {}
.quote__content {
    padding: 0 2.5em; /* 50/20 */
}
.quote__cite-text {
    font-size: inherit;
    font-weight: 500;
    margin-bottom: 0.8em; /* 16/20 */
    display: block;
}
.quote__cite-text::before,
.quote__cite-text::after {
    content: none;
}
.quote__footer {}
.quote__source {
    font-size: 14px;
    color: #9b9b9b;
    font-style: normal;
    line-height: 1.8571428571428572em; /* 26/14 */
}

/* Styleguide */
.styleguide-heading {
    margin-bottom: 2rem;
}

.styleguide-description {
    display: block;
    margin-bottom: 0;
    margin-top: 0.15em;
    font-size: 1rem;
    line-height: 1.5rem;
    font-family: 'Work Sans', sans-serif;
    font-weight: 400;
    text-transform: none;
    color: #ccc;
}

/* News List */
.news-list__main {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
}
.news-list__heading {
    margin-top: 0;
    display: -webkit-box;
}

.news-list__article-wrap--three-columns .news-list__heading {
    margin-top: .5em;
}

/* Maximale Zeilenanzahl */
@supports (-webkit-line-clamp: 2) and (-webkit-box-orient: vertical) {
    .news-list__heading {
        -webkit-line-clamp: 2; /* number of lines to show */
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

.news-list__category-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.news-list__date {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
}
.news-list__article-wrap--three-columns  .news-list__date {
    padding-top: .5em;
    margin-bottom: -.8em;
}
.news-list__article-wrap {
    position: relative;
    padding-bottom: 2em;
    margin-bottom: 2em;
}
.news-list__article-wrap::after {
    content: "";
    height: 1px;
    position: absolute;
    left: 20px;
    right: 20px;
    background-color: black;
    bottom: 0;
}
.news-list__article-wrap:first-child {
    padding-top: 0;
}
.news-list__article-wrap:last-child {
    border-bottom: none;
}
.news-list__article {
    height: 100%;
}
.news-list__article-wrap--two-columns .news-list__teaser {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}

/* Maximale Zeilenanzahl */
@supports (-webkit-line-clamp: 3) and (-webkit-box-orient: vertical) {
    .news-list__article-wrap--two-columns .news-list__heading {
        -webkit-line-clamp: 3; /* number of lines to show */
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}
.news-list__article-wrap--three-columns .news-list__article {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.news-list__contents {
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

.news-list__footer {
    -ms-flex-negative: 0;
        flex-shrink: 0;
}

.news-list__article-wrap--three-columns {}
.news-list__article-wrap--three-columns .news-list__article {

}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .news-list__article-wrap--three-columns .news-list__article {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        height: auto;
    }
}
.news-list__article-wrap--three-columns .news-list__main {}
.news-list__article-wrap--three-columns .news-list__main-inner {}
.news-list__article-wrap--three-columns .news-list__image-wrap {}
.news-list__article-wrap--three-columns .news-list__image-link {}
.news-list__article-wrap--three-columns .news-list__image {}
.news-list__article-wrap--three-columns .news-list__contents-wrapper {}
.news-list__article-wrap--three-columns .news-list__contents {}
.news-list__article-wrap--three-columns .news-list__header {}
.news-list__article-wrap--three-columns .news-list__heading {}
.news-list__article-wrap--three-columns .news-list__heading-link {}
.news-list__article-wrap--three-columns .news-list__heading-text {}
.news-list__article-wrap--three-columns .news-list__date {}
.news-list__article-wrap--three-columns .news-list__date-time {}
.news-list__article-wrap--three-columns .news-list__footer {}

/* Events Liste */
.events-list {
    width: 100%;
    overflow: auto;
    margin-top: 1.5em;
    margin-bottom: 3.5em;
}

.events-list__item {
    display: flex;
    justify-content: center;
    align-items: stretch;
    width: auto;
    position: relative;
    padding-left: 10px;
    padding-right: 10px;
}

.events-list__item--past {
    color: #A3A3A3;
}

.events-list__item__text {
    width: 50%;
    min-width: 225px;
    max-width: 600px;
    padding: 1.75rem 6px;
    border-bottom: 1px solid rgba(0,0,0,0.075);
}

.events-list__item__title {
    margin: 0;
    /* margin-top: -0.35em; */
    font-size: 1.375em;
    letter-spacing: 0.035em;
    line-height: 1.5;
}

.events-list__item__day {
    order: -1;
    width: 10%;
    min-width: 135px;
    max-width: 200px;
    padding: 1.75rem 10px;
    font-size: 1.25em;
    letter-spacing: 0.035em;
    line-height: 1.7;
    border-bottom: 1px solid rgba(0,0,0,0.075);
}

.events-list__item__time {
    order: -1;
    width: 15%;
    min-width: 180px;
    max-width: 250px;
    padding: 1.75rem 10px;
    font-size: 1.25em;
    letter-spacing: 0.035em;
    line-height: 1.7;
    border-bottom: 1px solid rgba(0,0,0,0.075);
}

.events-list__item__location {
    width: 15%;
    min-width: 125px;
    max-width: 300px;
    padding: 1.75rem 10px;
    font-size: 1.25em;
    letter-spacing: 0.035em;
    line-height: 1.7;
    border-bottom: 1px solid rgba(0,0,0,0.075);
}

.events-list__item__teaser {
    font-size: 1.25em;
    letter-spacing: 0.035em;
    line-height: 1.7;
}

.events-list__item:last-child .events-list__item__text,
.events-list__item:last-child .events-list__item__day,
.events-list__item:last-child .events-list__item__time,
.events-list__item:last-child .events-list__item__location {
    border-bottom: none;
}

/* News-Detail */
.news-detail__share {
    margin-top: 3em;
    margin-bottom: 1em;
}

/* News-Detail: Related News-Items */
.news-detail__related-news-image-col {
    -webkit-box-ordinal-group: -1;
        -ms-flex-order: -2;
            order: -2;
}
.news-detail__related-news-date-col {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
}
.news-detail__related-news-title {
    margin-bottom: 0;
}
.news-detail__related-news-article {
    margin-bottom: 40px;
}
.news-detail__related-news-date {
    margin-top: .5em;
    display: block;
    margin-bottom: -.9em;
}

/* Dateiliste */
.files {}
.files__list {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-bottom: 0.55em;
    font-size: 1.25em;
    letter-spacing: 0.1em;
    line-height: 2em;
    color: inherit;
    margin-top: -1em;
}
.files__list--multiple {
    margin-bottom: 2.4em;
}
.files__name {
    text-decoration: none !important;
    display: inline-block;
    width: 100%;
}
.files__link {
    text-decoration: none;
    display: block;
    width: 100%;
    overflow: hidden;
    color: inherit;
    padding-right: 4em;
}
.files__link:hover,
.files__link:focus {
    text-decoration: underline;
}
.files__link::before,
.files__link::after {
    content: none;
}
.files__description {
    display: block;
    color: #9a9a9a;
    margin-top: 1em;
}
.files__size {
    display: inline-block;
    float: right;
    width: 13em;
    text-align: right;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-right: 2.25em;
    position: absolute;
    right: 0;
    top: 1em;
    display: none;
}
.files__item {
    margin: 0;
    padding: 1.35em 0 0.6em;
    background: url('../images/file-icons/Icon_Default.svg') no-repeat right 1.05em center;
    background-size: 2em 2.4em;
    position: relative;
    -webkit-box-sizing: content-box;
            box-sizing: content-box; /* behebt unschönes ruckeln wegen jQuery slideUp() und slideDown() Animation */
}
.files__item .files__size::before {
    content: "";
}
.files__item[data-file-name$=".doc"] .files__size::before,
.files__item[data-file-name$=".docx"] .files__size::before {
    content: "Word | ";
}
.files__item[data-file-name$=".doc"],
.files__item[data-file-name$=".docx"] {
    background-image: url('../images/file-icons/Icon_Word.svg');
}
.files__item[data-file-name$=".ppt"] .files__size::before,
.files__item[data-file-name$=".pptx"] .files__size::before {
    content: "PowerPoint | ";
}
.files__item[data-file-name$=".ppt"],
.files__item[data-file-name$=".pptx"] {
    background-image: url('../images/file-icons/Icon_Powerpoint.svg');
}
.files__item[data-file-name$=".xls"] .files__size::before,
.files__item[data-file-name$=".xlsx"] .files__size::before {
    content: "Excel | ";
}
.files__item[data-file-name$=".xls"],
.files__item[data-file-name$=".xlsx"] {
    background-image: url('../images/file-icons/Icon_Excel.svg');
}
.files__item[data-file-name$=".pdf"] {
    background-image: url('../images/msaarberg/icons/PDF_icon.svg');
}
[class*="background-"] .files__item[data-file-name$=".pdf"] {
    background-image: url('../images/msaarberg/icons/PDF_icon--white.svg');
}

.files__item[data-file-name$=".pdf"] .files__size::before {
    content: "PDF | ";
}
.files__item[data-file-name$=".jpg"] .files__size::before,
.files__item[data-file-name$=".jpeg"] .files__size::before,
.files__item[data-file-name$=".png"] .files__size::before,
.files__item[data-file-name$=".gif"] .files__size::before,
.files__item[data-file-name$=".tiff"] .files__size::before,
.files__item[data-file-name$=".bmp"] .files__size::before {
    content: "Bild | ";
}
.files__item[data-file-name$=".jpg"],
.files__item[data-file-name$=".jpeg"],
.files__item[data-file-name$=".png"],
.files__item[data-file-name$=".gif"],
.files__item[data-file-name$=".tiff"],
.files__item[data-file-name$=".bmp"] {
    background-image: url('../images/file-icons/Icon_Bild.svg');
}

.files__more {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
.files__more-link::after {
    content: attr(title);
}
.files__more-line {
    width: 100%;
    padding-right: 2em;
    position: relative;
    max-width: 17.85em;
}
.files__more-line::before {
    content: "";
    position: absolute;
    top: 0;
    left: 1px;
    width: 100%;
    max-width: calc(100% - 2em);
    border-top-width: 2px;
    border-top-style: solid;
    border-top-color: inherit;
}

/* Image-Gallery / Images */
.gallery {
    margin-bottom: -20px;
}
.gallery__figure {
    position: relative;
    margin: 0;
    margin-bottom: 40px;
    overflow: hidden;
}

.container--no-gaps .gallery__figure,
.content--no-gaps .gallery__figure {
    margin-bottom: 0;
}

.container--no-gaps .gallery,
.content--no-gaps .gallery {
    margin-bottom: 40px;
}

.gallery__link {
    display: block;
}
.gallery__image {
    display: block;
    max-width: 100%;
}
.gallery__figure:hover .gallery__image { }
.gallery__image--force-100-percent {
    max-width: none;
    width: 100%;
}
.gallery__caption {
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    color: white;
    padding-left: 1em;
    padding-right: 1em;
    font-size: 1em;
    padding-top: 1em;
}

/* Text & Media (Positionierung) */
.ce-right.ce-intext:not(.ce-nowrap) .gallery {
    display: inline-block;
    float: right;
    margin-left: 12px;
    width: 33.333333333333336%; /* tbd: media query */
}
.ce-left.ce-intext:not(.ce-nowrap) .gallery {
    display: inline-block;
    float: left;
    margin-right: 12px;
    width: 33.333333333333336%; /* tbd: media query */
}
.ce-right .gallery__image {
    margin-left: auto;
    margin-right: 0;
}
.ce-left .gallery__image {
    margin-left: 0;
    margin-right: auto;
}

/* Navigation Pagination */
.navigation-pagination {
    margin-bottom: 3.5em;
}
.navigation-pagination__info {}
.navigation-pagination__list,
.navigation-pagination .pagination { /* genericcatalogue */
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-block;
    margin: 0 auto;
    margin-left: -.25em;
}
.navigation-pagination__item,
.navigation-pagination .pagination li { /* genericcatalogue */
    float: left;
    margin-right: .25em;
    margin-left: .25em;
    margin-bottom: .25em;
}
.navigation-pagination__item--current {}
.navigation-pagination__item--last {}
.navigation-pagination__item--next {}
.navigation-pagination__text,
.navigation-pagination .page { /* genericcatalogue */
    min-width: 3.125em; /* 50/16 */
}
.navigation-pagination__link {}

/* Product DB */
.project-navigation {}
.project-navigation__list {}
.project-navigation__item {}
.project-navigation__item--reset {}
.project-navigation__sub {}
.project-navigation__button--active {}
.project-navigation__button--maincategory:hover,
.project-navigation__button--maincategory:focus {}
.project-navigation__button--active + .project-navigation__sub {}
.project-navigation__sub li::before {}
.product-items {}
.product-items__item {}
.product-items__item-description {}
.product-items__item-description::before,
.product-items__item-description::after {}
.product-items__item:hover .product-items__item-description {}
.product-items__item-link {}
.product-items__item-description p {}

.category__description--hidden{
        display: none;
}

.category__description {
    padding-bottom: 2em;
}

/* Search (indexed_search) */
.tx-indexedsearch-searchbox {}

.searchform__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}

.tx-indexedsearch-form {
    margin-bottom: 1px;
    width: 100%;
    padding-right: 5px;
}

.tx-indexedsearch-form label {
    margin-bottom: 0.75em;
    display: block;
}

div.tx-indexedsearch-browsebox {
    margin: 3.5em 0 2.5em 0;
    border-bottom: 1px solid #ccc;
    text-align: center;
    padding-bottom: 2em;
}

ul.tx-indexedsearch-browsebox {
    margin-top: 1.5em;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.tx-indexedsearch-browsebox li {
    list-style: none;
    padding: 0 1em;
}

.tx-indexedsearch-browsebox:last-child {
    border: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.tx-indexedsearch-res {
    border-bottom: 1px solid #ccc;
    padding-bottom: 1em;
}

.tx-indexedsearch-text-item-path {
    font-size: 0.85em;
}

/* Placeholder text */
::-webkit-input-placeholder {
    color: #9b9b9b;
    text-transform: uppercase;
}
:-moz-placeholder {
    color: #9b9b9b;
    text-transform: uppercase;
}
::-moz-placeholder {
    color: #9b9b9b;
    text-transform: uppercase;
}
:-ms-input-placeholder {
    color: #9b9b9b;
    text-transform: uppercase;
}

/* News List Three Columns */
.news-list__article-wrap {
    margin-bottom: 40px;
    padding-bottom: 0;
}

.news-list__article-wrap::after {
    content: none;
}

/* News-Slider Items */
.news-slider-article-item {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    border: 1px solid #979797;
    text-align: center;
    padding-top: 27px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    position: relative;
}
.news-slider-article-item__title {margin-top: 15px;margin-bottom: 21px;}
.news-list__heading-link::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.news-slider-article-item__date {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
    color: #619198;
    font-size: 1.25em;
    letter-spacing: 0.1em;
    line-height: 2em;
}
.news-slider-article-item__teaser {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    margin-bottom: 0.75em;
    pointer-events: none;
    z-index: 1;
}
.news-slider-article-item__teaser p {
    pointer-events: auto;
    margin-bottom: 0.5em;
}

.news-slider-article-item__teaser p:last-child {
    margin-bottom: 1em;
}

.news-slider-article-item__location-time {
    color: #619198;
    font-size: 1.25em;
    letter-spacing: 0.09523809523809523em;
    line-height: 1.9047619047619047em;
}
.news-slider-article-item__location {
    position: relative;
    display: inline-block;
    margin-right: 0.8095238095238095em;
}
.news-slider-article-item__location::after {
    content: "";
    width: 2px;
    height: 1em;
    background-color: #619198;
    display: inline-block;
    margin-left: 0.7142857142857143em;
    position: relative;
    top: .1em;
}
.news-slider-article-item__time {
    white-space: nowrap;
    display: inline-block;
}
.news-list__footer {
    font-size: 1.25em;
    margin-top: -0.5em;
    margin-bottom: 1.5em;
}

/* Modal */
.modal__overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.30);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
}

.modal__container {
    background-color: #fff;
    padding: 0;
    max-width: 770px;
    width: 50%;
    border-radius: 0;
    overflow: hidden;
    box-sizing: border-box;
    max-height: calc(100vh - 40px);
    overflow: auto;
}

.modal__header {
    padding-inline: 20px;
}

.modal__title {
    margin-bottom: 1em;
}

.modal__content {
    padding: 0 20px 20px;
}

.modal__image--wrap {
    margin-bottom: 20px;
}

.modal__text p:last-child {
    margin-bottom: 0;
}

.modal__close {
    font-size: 24px;
    position: absolute;
    top: 20px;
    right: 20px;
    background: transparent;
    border: 0;
    cursor: pointer;
    margin: 0;
    padding: 0;
}

.modal__close::before {
    content: "✕";
}

/* Modal animation */
@keyframes mmfadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes mmfadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes mmslideIn {
    from { transform: translateY(15%); }
    to { transform: translateY(0); }
}

@keyframes mmslideOut {
    from { transform: translateY(0); }
    to { transform: translateY(-10%); }
}

.micromodal-slide {
    display: none;
}

.micromodal-slide.is-open {
    display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
    animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
    animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
    animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
    animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
    will-change: transform;
}

/* Image slider*/
.image-slider {
    position: relative;
    width: 100%;
}
.image-slider__images {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    -webkit-transform: translateX(0);
            transform: translateX(0);
    -webkit-transition: all .75s cubic-bezier(0.79, 0, 0.36, 1);
    transition: all .75s cubic-bezier(0.79, 0, 0.36, 1);
}
.image-slider__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    border: 0;
    height: 100%;
}
.image-slider__images { width: 1000% }

.image-slider__figure {
    width: 10%;
    margin: 0;
    float: left;
    height: 100%;
    position: relative;
}

.image-slider__radio-nr-1:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(0); transform: translateX(0) }
.image-slider__radio-nr-2:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-10%); transform: translateX(-10%) }
.image-slider__radio-nr-3:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-20%); transform: translateX(-20%) }
.image-slider__radio-nr-4:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-30%); transform: translateX(-30%) }
.image-slider__radio-nr-5:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-40%); transform: translateX(-40%) }
.image-slider__radio-nr-6:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-50%); transform: translateX(-50%) }
.image-slider__radio-nr-7:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-60%); transform: translateX(-60%) }
.image-slider__radio-nr-8:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-70%); transform: translateX(-70%) }
.image-slider__radio-nr-9:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-80%); transform: translateX(-80%) }
.image-slider__radio-nr-10:checked ~ .image-slider__images-wrap .image-slider__images { -webkit-transform: translateX(-90%); transform: translateX(-90%) }

.image-slider__image-wrap {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-size: cover;
    background-position: 50% 50%;
}
.image-slider__images-wrap {
  position: relative;
    width: 100%;
    padding-bottom: 100%;
    overflow: hidden;
}
.image-slider__video {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.image-slider__caption {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 1.6666666666666667em 1.3333333333333333em 0.4444444444444444em; /* 30/18; 24/18; 8/18 */
    margin-bottom: 0;
    background-color: rgba(0,0,0,0.25);
    color: white;
}
.image-slider__arrows-list {
    list-style-type: none;
    display: none;
}
.image-slider__arrows {
    height: 0;
    display: none;
}
.image-slider__radio-nr-1:checked ~ .image-slider__arrows .image-slider__arrows-list-1 { display: block; }
.image-slider__radio-nr-2:checked ~ .image-slider__arrows .image-slider__arrows-list-2 { display: block; }
.image-slider__radio-nr-3:checked ~ .image-slider__arrows .image-slider__arrows-list-3 { display: block; }
.image-slider__radio-nr-4:checked ~ .image-slider__arrows .image-slider__arrows-list-4 { display: block; }
.image-slider__radio-nr-5:checked ~ .image-slider__arrows .image-slider__arrows-list-5 { display: block; }
.image-slider__radio-nr-6:checked ~ .image-slider__arrows .image-slider__arrows-list-6 { display: block; }
.image-slider__radio-nr-7:checked ~ .image-slider__arrows .image-slider__arrows-list-7 { display: block; }
.image-slider__radio-nr-8:checked ~ .image-slider__arrows .image-slider__arrows-list-8 { display: block; }
.image-slider__radio-nr-9:checked ~ .image-slider__arrows .image-slider__arrows-list-9 { display: block; }
.image-slider__radio-nr-10:checked ~ .image-slider__arrows .image-slider__arrows-list-10 { display: block; }

.image-slider__arrow-button {
    width: 4em;
    height: 4em;
    position: absolute;
    top: 50%;
    margin-top: -2em;
    border: 0;
    cursor: pointer;
    background-color: transparent;
    text-align: center;
}
.image-slider__arrow-button--previous {
    left: 0;
}
.image-slider__arrow-button--next {
    right: 0;
}
.image-slider__icon-arrow {
    color: white;
    font-size: 3.75em;
}
/*http://lea.verou.me/2011/01/styling-children-based-on-their-number-with-css3/*/
/*Hide arrows if only one image vorhanden.*/
.image-slider__arrows-list:first-child:nth-last-child(1) {
    display: none !important;
}

.image-slider__thumbnails {
    width: auto;
    float: none;
    margin-top: 20px;
}

.image-slider__thumbnail-label {
    cursor: pointer;
    display: block;
    opacity: .5;
    -webkit-transition: all .75s cubic-bezier(0.79, 0, 0.36, 1);
    transition: all .75s cubic-bezier(0.79, 0, 0.36, 1);
}
.image-slider__thumbnail-item {
    margin-bottom: 20px;
}
.image-slider__radio-nr-1:checked  ~ .image-slider__thumbnails [for="detail-slide-1"] { opacity: 1 }
.image-slider__radio-nr-2:checked  ~ .image-slider__thumbnails [for="detail-slide-2"] { opacity: 1 }
.image-slider__radio-nr-3:checked  ~ .image-slider__thumbnails [for="detail-slide-3"] { opacity: 1 }
.image-slider__radio-nr-4:checked  ~ .image-slider__thumbnails [for="detail-slide-4"] { opacity: 1 }
.image-slider__radio-nr-5:checked  ~ .image-slider__thumbnails [for="detail-slide-5"] { opacity: 1 }
.image-slider__radio-nr-6:checked  ~ .image-slider__thumbnails [for="detail-slide-6"] { opacity: 1 }
.image-slider__radio-nr-7:checked  ~ .image-slider__thumbnails [for="detail-slide-7"] { opacity: 1 }
.image-slider__radio-nr-8:checked  ~ .image-slider__thumbnails [for="detail-slide-8"] { opacity: 1 }
.image-slider__radio-nr-9:checked  ~ .image-slider__thumbnails [for="detail-slide-9"] { opacity: 1 }
.image-slider__radio-nr-10:checked ~ .image-slider__thumbnails [for="detail-slide-10"] { opacity: 1 }

.image-slider__thumbnail-image {
    display: block;
}
.image-slider__thumbnail-item::before {
    content: none !important;
}
.image-slider__arrow-item::before {
    content: none !important;
}
.image-slider__thumbnail-list {
    list-style: none;
}

/* Footer */
.social-media {
    margin-bottom: 2.2em;
}
.social-media::before,
.social-media::after {
    content: "";
    display: table;
    clear: both;
}
.social-media__list {
    display: inline-block;
    float: right;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 40px;
}
.social-media__item {
    float: left;
    padding-left: 20px;
}

.newsletter {
    margin-bottom: 2.2em;
}
.newsletter__form {}
.newsletter__input-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #4a4a4a;
    border: 2px solid white;
}
.newsletter__input-wrap > * {
    width: 100%;
}
.newsletter__hint {
    padding: 14px;
    padding-left: 18px;
    padding-right: 15px;
    text-transform: uppercase;
    width: auto;
    font-weight: 400;
    font-size: 22px;
    line-height: 27px;
}
.newsletter__hint::before {
    content: attr(data-newsletter-hint);
}
.newsletter__input {
    font-size: 22px;
    line-height: 27px;
    border: 0;
    background-color: white;
    padding-left: 18px;
    padding-right: 18px;
    font-family: "Work Sans", sans-serif;
    border-radius: 0;
}
.newsletter__submit {
    width: 115px;
    background-color: #4a4a4a;
    border: 0;
    cursor: pointer;
}
.newsletter__submit i {
    color: white;
    font-size: 30px;
    position: relative;
    left: -2px;
}

/* Sitemap */
.sitemap {}
.sitemap__list {}
.sitemap__item {}
.sitemap__link {}
.sitemap__text {}

/* Footer */
.footer {
    background-color: #464646;
    padding: 3.625em 0 0.1875em;
    margin-top: -1px;
    color: white;
    letter-spacing: 0.125em;
    line-height: 1.625;
    overflow: hidden;
    border-bottom: 1px solid #464646;
}

.body--instruments .footer {
    position: relative;
    z-index: 50;
}

.footer a {
    text-decoration: none;
}
.footer a:hover {
    text-decoration: underline;
}
.footer .link {
    color: inherit;
}
.footer .gallery__image {
    max-width: 15.625em;
    margin-right: 0;
    position: relative;
    /*top: -0.4375em;*/
}

/* Angebotsdatenbank */
.angebots-db {
    font-size: 1.25em;
}

.angebots-db__filters {
    margin-top: 40px;
}
.angebots-db__main-catergories {
    clear: both;
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
}
.angebots-db__subcategories {
    width: 100%;
    margin-top: 3.75em;
    display: none;
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
}
.angebots-db__subcategory {
    margin-top: -0.65em;
    margin-bottom: 3.25em;
    will-change: display;
}
.angebots-db__subcategory-heading {
    font-family: inherit;
    font-size: 1.5em;
    font-weight: 500;
    letter-spacing: 0.16666666666666666em;
    line-height: 2em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 1.7em;
}
.angebots-db__subcategory-heading-text {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}
.angebots-db__subcategory-hint {
    width: 9.533333333333333em;
    margin-top: -0.03333333333333333em;
}
.angebots-db__subcategory-hint::after {
    content: attr(data-column-hint);
    font-family: Oswald;
    font-size: 0.6666666666666666em;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 2em;
    opacity: .35;
}
.angebots-db__subcategory-list {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: -8px;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    padding-top: 1em;
    padding-bottom: 0.5em;
}
.angebots-db__subcategory-list:nth-child(2) {
    line-height: 1em;
}
.angebots-db__subcategory-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.angebots-db__subcategory-link {
    font-size: 1.5em;
    font-weight: 300;
    letter-spacing: 0.16666666666666666em;
    line-height: 2em;
    cursor: pointer;
    max-width: calc(100% - 9.366666666666667em);
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-right: 0.6666666666666666em;
}

.angebots-db__subcategory-link-text {
    position: relative;
    display: inline-block;
}

.angebots-db__subcategory-link-text::after {
    content: "";
    position: absolute;
    bottom: 1px;
    left: -1px;
    width: 0;
    border-top: 1px solid;
    -webkit-transition: width .4s cubic-bezier(0.44, 1.02, 0.71, 1.01);
    transition: width .4s cubic-bezier(0.44, 1.02, 0.71, 1.01);
}

.angebots-db__subcategory-link:hover .angebots-db__subcategory-link-text {}
.angebots-db__subcategory-link:hover .angebots-db__subcategory-link-text::after {
    width: calc(100% - 4px);
}

.angebots-db__subcategory-link::after {
    content: attr(data-more-info-text);
    font-size: 0.4em;
    font-weight: 300;
    letter-spacing: 0.07166666666666667em;
    line-height: 5em;
    display: inline-block;
    text-transform: uppercase;
    margin-left: 0.6666666666666666em;
    padding-left: 1.3333333333333333em;
    position: relative;
    top: -0.4166666666666667em;
    padding-right: 3.3333333333333335em;
    opacity: .5;
    background-image: url(../images/msaarberg/navigation/arrow-right.svg);
    background-repeat: no-repeat;
    background-position: center right 2em;
    -webkit-transition: all .4s;
    transition: all .4s;
    background-size: 1.1666666666666667em auto;
}
.angebots-db__subcategory-link:hover::after {
    opacity: 1;
}

.angebots-db__subcategory-teachers {
    width: 14.05em;
    font-family: Oswald;
    letter-spacing: 0.13em;
    margin-bottom: 0;
    line-height: 2em;
    margin-top: 0.65em;
    /*opacity: 0.35;*/
}

/* ToTop-Button */
.totop-button {
    display: block;
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 4em;
    height: 4em;
    background-color: #bc9e7b;
    z-index: 10;
    background-image: url(../images/icon-top-white.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 25%;
    -webkit-transform: translateX(6.5em);
            transform: translateX(6.5em);
    -webkit-transition: all .125s ease-in-out;
    transition: all .125s ease-in-out;
}

.totop-button:hover {
    background-color: #464646;
}

.totop-button--visible {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}

/* cookie banner */

.cc-allow, .cc-deny,.dp--cookie-check{
    display: none !important;
}
.cc-window{
    background-color: #f4f4f4 !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: 1.25em !important;
    font-weight: 300 !important;
    letter-spacing: 0.1em !important;
    line-height: 2em !important;
}

.cc-window .cc-message {
    padding: 12px 20px 0 !important;
    margin-bottom:12px;
}

.cc-window .cc-allow-all{
    width:auto !important;
    line-height: 1em !important;
    margin-left: auto;
    margin-top:0;
}

/* Cookie-Banner */
#cc-notification.cc-mobile {
    position: fixed !important;
}
#cc-notification h2 {
    margin-right: 145px !important;
}
#cc-notification {
    background-color: #f4f4f4 !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: 1.25em !important;
    font-weight: 300 !important;
    letter-spacing: 0.1em !important;
    line-height: 2em !important;
}
#cc-notification #cc-notification-wrapper {
    padding: 12px 20px 0 !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
#cc-notification #cc-notification-permissions li strong {
    color: #000000 !important;
}
#cc-notification h2 span, #cc-notification h2 {
    margin-bottom: 12px !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    font-weight: inherit !important;
}
#cc-notification h2, #cc-notification h3, #cc-notification p {
    font-size: 1.1em;
    color: #333 !important;
    line-height: 1.5;
    text-transform: inherit;
    letter-spacing: inherit;
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
#cc-notification h2 span {
    font-size: inherit;
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
#cc-notification a, #cc-notification a:visited {
    font-size: 1em !important;
    line-height: inherit;
}
#cc-notification ul.cc-notification-buttons li a,.cc-window .cc-allow-all,
#cc-notification ul.cc-notification-buttons li a:visited {
    font-size: inherit !important;
}
#cc-notification ul.cc-notification-buttons li a,.cc-window .cc-allow-all,
#cc-notification ul.cc-notification-buttons li a:visited,.cc-window .cc-allow-all:visited {
    color: #ffffff !important;
    text-decoration: none;
    border: 1px solid #ffffff;
    display: inline-block;
    border-radius: 0 !important;
    font-size: 16px;
    padding: 0.125em 1.25em;
    background-color: transparent !important;
    border-color: #000000;
    margin-top: 4px !important;
    -webkit-transition: unset;
    transition: unset;
    color: white !important;
    font-family: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    font-weight: inherit !important;
    font-family: 'Oswald', sans-serif !important;
    font-weight: 300 !important;
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    color: rgb(70,70,70) !important;
    text-align: center;
    border: 1px solid #eeeeee;
    padding: .75em 1em !important;
    font-family: inherit;
    font-weight: inherit;
    font-size: 1rem !important;
    /* line-height: 2.375em !important; */
    outline: none;
    min-width: 48px;
    -webkit-transition: all .15s;
    transition: all .15s;
    border: 1px solid black;
    margin-top: 9px !important;
}
#cc-notification ul.cc-notification-buttons li a:hover,.cc-window .cc-allow-all:hover,
#cc-notification ul.cc-notification-buttons li a:active,.cc-window .cc-allow-all:active,
#cc-notification ul.cc-notification-buttons li #cc-approve-button-allsites:hover,
#cc-notification ul.cc-notification-buttons li #cc-approve-button-allsites:active {
    color: inherit !important;
    text-decoration: none !important;
    background-color: transparent !important;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    border-radius: 0 !important;
    background-color: #464646 !important;
    color: white !important;
}
#cc-notification ul.cc-notification-buttons {
  width: 200px !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit !important;
  letter-spacing: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}
#cc-notification a,
#cc-notification a:visited {
    color: #000000!important;
    text-decoration: underline !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
#cc-notification a:hover{
    color: #000000 !important;
    text-decoration: none !important;
}
#cc-notification.cc-mobile h2 span,
#cc-notification.cc-mobile h2 {
    font-size: 1.05em;
    line-height: 1.6;
}
#cc-notification.cc-mobile {
    bottom: 0 !important;
    top: auto;
    z-index: 999 !important;
}
#cc-notification.cc-mobile ul.cc-notification-buttons li a,
#cc-notification.cc-mobile ul.cc-notification-buttons li a:visited {
    margin-top: 0 !important;
}

/* t8_cookiebanner */
.form__toggle > .form__input--toggle + .form__label--toggle {
    display: block;
}

.csettings__item__title {
    font-weight: normal;
}

.cbanner__pagelinks a, .cwindow__footer__link {
    background-image: none;
}

/**
 * Media-Queries
 * Defaults: fileadmin/theme/css/t8-grid.css
 */
@media (max-width: 970px) {
    .navigation__close {
    }
}


@media (max-width: 1024px) {
    body {
        font-size: 65%;
    }
    h2, .heading--h2 { font-size: 2.65em }
    h3, .heading--h3 {
        font-size: 2em;
    }
    /* Alle 20px Schriftgrössen  auf Mobile vergrössern */
    .main .ce-bodytext p,
    .news-slider-article-item__teaser p,
    .news-slider-article-item .news-slider-article-item__location-time,
    .news-slider-article-item__date,
    .breadcrumb,
    .contenttable,
    .files__list,
    h5, .heading--h5,
    .ce-bodytext ul:not([class*="shariff"]),
    .tx-genericcatalogue,
    .footer p {
        font-size: 1.35em;
    }
    .navigation__link::after, .navigation__level2-link::after{
        left: -0.5em;
    }
    .banner-grid__icon {
        font-size: .8em;
        margin-right: 0;
    }
    .banner-grid--3366 .banner-grid__col--image {
        width: 15%;
    }
    .banner-grid--3366 .banner-grid__col--text {
        width: 75%;
        padding-right: 0;
        padding-left: 60px;
    }
    .banner-grid--3366 h2.heading {
        margin-left: -1em;
    }
    #cc-notification ul.cc-notification-buttons li a,
    #cc-notification ul.cc-notification-buttons li a:visited {
        font-size: 0.780000000195em !important;
    }

    .events-list__item__day {
        min-width: 95px;
    }

    .modal__container {
        width: 66%;
    }
}

@media (max-width: 767px) {
    .banner-grid__col--image {
        width: 40% !important;
    }
    .banner-grid__col--text {
        width: 60% !important;
    }

    .modal__container {
        width: 75%;
    }
}

@media (max-height: 768px) {
    .navigation__list {
        font-size: 2.5em;
    }

}
@media (max-height: 480px) {
    .navigation__list {
        font-size: 2.25em;
    }
}

@media (max-width: 680px) {
    .events-list__item {
        justify-content: flex-start;
    }

    .events-list__item__title {
        font-size: 1.15em !important;
        line-height: 1.3;
        letter-spacing: 0.05em;
    }

    .banner-grid__col--image {
        width: 100% !important;
    }
    .banner-grid__col--text {
        width: 100% !important;
    }
    .banner-grid__col--image {
        padding: 0;
    }
    .banner-grid__image {
        height: 140px;
        margin-left: 0;
        margin-right: 0;
        border-left: 0;
    }
    .banner-grid__col--image > .content > div {
        padding: 0;
    }
    .banner-grid__svg {
        display: none;
    }
    .banner-grid__icon {
        right: auto;
        left: 50%;
        margin-left: -3.75em;
        display: none;
    }
    .banner-grid__col--text {
        padding-left: 20px;
        padding-top: 0;
        padding-right: 20px;
        padding-bottom: 0.85em;
        min-height: auto;
    }
    .banner-grid__col--text > .content > section {
        padding-right: 0;
    }
    .banner-grid__col--text .navigation-pagination {
        display: none;
    }
    .banner-grid__col--text .ce-bodytext {
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 0;
    }
}

/* iPhones */
@media (max-width: 480px) {

    .modal__container {
        width: calc(100% - 40px);
    }
    /*.body--home .main,
    .body--follow .main {
        padding-top: 3em;
    }
    .body--follow .main {
        padding-bottom: 3em;
        margin-bottom: 0;
    }
    .page-ID-29 .main,
    .page-ID-144 .main,
    .page-ID-145 .main {
        padding-top: 0;
        padding-bottom: 0;
    }
    .body--instruments .main {
        margin-bottom: -5.961538461538462em;
    }*/
    section[data-ctype="uploads"]:not([class*="shift"]) {
        margin-top: 0;
    }
    .footer {
        padding-bottom: 2.25em;
    }
    .footer > .container > .content > [class*="col"]:last-child {
        -webkit-box-ordinal-group: 0;
            -ms-flex-order: -1;
                order: -1;
        margin-bottom: 3.173076923076923em;
    }
    .footer .gallery__image {
        margin-right: auto;
        margin-top: 1em;
        margin-left: 0;
    }
    .banner-grid--3366 .banner-grid__col--text {
        padding-left: 20px;
        padding-top: 0;
        height: auto;
    }
    .banner-grid--3366 h2.heading {
        margin-left: 0;
    }
    .angebots-db__subcategories {
        margin-top: 0;
    }
    .angebots-db__subcategory-heading {
        margin-bottom: .75em;
    }
    .angebots-db__subcategory {
        margin-bottom: 1em;
    }
    .gallery__figure {
        margin-bottom: 20px;
    }
    .news-detail {
        margin-top: -2.5em;
    }
    /*.news-detail__body-text-wrap {
        padding-left: 0;
        padding-right: 0;
    }*/
    .angebots-db__subcategory-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        margin-bottom: 2em;
    }
    .angebots-db__subcategory-link {
        max-width: none;
    }
    .angebots-db__subcategory-hint {
        display: none;
    }
    .angebots-db__subcategory-teachers {
        margin-top: 0;
        padding-left: 10px;
    }
    .angebots-db__subcategory-teachers::before {
        content: attr(data-mobile-text-hint);
        display: block;
        margin-left: -10px;
    }
    .files__more-line {
        display: none;
    }
    .files__more {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        white-space: nowrap;
    }

    .files__more .button--ghost {
        font-size: 0.9600000000000001em;
    }
    .footer p {
        line-height: 2em;
    }
    .angebots-db__subcategory-link::after {
        font-size: 0.5333333333333334em;
    }
    .navigation__level2 {
        margin-left: 0;
    }
    #cc-notification ul.cc-notification-buttons li a,
    #cc-notification ul.cc-notification-buttons li a:visited {
        font-size: 0.8rem !important;
    }
    #cc-notification {
        font-size: 1.5em !important;
    }
}

/* Fix for "Team Member" DCE: nicer layout for titles with line break */
section[data-ctype="dce_dceuid6"] .heading {
    display: flex;
    min-height: 2.3em;
    align-items: end;
}