/***** Aufklapper - Start *****/
.folder {
    margin: 0 0 76px;
}
.folder .fold {
    margin: 0 0 3px;
}
.folder .fold .fold-title {
    position: relative;
    padding: 14px 56px 14px 22px;
    font-weight: 400;
    color: #fff;
    background-color: rgb(var(--color-primary));
    cursor: pointer;
}
.folder .fold .fold-title::before {
    content: '';
    position: absolute;
    top: 22px;
    right: 30px;
    width: 4px;
    height: 21px;
    background-color: #fff;
    transition: all var(--transition-t2) ease-in-out;
}
.folder .fold.active .fold-title::before {
    transform: rotate(90deg);
}
.folder .fold .fold-title::after {
    content: '';
    position: absolute;
    top: 30px;
    right: 22px;
    width: 21px;
    height: 4px;
    background-color: #fff;
}
.folder .fold .fold-title button {
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    text-align: left;
    border: none;
    background: no-repeat;
}
.folder .fold .fold-content {
    display: none;
    padding: 24px 22px 24px 22px;
}
.folder .fold .fold-content .text {
    display: flow-root;
}
.folder .fold .fold-content p {
    line-height: 1.26923;
}
.folder .fold .fold-content p:last-of-type {
    margin: 0;
}
.folder .fold .fold-content .image,
.folder .fold .fold-content .video {
    margin: 0 0 20px;
}
.folder .fold .fold-content .image.pos-1,
.folder .fold .fold-content .video.pos-1 {
    float: right;
    width: 50%;
    margin-left: 30px;
}
.folder .fold .fold-content .image.pos-2,
.folder .fold .fold-content .video.pos-2 {
    float: left;
    width: 50%;
    margin-right: 30px;
}
.folder .fold .fold-content .image.pos-3,
.folder .fold .fold-content .video.pos-3 {
    width: 100%;
}
.folder .fold .fold-content .image img,
.folder .fold .fold-content .video video {
    display: block;
    width: 100%;
    height: auto;
}
.folder .fold .fold-content .video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}
.folder .fold .fold-content .video.pos-1,
.folder .fold .fold-content .video.pos-2 {
    padding-bottom: 28.125%;
}
.folder .fold .fold-content .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.folder .fold .fold-content .image .caption {
    padding: 4px 0 0;
    line-height: 1.5;
    font-style: italic;
}
/***** Aufklapper - End *****/

/***** Teaser - Start *****/
.teaser {
    text-align: center;
}
.teaser .image {
    display: flex;
    justify-content: center;
    margin: 0 0 30px;
}
.teaser .text {
    margin: 0 0 20px;
    font-weight: 300;
}
#page3 .teaser .button {
    border: none;
}

.teaser-image-icon {
    margin: 0 0 76px;
}
.teaser-image-icon + .teaser-image-icon {
    margin-top: -36px;
}
.teaser-image-icon .teaser-content {
    position: relative;
    display: flex;
}
.teaser-image-icon.has-icon .teaser-content {
    margin: 41px 79px 0;
}
.teaser-image-icon .image {
    flex: 0 0 491px;
    margin: 0 28px 0 0;
}
.teaser-image-icon .text {
    margin: 0 0 20px;
}
.teaser-image-icon .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: -41px;
    left: -79px;
    width: 154px;
    height: 129px;
    background-color: rgb(var(--color-primary));
}
.teaser-image-icon .icon.i-1::before {
    content: '';
    width: 69px;
    height: 69px;
    background: url("../Images/bg-icon-info-big.svg") no-repeat;
    background-size: contain;
}
.teaser-image-icon .icon.i-2::before {
    content: '';
    width: 63px;
    height: 63px;
    background: url("../Images/bg-icon-radiator.svg") no-repeat;
    background-size: contain;
}
.teaser-image-icon .icon.i-3::before {
    content: '';
    width: 65px;
    height: 65px;
    background: url("../Images/bg-icon-waterdrops.svg") no-repeat;
    background-size: contain;
}
.teaser-image-icon .icon.i-4::before {
    content: '';
    width: 80px;
    height: 80px;
    background: url("../Images/bg-icon-water-analysis.svg") no-repeat;
    background-size: contain;
}
.teaser-image-icon .icon.i-5::before {
    content: '';
    width: 69px;
    height: 77px;
    background: url("../Images/bg-icon-water-tap.svg") no-repeat;
    background-size: contain;
}

