html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {
    display: block
}

audio, canvas, progress, video {
    display: inline-block
}

audio:not([controls]) {
    display: none;
    height: 0
}

progress {
    vertical-align: baseline
}

template, [hidden] {
    display: none
}

a {
    background-color: transparent;
    text-decoration-skip-ink: auto
}

a:active, a:hover {
    outline-width: 0
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline dotted;
}

b, strong {
    font-weight: inherit
}

b, strong {
    font-weight: bolder
}

dfn {
    font-style: italic
}

mark {
    background-color: var(--color-yellow-pale);
    color: var(--color-black)
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}

img {
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

button, input, optgroup, select, textarea {
    font: inherit;
    margin: 0
}

optgroup {
    font-weight: bold
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

button, html [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: auto;
}

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: 0
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

textarea {
    overflow: auto
}

[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0
}

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
    height: auto
}

[type="search"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: auto;
    outline-offset: -2px
}

[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-input-placeholder {
    color: inherit;
    opacity: .54
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

html {
    font-size: 16px;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto
}

body {
    line-height: 1.3125;
    font-family: daxline, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto
}

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    color: var(--color-blue-enertrag)
}

h1 {
    font-size: 2.5em
}

h2 {
    font-size: 2em;
    line-height: 1.1875
}

h3 {
    font-size: 1.375em;
    line-height: 1.1818181818
}

address {
    font-family: Daxline, sans-serif;
    font-style: normal
}

figure {
    margin: 0;
    padding: 0
}

@media (max-width: 639px) {
    .news--detail .p--text + figure ~ figure {
        margin: 0 1em 1em 0;
    }
}

.u-fixed-font {
    font-family: "Courier New", sans-serif
}

.u-bold {
    font-weight: bold
}

.u-uppercase {
    text-transform: uppercase
}

.daxline {
    font-family: Daxline, sans-serif
}

.button, .header__cookie-info button, .main__product a, .main__bonus a, .news--more a, .form__field--reset input, .form__field--submit input {
    padding: 1em 2em;
    line-height: 1;
    background-color: var(--color-blue-enertrag);
    border: none;
    color: var(--color-white);
    display: table;
    text-decoration: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.container {
    max-width: 1232px;
    padding: 0 1em;
    margin: auto;
    box-sizing: border-box
}

.container:after, .container:before {
    content: "";
    display: table;
    clear: both
}

body {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: max-content;
    grid-template-rows:max-content;
    -ms-grid-columns: 100%;
    grid-template-columns:100%
}

.header {
    -ms-grid-row: 1;
    grid-row: 1
}

.main {
    -ms-grid-row: 2;
    grid-row: 2
}

.main + .aside--portal {
    -ms-grid-row: 3;
    grid-row: 3
}

.footer {
    -ms-grid-row: 4;
    grid-row: 4
}

.header, .main, .main + .aside--portal, .footer {
    -ms-grid-column: 1;
    grid-column: 1
}

img {
    max-width: 100%;
    height: auto
}

body {
    margin: 0;
    padding: 0
}

.header {
    position: relative;
    z-index: 100
}

.header__cookie-info {
    color: var(--color-white);
    background-color: var(--color-black-translucent);
    margin: 0;
    height: auto;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: .6em 0;
    line-height: 3;
    vertical-align: middle;
    text-align: center
}

.header__cookie-info span {
    display: inline-block;
    line-height: 1.3;
    vertical-align: middle;
    margin-bottom: 10px;
}

.header__cookie-info a {
    color: var(--color-white)
}

.header__cookie-info button {
    padding: 1em 3em;
    display: inline-block;
    margin: auto
}

#cookie-only-inevitable {
    margin-top: 5px;
}

@media (min-width: 480px) {
    #cookie-only-inevitable {
        margin-left: 20px;
        margin-top: 0;
    }
}

@media (min-width: 960px) {
    .header__cookie-info span {
        max-width: calc(100% - 480px);
        margin-bottom: 0;
    }

    #cookie-accept-all {
        margin-left: 20px;
    }

    .header__cookie-info button {
        float: right
    }

    #cookie-only-inevitable {
        margin-left: 0;
    }

    #cookie-accept-all {
        margin-left: 20px;
    }

    .header__cookie-info {
        text-align: left
    }
}


.header__service {
    color: var(--color-white-permanent);
    background-color: var(--color-blue-enertrag-permanent);
    display: none
}

@media (min-width: 1024px) {
    .header__service {
        display: block
    }
}

.header__service ul, .header__service li, .header__service a {
    margin: 0;
    padding: 0;
    color: var(--color-white-permanent) !important;
    text-decoration: none;
    vertical-align: middle;
    list-style: none
}

.header__service li {
    float: left;
    padding: 0 1em;
    line-height: 2.2
}

.header__service li:last-child {
    padding-right: 0
}

.header__service ul {
    float: right;
    line-height: 1.4
}

.header__service ul li a, .header__service ul li form {
    display: inline-table
}

.header__service ul li:before {
    display: inline-table;
    margin-right: .5em;
    font-family: "e17-symbols" !important;
    vertical-align: middle
}

.header__service ul li:nth-child(2):before {
    content: ""
}

.header__service ul li:nth-child(3):before {
    content: ""
}

.header__service form {
    position: relative;
    z-index: 200
}

.header__service form input {
    background-color: transparent;
}

@media (max-width: 1023px) {
    .header__service form {
        display: flex;
        justify-content: space-between
    }

    .header__service form button {
        text-align: right;
        display: none
    }

    .header__service form button:after {
        content: "";
        font-size: 64px;
        color: silver;
        font-family: "e17-symbols" !important;
        speak: none;
        font-style: normal;
        font-weight: 400;
        font-variant: normal;
        text-transform: none;
        line-height: 1
    }

    .header__service form input {
        display: none;
        flex: 1 0 auto;
        width: calc(80% - 36px);
        border: 2px solid var(--color-gray-bright);
        font-size: 24px;
        padding: 0 16px;
        background-color: var(--color-white);
        z-index: 200;
        outline: none
    }

    .header__service form label {
        display: none
    }
}

@media (min-width: 1024px) {
    .header__service form label {
        display: inline;
        cursor: pointer
    }

    .header__service form input {
        position: absolute;
        top: 100%;
        right: 85px;
        line-height: 35px;
        height: 35px;
        min-width: 600px;
        font-size: 2em;
        display: none;
        border-style: solid;
        border-color: transparent transparent var(--color-gray-bright) transparent;
        border-width: 3px 0;
        color: var(--color-blue-enertrag);
        margin: 22px;
        padding: 0;
        outline: none
    }

    .header__service form button {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        height: 85px;
        width: 85px;
        background-color: var(--color-white);
        box-sizing: border-box;
        border: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        cursor: pointer
    }
}

.header__main {
    line-height: 85px;
    height: auto;
    position: relative;
    z-index: 100;
    border-top: 10px solid var(--color-blue-enertrag);
    border-bottom: 1px solid var(--color-gray-bright)
}

@media (min-width: 1024px) {
    .header__main {
        border-top: none
    }
}

.header__logo {
    display: table;
    float: left
}

.header__logo img {
    height: 60px;
    width: auto;
    margin: 12.5px 0;
    display: block
}

.header .keyvisual {
    position: relative
}

.header .keyvisual__bottom-elements {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

.header .keyvisual__bottom-elements span {
    display: block;
    width: 100%;
    border-bottom: 10px solid var(--color-blue-enertrag)
}

.header .keyvisual img {
    display: block
}

.header .mobile-main-menu {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
    line-height: 41px;
    cursor: pointer;
    text-align: center;
    margin: 22px;
    color: var(--color-white)
}

.header .mobile-main-menu a {
    display: block;
    text-decoration: none;
    color: var(--color-gray-medium)
}

.header .mobile-main-menu a:after {
    content: "";
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    font-size: 28px;
    width: 46px;
    height: 41px;
    color: var(--color-white);
    background-color: var(--color-blue-enertrag);
    display: inline-block;
    margin-left: .3em
}

@media (min-width: 1024px) {
    .header .mobile-main-menu {
        display: none
    }

}

.header .mainnav {
    text-transform: uppercase
}

.header .mainnav.level_1 {
    display: none;
    margin: 0;
    padding: 0
}

@media (min-width: 1024px) {
    .header .mainnav.level_1 {
        display: block;
        float: right
    }

    .header .mainnav.level_1 ul, .header .mainnav.level_1 li, .header .mainnav.level_1 a {
        margin: 0;
        padding: 0;
        color: var(--color-black);
        text-decoration: none;
        vertical-align: middle;
        list-style: none
    }

    .header .mainnav.level_1 > li {
        float: left;
        position: relative;
        cursor: pointer
    }

    .header .mainnav.level_1 > li.active > span {
        padding: 0 1.25em
    }

    .header .mainnav.level_1 > li.active:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 1.25em;
        width: calc(100% - 2.5em);
        height: 10px;
        background-color: var(--color-blue-enertrag);
        z-index: -1
    }

    .header .mainnav.level_1 > li > a {
        padding: 0 1.25em;
        display: block
    }

    .header .mainnav.level_1 > li:last-child > a {
        margin-right: -1.25em
    }

}

@media (min-width: 1024px) and (max-width: 1325px) {
    .header .mainnav.level_1 > li:last-child .subnav {
        right: 0;
        left: auto;
        -webkit-transform: none;
        transform: none
    }

    .header .mainnav.level_1 > li:last-child .subnav:before {
        left: auto;
        right: 0
    }

}

@media (min-width: 1024px) {
    .header .mainnav.level_1 > li:hover {
        z-index: 2
    }

    .header .mainnav.level_1 > li:hover .subnav {
        display: block
    }

    .header .mainnav.level_1 .subnav {
        display: none;
        background-color: var(--color-blue-bright);
        color: var(--color-black);
        position: absolute;
        top: calc(100% - 10px);
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        line-height: 2.2;
        text-align: center;
        padding: .5em 0;
        white-space: nowrap
    }

    .header .mainnav.level_1 .subnav:before {
        content: "";
        border-bottom: 17px solid var(--color-blue-bright);
        border-right: 17px solid transparent;
        border-left: 17px solid transparent;
        position: absolute;
        top: 0;
        margin-top: -15px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .header .mainnav.level_1 .subnav li:first-child {
        display: none
    }

    .header .mainnav.level_1 .subnav a {
        display: block;
        padding: 0 1em
    }

    .header .mainnav.level_1 .subnav a:hover {
        background-color: var(--color-blue-enertrag);
        color: var(--color-white)
    }

    .header .mainnav.level_1 .subnav li.active {
        padding: 0 1em
    }

}

.main, main {
    padding: 3em 0
}

.main:after, .main:before, main:after, main:before {
    content: "";
    display: table;
    clear: both
}

.main article, .main aside, main article, main aside {
    float: left;
    width: 100%;
    box-sizing: border-box
}

.main aside, main aside {
    margin-top: 2em;
    padding-top: 0
}

@media (min-width: 1024px) {
    .main aside, main aside {
        margin-top: 5em;
        width: 386.6666666667px;
        margin-left: 40px
    }

}

.main aside ul, .main aside li, main aside ul, main aside li {
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 2
}

.main aside a, main aside a {
    color: inherit;
    text-decoration: none
}

.main aside a:before, main aside a:before {
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: "";
    margin-right: .3em;
    text-decoration: none
}

.main aside a:hover, main aside a:hover {
    text-decoration: underline
}

.main aside a[href^="tel:"]:before, main aside a[href^="tel:"]:before {
    margin-right: 0;
    content: ""
}

.main aside h2, main aside h2 {
    font-size: 1.56em;
    margin: 0 0 .5em 0
}

.main h1:first-child, main h1:first-child {
    margin: .3em 0 .3em 0
}

@media (min-width: 768px) {
    .main__intro--portal p {
        width: 66%
    }

}

.main__tiles {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 3em
}

.main__tiles--portal {
    justify-content: flex-start !important
}

.main__tiles .tile {
    width: 100%;
    text-align: center;
    padding: 1em;
    box-sizing: border-box;
    margin-bottom: 1em;
    background-color: var(--color-blue-bright);
    transition: background-color 300ms ease, color 300ms ease;
    font-size: 1.375em;
    min-height: 214px
}

.main__tiles .tile p {
    margin: .5em;
    color: var(--color-black);
    transition: color 300ms ease
}

.main__tiles .tile p:before {
    transition: color 300ms ease;
    color: var(--color-blue-enertrag)
}

.main__tiles .tile:hover {
    background-color: var(--color-blue-enertrag)
}

.main__tiles .tile:hover p, .main__tiles .tile:hover p:before {
    color: var(--color-white)
}

.main__tiles .tile [class^="symbol-"]:before {
    margin-bottom: 1rem
}

@media (min-width: 640px) {
    .main__tiles .tile {
        margin-right: 1em;
        width: calc(100% / 2 - .5em)
    }

    .main__tiles .tile:nth-child(2n) {
        margin-right: 0
    }

}

@media (min-width: 1024px) {
    .main__tiles .tile {
        width: calc(100% / 3 - .75em)
    }

    .main__tiles .tile:nth-child(3n) {
        margin-right: 0 !important
    }

    .main__tiles .tile:nth-child(2n) {
        margin-right: 1em
    }

}

.main__tiles section {
    width: 100%;
    padding-bottom: 2em;
    margin-bottom: 2em;
    box-sizing: border-box;
    border-bottom: 1px solid var(--color-gray-bright)
}

@media (min-width: 480px) and (max-width: 768px) {
    .main__tiles section {
        width: 50%
    }

    .main__tiles section:nth-child(2n-1) {
        padding-right: .75em
    }

    .main__tiles section:nth-child(2n) {
        padding-left: .75em
    }

    .main__tiles section:nth-child(n+5) {
        border-bottom: none
    }

}

@media (min-width: 768px) {
    .main__tiles section {
        width: 33.3333%
    }

    .main__tiles section:nth-child(3n-2) {
        padding-right: 1em
    }

    .main__tiles section:nth-child(3n-1) {
        padding-left: .5em;
        padding-right: .5em
    }

    .main__tiles section:nth-child(3n) {
        padding-left: 1em
    }

    .main__tiles section:nth-child(n+4) {
        border-bottom: none
    }

}

.main__tiles section h2, .main__tiles section p, .main__tiles section a {
    margin: .8em 0 0 0;
    display: block
}

.main__tiles section h2 {
    font-size: 1.5em
}

.main__tiles section a {
    text-decoration: none;
    color: var(--color-blue-enertrag)
}

.main__tiles section a:before {
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: "";
    margin-right: .3em
}

.main__tiles section img {
    width: 100%;
    height: auto;
    display: block
}

.main__enterprise {
    min-width: 100%;
    width: 100%;
    max-width: 100%
}

.main__enterprise .main__intro {
    padding: 0
}

.main__enterprise .main__intro figure {
    margin: 0 auto
}

@media (min-width: 640px) {
    .main__enterprise .main__intro figure {
        float: right;
        margin-left: 36px
    }

}

@media (min-width: 1024px) {
    .main__enterprise .main__intro figure {
        float: right;
        margin-top: -3em;
        margin-left: 2em
    }

}

.main__enterprise--gray {
    background-color: var(--color-gray-bright)
}

.main__enterprise--white {
    background-color: var(--color-white)
}

.main__enterprise--vision > h1 {
    margin-bottom: 0;
    grid-area: head
}

.main__enterprise--vision > p:nth-child(2) {
    margin-top: 2em
}

@media (min-width: 1024px) {
    .main__enterprise--vision > p:nth-child(2) {
        margin-top: -0.52em
    }

}

@media (min-width: 1024px) {
    .main__enterprise--vision div:nth-child(3) {
        display: -ms-inline-grid;
        display: inline-grid;
        -ms-grid-rows: auto 1fr;
        grid-template-rows:auto 1fr;
        -ms-grid-columns: 33% 36px 1fr;
        grid-template-columns:33% 36px 1fr
    }

}

.main__enterprise--vision div:nth-child(3) h3 {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 1;
    grid-column: 1;
    margin: 0 0 1em 0
}

@media (min-width: 1024px) {
    .main__enterprise--vision div:nth-child(3) h3 {
        -ms-grid-row: 1;
        grid-row: 1;
        -ms-grid-column: 3;
        grid-column: 3
    }

}

.main__enterprise--vision div:nth-child(3) p {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 3;
    grid-column: 3;
    margin: 0
}

.main__enterprise--vision div:nth-child(3) p br:first-child {
    display: none
}

@media (min-width: 1024px) {
    .main__enterprise--vision div:nth-child(3) p {
        -ms-grid-row: 2;
        grid-row: 2;
        -ms-grid-column: 3;
        grid-column: 3
    }

}

.main__enterprise--vision div:nth-child(3) figure {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 1;
    grid-column: 1;
    margin: 0;
    text-align: center
}

@media (min-width: 1024px) {
    .main__enterprise--vision div:nth-child(3) figure {
        -ms-grid-row: 2;
        grid-row: 2;
        -ms-grid-column: 1;
        grid-column: 1
    }

}

@media (min-width: 1024px) {
    .main__enterprise--vision div:nth-child(4) {
        display: -ms-inline-grid;
        display: inline-grid;
        -ms-grid-rows: 1fr;
        grid-template-rows:1fr;
        -ms-grid-columns: 1fr 36px 33%;
        grid-template-columns:1fr 36px 33%
    }

}

.main__enterprise--vision div:nth-child(4) p {
    -ms-grid-row: 1;
    grid-row: 1;
    -ms-grid-column: 1;
    grid-column: 1
}

.main__enterprise--vision div:nth-child(4) figure {
    -ms-grid-row: 1;
    grid-row: 1;
    -ms-grid-column: 3;
    grid-column: 3;
    margin-top: 2em;
    text-align: center
}

.main__enterprise--board {
    padding: 0
}

@media (min-width: 1024px) {
    .main__enterprise--board {
        display: -ms-grid;
        display: grid;
        -ms-grid-rows: auto 1fr;
        grid-template-rows:auto 1fr;
        -ms-grid-columns: 1fr 36px 1fr 36px 1fr;
        grid-template-columns:1fr 36px 1fr 36px 1fr
    }

}

.main__enterprise--board h2 {
    width: 100%;
    grid-row: 1;
    grid-column: span 5;
    -ms-grid-row: 1;
    -ms-grid-column-span: 5
}

.main__enterprise--board div {
    margin-top: 1.52em;
    width: 100%;
    overflow: hidden;
    background-color: var(--color-white)
}

.main__enterprise--board div:nth-child(2) {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 1;
    grid-column: 1
}

.main__enterprise--board div:nth-child(3) {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 3;
    grid-column: 3
}

.main__enterprise--board div:nth-child(4) {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 5;
    grid-column: 5
}

@media (min-width: 1024px) {
    .main__enterprise--board div {
        margin-top: 0
    }

}

.main__enterprise--board div h3, .main__enterprise--board div h4, .main__enterprise--board div p {
    margin: 0 1rem
}

.main__enterprise--board div h3 {
    margin-top: 1rem
}

.main__enterprise--board div h4 {
    margin-top: .2rem;
    color: var(--color-black)
}

.main__enterprise--board div p {
    margin: 0 1rem 1rem 1rem
}

.main__enterprise--board div figure {
    max-width: none
}
  @media (min-width: 1024px) {
.main__enterprise--board div figure {
      margin:0 0 1em;
      height:225px;
}

}

.main__enterprise--board div figure img {
    width:100%;
    height: 100%;
    object-fit: cover;
}

.main__enterprise--credo {
    float: none;
    min-width: 100%
}

.main__enterprise--credo section {
    width: 100%
}

@media (min-width: 1024px) {
    .main__enterprise--credo section {
        width: 63%
    }

}

.main__enterprise--credo section h3 a {
    text-align: left;
    color: var(--color-blue-enertrag)
}

.main__enterprise--credo figure {
    display: none
}

@media (min-width: 1024px) {
    .main__enterprise--credo figure {
        display: inline-block;
        float: right;
        width: 33%
    }

}

.main__enterprise--story {
    display: none
}

@media (min-width: 736px) {
    .main__enterprise--story {
        display: block
    }

}

.main__enterprise--story figure {
    min-width: 95%;
    margin-top: -2em;
    text-align: center
}

[class^="main__enterprise--"] {
    padding: 20px 0 40px
}

[class^="main__enterprise--"]:last-child {
    margin: 0 auto
}

[class^="main__enterprise--"] h2 {
    font-size: 2.5em !important
}

[class^="main__enterprise--"] figure {
    max-width: 378px
}

@media (min-width: 1024px) {
    .main__product, .main__bonus {
        float: left;
        display: inline-table;
        width: calc(66.66666% - 40px) !important
    }

}

.main__product + aside, .main__bonus + aside {
    background-color: var(--color-blue-bright);
    color: var(--color-blue-enertrag);
    padding: 1.2em
}

@media (max-width: 375px) {
    .main__product + aside, .main__bonus + aside {
        margin: 0 -1em;
        width: calc(100% + 2em)
    }

}

@media (min-width: 1024px) {
    .main__product + aside, .main__bonus + aside {
        float: left;
        width: 33.33333%
    }

}

.main__product + aside h3, .main__bonus + aside h3 {
    margin-top: 0
}

.main__product figure, .main__bonus figure {
    margin: 1em 0
}

.main__product figure img, .main__bonus figure img {
    width: 100%;
    display: block
}

@media (min-width: 768px) {
    .main__product figure, .main__bonus figure {
        float: right;
        margin: 0 0 1em 1em
    }

}

.main__product ul, .main__bonus ul {
    list-style: none;
    text-indent: -1.5em
}

.main__product li, .main__bonus li {
    margin-bottom: .5em
}

.main__product li:before, .main__bonus li:before {
    font-family: e17-symbols;
    font-size: inherit;
    color: var(--color-blue-enertrag);
    content: " "
}

.main__product a {
    display: block;
    text-align: center;
    width: 230px
}

.main__bonus a {
    display: block;
    text-align: center;
    width: 200px
}

.main__product p:last-child a:before, .main__bonus p:last-child a:before {
    font-family: e17-symbols;
    content: " "
}

.main__product h3, .main__bonus h3 {
    margin: 0
}

.main__bonus a {
    text-align: left
}

.main__bonus--form-link {
    background-color: var(--color-blue-bright);
    padding: 1.2em
}

.main__bonus--form-link h2 {
    margin-top: 0
}

.main__bonus--form-link a {
    width: auto;
    display: table
}

@media (min-width: 1024px) {
    .main__bonus--form-link {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 180px auto;
        grid-template-columns:180px auto
    }

    .main__bonus--form-link h2 {
        grid-column: span 2;
        -ms-grid-column-span: 2;
    }

    .main__bonus--form-link p:nth-child(2), .main__bonus--form-link p:nth-child(3) {
        -ms-grid-column: 2;
        grid-column: 2
    }

}

.main__bonus--download-list {
    margin-top: 2em;
    border-top: 1px solid var(--color-gray-medium);
    padding-top: 1em
}

.main__bonus--download-list a {
    background-color: transparent;
    color: var(--color-blue-enertrag);
    padding: 0;
    display: inline-table;
    width: auto;
    margin-right: .5em;
    line-height: 2
}

.main__bonus--download-list a:before {
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: "";
    margin-right: .3em;
    text-decoration: none
}

.main__bonus form .powermail_reset {
    display: none
}

.main__bonus form #back-to-step1 {
    color: var(--color-gray-medium);
    background: var(--color-gray-bright);
    border: none !important;
    cursor: pointer;
    width: auto
}

