main, header {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
img {
    border-radius: 2px;
}
main {
    padding-top: 0;
}
.Page {
    width: 100%;
}
.HeaderLead {
    height: max(0px, calc(50vh - 4rem));
    pointer-events: none;
}
header.InnerHeader {
    position: sticky;
    top: 0;
    z-index: 10;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--vertical-space-1) 0;
    background-color: #fff;
}
.HeaderSpacer {
    height: 52vh;
    pointer-events: none;
}
header.InnerHeader .Subtitle {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.InnerHeader .Title-link,
.InnerHeader .Title-link .SubtitleChar {
    font-family: var(--font-family-text);
    font-weight: 100;
    line-height: var(--line-height-1);
    font-size: var(--font-size-header-title);
}
.InnerHeader .Subtitle-link,
.InnerHeader .Subtitle-link .SubtitleChar {
    font-family: var(--font-family-subtitle);
    font-weight: 100;
    font-style: italic;
    line-height: var(--line-height-1);
    font-size: var(--font-size-header-subtitle);
}
.Subtitle-link-container {
    margin-top: -4px;
}

.InformationItemHeader {
    text-align: center;
    scroll-margin-top: 4rem;
}
.ImageContainer {
    display: grid;
    grid-template-columns: repeat(4, 1fr)
}
.InformationItem, .TextContainer {
    font-size: var(--font-size-0);
    width: 670px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}
.InformationItem button {
    text-align: center;
}
.InformationItem.is-open,
.InformationDescription,
.TextContainer,
.InformationZitatBlock
{
    padding-bottom: 120px;

}

.TextContainer {
    margin-top: 15px;
}

.InformationText,
.TextContainer,
.InformationDescriptionText {
    font-family: var(--font-family-text);
    font-weight: 100;
    font-size: var(--font-size-0);
    line-height: calc(var(--font-size-0) * 1.2);
}
.InformationText {
    margin: 1px 0;
    margin-bottom: 6px;
    margin-top: 20px;
}
.InformationText em {
    display: block;

    font-weight: 100;
    font-style: italic;
    text-align: center;
}
.InformationText a {
    text-decoration: none;
    cursor: pointer;
}
.InformationText a:hover .SubtitleChar {
    animation: none;
    color: var(--hover-color);
}
.InformationZitatBlock {
    display: grid;
    grid-template-columns: 46vw 1fr;

    align-items: center;
    padding-left: 50px;
    padding-right: 100px;
}

.InformationZitatBlock img{
 width: 70%;
 display: block;
 margin: auto;
}
.InformationZitat,
.InformationZitat * {
    font-family: var(--font-family-subtitle);
    font-weight: 100;
    font-style: italic;
    font-size: var(--font-size-zitat);
    line-height: calc(var(--font-size-zitat) * 1.2);
}
.InformationImage, .InformationTopImage, .InformationText img {
    display: flex;
    justify-content: center;
    padding: 10px 90px;
}
.InformationItem img {
    display: block;
    margin: auto;
}

.InformationDescriptionText {
    width: 670px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.InformationTopImage {
    margin: auto;
    display: block;
}
.Title {
    text-align: center;

}
main nav a,
header a,
.InformationBlock .InformationItem .ff-3 {
    color: var(--link-color);
}

header a.Title-link:hover,
header a.Title-link:hover .SubtitleChar {
    color: var(--color-1);
}
header a.Subtitle-link:hover,
header a.Subtitle-link:hover .SubtitleChar {
    animation: none;
    color: var(--target-color);
    cursor: pointer;
}
button.Title:hover,
h2.Title:hover,
main nav a:hover {
    cursor: pointer;
}
button.Title:hover .SubtitleChar,
h2.Title:hover .SubtitleChar,
main nav a:hover .SubtitleChar {
    animation: none;
    color: var(--hover-color);
}
nav {
    margin-bottom: 15px;
}
.SubtitleChar {
    color: white;
    animation: subtitle-color-in var(--duration) var(--ease) forwards;
    animation-delay: var(--delay);
}
@keyframes subtitle-color-in {
    to {
        color: var(--target-color);
    }
}
@media (prefers-reduced-motion: reduce) {
    .SubtitleChar {
        animation: none;
        color: var(--target-color);
    }
}


@media only screen and (max-width: 1100px) {
    .InformationZitatBlock {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 30px;
        align-items: center;
        padding-left: 30px;
        padding-right: 30px;
    }
    .InformationZitat {
        width: 670px;
        display: block;
        margin: auto;
    }
}

@media only screen and (max-width: 800px) {
    .InformationItem, .TextContainer, .InformationDescriptionText {
        width: auto;
        padding-left: 18px;
        padding-right: 18px;
    }
    .InformationImage {
        padding: 10px 60px;
    }
    .InformationItem.is-open,
    .InformationDescription,
    .TextContainer {
        padding-bottom: 80px;
  
    }
    .InformationZitat {
        width: auto;
        display: block;
        margin: auto;
    }
}