.teaser-image-icon .text a {
    display: inline-block;
}
.teaser-image-icon .text a[href*=".PDF"],
.teaser-image-icon .text a[href*=".pdf"] {
    position: relative;
    padding: 0 0 0 46px;
}
.teaser-image-icon .text a[href*=".PDF"]::before,
.teaser-image-icon .text a[href*=".pdf"]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 32px;
    height: 38px;
    background: url("../Images/bg-icon-pdf-blue.svg") no-repeat;
    background-size: contain;
}
/***** Teaser - End *****/

/***** Bild vollflächig mit grünem Kasten - Start *****/
.image-fullwidth-text {
    position: relative;
    margin: 0 0 76px;
}
.content .image-fullwidth-text:last-of-type {
    margin-bottom: 0;
}
.image-fullwidth-text.pos-1 {
    height: 570px;
}
.image-fullwidth-text.var-2 {
    min-height: 456px;
}
.image-fullwidth-text .image {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.image-fullwidth-text .image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.image-fullwidth-text .container,
.image-fullwidth-text .row {
    height: 100%;
}
.image-fullwidth-text .text-box-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.image-fullwidth-text.pos-0 .text-box-wrapper {
    justify-content: center;
}
.image-fullwidth-text.pos-1 .text-box-wrapper {
    justify-content: flex-start;
    align-items: flex-end;
}
.image-fullwidth-text .text-box {
    width: 982px;
    max-width: 100%;
    margin: 62px 0 63px;
    padding: 50px 76px;
    color: #fff;
    font-weight: 300;
    line-height: 1.3846;
    text-align: center;
    background-color: rgb(var(--color-custom-1));
    z-index: 2;
}
.image-fullwidth-text.var-0 .text-box {
    background-color: rgb(var(--color-custom-1));
}
.image-fullwidth-text.var-1 .text-box {
    background-color: rgba(var(--color-primary), .9);
}
.image-fullwidth-text.pos-1 .text-box {
    position: relative;
    width: 732px;
    margin: 0;
    padding-bottom: 72px;
}
.image-fullwidth-text.var-2 .text-box {
    margin-top: 100px;
    color: #fff;
    background-color: transparent;
}
.image-fullwidth-text .text-box .title {
    margin: 0 0 20px;
    font-weight: 400;
    font-size: 30px;
    line-height: 1.2;
}
.image-fullwidth-text.var-2 .text-box .title {
    font-size: 44px;
}
.image-fullwidth-text .text-box .text a.button {
    color: #fff;
    border: 2px solid #fff;
}
.image-fullwidth-text .text-box .text a::before {
    background-image: url("../Images/bg-arrow-right-white.svg");
}
.image-fullwidth-text .text-box .text a:hover::before {
    right: 15px;
}
.image-fullwidth-text .text-box .text p:last-of-type {
    margin: 0;
}
.image-fullwidth-text.pos-1 .text-box-wrapper a.button {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 17px 62px 18px 32px;
    border: none;
    background-color: rgba(255,255,255,.31);
}
.image-fullwidth-text.pos-1 .text-box-wrapper a.button::before {
    top: calc(50% - 12px);
    right: 24px;
    width: 15px;
    height: 24px;
}
.image-fullwidth-text.pos-1 .text-box-wrapper a.button:hover::before {
    right: 20px;
}

.image-fullwidth-text.var-0 .text-box-wrapper a.button,
.image-fullwidth-text.var-1 .text-box-wrapper a.button {
    padding: 17px 62px 18px 32px;
    border: none;
    background-color: rgba(255,255,255,.31);
}
.image-fullwidth-text.var-0 .text-box-wrapper a.button::before,
.image-fullwidth-text.var-1 .text-box-wrapper a.button::before {
    top: calc(50% - 12px);
    right: 24px;
    width: 15px;
    height: 24px;
}
.image-fullwidth-text.var-0 .text-box-wrapper a.button:hover::before,
.image-fullwidth-text.var-1 .text-box-wrapper a.button:hover::before {
    right: 20px;
}

.image-fullwidth-text .text-box ul {
    text-align: left;
    margin: 0 110px;
}
.content .image-fullwidth-text.var-0 ul li::before {
    background-color: #fff;
}
.image-fullwidth-text .text-box .additional-image {
    display: flex;
    justify-content: center;
    margin: -92px 0 32px;
}
/***** Bild vollflächig mit grünem Kasten - End *****/

/***** Bild vollflächig mit HTML - Start *****/
.image-fullwidth-html {
    position: relative;
    margin: 0 0 76px;
}
.image-fullwidth-html .image {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.image-fullwidth-html .image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.image-fullwidth-html .html-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 570px;
}
.image-fullwidth-html .html-wrapper .newsletter-teaser {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 518px;
    max-width: 100%;
    padding: 40px 50px;
    color: #fff;
    background-color: rgba(var(--color-primary), .9);
}
.image-fullwidth-html .html-wrapper .newsletter-teaser h3 {
    color: #fff;
}
.image-fullwidth-html .html-wrapper .newsletter-teaser #fe_ttaddress_email_input_repeat {
    display: none;
}
.image-fullwidth-html .html-wrapper .newsletter-teaser .email-field {
    display: block;
    margin: 0 0 10px;
    color: rgb(var(--color-font));
}
.image-fullwidth-html .html-wrapper .newsletter-teaser input[type="submit"] {
    padding: 7px 52px 10px 15px;
    color: #fff;
    font: inherit/inherit var(--font-1);
    font-weight: 600;
    border: none;
    background: rgba(255,255,255,.31) url("../Images/bg-arrow-right-white.svg") no-repeat calc(100% - 15px) 15px;
    background-size: 13px auto;

    transition: all var(--transition-t1);
}
.image-fullwidth-html .html-wrapper .newsletter-teaser input[type="submit"]:hover {
    background-position-x: calc(100% - 11px);
}
.image-fullwidth-html .html-wrapper .newsletter-teaser .privacy-icon {
    position: relative;
    padding: 0 0 0 32px;
}
.image-fullwidth-html .html-wrapper .newsletter-teaser .privacy-icon::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 0;
    width: 21px;
    height: 25px;
    background: url("../Images/bg-icon-privacy.svg") no-repeat;
    background-size: contain;
}
/***** Bild vollflächig mit HTML - End *****/