.main__bonus form .powermail_tab_navigation, .main__bonus form .btn-group {
    display: none
}

.main__bonus form .form__field--select .parsley-error {
    background-color: var(--color-gray-bright)
}

.main__bonus form fieldset {
    display: none !important
}

.main__bonus form fieldset [class*="form__field"] {
    max-width: 60rem !important
}

.main__bonus form fieldset [class*="form__field"]:nth-last-child(3) {
    float: left;
    width: auto;
    margin-left: calc(60rem * 0.3)
}

.main__bonus form fieldset [class*="form__field"]:nth-last-child(2) {
    float: right;
    width: auto;
    margin-right: calc(100% - 60rem)
}

.main__bonus form fieldset [class*="form__field"]:nth-last-child(2) a {
    width: auto
}

.main__bonus form fieldset + h3 {
    margin-top: 1rem
}

.main__bonus form fieldset .form__field--html {
    max-width: 55rem
}

.main__bonus form fieldset .form__field--html h3 {
    margin-left: 30%
}

.main__bonus form fieldset .form__field--check {
    align-items: center;
    visibility: hidden
}

.main__bonus form fieldset .form__field--check label {
    order: 2;
    visibility: visible
}

.main__bonus form fieldset .form__field--check input {
    margin-left: 30%;
    visibility: visible
}

.main__bonus form .form__fieldset--page-7:target {
    display: block !important
}

.main__bonus form .form__fieldset--page-8:target {
    display: block !important
}

.main__bonus form .form__fieldset--page-8 .form__text:nth-child(4) {
    max-width: 60rem;
    color: var(--color-gray-medium);
    box-sizing: border-box
}

.aside__bonus {
    padding: 0 !important;
    background-color: transparent !important
}

.aside__bonus > section {
    padding: 1.2em;
    background-color: var(--color-blue-enertrag);
    color: var(--color-white)
}

.aside__bonus > section > h3 {
    color: var(--color-white) !important
}

.aside__bonus > section > ul {
    position: relative;
    cursor: pointer
}

.aside__bonus > section > ul:before {
    content: "Wohnort wählen";
    padding: .8em;
    border: 1px solid var(--color-gray-bright);
    display: block;
    color: var(--color-blue-enertrag);
    box-sizing: border-box;
    line-height: 1.3;
    background-color: var(--color-white);
    width: 100%
}

.aside__bonus > section > ul:after {
    color: var(--color-blue-enertrag);
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    padding: .8em;
    transition: -webkit-transform 250ms ease;
    transition: transform 250ms ease, -webkit-transform 250ms ease;
    line-height: 1.3
}

.aside__bonus > section > ul > li {
    visibility: hidden;
    pointer-events: none;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 1;
    padding: 0;
    background-color: var(--color-white);
    border-style: solid;
    border-color: var(--color-gray-bright);
    border-width: 0 1px 1px 1px;
    width: 100%;
    box-sizing: border-box
}

.aside__bonus > section > ul > li:nth-child(1) {
    top: calc(2.6em + 2px)
}

.aside__bonus > section > ul > li:nth-child(2) {
    top: calc(5.2em + 3px)
}

.aside__bonus > section > ul > li:nth-child(3) {
    top: calc(7.8em + 4px)
}

.aside__bonus > section > ul > li:nth-child(4) {
    top: calc(10.4em + 5px)
}

.aside__bonus > section > ul > li:nth-child(5) {
    top: calc(13em + 6px)
}

.aside__bonus > section > ul > li:nth-child(6) {
    top: calc(15.6em + 7px)
}

.aside__bonus > section > ul > li:nth-child(7) {
    top: calc(18.2em + 8px)
}

.aside__bonus > section > ul > li:nth-child(8) {
    top: calc(20.8em + 9px)
}

.aside__bonus > section > ul > li:nth-child(9) {
    top: calc(23.4em + 10px)
}

.aside__bonus > section > ul > li:nth-child(10) {
    top: calc(26em + 11px)
}

.aside__bonus > section > ul > li:nth-child(11) {
    top: calc(28.6em + 12px)
}

.aside__bonus > section > ul > li:nth-child(12) {
    top: calc(31.2em + 13px)
}

.aside__bonus > section > ul > li:nth-child(13) {
    top: calc(33.8em + 14px)
}

.aside__bonus > section > ul > li:nth-child(14) {
    top: calc(36.4em + 15px)
}

.aside__bonus > section > ul > li:nth-child(15) {
    top: calc(39em + 16px)
}

.aside__bonus > section > ul > li:nth-child(16) {
    top: calc(41.6em + 17px)
}

.aside__bonus > section > ul > li:nth-child(17) {
    top: calc(44.2em + 18px)
}

.aside__bonus > section > ul > li:nth-child(18) {
    top: calc(46.8em + 19px)
}

.aside__bonus > section > ul > li:nth-child(19) {
    top: calc(49.4em + 20px)
}

.aside__bonus > section > ul > li:nth-child(20) {
    top: calc(52em + 21px)
}

.aside__bonus > section > ul > li > div > p {
    margin: 0
}

.aside__bonus > section > ul > li > div a {
    color: var(--color-blue-enertrag);
    text-decoration: none;
    display: block;
    padding: .8em
}

.aside__bonus > section > ul > li > div a:before {
    display: none
}

.aside__bonus > section > ul.show-list:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

.aside__bonus > section > ul.show-list li {
    visibility: visible;
    pointer-events: all
}

.aside__bonus > nav {
    background-color: var(--color-blue-bright);
    padding: 1.2em
}

.aside__bonusPreview--calculation {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 40em;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: auto;
    background-color: var(--color-blue-bright);
    z-index: 1000;
    padding: 1.5em;
    box-shadow: 0 0 0 1000px var(--color-white-translucent);
    color: var(--color-black);
    line-height: 1.5;
    max-width: 100vw;
    max-height: 100vh;
    overflow-y: auto;
    box-sizing: border-box;
    pointer-events: all;
    visibility: visible
}

.aside__bonusPreview--calculation caption {
    text-align: left;
    font-size: 2.2rem !important;
    color: var(--color-blue-enertrag);
    font-weight: 400 !important;
    font-family: "Daxline medium", sans-serif !important;
    margin: 0 0 .7em 0
}

.aside__bonusPreview--calculation .button__close {
    margin: 0;
    width: auto;
    position: absolute;
    right: 1em;
    top: 1em
}

.aside__bonusPreview--calculation .button__close a:before {
    display: none
}

.aside__bonusPreview--calculation .button__close a:after {
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: "";
    margin-left: .3em;
    text-decoration: none !important
}

.aside__bonusPreview--calculation h3 {
    margin: 2rem 0 1rem 0 !important
}

.aside__bonusPreview--calculation table td:first-child {
    padding: .3em 2em .3em 0
}

.aside__bonusPreview--calculation--target {
    display: block !important
}

.main__news {
    float: left;
    width: 100%
}

@media (min-width: 1024px) {
    .main__news {
        display: inline-table;
        width: calc(66.66666% - 40px)
    }

}

.main__news header.news h1 {
    margin: 0 0 1em 0;
    float: left
}

