body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
@font-face {
	font-family: "Lora";
	font-weight: 300;
	src: url('../../files/font/Lora-Regular.ttf') format("truetype");
}

@font-face {
	font-family: "Lora";
	font-weight: 500;
	src: url('../../files/font/Lora-SemiBold.ttf') format("truetype");
}

@font-face {
	font-family: "Lora";
	font-weight: 700;
	src: url('../../files/font/Lora-Bold.ttf') format("truetype");
}

@font-face {
	font-family: "Roca";
	font-weight: 700;
	src: url('../../files/font/RocaOne-Bl.ttf') format("truetype");
}

@font-face {
	font-family: "Montserrat";
	font-weight: 700;
	src: url('../../files/font/Montserrat-ExtraBold.ttf') format("truetype");
}

@font-face {
	font-family: "Montserrat";
	font-weight: 300;
	src: url('../../files/font/Montserrat-Regular.ttf') format("truetype");
}

:root {
    --main-color: #f57aab;
    --main-color-shade: #ff80b2;
    --accent-text-color: #e2ff70;
    --secondary-color: #f6ce83;
    --secondary-color-shade: #ffd587;
    --gray-dark-shade: #d6d3d1;
    --gray-light-shade: #f5f5f4;
    --background: #F5D0DF;
    --background-shade: #e5b8ca;
  }

body{
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.75em;
    background-color: var(--gray-light-shade);
    color:#2e2d2c;
}

a{
    color:#2e2d2c;
    transition: color 0.15s ease-in-out;
}

a:hover{
    color:var(--secondary-color);
}

p{
    margin: 20px 0;
}

h1{
    font-size: 48px;
    line-height: 1.2em;
    margin: 20px 0;
    font-family: "Roca", sans-serif;
}

h2{
    font-size: 36px;
    line-height: 1.2em;
    margin: 20px 0;
    font-family: "Roca", sans-serif;
}

h3{
    font-size: 28px;
    line-height: 1.2em;
    margin: 20px 0;
    font-family: "Roca", sans-serif;
}

/* Header and Navigation */

header{
    position: fixed;
    display: flex;
    width: 100%;
    z-index: 100;
}

header .inside{
    max-width: 1280px;
    margin: 20px auto 0 auto;
    border-radius: 40px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background-color: rgba(255, 255, 255, 0.35);
    box-shadow: rgba(0, 0, 0, 0.025) 0px 10px 15px -3px, rgba(0, 0, 0, 0.0125) 0px 4px 6px -2px;
}

#logo{
    font-weight: 700;
    text-decoration: none;
    padding: 30px 20px;
    color:#000;
}

#hamburger {
    display: none;
}

.mod_navigation{
    padding: 10px;
}

.mod_navigation ul {
    display:inline;
    padding: 0px;
}

.mod_navigation ul li {
    display:inline-block;
}

.mod_navigation ul li a, .mod_navigation ul li .active {
    display: inline-block;
    position: relative;
    text-decoration: none;
    color: #000;
    padding: 15px 20px;
    transition: background 0.25s ease-in-out;
    background-color: rgba(255, 255, 255, 0);
    font-weight: 700;
    border-radius: 30px;
    text-transform: uppercase;
}

.mod_navigation a:hover {
    background-color: rgba(255, 255, 255, 0.35);
}

.mod_navigation ul li .active, .mod_navigation ul li.trail a {
    background-color: rgba(255, 255, 255, 0.35);
}

.mod_navigation ul li.trail a::after{
    display: none;
}

/* Buttons */

.primary-button{
    background-color: var(--secondary-color);
    color: var(--accent-text-color);
    padding: 13px 20px 13px 20px;
    border-radius: 30px;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
    box-sizing: border-box;
    transition: all 0.15s ease-in-out;
    position: relative;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}

.primary-button:hover{
    background-color: var(--secondary-color-shade);
    color: var(--accent-text-color);
}