/***** Teaser mit Bild, versetzt - Start *****/
.tb-offset {
    margin: 0 0 40px;
}
.content .tb-offset a {
    text-decoration: none;
}

.tb-offset .text-content {
    position: relative;
    width: 370px;
    height: 270px;
    padding: 90px 24px 40px;
    color: #fff;
    text-align: center;
    background-color: rgb(var(--color-custom-2));
    z-index: 2;
}
.tb-offset.bg-0 .text-content {
    background-color: rgb(var(--color-custom-2));
}
.tb-offset.bg-1 .text-content {
    background-color: rgb(var(--color-primary));
}
.tb-offset.bg-2 .text-content {
    background-color: rgb(var(--color-custom-1));
}
.tb-offset .title {
    margin: 0 0 2px;
    font-size: 28px;
    font-weight: 400;
}
.tb-offset .image {
    margin: -70px 0 0 60px;
}
.tb-offset .icon {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 80px;
    background-position: center top;
    background-repeat: no-repeat;
}
.tb-offset .icon.i-0 {
    top: 20px;
    background-image: url("../Images/bg-icon-sauna.svg");
    background-size: 60px auto;
}
.tb-offset .icon.i-1 {
    top: 15px;
    background-image: url("../Images/bg-icon-wellness.svg");
    background-size: 38px auto;
}
.tb-offset .icon.i-2 {
    top: 15px;
    background-image: url("../Images/bg-icon-swimming.svg");
    background-size: 69px auto;
}
.tb-offset .icon.i-3 {
    top: 20px;
    background-image: url("../Images/bg-icon-pool.svg");
    background-size: 69px auto;
}
.tb-offset .icon.i-4 {
    top: 15px;
    background-image: url("../Images/bg-icon-photovoltaik.svg");
    background-size: 87px auto;
}
.tb-offset .icon.i-5 {
    top: 15px;
    background-image: url("../Images/bg-icon-radiator.svg");
    background-size: 63px auto;
}
.tb-offset .icon.i-6 {
    top: 15px;
    background-image: url("../Images/bg-icon-tenant-electricity.svg");
    background-size: 62px auto;
}
.tb-offset .icon.i-7 {
    top: 15px;
    background-image: url("../Images/bg-icon-e-car.svg");
    background-size: 77px auto;
}
.tb-offset .icon.i-8 {
    top: 15px;
    background-image: url("../Images/bg-icon-energy-certificate.svg");
    background-size: 68px auto;
}
.tb-offset .icon.i-9 {
    top: 15px;
    background-image: url("../Images/bg-icon-energy-systems.svg");
    background-size: 38px auto;
}
.tb-offset .icon.i-10 {
    top: 15px;
    background-image: url("../Images/bg-icon-eco-energy.svg");
    background-size: 45px auto;
}
.tb-offset .icon.i-11 {
    top: 15px;
    background-image: url("../Images/bg-icon-gas.svg");
    background-size: 70px auto;
}
.tb-offset .icon.i-12 {
    top: 15px;
    background-image: url("../Images/bg-icon-gas-pump.svg");
    background-size: 59px auto;
}
.tb-offset .tb-btn {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 70px;
    height: 70px;
    background-color: rgba(255, 255, 255, .31);
}
.tb-offset .tb-btn::before {
    content: '';
    position: absolute;
    top: calc(50% - 15px);
    left: 30px;
    width: 17px;
    height: 30px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: contain;

    transition: var(--transition-t1);
}
.tb-offset a:hover .tb-btn::before {
    left: 34px;
}