.main__news header.news h1 + ul {
    float: right;
    padding: 0;
    cursor: pointer;
    position: relative;
    line-height: 1;
    z-index: 10;
    margin: 0 0 1em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.main__news header.news h1 + ul:before {
    content: "alle Themen";
    padding: .8em;
    border: 1px solid var(--color-gray-bright);
    display: block;
    width: 200px;
    color: var(--color-blue-enertrag)
}

.main__news header.news h1 + ul:after {
    color: var(--color-blue-enertrag);
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    padding: .8em;
    transition: -webkit-transform 250ms ease;
    transition: transform 250ms ease, -webkit-transform 250ms ease
}

.main__news header.news h1 + ul li {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 1;
    padding: .8em;
    background-color: var(--color-white);
    border-style: solid;
    border-color: var(--color-gray-bright);
    border-width: 0 1px 1px 1px;
    width: 100%;
    box-sizing: border-box
}

.main__news header.news h1 + ul li:nth-child(1) {
    top: calc(2.6em + 2px)
}

.main__news header.news h1 + ul li:nth-child(2) {
    top: calc(5.2em + 3px)
}

.main__news header.news h1 + ul li:nth-child(3) {
    top: calc(7.8em + 4px)
}

.main__news header.news h1 + ul li:nth-child(4) {
    top: calc(10.4em + 5px)
}

.main__news header.news h1 + ul li:nth-child(5) {
    top: calc(13em + 6px)
}

.main__news header.news h1 + ul li:nth-child(6) {
    top: calc(15.6em + 7px)
}

.main__news header.news h1 + ul li:nth-child(7) {
    top: calc(18.2em + 8px)
}

.main__news header.news h1 + ul li:nth-child(8) {
    top: calc(20.8em + 9px)
}

.main__news header.news h1 + ul li:nth-child(9) {
    top: calc(23.4em + 10px)
}

.main__news header.news h1 + ul li:nth-child(10) {
    top: calc(26em + 11px)
}

.main__news header.news h1 + ul li a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.main__news header.news h1 + ul.show-list:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

.main__news header.news h1 + ul.show-list li {
    display: block
}

@media (min-width: 640px) {
    .news--detail .p--text + figure ~ figure {
        max-width: 50%;
        float: left;
        margin: 0 1em 1em 0
    }

}

.news--archive {
    padding: 2rem 0;
    border-bottom: 1px solid var(--color-gray-bright)
}

.news--archive > div {
    position: relative;
    display: flex;
    flex-wrap: wrap
}

.news--archive .p--time {
    margin: 0;
    position: absolute;
    top: 0;
    right: 0
}

.news--archive h3 {
    margin: 0;
    color: var(--color-black);
    padding-right: 120px
}

.news--archive h3 + p {
    margin: .3em 0 0 0;
    padding-right: 120px
}

.news--archive a {
    color: var(--color-blue-enertrag)
}

.news--more {
    text-align: center
}

.news--more a {
    display: inline-table
}

.news {
    clear: both
}

.news--related {
    clear: both;
    margin-top: 2em;
    padding-top: 1em;
    border-top: 1px solid var(--color-gray-bright)
}

.news--related section.news {
    margin-bottom: 1em;
    padding-bottom: 1em;
    border-bottom: 1px solid var(--color-gray-bright)
}

.news--related section.news figure img {
    display: block;
    width: 100%
}

.news--related section.news h4 {
    color: var(--color-black)
}

.news--related section.news h4 a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

@media (min-width: 640px) {
    .news--related section.news {
        display: flex;
        flex-direction: row
    }

    .news--related section.news figure {
        margin: 0 1em 0 0;
        align-self: flex-start;
        flex: 0 0 20%;
    }

    .news--related section.news > div {
        width: 100%
    }

    .news--related section.news > div h4 {
        max-width: calc(100% - 100px);
        margin: 0
    }

    .news--related section.news > div p {
        float: right;
        margin: 0
    }

}

.news--back a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.news--back a:before {
    font-family: "e17-symbols" !important;
    vertical-align: middle;
    content: " ";
    margin-right: .3em
}

.news--end {
    text-align: center
}

.news--end span {
    padding: 1em 2em;
    line-height: 1;
    background-color: var(--color-black-translucent);
    border: none;
    color: var(--color-white);
    display: inline-table;
    text-decoration: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.news--newslist section.news {
    width: 100%
}

.news--newslist section {
    margin-bottom: 1.5em;
    padding-bottom: 20px
}

.news--newslist section figure {
    display: block;
    align-self: flex-start;
    width: 100%;
    position: relative;
    flex: 0 0 35%;
}

.news--newslist section figure:before {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    font-size: 1.5rem;
    text-transform: uppercase;
    font-weight: 300;
    padding: 0 1.5em;
    margin: -3.5em 0 0 0;
    line-height: 3rem
}

.news--newslist section img {
    display: block;
    width: 100%
}

.news--newslist section a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.news--newslist section h2, .news--newslist section h3 {
    font-size: 2.2rem !important;
    line-height: 2.6rem !important;
    margin: 1em 0 0 0;
    position: relative
}

@media (min-width: 640px) {
    .news--newslist section h2, .news--newslist section h3 {
        margin: .3em 0 .3em 0
    }

}

.news--newslist section[data-cat="presse"] figure:before {
    content: "Presse"
}

.news--newslist section[data-cat="blog"] figure:before {
    content: "Blog"
}

@media (max-width: 639px) {
    .news--newslist section img {
        width: 100%
    }

    .news--newslist section > div {
        display: flex;
        flex-direction: column
    }

    .news--newslist section > div h3 {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    .news--newslist section > div .p--time {
        order: 2;
        margin: .1em 0
    }

    .news--newslist section > div .p--text {
        order: 3;
        margin: .1em 0 0 0
    }

}

.news--newslist section .p--time {
    margin: 0 0 .5em 0;
    line-height: 1
}

.news--newslist section .p--text {
    margin: 0 0 .5em 0
}

.news--newslist section.news--top {
    clear: both
}

@media (max-width: 639px) {
    .news--newslist section.news--top {
        border-bottom: 1px solid var(--color-gray-bright)
    }

}

@media (min-width: 640px) {
    .news--newslist section.news--top > div {
        padding: 1.25em;
        background-color: var(--color-blue-bright)
    }

}

@media (min-width: 640px) {
    .news--newslist section.news {
        display: flex;
        flex-direction: row
    }

    .news--newslist section.news figure {
        margin: 1.5em 1em 0 0
    }

}

.news--newslist section.news:not(:nth-last-child(2)) {
    border-bottom: 1px solid var(--color-gray-bright)
}

.aside__news .tweets h3 {
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    margin: 0;
    line-height: 68px !important;
    padding: 0 1rem
}

.aside__news .tweets h3:after {
    float: right;
    content: "";
    font-family: "e17-symbols" !important
}

.aside__news .tweets > div {
    background-color: var(--color-white);
    color: var(--color-black);
    border: 1px solid var(--color-black-translucent);
    border-top: none;
    margin: 0;
    padding: 20px
}

.aside__news .tweets > div .tweet {
    padding: 1rem 0
}

.aside__news .tweets > div .tweet p {
    margin: 0
}

.aside__news .tweets > div .tweet ul {
    margin-top: .5rem
}

.aside__news .tweets > div div {
    border: none;
    border-top: 1px solid var(--color-gray-bright)
}

.aside__news .tweets > div div:first-child {
    border-top: none
}

.aside__news .tweets > div div ul {
    margin-top: -1rem;
    display: flex;
    justify-content: flex-start
}

.aside__news .tweets > div div ul li {
    margin: 0 7px
}

.aside__news .tweets > div > a {
    color: var(--color-white);
    background-color: var(--color-blue-enertrag);
    width: 240px;
    height: 45px;
    margin: 1rem auto;
    line-height: 3;
    text-align: center;
    display: block
}

.aside__news .tweets .tweet a:before {
    color: var(--color-gray-medium);
    font-family: e17-symbols !important
}

.main__news + .aside__news {
    grid-area: none !important
}

@media (min-width: 1024px) {
    .main__news + .aside__news {
        float: left;
        display: inline-block;
        width: 33.33333%
    }

}

.main__news + .aside__news section, .main__news + .aside__news > nav {
    padding: 1.2em;
    margin: 0 -1em
}

.main__news + .aside__news section h3, .main__news + .aside__news > nav h3 {
    margin-top: 0
}

@media (min-width: 375px) {
    .main__news + .aside__news section, .main__news + .aside__news > nav {
        margin: 0
    }

}

@media (min-width: 1024px) {
    .main__news + .aside__news section, .main__news + .aside__news > nav {
        margin: 1rem 0 2rem 0
    }

}

.main__news + .aside__news .contact {
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    margin-top: 0
}

.main__news + .aside__news .contact h3 {
    color: var(--color-white)
}

.main__news + .aside__news .contact img {
    float: right
}

.main__news + .aside__news .contact .p--mailto {
    margin-bottom: 0
}

.main__news + .aside__news .sitenav {
    background-color: var(--color-blue-bright)
}

.main__news + .aside__news .sitenav a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.main__news + .aside__news .tweets {
    padding: 0;
    display: none
}

@media (min-width: 1024px) {
    .main__news + .aside__news .tweets {
        display: block
    }

}

.aside--portal {
    background-color: var(--color-gray-bright)
}

.aside--portal .aside__news {
    grid-area: aside;
    margin: 4rem 0 6rem 0
}

.aside--portal .aside__news a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.aside--portal .aside__news a:hover {
    text-decoration: underline
}

.aside--portal .aside__news > h2 {
    padding-top: 1rem
}

.aside--portal .aside__news > p {
    text-align: right
}

.aside--portal .aside__news > div {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.aside--portal .aside__news figure {
    height: 188px;
    overflow: hidden
}

.aside--portal .aside__news figure img {
    min-height: 100%
}

.aside--portal article {
    background-color: var(--color-white);
    position: relative;
    display: block;
    margin-bottom: 2rem;
    width: 100%
}

.aside--portal article:nth-child(3) {
    display: none
}

@media (min-width: 640px) {
    .aside--portal article {
        width: calc(50% - 12px)
    }

}

@media (min-width: 1024px) {
    .aside--portal article {
        width: calc(33.3333% - 24px)
    }

    .aside--portal article:nth-child(3) {
        display: block
    }

}

.aside--portal article img {
    width: 100%;
    display: block
}

.aside--portal article h3, .aside--portal article p {
    margin: 2rem
}

.aside--portal article h3 {
    position: relative
}

.aside--portal article figure {
    position: relative
}

.aside--portal article figure:before {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    font-size: 1.5rem;
    text-transform: uppercase;
    font-weight: 300;
    padding: 0 1.5em;
    line-height: 3rem
}

.aside--portal article[data-cat="presse"] figure:before {
    content: "Presse"
}

.aside--portal article[data-cat="blog"] figure:before {
    content: "Blog"
}

@media (min-width: 1280px) {
    .aside--portal ~ .header [class^="animation-"] + hr {
        width: 1200px
    }

    .aside--portal ~ .header [class^="animation-"] + hr:after {
        content: "";
        display: block;
        line-height: 1;
        font-family: "e17-symbols" !important;
        vertical-align: middle;
        position: absolute;
        top: 20px;
        left: 50%;
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
        font-size: 2em;
        color: var(--color-blue-enertrag)
    }

}

.footer {
    background-color: var(--color-gray-bright);
    color: var(--color-blue-enertrag)
}

.footer a {
    text-decoration: none
}

.footer a:hover {
    text-decoration: underline
}

.footer__meta {
    background-color: var(--color-white);
    color: var(--color-black);
    padding: 1em 0;
}

.footer__meta .container:after, .footer__meta .container:before {
    content: none;
    display: none;
    clear: none;
}

.footer__meta .container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.footer__meta ul {
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    list-style-type: none;
    margin: 0;
    padding: 0
}

@media (max-width: 639px) {
    .footer__meta .container {
        flex-direction: column
    }

    .footer__meta .container .footer__meta--left {
        order: 2;
        margin-top: .5em
    }

    .footer__meta .container .footer__meta--left, .footer__meta .container .footer__meta--middle {
        text-align: center
    }
}

.footer__meta--left, .footer__meta--middle, .footer__meta .footer-right {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.footer__meta--left {
    line-height: 1.25;
}

.footer__meta--middle {
    color: var(--color-gray-bright);
    line-height: 1;
    margin: 0 1.5em;
}

.footer__meta--middle a {
    display: block;
}

.footer__meta .footer-right {
    text-align: right;
    color: var(--color-blue-enertrag);
    display: none
}

@media (min-width: 1024px) {
    .footer__meta .footer-right {
        display: block
    }
}

.footer__meta .footer-right a {
    padding: 0 .5em;
    color: inherit;
    line-height: 2
}

.footer__meta .footer-right li:not(:last-child) a {
    border-right: 1px solid var(--color-gray-bright)
}

.footer__map {
    color: var(--color-white-permanent);
    background-color: var(--color-blue-enertrag-permanent);
    background-image: none;
    height: auto
}

@media (min-width: 768px) {
    .footer__map {
        background-image: url(Images/europa.svg);
        background-repeat: no-repeat;
        height: 600px;
        background-position: center center;
        background-size: contain
    }
}

.footer__map table {
    width: 100%;
    background-color: var(--color-blue-alternative);
    color: var(--color-white-permanent);
    padding: 1em;
    table-layout: auto;
    position: relative
}

.footer__map table caption {
    display: table;
    font-size: 1.3em;
    line-height: 1.2;
    font-weight: bold !important;
    text-align: left;
    margin-bottom: .5em
}

.footer__map table td:nth-child(2) {
    text-align: right;
    white-space: nowrap
}

.footer__map table + p {
    text-align: right;
    background-color: var(--color-blue-alternative);
    color: var(--color-white-permanent);
    margin-top: 0;
    padding: 1em;
    box-sizing: border-box
}

.footer__map table + p a {
    color: inherit;
    text-decoration: none
}

@media (min-width: 768px) {
    .footer__map table:before {
        width: 100px;
        border-bottom: 1px solid var(--color-white-permanent);
        display: block;
        content: "";
        position: absolute;
        right: 100%;
        top: calc(50% + 1.5em)
    }
}

@media (min-width: 768px) {
    .footer__map table, .footer__map p {
        width: 350px;
        margin-left: 50%
    }
}

.footer__map h1 {
    color: var(--color-white-permanent);
    margin-top: 2em
}

nav.sitemap .metanav {
    display: none
}

@media (max-width: 1023px) {
    nav.sitemap {
        border-top: 2px solid var(--color-gray-bright);
        position: absolute;
        left: 0;
        background-color: var(--color-white);
        color: var(--color-black);
        width: 100%;
        top: 95px;
        overflow-y: scroll;
        padding: 0 1em;
        font-size: 1.375em;
        box-sizing: border-box;
        z-index: 100;
        pointer-events: none;
        max-height: 0;
        transition: max-height 300ms ease
    }

    nav.sitemap ul,
    nav.sitemap li {
        margin: 0;
        padding: 0;
        list-style: none
    }

    nav.sitemap button, nav.sitemap a {
        text-decoration: none;
        color: inherit
    }

    nav.sitemap button {
        display: block;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        text-transform: uppercase;
        background-color: transparent;
        border: none;
        padding: 0;
        text-align: left;
        width: 100%;
        cursor: pointer;
        line-height: 1;
        outline: none
    }

    nav.sitemap button span {
        display: table;
        padding: 1em 0;
        width: 100%;
    }

    nav.sitemap button + a,
    nav.sitemap button + strong {
        display: none
    }

    nav.sitemap .level_1 > li {
        position: relative
    }

    nav.sitemap .level_1 > li button span,
    nav.sitemap .level_1 > li a {
        border-bottom: 2px solid var(--color-gray-bright);
    }

    nav.sitemap .level_2 > li button span,
    nav.sitemap .level_2 > li a {
        border-bottom: none;
    }

    nav.sitemap .level_1 > li:not(.single):after {
        content: "";
        display: block;
        line-height: 1;
        font-family: "e17-symbols" !important;
        vertical-align: middle;
        pointer-events: none;
        position: absolute;
        top: 1em;
        right: .5em;
        transition: -webkit-transform 300ms ease;
        transition: transform 300ms ease, -webkit-transform 300ms ease
    }

    nav.sitemap .level_1 > li.expand:after {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    nav.sitemap .level_1 > li:last-child:after,
    nav.sitemap .level_1 > li:nth-last-child(2):after {
        display: none
    }

    /*metanav*/
    nav.sitemap .level_1 > li:last-child {
        margin: 0 -1em;
        padding: 0 1em
    }

    nav.sitemap .level_1 > li.single strong {
        font-family: "daxline", sans-serif !important
    }

    nav.sitemap .level_1 > li.single span {
        text-transform: uppercase;
        display: block;
        line-height: 1;
        padding: 2.2rem 0;
        border-bottom: 2px solid var(--color-gray-bright)
    }

    nav.sitemap .level_1 > li.single a > span {
        padding: 0;
        border: none
    }

    nav.sitemap .level_1 > li:nth-last-child(3) strong,
    nav.sitemap .level_1 > li:nth-last-child(4) strong,
    nav.sitemap .level_1 > li:nth-last-child(2) strong {
        font-weight: normal
    }

    nav.sitemap .level_1 > li a {
        text-transform: uppercase;
        line-height: 1;
        display: block;
        padding: 2.2rem 0;
    }

    nav.sitemap .level_1 > li:nth-last-child(3) > ul > li:last-child form:after,
    nav.sitemap .level_1 > li:nth-last-child(3) > ul > li:last-child form:before,
    nav.sitemap .level_1 > li:nth-last-child(4) > ul > li:last-child form:after,
    nav.sitemap .level_1 > li:nth-last-child(4) > ul > li:last-child form:before,
    nav.sitemap .level_1 > li:nth-last-child(2) > ul > li:last-child form:after,
    nav.sitemap .level_1 > li:nth-last-child(2) > ul > li:last-child form:before {
        content: "";
        display: table;
        clear: both
    }

    nav.sitemap .level_1 > li:nth-last-child(3) > ul > li:last-child form label,
    nav.sitemap .level_1 > li:nth-last-child(4) > ul > li:last-child form label,
    nav.sitemap .level_1 > li:nth-last-child(2) > ul > li:last-child form label {
        display: none
    }

    nav.sitemap .level_1 > li:nth-last-child(3) > ul > li:last-child form button,
    nav.sitemap .level_1 > li:nth-last-child(4) > ul > li:last-child form button,
    nav.sitemap .level_1 > li:nth-last-child(2) > ul > li:last-child form button {
        padding: .341em 0;
        font-size: 2em;
        color: var(--color-blue-enertrag);
        width: auto;
        float: left;
        margin-left: .5em
    }

    nav.sitemap .level_1 > li:nth-last-child(3) > ul > li:last-child form button:before,
    nav.sitemap .level_1 > li:nth-last-child(4) > ul > li:last-child form button:before,
    nav.sitemap .level_1 > li:nth-last-child(2) > ul > li:last-child form button:before {
        font-family: "e17-symbols";
        content: ""
    }

    nav.sitemap .level_1 > li:nth-last-child(3) > ul > li:last-child form input,
    nav.sitemap .level_1 > li:nth-last-child(4) > ul > li:last-child form input,
    nav.sitemap .level_1 > li:nth-last-child(2) > ul > li:last-child form input {
        border: 1px solid var(--color-gray-medium);
        line-height: 48px;
        margin: 15px 0;
        padding: 0 .5em;
        width: calc(100% - 90px);
        float: left
    }

    nav.sitemap .level_2 {
        line-height: 2.2;
        padding-left: 1.5em;
        overflow: hidden;
        display: none;
    }

    nav.sitemap .level_2 li.active {
        background-color: var(--color-white-translucent)
    }

    nav.sitemap .level_2 a {
        display: block
    }

    nav.sitemap .metanav {
        display: block;
        border-bottom: none
    }

    nav.sitemap [data-element-type="search"] {
        margin: -2px -1em 0 -1em !important;
        padding: 0 1em;
        border-style: solid;
        border-color: var(--color-gray-bright);
        border-width: 2px 0;
    }

    nav.sitemap .metanav ul {
        font-size: .8em;
        display: flex;
        justify-content: space-around;
        flex-wrap: nowrap
    }

    nav.sitemap .metanav ul li {
        border: none !important;
        text-transform: none !important
    }

    nav.sitemap .metanav a {
        display: block;
        padding: 2.2rem 0;
        border: none !important;
    }
}


@media (min-width: 1024px) {
    nav.sitemap {
        padding: 3em 0;
        line-height: 1.5625
    }

    nav.sitemap:after, nav.sitemap:before {
        content: "";
        display: table;
        clear: both
    }

    nav.sitemap form {
        display: none
    }

    nav.sitemap ul, nav.sitemap li {
        list-style: none;
        margin: 0;
        padding: 0
    }

    nav.sitemap .level_1 > li {
        float: left;
        width: 20%
    }

    nav.sitemap .level_2 > li:first-child {
        display: none
    }

    nav.sitemap a {
        color: inherit;
        text-decoration: none
    }

    nav.sitemap button {
        display: none
    }

}

@media (max-width: 1023px) {
    .show-menu nav.sitemap {
        pointer-events: all;
        max-height: 1000px
    }

}

@media (min-width: 1024px) {
    .show-search .header__service ul li form input, .show-search .header__service ul li form button {
        display: block
    }

    .show-search nav.mainnav {
        opacity: 0;
        pointer-events: none
    }

}

.animation-850 {
    height: 85rem
}

.animation-850 img {
    max-width: 100%;
    min-height: 85rem
}

.animation-600 {
    height: 60rem
}

.animation-600 img {
    max-width: 100%;
    min-height: 60rem
}

.animation-850, .animation-600 {
    position: relative;
    overflow: hidden;
    width: 100%
}

.animation-850 + hr, .animation-600 + hr {
    display: none
}

@media (min-width: 640px) {
    .animation-850 + hr, .animation-600 + hr {
        display: block;
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
        max-width: 1200px;
        width: calc(100% - 2em);
        border-width: 0 0 10px 0;
        border-style: solid;
        border-color: var(--color-blue-enertrag);
        margin: 0
    }

}

.animation-850 .bottom-elements, .animation-600 .bottom-elements {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
    max-width: 1200px;
    width: calc(100% - 2em);
    text-align: right
}

.animation-850 .bottom-elements h1, .animation-850 .bottom-elements p, .animation-600 .bottom-elements h1, .animation-600 .bottom-elements p {
    color: var(--color-white);
    text-transform: uppercase;
    font-size: 4rem !important;
    margin: 0;
    display: table;
    float: right;
    clear: right
}

.animation-850 .bottom-elements h1, .animation-600 .bottom-elements h1 {
    padding-right: 3em;
    line-height: 1.3 !important;
    border-bottom: 2px solid var(--color-blue-enertrag);
    font-family: inherit !important
}

.animation-850 .bottom-elements p, .animation-600 .bottom-elements p {
    background-color: var(--color-blue-enertrag);
    padding: .25em;
    line-height: 1
}

.animation-850 .bottom-elements h1 + p ~ p, .animation-600 .bottom-elements h1 + p ~ p {
    display: none
}

.animation-850 > div, .animation-600 > div {
    width: 100%;
    height: 100%
}

.animation-850 img, .animation-600 img {
    display: none;
    height: auto;
    position: absolute;
    min-width: 1635px;
    width: auto
}

.animation-850 img.img-1, .animation-600 img.img-1 {
    display: block
}

.news--images > div {
    border-bottom: 1px solid var(--color-black-translucent);
    padding: 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.news--images > div figure {
    font-size: .9em;
    border-bottom: 1px solid var(--color-gray-bright);
    margin-bottom: 1.5em;
    padding-bottom: 1.5em;
    box-sizing: border-box
}

@media (max-width: 640px) {
    .news--images > div figure {
        width: 50%
    }

    .news--images > div figure:nth-child(2n-1) {
        padding-right: .5em
    }

    .news--images > div figure:nth-child(2n) {
        padding-left: .5em
    }

}

@media (min-width: 640px) {
    .news--images > div figure {
        width: 33.33333%
    }

    .news--images > div figure:nth-child(3n-2) {
        padding-right: .6666em
    }

    .news--images > div figure:nth-child(3n-1) {
        padding-left: .3333em;
        padding-right: .3333em
    }

    .news--images > div figure:nth-child(3n) {
        padding-left: .66666em
    }

}

.news--images > div figure p {
    margin: 0
}

.news--images > div figure > div > div {
    background-color: var(--color-blue-bright);
    position: relative;
    padding: 0 0 100% 0
}

.news--images > div figure > div > div img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: auto;
    max-width: calc(100% - 20px);
    max-height: calc(100% - 20px);
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
}

.news--images > div .figure__download {
    color: var(--color-blue-enertrag);
    text-decoration: none;
    margin: .3em 0;
    display: block
}

.news--images > div .figure__download:hover {
    text-decoration: underline
}

.news--images > div .figure__download .figure--mimetype {
    text-transform: uppercase
}

.news--images > div .figure__download .figure--mimetype:before {
    content: "";
    font-family: e17-symbols;
    font-size: 1.6rem;
    margin-right: 1rem
}

p.mailto:hover, p.mailto a:hover {
    text-decoration: none
}

.p--link a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.p--time {
    color: var(--color-black-translucent)
}

form, fieldset {
    border: none
}

div[class^="form__field--"] {
    line-height: 2;
    margin: 1rem 0
}

div[class^="form__field--"] input {
    box-sizing: border-box
}

form[class^="form"] label {
    display: block;
    line-height: 1.3;
    margin-top: 1rem
}

@media (min-width: 640px) {
    form[class^="form"] label {
        min-width: 30%;
        float: left
    }

}

.label--mandatory:after {
    content: "*"
}

.form__field--input input, .form__field--input select {
    padding: .6rem 1rem
}

.form__field--check input, .form__field--radio input {
    margin-right: .5em
}

.form__field--check input:nth-of-type(2), .form__field--radio input:nth-of-type(2) {
    margin-left: 2rem
}

.form__field--select select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: .6rem 1rem;
    display: block;
    color: var(--color-blue-enertrag);
    border-radius: 0;
    background-color: transparent;
    line-height: 2;
    width: 100%
}

.form__field--submit {
    flex-direction: column
}

@media (min-width: 640px) {
    .form__field--submit input {
        align-self: flex-end !important
    }

}

.form__field--input, .form__field--radio, .form__field--submit, .form__field--reset, .form__field--check, .form__field--select {
    width: 100%;
    max-width: 55rem
}

.form__field--input input, .form__field--input select, .form__field--radio input, .form__field--radio select, .form__field--submit input, .form__field--submit select, .form__field--reset input, .form__field--reset select, .form__field--check input, .form__field--check select, .form__field--select input, .form__field--select select {
    border: 1px solid var(--color-gray-medium) !important;
}

.form__field--input:after, .form__field--input:before, .form__field--radio:after, .form__field--radio:before, .form__field--submit:after, .form__field--submit:before, .form__field--reset:after, .form__field--reset:before, .form__field--check:after, .form__field--check:before, .form__field--select:after, .form__field--select:before {
    content: "";
    display: table;
    clear: both
}

@media (min-width: 640px) {
    .form__field--input, .form__field--radio, .form__field--submit, .form__field--reset, .form__field--check, .form__field--select {
        display: flex
    }

    .form__field--input input, .form__field--radio input, .form__field--submit input, .form__field--reset input, .form__field--check input, .form__field--select input {
        -ms-grid-row-align: center;
        align-self: center
    }

}

.form__field--input input {
    width: 100%
}

.form__field--check {
    margin: 2rem 0 !important
}

.form__field--check label {
    margin-top: 0 !important
}

@media (min-width: 640px) {
    .fieldset__fields--plz-ort {
        max-width: 55rem;
        display: flex
    }

    .fieldset__fields--plz-ort .form__field--input {
        display: inline-table;
        width: auto;
        margin: 0
    }

    .fieldset__fields--plz-ort .form__field--input:nth-child(1) {
        display: flex;
        justify-content: space-between;
        width: calc(30% + 5em);
        padding-right: 1rem
    }

    .fieldset__fields--plz-ort .form__field--input:nth-child(1) input {
        width: 5em
    }

    .fieldset__fields--plz-ort .form__field--input:nth-child(1) label {
        flex-grow: 1
    }

    .fieldset__fields--plz-ort .form__field--input:nth-child(1) label:after {
        content: ",Ort *"
    }

    .fieldset__fields--plz-ort .form__field--input:nth-child(2) {
        width: calc(70% - 5em - 1rem)
    }

    .fieldset__fields--plz-ort .form__field--input:nth-child(2) label {
        display: none
    }

}

.form__text {
    margin: 2rem 0
}

.search--pagination {
    margin: 3em 0
}

.search--pagination:before {
    content: "Seiten:"
}

.search--pagination ul {
    margin: 0;
    padding: 0;
    display: inline-block
}

.search--pagination li {
    display: inline-table
}

.search--pagination a {
    text-decoration: none;
    background-color: var(--color-blue-enertrag);
    display: block;
    color: var(--color-white)
}

.search--pagination a:hover {
    opacity: .7
}

.search--pagination strong {
    background-color: var(--color-gray-bright)
}

.search--pagination a, .search--pagination strong {
    line-height: 1;
    margin-left: .6em;
    padding: .5em
}

.searchresult {
    padding: 2rem 0;
    border-bottom: 1px solid var(--color-gray-bright)
}

.searchresult:after, .searchresult:before {
    content: "";
    display: table;
    clear: both
}

.searchresult h3 {
    margin: 0
}

.searchresult p {
    margin: .3em 0 0 0
}

.searchresult a {
    color: var(--color-blue-enertrag);
    text-decoration: none
}

.searchresult a:hover {
    text-decoration: underline
}

.main__tiles .tile:hover p span {
    text-decoration: underline
}

form label[for$="__service-search"]:hover, .header__service a:hover, .footer__meta a:hover {
    text-decoration: underline
}

[class*="accordion--wrapper"] .accordion__element--first {
    margin: 3.6rem 0 0 0
}

[class*="accordion--wrapper"] .accordion__element--last {
    margin: 0 0 3.6rem 0
}

[class*="accordion--wrapper"] .accordion__element--content {
    padding: 0 13px;
    margin-bottom: .8rem;
    overflow: hidden;
    max-height: 0;
    transition: max-height .8s ease-in-out
}

[class*="accordion--wrapper"] .accordion__element--current a:after {
    content: "-" !important;
    font-size: 200% !important;
    margin-top: -.775rem !important
}

[class*="accordion--wrapper"] .accordion__element--current .accordion__element--content {
    max-height: 100em;
    height: auto
}

[class*="accordion--wrapper"] [class*="accordion__element"] h3 {
    background-color: transparent;
    color: var(--color-black-translucent);
    width: 100%;
    margin: 0;
    padding: .8rem 0;
    border-bottom: 1px solid var(--color-gray-bright);
    cursor: pointer
}

[class*="accordion--wrapper"] [class*="accordion__element"] h3 a {
    display: block;
    padding: .3rem 8px;
    background-color: transparent;
    color: var(--color-blue-enertrag);
    width: 100%;
    text-decoration: none;
    pointer-events: none
}

[class*="accordion--wrapper"] [class*="accordion__element"] h3 a:after {
    font-family: "Daxline Light", sans-serif;
    float: right;
    margin-right: 22px;
    color: var(--color-blue-enertrag);
    font-size: 3.2rem;
    margin-top: -0.25rem;
    content: "+"
}

[class*="accordion--wrapper"] [class*="accordion__element"]:target a:after {
    content: "-";
    font-size: 200%;
    margin-top: -0.775rem
}

[class*="accordion--wrapper"] [class*="accordion__element"]:target .accordion__element--content {
    max-height: 100em;
    height: auto
}

.div__masthead--data h2 {
    font-size: 2.2rem !important
}

.div__masthead--data > div {
    display: flex;
    flex-direction: row;
    height: auto;
    padding: 30px 0;
    flex-wrap: wrap;
    justify-content: space-between
}

.div__masthead--data > div > div {
    width: 100%;
    background-color: var(--color-blue-bright);
    padding: 30px;
    margin: .5em 0;
    box-sizing: border-box
}

@media (min-width: 640px) {
    .div__masthead--data > div > div {
        width: calc(50% - .5em)
    }

}

@media (min-width: 1024px) {
    .div__masthead--data > div > div {
        width: calc(25% - 1em)
    }

}

.div__masthead--data > div p:first-child {
    margin: 0
}

.div__masthead--data a {
    text-decoration: none
}

.div__masthead--data a:hover span {
    text-decoration: underline
}

.div__masthead--data .p--mailto a:before {
    content: "";
    text-decoration: none !important
}

.div__masthead--data .div__masthead--contact a:before {
    content: "";
    padding-top: .1em;
    margin-right: .5em;
    font-family: "e17-symbols" !important;
    text-decoration: none !important
}

.main__commercial {
    -ms-grid-row: 2;
    grid-row: 2;
    padding-bottom: 0
}

.main__commercial .aside__commercial--aside-bottom {
    display: block
}

@media (min-width: 1024px) {
    .main__commercial .aside__commercial--aside-bottom {
        display: none
    }

}

.main__commercial > [class*="main__commercial"] {
    padding: 20px 0 40px 0
}

.main__commercial > [class*="main__commercial"] p a {
    padding: 1em 2em;
    line-height: 1;
    background-color: var(--color-blue-enertrag);
    border: none;
    color: var(--color-white);
    text-decoration: none;
    font-family: "Daxline light", sans-serif;
    display: table;
    margin-top: 1em
}

.main__commercial > [class*="main__commercial"] figure img {
    max-width: 200px;
    max-height: 200px
}

@media screen and (max-width: 1023px) {
    .main__commercial > [class*="main__commercial"] [class*="main__commercial--block"] {
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column
    }

    .main__commercial > [class*="main__commercial"] [class*="main__commercial--block"] figure {
        order: 2
    }

}

@media (min-width: 768px) {
    .main__commercial > [class*="main__commercial"] [class*="main__commercial--block"] {
        flex-direction: row
    }

    .main__commercial > [class*="main__commercial"] [class*="main__commercial--block"] figure {
        margin-right: 1em;
        margin-top: 1em;
        float: left;
    }

    .main__commercial > [class*="main__commercial"] [class*="main__commercial--block"] h2, .main__commercial > [class*="main__commercial"] [class*="main__commercial--block"] p {
        width: calc(100% - 200px)
    }

}

@media (min-width: 768px) {
    .main__commercial > [class*="main__commercial"] .main__commercial--switch-2 figure {
        order: 0;
        margin-left: 0;
        margin-right: 2em
    }

}

@media (min-width: 1024px) {
    .main__commercial > [class*="main__commercial"] .container section {
        width: calc(66.666667% - 40px)
    }

}

.main__commercial > .container {
    padding-top: 20px;
    padding-bottom: 40px
}

@media (min-width: 1024px) {
    .main__commercial > .container article {
        display: inline-table;
        width: calc(66.66667% - 40px);
        float: left
    }

    .main__commercial > .container aside {
        float: left;
        width: 33.33333%;
        display: block
    }

    .main__commercial > .container aside h3 {
        margin-top: 0
    }

}

.main__commercial > .container aside {
    color: var(--color-blue-enertrag);
    display: block;
    padding: 0
}

@media (min-width: 1024px) {
    .main__commercial > .container aside {
        display: block
    }

}

.main__commercial .main__commercial--aside-bottom aside {
    background-color: var(--color-blue-bright);
    color: var(--color-blue-enertrag);
    padding: 1.2em;
    margin: 1em auto
}

.main__commercial .main__commercial--aside-bottom aside h3 {
    margin-top: 0
}

.main__commercial--content {
    width: 100%
}

.main__commercial--content figure img {
    width: 246px
}

.main__commercial--content h2, .main__commercial--content figure, .main__commercial--content p, .main__commercial--content ul {
    width: 100%
}

.main__commercial--content > div {
    -ms-grid-column: 3;
    grid-column: 3;
    -ms-grid-row: 1;
    grid-row: 1
}

.main__commercial--content h2 {
    -ms-grid-row: 1;
    grid-row: 1;
    -ms-grid-column: 3;
    grid-column: 3
}

.main__commercial--content figure {
    -ms-grid-row: 1;
    grid-row: 1;
    -ms-grid-column: 1;
    grid-column: 1;
}

.main__commercial--content ul, .main__commercial--content p {
    grid-row: 2;
    grid-column: span 3;
    -ms-grid-row: 2;
    -ms-grid-column-span: 3
}

.main__commercial--blue-1, .main__commercial--blue-2 {
    background-color: var(--color-blue-bright)
}

.main__commercial--white {
    background-color: var(--color-white)
}

.main__commercial .contenttable {
    width: 100%;
    border-collapse: collapse
}

.main__commercial .contenttable td {
    padding: .5em .2em
}

.main__commercial .contenttable thead tr {
    background-color: var(--color-blue-enertrag);
    color: var(--color-white)
}

.main__commercial .contenttable tbody tr {
    border-bottom: 1px solid var(--color-gray-medium)
}

.main__commercial .contenttable h2, .main__commercial .contenttable h3, .main__commercial .contenttable h4 {
    color: inherit !important;
    margin: 0 !important
}

.main__audience {
    padding-bottom: 0
}

.main__audience .aside__audience--aside-bottom {
    display: block
}

@media (min-width: 1024px) {
    .main__audience .aside__audience--aside-bottom {
        display: none
    }

}

.main__audience > [class*="main__audience"] {
    padding: 20px 0 40px 0
}

.main__audience > [class*="main__audience"] p a {
    padding: 1em 2em;
    line-height: 1;
    background-color: var(--color-blue-enertrag);
    border: none;
    color: var(--color-white);
    text-decoration: none;
    font-family: "Daxline light", sans-serif;
    display: table;
    margin-top: 1em
}

.main__audience > [class*="main__audience"] figure img {
    max-width: 200px;
    max-height: 200px
}

.main__audience > [class*="main__audience"] [class*="main__audience--switch"] {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column
}

.main__audience > [class*="main__audience"] [class*="main__audience--switch"] figure {
    order: 2
}

@media (min-width: 768px) {
    .main__audience > [class*="main__audience"] [class*="main__audience--switch"] {
        flex-direction: row
    }

    .main__audience > [class*="main__audience"] [class*="main__audience--switch"] figure {
        width: 250px;
        margin-left: 2em;
        margin-top: 2em
    }

    .main__audience > [class*="main__audience"] [class*="main__audience--switch"] > div {
        width: calc(100% - 200px)
    }

}

@media (min-width: 768px) {
    .main__audience > [class*="main__audience"] .main__audience--switch-2 figure {
        order: 0;
        margin-left: 0;
        margin-right: 2em
    }

}

@media (min-width: 1024px) {
    .main__audience > [class*="main__audience"] .container section {
        width: calc(66.66666% - 40px)
    }

}

.main__audience > .container {
    padding-top: 20px;
    padding-bottom: 40px
}

@media (min-width: 1024px) {
    .main__audience > .container article {
        display: inline-table;
        width: calc(66.66666% - 40px);
        float: left
    }

    .main__audience > .container aside {
        float: left;
        width: 33.33333%;
        display: none
    }

    .main__audience > .container aside h3 {
        margin-top: 0
    }

}

.main__audience > .container aside {
    background-color: var(--color-blue-bright);
    color: var(--color-blue-enertrag);
    padding: 1.2em;
    display: none
}

@media (min-width: 1024px) {
    .main__audience > .container aside {
        display: block
    }

}

.main__audience .aside__audience--aside-bottom aside {
    background-color: var(--color-blue-bright);
    color: var(--color-blue-enertrag);
    padding: 1.2em;
    margin: 1em auto
}

.main__audience .aside__audience--aside-bottom aside h3 {
    margin-top: 0
}

.main__audience--content figure img {
    height: 180px;
    width: 246px
}

@media (min-width: 768px) {
    .main__audience--content {
        display: -ms-inline-grid;
        display: inline-grid;
        -ms-grid-columns: 1fr 36px 1fr;
        grid-template-columns:1fr 36px 1fr;
        -ms-grid-rows: 1fr auto;
        grid-template-rows:1fr auto
    }

    .main__audience--content h2, .main__audience--content figure, .main__audience--content p {
        width: 100%
    }

    .main__audience--content h2 {
        -ms-grid-row: 1;
        grid-row: 1;
        -ms-grid-column: 3;
        grid-column: 3
    }

    .main__audience--content figure {
        -ms-grid-row: 1;
        grid-row: 1;
        -ms-grid-column: 1;
        grid-column: 1;
        text-align: right
    }

    .main__audience--content p {
        grid-row: 2;
        grid-column: span 3;
        -ms-grid-row: 2;
        -ms-grid-column-span: 3
    }

}

.main__audience--blue-1, .main__audience--blue-2 {
    background-color: var(--color-blue-bright)
}

.main__audience--white {
    background-color: var(--color-white)
}

.main--vacancy-list a:hover {
    text-decoration: underline
}


/* Interim.css */


.header .keyvisual img {
    min-width: 100%
}

.keyvisual + hr {
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
    max-width: 1200px;
    width: calc(100% - 2em);
    border-width: 0 0 10px;
    border-style: solid;
    border-color: var(--color-blue-enertrag);
    margin: 0
}

/* fill the viewport width */
.header__vitrine .vitrine--slider figure {
    width: 100vw;
}


.main__product a:before, .main__product a[href^="http"]:before, .tweets a[target="_blank"]:before, .tweet p a[href^="http"]:before {
    content: "" !important
}

.main__product .p--mailto a:before, a[href^="mailto:"]:before {
    content: "\e902" !important;
    margin-right: .6em;
    font-family: e17-symbols
}

.symbol-newsletter:before {
    content: "\e913"
}

@media only screen and (min-width: 768px) {
    .main__product figure {
        max-width: 376px;
        max-height: 322px;
        padding: 2.6rem 0 0 .6rem;
        overflow: hidden;
        grid-row: 1 / span 99;
        grid-column: 2;
        justify-self: center;
        align-self: center
    }
}

.main__product.main__intro--company-details div.aside--domainspec {
    background-color: var(--color-white)
}

.main__product.main__intro--company-details div.aside--domainspec p {
    margin-top: 0
}

.project-site.minisite .main__product figure {
    max-width: 300px;
    align-self: flex-start
}

.main__product figure img {
    max-width: 376px
}

.project-site.minisite .main__product figure img {
    max-width: 300px
}

.main__product div:nth-child(2) .p--mailto {
    grid-row: 2;
    grid-column: 1
}

.tweet a[href^="http"] {
    color: var(--color-blue-enertrag)
}

.container [class^="main__enterprise--"] h2 {
    font-size: 2.5em !important
}

.main__tiles {
    justify-content: flex-start
}

.main__product h2, .main__tiles section h2 {
    font-size: 2.2rem !important;
    line-height: 2.6rem !important
}

.parsley-errors-list {
    display: none
}

ul.powermail_message_error, .parsley-error, .error, .warn, .done {
    border-radius: 0;
    border-style: solid;
    border-width: 1px
}

ul.powermail_message_error, .parsley-error, .error {
    background-color: var(--color-red-pale);
    border-color: var(--color-red-pale);
    color: var(--color-white)
}

ul.powermail_message_error {
    padding: 1em;
    text-indent: 1em;
    list-style-type: square;
    list-style-position: inside
}

.warn {
    border-color: var(--color-yellow-pale);
    background-color: var(--color-yellow-pale);
    color: var(--color-gray-dark)
}

.done {
    background-color: var(--color-green-pale);
    border-color: var(--color-green-pale);
    color: var(--color-black-permanent)
}

.main__news > p {
    margin-top: 3em;
    text-align: center
}

.main__news > h1 + p {
    text-align: left
}

.main__news.vacancies > p {
    margin-top: 0;
    text-align: left
}

.button--blue {
    margin: 2em auto;
    padding: 1em 2em;
    line-height: 1;
    background-color: var(--color-blue-enertrag);
    border: none;
    color: var(--color-white);
    width: 200px;
    text-decoration: none;
    font-family: "Daxline light", sans-serif
}

.button--blue:hover {
    text-decoration: underline
}

[class$="--smaller"] {
    font-family: "Daxline light", sans-serif;
    font-size: 50%
}

.bottom-elements {
    display: none
}

.header .mainnav.level_1 > li .subnav {
    display: block;
    overflow: hidden;
    margin: -18px 0 0;
    padding: 0;
    height: 0;
    max-height: 0;
    background-color: transparent;
    -o-transition: max-height .5s linear;
    -moz-transition: max-height .5s linear;
    -webkit-transition: max-height .5s linear;
    transition: max-height .5s linear;
    min-width: 160px
}

.header .mainnav.level_1 > li .subnav:before {
    border: none
}

.header .mainnav.level_1 > li:hover, .header .mainnav.level_1 > li:hover a {
    color: var(--color-blue-enertrag)
}

.header .mainnav.level_1 > li:hover .subnav {
    height: auto;
    max-height: 40rem
}

.header .mainnav.level_1 > li:hover .subnav a {
    color: var(--color-black)
}

.header .mainnav.level_1 > li:hover .subnav li:hover a {
    color: var(--color-white)
}

.header .mainnav.level_1 > li .subnav li {
    background-color: var(--color-blue-bright)
}

.header .mainnav.level_1 > li .subnav li:first-child, .header .mainnav.level_1 > li .subnav li:nth-child(2) {
    margin-top: 17px;
    padding-top: 10px;
    position: relative
}

.header .mainnav.level_1 > li .subnav li:last-child {
    padding-bottom: 10px
}

.header .mainnav.level_1 > li .subnav li:first-child:before, .header .mainnav.level_1 > li .subnav li:nth-child(2):before {
    content: "";
    border: 17px solid transparent;
    border-bottom-color: var(--color-blue-bright);
    position: absolute;
    top: -34px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -15px
}

.main__tiles--portal a:hover, .p--link a:hover, .main__product .p--mailto a:hover, .contact .p--mailto a:hover, .tweet a[class^="icon-"]:hover, .news--back a:hover, .sitenav a:hover, aside nav a:hover {
    text-decoration: none !important
}

.show-list a:hover, .news--newslist a:hover, .news--more a:hover, .main__tiles--portal a:hover span, .p--link a:hover span, .news--back a:hover span, .main__product p a:hover, .contact .p--mailto a:hover span, .main__product p.p--mailto a:hover span, aside a:hover, .nav a:hover span, .sitenav a:hover strong, aside nav a:hover span {
    text-decoration: underline !important
}

.main aside a:hover {
    text-decoration: none
}

a {
    color: var(--color-blue-enertrag)
}

.news--archive h3, .news--archive a {
    color: var(--color-blue-enertrag);
    text-decoration: none;
    min-width: 80%
}

.main__news .news--detail div {
    clear: both
}

.news--detail div figure:nth-last-child(2) {
    max-width: 90% !important;
    float: none;
    display: flex;
    align-items: center;
    margin: 1.8em auto;
}

@media all and (min-width: 640px) {
    .news--detail p ~ div.video-wrapper {
        max-width: 50%;
        display: inline-block;
        float: left;
        margin: 0 1em 1em 0
    }
}

.news--archive a:hover h3, a.tel:hover, .tweets a:hover, .main aside a:hover span {
    text-decoration: underline !important
}

.news--archive p.p--link {
    margin: .6rem 0 0
}

aside section {
    padding: 30px;
    margin-bottom: 40px !important
}

aside section:last-child {
    margin-bottom: 0
}

.main--vacancy-list section {
    padding: 0
}

.project-site.minisite footer.footer {
    color: var(--color-blue-enertrag);
    background-color: var(--color-blue-bright)
}

.aside__news--backlink {
    background-color: var(--color-blue-enertrag);
    color: var(--color-blue-bright)
}

.aside__news--backlink h1 {
    display: none
}

.aside__news--backlink h3 {
    margin-bottom: 0;
    color: inherit
}

.aside__news--backlink h3:first-letter {
    text-transform: uppercase
}

@media only screen and (max-width: 1023px) {
    .project-site.minisite .aside__news--single-view {
        display: none
    }

    .project-site.minisite nav.sitemap .level_1 > li.expand ul {
        max-height: 600px
    }
}

@media only screen and (min-width: 1024px) {
    .project-site.minisite footer.footer nav.sitemap .level_1 > li {
        width: 33%
    }

    .project-site.minisite .aside__news--single-view .level_1 > li, .project-site.minisite .aside__news nav.sitemap .level_1 > li {
        width: 93%
    }

    .project-site.minisite .aside__news--single-view nav.sitemap .level_1 a, .project-site.minisite .aside__news--single-view nav.sitemap .level_1 strong, .project-site.minisite .aside__news nav.sitemap .level_1 a, .project-site.minisite .aside__news nav.sitemap .level_1 strong {
        display: none
    }

    .project-site.minisite .aside__news--single-view nav.sitemap .level_2 a, .project-site.minisite .aside__news--single-view nav.sitemap .level_2 strong, .project-site.minisite .aside__news nav.sitemap .level_2 a, .project-site.minisite .aside__news nav.sitemap .level_2 strong {
        display: block
    }

    .project-site.minisite .aside__news--single-view nav.sitemap .level_2 > li a span, .project-site.minisite .aside__news nav.sitemap .level_2 > li a span {
        font-family: "Daxline bold", sans-serif
    }

    .project-site.minisite .aside__news--single-view nav.sitemap, .project-site.minisite .aside__news nav.sitemap {
        padding: 0;
        margin-top: -1rem
    }

    .project-site.minisite .aside__news--single-view nav.sitemap .level_2 > li strong, .project-site.minisite .aside__news nav.sitemap .level_2 > li strong {
        display: none
    }
}

#goto-Solar:before {
    content: "\e908";
    color: var(--color-blue-enertrag);
    font-family: e17-symbols;
    font-size: 3em;
    line-height: 1.2;
    text-decoration: none
}

#goto-Solar:hover {
    text-decoration: none !important
}

.show-menu .header .mobile-main-menu a:after {
    content: "\e901"
}

.search--pagination:before {
    content: ""
}

.search--pagination a, .search--pagination strong {
    margin-left: 4px;
    margin-bottom: 4px
}

.search--pagination a:first-child, .search--pagination strong:first-child {
    margin-left: 0
}

.search--pagination a:hover {
    text-decoration: underline
}

.iconless:before {
    padding: 0 !important;
    margin: 0 !important;
    content: "" !important
}

.iconless:hover h2 {
    text-decoration: underline
}

.main__audience--content h2 {
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none
}

[class$="--smaller"] {
    display: inline-block;
    line-height: 1.6
}

.header__logo img {
    max-width: none
}

.main__news {
    display: inline-block
}

.main__tiles .tile {
    padding: 30px 20px;
    min-height: 188px
}

.main__tiles .tile p {
    margin: 0
}

.main__product figure {
    max-height: 350px
}

.main__product figure.video {
    max-height: unset;
}

@media only screen and (max-width: 600px) {
    .main__product figure.video video{
        max-width: 100%;
    }

    .main__product figure.video iframe{
        max-width: 100%;
    }
}

.main__tiles .tile button.transparent {
    border: none;
    margin: 0;
    padding: 0;
    background-color: transparent
}

.main__tiles .tile button.transparent:hover {
    text-decoration: none !important
}

.header__service ul.header__service--id-37 li:nth-last-child(5):before {
    content: ""
}

.header__service ul.header__service--id-290 li:nth-last-child(5):before {
    content: "\ea1c"
}

.header__service--language-switcher span.header__service--langSwitcher a:before {
    padding: .2rem;
    margin: 0 .2rem;
    background-color: var(--color-black-translucent)
}

.header__service--language-switcher span a img {
    border: 1px solid var(--color-white);
    margin-left: 6px
}

.hidden {
    display: none !important
}

@media only screen and (max-width: 1023px) {
    footer .header__service--language-switcher {
        display: flex;
        align-self: stretch;
        justify-content: center;
        align-content: center;
        padding: 0;
        border: none
    }

    html[class*="graffiti"] footer nav.sitemap {
        top: 143px
    }
}

@media only screen and (min-width: 1024px) {
    footer .header__service--language-switcher {
        display: none
    }

    html[class*="graffiti"] .header__main {
        line-height: 134px !important
    }
}

.header__service ul li:nth-last-child(4):before {
    content: "\ed77"
}

.header__service ul li:nth-last-child(3):before {
    content: "\e902"
}

.header__service ul li:nth-last-child(2):before {
    content: "\e903"
}

.header__service ul li:last-child:before {
    content: "\e908"
}

.header__service ul.header__service--id-126 li:nth-last-child(5):before {
    content: "\ed77"
}

.header__service ul.header__service--id-126 li:nth-last-child(4):before {
    content: "\e902"
}

.header__service ul.header__service--id-126 li:nth-last-child(3):before {
    content: "\e913"
}

.header__service ul.header__service--id-126 li:nth-last-child(2):before {
    content: "\e914"
}

.header__service ul.header__service--id-181 li:nth-child(1):before {
    content: ""
}

.header__service ul.header__service--id-181 li:nth-child(2):before {
    content: "\e902"
}

.header__service ul.header__service--id-241 li:nth-child(3):before {
    content: "\e90f"
}


/*globale icon zuordnung mit data-element-type*/

.header__service ul li[data-element-type*="kontakt"]:before {
    content: "\e902";
}

.header__service ul li[data-element-type*="alle-meldungen"]:before {
    content: "\e903";
}

.header__service ul li[data-element-type*="ueber-enertrag"]:before {
    content: "\e90f";
}

.header__service ul li[data-element-type*="search"]:before {
    content: "\e908";
}

.header__service ul li[data-element-type*="newsletter"]:before {
    content: "\e913";
}

.header__service ul li[data-element-type*="download"]:before {
    content: "\e914"
}

.header__service ul li[data-element-type*="phone"]:before {
    content: "\ea1c";
}

.header__service ul li[data-element-type*="powersystem"]:before,
.header__service ul li[data-element-type*="login"]:before {
    content: "\ed77";
}


.project-site.minisite header ul[class^="header"] li:nth-child(1):before {
    content: "\e90f"
}

.main__tiles--logins .tile, .main__tiles--choose .tile {
    margin-right: 0
}

@media screen and (min-width: 736px) {
    .main__tiles--logins {
        justify-content: space-between
    }

    .main__tiles--logins .tile, .main__tiles--choose .tile {
        margin-right: .75em;
        width: calc(100% / 2 - .5em)
    }

    .main__tiles--logins .tile:nth-child(2n), .main__tiles--choose .tile:nth-child(2n) {
        margin-right: 0
    }
}

@media screen and (min-width: 1024px) {
    .main__tiles--logins {
        justify-content: flex-start
    }

    .main__tiles--logins .tile {
        margin-right: 1em;
        width: calc(100% / 3 - 1em)
    }

    .main__tiles--logins .tile:nth-child(2n) {
        margin-right: 1em
    }

    .main__tiles--logins .tile:nth-child(3n) {
        margin-right: 0
    }
}

.main__error--404-page-not-found {
    width: calc(100% - 40px) !important
}

.form__field--input label[for^="input__blindfeld"], .form__field--input input[id^="input__blindfeld"] {
    display: none !important
}

div.main__commercial--hints {
    margin-bottom: -3em
}

div.main__commercial--hints h4 {
    color: var(--color-white);
    font-weight: 700 !important
}

.main__commercial--hints, .main__commercial--hints h2, .main__commercial--hints h3, .aside__commercial .contact, .aside__commercial .contact h3 {
    color: var(--color-white);
    background-color: var(--color-blue-enertrag)
}

.aside__commercial .sitenav, div.main__commercial--blue-1, div.main__commercial--blue-2 {
    background-color: var(--color-blue-bright)
}

.aside__commercial .contact .ce-column {
    width: calc(50% - 5px);
}


.aside__commercial .contact figcaption {
    background-color: #FCD000;
    color: var(--color-blue-enertrag);
}

.main__intro--commercial {
    display: grid;
    grid-column-gap: 3rem;
    grid-auto-rows: max-content
}

.main__intro--commercial h1 {
    grid-row: 1;
    grid-column: 1
}

.main__intro--commercial p {
    grid-column: 1;
    grid-row-start: 2
}

.main__intro--commercial figure {
    grid-column: 2;
    grid-row-start: 2
}

.main__tiles--subdomain a figure, .main__tiles--commercial a figure {
    background-color: var(--color-blue-bright)
}

div.main__commercial--gray {
    background-color: var(--color-gray-bright)
}

div.main__commercial--white {
    background-color: var(--color-white)
}

.main__commercial--story figure {
    min-width: 95%;
    margin-top: -2em;
    text-align: center
}

.main__commercial--story figure img {
    min-width: 100% !important;
    max-width: calc(66.6667% - 40px) !important;
    max-height: none !important;
    margin: 0
}

.main__commercial--gray table {
    min-width: calc(66.6667% - 40px) !important
}

.main__commercial--gray table thead th {
    padding: 8px;
    text-align: left
}

.main__commercial--gray table tbody td {
    padding: 8px;
    text-align: center
}

.main__commercial--gray table tbody td:first-child {
    text-align: left
}

.main__commercial--gray table thead {
    background-color: var(--color-gray-medium)
}

.main__commercial--gray table tbody {
    background-color: var(--color-gray-bright)
}

div.main__commercial--block-wide section {
    min-width: 100% !important
}

div.main__commercial--hints section.main__commercial--hints p a, div.main__commercial--block-wide section .accordion__element--content p a {
    display: inline;
    padding: inherit;
    margin: inherit;
    line-height: 0;
    color: inherit;
    background-color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit
}

div.main__commercial--block-wide section .accordion__element--content p a:after, section.accordion__element--current .accordion__element--content p a:after, [class*="accordion--wrapper"] .accordion__element--current p a:after {
    content: "" !important;
    font-size: inherit !important;
    margin-top: inherit !important
}

div.main__commercial--hints section.main__commercial--hints p a:hover, div.main__commercial--block-wide section .accordion__element--content p a:hover {
    text-decoration: underline
}

li[id^="place-"]:not(:target) div.aside__bonusPreview--calculation {
    display: none
}

li[id^="place-"]:target div.aside__bonusPreview--calculation {
    display: block
}

@media only screen and (min-width: 1024px) {
    .main__bonus--form-link p:nth-child(2):before {
        font-family: "e17-symbols";
        font-size: 8.6rem;
        color: var(--color-blue-enertrag);
        display: block;
        float: left;
        margin-left: -10.6rem;
        content: "\e917"
    }
}

.main__bonus form fieldset {
    display: block !important
}

.form__textarea {
    display: flex;
    align-self: center;
    width: 100%;
    max-width: 55rem
}

.form__textarea textarea {
    max-width: 55rem;
    width: 100%;
    border: 1px solid var(--color-gray-medium) !important;
}

.form__field--select select.parsley-error {
    background-color: var(--color-red-pale);
    border-color: var(--color-red-pale);
    color: var(--color-red-pale)
}

@media only screen and (min-width: 640px) {
    .form__field--check label {
        line-height: 2 !important
    }

    .form__textarea textarea {
        -ms-grid-row-align: center;
        align-self: center
    }
}

.main__product--form {
    min-width: 100%;
    position: relative
}

.main__product.main__product--form div {
    display: block;
    max-width: 64rem
}

@media only screen and (min-width: 640px) {
    .main__product.main__product--form div {
        display: flex
    }

    .main__product.main__product--form div.powermail_create {
        display: block
    }
}

@media only screen and (min-width: 667px) {
    .main__bonus .form__field--select {
        position: relative
    }

    .main__bonus .form__field--select:after {
        color: var(--color-blue-enertrag);
        font-family: "e17-symbols";
        vertical-align: middle;
        content: "\e904";
        position: absolute;
        right: 0;
        padding: .8em;
        transition: -webkit-transform 250ms ease;
        transition: transform 250ms ease, -webkit-transform 250ms ease;
        line-height: 1.3;
        z-index: -1
    }

    .main__bonus form fieldset [class*="form__field"]:nth-last-child(3) {
        float: none !important
    }

    .main__bonus form fieldset [class*="form__field"]:nth-last-child(3) label {
        max-width: 30rem !important
    }
}

.graffiti .header__logo img[src$=".png"], .graffiti .header__logo img[src$=".jpg"], .graffiti .header__logo img[src$=".svg"] {
    width: 190px;
    height: auto
}

.aside--domainspec {
    -ms-grid-column: 1;
    -ms-grid-row: 3;
    grid-column: 1;
    grid-row: 3;
    background-color: var(--color-white)
}

.aside__domainspec {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin: .5rem 0 2rem;
    border-top: 1px solid var(--color-black-translucent);
    padding: 36px 0 0
}

.aside__domainspec figure {
    flex: 0 1 20%
}

.aside__domainspec figure:not(:nth-child(1)):before {
    content: " ";
    height: 0;
    flex: 1 1 100%
}

.aside__domainspec div {
    flex: 0 1 70%;
    padding-left: 2.5em
}

.animatedCounter {
    min-width: 5rem;
    display: inline-block
}

.aside__domainspec div.kidstuff {
    flex: none;
    margin: 0;
    font-size: 1.6rem;
    line-height: 1.375;
    display: -ms-grid;
    display: grid;
    padding: 0 1.75rem
}

.kidstuff p {
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    margin: .8rem;
    padding-bottom: .75em
}

.kidstuff p:before {
    display: block;
    float: left;
    font-family: "e17-symbols";
    vertical-align: middle;
    content: "";
    width: 6.4rem;
    margin: -.3rem 4rem .3rem .8rem;
    font-size: 6.4rem
}

.kidstuff p:nth-child(1):before {
    content: "\e910"
}

.kidstuff p:nth-child(2):before {
    content: "\e919"
}

.kidstuff.betrieb p:nth-child(3):before {
    content: "\ed49"
}

.kidstuff p:nth-child(3):before, .kidstuff.betrieb p:nth-child(2):before {
    content: "\e918"
}

.kidstuff p:nth-child(4):before {
    content: "\e91a"
}

.kidstuff p span {
    margin-right: 1.6rem;
    font-size: 4.5rem;
    padding-top: .6rem
}

.kidstuff p span.lower {
    font-size: inherit;
    padding-top: .6rem
}

.kidstuff p.ueberwacht, .kidstuff p.wea {
    -ms-grid-row: 1;
    grid-row: 1;
    -ms-grid-column: 1;
    grid-column: 1
}

.kidstuff p.wea span {
    display: block;
    float: left
}

.kidstuff p.py-power, .kidstuff p.load {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 1;
    grid-column: 1
}

.kidstuff p.mitarbeiter-service span:after {
    content: ""
}

.kidstuff p.load span:after {
    content: "\20MW"
}

.kidstuff p.erfahrung, .kidstuff p.powersystem {
    -ms-grid-row: 3;
    grid-row: 3;
    -ms-grid-column: 1;
    grid-column: 1
}

.kidstuff p.photovoltaik, .kidstuff p.prod {
    -ms-grid-row: 4;
    grid-column: 1;
}

.kidstuff p.prod span:after {
    content: "\20TWh"
}

@media only screen and (min-width: 1024px) {
    .aside__domainspec .kidstuff {
        font-size: 2.1rem
    }

    .kidstuff p {
        font-size: 1.375em;
        width: 376px;
        margin-right: 64px
    }

    .kidstuff p:before {
        width: 7rem;
        font-size: 8rem
    }

    .kidstuff p.ueberwacht, .kidstuff p.wea {
        -ms-grid-row: 1;
        grid-row: 1;
        -ms-grid-column: 1;
        grid-column: 1;
        margin-left: 0;
        margin-top: 0
    }

    .kidstuff p.py-power, .kidstuff p.load {
        -ms-grid-row: 2;
        grid-row: 2;
        -ms-grid-column: 1;
        grid-column: 1;
        margin-left: 0;
        margin-top: 0
    }

    .kidstuff p.erfahrung, .kidstuff p.powersystem {
        -ms-grid-row: 2;
        grid-row: 2;
        -ms-grid-column: 2;
        grid-column: 2;
        margin-right: 0;
        margin-bottom: 0
    }

    .kidstuff p.photovoltaik, .kidstuff p.prod {
        -ms-grid-row: 1;
        grid-row: 1;
        -ms-grid-column: 2;
        grid-column: 2;
        margin-right: 0;
        margin-bottom: 0
    }
}

div.main__eventlist {
    margin: 0;
    font-size: 1.6rem;
    line-height: 1.375;
    display: block;
    padding: 1rem 0
}

div.main__eventlist .event__entry, div.main__release-notes .release__note {
    font-size: 1.8rem !important;
    padding: 16px;
    border-color: var(--color-white);
    border-style: solid;
    border-bottom-width: 16px;
    background-color: var(--color-gray-bright);
    min-height: 120px;
    text-align: left;
    display: -ms-grid;
    display: grid
}

div.main__release-notes .release__note {
    padding: 24px
}

div.main__eventlist .event__entry {
    grid-template-areas:"date" "name" "details"
}

div.main__release-notes .release__note {
    grid-template-areas:"release" "details"
}

div.main__release-notes .release__note ol {
    line-height: 1.65
}

div.main__eventlist .event__entry .event__entry--name {
    font-size: 1.5em !important;
    margin: 0;
    -ms-grid-row: 1;
    -ms-grid-column: 2;
    grid-area: name
}

div.main__release-notes .release__note .release__note--release {
    color: var(--color-white);
    background-color: var(--color-blue-enertrag);
    font-size: 1.6em !important;
    padding: 8px 16px;
    margin: 0;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-area: release
}

div.main__eventlist .event__entry .event__entry--date {
    color: var(--color-white);
    background-color: var(--color-blue-enertrag);
    font-size: 1.6em !important;
    padding: 16px;
    text-align: center;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    grid-area: date
}

div.main__eventlist .event__entry .event__entry--details, div.main__release-notes .release__note .release__note--details {
    margin: 0;
    padding: 0
}

div.main__eventlist .event__entry .event__entry--details {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
    grid-area: details
}

div.main__release-notes .release__note .release__note--details {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    grid-area: details
}

div.main__eventlist .event__entry .event__entry--details p, div.main__release-notes .release__note .release__note--details p {
    margin: 8px 0 0;
    padding: 0
}

div.main__eventlist .event__entry .event__entry--details p a, div.main__release-notes .release__note .release__note--details p a {
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    display: inline-block;
    margin: 8px;
    padding: 8px;
    text-decoration: none
}

div.main__eventlist .event__entry .event__entry--details p a:before, div.main__release-notes .release__note .release__note--details p a:before {
    font-family: e17-symbols;
    font-size: inherit;
    color: inherit;
    background-color: inherit;
    margin-right: .5rem
}

div.main__eventlist .event__entry .event__entry--details p a[href^="javascript:linkTo_UnCryptMailto("]:before {
    content: "\e902"
}

div.main__eventlist .event__entry .event__entry--details p a[href^="tel:"]:before {
    content: "\ea1c"
}

div.main__release-notes .release__note .release__note--details p a:before {
    content: "\e906"
}

div.main__eventlist .event__entry .event__entry--details p a:hover, div.main__release-notes .release__note .release__note--details p a:hover {
    text-decoration: underline
}

[class^="accordion__element"] .accordion__header--image {
    max-height: 2.2rem;
    margin-right: .8rem;
    width: auto;
    margin-bottom: -2px
}

[class^="accordion__element"] .accordion__header--figure {
    display: inline-block;
    float: left;
    min-width: 65px
}

.project-site [class^="accordion__element"] h3 a {
    text-align: left !important
}

@media only screen and (min-width: 640px) {
    div.main__eventlist .event__entry {
        grid-template-areas:"date name name name" "date details details details"
    }

    div.main__eventlist .event__entry .event__entry--name {
        padding: 0 0 0 16px;
        width: 485px;
        -ms-grid-row: 1;
        -ms-grid-column: 2;
        -ms-grid-column-span: 3;
        grid-area: name
    }

    div.main__eventlist .event__entry .event__entry--date {
        height: 90px;
        width: 120px;
        text-align: center;
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        -ms-grid-column: 1;
        grid-area: date
    }

    div.main__eventlist .event__entry .event__entry--details {
        padding: 0 0 0 16px;
        width: 485px;
        -ms-grid-row: 2;
        -ms-grid-column: 2;
        -ms-grid-column-span: 3;
        grid-area: details
    }
}

.site-betrieb .main__intro ul, .project-site .main__intro ul {
    list-style: none
}

.site-betrieb .main__product ol {
    list-style-type: lower-alpha
}

.site-betrieb .main__product ol li:before {
    content: ""
}

.site-betrieb .main__intro li:before, .project-site .main__intro li:before {
    font-family: e17-symbols;
    font-size: inherit;
    color: var(--color-blue-enertrag);
    content: "\ed71\20"
}

@media only screen and (min-width: 640px) {
    .main__intro--illustrated figure {
        float: right;
        display: block;
        margin: 2.4rem 0;
        padding-left: 2.4rem
    }
}

em {
    font-family: inherit;
    font-style: normal;
    font-size: inherit;
    color: var(--color-blue-enertrag)
}

.aside__news .mediaelement iframe {
    height: 188px;
    min-width: 374px
}

.project-site.minisite .aside__news--single-view, .project-site .main__news + aside.aside__news {
    background-color: var(--color-gray-brighter);
    color: var(--color-blue-enertrag);
    width: 100%
}

@media only screen and (min-width: 1024px) {
    .project-site.minisite .aside__news--single-view, .project-site .main__news + aside.aside__news {
        width: calc(100% / 3)
    }
}

.project-site.minisite .aside__news--single-view section, .project-site .main__news + aside.aside__news h3, .project-site .main__news + aside.aside__news section {
    padding: 16px 0 0 24px
}

[class^="aside__goods--"] h1, [class^="aside__goods--"] h2 {
    display: none
}

.aside__goods--list-of-components {
    margin-bottom: .75em;
    padding-bottom: .75em;
    border-bottom: solid 1px var(--color-blue-enertrag)
}

.aside__goods--contact {
    margin-top: .75em;
    padding-top: .75em;
    border-top: solid 1px var(--color-blue-enertrag)
}

.site-betrieb aside > h3 {
    margin-bottom: .75rem
}

.aside__goods--contact h3 {
    margin-bottom: inherit
}

.aside__goods--contact p {
    margin-top: 0;
    margin-bottom: 0
}

.aside__goods--contact a[href^="javascript:linkTo_UnCryptMailto('"]:before {
    content: "\e902\0020";
    font-family: e17-symbols
}

.aside__goods--contact a:before {
    content: ""
}

.aside__goods--contact a span.phone:before {
    content: "\ea1c\0020";
    font-family: e17-symbols
}

section.contact a.tel[href$="1803973288"]:after, div.div__masthead--contact p a.tel[href$="1803973288"]:after, .aside__goods--contact a[href$="1803973288"] span.phone:after {
    content: " (9 Ct./Min.)"
}

.main__content--certificates-announces {
    background-color: var(--color-gray-brighter)
}

.main__content--certificates-announces div {
    text-align: center;
    display: flex;
    flex-direction: column;
    -webkit-hyphens: none;
    -ms-hyphens: none;
    hyphens: none
}

.main__content--certificates-announces div figure img {
    max-width: 208px;
    margin: 0 auto
}

.main__intro--company-details a, .main__content--certificates-announces div p a {
    white-space: nowrap;
    color: inherit;
    background: inherit;
    padding: 0;
    margin: 0;
    line-height: inherit;
    display: inline;
    text-decoration: inherit
}

.aside__news--company--details {
    margin-top: .75rem !important;
    width: calc(100% / 3);
    background-color: var(--color-blue-enertrag);
    color: var(--color-white);
    /*padding: 24px !important;*/
}

.aside__news--company--details section {
    padding: 0 24px
}

@media only screen and (min-width: 1024px) {
    .aside__news--company--details {
        width: calc(100% / 3) !important
    }
}

.aside__news--company--details h3 {
    color: inherit
}

.site-master .footer__map.footer__map--sites {
    background-image: none;
    height: auto;
}

.footer__map.footer__map--sites {
    padding-bottom: 1em;
}

.site-master .footer__map .container.map__container--site-list a, .site-master .footer__map .container.map__container--site-list h3, .site-master .footer__map .container.map__container--site-list h4,
.site-betrieb .footer__map .container.map__container--site-list a, .site-betrieb .footer__map .container.map__container--site-list h3, .site-betrieb .footer__map .container.map__container--site-list h4 {
    color: var(--color-white)
}

.site-betrieb .footer__map .container.map__container--site-list section {
    background-color: var(--color-white-translucent);
    padding: 16px;
    display: block
}

.site-master .footer__map .container.map__container--site-list section {
    background-color: transparent;
    padding: 16px;
    display: block;
    margin-bottom: 1em;
}

.site-master .footer__map .container.map__container--site-list section address a[href^="javascript:"]:before,
.site-betrieb .footer__map .container.map__container--site-list section address a[href^="javascript:"]:before {
    content: "\e902" !important;
    margin-right: .6em;
    font-family: e17-symbols
}

.site-master .footer__map .container.map__container--site-list section address a[href*="openstreetmap"]:before,
.site-betrieb .footer__map .container.map__container--site-list section address a[href*="openstreetmap"]:before {
    content: "\e906" !important;
    margin-right: .6em;
    font-family: e17-symbols
}

.site-master .footer__map .container.map__container--site-list section h4 .h4__span--firstName {
    display: none;
}

@media only screen and (min-width: 768px) {
    .site-master .footer__map .container.map__container--site-list h3,
    .site-betrieb .footer__map .container.map__container--site-list h3 {
        margin-left: 20%
    }

    .site-master .footer__map .container.map__container--site-list section,
    .site-betrieb .footer__map .container.map__container--site-list section {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: 74%;
        margin-bottom: 1em;
        margin-left: 20%
    }

    .site-betrieb .footer__map .container.map__container--site-list section h4 {
        margin: 0 24px 0 0;
        flex: 0 1 40%
    }

    .site-master .footer__map .container.map__container--site-list section h4 {
        margin: 0 24px 0 0;
        flex: 0 1 25%
    }

    .site-master .footer__map .container.map__container--site-list section address,
    .site-betrieb .footer__map .container.map__container--site-list section address {
        flex: 1 0 auto;
        display: block
    }

    .site-master .footer__map .container.map__container--site-list section address .address__organisation,
    .site-betrieb .footer__map .container.map__container--site-list section address .address__organisation {
        flex: 0 0 56%
    }

    .site-master .footer__map .container.map__container--site-list section address .address__phone-fax-email-map,
    .site-betrieb .footer__map .container.map__container--site-list section address .address__phone-fax-email-map {
        flex: 0 0 auto
    }
}

.site-betrieb .main__audience--content ul {
    list-style: none;
    text-indent: -1.5em;
    -ms-grid-row: 3;
    grid-row: 3;
    grid-column: span 3;
    -ms-grid-column-span: 3;
}

.site-betrieb .main__audience--content ol {
    -ms-grid-row: 2;
    grid-row: 2;
    grid-column: span 3;
    -ms-grid-column-span: 3
}

.site-betrieb .main__audience--content ul li {
    margin-bottom: .5em
}

.site-betrieb .main__audience--content ul li:before {
    font-family: e17-symbols;
    font-size: inherit;
    color: var(--color-blue-enertrag);
    content: "\ed71";
    margin-right: .5em
}

@media only screen and (min-width: 1116px) {
    .site-master .footer__map .container.map__container--site-list h3,
    .site-betrieb .footer__map .container.map__container--site-list h3 {
        margin-left: 20%
    }

    .site-master .footer__map .container.map__container--site-list section,
    .site-betrieb .footer__map .container.map__container--site-list section {
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        max-width: 74%;
        margin-left: 20%
    }

    .site-betrieb .footer__map .container.map__container--site-list section h4 {
        margin: 0 24px 0 0;
        flex: 0 1 40%
    }

    .site-master .footer__map .container.map__container--site-list section h4 {
        margin: 0 24px 0 0;
        flex: 0 1 25%
    }

    .site-master .footer__map .container.map__container--site-list section address,
    .site-betrieb .footer__map .container.map__container--site-list section address {
        flex: 1 0 auto;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start
    }

    .site-master .footer__map .container.map__container--site-list section address .address__organisation,
    .site-betrieb .footer__map .container.map__container--site-list section address .address__organisation {
        flex: 0 0 56%
    }

    .site-master .footer__map .container.map__container--site-list section address .address__phone-fax-email-map,
    .site-betrieb .footer__map .container.map__container--site-list section address .address__phone-fax-email-map {
        flex: 0 0 auto
    }
}

.news--newslist section iframe {
    width: 100%
}

.project-site.minisite .news--newslist section .p--text .a--more:before {
    content: "\e906" !important;
    margin: 0 0 0 .6em;
    font-family: e17-symbols
}

.site-betrieb .main__commercial--downloads {
    display: inline-block
}

.main__commercial--downloads .main__download--2cols {
    margin-right: 32px;
    float: left
}

em {
    font-style: normal
}

.site-betrieb .main__product.main__intro--company-details .main__commercial--downloads {
    color: var(--color-blue-enertrag);
    border: 1px solid;
    background-color: var(--color-gray-brighter);
    padding: 24px;
    display: block;
    margin: 1.6em 0;
    line-height: 1.5
}

.site-betrieb .main__product.main__intro--company-details .main__commercial--downloads .list__download a[href^="/fileadmin/"] span:before {
    font-family: e17-symbols !important;
    content: "\ec83\0020" !important
}

.site-betrieb .main__product.main__intro--company-details .main__commercial--downloads .list__download a[href^="/fileadmin/"] span:hover {
    text-decoration: underline
}

.site-betrieb .container a[href^="http"]:not(.button--blue),
.site-betrieb .container a[href^="//"]:not(.button--blue) {
    color: var(--color-blue-enertrag)
}

.site-betrieb main .container article a[href^="http"]:after, .site-betrieb main .container article a[href^="//"]:after {
    font-family: e17-symbols !important;
    content: "\eec9" !important;
    margin-right: -.3em
}

.main__commercial .main__news h1, .main__commercial .main__news p {
    text-align: left !important
}

.keyvisual.header__pip .header__pip--stoerer {
    position: absolute;
    top: 30%;
    left: 25%;
    width: calc(100vw / 2);
    z-index: 10;
    max-height: 82%;
    overflow: hidden
}

.main__news + .aside__news--press .contact {
    background: none !important;
    color: var(--color-black-translucent) !important;
    -webkit-hyphens: none;
    hyphens: none
}

.main__news + .aside__news-press .contact figure {
    float: none !important;
    display: block !important;
    clear: both !important;
    margin-bottom: 16px !important
}

.main__news + .aside__news--press .contact img {
    float: none !important;
    display: block !important;
    width: 50% !important;
    margin-left: 50% !important;
    transform: translateX(-50%) !important;
    border-radius: 50% !important;
    overflow: hidden !important
}

.main__news + .aside__news--press.aside__news .contact h3 {
    display: none
}

.main__news + .aside__news--press .contact address span {
    -webkit-hyphens: none;
    hyphens: none
}

.aside__news.aside__news--press section.contact.contact--no-before-content a h3 {
    text-align: center;
    margin: 0;
    transform: translateY(-50%);
    display: block;
    color: var(--color-blue-enertrag);
    width: auto;
    /*
  padding: 6px 0;
  background-color: var(--color-white-translucent)
*/
}

.aside__news.aside__news--press section.contact.contact--no-before-content a:before {
    content: "";
}

.container [class^="main__audience--switch"] a[href^="/fileadmin/Download"]:before {
    font-family: e17-symbols;
    margin-right: 0.8rem;
    content: "\ec83"
}

.main__remit--current table {
    margin: 32px 0;
    border: none;
    border-collapse: collapse;
    width: 90%;
    text-align: left;
    background-color: var(--color-white);
    color: var(--color-black)
}

.main__remit--current table tbody tr.tr__odd {
    background-color: var(--color-lightgray)
}

.main__remit--current table tbody tr:first-child td:first-child {
    visibility: hidden;
}

.main__remit--current table tbody td {
    padding: 4px 6px;
}

.main__remit--current table tbody td:last-child {
    border-left: 1px solid var(--color-gray);
    width: 66%
}


.main__remit--history table {
    font-size: 1.1rem;
}

@media only screen and (min-width: 1024px) {
    .main__remit--history table {
        font-size: 1.1rem;
    }
}

.main__remit--history [class*="accordion--wrapper"] .accordion__element--current .accordion__element--content {
    max-height: none;
}

.main__remit--history table {
    margin: 16px 0;
    border: none;
    border-collapse: collapse;
    text-align: center;
    background-color: var(--color-white);
    color: var(--color-black)
}

.main__remit--history table thead tr {
    background-color: var(--color-gray);
    font-weight: bold;
    color: var(--color-white)
}

.main__remit--history table tbody tr.tr__even {
    background-color: var(--color-lightgray)
}

.main__remit--history table th {
    padding: 2px 3px;
    width: 14%;
    border-right: 1px solid var(--color-white)
}

.main__remit--history table td {
    padding: 2px 3px;
    width: 14%;
    border-right: 1px solid var(--color-gray)
}

.main__remit--history table th:last-child,
.main__remit--history table td:last-child {
    border-right: none;
    width: 10%
}

.main__remit--history table th:first-child,
.main__remit--history table td:first-child {
    text-align: left;
    width: 17%
}

.main__remit--history table th:nth-child(5),
.main__remit--history table td:nth-child(5) {
    width: 17%
}


/* responsive tables */
div.scrollable {
    width: auto;
    overflow-x: auto;
    margin: 0;
    padding: 0
}


/* make scrollbar visible */
div.scrollable::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
}

div.scrollable::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 3px solid var(--color-white);
    background-color: rgba(0, 0, 0, .3);
}

.main__product .main__intro p a {
    display: inline !important;
    background-color: var(--color-white) !important;
    color: var(--color-darkblue) !important;
    text-decoration: underline !important;
    padding: inherit !important;
    margin: inherit !important;
    line-height: inherit !important;
}

.e17.graffiti.project-site .li__formwrapper--search,
.e17.graffiti.project-site.minisite.buergerenergieprojekt .main .main__product ~ aside,
.e17.graffiti.project-site.minisite.buergerenergieprojekt .aside__news,
    /* .e17.graffiti.project-site.minisite.buergerenergieprojekt .header__service .container,*/
.e17.graffiti.project-site.minisite.buergerenergieprojekt .main .main__product ~ aside,
.e17.graffiti.project-site.minisite.buergerenergieprojekt .header__service .container [class^="header__service--"] li:last-child {
    display: none;
}

.e17.graffiti.project-site.minisite.buergerenergieprojekt main aside,
.e17.graffiti.project-site.minisite.buergerenergieprojekt main aside {
    background-color: var(--color-lightblue) !important;
    display: block;
}

@media (min-width: 1024px), all {
    .e17.graffiti.project-site.minisite.buergerenergieprojekt footer nav.sitemap ul,
    .e17.graffiti.project-site.minisite.buergerenergieprojekt footer nav.sitemap ul {
        display: flex;
        flex-direction: column;
    }

    .e17.graffiti.project-site.minisite.buergerenergieprojekt footer nav.sitemap .level_1 > li.single ~ li.single,
    .e17.graffiti.project-site.minisite.buergerenergieprojekt footer nav.sitemap .level_1 > li.single ~ li,
    .e17.graffiti.project-site.minisite.buergerenergieprojekt footer nav.sitemap .level_1 > li.single ~ li.single,
    .e17.graffiti.project-site.minisite.buergerenergieprojekt footer nav.sitemap .level_1 > li.single ~ li {
        margin-top: 0.5rem;
        margin-left: 0;
    }
}

.main aside a, main aside a {
    display: flex;
}

html {
    font-variant-numeric: tabular-nums;
}


/* for live load view */

.main__load {
    padding: 12px;
}

.main__load ul {
    list-style: none;
}

.main__list--load-live ul li {
    hyphens: auto;
    white-space: nowrap;
}

.text-align-right {
    text-align: right;
}

.loadpoint.colorcode__none:before {
    color: var(--color-load-none)
}

.loadpoint.colorcode__10:before {
    color: var(--color-load-10)
}

.loadpoint.colorcode__9:before {
    color: var(--color-load-9)
}

.loadpoint.colorcode__8:before {
    color: var(--color-load-8)
}

.loadpoint.colorcode__7:before {
    color: var(--color-load-7)
}

.loadpoint.colorcode__6:before {
    color: var(--color-load-6)
}

.loadpoint.colorcode__5:before {
    color: var(--color-load-5)
}

.loadpoint.colorcode__4:before {
    color: var(--color-load-4)
}

.loadpoint.colorcode__3:before {
    color: var(--color-load-3)
}

.loadpoint.colorcode__2:before {
    color: var(--color-load-2)
}

.loadpoint.colorcode__1:before {
    color: var(--color-load-1)
}

.loadpoint.colorcode__0:before {
    color: var(--color-load-0)
}

.main__load h3 span.h3--thinner small {
    font-size: 70%;
    font-variant: small-caps
}

.main__load .legende,
.main__load--wind-parc {
    column-width: calc(100% - 32px);
    column-gap: 32px;
    column-count: 1;
    column-rule: none;
}

.main__load .legende li {
    padding-left: 1.5rem;
}

.main__load--wind-parc h3 {
    column-span: 3;
}

.main__list--load-live {
    border-top: 1px solid var(--color-black-translucent);
    margin-top: 2rem;
    padding-top: 1.3rem;
}

@media only screen and (min-width: 640px) {
    .main__load {
        padding: 32px;
    }

    .main__load .legende,
    .main__load--wind-parc {
        column-width: calc(50% - 16px);
        column-gap: 32px;
        column-count: 2;
        column-rule: 1px solid var(--color-black-translucent);
    }

    .main__load--wind-parc h3 {
        column-span: 2;
    }
}

@media only screen and (min-width: 1024px) {
    .main__load .legende,
    .main__load--wind-parc {
        column-width: calc(33% - 16px);
        column-gap: 32px;
        column-count: 3;
        column-rule: 1px solid var(--color-black-translucent);
    }

    .main__load--wind-parc h3 {
        column-span: 3;
    }
}

.loadpoints {
    list-style: none;
    padding-left: 1.5rem;
}

.main__load--wind-parc ul.loadpoints li {
    text-indent: 1.2rem;
    list-style: none;
    line-height: 1.33;
    margin: 0.3rem;
    padding: 0.3rem;
    width: auto;
    height: auto;
}

.main__load li.loadpoint:before,
.main__load td.loadpoint:before,
.main__load--wind-parc ul.loadpoints li:before {
    margin-right: 1rem;
    margin-left: -2rem;
}


/* Styles fuer www */
.domain-www-enertrag-com .footer__map .container.map__container--site-list a,
.domain-www-enertrag-com .footer__map .container.map__container--site-list h3,
.domain-www-enertrag-com .footer__map .container.map__container--site-list h4 {
    color: var(--color-white-permanent);
}

/* Styles fuer Windwaerme */
.windwaerme .main__enterprise--credo.div__accordion--fullsize section {
    width: 100%;
}

.windwaerme .main__enterprise--credo.div__accordion--fullsize section .accordion__element--content figure {
    width: 100%;
    padding: 0;
}

.windwaerme .main__product [class^="accordion__element"] p a {
    display: inline !important;
    background-color: var(--color-white) !important;
    color: var(--color-darkblue) !important;
    text-decoration: underline !important;
    padding: inherit !important;
    margin: inherit !important;
    line-height: inherit !important;
}

.windwaerme .main__enterprise--story figcaption {
    text-align: left;
}

.windwaerme .main__enterprise--story {
    display: block;
}

.windwaerme .main__enterprise--story div:nth-child(3) {
    margin-top: 4rem;
}

@media screen and (min-width: 1024px) {
    .windwaerme .main__enterprise--story div:nth-child(2) {
        text-align: left;
        max-width: 63%;
    }

    .windwaerme .main__enterprise--story div:nth-child(3) {
        max-width: 33%;
        margin-left: 66%;
        margin-top: -336px;
        margin-bottom: -72px
    }
}

.windwaerme .main__enterprise--credo .accordion__element--content p {
    margin: 1rem 0 0 0;
    margin-block-start: 1em;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}


/* Energiezins.css */
/*.domain-energiezins-enertrag-com*/

.domain-energiezins-enertrag-com ul.header__service--id-651 li:nth-last-child(2):before {
    margin-right: 0.6rem;
    content: "\e902"
}

.domain-energiezins-enertrag-com ul.header__service--id-651 li:nth-last-child(1),
.domain-energiezins-enertrag-com ul.sitemap.level_1 li form {
    display: none;
}

.domain-energiezins-enertrag-com ul.mainnav.level_1,
.domain-energiezins-enertrag-com ul.sitemap.level_1 li#m-open-654 {
    visibility: hidden;
    height: 1px;
}


