.hide-text{width:0;height:0;overflow:hidden;display:block}
.clearfix:after{content:"";display:table;clear:both}
.component.teaser{display:block}
.component.teaser .hero{min-height:200px;position:relative}
.component.teaser .hero img{height:100%}
.component.teaser .content{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.component.teaser:not(.color) .content{padding-bottom:32px}
.component.teaser .element.background{padding:0 !important;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}
.component.teaser .element.background .content{padding:24px}
.component.teaser .flexible:not(.component.teaser .element.background .flexible){padding-top:24px}
.component.teaser .component.headline+.component.rte{margin-top:16px}
.component.teaser .component.image{height:100%}
.component.teaser .links{margin-top:24px;display:-webkit-flex;display:-ms-flexbox;display:-ms-flex;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:flex-start;-ms-align-items:flex-start;align-items:flex-start}
.component.teaser .links:after{content:"";display:table;clear:both}
.component.teaser .links a{float:left;clear:left;position:relative;word-break:break-word;padding-left:14px}
.component.teaser .links a+a{margin-top:6px}
@media screen and (min-width:37.5em){.component.teaser .content{display:-webkit-flex;display:-ms-flexbox;display:-ms-flex;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}
.component.teaser.color .content .flexible{-webkit-flex:1;-ms-flex:1;flex:1}
.component.teaser .element.background{display:-webkit-flex;display:-ms-flexbox;display:-ms-flex;display:flex}
.component.teaser .content{-webkit-flex-grow:1;-ms-flex-grow:1;flex-grow:1}
.component.teaser.block-a .background,.component.teaser.block-b .background{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}
.component.teaser.block-a .content:not(.component.teaser.block-b .content),.component.teaser.block-b .content:not(.component.teaser.block-b .content){padding:40px !important}
.component.teaser.block-a .hero,.component.teaser.block-b .hero,.component.teaser.block-a .content,.component.teaser.block-b .content{-webkit-flex:1 0 50%;-ms-flex:1 0 50%;flex:1 0 50%}
.component.teaser.block-a .hero,.component.teaser.block-b .hero{height:auto;min-height:350px;max-height:600px}
.component.teaser.block-a .hero.right-image,.component.teaser.block-b .hero.right-image{-webkit-order:1;-ms-order:1;order:1}
.component.teaser.block-a h2,.component.teaser.block-b h2{font-size:1.875rem;line-height:2.25rem}
.component.teaser.block-b,.component.teaser.block-c,.component.teaser.block-d{height:100%}
}
@media screen and (min-width:56.5625em){.component.teaser.block-d .hero{height:200px}
.component.teaser.block-b .hero,.component.teaser.block-c .hero{min-height:270px}
.component.teaser .block-b .component.teaser .hero+.content{height:calc(100% - 270px)}
.component.teaser .block-c .component.teaser .hero+.content{height:calc(100% - 200px)}
.component.teaser .block-d .component.teaser .hero+.content{height:calc(100% - 200px)}
.component.teaser.wide .hero{height:450px}
.component.teaser.wide .block-b .component.teaser .hero+.content{height:calc(100% - 300px)}
.component.teaser.wide .block-c .component.teaser .hero+.content{height:calc(100% - 270px)}
.component.teaser.wide .block-d .component.teaser .hero+.content{height:calc(100% - 200px)}
.component.teaser.wide .block-b .component.teaser .hero{height:300px}
.component.teaser.wide .block-c .component.teaser .hero{height:270px}
.component.teaser.wide .block-d .component.teaser .hero{height:200px}
.component.teaser .content .component{height:auto}
}