.tb-offset a[href*=".pdf"] .tb-btn::before,
.tb-offset a[href*=".PDF"] .tb-btn::before,
.tb-offset a[href*=".xls"] .tb-btn::before,
.tb-offset a[href*=".xlsx"] .tb-btn::before,
.tb-offset a[href*=".docx"] .tb-btn::before,
.tb-offset a[href*=".doc"] .tb-btn::before {
    content: '';
    position: absolute;
    top: 16px;
    left: 18px;
    width: 26px;
    height: 18px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: 20px auto;
    transform: rotate(90deg);
    border-right: 2px solid #fff;

    transition: var(--transition-t1);
}
.tb-offset a[href*=".pdf"]:hover .tb-btn::before,
.tb-offset a[href*=".PDF"]:hover .tb-btn::before,
.tb-offset a[href*=".xls"]:hover .tb-btn::before,
.tb-offset a[href*=".xlsx"]:hover .tb-btn::before,
.tb-offset a[href*=".doc"]:hover .tb-btn::before,
.tb-offset a[href*=".docx"]:hover .tb-btn::before {
    background-position-x: 2px;
}
/***** Teaser mit Bild, versetzt - End *****/

/***** Aufklapper mit Bild, versetzt - Start *****/
.ab-offset {
    margin: 0 0 40px;
}
.content .ab-offset a {
    text-decoration: none;
}

.ab-offset .text-content {
    position: relative;
    width: 370px;
    min-height: 265px;
    padding: 40px 24px 90px;
    color: #fff;
    text-align: center;
    background-color: rgb(var(--color-custom-2));
    z-index: 2;
}
.ab-offset.bg-0 .text-content {
    background-color: rgb(var(--color-custom-2));
}
.ab-offset.bg-1 .text-content {
    background-color: rgb(var(--color-primary));
}
.ab-offset.bg-2 .text-content {
    background-color: rgb(var(--color-custom-1));
}
.ab-offset .title {
    margin: 0 -12px 2px;
    font-size: 28px;
    font-weight: 400;
}
.ab-offset .text-content .text-detail {
    display: none;
}
.ab-offset .image {
    margin: -70px 0 0 60px;
}
.ab-offset .ab-btn {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 70px;
    height: 70px;
    background-color: rgba(255, 255, 255, .31);
    cursor: pointer;
}
.ab-offset .ab-btn::before {
    content: '';
    position: absolute;
    top: calc(50% - 15px);
    left: 26px;
    width: 17px;
    height: 30px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: contain;
    transform: rotate(90deg);

    transition: var(--transition-t2);
}
.ab-offset .active .ab-btn::before {
    transform: rotate(270deg);
}