/* Invest.css */
/*.domain-invest-enertrag-com*/

/*.domain-invest-enertrag-com .header__cookie-info{
  bottom:50%;
  left:0;
  width:100%;
  min-height:30%;
  z-index:10000;
  transform:translateY(50%)
}
.domain-invest-enertrag-com .header__cookie-info .container div {
  min-height:100%;
  position:relative;
  bottom:50%;
  transform:translateY(50%)
}*/
.domain-invest-enertrag-com .aside__commercial.aside__commercial--mobile {
    color: var(--color-blue-enertrag);
    display: block;
}

.domain-invest-enertrag-com .aside__commercial.aside__commercial--desktop {
    display: none !important;
}

@media only screen and (min-width: 1024px) {
    .domain-invest-enertrag-com .aside__commercial.aside__commercial--mobile {
        display: none !important;
    }

    .domain-invest-enertrag-com .aside__commercial.aside__commercial--desktop {
        display: block !important;
    }
}


/* Projects.css */
/*.domain-projekte-enertrag-com*/

.domain-projekte-enertrag-com .aside__domainspec {
    border-top: none
}

.domain-projekte-enertrag-com .aside--domainspec {
    background-color: var(--color-blue-enertrag)
}

.domain-projekte-enertrag-com .header__vitrine {
    max-height: 550px;
    height: calc(100vw * 550 / 2560)
}