.secondary-button{
    color: #2e2d2c;
    padding: 15px 20px;
    box-sizing: border-box;
    border-radius: 30px;
    border:transparent solid 2px;
    font-weight: 500;
    text-decoration: none;
    display: inline-block;
    transition: all 0.15s ease-in-out;
    position: relative;
}

.secondary-button::after{
    position: absolute;
    left: -2px;
    top: -2px;
    box-sizing: border-box;
    content: '';
    display: inline-block;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    border-radius: 30px;
    border:#2e2d2c solid 1px;
}

.secondary-button:hover{
    border-color: #2e2d2c;
    color: #2e2d2c;
}

.primary-button + .secondary-button, .secondary-button + .primary-button,
.primary-button + .primary-button, .secondary-button + .secondary-button{
    margin-left: 10px;
}

.primary-button i, .secondary-button i, .primary-button em, .secondary-button em{
    display: inline-block;
    width: 28px;
    padding-right: 10px;
    padding-left: 2px;
    text-align: center;
    position: relative;
    top: 0px;
}

/* Content */

main {
    max-width: 100vw;
    overflow: hidden;
}

main .inside{
    width:calc(100% - 40px);
    margin: 0 auto;
    padding: 0px 20px 0 20px;
    overflow: visible;
}

.mod_article:first-of-type:not(#hero, #bottom){
    padding-top: 120px;
}

.mod_article{
    overflow: visible !important;
}

.content-headline {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
}

.content-text:not(#hero .content-text, #bottom .content-text, .section) {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 160px;
}

.content-text:not(#hero .content-text, #bottom .content-text) .rte {
    width: 100%;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

.content-text.media {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 80px;
}

.content-text.media.media--right {
    flex-direction: row-reverse;
}

.content-text.media > figure, 
.content-text.media > div {
    width: 50%;
    max-width: 600px !important;
    margin: 0 !important;
}

.content-text.media img {
    border-radius: 40px;
    /*aspect-ratio: 1 / 1;*/
    object-fit: cover;
}

.content-text.center .rte {
    text-align: center;
}

.ce_text p + h1,
.ce_text p + h2,
.ce_text p + h3 {
    margin: 40px 0 20px 0;
}

.mod_article:first-of-type:not(#hero, #bottom) > .content-text:first-of-type:not(.media) .rte {
    padding-top: 100px;
}

.section {
    background-color: var(--secondary-color);
    padding: 160px 0px 160px 0px;
    margin-bottom: 160px;
    width: calc(100% + 40px);
    margin-left: -20px;
}

/* Hero */

#hero {
    position: relative;
    height:100svh;
    max-height: 2160px;
    max-width: 100vw;
    display: block;
    margin-bottom: 160px;
    overflow: hidden;
}

#bottom {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    margin: 0;
    height: 100svh;
}

#hero > div,
#bottom > div {
    position: absolute;
    top: 0;
    padding: 0;
    margin: 0;
}

#hero > div.center,
#bottom > div.center {
    left: 0%;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    width: 100%;
}

#hero > div.center p,
#bottom > div.center p {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

#hero > div.center.stoerer,
#bottom > div.center.stoerer {
    top: 75%;
}

#hero > div.center p.stoerer,
#bottom > div.center p.stoerer {
    background-color: var(--secondary-color);
    color: var(--accent-text-color);
    padding: 13px 20px 13px 20px;
    font-weight: 700;
    display: inline-block;
    box-sizing: border-box;
    position: absolute;
    left: -10vw;
    width: 120vw;
    white-space: nowrap;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    transform: rotate(4deg);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    text-align: center;
}

#hero > div.center p.stoerer:nth-child(1),
#bottom > div.center p.stoerer:nth-child(1) {
    transform: rotate(-4deg);
}


#hero > div.bottom-left,
#bottom > div.bottom-left {
    left: 0%;
    bottom: 0%;
    width: 50%;
}

#hero > div.bottom-right,
#bottom > div.bottom-right {
    right: 0%;
    bottom: 0%;
    text-align: right;
    width: 50%;
}

#hero > .content-image,
#bottom > .content-image {
    left: -20px;
    width: calc(100% + 40px);
    height: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