.ab-offset a[href*=".pdf"] .ab-btn::before,
.ab-offset a[href*=".PDF"] .ab-btn::before,
.ab-offset a[href*=".xls"] .ab-btn::before,
.ab-offset a[href*=".xlsx"] .ab-btn::before,
.ab-offset a[href*=".docx"] .ab-btn::before,
.ab-offset a[href*=".doc"] .ab-btn::before {
    content: '';
    position: absolute;
    top: 16px;
    left: 18px;
    width: 26px;
    height: 18px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: 20px auto;
    transform: rotate(90deg);
    border-right: 2px solid #fff;

    transition: var(--transition-t1);
}
.ab-offset a[href*=".pdf"]:hover .ab-btn::before,
.ab-offset a[href*=".PDF"]:hover .ab-btn::before,
.ab-offset a[href*=".xls"]:hover .ab-btn::before,
.ab-offset a[href*=".xlsx"]:hover .ab-btn::before,
.ab-offset a[href*=".doc"]:hover .ab-btn::before,
.ab-offset a[href*=".docx"]:hover .ab-btn::before {
    background-position-x: 2px;
}
/***** Aufklapper mit Bild, versetzt - End *****/

/***** Info-Teaser, in zwei Teilen und vollflächig - Start *****/
.content .it2-link {
    text-decoration: none;
}
.it2 {
    display: flex;
    min-height: 220px;
}
.it2 .image {
    width: 50%;
    background: url("../Images/bg-it2-neandertal.png") no-repeat calc(100% - 60px) bottom;
    background-color: rgb(var(--color-custom-5));
    background-size: auto 220px;
}
.it2 .text-content {
    position: relative;
    width: 50%;
    padding: 20px 0 0 132px;
    color: #fff;
    background-color: rgb(var(--color-custom-2));
}
.it2 .text-content .icon {
    position: absolute;
    top: 36px;
    left: 26px;
    width: 80px;
    height: 80px;
    background: url("../Images/bg-icon-power-plug.svg") no-repeat;
    background-size: contain;
}
.it2 .text-content .title {
    font-size: 28px;
    font-weight: 400;
}
.it2 .text-content .text {
    width: 450px;
    max-width: 100%;
    margin: 0 0 18px;
}
.it2 .text-content .it2-btn {
    position: relative;
    display: inline-block;
    padding: 10px 50px 10px 20px;
    font-weight: 400;
    border: 2px solid #fff;
    border-radius: 50px;
    text-decoration: none;
    font-size: 24px;
}
.it2 .text-content .it2-btn::before {
    content: '';
    position: absolute;
    top: 16px;
    right: 19px;
    width: 20px;
    height: 17px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: contain;

    transition: all var(--transition-t1);
}
.it2:hover .text-content .it2-btn::before {
    right: 15px;
}
/***** Info-Teaser, in zwei Teilen und vollflächig - End *****/

/***** Trenner mit Text ohne Bild - Start *****/
.tr-text {
    margin: 0 0 76px;
    padding: 45px 0 30px;
    text-align: center;
    background-color: rgba(var(--color-secondary), .18);
}
.tr-text .title {
    font-size: 32px;
    color: rgb(var(--color-primary));
    font-weight: 400;
    margin: 0 0 20px;
}
.tr-text a.button {
    margin-top: 9px;
}
/***** Trenner mit Text ohne Bild - End *****/