@media only screen and (min-width: 1024px) {
    .domain-projekte-enertrag-com nav.sitemap .level_1 > li {
        width: 23%
    }

    .domain-projekte-enertrag-com li#m-open-262,
    .domain-projekte-enertrag-com li#m-open-263 {
        margin-left: -23%
    }

    .domain-projekte-enertrag-com li#m-open-263 {
        margin-top: 25px
    }

    .domain-projekte-enertrag-com li#m-open-262 {
        margin-top: 50px
    }
}

.domain-enertrag-com .main aside .aside__extra-content,
.domain-projekte-enertrag-com .main aside .aside__extra-content {
    max-height: 45em;
    overflow-y: auto;
    margin-left: -1.2em;
    margin-right: -1.2em;
    padding: 0 1.2em;
}

.domain-enertrag-com .main aside .aside__extra-content + div,
.domain-projekte-enertrag-com .main aside .aside__extra-content + div {
    border-top: solid 1px var(--color-blue-enertrag);
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list .a--more,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list .a--more {
    display: inline-block;
    text-decoration: underline;
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list .a--more:before,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list .a--more:before {
    display: none;
}

/* optional */
.domain-enertrag-com .main aside .aside__extra-content .news__nav--list a:before,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list a:before {
    display: none;
}

/* end optional */

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list h4,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list h4 {
    line-height: 1.4;
    display: inline-block;
    margin: .5em 0;
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list figure,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list figure {
    float: left;
    margin-right: 1em;
    display: none;
}

@media (min-width: 1024px) {
    .domain-enertrag-com .main aside .aside__extra-content .news__nav--list figure,
    .domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list figure {
        display: block;
    }
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list .p--text,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list .p--text {
    line-height: 1.3;
    margin: 0 0 1em 0;
    clear: right;
    font-size: 1.4rem !important;
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list .news__nav--item,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list .news__nav--item {
    display: block;
    clear: both;
    border-bottom: 1px solid var(--color-gray-medium-permanent);
    padding-bottom: .5em;
    margin-bottom: .5em;
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list .news__nav--item > div,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list .news__nav--item > div {
    display: table;
    clear: both;
}

.domain-projekte-enertrag-com .main aside {
    display: block;
}

.domain-enertrag-com .main aside .aside__extra-content .news__nav--list .news__nav--item:last-child,
.domain-projekte-enertrag-com .main aside .aside__extra-content .news__nav--list .news__nav--item:last-child {
    border-bottom: none;
}

.domain-enertrag-com .main__audience .main__audience--intro .news--related .news--back,
.domain-projekte-enertrag-com .main__audience .main__audience--intro .news--related .news--back {
    display: none;
}


.domain-projekte-enertrag-com .accordion__content--figure {
    display: none;
}

@media (min-width: 600px) {
    .domain-projekte-enertrag-com .accordion__content--figure {
        display: block;
        margin: 1em 0 1em 1em;
        float: right;
        max-width: 300px;
    }
}

/*
.domain-projekte-enertrag-com .header__service ul li:nth-last-child(4):before {
    content: "\e902"
}

.domain-projekte-enertrag-com .header__service ul li:nth-last-child(3):before {
    content: "\e903"
}
*/


/* Service.css */
/*.domain-service-enertrag-com*/


.domain-service-enertrag-com .aside__domainspec {
    border-top: none
}

.domain-service-enertrag-com .aside--domainspec {
    background-color: var(--color-white)
}

.domain-service-enertrag-com aside.aside--domainspec div.aside__domainspec figure img {
    min-width: 100%;
}

.domain-service-enertrag-com .header__vitrine {
    max-height: 650px;
    height: calc(100vw * 650 / 2560)
}

@media only screen and (min-width: 1024px) {
    .domain-service-enertrag-com nav.sitemap .level_1 > li {
        width: 23%
    }

    .domain-service-enertrag-com li#m-open-262,
    .domain-service-enertrag-com li#m-open-263 {
        margin-left: -23%
    }

    .domain-service-enertrag-com li#m-open-263 {
        margin-top: 25px
    }

    .domain-service-enertrag-com li#m-open-262 {
        margin-top: 50px
    }
}


/* Windstrom.css */
/*.domain-betrieb-enertrag-com*/


.domain-betrieb-enertrag-com .graffiti .aside__news .tweets>div>a {
    color:var(--color-white)!important
}

.domain-betrieb-enertrag-com .aside__domainspec {
    border-top:none
}

.domain-betrieb-enertrag-com .aside--domainspec {
    background-color:var(--color-blue-enertrag)
}

.domain-betrieb-enertrag-com .main .container h2 {
    font-size: var(--fontsize-h2-rem) !important;
    line-height: var(--fontsize-h2-rem) !important
}

.domain-enertrag-com footer div.container--globlal-certs,
.domain-betrieb-enertrag-com footer div.container--globlal-certs {
    padding: 1em 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
}

.domain-enertrag-com footer div.container--globlal-certs figure,
.domain-betrieb-enertrag-com footer div.container--globlal-certs figure {
    width: 200px;
    height: auto;
    margin: 1em;
}

.domain-enertrag-com footer div.container--globlal-certs a,
.domain-betrieb-enertrag-com footer div.container--globlal-certs a {
    display: block;
}

.domain-enertrag-com footer div.container--globlal-certs figure figcaption,
.domain-betrieb-enertrag-com footer div.container--globlal-certs figure figcaption {
    margin-top: 0.5em;
    text-align: center;
}

.domain-betrieb-enertrag-com .main .container article .scrollable > table.contenttable td,
.domain-betrieb-enertrag-com .main .container article .scrollable > table.contenttable th {
    text-align: left;
    border: 1px solid transparent;
    border-collapse: collapse;
    color: var(--color-black-permanent) !important;
}
.domain-betrieb-enertrag-com .main .container article .scrollable > table.contenttable thead {
    background-color: var(--color-darkblue);
    color: var(--color-white)
}
.domain-betrieb-enertrag-com .main .container article .scrollable > table.contenttable thead th {
    font-weight: 400 !important;
    font-family: "Daxline bold",sans-serif !important
}
.domain-betrieb-enertrag-com .main .container article .scrollable > table.contenttable tbody {
    background-color: var(--color-lightblue);
    color: var(--color-black)
}
.domain-betrieb-enertrag-com .main .container article .scrollable > table.contenttable tbody td ul {
    padding: 0 0 0 calc(1vw + 1.5rem);
    margin: 0
}

/* 1.2em erzwungen bei Zwillingen des Nachfolgers (ich vermute mal, dass das so funktioniert) */
.domain-betrieb-enertrag-com .main__product + aside ~ .aside__news--company--details {
    padding: 0 1.2em !important
}

/* die die 24px Padding weggenommen */
.domain-betrieb-enertrag-com .aside__news--company--details section {
    padding:0
}


/* extra Content for sidebar */
.domain-betrieb-enertrag-com aside div.aside__extra-content {
    background-color: hsla(201,0%,100%,1);
    padding: 0 2.4rem 2.4rem 2.4rem;
    margin: -24px -24px 16px -24px;
    border-bottom: 3.2rem;
    border-bottom: 32px;
}

.domain-betrieb-enertrag-com aside div.aside__extra-content blockquote {
    color: hsla(201,0%,20%,1);
}
.domain-betrieb-enertrag-com aside div.aside__extra-content blockquote em {
    display: block;
    margin-top: 5px;
    margin-top: 0.5rem;
}

.domain-betrieb-enertrag-com .footer__map .container.map__container--site-list a,
.domain-betrieb-enertrag-com .footer__map .container.map__container--site-list h3,
.domain-betrieb-enertrag-com .footer__map .container.map__container--site-list h4 {
    color: var(--color-white-permanent);
}


@media only screen and (min-width:1024px) {
  .domain-betrieb-enertrag-com nav.sitemap .level_1>li {
      width:23%
  }

  .domain-betrieb-enertrag-com li#m-open-262,li#m-open-263 {
      margin-left: -23%
  }

  .domain-betrieb-enertrag-com li#m-open-263 {
      margin-top: 25px
  }

  .domain-betrieb-enertrag-com li#m-open-262 {
      margin-top:50px
  }

  .domain-betrieb-enertrag-com [class^="main__enterprise--"] {
      padding: 20px 0
  }

  /* extra Content for sidebar */
  .domain-betrieb-enertrag-com aside div.aside__extra-content {
      padding: 0 2.4rem 6rem 2.4rem;
  }
}