#bottom > .content-image.background {
}

#hero > .content-image figure,
#bottom > .content-image figure {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
    position: relative;
}

#hero > .content-image img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: cover;
    object-position: bottom;
}

#bottom > .content-image img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
    position: absolute;
    left: 0;
    top: 0;
    object-fit: contain;
    object-position: bottom;
}

#hero h1,
#bottom h1 {
    font-size: 125px;
    line-height: 90px;
    color: #FFFFFF;
}

.animate-right {
    animation-name: animate-right;
    animation-duration: 60s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.animate-right.slower {
    animation-duration: 65s;
}

.animate-right.faster {
    animation-duration: 55s;
}

@keyframes animate-right {
    0% {
        transform: translateX(0%);
        opacity: 1;
    }
    49% {
        transform: translateX(100%);
        opacity: 1;
    }
    49.5% {
        transform: translateX(100%);
        opacity: 0;
    }
    50% {
        transform: translateX(-100%);
        opacity: 0;
    }
    50.5% {
        transform: translateX(-100%);
        opacity: 1;
    }
    100% {
        transform: translateX(0%);
        opacity: 1;
    }
  }


/* Headings */

h1.content-headline{
    margin-top:30px;
    margin-bottom: 80px;
}

/* Newslist */

.mod_newslist{
    overflow: visible;
    margin: 0 auto 160px auto;
    max-width: 1280px;
}

.mod_newslist h2{
    margin-top: 0px;
    margin-bottom: 35px;
}

.mod_newslist .articles{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.mod_newslist .more{
    margin-top: 40px;
    margin-bottom: 0px;
    text-align: right;
}

.layout_latest{
    background-color: #fff;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    transition: all 0.15s ease-in-out;
    cursor: pointer;
    padding-bottom: 5px;
    position: relative;
}

.layout_latest:hover{
    box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 30px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    transform: scale(1.01);
}

.layout_latest .image_container {
    height: 200px;
}

.layout_latest .image_container img {
    object-fit: cover;
    height: 100%;
}

.layout_latest h3 {
    padding: 0 20px;
}

.layout_latest p.info {
    color: var(--gray-dark-shade);
    font-size: 0.8em;
    font-weight: 400;
    margin: 20px 0px 0px 0px;
    padding: 0 20px;
}

.layout_latest .more a {
    font-size: 48px;
    padding: 20px;
    position: absolute;
    right: 0;
    bottom: 0;
    color: rgb(245 245 244);
    transition: all 0.15s ease-in-out;
}

.layout_latest:hover .more a{
    transform: scale(1.1);
    color: var(--secondary-color);
}

.layout_latest a{
    color: #2e2d2c;
    text-decoration: none;
}

.layout_latest .medium{
    margin: 8px 20px;
    padding: 5px 15px;
    background-color: var(--accent-text-color);
    border-radius: 20px;
    font-weight: 700;
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.8em;
    line-height: 1.2em;
}

/* Article */

.mod_newsreader {
    overflow: visible;
}

.layout_full {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 80px;
    overflow: visible;
}

.layout_full h1{
    margin: 0 0 40px 0;
}

.layout_full .medium{
    margin: -5px 0 -10px -2px;
    position: relative;
    z-index: 5;
}

.layout_full .medium.primary-button{
    background-color: var(--secondary-color);
    color: #2e2d2c;
    padding: 17px 20px;
    border-radius: 30px;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
    box-sizing: border-box;
    transition: all 0.15s ease-in-out;
    position: relative;
}

.layout_full p.info {
    font-weight: 700;
}

.layout_full figure{
    position: relative;
    left: -20px;
    display: block;
    width: calc(100% + 40px);
    margin-bottom: 20px;
}

.layout_full figure img {
    object-fit: cover;
    position: relative;
    display: block;
    width: calc(100% + 40px);
    max-height:50svh;
    border-radius: 30px;
}

.layout_full p img{
    object-fit: cover;
    position: relative;
    display: block;
    width: 100%;
    border-radius: 30px;
}

.layout_full .enclosure{
    display: block;
    padding: 0;
}

.layout_full .enclosure li{
    display: block;
}

.layout_full .more{
    margin-top: 50px;
    margin-bottom: 0px;
}

.layout_full .more a {
    font-size: 48px;
    color: var(--gray-dark-shade);
    transition: all 0.15s ease-in-out;
    text-decoration: none;
}

.layout_full .more a:hover{
    color: var(--secondary-color);
}

p.back{
    display: none;
}

/* Timeline */

.content-text.timeline {
    display: flex;
    justify-content: space-evenly;
    margin-bottom: 0px !important;
}

.content-text.timeline .rte, .content-text.timeline h1 {
    flex: 1 1 0;
}

.content-text.timeline h1 {
    position: relative;
    text-align: right;
    padding: 80px 40px 80px 0px;
    color: var(--secondary-color);
}

.content-text.timeline h1::after{
    content: "";
    position: absolute;
    top:102px;
    right:-6px;
    width: 10px;
    height: 10px;
    background-color: var(--secondary-color);
    border-radius: 10px;
}

.content-text.timeline:nth-child(odd) h1 {
    order: 1;
    text-align: left;
    padding: 80px 0px 80px 40px;
}

.content-text.timeline:nth-child(odd) h1::after{
    right:auto;
    left:-6px;
}

.content-text.timeline .rte {
    border-left: 1px solid var(--gray-dark-shade);
    padding: 90px 0 90px 40px;
}

.content-text.timeline:nth-child(odd) .rte {
    border-left: none;
    border-right: 1px solid var(--gray-dark-shade);
    padding: 80px 40px 80px 0px;
    text-align: right;
}

.content-text.timeline:last-child{
    margin-bottom: 80px;
}

/* Footer */

footer{
    width: 100%;
}

footer .inside{
    display: flex;
    justify-content: space-between;
    max-width: 1320px;
    margin: 0 auto;
}

footer nav ul {
    display: flex;
    padding: 0;
    margin: 0;
}

footer nav ul li {
    display: inline-block;
}

footer nav ul a, footer nav ul strong {
    display: block;
    padding: 30px 20px;
    color: var(--gray-dark-shade);
}

footer .socials a {
    display: inline-block;
    padding: 30px 20px;
    color: var(--gray-dark-shade);
}

footer .socials a:hover{
    color:var(--secondary-color);
}

/* Animated Objects */

.animated-object {
    transition: transform 1s ease-in-out;
}
@media (max-width: 1024px) {

    h1{
        font-size: 30px;
    }
    
    h2{
        font-size: 26px;
    }
    
    h3{
        font-size: 20px;
    }

    /* Header */

    header {
        left: 0;
        top: 0;
        display: block;
    }

    header .inside {
        margin: 0;
    }

    header nav {
        position: fixed;
        left: 0;
        top: calc(-100vh - 100px);
        width: 100vw;
        height: 100vh;
        background-color: rgba(250,250,249,.95);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 100;
        transition: top 1s cubic-bezier(0.25, 1, 0.25, 1);
        padding-bottom: env(safe-area-inset-bottom);
    }

    #logo {
        position: relative;
        z-index: 150;
    }

    #hamburger {
        z-index: 150;
        display: block;
        position: absolute;
        padding: 27px 20px;
        width: 30px;
        height: 30px;
        right: 0px;
        top: 0px;
        cursor: pointer;
    }

    #hamburger span {
        display: block;
        position: relative;
        background-color: black;
        width: 100%;
        height: 2px;
        border-radius: 5px;
        transition: transform 0.25s cubic-bezier(0.2, 1.75, 0.5, 1);
    }

    #hamburger span:first-child{
        top: 11px;
        left: 0px;
    }

    #hamburger span:last-child{
        top:17px;
        left:0px;
    }

    #hamburger.show span:first-child{
        top: 14px;
        left: 0px;
        transform: rotate(45deg);
    }

    #hamburger.show span:last-child{
        top:12px;
        left:0px;
        transform: rotate(-45deg);
    }

    #hamburger.show + nav {
        top: 0%;
    }

    .mod_navigation ul {
        padding: 0;
        margin: 0;
    }

    .mod_navigation ul li {
        display: block;
        text-align: center;
        font-size: 28px;
    }

    .mod_navigation ul li a, .mod_navigation ul li .active {
        padding: 15px;
    }

    .mod_navigation a::after {
        bottom: 9px;
        height: 3px;
    }

    /* Buttons */

    .primary-button, .secondary-button {
        display: block;
        text-align: center;
    }

    .primary-button + .secondary-button, .secondary-button + .primary-button, .primary-button + .primary-button, .secondary-button + .secondary-button {
        margin-left: 0;
        margin-top: 10px;
    }

    /* Hero */

    #hero {
        flex-direction: column-reverse;
        gap: 20px;
        margin-bottom: 80px;
    }

    #hero h1, #bottom h1 {
        font-size: 60px;
        line-height: 1em;
    }

    #hero > .content-image figure {
        height: 100%;
    }

    #hero > figure > img {
        max-height: 50vh;
    }

    #hero > div.center p, #bottom > div.center p {
        width: 100%;
    }

    #hero > div.center p.stoerer,