/***** Aktuelles-Teaser - Start *****/
.news-teaser .news-teaser-content {
    position: relative;
    width: 982px;
    max-width: 100%;
    margin: 0 auto 76px;
    padding: 40px 100px 20px 48px;
    color: #fff;
    text-align: center;
    background-color: rgb(var(--color-secondary));
}
.news-teaser .news-teaser-content::before {
    content: '';
    position: absolute;
    top: 26px;
    right: 18px;
    width: 89px;
    height: 74px;
    background: url("../Images/bg-icon-megaphone.svg") no-repeat;
    background-size: contain;
}
.news-teaser .headline {
    margin: 0 0 32px;
    font-size: 28px;
    font-weight: 600;
    padding-right: 12px;
}
.news-teaser a.button {
    background-color: transparent;
}
.news-teaser .detail-text {
    display: none;
}
.news-teaser .folding-actions button {
    position: relative;
    width: 224px;
    height: 45px;
    padding: 6px 52px 7px 22px;
    font: inherit/inherit var(--font-1);
    color: #fff;
    border: none;
    background-color: transparent;
    cursor: pointer;
}
.news-teaser .folding-actions button::before {
    content: '';
    position: absolute;
    top: calc(50% - 8px);
    right: 19px;
    width: 11px;
    height: 19px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: contain;
    transform: rotate(90deg);

    transition: all var(--transition-t1);
}
.news-teaser .folding-actions button:hover::before {
    top: calc(50% - 5px);
}
.news-teaser .active .folding-actions button:hover::before {
    top: calc(50% - 11px);
}
.news-teaser .active .folding-actions button::before {
    transform: rotate(270deg);
}
.news-teaser .folding-actions button span {
    display: block;
    position: absolute;
    top: 6px;
    left: 22px;
    right: 52px;
}
.news-teaser .folding-actions button span.hide {
    display: none;
}
/***** Aktuelles-Teaser - End *****/

/*** Icon Text ***/
.icontext.orange {
    position: relative;
    min-height: 197px;
    padding: 125px 24px 0;
}
.icontext.orange .text {
    text-align: center;
    padding: 0 20px;
    font: normal normal 300 26px/36px var(--font-1);
    color: rgba(var(--color-custom-1));
}
.icontext.orange .icon{
position: absolute;
top: 30px;
left: 0;
right: 0;
height: 90px;
background-position: center top;
background-repeat: no-repeat;
}
.icontext.orange .icon.i-0 {
    background-image: url("../Images/bg-icon-pig-orange.svg");
    background-size: 87px auto;
}
.icontext.orange .icon.i-1 {
    background-image: url("../Images/bg-icon-photovoltaik-orange.svg");
    background-size: 123px auto;
}
.icontext.orange .icon.i-2 {
    background-image: url("../Images/bg-icon-tool.svg");
    background-size: 85px auto;
}

/***** Bild mit Textbox - Start *****/
.image-text {
    margin: 0 0 146px;
}
.image-text .inner {
    position: relative;
}
.image-text .text-box-wrapper {
    position: absolute;
    bottom: -70px;
    left: 50px;
    width: 586px;
    padding: 15px 20px 80px 30px;
    color: #fff;
    background: rgba(var(--color-custom-1), .9);
    z-index: 1;
}
.image-text.var-1 .text-box-wrapper {
    background: rgba(var(--color-custom-2), .9);
}
.image-text .tb-btn {
    position: absolute;
    bottom: 0;
    right: 0;
    min-width: 70px;
    height: 70px;
    padding: 18px 0 0;
    background-color: rgba(255, 255, 255, .31);
}
.image-text .tb-btn::after {
    content: '';
    position: absolute;
    top: calc(50% - 15px);
    right: 24px;
    width: 17px;
    height: 30px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: contain;
    transition: var(--transition-t1);
}
.image-text a:hover .tb-btn::after {
    right: 20px;
}
.image-text .tb-btn .link-text {
    margin: 0 70px 0 30px;
}
.image-text .text{
    font: normal normal 300 24px/36px var(--font-1);
}
.image-text .title{
    font: normal normal normal 40px/61px var(--font-1);
}
.image-text p {
    margin: 0;
}
.image-text a {
    text-decoration: none;
}
/***** Bild mit Textbox - End *****/