#darkmodeSwitch {
    display: none;
}

/*
a:empty,div:empty,p:empty,
h1:empty,
h2:empty,
h3:empty,
h4:empty,
h5:empty,
h6:empty {
  display: none;
}*/


/* image_zoom */
[id^="image-zoom-in"] {
    text-decoration: none;
    position: relative;
    display: block;
    color: white;
}

[id^="image-zoom-in"]:before {
    position: absolute;
    top: 0;
    right: 0;
    padding: .6em;
    transition: transform 200ms ease, color 200ms ease;
    will-change: transform;
    transform-origin: center center;
    background-color: var(--color-blue-enertrag-permanent);;
    border-radius: 50%;
    margin-top: .3em;
    margin-right: .3em;
    font-size: .9em;
}

[id^="image-zoom-in"]:hover {
    color: var(--color-blue-alternative);
}

[id^="image-zoom-in"]:hover:before {
    transform: scale(1.1);
}

[id^="image-zoom-in"]:after {
    display: none !important;
}

[id^="image-zoom-in"]:target + div {
    display: flex;
}

[id^="image-zoom-in"] + div {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: var(--color-white-translucent);
    align-items: center;
    justify-content: center;
    z-index: 200;
}

[id^="image-zoom-in"] + div img {
    max-width: 95vw;
    max-height: 80vh;
    height: auto;
    width: auto;
}

[id^="image-zoom-in"] + div a {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 1.5em;
    text-decoration: none;
    transition: transform 200ms ease, color 200ms ease;
    will-change: transform;
    transform-origin: center center;
    border-radius: 50%;
    background: var(--color-blue-enertrag-permanent);
    color: white;
    display: block;
    line-height: 0;
    padding: .6em;
    margin: 2em;
}

[id^="image-zoom-in"] + div a:hover {
    color: var(--color-blue-alternative);
    transform: scale(0.9);
}

[id^="image-zoom-in"] + div a:after {
    display: none !important;
    text-decoration: none;
}

.ce-gallery figcaption {
    font-size: 14px;
    line-height: 18px;
    background-color: var(--color-gray-bright);
    padding: 15px
}