#bottom > div.center p.stoerer {
    transform: rotate(10deg);
}

#hero > div.center p.stoerer:nth-child(1),
#bottom > div.center p.stoerer:nth-child(1) {
    transform: rotate(-10deg);
}

    #bottom {
        height: auto;
        width: auto;
    }

    #bottom > div.background {
        position: relative;
    }

    #bottom > .content-image {
        height: auto;
    }

    #bottom > .content-image figure {
        height: auto;
    }

    #bottom > .content-image img {
        height: auto;
        position: relative;
    }

    /* Newslist */

    .mod_newslist {
        margin-bottom: 80px;
    }

    .mod_newslist .articles {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: 20px;
    }

    .layout_full {
        margin-bottom: 30px;
    }

    .layout_full figure {
        width: calc(100% + 20px);
        left: -10px;
    }

    .layout_full .more {
        text-align: center;
    }

    /* Content */

    .mod_article:first-of-type:not(#hero, #bottom) {
        padding-top: 20px;
    }

    .mod_article:first-of-type:not(#hero, #bottom) > .content-text:first-of-type:not(.media) .rte {
        padding-top: 80px;
    }

    .content-text:not(#hero .content-text, #bottom .content-text, .section) {
        margin-bottom: 80px;
    }

    .content-text.media,
    .content-text.media.media--right {
        flex-direction: column;
        gap: 20px;
    }

    .content-text.media > figure, .content-text.media > div {
        width: 100%;
    }

    .section {
        padding: 80px 20px 80px 20px;
        width: 100%;
        margin-bottom: 80px;
    }

    /* Timeline */

    .content-text.timeline {
        flex-direction: column;
        align-items: start;
        padding-bottom: 40px;
        padding-left: 20px;
        border-left: 1px solid #d6d3d1;
    }

    .content-text.timeline .rte, .content-text.timeline h1{
        padding: 0;
        text-align: left;
        border: none;
        margin:0;
    }

    .content-text.timeline h1::after, .content-text.timeline:nth-child(odd) h1::after{
        top:16px;
        left:-25px;
    }

    .content-text.timeline:nth-child(odd) h1 {
        padding: 0;
        text-align: left;
        border: none;
        order: 0;
    }

    .content-text.timeline:nth-child(odd) .rte{
        padding: 0;
        text-align: left;
        border: none;
    }

    .content-text.timeline:first-child{
        padding-top: 40px;
    }

    .content-text.timeline:last-child {
        padding-bottom: 0px;
        margin-bottom: 30px;
    }

    /* Footer */
    footer .inside {
        flex-direction: column;
        align-items: center;
        margin-bottom: 40px;
        margin-top: 40px;
    }

    footer nav ul a, footer nav ul strong, footer .socials a {
        padding: 15px 10px;
    }

}