/***** Aufklapper Gute Neuigkeiten - Start *****/
.agn-main {
    margin: 0 0 40px;
}
.content .agn-main a {
    text-decoration: underline;
}

.agn-main .text-content {
    position: relative;
    min-height: 265px;
    background-color: rgb(var(--color-custom-2));
    z-index: 2;
    width: 83.33%;
    padding: 40px 56px 45px;
    color: rgb(var(--color-font));
    text-align: left;
    background-color: rgba(234, 244, 252, .95);
    margin: 0 0 0 16.66%;
}
.agn-main.bg-0 .text-content {
    background-color: rgb(var(--color-custom-2));
}
.agn-main.bg-1 .text-content {
    background-color: rgb(var(--color-primary));
}
.agn-main.bg-2 .text-content {
    background-color: rgb(var(--color-custom-1));
}
.agn-main .title {
    margin: 0;
    font: normal normal normal 35px/1.2 var(--font-1);
    color: rgb(var(--color-primary));
    text-align: left;
    padding: 0 0 10px;
}
.agn-main .text-content .dropdown-content {
    display: none;
}
.agn-main .text {
    padding: 0 0 20px;
}
.agn-main .image {
    margin: 40px 0;
}
.agn-main .agn-btn {
    position: relative;
    color: rgb(var(--color-primary));
    width: fit-content;
    cursor: pointer;
}
.agn-main .agn-btn::before {
    content: '';
    position: absolute;
    top: 10px;
    width: 22px;
    height: 14px;
    background: url("../Images/bg-arrow-down-blue.svg") no-repeat;
    background-size: cover;
    transition: var(--transition-t2);
    right: -37px;
    z-index: 20;
}
.agn-main .agn-btn::after {
    position: absolute;
    content: "";
    background-color: rgba(var(--color-primary),.21);
    width: 38px;
    height: 42px;
    right: -46px;
    bottom: -7px;
    z-index: 10;
}
.agn-main .active .agn-btn::before {
    transform: rotate(180deg);
}

.agn-main a[href*=".pdf"] .agn-btn::before,
.agn-main a[href*=".PDF"] .agn-btn::before,
.agn-main a[href*=".xls"] .agn-btn::before,
.agn-main a[href*=".xlsx"] .agn-btn::before,
.agn-main a[href*=".docx"] .agn-btn::before,
.agn-main a[href*=".doc"] .agn-btn::before {
    content: '';
    position: absolute;
    top: 16px;
    left: 18px;
    width: 26px;
    height: 18px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: 20px auto;
    transform: rotate(90deg);
    border-right: 2px solid #fff;

    transition: var(--transition-t1);
}
.agn-main a[href*=".pdf"]:hover .agn-btn::before,
.agn-main a[href*=".PDF"]:hover .agn-btn::before,
.agn-main a[href*=".xls"]:hover .agn-btn::before,
.agn-main a[href*=".xlsx"]:hover .agn-btn::before,
.agn-main a[href*=".doc"]:hover .agn-btn::before,
.agn-main a[href*=".docx"]:hover .agn-btn::before {
    background-position-x: 2px;
}
.agn-offset-picture {
    margin: 80px 0 -130px;
    max-width: 100%;
}
.agn-main .date {
    color: rgb(var(--color-primary));
    text-align: left;
    font: normal normal normal 25px/1.68 var(--font-1);
}
.agn-main .subtitle {
    font: normal normal 600 26px/1.385 var(--font-1);
}
.agn-main .agn-content p {
    font: normal normal 300 26px/1.385 var(--font-1);
}
/***** Aufklapper Gute Neuigkeiten - End *****/

/***** Teaser Gute Neuigkeiten - Start *****/
.tgn-main .tgn-picture {
    position: relative;
    margin: 0 0 16px;
}
.tgn-main .tgn-button {
    position: absolute;
    z-index: 2;
    bottom: 22px;
    background: rgba(255,255,255,.86);
    left: 22px;
    padding: 14px 27px 12px 57px;
    right: 22px;
    font: normal normal normal 30px/1.2 var(--font-1);
    color: #1F7BBB;
    max-width: 325px;
}
.tgn-picture a {
    text-decoration: none;
}
.tgn-main .tgn-main .button {
    position: relative;
}
.tgn-main .link-button::before {
    content: "";
    position: absolute;
    width: 17px;
    height: 28px;
    background: url("../Images/bg-arrow-right-blue-headonly.svg");
    left: 28px;
    top: 18px;
}
/***** Teaser Gute Neuigkeiten - End *****/

/***** Energiebausteine - Start *****/
.energy-blocks {
    margin: 0 0 76px;
}
.energy-blocks .image {
}
.energy-blocks .text-content {
    padding: 0 0 52px;
    background-color: rgb(var(--color-custom-4), .5);
}
.energy-blocks .text-content .inner {
    margin: -470px 0 0;
}
.energy-blocks .title {
    margin: 0 0 32px;
    font: 600 90px/1 var(--font-1);
    color: rgb(var(--color-custom-1));
}
.energy-blocks .blocks {
    margin: 0 0 32px;
    padding: 22px 0 20px;
    background-color: rgba(var(--color-custom-1), .9);
}
.energy-blocks .blocks .blocks-text-header {
    margin: 0 0 32px;
    font: 300 28px/1.28571 var(--font-1);
    text-align: center;
    color: #fff;
}
.energy-blocks .blocks .blocks-text-footer {
    font: 400 20px/1.55 var(--font-1);
    text-align: center;
    color: #fff;
}
.energy-blocks .blocks .blocks-inner {
    display: flex;
    justify-content: space-evenly;
    margin: 0 50px;
}
.energy-blocks .subtext {
    margin: 0 120px;
    font-size: 28px;
    line-height: 1.35714;
}
.energy-blocks .subtext .button {
    padding-right: 0;
    color: inherit;
    font-weight: 300;
    text-decoration: underline;
    background-color: transparent;
}
.energy-blocks .subtext .button:hover {
    text-decoration: none;
}
.energy-blocks .subtext a.button::before {
    top: 11px;
    left: 0;
    right: auto;
    width: 14px;
    height: 24px;
    background: url("../Images/bg-arrow-right-orange.svg") no-repeat;
}
.energy-blocks .subtext a.button:hover::before {
    right: auto;
    left: 4px;
}
.energy-blocks .subtext .button-light {
    margin-bottom: 12px;
    font-size: 24px;
    color: #fff;
    background-color: rgb(var(--color-custom-1));
}
.energy-blocks .subtext .button-light::before {
    top: 10px;
    width: 14px;
    height: 24px;
    background: url("../Images/bg-arrow-right-white.svg") no-repeat;
    background-size: contain;
    transform: none;
}

.energy-blocks-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 0 auto;
    width: 25%;
    margin: 0 0 32px;
}
.energy-blocks-child .icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    margin: 0 0 8px;
    border-radius: 50%;
    background-color: rgba(255,255,255,.31);
}
.energy-blocks-child .child-content {
    text-align: center;
    color: #fff;
}
.energy-blocks-child .child-content .text-1 {
    margin: 0 0 -4px;
    font: 400 36px/1.57143 var(--font-1);
}
.energy-blocks-child .layer {
    display: inline-block;
    position: relative;
}
.energy-blocks-child .layer .layer-icon {
    position: absolute;
    bottom: 4px;
    right: -22px;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: #fff url("../Images/bg-icon-info-orange.svg") no-repeat center;
    background-size: 6px auto;
    cursor: pointer;
}
.energy-blocks-child .layer .layer-content {
    position: absolute;
    top: -28px;
    left: -2px;
    width: 298px;
    padding: 20px 24px;
    font-size: 18px;
    color: rgb(var(--color-font));
    border-radius: 10px 0 0;
    background-color: #fff;
    opacity: 0;
    pointer-events: none;

    transition: all var(--transition-t1);
}
.energy-blocks-child .layer:hover .layer-content {
    opacity: 1;
    pointer-events: auto;
}
/***** Energiebausteine - End *****/